/*------------------------------------*\
    
    Contained Image + Text Block Customizations - Global Styling

    The styles you add to this file will be applied to the 'Contained Image + Text' block. 
    If there is any reasons why you would need to style them separately,
    please create a block-specific stylesheet for it (don't forget to register that block-specific stylesheet in acf-start-blocks.php)

\*------------------------------------*/

.image-text__img {
    height: 310px;
    flex: 0 0 100%
}

.image-text__img img {
    width: 100%;
}

.image-text__text {
    color: #565A5C;
    padding: 25px 22px 0;
}

.image-text ul.list-check li::before {
    background: #D9DED1;
}

.image-text .container-fluid {
    padding: 0;
}

.image-text,
.section-padding--top {
    padding-top: 0;
}

.image-text--slider .container-fluid {
    padding: 0 22px;
}

.image-text--slider .image-text__img {
    height: 175px;
    width: 100%;
}

.image-text--slider .image-text__text {
    padding: 25px 0 0;
}

.js-image-text-slider {
    padding-bottom: 30px;
}

.js-image-text-slider .slick-dots {
    padding: 0 0;
}

.image-text--slider {
    padding-top: 20px;
}

.bdr-top-bottom {
    border-top: 1px solid rgba(134, 140, 140, 0.37);
    border-bottom: 1px solid rgba(134, 140, 140, 0.37);
}

.bdr-top {
    border-top: 1px solid rgba(134, 140, 140, 0.37);
}

.image-text--inner {
    padding: 0;
}

@media (min-width: 768px) {
    .flex-row {
        display: flex;
        flex-wrap: wrap;
    }
    .image-text__half {
        width: 50%;
    }
    .image-text__img {
        position: relative;
        height: auto;
        flex:none;
    }
    .image-text__img img {
        position: absolute;
        top: 0;
    }
    .flex-opposite {
        flex-direction: row-reverse;
    }
    .image-text__wrap {
        border: 1px solid rgba(134, 140, 140, 0.37);
    }
    .image-text__text {
        padding: 34px 25px 24px 20px;
    }
    .flex-opposite .image-text__text {
        padding: 30px 45px 30px 26px;
    }
    .image-text .container-fluid,
    .image-text--slider .container-fluid {
        padding: 0 52px;
    }
    .image-text {
        padding-top: 100px;
    }
    .section-padding--top {
        padding-top: 0;
    }
    .image-text--slider .flex-row {
        display: flex;
        flex-wrap: wrap;
    }
    .image-text--slider .image-text__half {
        width: 100%;
    }
    .image-text--slider .image-text__img {
        position: relative;
        height: 290px;
    }
    .image-text--slider .image-text__img img {
        position: relative;
        top: 0;
    }
    .image-text--slider {
        padding-top: 0;
    }
    .image-text--slider .image-text__wrap {
        border: none;
        padding: 0 52px;
    }
    .image-text--slider .image-text__text {
        padding: 34px 0 10px 0;
    }
    .js-image-text-slider .slick-dots {
        padding: 0 54px;
    }
    .bdr-top-bottom,
    .bdr-top {
        border: none
    }
    .image-text--inner {
        padding: 0;
    }
    .image-text--half .container-fluid {
        padding: 0;
    }
    .image-text--half .image-text__text {
        padding: 40px 30px 40px 52px;
    }
}

@media (min-width: 1200px) {
    .image-text,
    .section-padding--top {
        padding-top: 130px;
    }
    .image-text__img {
        width: 60%;
    }
    .image-text__text {
        padding: 70px 50px;
        width: 40%;
    }
    .flex-opposite .image-text__text {
        padding: 50px;
    }
    .image-text__text h2 {
        padding-bottom: 8px;
    }
    .image-text--slider .flex-row {
        display: flex;
        flex-wrap: wrap;
    }
    .image-text--slider .image-text__half {
        width: 50%;
    }
    .image-text--slider .image-text__img {
        width: 60%;
    }
    .image-text--slider .image-text__text {
        width: 40%;
    }
    .image-text--slider .image-text__img {
        position: relative;
        height: auto;
    }
    .image-text--slider .image-text__img img {
        position: absolute;
        top: 0;
    }
    .image-text--slider .image-text__wrap {
        border: 1px solid rgba(134, 140, 140, 0.37);
        padding: 0 0;
    }
    .image-text--slider .image-text__text {
        padding: 50px 50px;
    }
    .js-image-text-slider .slick-dots {
        padding: 0 0;
        bottom: 0;
    }
    .js-image-text-slider {
        padding-bottom: 55px;
    }
    .image-text--slider {
        padding-top: 0;
    }
    .image-text--half .image-text__img {
        width: 50%;
    }
    .image-text--half .image-text__text {
        width: 50%;
    }
    .image-text--half .image-text__text {
        padding: 90px 80px 90px 50px;
    }
    .image-text--half .container-fluid {
        padding: 0 52px;
    }
}

@media (min-width: 1400px) {
    .image-text__text,
    .flex-opposite .image-text__text {
        padding: 100px 98px;
    }
    .image-text--slider .image-text__text {
        padding: 120px 100px;
    }
    .image-text--half .image-text__text {
        padding: 90px 120px 90px 90px;
    }
}