.max-elements-image-accordion-wraper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    min-height: 366px;
    position: relative;

    .max-elements-single-image-accordion {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        position: relative;
        min-height: 460px;
        overflow: hidden;
        cursor: pointer;
        -webkit-transition: all .4s ease;
        transition: all .4s ease;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;

        &::before {
            position: absolute;
            content: "";
            top: 100%;
            left: 0;
            height: 100%;
            width: 100%;
            background: #000;
            background: -webkit-gradient(linear, left bottom, left top, from(black), color-stop(60%, rgba(255, 255, 255, 0)));
            background: linear-gradient(0deg, #000 0, rgba(255, 255, 255, 0) 60%);
            -webkit-transition: all .5s ease;
            transition: all .5s ease;
            opacity: 0;
        }

        .max-elements-accordion-content {
            width: 100%;
        }

        .max-elements-accordion-title {
            color: #fff;
            margin-bottom: 0;
        }

        .max-elements-accordion-title-wraper {
            position: relative;
            -webkit-transition: all .6s ease;
            transition: all .6s ease;
            top: 100px;
            opacity: 0;
            visibility: hidden;
            display: block;
        }

        .max-elements-btn-wraper {
            position: relative;
            -webkit-transition: all .7s ease;
            transition: all .7s ease;
            top: 100px;
            opacity: 0;
            visibility: hidden;

            a {
                display: inline-block;
            }
        }

        .max-elements-icon-wraper {
            margin-bottom: 20px;
            position: relative;
            -webkit-transition: all .6s ease;
            transition: all .6s ease;
            top: -100px;
            opacity: 0;
            visibility: hidden;

            .icon-outline {
                color: #fff;
            }

            svg {
                max-width: 16px;
                height: auto;
                vertical-align: middle;
            }
        }
    }
}

.max-elements-image-accordion-click .max-elements-image-accordion-wraper .max-elements-single-image-accordion--input:checked + label,
.max-elements-image-accordion-hover .max-elements-image-accordion-wraper .max-elements-single-image-accordion--input:checked + label,
.max-elements-image-accordion-hover .max-elements-image-accordion-wraper .max-elements-single-image-accordion:hover {
    -webkit-box-flex: 3;
    -ms-flex: 3;
    flex: 3;
}
.max-elements-image-accordion-click .max-elements-image-accordion-wraper .max-elements-single-image-accordion--input:checked + label::before,
.max-elements-image-accordion-hover .max-elements-image-accordion-wraper .max-elements-single-image-accordion--input:checked + label::before,
.max-elements-image-accordion-hover .max-elements-image-accordion-wraper .max-elements-single-image-accordion:hover::before {
    top: 0;
    opacity: 1;
}
.max-elements-image-accordion-click .max-elements-image-accordion-wraper .max-elements-single-image-accordion--input:checked + label .max-elements-accordion-title-wraper,
.max-elements-image-accordion-click .max-elements-image-accordion-wraper .max-elements-single-image-accordion--input:checked + label .max-elements-btn-wraper,
.max-elements-image-accordion-click .max-elements-image-accordion-wraper .max-elements-single-image-accordion--input:checked + label .max-elements-icon-wraper,
.max-elements-image-accordion-hover .max-elements-image-accordion-wraper .max-elements-single-image-accordion--input:checked + label .max-elements-accordion-title-wraper,
.max-elements-image-accordion-hover .max-elements-image-accordion-wraper .max-elements-single-image-accordion--input:checked + label .max-elements-btn-wraper,
.max-elements-image-accordion-hover .max-elements-image-accordion-wraper .max-elements-single-image-accordion--input:checked + label .max-elements-icon-wraper,
.max-elements-image-accordion-hover .max-elements-image-accordion-wraper .max-elements-single-image-accordion:hover .max-elements-accordion-title-wraper,
.max-elements-image-accordion-hover .max-elements-image-accordion-wraper .max-elements-single-image-accordion:hover .max-elements-btn-wraper,
.max-elements-image-accordion-hover .max-elements-image-accordion-wraper .max-elements-single-image-accordion:hover .max-elements-icon-wraper {
    top: 0;
    opacity: 1;
    visibility: visible;
}

@media screen and (min-width: 1025px) {
    .max-elements-image-accordion-vertical .max-elements-image-accordion {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .max-elements-image-accordion-vertical .max-elements-image-accordion-item {
        min-height: 0 !important;
    }
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
    .max-elements-image-accordion-tablet-vertical .max-elements-image-accordion,
    .max-elements-image-accordion-vertical:not(.max-elements-image-accordion-tablet-horizontal) .max-elements-image-accordion {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .max-elements-image-accordion-tablet-vertical .max-elements-image-accordion-item,
    .max-elements-image-accordion-vertical:not(.max-elements-image-accordion-tablet-horizontal) .max-elements-image-accordion-item {
        min-height: 0 !important;
    }
}
@media screen and (max-width: 767px) {
    .max-elements-image-accordion-mobile-vertical .max-elements-image-accordion,
    .max-elements-image-accordion-tablet-vertical:not(.max-elements-image-accordion-mobile-horizontal) .max-elements-image-accordion,
    .max-elements-image-accordion-vertical:not(.max-elements-image-accordion-mobile-horizontal) .max-elements-image-accordion {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .max-elements-image-accordion-mobile-vertical .max-elements-image-accordion-item,
    .max-elements-image-accordion-tablet-vertical:not(.max-elements-image-accordion-mobile-horizontal) .max-elements-image-accordion-item,
    .max-elements-image-accordion-vertical:not(.max-elements-image-accordion-mobile-horizontal) .max-elements-image-accordion-item {
        min-height: 0 !important;
    }
}