/* BALLOON FOR FILLING THE SPACE BETWEEN HEADER AND FOOTER */
body {
    height: 100vh;
}

.main {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.balloon {
    height: 100%;
    flex: 1 0 auto;
}
/* BALLOON FOR FILLING THE SPACE BETWEEN HEADER AND FOOTER END */

.modal-full {
    min-width: 90%;
}

.modal-full .modal-content {
    min-height: 90vh;
}

/* Hide the bottom pagination on larger screens */
@media (min-width: 1100px) {
    .bottom-pagination {
        display: none !important;
    }
}

/* Hide the top pagination on smaller screens */
@media (max-width: 1100px) {
    .top-pagination {
        display: none !important;
    }
}


.link-text-color {
    color: var(--thm-base);
    transition: font-weight 0.3s ease, color 0.3s ease;
}

.link-text-color:hover {
    color: var(--thm-base);
    font-weight: bold;
}

/* 360* view button */
.badge {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    display: block;
    border-radius: 50%;
}

.badge img {
    transition: filter 0.3s ease;
}

/* INDEX SLIDER */

/* Owl moves .active to the next slide as soon as the fade starts, which removed the theme's
   zoom from the outgoing image and snapped it back to scale(1) while it was still visible.
   Owl adds .owl-animated-out first, so keeping the same animation here lets the zoom carry
   on through the fade-out. Keep it infinite: an animationend from the image would bubble up
   to Owl's fade-end handler (.one("animationend")) and break the slide cleanup. */
.banner-carousel .owl-animated-out .slide-item .image-layer {
    animation-name: slideBgImage;
    animation-duration: 7000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.index-slider-text-box {
    max-width: 32rem;

    float: left;
    border-left: 1px solid #9FFC04;
    position: relative;
    height: auto;
    overflow: visible;
    padding-left: 2.25rem !important;
}

/* .index-slider-text-box::before {
    content: "";
    position: absolute;
    top: 10%;
    bottom: 10%;
    left: 0;
    border-left: 1px solid #9FFC04;
} */




.index-slider-text-outer-box {
    max-width: 32rem;

    float: left;
    border-left: 1px solid  #9FFC04;
    position: relative;
    /* height: auto; */
    overflow: visible;
    padding-left: 5px;
}

.banner-heading {
    margin-top: -1.125rem;
    margin-bottom: 1.875rem;
    opacity: 1;
    color: white;
    font-size: 3.25rem;
    font-weight: 700;
    font-style: Bold;
    letter-spacing: 0rem;
    text-align: left;
    line-height: 4rem;
}

.italian-banner-heading {
    opacity: 50%;
    margin-bottom: -0.5rem;
    color: white;
    font-size: 3.25rem;
    font-weight: 700;
    font-style: Bold;
    letter-spacing: 0px;
    text-align: left;
    line-height: 3.8125rem;
}

@media (max-width: 625px) {
    .banner-heading,
    .italian-banner-heading {
        font-size: 2.5rem;
        line-height: 3rem;
    }
}


/* MAIN NAVIGATION BAR */

.content-main-nav > li > a {
    color: white !important;
}

/* .hover-effect:hover {
    color: var(--thm-base) !important;
} */
.hover-effect:hover {
    color: var(--thm-base);
    /* filter: brightness(0) saturate(100%) invert(46%) sepia(94%) saturate(1357%) hue-rotate(74deg) brightness(103%) contrast(101%); */
}
.hover-effect-black:hover {
    filter: brightness(0);
}

.hover-effect-icon-filter:hover {
    /* filter: brightness(0.8) saturate(1.5) contrast(1.2) !important; */
    /* filter: brightness(0) saturate(100%) invert(46%) sepia(94%) saturate(1357%) hue-rotate(74deg) brightness(103%) contrast(101%); */
    filter: invert(62%) sepia(83%) saturate(364%) hue-rotate(45deg) brightness(90%) contrast(96%);
}

.hover-effect-icon:hover #Oval,
.hover-effect-icon:hover #Path {
    stroke: var(--thm-base);
}
.hover-effect-icon:hover #Oval2 {
    fill: var(--thm-base);
}

@media (max-width: 992px) {
    .hover-effect-icon #Oval,
    .hover-effect-icon #Path {
        stroke:  #ffffff !important;
    }
    .hover-effect-icon #Oval2 {
        fill: #ffffff !important;
    }
}

.nav-position-absolute {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 91;
}

.nav-position {
    /* position: absolute; */
    top: 0;
    left: 0;
    width: 100%;
    z-index: 91;
}

