@ -40,18 +40,51 @@
/* Partner event ribbon */
/* Partner event ribbon */
. partner-event-ribbon {
. partner-event-ribbon {
position : absolute ;
position : absolute ;
top : 1 0px;
top : 3 0px;
right : 1 0px;
right : -2 0px;
background : linear-gradient ( 135deg , # ff9800 , # ff5722 ) ;
background : linear-gradient ( 135deg , rgba ( 132 , 0 , 75 , 0 . 6 ) , # 84004b ) ;
color : white ;
color : white ;
padding : 0 . 3rem 1rem ;
padding : 0 . 3rem 0 ;
font-size : 0 . 8rem ;
font-size : 0 . 8rem ;
font-weight : var ( --font-weight-medium ) ;
font-weight : var ( --font-weight-medium ) ;
box-shadow : 0 2px 5px rgba ( 0 , 0 , 0 , 0 . 2 ) ;
box-shadow : 0 2px 5px rgba ( 0 , 0 , 0 , 0 . 2 ) ;
z-index : 10 ;
z-index : 10 ;
border-radius : 3px ;
transform : rotate ( 45deg ) ;
text-transform : uppercase ;
text-transform : uppercase ;
letter-spacing : 0 . 5px ;
letter-spacing : 0 . 5px ;
width : 160px ;
text-align : center ;
overflow : hidden ;
clip-path : polygon ( 20px 0 , 100 % 0 , 100 % calc ( 100 % - 20px ) , calc ( 100 % - 20px ) 100 % , 0 100 % , 0 20px ) ;
}
/* Partner event card left border */
. timeline-panel . partner-event-card {
border : none ;
border-left : 4px solid # 84004b ;
transition : all 0 . 3s ease ;
}
. partner-event-ribbon :: before {
content : '' ;
position : absolute ;
top : 0 ;
left : 0 ;
width : 25px ;
height : 25px ;
background : linear-gradient ( 90deg , rgba ( 0 , 0 , 0 , 0 ) , rgba ( 0 , 0 , 0 , 0 . 15 ) ) ;
clip-path : polygon ( 0 0 , 100 % 0 , 0 100 % ) ;
}
. partner-event-ribbon :: after {
content : '' ;
position : absolute ;
bottom : 0 ;
right : 0 ;
width : 20px ;
height : 20px ;
background : rgba ( 0 , 0 , 0 , 0 . 15 ) ;
clip-path : polygon ( 0 0 , 100 % 0 , 0 100 % ) ;
}
}
. event-item : hover {
. event-item : hover {