.image-cards {
    margin-top: -46px;
    position: relative;
    z-index: 2;

    padding: 30px 22px 60px;
}

.image-cards__container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.image-cards--row .image-cards-item {
    margin-bottom: 30px;
}

.image-cards.image-cards--inner {
    margin-top: 0;
    padding-top: var(--section-margins);
    padding-bottom: var(--section-margins);
}

.image-cards > .container {
    position: relative;
    z-index: 5;
}

.image-cards-overlay {
    position: relative;
    z-index: 1;
}

.image-card {
    background: #eff2f5;
    border-radius: 3px;
    overflow: hidden;
    text-align: center;
    display: block;
    position: relative;
}

.image-card--link:hover .image-card__top {
    display: flex;
    flex-direction: column-reverse;
}

.image-card__title {
    margin: 0;
    padding: 0;
    font-size: 20px;
    line-height: 1.26em;
    padding: 10px 5px;
    color: #1a1818;
    border-radius: 0 0 3px 3px;
}

.image-card--link:hover .image-card__title {
    padding-top: 28px;
    padding-bottom: 0;
}

.off {
    margin: 0;
    padding: 0;
    font-size: 15px;
    line-height: 1.2em;
    min-height: 34px;
    padding: 7px 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #ffffff;
    font-weight: 600;
    background: #ea7500;
    display: block;
}

.image-card__image {
    width: 100%;
    height: 275px;
    position: relative;
}

.image-card__image img {
    display: block;
    border-radius: 0 0 3px 3px;
}

.image-card--link__hover {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        to right,
        rgba(239, 242, 245, 1) 0%,
        rgba(239, 242, 245, 0.85) 100%
    );
    padding: 10px 35px 0;
    opacity: 0;
}

.image-card--link:hover .image-card--link__hover {
    opacity: 1;
}

.image-card--link__hover p {
    font-size: 16px;
    color: #454545;
    line-height: 1.68em;
    padding-bottom: 15px;
    font-weight: 400;
}

.image-card__btn {
    margin: 0;
    padding: 0;
    font-size: 16px;
    line-height: 1.26em;
    padding: 0 0 5px 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #13307F;
    font-weight: 600;
    border-bottom: 2px solid rgba(19, 48, 127, 0.5);
    background: linear-gradient(
        to bottom,
        rgba(154, 170, 214, 0.5) 0%,
        rgba(154, 170, 214, 0.5) 100%
    );
    background-position: 0 120%;
    background-repeat: repeat-x;
    background-size: 6px 6px;
    text-decoration: none;
    transition: background-size 0.2s;
}

.image-card__btn:hover {
    background-size: 4px 50px;
    color: #13307F;
    background-position: 0 100%;
}

.image-card__btn i {
    font-size: 12px;
    vertical-align: middle;
    font-weight: normal;
    padding: 0 0 2px 2px;
}

.image-cards .slick-next {
    right: -22px;
}

.image-cards .slick-prev {
    left: -22px;
}

.image-cards-overlay-one {
    position: absolute;
    bottom: -75px;
    left: -47px;
    width: 218px;
}

.image-cards-overlay-two {
    position: absolute;
    bottom: -93px;
    right: -41px;
    width: 159px;
}

.image-cards-overlay-three {
    position: absolute;
    bottom: -193px;
    left: -64px;
    width: 159px;
}

.image-cards > .container > h5 {
    padding: 20px 0 0 0;
    text-align: center;
}

.image-cards-item {
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
}

@media (min-width: 768px) {
    .image-cards {
        margin-top: -48px;
        padding: 30px 0 60px;
    }

    .image-cards.image-cards--inner {
        margin-top: 0;
        padding-top: var(--section-margins);
        padding-bottom: var(--section-margins);
    }

    .image-cards-item {
        width: 50%;
    }

    .image-card__image {
        height: 300px;
    }

    .image-cards .slick-next {
        right: -6px;
    }

    .image-cards .slick-prev {
        left: -6px;
    }

    .image-cards__container {
        margin: 0 -16px;
    }

    .image-cards-overlay-one {
        bottom: -52px;
    }

    .image-cards-overlay-two {
        right: 46%;
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%);
        bottom: -121px;
    }
}
@media (min-width: 1200px) {
    .image-cards {
        margin-top: -60px;
        padding: 30px 0 60px;
    }

    .image-cards-item {
        width: 25%;
    }

    .image-cards.image-cards--inner {
        margin-top: 0;
        padding-top: var(--section-margins);
        padding-bottom: var(--section-margins);
    }

    .image-card__image {
        height: 300px;
    }

    .image-cards .slick-next {
        right: -6px;
    }

    .image-cards .slick-prev {
        left: -6px;
    }

    .image-cards__container {
        margin: 0 -16px;
    }

    .image-card__title {
        font-size: 18px;
        padding: 14px 5px;
    }

    .off {
        font-size: 16px;
        padding: 8px 0;
    }

    .image-card__image {
        height: 310px;
    }

    .image-cards-overlay-one {
        bottom: -60px;
        width: 547px;
        left: -117px;
    }

    .image-cards-overlay-two {
        right: 46%;
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%);
        bottom: -279px;
        width: 394px;
    }

    .image-cards-overlay-three {
        position: absolute;
        bottom: -220px;
        left: -159px;
        width: 398px;
    }
}
