/* CSS Classes to be used fro the property CSS Class

    itemsNoMargin  --> Entfernt Abstände
    smartphoneReverseOrder  --> nützlich bei 2 Spalten, dreht Spalten in der Smartphone Ansicht
    centerContent --> Richtet Inhalt zentriert aus, zum Beispiel dei einem "Kästchen"
    textAlignLeft
    textAlignRight
*/



#blockEditor {
    position: relative;
}

.beItemContainer[data-containertype="Row"] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    --column-gap: 5%;
}

.itemsNoMargin .beItemContainer[data-containertype="Row"] {
    gap: 0;
    --column-gap: 0;
}

.beContainerRow {
}

.beContainerColumn {
    overflow: hidden;
    align-self: stretch;
}

.beContainerBlock {
    position: relative;
    clear: both;
}

/* Default margin/paddings */
.beContainerBlock {
    padding-bottom: 20px;
}

.beContainerBlock[data-itemname="Script"] {
    padding: 0;
}

.itemsNoMargin.beContainerBlock,
.itemsNoMargin .beContainerBlock {
    margin: 0;
    padding-bottom: 0;
}

.beField p:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
}

.hasPropertyBackgroundColor {
    color: #fff;
    padding: 15px 20px 40px 20px;
    margin-bottom: 20px;
}

.centerContent .beItemContainer[data-itemname="Card"] .beItem {
    padding: 15px 0 15px 0;
}

.centerContent .beItemContent,
.centerContent .beContainerBlock {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    text-align: center;
}

.centerContent .beItemContent h1,
.centerContent .beItemContent h2,
.centerContent .beItemContent h3,
.centerContent .beItemContent h4,
.centerContent .beItemContent h5,
.centerContent .beItemContent h6,
.centerContent .beContainerBlock h1,
.centerContent .beContainerBlock h2,
.centerContent .beContainerBlock h3,
.centerContent .beContainerBlock h4,
.centerContent .beContainerBlock h5,
.centerContent .beContainerBlock h6 {
    text-align: center;
}

.textAlignLeft .beItemContent,
.textAlignLeft .beContainerBlock {
    text-align: left;
}

.textAlignLeft .beItemContent h1,
.textAlignLeft .beItemContent h2,
.textAlignLeft .beItemContent h3,
.textAlignLeft .beItemContent h4,
.textAlignLeft .beItemContent h5,
.textAlignLeft .beItemContent h6,
.textAlignLeft .beContainerBlock h1,
.textAlignLeft .beContainerBlock h2,
.textAlignLeft .beContainerBlock h3,
.textAlignLeft .beContainerBlock h4,
.textAlignLeft .beContainerBlock h5,
.textAlignLeft .beContainerBlock h6 {
    text-align: left;
}

.textAlignRight .beItemContent,
.textAlignRight .beContainerBlock {
    text-align: right;
}

.textAlignRight .beItemContent h1,
.textAlignRight .beItemContent h2,
.textAlignRight .beItemContent h3,
.textAlignRight .beItemContent h4,
.textAlignRight .beItemContent h5,
.textAlignRight .beItemContent h6,
.textAlignRight .beContainerBlock h1,
.textAlignRight .beContainerBlock h2,
.textAlignRight .beContainerBlock h3,
.textAlignRight .beContainerBlock h4,
.textAlignRight .beContainerBlock h5,
.textAlignRight .beContainerBlock h6 {
    text-align: right;
}


.itemsNoMargin .hasPropertyBackgroundColor {
    margin: 0;
}

.hasPropertyBackgroundColor h1,
.hasPropertyBackgroundColor h2,
.hasPropertyBackgroundColor h3,
.hasPropertyBackgroundColor h4,
.hasPropertyBackgroundColor h5,
.hasPropertyBackgroundColor h6 {
    color: #fff;
}

.hasPropertyBackgroundColor a,
.hasPropertyBackgroundColor a:visited {
    color: #fff;
}

#main .hasPropertyBackgroundColor li:before {
    background-color: #fff;
}

.itemsNoMargin .childColumnHasPropertyBackgroundColor .beContainerColumn {
    padding: 15px 20px 40px 20px;
}

.hasPropertyColor h1,
.hasPropertyColor h2,
.hasPropertyColor h3,
.hasPropertyColor h4,
.hasPropertyColor h5,
.hasPropertyColor h6 {
    color: inherit;
}

[data-columncount="2"] > .beContainerColumn {
    /* width: calc((100% / columnCount) - Gap + (Gap / columnCount)); */
    width: calc((100% / 2) - var(--column-gap) + (var(--column-gap) / 2));
}

.itemsNoMargin [data-columncount="2"] > .beContainerColumn {
    width: calc(100% / 2);
}

[data-columncount="3"] > .beContainerColumn {
    width: calc((100% / 3) - var(--column-gap) + (var(--column-gap) / 3));
}

.itemsNoMargin [data-columncount="3"] > .beContainerColumn {
    width: calc(100% / 3);
}

[data-columncount="4"] > .beContainerColumn {
    width: calc((100% / 4) - var(--column-gap) + (var(--column-gap) / 4));
}

