@charset "utf-8";
/* CSS Document */

#section_timeline { width:100%; display:block; overflow:hidden; padding:40px 60px 40px 60px; scroll-margin-block-start:60px; }

.timeline_container { width:100%; max-width:100%; display:block; overflow:hidden; margin:0px; padding:30px 20px 20px 20px; }

@media screen and (max-width:768px) { 
  #section_timeline { padding:5px 10px 20px 10px; }
  .timeline_container { padding:30px 0px 20px 0px; } 
}

.tl_row { display:flex; justify-content:start; direction:rtl; overflow:hidden; margin:0px auto; padding:0px; border:0px solid grey; max-width:650px; }
.tl_row div { border:0px solid grey; }
.tl_row .tl-item-full { width:45%; padding:0px 0px 0px 0px; text-align:right; direction:ltr; }
.tl_row .tl-item-center { width:10%; position:relative; border:0px solid green; }
.tl_row .tl-item-empty { width:45%; }

.tl_row .tl-item-full p { margin:0px; padding:3px 0px 7px 0px; font-size:16px; line-height:20px; font-family:'Gilroy-Regular'; }
.tl_row .tl-item-full h3 { margin:0px; padding:14px 0px 3px 0px; font-size:14px; line-height:22px; font-weight:900; letter-spacing:0.05rem; text-transform:uppercase; font-family:'Gilroy-Medium'; }

.tl_row .tl-item-center::before { content:''; position:absolute; left:50%; top:0px; bottom:0px; width:3px; background-color:var(--color-timeline-light); opacity:0.4; }
.tl_row .tl-item-center::after { content:attr(data-title); color:White; font-size:15px; line-height:24px; text-align:center; position:absolute; left:50%; top:10px; width:28px; height:28px; background-color:var(--color-timeline); border-radius:50%; transform:translateX(-45%); border:2px solid White; outline:2px solid var(--color-timeline); box-shadow:0px 0px 0px 10px rgba(255,255,255, 1); font-family:'Gilroy-bold'; }

.tl-row-reverse { direction:ltr; }
.tl-row-reverse .tl-item-full { text-align:left; }

@media screen and (max-width:600px) { 
.tl_row { direction: ltr; } 
.tl_row .tl-item-empty { display:none; }
.tl_row .tl-item-full { width:90%; text-align:left; }

.tl_row .tl-item-full p { padding:3px 0px 7px 5px; }
.tl_row .tl-item-full h3 { padding:13px 0px 3px 5px; }
}