/* ------------------------------------ */
/* ## TEMP HIGHLIGHT ## */

.timeline { position: relative; height: 180px; background-color: #5e171b; overflow: hidden; }

.timeline-bg { transition: all 10s linear 0s; position: absolute; width: 100%; height: 100%; opacity: .3; background-color: #5e171b; background-repeat: no-repeat; background-position: center center; background-size: cover; background-blend-mode: hard-light; filter: contrast(1.2); }

.timeline-bg:hover { transform: scale(1.24); }

.timeline-control { position: absolute; top: 10px; left: 10px; z-index: 5; }

.timeline-arrow { display: block; float: left; width: 30px; height: 30px; border: 1px solid white; padding-top: 4px; text-align: center; margin: 2px; color: #ffffff !important; transition-property: all; }

.timeline-arrow:hover { background-color: #ffffff; color: #000000 !important; }

.timeline-arrow-desable { border-color: #a7a7a7 !important; color: #a7a7a7 !important; cursor: default; }

.timeline-arrow-desable:hover { color: #a7a7a7 !important; background-color: transparent !important; }

.timeline-date { color: #ffffff; font-size: 25px; font-weight: 400; display: block; float: left; margin-left: 3px; pointer-events: none; }

.timeline-bg-link { display: block; width: 100%; height: 100%; }

.timeline-header { position: absolute; bottom: 40px; left: 25px; z-index: 5; pointer-events: none; }

.timeline-header h3 { text-shadow: 1px 1px 2px #000; }

.timeline-footer { position: absolute; z-index: 5; left: 25px; bottom: 10px; pointer-events: none; }

#timeline1, #timeline2 { position: absolute; height: 100%; width: 100%; overflow: hidden; left: 0; }

.timeline-animate { transition: all 1s ease-in-out; }

.timeline-show {  }

.timeline-left {  }

.timeline-right {  }