.itemsNoMargin [data-columncount="4"] > .beContainerColumn {
    width: calc(100% / 4);
}

[data-columncount="5"] > .beContainerColumn {
    width: calc((100% / 5) - var(--column-gap) + (var(--column-gap) / 5));
}

.itemsNoMargin [data-columncount="5"] > .beContainerColumn {
    width: calc(100% / 5);
}

[data-columncount="6"] > .beContainerColumn {
    width: calc((100% / 6) - var(--column-gap) + (var(--column-gap) / 6));
}

.itemsNoMargin [data-columncount="6"] > .beContainerColumn {
    width: calc(100% / 6);
}

[data-columncount="2"] > .beContainerColumn.beCol-1,
[data-columncount="3"] > .beContainerColumn.beCol-1 {
    width: calc((100% / 6) - var(--column-gap) + (var(--column-gap) / 6));
}

.itemsNoMargin [data-columncount="2"] > .beContainerColumn.beCol-1,
.itemsNoMargin [data-columncount="3"] > .beContainerColumn.beCol-1 {
    width: calc(100% / 6);
}

[data-columncount="2"] > .beContainerColumn.beCol-2,
[data-columncount="3"] > .beContainerColumn.beCol-2 {
    width: calc((100% / 6 * 2) - var(--column-gap) + (var(--column-gap) / 6 * 2));
}

.itemsNoMargin [data-columncount="2"] > .beContainerColumn.beCol-2,
.itemsNoMargin [data-columncount="3"] > .beContainerColumn.beCol-2 {
    width: calc(100% / 6 * 2);
}

[data-columncount="2"] > .beContainerColumn.beCol-3,
[data-columncount="3"] > .beContainerColumn.beCol-3 {
    width: calc((100% / 6 * 3) - var(--column-gap) + (var(--column-gap) / 6 * 3));
}

.itemsNoMargin [data-columncount="2"] > .beContainerColumn.beCol-3,
.itemsNoMargin [data-columncount="3"] > .beContainerColumn.beCol-3 {
    width: calc(100% / 6 * 3);
}

[data-columncount="2"] > .beContainerColumn.beCol-4,
[data-columncount="3"] > .beContainerColumn.beCol-4 {
    width: calc((100% / 6 * 4) - var(--column-gap) + (var(--column-gap) / 6 * 4));
}

.itemsNoMargin [data-columncount="2"] > .beContainerColumn.beCol-4,
.itemsNoMargin [data-columncount="3"] > .beContainerColumn.beCol-4 {
    width: calc(100% / 6 * 4);
}

[data-columncount="2"] > .beContainerColumn.beCol-5,
[data-columncount="3"] > .beContainerColumn.beCol-5 {
    width: calc((100% / 6 * 5) - var(--column-gap) + (var(--column-gap) / 6 * 5));
}

.itemsNoMargin [data-columncount="2"] > .beContainerColumn.beCol-5,
.itemsNoMargin [data-columncount="3"] > .beContainerColumn.beCol-5 {
    width: calc(100% / 6 * 5);
}


@media screen and (max-width: 767.9px) {
    .smartphoneReverseOrder .beItemContainer[data-containertype="Row"] {
        flex-flow: column-reverse;
    }


    .beContainerColumn,
    [data-columncount="2"] > .beContainerColumn,
    [data-columncount="2"] > .beContainerColumn.beCol-1,
    [data-columncount="2"] > .beContainerColumn.beCol-2,
    [data-columncount="2"] > .beContainerColumn.beCol-3,
    [data-columncount="2"] > .beContainerColumn.beCol-4,
    [data-columncount="2"] > .beContainerColumn.beCol-5,
    [data-columncount="3"] > .beContainerColumn,
    [data-columncount="3"] > .beContainerColumn.beCol-1,
    [data-columncount="3"] > .beContainerColumn.beCol-2,
    [data-columncount="3"] > .beContainerColumn.beCol-3,
    [data-columncount="3"] > .beContainerColumn.beCol-4,
    [data-columncount="3"] > .beContainerColumn.beCol-5,
    [data-columncount="4"] > .beContainerColumn,
    [data-columncount="4"] > .beContainerColumn.beCol-1,
    [data-columncount="4"] > .beContainerColumn.beCol-2,
    [data-columncount="4"] > .beContainerColumn.beCol-3,
    [data-columncount="4"] > .beContainerColumn.beCol-4,
    [data-columncount="4"] > .beContainerColumn.beCol-5,
    [data-columncount="5"] > .beContainerColumn,
    [data-columncount="5"] > .beContainerColumn.beCol-1,
    [data-columncount="5"] > .beContainerColumn.beCol-2,
    [data-columncount="5"] > .beContainerColumn.beCol-3,
    [data-columncount="5"] > .beContainerColumn.beCol-4,
    [data-columncount="5"] > .beContainerColumn.beCol-5,
    .itemsNoMargin .beContainerColumn,
    .itemsNoMargin [data-columncount="2"] > .beContainerColumn,
    .itemsNoMargin [data-columncount="2"] > .beContainerColumn.beCol-1,
    .itemsNoMargin [data-columncount="2"] > .beContainerColumn.beCol-2,
    .itemsNoMargin [data-columncount="2"] > .beContainerColumn.beCol-3,
    .itemsNoMargin [data-columncount="2"] > .beContainerColumn.beCol-4,
    .itemsNoMargin [data-columncount="2"] > .beContainerColumn.beCol-5,
    .itemsNoMargin [data-columncount="3"] > .beContainerColumn,
    .itemsNoMargin [data-columncount="3"] > .beContainerColumn.beCol-1,
    .itemsNoMargin [data-columncount="3"] > .beContainerColumn.beCol-2,
    .itemsNoMargin [data-columncount="3"] > .beContainerColumn.beCol-3,
    .itemsNoMargin [data-columncount="3"] > .beContainerColumn.beCol-4,
    .itemsNoMargin [data-columncount="3"] > .beContainerColumn.beCol-5,
    .itemsNoMargin [data-columncount="4"] > .beContainerColumn,
    .itemsNoMargin [data-columncount="4"] > .beContainerColumn.beCol-1,
    .itemsNoMargin [data-columncount="4"] > .beContainerColumn.beCol-2,
    .itemsNoMargin [data-columncount="4"] > .beContainerColumn.beCol-3,
    .itemsNoMargin [data-columncount="4"] > .beContainerColumn.beCol-4,
    .itemsNoMargin [data-columncount="4"] > .beContainerColumn.beCol-5,
    .itemsNoMargin [data-columncount="5"] > .beContainerColumn,
    .itemsNoMargin [data-columncount="5"] > .beContainerColumn.beCol-1,
    .itemsNoMargin [data-columncount="5"] > .beContainerColumn.beCol-2,
    .itemsNoMargin [data-columncount="5"] > .beContainerColumn.beCol-3,
    .itemsNoMargin [data-columncount="5"] > .beContainerColumn.beCol-4,
    .itemsNoMargin [data-columncount="5"] > .beContainerColumn.beCol-5 {
        width: 100%;
    }
}


