@import url("fonts/stylesheet.css");


:root {
    --slideHeight: calc(100dvh - 256px);
    --h1: 42px;
    --h2: 20px;
    --h3: 16px;
    --h4: 12px;
    --subheader: 24px;
    --body: 18px;
    --body-lh: 24px;
    --button: 16px;
    --aux: 12px;
}

/* TYPOGRAPHY */
h1,
.h1 {
    font-family: 'Area Normal';
    font-size: var(--h1);
    line-height: ;
    font-weight: 700;
}

h2,
.h2 {
    font-family: 'Area Normal';
    font-size: var(--h2);
    line-height: 1em;
    font-weight: 700;
}

h3,
.h3 {
    font-family: 'Area Normal';
    font-size: var(--h3);
    line-height: 1.2em;
    font-weight: 700;
}

h4,
.h4 {
    font-family: 'Area Normal';
    font-size: var(--h4);
    line-height: 1.333em;
    font-weight: 700;
}

h5,
.h5 {
    font-size: ;
    line-height: ;
}

.page-content h2 {
    font-family: 'Area Normal';
    font-weight: bold;
    margin-bottom: 10px;
}

p {
    font-size: var(--body);
    line-height: var(--body-lh);
    margin-bottom: 30px;
}

.page-id-18 .card-body p {
	    margin-bottom: 30px;
}

body,
html {
    color: #fff;
    font-family: 'Area Normal';    
    font-size: var(--body);
    line-height: var(--body-lh);
    xfont-weight: 700;
    -webkit-font-smoothing: antialiased;
}

.h2.arial {
    font-family: 'Area Normal';
        font-weight: 700;
}

small {
    font-size: var(--aux);
    line-height: ;
}

.elementor-button,
.btn.btn-default {
    border: 1px solid #fff;
    font-size: var(--button);
    line-height: 1em;
    /* Button Text */
color: #fff;
box-sizing: border-box;

/* Auto layout */
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 10px 15px 12px;
font-weight: 700;
border: 1px solid #FFFFFF;
border-radius: 5px;
}

/* END TYPOGRAPHY */

/* GENERAL */
.mt-15 {
    margin-top: 15px;
}

.mt-20 {
    margin-top: 20px;
}
.pt-20 {
    padding-top: 20px;
}
.mb-20 {
    margin-bottom: 20px;
}
.pb-20 {
    padding-bottom: 20px;
}
.p-25 {
    padding-left: 25px;
    padding-right: 25px;
}
.mt-25 {
    margin-top: 25px;
}
.pt-25 {
    padding-top: 25px;
}
.mb-25 {
    margin-bottom: 25px;
}
.pb-25 {
    padding-bottom: 25px;
}
.mt-30 {
    margin-top: 30px;
}
.pt-30 {
    padding-top: 30px;
}
.mb-30 {
    margin-bottom: 30px;
}
.pb-30 {
    padding-bottom: 30px;
}

.mb-45 {
    margin-bottom: 45px;
}

/* END GENERAL */

.loader-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #CBC7BB;
    z-index: 99999;
  }
  .loader-indicator {
    position: absolute;
    width: 0%;
    left: 50%;
    transform: translateX(-50%);
    height: 100%;
    background: url('https://admgradshow.com/wp-content/uploads/2025/04/ADMSHOW25-White-Line-1.png') repeat-x center center;
    background-size: auto 100%;
	  
    animation: stepWidth 4s steps(40) forwards;

  }
  @keyframes loader {
    from {
        width: 0%;
    }
    to {
        width: 80%;
    }
  }
  @keyframes stepWidth {
    from {
      width: 0;
    }
    to {
      width: 100vw;
    }
  }
  .xloader-indicator img {
    position: absolute;
    height: 100%;
    width: 80%;
    left: 50%;
    transform: translateX(-50%);
    object-fit: cover;
    animation: stepWidth 4s steps(40) forwards;
  }
  .loaded .loader-indicator {
    width: 100vw !important;
    object-fit: cover;
    height: 100%;
	      width: 100vw;
    height: 100dvh;
    transition: all .5s ease;
    animation: hideloader 1s linear forwards; 
    animation-delay: 1s;
  }
  .loaded .loader-container {
    animation: opacity 2.5s linear forwards; 
    animation-delay: 1s;
  }
  .loaded .xloader-indicator img {
    width: 100% !important;
    object-fit: cover;
    height: 100%;
    transition: all .5s ease;
    animation: hideloader 1s linear forwards; 
    animation-delay: 1s;
  }
  @keyframes hideloader {
    from {
        opacity: 1;
    } 
    to {
        opacity: 0;
    }
  }
  .reveal-container {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      pointer-events: none; /* So it doesn't block interactions */
      overflow: hidden;
      
    z-index: 99998;
  }
  .reveal-top {
      position: absolute;
      top: 0;
      width: 100%;
      height: 50%; /* Adjust if needed */
      background: linear-gradient(to bottom, rgba(203, 199, 187,1) 0%,rgba(203, 199, 187,1) 50%,rgba(203, 199, 187,0) 100%);
  }
  .loaded .reveal-top {
    
    animation: revealTop 2.5s linear forwards;
    animation-delay: 1s;
  }

  
  .reveal-bottom {
      position: absolute;
      bottom: 0;
      width: 100%;
      height: 50%;
      background: linear-gradient(to top, rgba(203, 199, 187,1) 0%,rgba(203, 199, 187,1) 50%,rgba(203, 199, 187,0) 100%);
  }
  .loaded .reveal-bottom {
    animation: revealBottom 2.5s linear forwards;
    animation-delay: 1s;
  }

  .loaded .loader-container, .loaded .reveal-container {pointer-events: none;}
  
  @keyframes revealTop {
      from {
          transform: translateY(0%);
      }
      to {
          transform: translateY(-100%);
      }
  }
  
  @keyframes revealBottom {
      from {
          transform: translateY(0%);
      }
      to {
          transform: translateY(100%);
      }
  }
  
  @keyframes opacity {
      from {
          opacity: 1;
      }
      to {
          opacity: 0;
      }
  }

  .home header, .home .slides, .home #nav-icon4 {
    opacity: 0;
    transition: all 1s ease 0s;
  }
  .content-loaded header, .content-loaded .slides, .content-loaded #nav-icon4 {
    opacity: 1;
    transition: all 1s ease 0s;
  }

