.uk-dotnav > * {
opacity: 1!important;
padding: 0 5px!important;
flex: none;
padding-left: 12px;
-webkit-transform: none!important;
-moz-transform: none!important;
-ms-transform: none!important;
-o-transform: none!important;
transform: none!important;
top: 0!important;
position: relative!important;
width: initial!important;
}
.selected .uk-slidenav { 
color: var(--sea7)!important; 
margin-top: -30px!important; 
}
.selected .uk-slidenav svg polyline { 
stroke-width: 2;
stroke-linecap: "round";
}
.time-headline {
margin-top: 20px!important;
}
.time-description {
color: #757575;
}
.cd-horizontal-timeline {
opacity: 0;
margin: 2em auto;
-webkit-transition: opacity 0.2s;
-moz-transition: opacity 0.2s;
transition: opacity 0.2s;
}
.cd-horizontal-timeline::before { content: 'mobile';
display: none;
}
.cd-horizontal-timeline.loaded { opacity: 1;
}
.cd-horizontal-timeline .timeline {
position: relative;
height: 100px;
width: 100%;
max-width: 1200px;
margin: 0 auto;
}
.cd-timeline-navigation, .cd-horizontal-timeline .events-content ol { 
list-style: none; 
}
.cd-horizontal-timeline .events-wrapper {
position: relative;
height: 100%;
margin: 0 40px;
overflow: hidden;
display: flex; justify-content: center;
align-items: center;
}
.cd-horizontal-timeline .events {
position: relative;
z-index: 1;
height: 2px;
width: 100%;
background: #575757;
display: flex; justify-content: space-between; align-items: center;
padding: 0;
}
.cd-horizontal-timeline .events a {
position: relative;
bottom: 20px;
padding-bottom: 10px;
text-align: center;
font-size: 1.8rem;
color: #575757;
text-decoration: none;
display: inline-block;
white-space: nowrap; }
.cd-horizontal-timeline .events a::after {
content: '';
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: -10px;
height: 12px;
width: 12px;
border-radius: 50%;
border: 2px solid #575757;
background-color: #f8f8f8;
transition: background-color 0.3s, border-color 0.3s;
} .cd-horizontal-timeline .events a.selected {
color: #00B4A6;
font-weight: bold;
}
.cd-horizontal-timeline .events a.selected::after {
background-color: #00B4A6;
border-color: #00B4A6;
} .cd-horizontal-timeline .events a.older-event::after {
border-color: #00B4A6;
} .cd-horizontal-timeline .events li {
flex: 1; text-align: center;
list-style: none;
}
.cd-horizontal-timeline .events-wrapper::after, .cd-horizontal-timeline .events-wrapper::before { content: '';
position: absolute;
z-index: 2;
top: 0;
height: 100%;
width: 20px;
}
.cd-horizontal-timeline .events-wrapper::before {
left: 0;
background-image: -webkit-linear-gradient( left , #fefefe, rgba(248, 248, 248, 0));
background-image: linear-gradient(to right, #fefefe, rgba(248, 248, 248, 0));
}
.cd-horizontal-timeline .events-wrapper::after {
right: 0;
background-image: -webkit-linear-gradient( right , #fefefe, rgba(248, 248, 248, 0));
background-image: linear-gradient(to left, #fefefe, rgba(248, 248, 248, 0));
}
.cd-horizontal-timeline .filling-line {
position: absolute;
z-index: 1;
left: 0;
top: 0;
height: 100%;
width: 100%;
background-color: #00B4A6;
-webkit-transform: scaleX(0);
-moz-transform: scaleX(0);
-ms-transform: scaleX(0);
-o-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: left center;
-moz-transform-origin: left center;
-ms-transform-origin: left center;
-o-transform-origin: left center;
transform-origin: left center;
-webkit-transition: -webkit-transform 0.3s;
-moz-transition: -moz-transform 0.3s;
transition: transform 0.3s;
}
.cd-horizontal-timeline .events a:hover {
text-decoration: none;
color: #00B4A6;
}
.no-touch .cd-horizontal-timeline .events a:hover::after {
background-color: #00B4A6;
border-color: #00B4A6;
}
@media only screen and (min-width: 1100px) {
.cd-horizontal-timeline {
margin: 3em auto;
}
.cd-horizontal-timeline::before { content: 'desktop';
}
}
.cd-timeline-navigation a { position: absolute;
z-index: 1;
top: 50%;
bottom: auto;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
height: 34px;
width: 34px;
border-radius: 50%;
border: 2px solid #575757; overflow: hidden;
color: transparent;
text-indent: 100%;
white-space: nowrap;
-webkit-transition: border-color 0.3s;
-moz-transition: border-color 0.3s;
transition: border-color 0.3s;
}
.cd-timeline-navigation a::after { content: '';
position: absolute;
height: 33px;
width: 22px;
left: 64%;
top: 59%;
bottom: auto;
right: auto;
opacity: 0.7;
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-o-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
background: url(//www.hillsdalereimagined.com/wp-content/plugins/atk-blocks/images/icon-chevron-right.png) no-repeat 0 0;
background-size: 16px 26px;
}
.cd-timeline-navigation a.prev {
left: 0;
-webkit-transform: translateY(-50%) rotate(180deg);
-moz-transform: translateY(-50%) rotate(180deg);
-ms-transform: translateY(-50%) rotate(180deg);
-o-transform: translateY(-50%) rotate(180deg);
transform: translateY(-50%) rotate(180deg);
}
.cd-timeline-navigation a.next {
right: 0;
}
.no-touch .cd-timeline-navigation a:hover {
border-color: #00B4A6;
}
.cd-timeline-navigation a.inactive {
cursor: not-allowed;
}
.cd-timeline-navigation a.inactive::after {
background-position: 0 -26px;
}
.no-touch .cd-timeline-navigation a.inactive:hover {
border-color: #dfdfdf;
}
.cd-horizontal-timeline .events-content {
position: relative;
width: 66%;
margin: 2em auto;
-webkit-transition: height 0.4s;
-moz-transition: height 0.4s;
transition: height 0.4s;
}
.cd-horizontal-timeline .events-content li {
position: absolute;
z-index: 1;
width: 100%;
left: 0;
top: 0;
-webkit-transform: translateX(-100%);
-moz-transform: translateX(-100%);
-ms-transform: translateX(-100%);
-o-transform: translateX(-100%);
transform: translateX(-100%);
padding: 0 5%;
opacity: 0;
-webkit-animation-duration: 0.4s;
-moz-animation-duration: 0.4s;
animation-duration: 0.4s;
-webkit-animation-timing-function: ease-in-out;
-moz-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
.cd-horizontal-timeline .events-content li.selected { position: relative;
z-index: 2;
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
.cd-horizontal-timeline .events-content li.enter-right, .cd-horizontal-timeline .events-content li.leave-right {
-webkit-animation-name: cd-enter-right;
-moz-animation-name: cd-enter-right;
animation-name: cd-enter-right;
}
.cd-horizontal-timeline .events-content li.enter-left, .cd-horizontal-timeline .events-content li.leave-left {
-webkit-animation-name: cd-enter-left;
-moz-animation-name: cd-enter-left;
animation-name: cd-enter-left;
}
.cd-horizontal-timeline .events-content li.leave-right, .cd-horizontal-timeline .events-content li.leave-left {
-webkit-animation-direction: reverse;
-moz-animation-direction: reverse;
animation-direction: reverse;
}
.cd-horizontal-timeline .events-content li > * {
max-width: 1000px;
margin: 0 auto;
}
.cd-horizontal-timeline .events-content h2 {
font-weight: bold;
font-size: 2.6rem;
font-weight: 700;
line-height: 1.2;
}
.cd-horizontal-timeline .events-content em {
display: block;
font-style: italic;
margin: 10px auto;
}
.cd-horizontal-timeline .events-content em::before {
content: '- ';
}
.cd-horizontal-timeline .events-content p {
font-size: 1.4rem;
}
.cd-horizontal-timeline .events-content em, .cd-horizontal-timeline .events-content p {
line-height: 1.6;
}
@media only screen and (min-width: 768px) {
.cd-horizontal-timeline .events-content h2 {
font-size: 7rem;
}
.cd-horizontal-timeline .events-content em {
font-size: 2rem;
}
.cd-horizontal-timeline .events-content p {
font-size: 1.6rem;
color: #3D3D3D;
}
}
@-webkit-keyframes cd-enter-right {
0% {
opacity: 0;
-webkit-transform: translateX(100%);
}
100% {
opacity: 1;
-webkit-transform: translateX(0%);
}
}
@-moz-keyframes cd-enter-right {
0% {
opacity: 0;
-moz-transform: translateX(100%);
}
100% {
opacity: 1;
-moz-transform: translateX(0%);
}
}
@keyframes cd-enter-right {
0% {
opacity: 0;
-webkit-transform: translateX(100%);
-moz-transform: translateX(100%);
-ms-transform: translateX(100%);
-o-transform: translateX(100%);
transform: translateX(100%);
}
100% {
opacity: 1;
-webkit-transform: translateX(0%);
-moz-transform: translateX(0%);
-ms-transform: translateX(0%);
-o-transform: translateX(0%);
transform: translateX(0%);
}
}
@-webkit-keyframes cd-enter-left {
0% {
opacity: 0;
-webkit-transform: translateX(-100%);
}
100% {
opacity: 1;
-webkit-transform: translateX(0%);
}
}
@-moz-keyframes cd-enter-left {
0% {
opacity: 0;
-moz-transform: translateX(-100%);
}
100% {
opacity: 1;
-moz-transform: translateX(0%);
}
}
@keyframes cd-enter-left {
0% {
opacity: 0;
-webkit-transform: translateX(-100%);
-moz-transform: translateX(-100%);
-ms-transform: translateX(-100%);
-o-transform: translateX(-100%);
transform: translateX(-100%);
}
100% {
opacity: 1;
-webkit-transform: translateX(0%);
-moz-transform: translateX(0%);
-ms-transform: translateX(0%);
-o-transform: translateX(0%);
transform: translateX(0%);
}
} @media screen and (max-width : 680px) {
.cd-horizontal-timeline .events {background: none; height: inherit; }
.cd-horizontal-timeline .events li::before { content: ''; height: 2px; background: #575757; width: 100%; position: absolute; top: 50%; }
.cd-horizontal-timeline .events-wrapper::after { right: none; background-image: none; }
.cd-horizontal-timeline .events li::first-child { margin-left: 8px; }
}