/* ImageSlider */


.beSwiper-container
{
    position: relative;
}

.swiper-slide img {
    width: 100%;
    margin: 0;
    padding: 0;
    vertical-align: top;
}

.hasPropertyImageSliderAspectRatio img {
    vertical-align: top;
    /* Part below needed if portrait images should be cut above and below. Without this the image is only cut below*/
    object-fit: cover;
    width: 100%;
    max-height: 100%;
    aspect-ratio: unset;
}


.aspectRatioOriginal .swiper-slide img {
    object-fit: inherit;
    aspect-ratio: unset;
}

.aspectRatio1To1 .swiper-slide img {
    aspect-ratio: 1/1;
}

.aspectRatio5To4 .swiper-slide img {
    aspect-ratio: 5/4;
}

.aspectRatio4To3 .swiper-slide img {
    aspect-ratio: 4/3;
}

.aspectRatio3To2 .swiper-slide img {
    aspect-ratio: 3/2;
}

.aspectRatio16To9 .swiper-slide img {
    aspect-ratio: 16/9;
}

.aspectRatio3To1 .swiper-slide img {
    aspect-ratio: 3/1;
}

.aspectRatio4To5 .swiper-slide img {
    aspect-ratio: 4/5;
}

.aspectRatio3To4 .swiper-slide img {
    aspect-ratio: 3/4;
}

.aspectRatio2To3 .swiper-slide img {
    aspect-ratio: 2/3;
}

.aspectRatio9To16 .swiper-slide img {
    aspect-ratio: 9/16;
}

.aspectRatio1To3 .swiper-slide img {
    aspect-ratio: 1/3;
}

.swiper-button-next, .swiper-button-prev {
    color: #fff !important;
}

.beItem[data-itemname="ImageSlider"] {
    margin-bottom: 50px;
    overflow: hidden;
}

.itemsNoMargin .beItem[data-itemname="ImageSlider"] {
    margin-bottom: 0;
}

.swiper-imageCaption
{
    margin-top: 15px;
}

@media screen and (max-width: 1023.9px) {
    .beItem[data-itemname="ImageSlider"] {
        margin-bottom: 30px;
    }
}

@media screen and (max-width: 580px) {
    .beItem[data-itemname="ImageSlider"] {
        margin-bottom: 20px;
    }
}


/* End ImageSlider */

/* ImageGallery */

figure {
    margin: 0;
}