/* HEADER */
a, a:hover {
    color: inherit;
}
a:hover {
    text-decoration: none;
}
#menu {
    background: #CBC7BB;
    z-index: 99;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: #000;
    opacity: 0;
	visibility: hidden;
		transition: all .3s ease;

}
.menu-open #menu {
    opacity: 1;
	visibility: visible;
		transition: all .3s ease;

}
nav {
    width: 100%;
    height: 100%;
    display: flex
;
    flex-direction: column;
    align-content: center;
    align-items: center;
    justify-content: center;
	
	opacity: 0;
	transform: scale(0.5);
	transition: all 1s ease;
}
.menu-open nav {
	opacity: 1;
	transform: scale(1);
	transition: all 1s ease;
}
#nav-icon4 {
    width: 30px;
    height: 20px;
    position: fixed;
    top: 53px;
    right: 26px;
    margin: 1px auto;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .15s ease;
    -moz-transition: .15s ease;
    -o-transition: .15s ease;
    transition: .15s ease;
    cursor: pointer;
    z-index: 999;
  }
  #nav-icon4::before {
    content: '';
    width: 100%;
    height: 5px;
    position: absolute;
    top: -5px;
    left:0;
    z-index: 0;
  }
  #nav-icon4::after {
    content: '';
    width: 100%;
    height: 5px;
    position: absolute;
    bottom: -5px;
    left:0;
    z-index: 0;
  }
 #nav-icon4 span {
    display: block;
    position: absolute;
    height: 2px;
    width: 30px;
    background: #fff;
    border-radius: 9px;
    opacity: 1;
    left: 3px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .15s ease;
    -moz-transition: .15s ease;
    -o-transition: .15s ease;
    transition: .15s ease;
    z-index: 1;
  }
  #nav-icon4.open span {
    background: #000;
  }
  /* Icon 4 */
#nav-icon4 {
}
#nav-icon4 span:nth-child(1) {
  top: 0px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}
#nav-icon4 span:nth-child(2) {
  top: 9px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}
#nav-icon4 span:nth-child(3) {
  top: 18px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}
#nav-icon4.open span:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -2px;
  left: 8px;
}
#nav-icon4.open span:nth-child(2) {
  width: 0%;
  opacity: 0;
}
#nav-icon4.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 19px;
  left: 8px;
}
/* END HEADER */

/* CONTENT */

#home-video {
    width: 100vw;
    height: 100dvh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
}

video#myVideo {
    object-fit: cover;
    width: 100vw;
    height: 100dvh;
    position: fixed;
    top: 0;
    left: 0;
}

#video-overlay {
    width: 100vw;
    height: 100dvh;
    position: fixed;
    top: 0;
    left: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.8) 100%);
    z-index: 1;
}

header {
    padding: 50px 25px 25px;
    position: relative;
    top: 0;
	z-index: 9;
}
body.home header {
    position: fixed;
}

#ntu-logo img {
    max-height: 40px;
}

#date, #location {
    font-size: 3vw;
    line-height: 4vw;
    top: 3vw;
    letter-spacing: 0.025em;
	font-weight: 600;
}

.logos {
    gap: 20px;
}
.logos .logo img {
    height: 150px;
}
.logos-sponsors .logo img {
    height: 125px;
}
@keyframes animate {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7), 0 0 0 0 rgba(255, 255, 255, 0.7);
    }

    40% {
        box-shadow: 0 0 0 10px rgba(255, 255, 255, 0), 0 0 0 0 rgba(255, 255, 255, 0.7);
    }

    80% {
        box-shadow: 0 0 0 10px rgba(255, 255, 255, 0), 0 0 0 10px rgba(255, 255, 255, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0), 0 0 0 10px rgba(255, 255, 255, 0);
    }
}
#location::before {
    content: '';
    width: 2.5vw;
    height: 2.5vw;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    top: -3vw;
    left: 50%;
    transform: translateX(-50%);
}
#location:hover::before, #date:hover::before {
    animation: animate 2s linear infinite;
}
#location {
    position: absolute;
    left: 0;
    width: 19%;
    text-align: center;
}
#date::before {
    content: '';
    width: 2.5vw;
    height: 2.5vw;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    top: -3vw;
    left: 50%;
    transform: translateX(-50%);
}
#date {
    position: absolute;
    right: 0;
    width: 19%;
    text-align: center;
}
.slide-date h3, .slide-loc h3 {
    position: relative;
}
.slide-date h3::before, .slide-loc h3::before {
    content: '';
    width: 4vw;
    height: 4vw;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    top: calc(-4vw - 10px);
    left: 50%;
    transform: translateX(-50%);
}

.fp-watermark {
    display: none !important;
}

#fullpage {
    transform: translate3d(0px, 0, 0px) !important;
}


.slides {
    height: var(--slideHeight);
    width: 100vw;
    position: relative;
    xoverflow: hidden !important;
}

.slide {
    transform: perspective(var(--slideHeight)) translateZ(0);
    position: absolute !important;
    width: 100%;
    height: var(--slideHeight);
    top: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin-top: calc(100dvh - var(--slideHeight));
}

.top {
    xpadding-top: 10vh;
}

.bot {
    xpadding-bottom: 10vh;
}

.slide-1 {
    transform: perspective(var(--slideHeight)) translateZ(0);
    xz-index: 1;
    transition: transform 1.5s ease, opacity 0.5s ease 1s, filter 1s ease .5s;
}

.slide-2 {
    transition: transform 1.5s ease, opacity 0.5s ease 0.25s, filter 1s ease 0.5s;
    transform: perspective(var(--slideHeight)) translateZ(-500px);
    xz-index: 1;
    opacity: 0;
    filter: blur(5px);
    -webkit-filter: blur(5px);
}
.up .slide-2 {
    transition: transform 1.5s ease, opacity 0.5s ease 0.25s, filter 1s ease .5s;

}

/* .slide-3 {
    transition: transform 5s ease, opacity 1.0s ease 0s, filter 1.5s ease 0s;   
    transform: perspective(var(--slideHeight)) translateZ(-1000px);
    height: calc(var(--slideHeight) - 80px) !important;
    xz-index: 1;
    opacity: 0;
    filter: blur(5px);
    -webkit-filter: blur(5px);
}

.fp-section.slide-3, .slide-3 .fp-overflow, .slide-3 .bot {
    xoverflow: hidden !important; 
} */

.slide-3 {
    transition: transform 1.5s ease, opacity 0.5s ease 0.5s, filter 1.5s ease 0s;

    transform: perspective(var(--slideHeight)) translateZ(-1500px);
    xz-index: 1;
    opacity: 0;
    filter: blur(5px);
    -webkit-filter: blur(5px);
}

