/*-----------------------------------------------------------------------------------*/
 /*	29. TIMELINE
/*-----------------------------------------------------------------------------------*/

 .timeline {
     position: relative;
     padding : 35px 0;
 }

 .timeline:before {
     content    : '';
     position   : absolute;
     top        : 0;
     left       : 50%;
     margin-left: -1px;
     height     : 100%;
     width      : 1px;
     background : rgba(0, 0, 0, 0.1);
 }

 .timeline-block {
     position: relative;
     margin  : -80px 0;
 }

 .timeline-block:before,
 .timeline-block:after {
     content: " ";
     display: table;
 }

 .timeline-block:after {
     clear: both
 }

 .timeline-block:first-child {
     margin-top: 0
 }

 .timeline-block:last-child {
     margin-bottom: 0
 }

 .timeline-icon {
     position                   : absolute;
     top                        : 0;
     left                       : 50%;
     margin-top                 : 5px;
     text-align                 : center;
     -webkit-transform          : translateZ();
     -webkit-backface-visibility: hidden;
     -webkit-transform          : translateX(-50%);
     -ms-transform              : translateX(-50%);
     transform                  : translateX(-50%);
 }

 .timeline.dot .timeline-icon:before {
     content      : "";
     position     : absolute;
     background   : #1a206c;
     width        : 15px;
     height       : 15px;
     max-width    : 15px;
     max-height   : 15px;
     margin-left  : -8px;
     margin-top   : 28px;
     border-radius: 100%;
 }

 .timeline-content {
     position: relative;
     width   : 42%;
 }

 .timeline.dot .timeline-content {
     width: 45%;
 }

 .timeline-content.box-arrow.left {
     float: right
 }

 .box-arrow:after {
     content      : "";
     position     : absolute;
     top          : 30px;
     right        : -10px;
     border-left  : 10px solid #fff;
     border-top   : 10px solid transparent;
     border-bottom: 10px solid transparent;
 }

 .box-arrow.right:after {
     right        : -10px;
     border-left  : 10px solid #fff;
     border-top   : 10px solid transparent;
     border-bottom: 10px solid transparent;
 }

 .box-arrow.left:after {
     left        : -10px;
     right       : auto;
     border-right: 10px solid #fff;
     border-left : transparent;
 }

 .box-arrow.bottom:after {
     bottom      : -20px;
     top         : auto;
     left        : 25px;
     right       : auto;
     border-left : 10px solid transparent;
     border-right: 10px solid transparent;
     border-top  : 10px solid #fff;
 }

 .box-arrow.top:after {
     top          : -20px;
     bottom       : auto;
     left         : 25px;
     right        : auto;
     border-left  : 10px solid transparent;
     border-right : 10px solid transparent;
     border-bottom: 10px solid #FFF;
 }

 @media (max-width: 767px) {
     .discs {
         margin-top   : 60px;
         margin-bottom: 60px;
     }

     .discs .disc {
         width : 70%;
         margin: -60px auto;
     }

     .timeline:before {
         left: 40px;
     }

     .timeline-icon {
         left: 40px;
     }

     .timeline-block {
         margin      : 0;
         width       : 100%;
         padding-left: 100px;
     }

     .timeline-content,
     .timeline.dot .timeline-content {
         float: none;
         width: 100%;
     }

     .timeline .box-arrow.right:after {
         left        : -10px;
         right       : auto;
         border-right: 10px solid #fff;
         border-left : transparent;
     }

 }

 @media only screen and (max-width: 960px) {
     .timeline-icon {
         left: 20px;
     }

     .timeline-block {
         padding-left: 45px;
     }

     .timeline .box-arrow.right:after {
         display: none;
     }
 }

 .timeline-content {
     background: #f6f7f8 !important;
 }

 .timeline-block {
     min-height: 225px;
 }

 .inverse-text .timeline:before {
     background: rgba(255, 255, 255, 0.15);
 }

 .icon .date {
     font-weight: 500;
 }

 .icon .date {
     display       : table-cell;
     text-align    : center;
     margin        : 0 auto;
     vertical-align: middle;
 }

 .icon .date .year {
     font-size: 13px;
     display  : block;
 }

 .icon-bg {
     background   : #1a206c;
     color        : #FFF;
     width        : 64px;
     height       : 64px;
     max-width    : 64px;
     max-height   : 64px;
     border-radius: 100%;
     display      : table;
 }

 .icon:not(.icon-img) {
     line-height: 1;
 }

 .blog.classic-view .box {
     padding: 40px;
 }

 .boxed .box {
     margin-bottom: 0;
 }

 .timeline-content {
     position: relative;
     width   : 42%;
 }

 .timeline-block:after {
     clear: both;
 }

 .timeline-block:before,
 .timeline-block:after {
     content: " ";
     display: table;
 }

 .blog:not(.start) .box.bg-white {
     -webkit-filter     : drop-shadow(0px 1px 1px rgba(0, 0, 0, 0.1));
     filter             : drop-shadow(0px 1px 1px rgba(0, 0, 0, 0.1));
     /* background-color: transparent !important; */
 }

 .box-arrow:after {
     content      : "";
     position     : absolute;
     top          : 30px;
     right        : -10px;
     border-left  : 10px solid #fff;
     border-top   : 10px solid transparent;
     border-bottom: 10px solid transparent;
 }

 .box-arrow.left:after {
     border-right: 10px solid #f6f7f8 !important;
 }

 .box-arrow.left:after {
     left        : -10px;
     right       : auto;
     border-right: 10px solid #fff;
     border-left : transparent;
 }

 .box-arrow:after {
     content      : "";
     position     : absolute;
     top          : 30px;
     right        : -10px;
     border-left  : 10px solid #fff;
     border-top   : 10px solid transparent;
     border-bottom: 10px solid transparent;
 }

 .box-arrow.right:after {
     right        : -10px;
     border-left  : 10px solid #fff;
     border-top   : 10px solid transparent;
     border-bottom: 10px solid transparent;
 }

 .box-arrow.right:after {
     border-left: 10px solid #f6f7f8 !important;
 }