.beImageGalleryImagesContainer {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

.imagesPerRow6 .beImageGalleryImagesContainer {
    gap: 10px;
}

.imagesPerRow5 .beImageGalleryImagesContainer {
    gap: 15px;
}

.imagesPerRow4 .beImageGalleryImagesContainer {
    gap: 30px;
}

.imagesPerRow3 .beImageGalleryImagesContainer {
    gap: 30px;
}

.imagesPerRow2 .beImageGalleryImagesContainer {
    gap: 30px;
}

.imagesPerRow1 .beImageGalleryImagesContainer {
    gap: 0;
    row-gap: 30px;
}

.beImageGalleryImageContainer {
    width: Calc(100% / 4 - (30px / 4 * 3));
    border: 1px solid #ccc;
    box-shadow: 2px 2px 6px 0px rgba(0,0,0,0.3);
    background-color: #fff;
    position: relative;
    overflow: hidden;
}

.imagesPerRow6 .beImageGalleryImageContainer {
    width: Calc(100% / 6 - (10px / 6 * 5));
}

.imagesPerRow5 .beImageGalleryImageContainer {
    width: Calc(100% / 5 - (15px / 5 * 4));
}

.imagesPerRow4 .beImageGalleryImageContainer {
    width: Calc(100% / 4 - (30px / 4 * 3));
}

.imagesPerRow3 .beImageGalleryImageContainer {
    width: Calc(100% / 3 - (30px / 3 * 2));
}

.imagesPerRow2 .beImageGalleryImageContainer {
    width: Calc(100% / 2 - (30px / 2 * 1));
}

.imagesPerRow1 .beImageGalleryImageContainer {
    width: 100%;
}

.beContainerColumn .beContainer:not(.hasPropertyImageGalleryImagesPerRow) .beImageGalleryImagesContainer {
    gap: 10px;
}

.beContainerColumn .beContainer:not(.hasPropertyImageGalleryImagesPerRow) .beImageGalleryImageContainer {
    width: Calc(100% / 2 - 5px);
}

.beContainerColumn.beCol-4 .beContainer:not(.hasPropertyImageGalleryImagesPerRow) .beImageGalleryImageContainer,
.beContainerColumn.beCol-5 .beContainer:not(.hasPropertyImageGalleryImagesPerRow) .beImageGalleryImageContainer {
    width: Calc(100% / 3 - 10px);
}

.beImageGalleryImageContainer img {
    vertical-align: top;
    /* Part below needed if portrait images should be cut above and below. Without this the image is only cut below*/
    object-fit: cover;
    width: 100%;
    max-height: 100%;
    aspect-ratio: 4/3;
}

.aspectRatioOriginal .beImageGalleryImageContainer {
    border: none;
    box-shadow: none;
    background-color: transparent;
}

.aspectRatioOriginal .beImageGalleryImageContainer img {
    object-fit: inherit;
    width: 100%;
    aspect-ratio: unset;
}

.aspectRatio1To1 .beImageGalleryImageContainer img {
    aspect-ratio: 1/1;
}

.aspectRatio5To4 .beImageGalleryImageContainer img {
    aspect-ratio: 5/4;
}

.aspectRatio4To3 .beImageGalleryImageContainer img {
    aspect-ratio: 4/3;
}

.aspectRatio3To2 .beImageGalleryImageContainer img {
    aspect-ratio: 3/2;
}

.aspectRatio16To9 .beImageGalleryImageContainer img {
    aspect-ratio: 16/9;
}

.aspectRatio3To1 .beImageGalleryImageContainer img {
    aspect-ratio: 3/1;
}

.aspectRatio4To5 .beImageGalleryImageContainer img {
    aspect-ratio: 4/5;
}

.aspectRatio3To4 .beImageGalleryImageContainer img {
    aspect-ratio: 3/4;
}

.aspectRatio2To3 .beImageGalleryImageContainer img {
    aspect-ratio: 2/3;
}

.aspectRatio9To16 .beImageGalleryImageContainer img {
    aspect-ratio: 9/16;
}

.aspectRatio1To3 .beImageGalleryImageContainer img {
    aspect-ratio: 1/3;
}


.beImageGalleryImageDescription {
    padding: 5px 10px 5px 10px;
    font-size: 16px;
    position: absolute;
    bottom: -40px;
    background-color: rgba(255,255,255,0.9);
    right: 0;
    left: 0;
    transition: all 0.3s;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.beImageGalleryImageContainer:hover .beImageGalleryImageDescription {
    bottom: 0;
}

.beImageGalleryImageContainer a,
.beImageGalleryImageContainer a:visited,
.beImageGalleryImageContainer a:hover {
    text-decoration: none;
    color: #4C86A5;
}

@media screen and (max-width: 1279.9px) {

    .beImageGalleryImagesContainer {
        gap: 20px;
    }

    .imagesPerRow6 .beImageGalleryImagesContainer {
        gap: 20px;
    }

    .imagesPerRow5 .beImageGalleryImagesContainer {
        gap: 20px;
    }

    .imagesPerRow4 .beImageGalleryImagesContainer {
        gap: 20px;
    }

    .imagesPerRow3 .beImageGalleryImagesContainer {
        gap: 20px;
    }

    .imagesPerRow2 .beImageGalleryImagesContainer {
        gap: 20px;
    }

    .imagesPerRow1 .beImageGalleryImagesContainer {
        gap: 0;
        row-gap: 30px;
    }


    .beImageGalleryImageContainer {
        width: Calc(100% / 3 - (20px / 3 * 2));
    }

    .imagesPerRow6 .beImageGalleryImageContainer {
        width: Calc(100% / 4 - (20px / 4 * 3));
    }

    .imagesPerRow5 .beImageGalleryImageContainer {
        width: Calc(100% / 4 - (20px / 4 * 3));
    }

    .imagesPerRow4 .beImageGalleryImageContainer {
        width: Calc(100% / 3 - (20px / 3 * 2));
    }

    .imagesPerRow3 .beImageGalleryImageContainer {
        width: Calc(100% / 3 - (20px / 3 * 2));
    }

    .imagesPerRow2 .beImageGalleryImageContainer {
        width: Calc(100% / 2 - (20px / 2 * 1));
    }

    .imagesPerRow1 .beImageGalleryImageContainer {
        width: 100%;
    }

    .beContainerColumn .beImageGalleryImagesContainer {
        gap: 10px;
    }

    .beContainerColumn .beImageGalleryImageContainer {
        width: Calc(100% / 2 - 5px);
    }
}

@media screen and (max-width: 1023.9px) {

    .beImageGalleryImagesContainer {
        gap: 10px;
    }

    .imagesPerRow6 .beImageGalleryImagesContainer {
        gap: 10px;
    }

    .imagesPerRow5 .beImageGalleryImagesContainer {
        gap: 10px;
    }

    .imagesPerRow4 .beImageGalleryImagesContainer {
        gap: 10px;
    }

    .imagesPerRow3 .beImageGalleryImagesContainer {
        gap: 10px;
    }

    .imagesPerRow2 .beImageGalleryImagesContainer {
        gap: 10px;
    }

    .imagesPerRow1 .beImageGalleryImagesContainer {
        gap: 0;
        row-gap: 30px;
    }

    .beImageGalleryImageContainer {
        width: Calc(100% / 2 - 5px);
    }

    .imagesPerRow6 .beImageGalleryImageContainer {
        width: Calc(100% / 3 - (10px / 3 * 2));
    }

    .imagesPerRow5 .beImageGalleryImageContainer {
        width: Calc(100% / 3 - (10px / 3 * 2));
    }

    .imagesPerRow4 .beImageGalleryImageContainer {
        width: Calc(100% / 2 - (10px / 2 * 1));
    }

    .imagesPerRow3 .beImageGalleryImageContainer {
        width: Calc(100% / 2 - (10px / 2 * 1));
    }

    .imagesPerRow2 .beImageGalleryImageContainer {
        width: Calc(100% / 2 - (10px / 2 * 1));
    }

    .imagesPerRow1 .beImageGalleryImageContainer {
        width: 100%;
    }

    .beContainerColumn .beImageGalleryImageContainer {
        width: Calc(100% / 2 - 5px);
    }

    .beContainerColumn.beCol-4 .beImageGalleryImageContainer,
    .beContainerColumn.beCol-5 .beImageGalleryImageContainer {
        width: Calc(100% / 2 - 10px);
    }

    .beContainerColumn.beCol-1 .beImageGalleryImagesContainer,
    .beContainerColumn.beCol-2 .beImageGalleryImagesContainer,
    .beContainerColumn.beCol-3 .beImageGalleryImagesContainer {
        gap: 0;
        display: block;
    }

    .beContainerColumn.beCol-1 .beImageGalleryImageContainer,
    .beContainerColumn.beCol-2 .beImageGalleryImageContainer,
    .beContainerColumn.beCol-3 .beImageGalleryImageContainer {
        width: 100%;
        margin-bottom: 30px;
    }
}


@media screen and (max-width: 580px) {

    .beImageGalleryImagesContainer {
        gap: 0;
        display: block;
    }

    .beImageGalleryImageContainer,
    .imagesPerRow1 .beImageGalleryImageContainer,
    .imagesPerRow2 .beImageGalleryImageContainer,
    .imagesPerRow3 .beImageGalleryImageContainer,
    .imagesPerRow4 .beImageGalleryImageContainer,
    .imagesPerRow5 .beImageGalleryImageContainer,
    .imagesPerRow6 .beImageGalleryImageContainer,
    .beContainerColumn .beContainer:not(.hasPropertyImageGalleryImagesPerRow) .beImageGalleryImageContainer,
    .beContainerColumn.beCol-4 .beContainer:not(.hasPropertyImageGalleryImagesPerRow) .beImageGalleryImageContainer,
    .beContainerColumn.beCol-5 .beContainer:not(.hasPropertyImageGalleryImagesPerRow) .beImageGalleryImageContainer {
        width: 100%;
        margin-bottom: 30px;
    }

}

/* End ImageGallery */


/* Card */

.beItemContainer[data-itemname="Card"] {
    display: flex;
    flex-wrap: wrap;
    row-gap: 30px;
    column-gap: 30px;
}

.itemsNoMargin .beItemContainer[data-itemname="Card"],
.itemsNoMargin.imagesPerRow6 .beItemContainer[data-itemname="Card"],
.itemsNoMargin.imagesPerRow5 .beItemContainer[data-itemname="Card"],
.itemsNoMargin.imagesPerRow4 .beItemContainer[data-itemname="Card"],
.itemsNoMargin.imagesPerRow3 .beItemContainer[data-itemname="Card"],
.itemsNoMargin.imagesPerRow2 .beItemContainer[data-itemname="Card"],
.itemsNoMargin.imagesPerRow1 .beItemContainer[data-itemname="Card"] {
    row-gap: 0;
    column-gap: 0;
}

.imagesPerRow6 .beItemContainer[data-itemname="Card"] {
    row-gap: 10px;
    column-gap: 10px;
}

.imagesPerRow5 .beItemContainer[data-itemname="Card"] {
    row-gap: 15px;
    column-gap: 15px;
}

.imagesPerRow4 .beItemContainer[data-itemname="Card"] {
    row-gap: 30px;
    column-gap: 30px;
}

.imagesPerRow3 .beItemContainer[data-itemname="Card"] {
    row-gap: 30px;
    column-gap: 30px;
}

.imagesPerRow2 .beItemContainer[data-itemname="Card"] {
    row-gap: 30px;
    column-gap: 30px;
}

.imagesPerRow1 .beItemContainer[data-itemname="Card"] {
    gap: 0;
    row-gap: 30px;
}

.beItem[data-itemname="Card"] {
    width: Calc(100% / 3 - (30px / 3 * 2));
    box-shadow: rgba(50, 50, 93, 0.20) 0px 13px 27px -5px, rgba(0, 0, 0, 0.2) 0px 8px 16px -8px;
    position: relative;
}

.itemsNoMargin .beItem[data-itemname="Card"] {
    width: Calc(100% / 3);
}

.imagesPerRow6 .beItem[data-itemname="Card"] {
    width: Calc(100% / 6 - (10px / 6 * 5));
}

.itemsNoMargin.imagesPerRow6 .beItem[data-itemname="Card"] {
    width: Calc(100% / 6);
}

.imagesPerRow5 .beItem[data-itemname="Card"] {
    width: Calc(100% / 5 - (15px / 5 * 4));
}

.itemsNoMargin.imagesPerRow5 .beItem[data-itemname="Card"] {
    width: Calc(100% / 5);
}

.imagesPerRow4 .beItem[data-itemname="Card"] {
    width: Calc(100% / 4 - (30px / 4 * 3));
}

.itemsNoMargin.imagesPerRow4 .beItem[data-itemname="Card"] {
    width: Calc(100% / 4);
}

.imagesPerRow3 .beItem[data-itemname="Card"] {
    width: Calc(100% / 3 - (30px / 3 * 2));
}

.itemsNoMargin.imagesPerRow3 .beItem[data-itemname="Card"] {
    width: Calc(100% / 3);
}

.imagesPerRow2 .beItem[data-itemname="Card"] {
    width: Calc(100% / 2 - (30px / 2 * 1));
}

.itemsNoMargin.imagesPerRow2 .beItem[data-itemname="Card"] {
    width: Calc(100% / 2);
}

.imagesPerRow1 .beItem[data-itemname="Card"] {
    width: 100%;
}

.itemsNoMargin.imagesPerRow1 .beItem[data-itemname="Card"] {
    width: 100%;
}


.beCol-1 .beItem[data-itemname="Card"],
.beCol-2 .beItem[data-itemname="Card"] {
    width: 100%;
}

.beItem[data-itemname="Card"] .beFieldDataTypecKEditorText {
    padding: 15px 15px 15px 15px;
}

.centerContent .beItem[data-itemname="Card"] .beFieldDataTypecKEditorText {
    padding: 0;
}

.beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    vertical-align: top;
    object-fit: cover;
    width: 100%;
    max-height: 100%;
    aspect-ratio: 16/9;
}

.aspectRatioOriginal .beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    object-fit: inherit;
    width: 100%;
    aspect-ratio: unset;
}