.up .slide-3 {
    transition: transform 1.5s ease, opacity .5s ease 0s, filter 1.5s ease 0s;

}

.fp-viewing-1 .slide-1 {
    transform: perspective(var(--slideHeight)) translateZ(650px);
    opacity: 1;

    filter: blur(0);
    -webkit-filter: blur(0);
}
.fp-viewing-1 .slide-2 {
    transform: perspective(var(--slideHeight)) translateZ(0);
    opacity: 1;
    filter: blur(0);
    -webkit-filter: blur(0);
}
.fp-viewing-1 .slide-3 {
    transform: perspective(var(--slideHeight)) translateZ(-500px);
    opacity: 0;
    filter: blur(0);
    -webkit-filter: blur(0);
}
.fp-viewing-1 .slide-4 {
    transform: perspective(var(--slideHeight)) translateZ(-1000px);
    opacity: 0;
    filter: blur(0);
    -webkit-filter: blur(0);
}

.fp-viewing-2 .slide-1 {
    transform: perspective(var(--slideHeight)) translateZ(1000px);
    opacity: 0;
    filter: blur(0);
    -webkit-filter: blur(0);
}
.fp-viewing-2 .slide-2 {
    transition: transform 1s ease, opacity 0.25s ease 0.75s, filter 1.5s ease 0.25s;
    transform: perspective(var(--slideHeight)) translateZ(600px);
    opacity: 0;
    filter: blur(0);
    -webkit-filter: blur(0);
}
.fp-viewing-2 .slide-3 {
	    transition: transform 1s ease, opacity 0.5s ease 0s, filter 1.5s ease .5s;
    transform: perspective(var(--slideHeight)) translateZ(0);
    opacity: 1;
    filter: blur(0);
    -webkit-filter: blur(0);
}
.fp-viewing-2 .slide-4 {
    transform: perspective(var(--slideHeight)) translateZ(-500px);
    opacity: 0;
    filter: blur(5px);
    -webkit-filter: blur(5px);
}

.fp-viewing-3 .slide-1 {
    transform: perspective(var(--slideHeight)) translateZ(1500px);
    opacity: 0;
    filter: blur(5px);
    -webkit-filter: blur(5px);
}
.fp-viewing-3 .slide-2 {
    transition: transform 1s ease, opacity 0.5s ease 0s, filter 1.5s ease .5s;
    transform: perspective(var(--slideHeight)) translateZ(1000px);
    opacity: 0;
    filter: blur(5px);
    -webkit-filter: blur(5px);
}
.fp-viewing-3 .slide-3 {
	    transition: transform 1s ease, opacity 0.5s ease 0s, filter 1.5s ease .5s;
    transform: perspective(var(--slideHeight)) translateZ(500px);
    opacity: 0;
    filter: blur(5px);
    -webkit-filter: blur(5px);
}
.fp-viewing-3 .slide-4 {
    transform: perspective(var(--slideHeight)) translateZ(0);
    opacity: 1;
    filter: blur(0);
    -webkit-filter: blur(0);
}

@media (min-width: 1400px) {
    .fp-viewing-1 .slide-1 {
        transform: perspective(var(--slideHeight)) translateZ(100dvh);
        opacity: 1;
    
        filter: blur(0);
        -webkit-filter: blur(0);
    }
    .fp-viewing-1 .slide-2 {
        transform: perspective(var(--slideHeight)) translateZ(0);
        opacity: 1;
        filter: blur(0);
        -webkit-filter: blur(0);
    }
    .fp-viewing-1 .slide-3 {
        transform: perspective(var(--slideHeight)) translateZ(-100dvh);
        opacity: 0;
        filter: blur(0);
        -webkit-filter: blur(0);
    }
    .fp-viewing-1 .slide-4 {
        transform: perspective(var(--slideHeight)) translateZ(-200dvh);
        opacity: 0;
        filter: blur(0);
        -webkit-filter: blur(0);
    }
    
    .fp-viewing-2 .slide-1 {
        transform: perspective(var(--slideHeight)) translateZ(200dvh);
        opacity: 0;
        filter: blur(0);
        -webkit-filter: blur(0);
    }
    .fp-viewing-2 .slide-2 {
        transition: transform 1s ease, opacity 0.25s ease 0.75s, filter 1.5s ease 0.25s;
        transform: perspective(var(--slideHeight)) translateZ(100dvh);
        opacity: 0;
        filter: blur(0);
        -webkit-filter: blur(0);
    }
    .fp-viewing-2 .slide-3 {
            transition: transform 1s ease, opacity 0.5s ease 0s, filter 1.5s ease .5s;
        transform: perspective(var(--slideHeight)) translateZ(0);
        opacity: 1;
        filter: blur(0);
        -webkit-filter: blur(0);
    }
    .fp-viewing-2 .slide-4 {
        transform: perspective(var(--slideHeight)) translateZ(-100dvh);
        opacity: 0;
        filter: blur(5px);
        -webkit-filter: blur(5px);
    }

    .slide-3 .fp-overflow {
        width: 100%;
    }

    .slide-date h3::before, .slide-loc h3::before {
        content: '';
        width: 4vw;
        height: 4vw;
        border-radius: 50%;
        background: #fff;
        position: absolute;
        top: calc(-2vw - 20px);
        left: 50%;
        transform: translateX(-50%);
    }
   
}

.slide-1 img {
    width: 80vw;
    xmax-width: 500px;
}

.slide-1 .fp-overflow {
    height: calc(var(--slideHeight) - 80px);
    display: flex;
    flex-direction: column;
    justify-content: center !important;
    align-items: center;
}
.slide-2 .fp-overflow {
    height: calc(var(--slideHeight) - 80px);
    display: flex;
    flex-direction: column;
    justify-content: space-evenly !important;
    align-items: center;
}
/* .slide-3 .fp-overflow {
    height: calc(var(--slideHeight) - 80px);
    display: flex;
    flex-direction: column;
    justify-content: flex-start !important;
    align-items: center;
	overflow: hidden;
} */
.slide-3 .fp-overflow {
    height: calc(var(--slideHeight) - 40px);
    display: flex;
    flex-direction: column;
    justify-content: space-between !important;
    align-items: center;
	overflow: visible !important;
}

