.timeline{display:flex;flex-direction:column;justify-content:center;align-items:center;background:#eee;box-shadow:4px 4px 4px #d3d3d3;padding:1em 3em 1em 1em}.timeline .timeline-input-flex-container{display:flex;justify-content:space-around;align-items:center;flex-wrap:wrap;width:100%;position:relative;z-index:0;margin-left:calc((80vw - 25px) / 20 - 20px);padding-top:8em}.timeline input{width:25px;height:25px;background-color:#2C3E50;position:relative;border-radius:50%;display:block;-moz-appearance:none;-webkit-appearance:none;appearance:none;cursor:pointer}.timeline input:focus{outline:none}.timeline input::before,.timeline input::after{content:"";display:block;position:absolute;z-index:-1;top:50%;transform:translateY(-50%);background-color:#2C3E50;width:4vw;height:5px;max-width:50px}.timeline input::before{left:calc(-4vw + 12.5px)}.timeline input::after{right:calc(-4vw + 12.5px)}.timeline input:checked{background-color:#2C3E50}.timeline input:checked::before{background-color:#2C3E50}.timeline input:checked::after{background-color:#AEB6BF}.timeline input:checked ~ input,.timeline input:checked ~ input::before,.timeline input:checked ~ input::after{background-color:#AEB6BF}.timeline input:checked+.timeline-dot-info span{font-size:13px;font-weight:bold}.timeline .timeline-dot-info{width:25px;height:25px;display:block;visibility:hidden;position:relative;z-index:-1;left:calc((((80vw - 25px) / 20) * -1) - 1px)}.timeline .timeline-dot-info span{visibility:visible;position:absolute;font-size:12px}.timeline .timeline-dot-info span.year{bottom:-30px;left:calc(50% + 20px);transform:translateX(calc(-50% - 20px))}.timeline .timeline-dot-info span.label{top:-6.5em;transform:rotateZ(-60deg);width:10em;text-indent:-10px;white-space:nowrap}.timeline .timeline-descriptions-wrapper{width:100%;margin-top:40px;margin-left:calc((-80vw - 25px) / 20)}.timeline .timeline-descriptions-wrapper p{margin-top:0;display:none;text-align:center}@media (min-width: 1250px){.timeline .timeline-input-flex-container{margin-left:62.5px}.timeline input::before{left:-37.5px}.timeline input::after{right:-37.5px}.timeline .timeline-dot-info{left:calc((((1000px - 25px) / 20) * -1) - 1px)}.timeline .timeline-descriptions-wrapper{margin-left:-37.5px}}@media (max-width: 879px){.timeline{justify-content:initial}.timeline .timeline-input-flex-container{flex-wrap:wrap;justify-content:center;width:400px;height:auto;margin-top:15vh;margin-left:0;padding-bottom:30px}.timeline input,.timeline-dot-info{width:60px;height:60px;margin:0 10px 50px}.timeline input{background-color:transparent !important;z-index:1}.timeline input::before,.timeline input::after{content:none}.timeline input:checked+.timeline-dot-info{background-color:#2C3E50}.timeline input:checked+.timeline-dot-info span.year{font-size:14px}.timeline input:checked+.timeline-dot-info span.label{font-size:12px}.timeline .timeline-dot-info{visibility:visible;border-radius:50%;z-index:0;left:0;margin-left:-70px;background-color:#AEB6BF}.timeline .timeline-dot-info span.year{top:0;left:0;transform:none;width:100%;height:100%;display:flex;justify-content:center;align-items:center;color:#ECF0F1}.timeline .timeline-dot-info span.label{top:calc(100% + 5px);left:50%;transform:translateX(-50%);text-indent:0;text-align:center}.timeline .timeline-descriptions-wrapper{margin-top:30px;margin-left:0;text-align:center}}@media (max-width: 480px){.timeline .timeline-input-flex-container{width:340px}}@media (max-width: 400px){.timeline .timeline-input-flex-container{width:300px}}