.cd-horizontal-timeline {
opacity:0;
-webkit-transition:opacity .2s;
-moz-transition:opacity .2s;
transition:opacity .2s;
margin:20px 0;
}

.cd-horizontal-timeline::before {
content:'mobile';
display:none;
}

.cd-horizontal-timeline.loaded {
opacity:1;
}

.cd-horizontal-timeline .timeline {
position:relative;
height:100px;
width:90%;
max-width:800px;
margin:0 auto;
}

.cd-horizontal-timeline .events-wrapper {
position:relative;
height:100%;
overflow:hidden;
margin:0 40px;
}

.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 {
position:absolute;
z-index:1;
left:0;
top:49px;
height:2px;
background:#dfdfdf;
-webkit-transition:0 .4s;
-moz-transition:0 .4s;
transition:transform .4s;
}

.cd-horizontal-timeline .filling-line {
position:absolute;
z-index:1;
left:0;
top:0;
height:100%;
width:100%;
background-color:#7b9d6f;
-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:0 .3s;
-moz-transition:0 .3s;
transition:transform .3s;
}

.cd-horizontal-timeline .events a {
position:absolute;
bottom:0;
z-index:2;
text-align:center;
font-size:1rem;
padding-bottom:15px;
color:#383838;
-webkit-transform:translateZ(0);
-moz-transform:translateZ(0);
-ms-transform:translateZ(0);
-o-transform:translateZ(0);
transform:translateZ(0);
}

.cd-horizontal-timeline .events a::after {
content:'';
position:absolute;
left:50%;
right:auto;
-webkit-transform:translateX(-50%);
-moz-transform:translateX(-50%);
-ms-transform:translateX(-50%);
-o-transform:translateX(-50%);
transform:translateX(-50%);
bottom:-5px;
height:12px;
width:12px;
border-radius:50%;
border:2px solid #dfdfdf;
background-color:#f8f8f8;
-webkit-transition:background-color .3s,border-color .3s;
-moz-transition:background-color .3s,border-color .3s;
transition:background-color .3s,border-color .3s;
}

.cd-horizontal-timeline .events a.selected::after,.no-touch .cd-horizontal-timeline .events a:hover::after {
background-color:#7b9d6f;
border-color:#7b9d6f;
}

.cd-horizontal-timeline .events a.selected {
pointer-events:none;
}

.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 #dfdfdf;
overflow:hidden;
color:transparent;
text-indent:100%;
white-space:nowrap;
-webkit-transition:border-color .3s;
-moz-transition:border-color .3s;
transition:border-color .3s;
}

.cd-timeline-navigation a::after {
content:'';
position:absolute;
height:16px;
width:16px;
left:50%;
top:50%;
bottom:auto;
right:auto;
-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(../../../assets/images/cd-arrow.svg) no-repeat;
}

.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;
}

.cd-timeline-navigation a.inactive {
cursor:not-allowed;
}

.cd-timeline-navigation a.inactive::after {
background-position:0 -16px;
}

.no-touch .cd-timeline-navigation a.inactive:hover {
border-color:#dfdfdf;
}

.cd-horizontal-timeline .events-content {
position:relative;
width:100%;
overflow:hidden;
-webkit-transition:height .4s;
-moz-transition:height .4s;
transition:height .4s;
margin:15px 0;
}
.cd-horizontal-timeline .events-content .media-left{ margin-right: 20px;}
.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%);
opacity:0;
-webkit-animation-duration:.4s;
-moz-animation-duration:.4s;
animation-duration:.4s;
-webkit-animation-timing-function:ease-in-out;
-moz-animation-timing-function:ease-in-out;
animation-timing-function:ease-in-out;
padding:0 5%;
}

.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-left,.cd-horizontal-timeline .events-content li.leave-right {
-webkit-animation-direction:reverse;
-moz-animation-direction:reverse;
animation-direction:reverse;
}

.cd-horizontal-timeline .events-content li>* {
max-width:800px;
margin:0 auto;
}

.cd-horizontal-timeline .events-content em::before {
content:'- ';
}

100% {
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 a.older-event::after,.no-touch .cd-timeline-navigation a:hover {
border-color:#7b9d6f;
}

@media only screen and min-width1100px{
.cd-horizontal-timeline {
margin:0 auto;
}

.cd-horizontal-timeline::before {
content:'desktop';
}
}