.aspectRatio1To1 .beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    aspect-ratio: 1/1;
}

.aspectRatio5To4 .beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    aspect-ratio: 5/4;
}

.aspectRatio4To3 .beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    aspect-ratio: 4/3;
}

.aspectRatio3To2 .beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    aspect-ratio: 3/2;
}

.aspectRatio16To9 .beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    aspect-ratio: 16/9;
}

.aspectRatio3To1 .beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    aspect-ratio: 3/1;
}

.aspectRatio4To5 .beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    aspect-ratio: 4/5;
}

.aspectRatio3To4 .beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    aspect-ratio: 3/4;
}

.aspectRatio2To3 .beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    aspect-ratio: 2/3;
}

.aspectRatio9To16 .beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    aspect-ratio: 9/16;
}

.aspectRatio1To3 .beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls img {
    aspect-ratio: 1/3;
}

.beItem[data-itemname="Card"] .beItemLink {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
}

.beItem[data-itemname="Card"] .beItemLink,
.beItem[data-itemname="Card"] .beItemLink:visited {
    color: inherit;
    text-decoration: none;
}

.beItem[data-itemname="Card"] .beItemLink:hover {
    text-decoration: none;
}

.beItem[data-itemname="Card"].hasOverlayLink:hover {
    background-color: #F4F4F4;
}

