.slider { padding: 0 0 5px; } .slick-slide { background-size: cover; } .hero-slider .slick-track{ background-color: #2E2E2D; } .hero-slider .slide-container { min-height: 740px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; color: #fff; background: #2E2E2D; } .slide-content { width: 1440px; max-width: 100%; padding: 30px; margin: auto; z-index: 1; } .slide-inner { max-width: 740px; } .hero-slider .title { font-size: 65px; text-transform: uppercase; } .hero-slider .title strong{ color: var(--secondary-color); } .hero-slider .subtitle { font-size: 33px; line-height: normal; } .hero-slider .subtitle:before { content: ""; width: 2px; height: 40px; display: inline-block; transform: rotate(45deg); background: var(--main-color); margin-right: 20px; } .hero-slider .button:nth-child(1) { background-color: var(--secondary-color); border-color: var(--secondary-color); } .hero-slider .button:nth-child(1):after { color: #000; } .hero-slider .button:nth-child(1):hover:after { color: var(--main-color); } .slick-dots li.slick-active button:before { opacity: 1; color: var(--secondary-color); } .slick-dots{ padding-left: 0 !important; } .hero-slider .slick-dots li button:before { color: #fff; } .slick-dots li button:before{ font-size: 16px; } .hero-slider .button{ color: #fff; } .image-wrap { position: absolute; top: 0; right: 0; left: 0; height: 100%; z-index: 0; } .image-wrap img { object-fit: cover; height: 100%; width: 100%; transition: .3s ease; } .hero-slider .slide-content { padding-bottom: 75px; } @media screen and (max-width: 768px) { .hero-slider .title { font-size: 32px; } .hero-slider .slide-container { width: 100%; } .image-wrap { height: 220px; position: relative; width: 100%; } .hero-slider .subtitle:before{ height: 25px; } .hero-slider .subtitle { font-size: 18px; } }