.wrapper-banner-history #timeline .dates {position: relative;}
.wrapper-banner-history #timeline .dates .year{position: relative;padding-top: 24px;padding-bottom: 22px;width: 280px;height: auto;}
.wrapper-banner-history #timeline .dates .year:hover{cursor: pointer;}
.wrapper-banner-history #timeline .dates .year::before{content: '';position: absolute;z-index: 5;bottom: 0;left: 0;width: 100%;height: 10px;background: url(../../../sysimages/icon-dates.png) 5px top/15px 10px repeat-x;}
.wrapper-banner-history #timeline .dates .year:last-child::after{content: '';position: absolute;z-index: 5;bottom: 0;right: 0;width: 114px;height: 10px;background: #fff;}
.wrapper-banner-history #timeline .dates .slick-list{padding: 0 8px !important;}
.wrapper-banner-history #timeline .dates .year span{position: relative;display: inline-block;transition:0.4s all;}
.wrapper-banner-history #timeline .dates .slick-current.year span{position: relative;top: -10px;font-size: 15px;font-family: 'Metrocity-Bold';}
.wrapper-banner-history #timeline .dates .year span::before{content: '';position: absolute;bottom: -22px;left: 20px;width: 2px;height: 20px;background-color: #018eaa;z-index: 8;}
.wrapper-banner-history #timeline .dates .slick-current.year span::before{bottom: -32px;height: 30px;background: #1a3048;}
.wrapper-banner-history #timeline .dates .slick-arrow{position: absolute;bottom: 0;z-index: 6;right: 0;left: auto;background: url(../../../sysimages/arrow-timeline.png) left top/70px no-repeat;width: 70px;height: 70px;border-radius: 0;overflow: visible;}
.wrapper-banner-history #timeline .dates .slick-arrow.slick-disabled{opacity: 0.3;cursor: default;}
.wrapper-banner-history #timeline .dates .slick-arrow::before{content:'';position: absolute;top: -30px;left: 0;right: auto;width: 1px;height: calc(100% + 60px);background-color: #018eaa;z-index: 7;}
.wrapper-banner-history #timeline .dates .slick-prev{transform: rotate(180deg);right: auto;left: 0;}
.wrapper-banner-history #timeline .dates .slick-prev::before{right: 100%;left: auto;}
.wrapper-banner-history #timeline .description{background: #f2f2f2;padding: 52px 55px;}
.wrapper-banner-history #timeline .description .yearsSlider .yearSlide{height: auto;}
.wrapper-banner-history #timeline .description .yearsSlider .yearSlide .desc{padding: 0 48px 0 50px;}
.wrapper-banner-history #timeline .description .yearsSlider .yearSlide:not(.slick-current) .desc ul{padding-top: 18px;}
.wrapper-banner-history #timeline .description .yearsSlider .yearSlide .desc ul{list-style-type: none;margin-left: 0;padding-top: 2px;transition:0s all;}
.wrapper-banner-history #timeline .description .yearsSlider .yearSlide .desc ul li{padding-left: 24px;width: 100%;position: relative;}
.wrapper-banner-history #timeline .description .yearsSlider .yearSlide .desc ul li:not(:first-child){margin-top: 10px;}
.wrapper-banner-history #timeline .description .yearsSlider .yearSlide .desc ul li::before{content: '';position: absolute;top: 3px;left: 0;width: 12px;height: 13px;background: url(../../../sysimages/li-icon.png) left top/12px 13px no-repeat;}
.wrapper-banner-history #timeline .dates > div, .wrapper-banner-history #timeline .description .yearsSlider > div{display: none;}
.wrapper-banner-history #timeline .dates.loaded > div, .wrapper-banner-history #timeline .description .yearsSlider.loaded > div,
.wrapper-banner-history #timeline .dates:not(.loaded) > div:first-child, .wrapper-banner-history #timeline .description .yearsSlider:not(.loaded) > div:first-child{display: block;margin: 0 auto;}


.yearSlide.slick-current p.h2{font-size:40px !important;padding-bottom:15px !important;}
.wrapper-banner-history #timeline .dates .year span,.wrapper-banner-history #timeline .dates .slick-current.year span{font-size:18px;}



@media screen and (max-width:768px) {
	.wrapper-banner-history #timeline .dates{padding: 0 40px;}
    .wrapper-banner-history #timeline .dates .slick-arrow{width: 35px;height: 35px;background-size: 35px auto;}
    .wrapper-banner-history #timeline .dates .slick-arrow::before{top: -15px;height: calc(100% + 30px);}
    .wrapper-banner-history #timeline .dates .year{padding-left: 15px;padding-right: 15px;width: auto;}
    .wrapper-banner-history #timeline .description{padding: 30px 0;}
    .wrapper-banner-history #timeline .description .yearsSlider .yearSlide{padding: 0 10px;}
    .wrapper-banner-history #timeline .description .yearsSlider .yearSlide .desc{padding: 0 15px;}
    .wrapper-banner-history #timeline .description .yearsSlider > div{padding: 0 25px !important;}
    .wrapper-banner-history #timeline .dates .year:last-child::after{display: none;}
}