.timeline{position:relative;padding:2rem 0}.timeline:before{content:"";position:absolute;left:50%;top:0;width:2px;height:100%;background:black;transform:translateX(-50%)}.timeline-progress{position:fixed;left:2rem;top:0;width:4px;height:100vh;background:rgba(0,0,0,.1);z-index:50}.timeline-progress-bar{width:100%;height:0;background:black;transition:height .2s linear}.timeline-item{position:relative;margin-bottom:4rem;padding-top:1rem}.timeline-dot,.timeline-dot.sliding-dot{position:absolute;width:24px;height:24px;background:black;border:4px solid white;border-radius:50%;left:50%;z-index:10;animation:pulse 2.5s ease-in-out infinite}@keyframes pulse{0%,to{transform:translateX(-50%) scale(1);box-shadow:0 0 6px rgba(0,0,0,.3),inset 0 0 4px rgba(255,255,255,.2)}50%{transform:translateX(-50%) scale(1.1);box-shadow:0 0 12px rgba(0,0,0,.6),inset 0 0 6px rgba(255,255,255,.3)}}.timeline-content{width:45%;padding:2rem;border:2px solid black;background:white;position:relative;opacity:0;transform:translateY(40px);transition:all .6s ease-out}.timeline-item.visible .timeline-content{opacity:1;transform:translateY(0)}.timeline-content:after{content:"";position:absolute;top:2rem;width:0;height:0;border:10px solid transparent}.timeline-item:nth-child(odd) .timeline-content{margin-left:auto}.timeline-item:nth-child(odd) .timeline-content:after{left:-20px;border-right-color:black}.timeline-item:nth-child(2n) .timeline-content{margin-right:auto}.timeline-item:nth-child(2n) .timeline-content:after{right:-20px;border-left-color:black}.timeline-step{position:absolute;width:48px;height:48px;background:black;color:white;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.125rem;font-weight:300;top:-12px}.timeline-item:nth-child(odd) .timeline-step{right:-12px}.timeline-item:nth-child(2n) .timeline-step{left:-12px}.timeline-end-marker{position:relative;height:2rem}.timeline-end-marker>div{position:absolute;left:50%;transform:translateX(-50%);top:0}@media (max-width:900px){.timeline-dot,.timeline-dot.sliding-dot{left:50%!important;transform:translateX(-50%)!important}.timeline-content{width:90%!important;margin-left:auto!important;margin-right:auto!important;margin-bottom:2.5rem!important}.timeline-content:after{display:none!important}.timeline-step{right:-12px!important;left:auto!important}.timeline-progress{left:auto;right:1rem}}