#indicator {
	position: fixed;
	bottom: 0;
	width: 0;
	height: 10px;
	background: url('https://admgradshow.com/wp-content/uploads/2025/03/Progress-Bar.png') repeat-x center center;
	background-size: contain;
	transition: all 2s ease;
	left: 50%;
	transform: translateX(-50%);
}
.fp-viewing-0 #indicator {
	width: 30%;
}
.fp-viewing-1 #indicator {
	width: 60%;
}
.fp-viewing-2 #indicator {
	width: 100%;
}
.fp-viewing-3 #indicator {
	width: 100%;
}

.personalities-corals img {
    max-height: calc(100dvh - 450px);
	max-width: calc(100vw - 60px);
}
.download-coral img, .slide-3 .bot.corals {
    max-height: calc(100dvh - 500px);
}

.xpersonalities-corals {
	transform: scale(0);
	transition: all 3s ease;
	opacity: 0;
}
.xfp-viewing-2 .personalities-corals {
		transform: scale(1.0);
	transition: all 3s ease;
	opacity: 1;

}

@keyframes rotate{
    from{ transform: rotate(-360deg); }
    to{ transform: rotate(360deg); }
}
.download-coral img, .coral-last img {
    animation-name: rotate;
    animation-duration: 100s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    
    backface-visibility: hidden;
}
.download-coral {
    overflow: hidden !important;
    
    backface-visibility: hidden;
}

#swipe {
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%) translateY(0);
    opacity: 0.75;
    z-index: 9;
    transition: all 1s ease 0s;
}
.fp-viewing-2 #swipe {
    opacity: 0;
    transform: translateX(-50%) translateY(200px); 
}

.download-sign {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 1;
    opacity: 0.5;
}

.display-inline {display: inline;}
.slide-4-footer {
    padding: 0 25px;
    text-transform: uppercase;
}
.footer-time, .slide-4-footer .h4 {

    font-family: 'abcd' !important;
    font-weight: bold !important;
}
.slide-4-time-footer {
    display: flex
    ;
    padding: 0 25px;
        flex-direction: row;
        align-items: center;
        width: 100%;
        justify-content: space-between;
        font-size: var(--aux);
        position: relative;
        margin-top: 25px;
}
.slide {
    pointer-events: none;
}
.fp-viewing-1 .slide-2, .fp-viewing-2 .slide-3 {
    pointer-events: all;
}

.slide-2 .top {
    padding-top: 30px;
}
.slide-2 .bot {
    padding-top: 30px;
}

.menu-divider {
    margin: 30px 0;
    width: 12px;
    height: 12px;
    background: #000;
    border-radius: 50%;
}
.archive-divider {
    width: 8px;
    height: 8px;
    background: #fff;
    border-radius: 50%;
}
.col.icon {
    width: 35px;
    max-width: 35px;
}

.archive-years {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px 30px;
    justify-content: center;
    align-items: center;
}
.archive-years a {
    text-decoration: underline;
}

.slide-3 .bot.corals {
    height: calc(100dvh - 500px);
    width: 100%;
    display: flex
;
    justify-content: center;
    align-content: center;
    align-items: center;
    
}
/* Hide scrollbar for Chrome, Safari and Opera */
.slide-3 .bot.corals::-webkit-scrollbar {
    display: none;
  }
  
  /* Hide scrollbar for IE, Edge and Firefox */
  .slide-3 .bot.corals {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
  }
.slide-3 .slide-4-footer, .slide-3 .top, .slide-4-time-footer {
    opacity: 0;
    
    transition: all 1s ease;
}
.time-dawn span {
    background: url('data:image/svg+xml,<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.69849 11.8531L4.3862 10.1222M3.96707 14.137L1.84373 13.4758M13.0332 14.137L15.1566 13.4758M11.3018 11.8531L12.6141 10.1222M8.50015 10.9809V8.84131M16 15.7163H11.7415M11.7415 15.7163C11.7446 15.6607 11.7461 15.6048 11.7461 15.5485C11.7461 13.8305 10.2929 12.4378 8.50015 12.4378C6.70744 12.4378 5.25416 13.8305 5.25416 15.5485C5.25416 15.6048 5.25572 15.6607 5.2588 15.7163M11.7415 15.7163H5.2588M5.2588 15.7163L1 15.7163M8.5 4.42274V0.716309M8.5 0.716309L6.53852 2.67779M8.5 0.716309L10.4615 2.67779" stroke="white" stroke-linecap="round"/></svg>') no-repeat center left;
    padding-left: 20px;
    background-size: 16px;
}
.time-day span {
    background: url('data:image/svg+xml,<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.05373 4.58417L3.6737 2.64863M3.23294 7.13799L1 6.39868M3.23294 10.2946L1 11.0339M5.05373 12.8484L3.6737 14.784M8 13.8238V16.2163M10.9463 12.8484L12.3263 14.784M12.7671 10.2946L15 11.0339M12.7671 7.13799L15 6.39868M10.9463 4.58417L12.3263 2.64863M8 3.60878V1.21631M11.4135 8.71631C11.4135 10.6374 9.88524 12.1947 8 12.1947C6.11476 12.1947 4.58646 10.6374 4.58646 8.71631C4.58646 6.79524 6.11476 5.2379 8 5.2379C9.88524 5.2379 11.4135 6.79524 11.4135 8.71631Z" stroke="white" stroke-linecap="round"/></svg>') no-repeat center left;
    padding-left: 20px;
    background-size: 16px;
}
.time-dusk span {
    background: url('data:image/svg+xml,<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg"><path opacity="1" d="M5.19849 11.8531L3.8862 10.1222M3.46707 14.137L1.34373 13.4758M12.5332 14.137L14.6566 13.4758M10.8018 11.8531L12.1141 10.1222M8.00015 10.9809V8.84131M15.5 15.7163H11.2415M11.2415 15.7163C11.2446 15.6607 11.2461 15.6048 11.2461 15.5485C11.2461 13.8305 9.79286 12.4378 8.00015 12.4378C6.20744 12.4378 4.75416 13.8305 4.75416 15.5485C4.75416 15.6048 4.75572 15.6607 4.7588 15.7163M11.2415 15.7163H4.7588M4.7588 15.7163L0.5 15.7163M8 0.716309V4.42274M8 4.42274L9.96148 2.46126M8 4.42274L6.03852 2.46126" stroke="white" stroke-linecap="round"/></svg>') no-repeat center left;
    padding-left: 20px;
    background-size: 16px;
}
.time-night span {
    background:url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="8" cy="7.71631" r="6.5" stroke="white" stroke-width="2" stroke-linejoin="round" stroke-dasharray="2 2"/></svg>') no-repeat center left;
    padding-left: 20px;
    background-size: 16px;
}
.footer-time {
    display: flex;
    opacity: 0.5;
}
.footer-time.active {
    opacity: 1;
}
.footer-time span {
    display: block;
    width: 70px;
}
.footer-time-right .footer-time {
    display: flex;
    justify-content: flex-end;
}

