* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    scroll-behavior: smooth;
    
  }

:focus-visible {
    outline-width: 2px;
    outline-style: dashed;
    outline-color: var(--cmh-red);
    outline-offset: 0px;
}

.grid-item:focus-within {
    outline-width: 2px;
    outline-style: dashed;
    outline-color: var(--cmh-red);
    outline-offset: 0px;
}

.thumb-link:focus-visible {
    outline-width: 2px;
    outline-style: dashed;
    outline-color: var(--cmh-red);
    outline-offset: -10px;

}

.thumb-link:focus-visible:after  {
    width: 100%;
    height: 100%;
    content: '';
    outline: var(--cmh-red) 2px dashed;
    outline-offset: -3px;
    position: absolute;
    top: 0;
    left: 0;
}

  html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, input, label,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
}

a {
    text-decoration: none;
    color: inherit;
}

p {
    margin-bottom: 1rem;
}

p:last-child {
    margin-bottom: 0rem;
  }

.material-icons{
    line-height: 1.8;
}

.curved
{
    border-radius: 32px;
}

.hidden-on-mobile {
    display: auto;
}

@media (max-width: 724px) {
    .hidden-on-mobile {
    display: none;
    }
}

.bg-theme-colour{
    background-color: #00003C;
    background-color: var(--bg-theme-colour);
}

.container {
    display: grid;
    grid-template-columns: 1fr repeat(8, minmax(0px,180px)) 1fr;
    grid-template-rows: auto;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
}

/* this is causing problems*/
.sub-container {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    height: 100%;
    width: 100%;
}

@media (max-width: 724px) {
    .sub-container {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 0fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    height: 100%;
    width: 100%;
    }
}

.grid {
    
    color: var(--white);
    padding: 24px;
}

.key-info-header {
    grid-column: 2 / 8;
    grid-row: 1 / 1;
    z-index: 1;
    display: flex;
    justify-content: flex-start;
    height: fit-content;
    flex-wrap: wrap;
}

.exhibit-information {
    grid-column: 7 / 11;
    grid-row: 1 / 5;
    color: var(--dark-grey);
    padding: 3rem;
    background-color: var(--QOE-beige);
}

.exhibit-information-container{
    display: flex; 
    flex-direction: column; 
    align-items: flex-start; 
    height: 100%; 
    margin-left: auto; 
    margin-right: 0px;
    gap: 1.5rem;
    padding-top:3rem;

}

.exhibit-information-container h3 {
    padding: 0px;

}



@media screen and (max-width: 1200px) and (min-width: 725px) {
    
    .exhibit-information {
        grid-column: 7 / 11;
    }

    .video-BG {
        grid-column:1/7;
        
    
    }

}

@media (max-width: 724px) {

    .exhibit-information-container {
        align-items: flex-start;

    }

    

    .exhibit-information {
        grid-column:1/11;
        grid-row:4/4;
        text-align: left;
        padding: 2.25rem;
    }

  }

.content-BG {
    grid-column:1/8;
    grid-row: 1/5;
    background-color: var(--bg-theme-colour);

}

.video-BG {
    grid-column:1/8;
    grid-row: 1/1;

}


.content{
    grid-column: 2/7;
    grid-row: 1/4;
    
}

@media (max-width: 724px){
    .content-BG{
        grid-column: 1 / 11;
        grid-row: 3 / 3;
    }

    .video-BG {
        grid-column:1/11;
        grid-row: 1/2;
        min-height: 300px;
    
    }

    .content{
        grid-column: 1/11;
        grid-row: 3/3;
    }
}

.video-title {
    grid-column:2/6;
    grid-row: 1/1;

}

.hero-text{
    grid-column:2/10;
    grid-row:3/3;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    
}

.hero-text > div {
    padding-top: var(--medium-padding);
    padding-bottom: var(--small-padding);
}


.hero-header{
grid-column: 1/12; grid-row: 1/1;
z-index:11;
}


@media (max-width: 724px) {
    .hero-text {
        grid-column:2/10;
        grid-row:3/3;
        text-align: left;
        align-items: flex-start;
        padding-bottom: 4rem;
        justify-content: flex-start;
    }

    
  }

.hero-title-holder
{
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    padding-left: 0;
    padding-right: 0;
}

@media (max-width:724px) {
    .hero-title-holder{
        align-items: flex-start; 
    }
}

.opening-date
{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    padding: var(--medium-padding);
    color: var(--white);
    font-weight: bold;
    text-align: left;
    padding: 0px;
}

.datebutton{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;

}

