/* Timeline */

.timeline-image-box {
   padding: 50px 0;
   margin: 50px auto;
   position: relative;
   overflow: hidden;
}

.timeline-image-box:before {
   content: '';
   position: absolute;
   top: 0;
   left: 50%;
   margin-left: -1px;
   width: 2px;
   height: 100%;
   background: #CCD1D9;
   z-index: 1
}

.timeline-image-block {
   width: -webkit-calc(50% + 8px);
   width: -moz-calc(50% + 8px);
   width: calc(50% + 8px);
   display: -webkit-box;
   display: -webkit-flex;
   display: -moz-box;
   display: flex;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   -moz-box-pack: justify;
   justify-content: space-between;
   clear: both;
}

.timeline-image-block:nth-child(even) {
   float: right;
}

.timeline-image-block:nth-child(odd) {
   float: left;
   direction: rtl;
   text-align: right;
}

.marker {
   width: 16px;
   height: 16px;
   border-radius: 50%;
   border: 3px solid #CCD1D9;
   background: #fff;
   margin-top: 40px;
   z-index: 10
}

.marker.bigmarker {
   transform: scale(1.2);
   background: #CCD1D9;
}

.timeline-image-content {
   width: 95%;
   padding: 0 15px;
   color: #666
}

.timeline-image-content h3 {
   margin-top: 5px;
   margin-bottom: 5px;
   font-size: 25px;
   font-weight: 500
}



.timeline-image-content span {
   font-size: 15px;
   color: #a4a4a4;
}

.timeline-image-content p {
   color: #888;
}

.timeline-image-block-image {
   margin-bottom: 1rem;
}

.element-date {
   font-size: 4em;
}

.element-title {
   font-size: 2em;
   line-height: 1.25;
   margin-bottom: 0.5em;
   direction: ltr;
   font-weight: 400;
}

.element-title .more-link {
   font-size: 0.9rem;
   margin-top: 1em;
}

.element-content {
   direction: ltr;
}

@media screen and (min-width: 768px) {}



@media screen and (max-width: 768px) {
   .timeline-image-box:before {
      left: 8px;
      width: 2px;
   }

   .timeline-image-block {
      width: 100%;
      margin-bottom: 30px;
   }

   .timeline-image-block:nth-child(even) {
      float: none;
   }

   .timeline-image-block:nth-child(odd) {
      float: none;
      direction: ltr;
      text-align: left;
   }
}