.time-divider {
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    background: rgba(255, 255, 255, 0.5);
}

.fp-viewing-2 .slide-3 .slide-4-footer, .fp-viewing-2 .slide-3 .top, .fp-viewing-2 .slide-4-time-footer {
    opacity: 1;
    transition: all 1s ease 3s;
}
.fp-viewing-2 .coming-soon {
    opacity: 1;
    transition: all 2s ease 3s;
}
.corals {
    position: relative;
}
.coral {
    position: absolute;
    width: 30dvh;
    height: 30dvh;
    transform: perspective(50vh);
    transition: all 1s ease;
    opacity: 1;
    
}
.coral:not(.coral-last) img {
    opacity: 0;
}
.fp-viewing-2 .coral-1 img {
    opacity: 1;
	transform: rotate(90deg);
    transition: opacity .5s ease .25s, transform 10s ease;
}
.fp-viewing-2 .coral-2 img {
    opacity: 1;
	transform: rotate(-90deg);
    transition: opacity .5s ease .5s, transform 10s ease;
}
.fp-viewing-2 .coral-3 img {
    opacity: 1;
	transform: rotate(180deg);
    transition: opacity .5s ease .75s, transform 10s ease;
}
.fp-viewing-2 .coral-4 img {
    opacity: 1;
	transform: rotate(-180deg);
    transition: opacity .5s ease 1s, transform 10s ease;
}
.fp-viewing-2 .coral-5 img {
    opacity: 1;
	transform: rotate(90deg);
    transition: opacity .5s ease 1.25s, transform 10s ease;
}

.coral-1 {
    transform: perspective(50vh) translateZ(-50vh);
    z-index: 1;
}
.coral-2 {
    transform: perspective(50vh) translateZ(-50vh);
    z-index: 2;
}
.coral-3 {
    transform: perspective(50vh) translateZ(-50vh);
    z-index: 3;
}
.coral-4 {
    transform: perspective(50vh) translateZ(-50vh);
    z-index: 4;
}
.coral-5 {
    transform: perspective(50vh) translateZ(-50vh);
    z-index: 5;
}
.coral-last {
    transform: perspective(50vh) translateZ(-200vh);
    opacity: 0;
    
    z-index: 6;
}
.coming-soon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    width: 200%;
    text-align: center;
	font-weight: 600;
}

.fp-viewing-2 .coral {
    transform: perspective(50vh) translateZ(55vh);
    xtransition: transform 1s ease, opacity .5s ease;
    opacity: 1;
}
.fp-viewing-2 .coral.coral-last {
    transform: perspective(50vh) translateZ(0);
    opacity: 1;
    
    transition: transform 2s ease 1.25s, opacity .5s ease 1.5s, filter 2s ease 2.5s;
}
.fp-viewing-2 .xcoral-last img {
    filter: blur(5px);
            -webkit-filter: blur(5px);
            transition: filter 2s ease 2.5s;

}
.fp-viewing-2 .coral-1 {
    padding-left: 80px;
    padding-top: 50px;
    transition: transform 1.5s ease .25s, opacity .5s ease .5s;
}
.fp-viewing-2 .coral-2 {
    padding-right: 70px;
    padding-bottom: 50px;
    transition: transform 1.5s ease .5s, opacity .5s ease .75s;
}
.fp-viewing-2 .coral-3 {
    padding-left: 70px;
    padding-top: 100px;
    transition: transform 1.5s ease .75s, opacity .5s ease 1.25s;
}
.fp-viewing-2 .coral-4 {
    padding-left: 100px;
    padding-bottom: 100px;
    transition: transform 1.5s ease 1s, opacity .5s ease 1.5s;
}
.fp-viewing-2 .coral-5 {
    padding-right: 70px;
    padding-top: 50px;
    transition: transform 1.5s ease 1.25s, opacity .5s ease 1.75s;
}

.coral-last dotlottie-player {
    height: 300px !important;
    width: 300px !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
   xmix-blend-mode: difference;

}
.fp-viewing-2 .coral-last dotlottie-player {
    opacity: 0.5;
    transition: opacity 1s ease 3s;
}

#nav-icon4 {
	
	transition: all .3s ease;
}
.scrolled #nav-icon4 {
	top: 30px;
	transition: all .3s ease;
}

.location-btn {
    background: url('data:image/svg+xml,<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5 10.7112C5 15.563 9.24448 19.5753 11.1232 21.1135C11.3921 21.3337 11.5281 21.4451 11.7287 21.5016C11.8849 21.5455 12.1148 21.5455 12.271 21.5016C12.472 21.445 12.6071 21.3347 12.877 21.1137C14.7557 19.5754 18.9999 15.5634 18.9999 10.7116C18.9999 8.87551 18.2625 7.11438 16.9497 5.81605C15.637 4.51772 13.8566 3.78833 12.0001 3.78833C10.1436 3.78833 8.36301 4.51783 7.05025 5.81616C5.7375 7.11449 5 8.87507 5 10.7112Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M10 9.78833C10 10.8929 10.8954 11.7883 12 11.7883C13.1046 11.7883 14 10.8929 14 9.78833C14 8.68376 13.1046 7.78833 12 7.78833C10.8954 7.78833 10 8.68376 10 9.78833Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat center left 10px;
    padding-left: 40px !important;

}
.calendar-btn {
    background: url('data:image/svg+xml,<svg width="18" height="21" viewBox="0 0 18 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 7.78833H17M1 7.78833V16.5885C1 17.7086 1 18.2684 1.21799 18.6962C1.40973 19.0725 1.71547 19.3788 2.0918 19.5706C2.5192 19.7883 3.07899 19.7883 4.19691 19.7883H13.8031C14.921 19.7883 15.48 19.7883 15.9074 19.5706C16.2837 19.3788 16.5905 19.0725 16.7822 18.6962C17 18.2688 17 17.7098 17 16.5919V7.78833M1 7.78833V6.98853C1 5.86842 1 5.30795 1.21799 4.88013C1.40973 4.5038 1.71547 4.19806 2.0918 4.00632C2.51962 3.78833 3.08009 3.78833 4.2002 3.78833H5M17 7.78833V6.98524C17 5.86732 17 5.30753 16.7822 4.88013C16.5905 4.5038 16.2837 4.19806 15.9074 4.00632C15.4796 3.78833 14.9203 3.78833 13.8002 3.78833H13M13 1.78833V3.78833M13 3.78833H5M5 1.78833V3.78833" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat center left 10px;
    padding-left: 40px !important;
}

#countdown-timer {
    margin-top: 10px;
    font-size:var(--subheader);
    font-weight: 700;
}
	
	.page-content h1, .page-content h2, .page-content h3, .page-content h4, .page-content h5 {
		margin-bottom: 20px
	}

    .no-loader #myVideo {
        xopacity: 1 !important;
    }

    .coral-last:hover dotlottie-player {
        opacity: 0;
        transition: opacity 1s ease 0s !important;
    }

    @media (min-width: 1024px) {
        .coral-last dotlottie-player {
            height: 400px !important;
            width: 400px !important;
        }
    }

