﻿.a03 {
    transition: background 0.5s ease-in-out;
}

    .a03 .inner-container {
        padding: 0;
        max-width: 100%;
        margin-top: 0;
        margin-bottom: 40px;
    }

    .a03 .headline {
        padding-top: 46px;
        margin-bottom: 48px;
    }

    .a03.carousel .slick-slide {
        display: block;
        padding: 0 12px;
    }

    .a03 .image-container {
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
        height: 162px;
    }

    .a03 .content-container {
        height: auto;
        padding: 24px 0 0;
        opacity: 0;
        transition: opacity 0.05s ease-in-out;
    }

    .a03 .underline {
        background-image: linear-gradient(to right, #fff, #fff) !important
    }

    .a03 .arrow-container {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .a03 .show-content .content-container {
        transition: opacity 0.5s ease-in-out;
        opacity: 1;
    }

    .a03 .dots-container {
        position: static;
        margin: 0;
    }

    .a03 .arrow-container .slick-dots,
    .a03 .arrow-container .slick-arrow {
        position: static;
    }

    .a03 .arrow-container .slick-arrow {
        width: auto;
        height: auto;
        left: auto;
        bottom: auto;
        background-color: transparent;
        color: #fff;
        transform: none;
        font-size: 24px;
        padding: 0 5px;
    }

    .a03 .slick-arrow:not(.slick-disabled):hover,
    .a03 .slick-arrow:not(.slick-disabled):focus {
        background-color: transparent;
        opacity: 0.5;
    }

    .a03 .slick-arrow:not(.slick-disabled):focus {
        outline: thin dotted;
    }

        .a03 .slick-arrow:not(.slick-disabled):focus:not(:focus-visible) {
            outline: none;
        }

    .a03 .arrow-container .slick-dots {
        display: flex;
    }

    .a03 .slick-dots li,
    .a03 .slick-dots li button,
    .a03 .slick-dots li button:before {
        color: #6B6D6F;
        opacity: 1;
    }

    .a03 .slick-dots li {
        margin: 0;
    }

        .a03 .slick-dots li.slick-active button:before {
            color: #fff;
        }

@media screen and (min-width: 768px) {
    .a03 .slider-container {
        position: relative;
    }

    .a03 .image-container {
        height: 297px;
    }

    .a03 .content-container {
        width: 344px;
    }

    .a03 .arrow-container {
        position: absolute;
        top: 327px;
        right: 20%;
    }
}

@media screen and (min-width: 992px) {
    .a03 .headline {
        padding-top: 62px;
        margin-bottom: 56px;
    }

    .a03 .image-container {
        height: 440px;
    }

    .a03 .content-container {
        width: 486px;
    }

    .a03 .arrow-container {
        top: 470px;
    }
}

@media screen and (max-width: 767.99px) {
    .a03 .arrow-container {
        width: 288px;
        margin: 0 auto;
    }

        .a03 .arrow-container .slick-arrow {
            padding: 0;
        }

        .a03 .arrow-container .slick-prev {
            margin-right: auto;
        }

        .a03 .arrow-container .slick-next {
            margin-left: auto;
        }
}