#fullscreen-hero{
    display: grid;
    /* background-color: var(--black);
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.8)), url("/assets/NC-54-4336_retouchee-Cartier.jpg"); */
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    width: 100%;
    height: 100VH;
    
}


#key-information{
    display: grid;
    max-width: 1024px;
    min-height: 80VH;
    grid-auto-rows: min-content;
    grid-template-rows: 40vh auto auto auto;
    grid-column-gap: 2rem;
    /*padding: 2rem;*/
    /*grid-row-gap: 2rem;*/
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

@media (max-width: 724px) {
    #key-information {
        min-height:min-content;
        padding: 0rem;
    }
  }


.flex{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-end;
    
}

/*.about-video-details{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 24px;
    grid-auto-flow:row ;
    
}

.about-video-details{
    max-width: 800px;
    
}*/

@media (max-width: 724px) {
    .about-video-details{
        grid-template-columns: 1fr;
        grid-column-gap: 0px;
        grid-row-gap: 0px;
        grid-auto-flow:row ;
        
    } 
}


.about-video{
    padding: 0px;
}

@media (max-width: 724px) {
    .video-title {
        grid-column:1/10;
        grid-row:1/1;
        text-align: left;
    }
  }

.partner{
    
    object-fit: contain;
    max-width: 256px;
}

.dark-overlay{
    position: absolute;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 1.0));
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 0.7;
    
    
}



@media screen and (max-width: 1200px) and (min-width: 725px) {
    .exhibit-BG {
        grid-column: 7 / 11;
        
    }
    .exhibit-information {
        grid-column: 7 / 11;
    }

    .video-BG {
        grid-column:1/8;
        
    
    }

    .content{
        grid-column: 2/7;
    }

    .about-video-details{
        grid-template-columns: 1fr;
        color: white;
    }
        

}

#wAdmission-disclaimer_2 a{
text-decoration: underline;
}

#wAdmission-disclaimer_1 a{
    text-decoration: underline;
}

.regular-content-image {
    display:flex; 
    flex-direction: column; 
    min-height: 30vh; 
    justify-content: space-between; 
    background-position-y: center; 
    background-image:linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7)), url(../assets/mission-nefertari_banner.jpg); 
    background-repeat: no-repeat; 
    background-size: cover;
}

.flex-holder{
    flex-grow: 1;
    display: flex;
    align-items: flex-end;
}
.overflow-hidden {
    overflow: hidden;
}

.review{

    background-color:#e5e5e5;
    color:var(--dark-grey);
    padding: 2rem;
    border-radius:4px

}

.utils-bar{

padding-bottom: 3rem;
grid-template-columns: repeat(3,auto);
justify-content: center;
align-items: center;
display: grid;
}

.quote-icon{
    font-size: 2rem; 
    padding: 1rem; 
    padding-top: 0rem; 
    padding-right: 0rem; 
    transform:scaleX(-1);
}

.thumbnail-video > .lg-video-object {
    display: none;
}

.lg-video > a {
    display: none;
}

.lg-video > .video-icon {
    display: none;
}

.lg-video > .dark-overlay {
    display: none;
}

.warning {
    z-index: 1;
    padding: 0rem 0.25rem;
    background-color:#c1261c;
    color: white;
    position: absolute;
    right: 1rem;
    top: 1rem;
    font-size: 0.75rem;
    border-radius: 0.25rem;
}

.img-responsive {
    object-position: right;
}

/*
.lg-sub-html::before{
    content:'Minimize';
    position: absolute;
    top:-2rem;
    right: 1rem;
    
} */

.lg-outer > .lg > .lg-sub-html {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    -webkit-transition: -webkit-transform 0.25s cubic-bezier(0, 0, 0.25, 1) 0s;
    -moz-transition: -moz-transform 0.25s cubic-bezier(0, 0, 0.25, 1) 0s;
    -o-transition: -o-transform 0.25s cubic-bezier(0, 0, 0.25, 1) 0s;
    transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1) 0s;
}

.lg-thumb-open > .lg > .lg-sub-html{
    transform: translate3d(0, 0%, 0);

}

.minimize-button {
    --button-pos:0px;
}

.minimize-button {
    bottom: 0px!important;
    top:auto!important;
    z-index: 10000;
    transition: bottom 0.2s cubic-bezier(0, 0, 0.25, 1) 0s;
    
}

.lg-thumb-open > .lg > .minimize-button{
    bottom:var(--button-pos)!important;
    top:auto!important;
    z-index:1080;
}
.minimize-button{
    padding: 2rem;
}