.inner-nav-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 2.25rem;
    width: 100%;
    max-width: 1366px;
    margin: auto;
}

.nav-links-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: 0;
    background-color: rgba(216, 216, 216, 0.2);
    padding: 0 28px;
    max-height: 62px;
    border-radius: 31px;
}

@media (max-width: 992px) {
    /* links are hidden on mobile, so drop their empty pill and push the hamburger to the right */
    .nav-links-container {
        display: none;
    }

    .main-nav-one .logo-box {
        width: 100%;
        justify-content: space-between;
        padding-right: 0;
    }
}

.accesibility-button {
    width: 4rem;
    position: fixed;
    top: 56px;
    right: 56px;
    z-index: 1000;
}
.accesibility-button,
.accesibility-button img {
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
/* remove the browser's default button look (grey background, 2px border, padding) so only the icon shows */
.accesibility-button button {
    padding: 0;
    border: 0;
    background: none;
}

@media (max-width: 1564px) {
    .accesibility-button {
        position: fixed;
        top: auto;
        right: 34px;
        bottom: 6rem;
        z-index: 1000;

        /* -webkit-transition: all 0.4s ease;
        transition: all 0.4s ease; */

    }
    /* @media (max-width: 480px) {
        .accesibility-button img{
            width: 2rem;
            height: 2rem;
        }
    } */
}

@media (max-width: 480px) {
    .accesibility-button,
    .accesibility-button img{
        width: 3rem;
        height: 3rem;
    }
}

/* .logo-positioning {
    padding-left: 160px;
    padding: 38.25px;
    padding-right: 75px;
} */



/* SECTION WITH PHOTO AND TEXT - INFO SECTION PLUGIN*/

.info-section-plugin {
    background-image: none;
    margin-bottom: 120px;
}
@media (max-width: 992px) {
    .info-section-plugin {
        margin-bottom: 0px;
    }
}

.info-section-plugin-summary-text {
font-family: var(--thm-font) !important;
font-size: 1.375rem !important;
font-weight: 400 !important;
font-style: normal !important;
letter-spacing: 0px !important;
text-align: left !important;
line-height: 2.125rem !important;
}

.rounded-button {
    border-radius: 30px;
    transition: all 0.4s ease;
    opacity: 1;
    font-size: 1.375rem;
    font-weight: 400;
    font-style: Regular;
    letter-spacing: 0px;
    text-align: left;
    line-height: 1.875rem;
}
.rounded-button:hover {
    background-color: #000000;
    color: white;
}

.custom-margin-top {
    margin-top: 80px;
}

@media (max-width: 1439px) and (min-width: 992px) {
    .custom-margin-top {
        margin-top: 136px !important;
    }
}

/* CONTENT TEMPLATES */
.content-margin {
    margin-top: 100px;
}

@media (max-width: 992px) {
    .content-margin {
        margin-top: 0px;
    }
}

.content-heading h1,
.content-heading h2,
.content-heading h3,
.content-heading h4,
.content-heading h5,
.content-heading h6 {
    /* font-size: 42px; */
    font-weight: 900;
    letter-spacing: 0px;
}

.content-paragraph p li {
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0px;
    line-height: 1.875rem;
}

.content-spacing p,
.content-spacing h1,
.content-spacing h2,
.content-spacing h3,
.content-spacing h4,
.content-spacing h5,
.content-spacing h6,
.content-spacing ul,
.content-spacing ol {
    margin-bottom: 2.5rem;
}

/* POST DETAILS */
@media (max-width: 991px) {
    .container-large-screen {
        display: none;
    }
}
@media (min-width: 992px) {
    .container-small-screen {
        display: none;
    }
}

.container-margin {
    margin-top: 0px;
}

.published-date-text {
    color: rgba(155, 155, 155, 1);
    font-size: 1.125rem;
    font-weight: 400;
    letter-spacing: 0px;
    line-height: 1.875rem;
}

.post-details-title-text {
    font-size: 3.375rem;
    font-weight: 900;
    letter-spacing: 0px;
}

@media (max-width: 1200px) {
    .post-details-title-text {
        font-size: 2.5rem;
    }
}

.post-details-summary-text {
    color: rgba(126, 193, 45, 1);
    font-size: 1.5rem;
    font-weight: 700;
    font-style: Bold;
    letter-spacing: 0px;
    line-height: 2.1875rem;
    margin-top: 40px;
}

.post-details-content-text {
    color: black;
    font-size: 1.125rem;
    font-weight: 400;
    letter-spacing: 0px;
    line-height: 1.875rem;
}



.float-right {
    text-align: right;
    float: right;
    width: auto;
    max-width: 550px;
    margin-left: 70px;
}

/* Apply clear fix to only the second .float-right element */
.second-float-right {
    clear: right;
}

.float-right div {
  display: block;
}


.clearfix::after {
content: "";
display: table;
clear: both;
}

.side-content-heading {
    font-size: 24px;
    font-weight: 900;
    letter-spacing: 0px;
    text-align: left;
    margin-bottom: 30px;
}

.link-filer {
    color: var(--thm-base);
    font-size: 1.125rem;
    word-break: break-all;
}

.link-filer:hover {
    color: black;
}

.additional-content-heading {
    font-weight: 900;
    margin-top: 20px;
    margin-bottom: 20px;
}

/* SPLIDE CAROUSEL */

.splide-img {
    width: 100%;
    height: auto;
}

.splide {
    position: relative;
}

.splide__slide {
    background-color: rgb(219, 219, 219);
}

.splide_slide_custom {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* pagination position */
.splide__pagination {
    position: absolute;
    bottom: -50px;
    justify-content: end;
    padding-right: 0px;
    z-index: 2;
}

.splide__pagination .splide__pagination__page {
    background-color: rgb(216, 216, 216);
}

.splide__pagination .splide__pagination__page.is-active {
    background-color: black;
    transform: scale(1.0);
}

.splide__pagination__page {
    width: 10px;
    height: 10px;
}

.under-carousel-container {
    width: 100%;
    margin: 26px 0px;
    display: flex
}

.gallery-button {
    display: flex;
    flex-wrap: wrap;
}

.gallery-button:hover .gallery-button-text  {
    color: var(--thm-base);
    cursor: pointer;
}


.gallery-button-icon {
    width: 32px;
    height: 28px;
    margin-right: 12px;
}

.button-icon {
    width: 32px;
    height: 32px;
    margin-right: 12px;
}

.gallery-button-text {
    color: rgba(155, 155, 155, 1);
    font-size: 1.125rem;
    font-weight: 400;
    letter-spacing: 0px;
    text-align: left;
    line-height: 1.875rem;
    margin-bottom: 0px;
}

.gallery-image-hover {
    transition: filter 0.5s ease;
}

.gallery-image-hover:hover {
    filter: brightness(0.8);
}


/* NEWS/EXHIBITIONs LISTS */

.posts-header {
    background-repeat: no-repeat;
    background-position: top center;
    /* background-attachment: fixed; */
    position: relative;
    padding-top: 120px;
    padding-bottom: 120px;
    background-size: cover;
    background-position: center center;
}

.posts-header h2 {
    color: white;
    font-size: 3.375rem;
    font-weight: 900;
    letter-spacing: 0px;
    text-align: center;
}


/* VIDEO WRAPPER FULL WIDTH */
.video-wrapper {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 Aspect Ratio */
}
.video-wrapper iframe,
.video-wrapper video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* INFO SIDE MENU */

.info-side-menu-logo-heading {
    font-size: 1.1875rem;
    font-weight: 400;
    letter-spacing: 0px;
}

.info-side-menu-heading {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: 0px;
    margin-top: 60px;
    margin-bottom: 20px;
}


/* MOBILE SIDE MENU */

/* theme makes this a flex row around the mCustomScrollbar wrapper, which is no longer used */
.side-menu__block-inner {
    display: block;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
}

.side-menu__logo {
    display: block;
    width: fit-content;
    margin: 0 auto;
    padding-left: 0;
}

/* square toggle as tall as the link row (10px + 28px line-height + 10px) */
.mobile-nav__container li.dropdown .dropdown-btn {
    top: 0;
    width: 48px;
    height: 48px;
}

/* keep the theme's 30px gap between label and toggle */
.mobile-nav__container li.dropdown > a {
    padding-right: 78px;
}


/* FOOTER */

.site-footer {
    background: #F6F6F6;
    margin-top: 50px;
}

.site-footer__inner {
    display: flex;
    justify-content: space-between;
    padding: 40px 100px;
}

.site-footer__copyright {
    color: rgba(0, 0, 0, 1);
    font-size: 1.125rem;
    font-weight: 400;
    letter-spacing: 0px;
    text-align: left;
    line-height: 1.875rem;
}

@media (max-width: 992px) {
    .site-footer__inner {
        justify-content: center;
        padding: 30px 20px;
    }

    .site-footer__copyright {
        font-size: 1rem;
        text-align: center;
    }

    .site-footer__nav {
        display: none;
    }
}
