#info-timeline-page {}
#info-timeline-top {position:relative;display:block;margin:0;border:0;padding:0;padding-top:50px;padding-bottom:50px;background:#090c11;text-align:center;overflow:hidden;background:transparent url("/images/timeline/head-txtr.jpg") center center;background-position:center center;background-size:100% auto;background-repeat:no-repeat;}
.happy #info-timeline-top {box-shadow:0px 0px 10px #6f6f6f;}
#info-timeline-img-wrap {z-index:1;position:relative;margin:0 auto;border:0;padding:0;width:100%;min-height:360px;overflow:hidden;display:flex;align-content:center;justify-content:center;align-items:center;}
#info-timeline-img-wrap img {width:100%;height:auto;max-width:539px;margin-top:70px;}
@media (max-width:1260px) {#info-timeline-top {background-size:1260px auto;}}
#info-timeline-top canvas {width:100%;display:block;vertical-align:bottom;height:100%;position:absolute;top:0;width:100%;height:100%;}
#info-timeline-page h1 {text-align:center;margin-bottom:50px;font-size:3em;}
#timeline {position:relative;padding:40px 0 1px 0;}
#timeline .chevron {position:absolute;left:50.02%;left:calc(50% + 1px);top:0;width:0;color:#8bb8ea;}
#timeline .chevron::before {border-style:solid;border-width:2px 2px 0 0;content:'';display:inline-block;height:20px;left:-10px;position:relative;vertical-align:top;width:20px;top:-22px;transform:rotate(135deg);}
#timeline .terminate {position:absolute;left:50.02%;left:calc(50% + 1px);bottom:0;width:0;color:#8bb8ea;}
#timeline .terminate::before {border-style:solid;border-width:0 0 2px 0;content:'';display:inline-block;height:2px;left:-15px;position:relative;vertical-align:top;width:30px;}
#timeline::before {content:'';display:block;position:absolute;left:50%;top:0;width:0;height:100%;border-left:2px solid #8bb8ea;}
#timeline .moment {display:flex;justify-content:space-between;position:relative;margin:0;margin-bottom:124px;}
#timeline .moment.flip {flex-direction:row-reverse;}
#timeline .moment > * {flex-basis:43%;}
#timeline .moment::before {content:'';display:block;position:absolute;top:24px;left:calc(50% - 24px);width:50px;height:50px;border-radius:25px;border:2px solid #8bb8ea;background:#8bb8ea;transform:scale(0.2);-webkit-transition:all 200ms cubic-bezier(.30, .5, .88, 1.7);-moz-transition:all 200ms cubic-bezier(.30, .5, .88, 1.7);-o-transition:all 200ms cubic-bezier(.30, .5, .88, 1.7);transition:all 200ms cubic-bezier(.30, .5, .88, 1.7);-webkit-transition-timing-function:cubic-bezier(.30, .5, .88, 1.7);-moz-transition-timing-function:cubic-bezier(.30, .5, .88, 1.7);-o-transition-timing-function:cubic-bezier(.30, .5, .88, 1.7);transition-timing-function:cubic-bezier(.30, .5, .88, 1.7);}
#timeline .moment.slim {padding-bottom:110px;margin-bottom:10px;}
#timeline .moment.slim::before {top:8px;left:calc(50% - 15px);width:32px;height:32px;}
#timeline .moment.active::before {transform:scale(1);background:#212d3b;}
#timeline .image {display:block;position:relative;overflow:hidden;padding:16px;transition:transform 0.4s;}
#timeline .image:hover {transition:transform 0.5s;transform:scale(1.1);}
#timeline .image-fit {position:relative;width:100%;height:0;overflow:hidden;padding-bottom:59.1%;border-radius:5px;box-shadow:0px 0px 15px #0000005c;-webkit-transition:all 600ms;-moz-transition:all 600ms;-o-transition:all 600ms;transition:all 600ms;opacity:0.0;left:200px;right:-200px;}
#timeline .image-fit.full {padding-bottom:59.1%;}
#timeline .image-fit.thin {padding-bottom:43.0%;}
#timeline .flip .image-fit {left:-200px;right:200px;}
#timeline .showimage .image-fit {left:0;right:0;opacity:1.0;}
#timeline .image-fit img {position:relative;display:block;width:100%;height:auto;}
#timeline .content {display:block;position:relative;padding:16px;font-size:1.23em;}
#timeline h2 {font-size:2.5em;line-height:1.0em;}
#timeline h2 span {display:block;font-size:21px;}
#timeline .content.note h2 {font-size:21px;margin-bottom:10px;}
#timeline .content.note p {margin:0;}
@media (max-width:575px) {#timeline::before {left:10px;}
#timeline .chevron {left:11px;}
#timeline .terminate {left:11px;}
#timeline .moment, #timeline .moment.flip {flex-direction:column;}
#timeline .moment::before, #timeline .moment.slim::before {top:10px;left:-5px;width:32px;height:32px;}
#timeline .image {padding:0px;}
#timeline .image-fit {padding:10px 40px;}
#timeline .content {padding:10px 40px;}
#timeline .flip .image-fit {left:200px;right:-200px;}
#timeline .showimage .image-fit {left:0;right:0;opacity:1.0;}}
