.box{display:flex;align-items:center;justify-content:center;color:#fff;font-family:Raleway;font-size:2.5rem}.gradient-border{--borderWidth:1.8px;position:relative;border-radius:16px;padding:var(--borderWidth)}.gradient-border:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(60deg,#f79533,#e100ff,#e90202,#a166ab,#5073b8,#1098ad,#07b39b,#6fba82);z-index:-1;border-radius:inherit;padding:var(--borderWidth);animation:animatedgradient 3s ease infinite alternate;background-size:300% 300%;box-sizing:border-box}@keyframes animatedgradient{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}.timeline{position:relative;max-width:1200px;margin:100px 0;color:#000;background-color:transparent;padding:20px 0}.container{padding:10px 50px;position:relative;width:50%;box-sizing:border-box;animation:movedown 3s linear forwards;opacity:0}@keyframes movedown{0%{opacity:1;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}.text-box{padding:20px 50px;background-color:#fff;position:relative;border-radius:6px;font-size:15px;box-shadow:0 0 10px rgba(0,0,0,.1)}.left-container{left:0}.right-container{left:50%}.imgContainer{position:absolute;width:40px;height:40px;border-radius:50%;right:-20px;top:32px;z-index:10;background-color:#adff2f;display:flex;align-items:center;justify-content:center}.right-container .imgContainer{left:-20px;right:auto}.timeline:after{content:"";position:absolute;width:4px;background:#f5f5f5;top:0;left:50%;transform:translateX(-50%);z-index:-1;height:0;transition:height 2s linear}.timeline.active:after{height:100%}.left-container-arrow{border-left:15px solid #fff;right:-15px}.left-container-arrow,.right-container-arrow{height:0;width:0;position:absolute;top:28px;z-index:1;border-top:15px solid transparent;border-bottom:15px solid transparent}.right-container-arrow{border-right:15px solid #fff;left:-15px}@media screen and (max-width:600px){.timeline{margin:80px auto}.timeline:after{left:31px}.container{width:100%;padding-left:80px;padding-right:25px;position:relative;box-sizing:border-box}.text-box{font-size:13px;width:20rem}.text-box small{margin-bottom:10px}.right-container{left:0}.left-container>.imgContainer,.right-container>.imgContainer{left:10px}.left-container-arrow,.right-container-arrow{border-right:15px solid #fff;border-left:0;left:-15px}}@media screen and (max-width:400px){.text-box{width:14rem}}