.ngparacascadeflex {
    position: relative;
}

.ngparacascadeflex-panorama {
    margin: 0 var(--gap);
}

@media ( min-width: 1280px) {
    .ngparacascadeflex {
        --columns: var(--columnsdesktop);
    }
}

@media ( min-width: 768px) and ( max-width: 1279px) {
    .ngparacascadeflex {
        --columns: var(--columnstablet);
    }
}

@media ( max-width: 767px) {
    .ngparacascadeflex {
        --columns: var(--columnsmobile);
    }
}

.ngparacascadeflex figure {
    display: none;
    margin: 0;
    padding: 0;
    position: absolute;
    left: calc(var(--column) * ((100% - ((var(--columns) - 1) * var(--gap))) / var(--columns) + var(--gap)));
    width: calc((100% - ((var(--columns) - 1) * var(--gap))) / var(--columns));
}

.ngparacascadeflex figure.ngparacascadeflex-hero {
    width: calc(2 * (100% - ((var(--columns) - 1) * var(--gap))) / var(--columns) +  var(--gap));
}

.ngparacascadeflex figure img {
    width: 100%;
    height: auto;
    display: block;
    box-shadow: var(--shadow, none);
    border-radius: var(--radius);
    background-color: #eeeeee;
}

.ngparacascadeflex-lazy {
    opacity: 0;
    transition: opacity 1s ease;
}

.ngparacascadeflex-loaded {
    opacity: 1;
}

.ngparacascadeflex-mode-captionsummary.ngparacascadeflex-caption-align-left figcaption h3 {
    text-align: left;
}

.ngparacascadeflex-mode-captionsummary.ngparacascadeflex-caption-align-center figcaption h3 {
    text-align: center;
}

.ngparacascadeflex-mode-captionsummary.ngparacascadeflex-caption-align-right figcaption h3 {
    text-align: right;
}

.ngparacascadeflex-mode-captionsummary.ngparacascadeflex-summary-align-left figcaption p {
    text-align: left;
}

.ngparacascadeflex-mode-captionsummary.ngparacascadeflex-summary-align-center figcaption p {
    text-align: center;
}

.ngparacascadeflex-mode-captionsummary.ngparacascadeflex-summary-align-right figcaption p {
    text-align: right;
}

.ngparacascadeflex-mode-captionsummary.ngparacascadeflex-summary-align-justify figcaption p {
    text-align: justify;
}

.ngparacascadeflex-mode-caption.ngparacascadeflex-caption-align-left figcaption p,
.ngparacascadeflex-mode-captioninside.ngparacascadeflex-caption-align-left figcaption p,
.ngparacascadeflex-mode-captioninsidehover.ngparacascadeflex-caption-align-left figcaption p {
    text-align: left;
}

.ngparacascadeflex-mode-caption.ngparacascadeflex-caption-align-center figcaption p,
.ngparacascadeflex-mode-captioninside.ngparacascadeflex-caption-align-center figcaption p,
.ngparacascadeflex-mode-captioninsidehover.ngparacascadeflex-caption-align-center figcaption p {
    text-align: center;
}

.ngparacascadeflex-mode-caption.ngparacascadeflex-caption-align-right figcaption p,
.ngparacascadeflex-mode-captioninside.ngparacascadeflex-caption-align-right figcaption p,
.ngparacascadeflex-mode-captioninsidehover.ngparacascadeflex-caption-align-right figcaption p {
    text-align: right;
}

.ngparacascadeflex-mode-captioninside figcaption,
.ngparacascadeflex-mode-captioninsidehover figcaption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: var(--padding);
    color: var(--colorforeground);
    background: var(--colorbackground);
    pointer-events: none;
    border-radius: 0 0 var(--radius) var(--radius);
}

.ngparacascadeflex-mode-captioninside figcaption p,
.ngparacascadeflex-mode-captioninsidehover figcaption p {
    margin-top: 0;
    margin-bottom: 0;
}

.ngparacascadeflex-mode-captionsummary h3 {
    margin-top: var(--padding);
}

.ngparacascadeflex-mode-captionsummary p:last-child {
    margin-bottom: 0;
}

.ngparacascadeflex-mode-caption p {
    margin-top: var(--padding);
    margin-bottom: 0;
}


@media (hover: hover) and (pointer: fine) {

    .ngparacascadeflex-mode-captioninsidehover figcaption {
        opacity: 0;
        transition: opacity 0.3s;
    }

    .ngparacascadeflex-mode-captioninsidehover a:hover + figcaption {
        opacity: 1;
    }
}

.ngparacascadeflex figure>a {
    outline: none;
}

.ngparacascadeflex figure>a:focus-visible img {
    outline: none;
    filter: brightness(50%) contrast(75%);
}