.minimize-button::after{
    content:""!important;

}

.minimize-button > .material-icons::after{
    content:"expand_less";
}

.lg-thumb-open > .lg > .minimize-button > .material-icons::after{
    content:"expand_more";
}

.thumb-title {
    visibility: hidden;
    grid-area: 4 / 1 / 2 / 2;
    padding: 2rem;
    color: white;
    z-index: 1;
}

.grid-item:hover > .thumb-title { 
    visibility: visible;
    padding: 2rem;
    
}

.grid-item > a {
    grid-area: 1 / 1 / 4 / 2;
    
}

.grid-item {
    display: grid;
    overflow: hidden;
}

.image-overlay{
    
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.8));
    opacity: 0.0;
    width: 100%;
    height: 100%;
    grid-area: 1 / 1 / 4 / 2;
    pointer-events: none;
    transition: opacity 0.4s cubic-bezier(0, 0, 0.25, 1) 0s;
        
}

.grid-item:hover > .image-overlay{
    
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.8));
    opacity: 1.0;
    
        
}

.thumbnail-img{
    vertical-align: bottom;
}

.thumbnail-video:hover > .dark-overlay{
    transition: opacity 0.4s cubic-bezier(0, 0, 0.25, 1) 0s;
    opacity: 1.0;
}

.thumbnail-video:hover > a > img{
    height: 107%;
    width: 107%;
    overflow: hidden;
    object-position: center;
    transition: height 0.4s cubic-bezier(0, 0, 0.25, 1) 0s;
    
}

.img-virtual-opening {
    width: 100%;
    height: 100%;
    object-fit: cover;
    vertical-align: bottom;
    grid-area: -1/1;
}

.video-icon-virtual-opening {
    font-size: 4rem;
    color: var(--white);
    position: relative;
    bottom: -42%;
    left: 45%;
}

.fullgrid {
    grid-area: -1/1;
    background : linear-gradient(180deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.6) 100%);
}

.thumblink {
    display: grid;
    height: 100%;
}

@media screen and (max-width: 900px) and (min-width: 725px) {
    .img-virtual-opening {
        height: 100%;
    }

    .thumblink {
        height: 100%;

    }

}

.rem4 {
    padding: 4rem;
}

.no-margin {

    margin-bottom: 0rem;
}

.teaser {
    padding: 4rem;
    padding-top: 6rem;
    color: white;
    padding-bottom : 4rem

}

@media screen and (max-width: 724px) {
    .teaser {
        padding: 2rem;
        padding-top: 4rem;
        padding-bottom : 2rem
    
    }

}

@media screen and (max-width: 900px) and (min-width: 725px) {

    .exhibit-information {
        grid-column: 1/11;
        grid-row: 4/4;
        text-align: left;
        padding: 2.25rem; 
    }

    .video-BG {
        grid-column: 1/11;
      }

    .teaser.content {
        grid-column: 1/11;
        grid-row: 3/3;
    }

    .content-BG {
        grid-column: 1 / 11;
        grid-row: 3 / 3;
      }
    
}

.fixed-container {
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0rem;
    pointer-events: none;
    
}

.fixed-container-bg {
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0rem;
    pointer-events: none;
    transition: background-color 0.5s ease-out;
    z-index: -1;
    
}


.bg-overlay{
    background-color: rgba(0, 0, 0, 0.5);
}

.pricelist {
    display: flex;
    justify-content: space-between;
}

@media screen and (max-height: 580px) and (min-height: 240px) {

    /* for mobile landscape */

    #fullscreen-hero {
        min-height: 640px;
    }

    .hero-text {
        grid-row: 1/1;
        justify-content: center;
    }

    .herotxt {
        font-size: 3rem!important;
    }

}

.back-to-top {
    grid-column-start: 2;
    grid-template-columns: repeat(3,auto);
    justify-content: center;
    align-items: center;
    display: grid;
    
}

.back-to-top > .material-icons {
    color: var(--white);
}

.map {
    background-image: url(../assets/img/map.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-color: white;
    background-position: center;
    min-height: 300px;
    grid-column: span 2;
}


.map a {
    height: 100%;
    width: auto;
    display: flex;
}

.cta-content {
    max-width: 400px;
    display: flex; 
    align-items: flex-start;
}

@media screen and (max-height: 580px) and (min-height: 240px) {
    .lg-outer .lg-video {
        position: static!important;

    }
}

#lightgallery, #lightgallery2, #lightgallery3 {
    background-color: black;
    padding: 1.5rem;
    
    
}