/* END CONTENT */

/* PAGES */
body.page-id-14, body.page-id-14 #menu {
    background-color: #154763;
}
body.page-id-16, body.page-id-16 #menu {
    background-color: #1B9069;
}
body.page-id-18, body.page-id-18 #menu {
    background-color: #A769B2;
}
body.page-id-20, body.page-id-20 #menu {
    background-color: #014E5C;
}
body:not(.home) #menu {
    color: #fff;
}
body:not(.home) .menu-divider, body:not(.home) #nav-icon4 span {
    background-color: #fff;
}

.header-social {
    gap: 15px;
    margin-bottom: 10px;
}
.divider {
    height: 10px;
	background: url('https://admgradshow.com/wp-content/uploads/2025/03/Progress-Bar.png') repeat-x center center;
	background-size: contain;
}
.page-content > h1 {
    margin-top: 75px;
    margin-bottom: 75px;
}
.page-content {
    padding-bottom: 75px;
}
.card-header {
    text-transform: uppercase;
}
.card, .card-header, .card-body {
    padding: 0;
    background: transparent;
    border: none;
}
.card {
    background: url('data:image/svg+xml,<svg width="380" height="2" viewBox="0 0 380 2" fill="none" xmlns="http://www.w3.org/2000/svg"><line x1="379.5" y1="0.635742" x2="0.5" y2="0.635709" stroke="white" stroke-linecap="round" stroke-dasharray="1 3"/></svg>') repeat-x top center;
    padding: 30px 0;
}
.card-body {
    padding-top: 30px;
}
#accordion {
    background: url('data:image/svg+xml,<svg width="380" height="2" viewBox="0 0 380 2" fill="none" xmlns="http://www.w3.org/2000/svg"><line x1="379.5" y1="0.635742" x2="0.5" y2="0.635709" stroke="white" stroke-linecap="round" stroke-dasharray="1 3"/></svg>') repeat-x bottom center;
	padding-top: 10px;
}
.card-link {
    width: 100%;
    display: block;
    position: relative;
    padding-right: 30px;
	line-height: 1.25em;
}
.card-link.collapsed::before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 25px;
    height: 25px;
    background: url('data:image/svg+xml,<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 1.63574V22.6357M12 22.6357L22.5 12.1357M12 22.6357L1.5 12.1357" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat top right;
    transition: all .3s ease;
}
.card-link:not(.collapsed)::before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 25px;
    height: 25px;
    background: url('data:image/svg+xml,<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 1.63574V22.6357M12 22.6357L22.5 12.1357M12 22.6357L1.5 12.1357" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat top right;
    transform: rotateX(-180deg);
    transition: all .3s ease;
}

.grid-container {
    display: grid;
    grid-template-columns: repeat(6, 1fr); /* 6 columns */
    grid-gap: 20px 10px;
    width: calc(100vw - 60px);
    xheight: 100vh;
    padding: 0 20px;
    position: relative;
    justify-content: center;
}

.grid-item {
    width: calc((100vw - 120px) / 6);
    height: calc((100vw - 120px) / 6);
    width: calc((var(--slideHeight) - 240px) / 6);
    height: calc((var(--slideHeight) - 240px) / 6);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 200%;
    border-radius: 50%;
    transition: transform 0.3s ease-in-out;
}

.grid-container {
    transform: scale(0.5);
    transition: all 5s ease 1s;
    opacity: 0;
    overflow-y: hidden;
    backface-visibility: hidden;
}
/* .down .fp-viewing-2 .grid-container {
    transform: scale(1.0);
    opacity: 1;
    transition: all 5s ease 1s;
}
.up .fp-viewing-2 .grid-container {
    transform: scale(1.0);
    opacity: 1;
    transition: all 5s ease 1s;
}
.down .fp-viewing-3 .grid-container {
    transform: scale(1.5);
    opacity: 0;
    transition: all 5s ease;
} */

.icon-1 {
    transform: perspective(50px) translateZ(-0);
    opacity: 1;
  }
  .icon-1b {
    transform: perspective(50px) translateZ(-50px);
    opacity: 0;
  }
  .icon-1c {
    transform: perspective(50px) translateZ(-100px);
    opacity: 0;
  }
.grid-item > img {
    position: absolute;
    top: 0;
    left: 0;
}
.grid-item {
    position: relative;
    display: block;
  }
