/* === Custom Block Styling === */
.tripleImageBlock{
    padding: var(--CB-padding-top) var(--CB-padding-right) var(--CB-padding-bottom) var(--CB-padding-left);
    margin: var(--CB-margin-top) var(--CB-margin-bottom);
    background-color: var(--CB-background-color);
    background-image: var(--CB-background-image);
    background-position: var(--CB-background-position);
    background-size: cover;
}


.tripleImage__leftImage,
.tripleImage__centerImage,
.tripleImage__rightImage{
    padding-bottom: 400px;
    background-size: cover;
    background-position: center;
    scale: .95;
}

.tripleImage__leftImage{
    position: relative;
    bottom: 32px;
}
.tripleImage__rightImage{
    position: relative;
    bottom: -32px;
}



.tripleImage__centerImage{
    transform: translateY(64px);
    opacity: 0;
    transition: transform 0.4s ease-out, opacity 0.6s ease-out;
}
.tripleImage__centerImage.active{
    transform: translateY(0px);
    opacity: 1;
}


.tripleImage__leftImage{
    transform: translate(64px, 64px);
    opacity: 0;
    transition: transform 0.4s ease-out, opacity 0.6s ease-out;
}
.tripleImage__leftImage.active{
    transform: translate(0px, 0px);
    opacity: 1;
}


.tripleImage__rightImage{
    transform: translate(-64px, -64px);
    opacity: 0;
    transition: transform 0.4s ease-out, opacity 0.6s ease-out;
}
.tripleImage__rightImage.active{
    transform: translate(0px, 0px);
    opacity: 1;
}


@media screen and (max-width: 991.98px){
    .tripleImage__rightImage{
        display: none;
    }
    .tripleImage__centerImage,
    .tripleImage__leftImage{
        scale: 1;
    }
}