/* This file is used as dependency in:
   ../../modules/sub-image-boxes.module/module.html 
   ../../modules/sec-image-boxes.module/module.html */

.pwr-image-box {
    border: 0px solid transparent;
    color: var(--clr-text-lt);
    display: inline-block;
    float: left;
    position: relative;
    width: 100%;
    z-index: 1;
    --mod-imgb-clr-hover-box-txt: var(--clr-hover-box-txt);
    --mod-imgb-clr-hover-box-background: var(--clr-hover-box-background);
}

.pwr-image-box__img {
    position:relative;
    background-size: cover;
    background-position: center;
    border-radius: var(--br-box);
    height: 380px;
    width: 100%;
}
.pwr-image-box__img .pwr-background-img {
    border-radius: var(--br-box);
}

.pwr-image-box--style-below-2 .pwr-image-box__img,
.pwr-image-box--style-below-2 .pwr-image-box__img img {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.pwr-image-box.pwr-image-box--2cols.pwr-image-box--one-by-one,
.pwr-image-box.pwr-image-box--2cols.pwr-image-box--two-by-one {
    width: calc(50% - 20px);
}

.pwr-image-box.pwr-image-box--2cols.pwr-image-box--one-by-two,
.pwr-image-box.pwr-image-box--2cols.pwr-image-box--two-by-two {
    width: 100%;
}

.pwr-image-box.pwr-image-box--4cols.pwr-image-box--one-by-one,
.pwr-image-box.pwr-image-box--4cols.pwr-image-box--two-by-one {
    width: calc( 25% - 20px );
}

.pwr-image-box.pwr-image-box--4cols.pwr-image-box--one-by-two,
.pwr-image-box.pwr-image-box--4cols.pwr-image-box--two-by-two {
    width: calc( 50% - 20px );
}

.pwr-image-box.pwr-image-box--4cols.pwr-image-box--one-by-one .pwr-image-box__img,
.pwr-image-box.pwr-image-box--5cols.pwr-image-box--one-by-one .pwr-image-box__img,
.pwr-image-box.pwr-image-box--4cols.pwr-image-box--one-by-two .pwr-image-box__img,
.pwr-image-box.pwr-image-box--5cols.pwr-image-box--one-by-two .pwr-image-box__img {
    height: 285px;
}

.pwr-image-box.pwr-image-box--4cols.pwr-image-box--two-by-one .pwr-image-box__img,
.pwr-image-box.pwr-image-box--5cols.pwr-image-box--two-by-one .pwr-image-box__img,
.pwr-image-box.pwr-image-box--4cols.pwr-image-box--two-by-two .pwr-image-box__img,
.pwr-image-box.pwr-image-box--5cols.pwr-image-box--two-by-two .pwr-image-box__img {
    height: 590px;
}

.pwr-image-box.pwr-image-box--5cols.pwr-image-box--one-by-one,
.pwr-image-box.pwr-image-box--5cols.pwr-image-box--two-by-one {
    width: calc(20% - 20px);
}

.pwr-image-box.pwr-image-box--5cols.pwr-image-box--one-by-two,
.pwr-image-box.pwr-image-box--5cols.pwr-image-box--two-by-two {
    width: calc(40% - 20px);
}

.pwr-image-box.pwr-image-box--6cols.pwr-image-box--one-by-one,
.pwr-image-box.pwr-image-box--6cols.pwr-image-box--two-by-one {
    width: calc(16.667% - 20px);
}

.pwr-image-box.pwr-image-box--6cols.pwr-image-box--one-by-two,
.pwr-image-box.pwr-image-box--6cols.pwr-image-box--two-by-two {
    width: calc(33.333% - 20px);
}

.pwr-image-box.pwr-image-box--3cols-rect.pwr-image-box--one-by-one,
.pwr-image-box.pwr-image-box--3cols-rect.pwr-image-box--two-by-one {
    width: calc( 33.33% - 20px );
}

.pwr-image-box.pwr-image-box--3cols-rect.pwr-image-box--one-by-two,
.pwr-image-box.pwr-image-box--3cols-rect.pwr-image-box--two-by-two {
    width: calc( 66.66% - 20px );
}

.pwr-image-box.pwr-image-box--3cols-rect.pwr-image-box--one-by-one .pwr-image-box__img,
.pwr-image-box.pwr-image-box--3cols-rect.pwr-image-box--one-by-two .pwr-image-box__img {
    height: 285px;
}

.pwr-image-box.pwr-image-box--3cols-rect.pwr-image-box--two-by-one .pwr-image-box__img,
.pwr-image-box.pwr-image-box--3cols-rect.pwr-image-box--two-by-two .pwr-image-box__img {
    height: 590px;
}

.pwr-image-box--style-below-2.pwr-image-box--3cols-rect.pwr-image-box--one-by-one .pwr-image-box__img,
.pwr-image-box--style-below-2.pwr-image-box--3cols-rect.pwr-image-box--one-by-two .pwr-image-box__img {
    height: 240px;
}

.pwr-image-box--style-below-2.pwr-image-box--3cols-rect.pwr-image-box--two-by-two .pwr-image-box__img,
.pwr-image-box--style-below-2.pwr-image-box--3cols-rect.pwr-image-box--two-by-one .pwr-image-box__img {
    height: 500px;
}

.pwr-image-box.pwr-image-box--one-by-one,
.pwr-image-box.pwr-image-box--two-by-one {
    width: calc( 33.33% - 20px );
}

.pwr-image-box.pwr-image-box--one-by-two,
.pwr-image-box.pwr-image-box--two-by-two {
    width: calc( 66.66% - 20px );
}

.pwr-image-box.pwr-image-box--one-by-one .pwr-image-box__img,
.pwr-image-box.pwr-image-box--one-by-two .pwr-image-box__img {
    height: 380px;
}

.pwr-image-box.pwr-image-box--two-by-one .pwr-image-box__img,
.pwr-image-box.pwr-image-box--two-by-two .pwr-image-box__img {
    height: 780px;
}

.pwr-image-box__overlay {
    border-radius: var(--br-box);
    height: 100%;
    opacity: 0;
    position: absolute;
    transform-style: preserve-3d;
    width: 100%;
    z-index: 1;
}

.pwr-image-box__overlay--front {
    background-color: var(--clr-base-dk);
    opacity: .45;
}

.pwr-image-box:hover .pwr-image-box__overlay {
    background-color: var(--mod-imgb-clr-hover-box-background);
    opacity: .85;
}

.pwr-image-box__front {
    bottom: 0;
    color: var(--clr-text-dk);
    left: 0;
    padding: 50px 40px;
    position: absolute;
    width: 100%;
    z-index: 1;
}

.pwr-image-box__back {
    bottom: 0;
    color: var(--clr-text-dk);
    left: 0;
    padding: 50px 40px;
    position: absolute;
    width: 100%;
    z-index: 1;
}

.pwr-image-box__back,
.pwr-image-box__back .pwr-read-more__button {
    color: var(--mod-imgb-clr-hover-box-txt);
}

.pwr-image-box__back .pwr-read-more__button:hover {
    color: var(--mod-imgb-clr-hover-box-txt);
}

.pwr-image-box__below {
    padding: 30px 10px 35px 0;
}

.pwr-image-box .pwr-image-box__below {
    color: var(--clr-text-lt);
}

.pwr-image-box:hover .pwr-image-box__below {
    color: var(--clr-text-lt);
}

.pwr--dark .pwr-image-box .pwr-image-box__below {
    color: var(--clr-text-dk);
}

.pwr--dark .pwr-image-box:hover .pwr-image-box__below {
    color: var(--clr-text-dk);
}

.pwr-image-box--style-below-2 .pwr-image-box__below {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    padding: 35px 40px;
}

.pwr-image-box--style-below-1 .pwr-image-box__intro {
    color: var(--clr-primary);
}

.pwr-image-box--style-below-2 .pwr-image-box__intro {
    color: var(--clr-primary);
}

.pwr-image-box__front {
    opacity: 1;
}

.pwr-image-box:hover .pwr-3D-box__info-box {
    opacity: 1;
}

.pwr-image-box:hover .pwr-image-box__front {
    opacity: 0;
}

.pwr-image-box__back {
    opacity: 0;
}

.pwr-image-box__intro {
    display: block;
    font-family: var(--ff-accent);
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 8px;
}

.pwr-image-box__title {
    display: block;
    font-family: var(--ff-accent);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2em;
}

.pwr-image-box__desc {
    display: inline-block;
    padding-top: 10px;
}

.pwr-image-box__front--hide {
    display: none;
}

.pwr-image-box__more-link {
    display: block;
    font-family: var(--ff-btn);
    font-size: 13px;
    font-weight: 700;
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 20px 0 0 0;
    text-transform: var(--tt-link);
}

.pwr-image-box__more-link {
    color: var(--mod-imgb-clr-hover-box-txt);
}

.pwr-image-box__more-link:hover {
    color: var(--mod-imgb-clr-hover-box-txt);
}

.pwr-image-box__more-link:hover {
    overflow: visible;
}

.pwr-image-box__more-link:not(.pwr-image-box__more-link--centered):hover .pwr-image-box__icon {
    transform: translateX(4px);
}

.pwr-image-box__more-link--mobile {
    display: none;
}

.pwr-image-box--is-link:hover {
    cursor: pointer;
}
.pwr-image-box--is-link:hover .pwr-image-box__more-link,
.pwr-image-box.pwr-lightbox:hover .pwr-image-box__more-link {
    height: auto;
    opacity: 1;
}

.pwr-image-box__more-link--centered {
    font-size: 18px;
}

.pwr-image-box--is-link:hover .pwr-image-box__more-link--centered {
    padding-top: 0;
}

.pwr-image-box__icon {
    display: inline-block;
    fill: currentColor;
    padding-left: 10px;
    position: relative;
    top: .15em;
    transform: translateX(0px);
}

.pwr-image-box__icon--no-text {
    padding-left: 0;
    font-size: 25px;
}

.pwr-image-box--smaller .pwr-image-box__back .pwr-image-box__icon--no-text {
    font-size: 18px;
}

.pwr-image-box--smaller .pwr-image-box__front {
    padding: 40px 30px;
}

.pwr-image-box--smaller .pwr-image-box__back {
    padding: 40px 30px;
}

.pwr-image-box--smaller .pwr-image-box__intro {
    font-size: 14px;
}

.pwr-image-box--smaller .pwr-image-box__desc {
    font-size: 14px;
}

.pwr-image-box--smaller .pwr-image-box__title {
    font-size: 20px;
}

.pwr-image-box--smaller.pwr-image-box--style-below-2 .pwr-image-box__below {
    padding: 30px;
}

@container module (hover: none) {
    .pwr-image-box__more-link--mobile {
        display: block;
        height: auto;
        opacity: 1;
    }

    .pwr-image-box__more-link--mobile {
        color: var(--clr-text-lt);
    }

    .pwr-image-box__more-link--mobile:hover {
        color: var(--clr-text-lt);
    }

    .pwr--dark .pwr-image-box__more-link--mobile {
        color: var(--clr-text-dk);
    }

    .pwr--dark .pwr-image-box__more-link--mobile:hover {
        color: var(--clr-text-dk);
    }
}

@container module ( max-width: 1199px ) {
    .pwr-image-box.pwr-image-box--4cols.pwr-image-box--one-by-one {
        width: calc( 33.33% - 20px );
    }

    .pwr-image-box.pwr-image-box--4cols.pwr-image-box--two-by-one {
        width: calc( 33.33% - 20px );
    }

    .pwr-image-box.pwr-image-box--4cols.pwr-image-box--one-by-two {
        width: calc( 66.66% - 20px );
    }

    .pwr-image-box.pwr-image-box--4cols.pwr-image-box--two-by-two {
        width: calc( 66.66% - 20px );
    }
}

@container module ( max-width: 991px ) {
    .pwr-image-box.pwr-image-box--one-by-one:not(.swiper-slide) {
        width: calc( 50% - 20px ) !important;
    }

    .pwr-image-box.pwr-image-box--two-by-one {
        width: calc( 50% - 20px ) !important;
    }

    .pwr-image-box.pwr-image-box--one-by-two {
        width: calc( 100% - 20px ) !important;
    }

    .pwr-image-box.pwr-image-box--two-by-two {
        width: calc( 100% - 20px ) !important;
    }
}

@container module ( max-width: 767px ) {
    .pwr-image-box__front {
        padding: calc(50px * var(--sp-reduction-factor)) calc(40px * var(--sp-reduction-factor));
    }

    .pwr-image-box__back {
        padding: calc(50px * var(--sp-reduction-factor)) calc(40px * var(--sp-reduction-factor));
    }

    .pwr-image-box__below {
        padding: calc(30px * var(--sp-reduction-factor)) calc(10px * var(--sp-reduction-factor)) calc(35px * var(--sp-reduction-factor)) 0;
    }

    .pwr-image-box__intro {
        font-size: 18px;
        font-size: max(var(--fs-min), calc(18px * var(--fs-reduction-factor)));
    }

    .pwr-image-box__title {
        font-size: 24px;
        font-size: max(var(--fs-min), calc(24px * var(--fs-reduction-factor)));
    }

    .pwr-image-box--is-link:hover .pwr-image-box__more-link {
        padding-top: calc(20px * var(--sp-reduction-factor));
    }

    .pwr-image-box__more-link--mobile {
        padding-top: calc(20px * var(--sp-reduction-factor));
    }

    .pwr-image-box__more-link--centered {
        font-size: 18px;
        font-size: max(var(--fs-min), calc(18px * var(--fs-reduction-factor)));
    }

    .pwr-image-box__icon--no-text {
        font-size: 25px;
        font-size: max(var(--fs-min), calc(25px * var(--fs-reduction-factor)));
    }

    .pwr-image-box--smaller .pwr-image-box__back .pwr-image-box__icon--no-text {
        font-size: 18px;
        font-size: max(var(--fs-min), calc(18px * var(--fs-reduction-factor)));
    }

    .pwr-image-box--smaller .pwr-image-box__front {
        padding: calc(40px * var(--sp-reduction-factor)) calc(30px * var(--sp-reduction-factor));
    }

    .pwr-image-box--smaller .pwr-image-box__back {
        padding: calc(40px * var(--sp-reduction-factor)) calc(30px * var(--sp-reduction-factor));
    }

    .pwr-image-box--smaller .pwr-image-box__title {
        font-size: 20px;
        font-size: max(var(--fs-min), calc(20px * var(--fs-reduction-factor)));
    }

    .pwr-image-box--style-below-2 .pwr-image-box__below {
        padding: calc(35px * var(--sp-reduction-factor)) calc(40px * var(--sp-reduction-factor));
    }

    .pwr-image-box--smaller.pwr-image-box--style-below-2 .pwr-image-box__below {
        padding: 30px calc(30px * var(--sp-reduction-factor));
    }

    .pwr-image-box.pwr-image-box--one-by-one:not(.swiper-slide) {
        width: 100% !important;
    }

    .pwr-image-box.pwr-image-box--two-by-one {
        width: 100% !important;
    }

    .pwr-image-box.pwr-image-box--one-by-two {
        width: 100% !important;
    }

    .pwr-image-box.pwr-image-box--two-by-two {
        width: 100% !important;
    }

    .pwr-image-box.pwr-image-box--4cols.pwr-image-box--two-by-one .pwr-image-box__img {
        height: 285px;
    }

    .pwr-image-box.pwr-image-box--4cols.pwr-image-box--two-by-two .pwr-image-box__img {
        height: 285px;
    }

    .pwr-image-box.pwr-image-box--3cols-rect.pwr-image-box--two-by-one .pwr-image-box__img {
        height: 285px;
    }

    .pwr-image-box.pwr-image-box--3cols-rect.pwr-image-box--two-by-two .pwr-image-box__img {
        height: 285px;
    }

    .pwr-image-box--style-below-2.pwr-image-box--3cols-rect.pwr-image-box--two-by-one .pwr-image-box__img {
        height: 240px;
    }

    .pwr-image-box--style-below-2.pwr-image-box--3cols-rect.pwr-image-box--two-by-two .pwr-image-box__img {
        height: 240px;
    }

    .pwr-image-box.pwr-image-box--two-by-one .pwr-image-box__img {
        height: 380px;
    }

    .pwr-image-box.pwr-image-box--two-by-two .pwr-image-box__img {
        height: 380px;
    }
}