.animate .icon-1 {
    transform-origin: right bottom;
    transform: perspective(50px) translateZ(50px);
    opacity: 0;
    transition: transform 2.5s ease, opacity 1s ease;
  }
  .animate .icon-1b {
    transform-origin: right bottom;
    transform: perspective(50px) translateZ(0px);
    opacity: 1;
    transition: transform 2.5s ease, opacity 1s ease;
  }
  .animate .icon-1c {
    transform-origin: right bottom;
    transform: perspective(50px) translateZ(-50px);
    opacity: 0;
    transition: transform 2.5s ease, opacity 1s ease;
  }
  
  .animate2 .icon-1 {
    transform-origin: right bottom;
    transform: perspective(50px) translateZ(100px);
    opacity: 0;
    transition: transform 2.5s ease, opacity 1s ease;
  }
  .animate2 .icon-1b {
    transform-origin: right bottom;
    transform: perspective(50px) translateZ(50px);
    opacity: 0;
    transition: transform 2.5s ease, opacity 1s ease;
  }
  .animate2 .icon-1c {
    transform-origin: right bottom;
    transform: perspective(50px) translateZ(-0);
    opacity: 1;
    transition: transform 2.5s ease, opacity 1s ease;
  }

  .grid-item img {
    backface-visibility: hidden;
  }
  .grid-item:nth-child(1) {transform: translateY(0px) translateX(0);}
  .grid-item:nth-child(2) {transform: translateY(2px) translateX(-4px);}
  .grid-item:nth-child(3) {transform: translateY(12px) translateX(-12px);}
  .grid-item:nth-child(4) {transform: translateY(1px) translateX(0);}
  .grid-item:nth-child(5) {transform: translateY(4px) translateX(-5px);}
  .grid-item:nth-child(6) {transform: translateY(0px) translateX(0);}

  .grid-item:nth-child(1) img {transform: scale(1);}
  .grid-item:nth-child(2) img {transform: scale(0.9);}
  .grid-item:nth-child(3) img {transform: scale(1);}
  .grid-item:nth-child(4) img {transform: scale(1.25);}
  .grid-item:nth-child(5) img {transform: scale(0.5);}
  .grid-item:nth-child(6) img {transform: scale(1);}

  .grid-item:nth-child(7) {transform: translateY(0px) translateX(0);}
  .grid-item:nth-child(8) {transform: translateY(0) translateX(-0);}
  .grid-item:nth-child(9) {transform: translateY(10px) translateX(-5px);}
  .grid-item:nth-child(10) {transform: translateY(4px) translateX(-10px);}
  .grid-item:nth-child(11) {transform: translateY(-8px) translateX(-5px);}
  .grid-item:nth-child(12) {transform: translateY(0px) translateX(0);}

  .grid-item:nth-child(7) img {transform: scale(1);}
  .grid-item:nth-child(8) img {transform: scale(1.25);}
  .grid-item:nth-child(9) img {transform: scale(0.6);}
  .grid-item:nth-child(10) img {transform: scale(1.25);}
  .grid-item:nth-child(11) img {transform: scale(0.9);}
  .grid-item:nth-child(12) img {transform: scale(0.75);}

  .grid-item:nth-child(13) {transform: translateY(0px) translateX(0);}
  .grid-item:nth-child(14) {transform: translateY(0) translateX(-0);}
  .grid-item:nth-child(15) {transform: translateY(0) translateX(-0);}
  .grid-item:nth-child(16) {transform: translateY(0) translateX(0);}
  .grid-item:nth-child(17) {transform: translateY(0) translateX(-0);}
  .grid-item:nth-child(18) {transform: translateY(0px) translateX(0);}

  .grid-item:nth-child(13) img {transform: scale(1);}
  .grid-item:nth-child(14) img {transform: scale(0.75);}
  .grid-item:nth-child(15) img {transform: scale(1.25);}
  .grid-item:nth-child(16) img {transform: scale(1.1);}
  .grid-item:nth-child(17) img {transform: scale(1);}
  .grid-item:nth-child(18) img {transform: scale(1.5);}

  .grid-item:nth-child(19) {transform: translateY(10px) translateX(5px);}
  .grid-item:nth-child(20) {transform: translateY(-4px) translateX(-10px);}
  .grid-item:nth-child(21) {transform: translateY(-3px) translateX(-5px);}
  .grid-item:nth-child(22) {transform: translateY(10px) translateX(5px);}
  .grid-item:nth-child(23) {transform: translateY(0) translateX(-0);}
  .grid-item:nth-child(24) {transform: translateY(0px) translateX(0);}

  .grid-item:nth-child(19) img {transform: scale(0.5);}
  .grid-item:nth-child(20) img {transform: scale(1.15);}
  .grid-item:nth-child(21) img {transform: scale(1);}
  .grid-item:nth-child(22) img {transform: scale(0.6);}
  .grid-item:nth-child(23) img {transform: scale(1.25);}
  .grid-item:nth-child(24) img {transform: scale(1);}

  .grid-item:nth-child(25) {transform: translateY(10px) translateX(5px);}
  .grid-item:nth-child(26) {transform: translateY(4px) translateX(10px);}
  .grid-item:nth-child(27) {transform: translateY(-10px) translateX(-15px);}
  .grid-item:nth-child(28) {transform: translateY(10px) translateX(-5px);}
  .grid-item:nth-child(29) {transform: translateY(5px) translateX(-6px);}
  .grid-item:nth-child(30) {transform: translateY(0px) translateX(0);}

  .grid-item:nth-child(25) img {transform: scale(1.15);}
  .grid-item:nth-child(26) img {transform: scale(0.5);}
  .grid-item:nth-child(27) img {transform: scale(1);}
  .grid-item:nth-child(28) img {transform: scale(1);}
  .grid-item:nth-child(29) img {transform: scale(1);}
  .grid-item:nth-child(30) img {transform: scale(0.9);}

  @keyframes rotate-delay{
    0%{ transform: rotate(0); }
    50%{ transform: rotate(360deg); }
    100%{ transform: rotate(360deg); }
    }

    @keyframes scaleUp{
        0%{ transform: scale(1); }
        50%{ transform: scale(1.5); }
        100%{ transform: scale(1); }
    }
    @keyframes scaleDown{
        0%{ transform: scale(1); }
        50%{ transform: scale(0.5); }
        100%{ transform: scale(1); }
    }
    @keyframes blur{
        0%{ filter: blur(0);
            -webkit-filter: blur(0); }
        50%{ filter: blur(2iamtepx);
            -webkit-filter: blur(2px); }
        100%{ filter: blur(0);
            -webkit-filter: blur(0); }
    }

    .grid-item:nth-child(1) {
        animation: scaleUp 3s infinite linear;
      }
      .grid-item:nth-child(2) {
        animation: rotate-delay 3s infinite linear;
    }
    .grid-item:nth-child(3) {
        animation: scaleDown 3s infinite linear;
    }
    .grid-item:nth-child(4) {
        animation: pulse 3s infinite linear;
    }
    .grid-item:nth-child(5) {
        animation: bounce 3s infinite linear;
    }
    .grid-item:nth-child(6) {
        animation: heartBeat 3s infinite linear;
    }
    .grid-item:nth-child(7) {
        animation: rubberBand 3s infinite linear;
    }
    .grid-item:nth-child(8) {
        animation: swing 3s infinite linear;
    }
    .grid-item:nth-child(9) {
        animation: wobble 3s infinite linear;
    }
    .grid-item:nth-child(10) {
        animation: rotate 10s infinite linear;
    }
    .grid-item:nth-child(11) {
        animation: rotate 10s infinite linear;
    }
    .grid-item:nth-child(12) {
        animation: shakeX 6s infinite linear;
    }
    .grid-item:nth-child(13) {
        animation: rotate 5s infinite linear;
    }
    .grid-item:nth-child(14) {
        animation: scaleDown 3s infinite linear;
    }
    .grid-item:nth-child(15) {
        animation: shakeY 6s infinite linear;
    }
    .grid-item:nth-child(16) {
        animation: rotate-delay 3s infinite linear;
    }
    .grid-item:nth-child(17) {
        animation: rotate-delay 6s infinite linear;
    }
    .grid-item:nth-child(18) {
        animation: flash 3s infinite linear;
    }
    .grid-item:nth-child(19) {
        animation: bounce 3s infinite linear;
    }
    .grid-item:nth-child(20) {
        animation: swing 3s infinite linear;
    }
    .grid-item:nth-child(21) {
        animation: tada 3s infinite linear;
    }
    .grid-item:nth-child(22) {
        animation: scaleIn 3s infinite linear;
    }
    .grid-item:nth-child(23) {
        animation: rotate 5s infinite linear;
    }
    .grid-item:nth-child(24) {
        animation: shakeX 10s infinite linear;
    }
    .grid-item:nth-child(25) {
        animation: flip 3s infinite linear;
    }
    .grid-item:nth-child(26) {
        animation: headShake 3s infinite linear;
    }
    .grid-item:nth-child(27) {
        animation: flash 3s infinite linear;
    }
    .grid-item:nth-child(28) {
        animation: shakeX 10s infinite linear;
    }
    .grid-item:nth-child(29) {
        animation: rotate-delay 3s infinite linear;
    }
    .grid-item:nth-child(30) {
        animation: blur 10s infinite linear;
    }
   

    .grid-item {
        opacity: 0;
        transition: opacity 1s ease;
        backface-visibility: hidden;
    }
    .fp-viewing-2 .grid-item:nth-child(1) {
        opacity: 1;
        transition: opacity 1s ease 1.5s;
      }
      .fp-viewing-2 .grid-item:nth-child(2) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(3) {
        opacity: 1;
        transition: opacity 1s ease 1.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(4) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(5) {
        opacity: 1;
        transition: opacity 1s ease 1.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(6) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(7) {
        opacity: 1;
        transition: opacity 1s ease 2.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(8) {
        opacity: 1;
        transition: opacity 1s ease 1.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(9) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(10) {
        opacity: 1;
        transition: opacity 1s ease 1.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(11) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(12) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(13) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(14) {
        opacity: 1;
        transition: opacity 1s ease 2.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(15) {
        opacity: 1;
        transition: opacity 1s ease 2.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(16) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(17) {
        opacity: 1;
        transition: opacity 1s ease 1.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(18) {
        opacity: 1;
        transition: opacity 1s ease 2.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(19) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(20) {
        opacity: 1;
        transition: opacity 1s ease 1.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(21) {
        opacity: 1;
        transition: opacity 1s ease 1.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(22) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(23) {
        opacity: 1;
        transition: opacity 1s ease 2.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(24) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(25) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(26) {
        opacity: 1;
        transition: opacity 1s ease 2.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(27) {
        opacity: 1;
        transition: opacity 1s ease 1.5s;
    }
    .fp-viewing-2 .grid-item:nth-child(28) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(29) {
        opacity: 1;
        transition: opacity 1s ease 2s;
    }
    .fp-viewing-2 .grid-item:nth-child(30) {
        opacity: 1;
        transition: opacity 1s ease 1.5s;
    }

/* END PAGES */

/* DESKTOP */
@media (min-width: 1024px) {
    header {
    left: 50%;
    transform: translateX(-50%);
    width: 50%;
    max-width: 700px;
    }
    #nav-icon4 {
        right: calc(((100% - 700px)/2) + 27px);
    }
    .slides {
        max-width: calc(700px - 50px);
        margin: 0 auto;
    }
    #intro, .page-content {
        max-width: calc(700px - 0px);
        margin: 0 auto;
    }
    .footer-time span {
        display: block;
        width: 90px;
    }
}
/* END DESKTOP */

@media (min-width: 1024px) {
    :root {
        --slideHeight: calc(100dvh - 400px);
        --h1: 48px;
        --h2: 24px;
        --h3: 20px;
        --h4: 12px;
        --subheader: 24px;
        --body: 18px;
        --body-lh: 24px;
        --button: 18px;
        --aux: 16px;
    }
    #date, #location {
        font-size: 1vw;
        line-height: 1.333em;
        top: 20px;
    }
    #date::before, #location::before {
        width: 15px;
        height: 15px;
        top: -20px;
    }
    #menu {
        width: 100vw;
        height: 100vh;
        left: 0;
        right: 0;
    }
    .slide-2 .fp-overflow {
        height: calc(var(--slideHeight) - 80px);
        display: flex
    ;
        flex-direction: row;
        justify-content: space-evenly !important;
        align-items: center;
        gap: 100px;
    }
    #ntu-logo img {
        max-height: 64px;
    }
    .slide-date h3::before, .slide-loc h3::before {
        width: 2vw;
        height: 2vw;
    }
	/* #intro, .page-content {
		margin-left: 20%;
        width: 60%;
	} */
}

.tablet { display: none; }
.desktop {
    display: block;
}
/* TABLET */
@media (min-width: 768px) and (max-width: 1023.98px) { 
    :root {
        --slideHeight: calc(100dvh - 400px);
        --h1: 56px;
        --h2: 32px;
        --h3: 28px;
        --h4: 18px;
        --subheader: 28px;
        --body: 18px;
        --body-lh: 24px;
        --button: 20px;
        --aux: 18px;
    }
.tablet, .tablet.desktop { display: block; }
.tablet.flex { display: flex; }
.desktop { display: none; }
#nav-icon4 {
    width: 30px;
    height: 20px;
    position: fixed;
    top: 53px;
    right: 56px;
}
#date, #location {
    font-size: 2vw;
    line-height: 1.333em;
    top: 2.5vw;
}
#adm2025 img, header {
    width: 100%;
}
header {
    padding: 50px;
}
.slide-2 .fp-overflow {
    height: calc(var(--slideHeight) - 80px);
    display: flex
;
    flex-direction: row;
    justify-content: space-evenly !important;
    align-items: center;
    gap: 100px;
}
#date::before, #location::before {
    width: 1.8vw;
    height: 1.8vw;
}
#ntu-logo img {
    max-height: 64px;
}
}/* END TABLET */

.mobile { display: none; }

@media (max-width: 767.98px){ 
.mobile { display: block; }
.mobile.flex { display: flex; }
.desktop { display: none; }
}

@media (min-width: 1700px) {
    #date, #location {
        font-size: 15px;
    }
}