.beItem[data-itemname="Card"] .beFieldDataTypeimageWithControls
{
    overflow: hidden;
}

.beItem[data-itemname="Card"] img {
    transition: all 0.3s;
}

.beItem[data-itemname="Card"].hasOverlayLink:hover img {
    /* opacity: 0.65;*/
    transform: scale(1.05);
}

.beItem[data-itemname="Card"] .beItemContent {
    position: relative;
    pointer-events: none;
    z-index: 1;
}

.beItem[data-itemname="Card"] .beItemContent a {
    pointer-events: all;
    position: relative;
}

.beItem[data-itemname="Card"].hasOverlayLink.hasPropertyBackgroundColor:hover {
    opacity: 0.7;
}


@media screen and (max-width: 1279.9px) {

    .beItemContainer[data-itemname="Card"] {
        gap: 20px;
    }

    .imagesPerRow6 .beItemContainer[data-itemname="Card"] {
        gap: 20px;
    }

    .imagesPerRow5 .beItemContainer[data-itemname="Card"] {
        gap: 20px;
    }

    .imagesPerRow4 .beItemContainer[data-itemname="Card"] {
        gap: 20px;
    }

    .imagesPerRow3 .beItemContainer[data-itemname="Card"] {
        gap: 20px;
    }

    .imagesPerRow2 .beItemContainer[data-itemname="Card"] {
        gap: 20px;
    }

    .imagesPerRow1 .beItemContainer[data-itemname="Card"] {
        gap: 0;
        row-gap: 30px;
    }

    .itemsNoMargin .beItemContainer[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow6 .beItemContainer[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow5 .beItemContainer[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow4 .beItemContainer[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow3 .beItemContainer[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow2 .beItemContainer[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow1 .beItemContainer[data-itemname="Card"] {
        gap: 0;
        row-gap: 0;
    }

    .beItem[data-itemname="Card"] {
        width: Calc(100% / 3 - (20px / 3 * 2));
    }

    .itemsNoMargin .beItem[data-itemname="Card"] {
        width: Calc(100% / 3);
    }

    .imagesPerRow6 .beItem[data-itemname="Card"] {
        width: Calc(100% / 4 - (20px / 4 * 3));
    }

    .itemsNoMargin.imagesPerRow6 .beItem[data-itemname="Card"] {
        width: Calc(100% / 4);
    }

    .imagesPerRow5 .beItem[data-itemname="Card"] {
        width: Calc(100% / 4 - (20px / 4 * 3));
    }

    .itemsNoMargin.imagesPerRow5 .beItem[data-itemname="Card"] {
        width: Calc(100% / 4);
    }

    .imagesPerRow4 .beItem[data-itemname="Card"] {
        width: Calc(100% / 3 - (20px / 3 * 2));
    }

    .itemsNoMargin.imagesPerRow4 .beItem[data-itemname="Card"] {
        width: Calc(100% / 3);
    }

    .imagesPerRow3 .beItem[data-itemname="Card"] {
        width: Calc(100% / 3 - (20px / 3 * 2));
    }

    .itemsNoMargin.imagesPerRow3 .beItem[data-itemname="Card"] {
        width: Calc(100% / 3);
    }

    .imagesPerRow2 .beItem[data-itemname="Card"] {
        width: Calc(100% / 2 - (20px / 2 * 1));
    }

    .itemsNoMargin.imagesPerRow2 .beItem[data-itemname="Card"] {
        width: Calc(100% / 2);
    }

    .imagesPerRow1 .beItem[data-itemname="Card"] {
        width: 100%;
    }

    .itemsNoMargin.imagesPerRow1 .beItem[data-itemname="Card"] {
        width: 100%;
    }
}

@media screen and (max-width: 1023.9px) {

    .beItemContainer[data-itemname="Card"] {
        gap: 10px;
    }

    .imagesPerRow6 .beItemContainer[data-itemname="Card"] {
        gap: 10px;
    }

    .imagesPerRow5 .beItemContainer[data-itemname="Card"] {
        gap: 10px;
    }

    .imagesPerRow4 .beItemContainer[data-itemname="Card"] {
        gap: 10px;
    }

    .imagesPerRow3 .beItemContainer[data-itemname="Card"] {
        gap: 10px;
    }

    .imagesPerRow2 .beItemContainer[data-itemname="Card"] {
        gap: 10px;
    }

    .imagesPerRow1 .beItemContainer[data-itemname="Card"] {
        gap: 0;
        row-gap: 30px;
    }

    .itemsNoMargin .beItemContainer[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow6 .beItemContainer[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow5 .beItemContainer[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow4 .beItemContainer[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow3 .beItemContainer[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow2 .beItemContainer[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow1 .beItemContainer[data-itemname="Card"] {
        gap: 0;
        row-gap: 0;
    }

    .beItem[data-itemname="Card"] {
        width: Calc(100% / 2 - (10px / 2 * 1));
    }

    .itemsNoMargin .beItem[data-itemname="Card"] {
        width: Calc(100% / 2);
    }

    .imagesPerRow6 .beItem[data-itemname="Card"] {
        width: Calc(100% / 2 - (10px / 3 * 2));
    }

    .itemsNoMargin.imagesPerRow6 .beItem[data-itemname="Card"] {
        width: Calc(100% / 2);
    }

    .imagesPerRow5 .beItem[data-itemname="Card"] {
        width: Calc(100% / 2 - (10px / 3 * 2));
    }

    .itemsNoMargin.imagesPerRow5 .beItem[data-itemname="Card"] {
        width: Calc(100% / 2);
    }

    .imagesPerRow4 .beItem[data-itemname="Card"] {
        width: Calc(100% / 2 - (10px / 2 * 1));
    }

    .itemsNoMargin.imagesPerRow4 .beItem[data-itemname="Card"] {
        width: Calc(100% / 2);
    }

    .imagesPerRow3 .beItem[data-itemname="Card"] {
        width: Calc(100% / 2 - (10px / 2 * 1));
    }

    .itemsNoMargin.imagesPerRow3 .beItem[data-itemname="Card"] {
        width: Calc(100% / 2);
    }

    .imagesPerRow2 .beItem[data-itemname="Card"] {
        width: Calc(100% / 2 - (10px / 2 * 1));
    }

    .itemsNoMargin.imagesPerRow2 .beItem[data-itemname="Card"] {
        width: Calc(100% / 2);
    }

    .imagesPerRow1 .beItem[data-itemname="Card"] {
        width: 100%;
    }

    .itemsNoMargin.imagesPerRow1 .beItem[data-itemname="Card"] {
        width: 100%;
    }

    .beCol-1 .beItem[data-itemname="Card"],
    .beCol-2 .beItem[data-itemname="Card"] {
        width: 100%;
    }
}

@media screen and (max-width: 450px) {

    .beItem[data-itemname="Card"],
    .imagesPerRow1 .beItem[data-itemname="Card"],
    .imagesPerRow2 .beItem[data-itemname="Card"],
    .imagesPerRow3 .beItem[data-itemname="Card"],
    .imagesPerRow4 .beItem[data-itemname="Card"],
    .imagesPerRow5 .beItem[data-itemname="Card"],
    .imagesPerRow6 .beItem[data-itemname="Card"],
    .itemsNoMargin .beItem[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow1 .beItem[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow2 .beItem[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow3 .beItem[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow4 .beItem[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow5 .beItem[data-itemname="Card"],
    .itemsNoMargin.imagesPerRow6 .beItem[data-itemname="Card"] {
        width: 100%;
    }
}

/* End Card*/

/* Form */

.form-group.plaincontent {
    padding: 0;
    margin: 0;
}

.formFieldPlainContent p:last-child {
    padding: 0;
    margin: 0;
}

.beItem[data-itemname="Form"] .inputContainer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.beItem[data-itemname="Form"] .form-group.radio {
    margin-bottom: 17px;
}

@media screen and (max-width: 450px) {

    .beItem[data-itemname="Form"] .inputContainer {
        display: block;
    }

    .beItem[data-itemname="Form"] .form-group {
        width: 100% !important;
    }

}

/* End Form*/

/* Breadcrumbs */

#breadcrumbs {
    margin-bottom: 30px;
}

#main nav.breadcrumbNav ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

#main nav.breadcrumbNav li {
    display: inline;
    margin: 0;
    padding: 0;
}

#main nav.breadcrumbNav li:before {
    display: none;
}

.breadcrumbLink {
    font-size: 17px;
}

.breadcrumbSeparator {
    font-size: 14px;
    margin: 0 12px 0 12px;
}

@media screen and (max-width: 1023.9px) {

.breadcrumbLink {
    font-size: 15px;
}

.breadcrumbSeparator {
    font-size: 13px;
    margin: 0 10px 0 10px;
}
}

/* End Breadcrumbs */

/* Accordion */

.accordion {
    overflow: hidden;
    border-top: 1px solid #ddd;
    position: relative;
}

.hasPropertyBackgroundColor .accordion {
    border: none;
}

.accordion input {
    position: absolute;
    opacity: 0;
    z-index: -1;
}

.accordionContent {
    max-height: 35px;
    transition: all 0.25s ease;
    padding: 15px 15px 35px 0;
}

.accordion input:checked + .accordionLabel + .accordionContent {
    padding: 15px 15px 15px 0;
}

.hasPropertyBackgroundColor input:checked + .accordionLabel + .accordionContent {
    padding: 15px 15px 15px 0;
}

.hasPropertyBackgroundColor.hasPropertyAccordionTitle {
    padding: 0 20px 40px 20px;
}

.accordionLabel.hasTitle + .accordionContent {
    max-height: 0;
    padding: 0 15px 0 0;
}

.accordionLabel {
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    display: block;
    width: 100%;
    min-height: 35px;
    padding: 15px 0 15px 0;
}

.accordionLabel.hasTitle {
    position: relative;
    display: block;
    width: 100%;
    min-height: 35px;
    padding: 15px 0 0 0;
}

.accordionLabel .accordionLabelIcon {
    transition: all 0.25s ease-in-out;
    position: absolute;
    top: 0;
    right: 0;
}

.hasPropertyBackgroundColor .accordionLabel .accordionLabelIcon {
    top: 10px;
}

.accordion input:checked + .accordionLabel .accordionLabelIcon {
    transform: rotate(180deg);
}

.accordion input:checked ~ .accordionContent,
.accordion input:checked ~ .accordionLabel.hasTitle + .accordionContent {
    max-height: 150vh;
}

.beContainer[data-itemname="ImageSlider"] + .beContainer[data-itemname="Breadcrumbs"] {
    margin-top: -45px;
}

/* End Accordion */