@import url('https://fonts.googleapis.com/css2?family=Beau+Rivage&display=swap');
/************ TEMPLATE  ****************/

.site-1 {
    --primary-color: #000040;
    --secondary-color: #eedb5b;

    --primary-rgb: 0, 0, 64;
    --secondary-rgb: 238, 219, 91;

    --default-white: #ffffff;
    --default-black: #000000;

    --title-font-family: 'Beau Rivage', serif;
    --body-font-family: 'Lato', sans-serif;

    --heading-color: var(--primary-color);
    --heading-font-family: var(--title-font-family);

    --title-border-bottom: 1px solid var(--secondary-color);

    --home-title-font: var(--title-font-family);

    --transparent: rgba(255,255,255,0);

    --default-box-shadow: 0px 0px 10px rgba(0,0,0,.5);

    --swiper-box-shadow: var(--default-box-shadow);

    --ql-title-color: var(--default-white);

    --grid-font-size-desktop: 3vw;

    --h2-font-variant-caps: normal;

    --mt-background-color: rgba(var(--primary-rgb),.65);    
    --mt-height-mobile: fit-content;

    --ph-title-font-size-mobile: 5vw;
}

.school {
    --primary-color: #005ea5;
    --secondary-color: #003258;
    --tertiary-color: #eedb5b;

    --primary-rgb: 0, 94, 165;
    --secondary-rgb: 0, 50, 88;
    --tetiary-rgb: 238, 219, 91;

    --default-white: #ffffff;
    --default-black: #000000;

    --title-font-family: 'Libre Baskerville', serif;
    --body-font-family: 'Open Sans', sans-serif;

    --heading-color: var(--primary-color);
    --heading-font-family: var(--title-font-family);

    --ph-big-sq-width: 34vw;
    --ph-box-shadow: var(--default-box-shadow);
    --ph-title-color: var(--primary-color);
    --ph-title-font-size-desktop: 1.7vw;
    --ph-title-font: var(--title-font-family);
    --ph-text-font-size-deskto: 1.2rem;
    --ph-background-color: white;

    --rok-mini-g-title-size: clamp(3rem, 4vw, 6rem);
    --rok-mini-border-radius: 0.5rem;
    --rok-mini-title-weight: bold;
    --rok-mini-text-weight: bold;
    --rok-mini-title-size-mobile: 1.1rem;
    --rok-mini-title-color: var(--default-black);
    --rok-mini-box-shadow: none;
}

.school #g-navigation {
    --ql-title-color: var(--default-white);
    --ql-icon-color: var(--default-white);
    --ql-background-hover: none;
    --ql-title-hover: var(--tertiary-color);
    --ql-icon-hover: var(--tertiary-color);
}

.readon, .button, .btn, p.readmore .btn, .sprocket-lists-portrait-container > li .sprocket-lists-portrait-item > a span, .listentobutton.moduletable a {
    background: var(--primary-color);
    font-family: 'Lato', sans-serif;
}

a.yellow-button {
    background: #eedb5b;
    border-radius: 50px;
    color: #000040 !important;
    padding: .7rem 1.3rem;
    transition: all 300ms ease-in-out;
}

a {
    color: #d3c044;
}

a.yellow-button:hover {
    transition: all 300ms ease-in-out;
    transform: scale(0.98);
    background-color: #faec8d;
}

/*************** ALL SITE *****************/
.item-image {display: none;}

h2.g-title {
    font-weight: 400;
}

.block-padding-fix .g-content {
    padding: 0;
    margin: 0;
}

.block-padding-fix .g-array-item-text {
    margin: 0;
} 

.grid-block-center {
    display: grid;
    justify-content: center;
    align-items: center;
}

.school-sub .page-header h2 {
    font-size: 3rem;
}

#hero:not(.active) #hero-grab #hero-title-text {
    transform: translatey(var(--hero-img-height));
} 

@media (max-width: 50.99rem) {
    #hero:not(.active) #hero-grab #hero-title-text {
        transform: translatey(var(--hero-img-height-mobile));
    } 
}

#hero-title-text {
    z-index: 5 !important;
}

/* adding more padding above and below the grids */

.site-2-grid #g-container-main {
    padding: 3% 0 !important;
}


/* fixing the tables to not get cut off on mobile on the tuition page /admissions/tuition-fees */

@media (max-width: 50.99rem) {

    .mobile-tables .equaltable {
        display: table;
        border: 1px solid #d4dce3;
    } 

    .mobile-tables .equaltable td {
        display: table-cell;
        width: fit-content;
        border: 1px solid #d4dce3;
    }

    .mobile-tables .equaltable tbody {
        display: table-row-group;
        border: 1px solid #d4dce3;
    }

    .mobile-tables .equaltable tr {
        display: table-row;
        border: 1px solid #d4dce3;
    }

}

.mobile-tables .equaltable td,
.mobile-tables .equaltable tbody,
.mobile-tables .equaltable tr,
.mobile-tables .equaltable {
    border: 1px solid #d4dce3;
} 


/***********Custom Scrollbar****************/

/* Hide the default scrollbar */
::-webkit-scrollbar {
    width: .75rem;
  }
  
  ::-webkit-scrollbar-track {
    background-color: #f5f5f5;
  }
  
  ::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 5px;
  }
  
  /* Style the scrollbar on hover */
  ::-webkit-scrollbar-thumb:hover {
    background-color: #bbbbbb;
  }
  
  /* Style the scrollbar when it's being dragged */
  ::-webkit-scrollbar-thumb:active {
    background-color: #8c8c8c;
  }

/*************** HOMELAYOUT ***************/ 
/*************** OFFCANVAS ****************/
.g-offcanvas-toggle {color: var(--primary-color);} 
.g-offcanvas-toggle .fa-fw {text-shadow: none;}

/*************** TOP **********************/ 

#g-top .g-item-title a {
    pointer-events: none;
    font-size: clamp(1.5rem, 2.5vw, 4rem);
}

/*************** NAVIGATION ***************/

.site-1-home #g-navigation {
    padding-bottom: 60vw;
}

:is(.site-1, .school) #g-navigation .g-social-items > a:not(:first-child) {
    padding-left: 1rem;
}

.site-1 #g-navigation a:not(.button) {
    color: var(--secondary-color);
}

.site-1 #g-navigation a:not(.button):hover {
    color: white;
}

@media (max-width: 50.99rem) {
    .site-1 .header-logo {
        width: 100%;
        max-width: 100% !important;
        padding-left: 10%;
    }

    .site-1 #g-navigation .g-content {
        padding: 1rem;
    }
}

@media (min-width: 50.99rem) {
    .header-logo {
        padding-left: 7%;
    }
    
    .header-logo img {
        width: 60% !important;
    }
    
    .header-logo-padding > div {
        padding: 0 1.5rem;
    }

    .site-1-home #g-navigation {
        background: url(/images/template/sg-right.png) no-repeat top right;
        background-size: 80%;
        background-position: 194% 114%;
    }

    .site-1-sub #g-navigation {
        background: url(/images/template/sg-right.png) no-repeat top right;
        background-size: 80%;
        background-position: 212% 10%;
    }

}

/* school */

.school #g-navigation a:not(.button) {
    color: var(--default-white);
}

.school #g-navigation a:not(.button):hover {
    color: var(--tertiary-color);
}

.school #g-navigation .g-main-nav {
    box-shadow: var(--default-box-shadow);
    position: relative;
    z-index: 10;
}

.ql-fa-toplinks .g-blockcontent-subcontent-block:hover .g-blockcontent-subcontent-title-icon,
.ql-fa-toplinks .g-blockcontent-subcontent-block:hover .g-blockcontent-subcontent-title-text {
    transition: all 0.2s ease-in-out;
}

/*************** SLIDESHOW ****************/ 

.site-1-home #g-slideshow {
    margin-top: -60vw !important;
}

.ql-inner-box .g-blockcontent-subcontent-title {
    background: rgb(0 0 64 / 73%);
}

.site-1-home .ql-inner-box a {
    color: transparent !important;
}

.site-1-home .ql-inner-box #g-slideshow a:hover {
    color: transparent !important;
}

.site-1-home #g-slideshow .ql-inner-box a:hover {
    color: transparent !important;
}

@media (min-width: 50.99rem) {
    .site-1-home #g-slideshow > .g-container {
        padding: 2vw !important;
    }

    .site-1-home #g-slideshow > .g-container > .g-grid:nth-child(1) {
        gap: 2vw;
        flex-flow: row !important;
    }

    .site-1-home #g-slideshow > .g-container > .g-grid:nth-child(2) {
        padding-top: 2rem;
    }

    .ql-inner-box .g-blockcontent-subcontent-title > .g-blockcontent-subcontent-title-text {
        border: 1px solid var(--secondary-color);
        font-weight: 400;
        font-size: clamp(2rem, 2.5vw, 3.5rem);
    }

    .ql-vw15 .g-blockcontent-subcontent-block-content {
        height: 12vw;
    }

    .ql-inner-box .g-blockcontent-subcontent {
        gap: 1rem;
    }
}

@media (max-width: 50.99rem) {
    .site-1-home {
        --mt-background-color: rgba(var(--primary-rgb),.65); 
    }

    .ql-inner-box .g-blockcontent-subcontent-title {
        font-family: var(--title-font-family);
        box-shadow: var(--default-box-shadow);
        border-radius: 5px;
    }

    .ql-dm .g-blockcontent-subcontent-title > .g-blockcontent-subcontent-title-text {
        font-weight: 400;
        font-size: 2rem;
    }

    .mass-times-block {
        background: url(/images/stories/template/masstimes.jpg) no-repeat center top / cover;
    }
}

/* school */

.school #g-slideshow {
    position: relative;
}

.school #swiper-7896-particle::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: -2%;
    background: #ffffff;
    width: 52%;
    height: 35px;
    display: block;
    transform: skew(45deg) translateX(-11px);
    z-index: 2;
}

.school #swiper-7896-particle::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: -2%;
    background: #ffffff;
    width: 52%;
    height: 35px;
    display: block;
    transform: skew(-45deg) translateX(11px);
    z-index: 2;
}

.school #g-slideshow .swiper-pagination-parent-7896 {
    bottom: 4%;
}

.school .g-swiper .g-swiper-slider .swiper-slide .slide .slide-content-wrapper {
    display: initial;
    position: absolute;
    bottom: 17%;
    left: 7%;
    /* transform: translate(-60%, 40%); */
    height: initial;
    width: max-content;
    max-width: 90%;
}

.school .g-swiper-text :is(h1,h2,h3,h4,h5,h6,p) {
    color: white !important;
}

.school .g-swiper-text h1 {
    font-size: clamp(1.2rem, 6vw, 8rem);
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

@media (max-width: 50.99rem) {
    .school .g-swiper .g-swiper-slider .swiper-slide .slide .slide-content-wrapper {
        display: initial;
        position: absolute;
        bottom: 50%;
        left: 50%;
        transform: translate(-50%, 50%);
        height: initial;
        width: max-content;
    }
}

/*************** HEADER *******************/

/* school */

#g-header > .g-container {
    width: 100%;
}

.ql-list .g-blockcontent-subcontent {
    display: flex;
    flex-flow: column;
    list-style: none;
    margin: 0;
    padding: 0;
    text-rendering: optimizespeed;
}

.ql-list .g-blockcontent-subcontent-block-content {
    padding: 0%;
    position: relative;
    margin: 0.4rem;
}

.ql-list .g-blockcontent-subcontent-title {
    text-align: center;
    margin: 0;
    padding: 5px;
    background-color: var(--primary-color);
    color: white;
    transform: scale(1);
    transition: all 0.1s ease-in-out;
    box-shadow: var(--default-box-shadow);
}

.ql-list .g-blockcontent-subcontent-title-text {
    font-weight: normal;
    font-variant-caps: small-caps;
}

.ql-list .g-blockcontent-subcontent-block-content:hover .g-blockcontent-subcontent-title {
    transition: all 0.2s ease-in-out;
    transform: scale(0.98);
}

.ql-list .g-blockcontent-buttons,
.ql-list .g-blockcontent-buttons a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    background: transparent;
    color: transparent;
}

.mission-statement h1 {
    font-size: clamp(4rem, 5vw, 6rem);
}

.mission-statement p {
    margin-bottom: 0;
    line-height: 1.5;
    font-size: clamp(1.2rem, 1.5vw, 2rem);
}

.mission-statement,
.ql-list {
    padding: 2% 3%;
}

@media only all and (max-width: 50.99rem) {
    .school #g-header {
        padding: 0 5%;
    }
}

.school-home #g-header {
    padding-bottom: 35px;
}

/*************** ABOVE ********************/

.school-theme p {
    margin-bottom: 0;
    line-height: 1.5;
}

.school-theme .g-joomla-articles > .g-grid {
    padding: 5% 0;
}

.school-home #g-above {
    box-shadow: var(--default-box-shadow);
}

@media (max-width: 50.99rem) {
    .school-theme .g-joomla-articles > .g-grid {
        padding: 5%;
    }
}

/*************** SHOWCASE *****************/
/*************** UTILITY ******************/
/*************** FEATURE ******************/
/*************** MAIN *********************/

/* subpages */
.site-1-sub .page-header h2 {
    font-size: 4rem;
}

.site-1-sub.outline-18 #g-mainbar {
    padding: 5% 5%;
}
/*  */

.site-1-home #g-container-main :is(h1,h2,h3,h4,h5,h6):not(.g-item-title) {
    font-size: clamp(3rem, 3vw, 3.75rem);
    border-bottom: 1px solid var(--secondary-color);
    padding-bottom: 0;
}

.site-1 #g-main-nav .g-social-items > a:not:first-child {
    padding-left: 1rem;
}

.site-1-home #g-mainbar {
    padding-top: 1rem;
}

.site-1-home .ph-sidepics-3 .g-item-title {
    font-family: var(--body-font-family);
}

@media (max-width: 50.99rem) {
    .site-1-home #g-sidebar, .site-1-home #g-mainbar {
        padding: 8%;
    }
}

@media (min-width: 50.99rem) {
    .site-1-home #g-sidebar {
        padding-left: 3rem;
    }

    .site-1-home .ph-sidepics-3.ph-square .g-array-item {
        max-height: 15vw;
    }
}

/* school */

.school-home #g-mainbar > .g-grid:nth-child(2) {
    margin-top: 4%;
}

.school-home .ph-sq-5 .g-content-array > .g-grid:nth-child(1) {
    justify-content: center;
}

.school-home .ph-sq-5 .g-title {
    font-size: clamp(3rem, 4vw, 6rem);
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    color: white;
    padding-left: 1%;
}

.school-home #g-container-main {
    padding: 5%;
    padding-right: 0;
}

.school-home #g-container-main {
    background: url(/images/stories/template/school-news-bg.jpg) no-repeat fixed center / cover;
    position: relative;
}

.school-home #g-container-main::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #000000a3;
}

.school-home #g-container-main::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(to top, #005da53c, transparent);
}

.school-home #g-container-main > .g-grid {
    position: relative;
    z-index: 10;
}

/*************** EXPANDED *****************/ 

.social-padding-bottom {
    padding-bottom: 2%;
}

.site-1-home #g-expanded {
    padding: 3%;
    background: url("/images/template/ql-marble1.png") no-repeat center;
    background-size: cover;
}

@media (max-width: 50.99rem) {
    .site-1-home #g-expanded h1 {
        font-size: 3rem;
    }
}

/* school */

.school-home #g-expanded {
    padding: 3% 5%;
}

/*************** EXTENSION ****************/

.site-1-home #g-extension {
    padding: 10% 20%;
    position: relative;
}

.site-1-home #g-extension::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(var(--primary-rgb), 0.65);
}

.bring-to-front {
    position: relative;
    z-index: 10;
}

.site-1-home #g-extension :is(h1,h2,h3,h4,h5,h6) {
    font-size: clamp(3rem, 4vw, 5rem);
    margin-bottom: 3rem;
    color: var(--secondary-color);
    text-shadow: 2px 2px 4px #000000;
}

.site-1-home #g-extension p {
    font-size: clamp(1.2rem, 1.5vw, 3rem);
    margin-bottom: 0;
    line-height: 1.5;
    color: white;
    text-shadow: 2px 2px 4px #000000;
}

.site-1-home #g-extension {
    background: url("/images/template/rotator2.jpg") no-repeat center;
    background-size: cover;
}

.school-home #g-extension .g-social-items span:hover {
    color: var(--tertiary-color) !important;
    transition: 0.2s all ease-in-out;
}

@media (max-width: 50.99rem) {
    .site-1-home #g-extension {
        padding: 10% 10%;
    }
}

/* school */

.school-home #g-extension {
    padding: 3% 5%;
    background: url("/images/stories/template/life-bg.jpg") no-repeat center / cover;
    position: relative;
}

.school-home #g-extension::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.65);
}

.school-home #g-extension::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(to top, #005da55f, transparent);
}

.school-home #g-extension > .g-grid {
    position: relative;
    z-index: 99;
}

.school-home #g-extension h1 {
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.school-home #g-extension .g-social-items span {
    color: white;
}

.school-home .rocket-report h1 {
    color: var(--primary-color) !important;
    text-shadow: none !important;
}

.school-home .rocket-report > div {
    height: 100%;
    border-radius: 15px;
    background-color: white;
    padding: 2rem;
    margin: auto;
    max-height: 600px;
    max-width: 500px;
    margin-top: 2.125rem;
}

.rocket-report .module_document {
    border-radius: 5px;
    background-color: white;
    border: 2px solid var(--primary-color);
    position: relative;
    transition: all 0.1s ease-in-out;
    margin: 1.5rem 5% !important;
    box-shadow: var(--default-box-shadow);
}

.rocket-report .module_document:hover .koowa_header__title_link {
    transform: scale(0.98);
    transition: all 0.2s ease-in-out;
    color: var(--primary-color);
}

.rocket-report .module_document:hover {
    transform: scale(0.98); 
    transition: all 0.3s ease-in-out;
}

.rocket-report .koowa_header__title_link {
    font-size: clamp(1.2rem, 1.75vw, 2.75rem);
    width: 100%;
    display: block;
    height: 100%;
    padding: 1rem;
}

.rocket-report .koowa_header {
    justify-content: center;
    margin: 0 !important;
}

@media (max-width: 50.99rem) {
    .school-home .rocket-report > div {
        margin-bottom: 2.125rem;
    }

    .rocket-report {
        height: fit-content;
    }
}

/*************** BOTTOM *******************/

.site-1-home #g-bottom img {
    border-radius: 5px;
    box-shadow: var(--default-box-shadow);
}

@media (max-width: 50.99rem) {
    .site-1-home #g-bottom img {
        max-width: 350px;
    }
}

/*************** FOOTER *******************/
#g-footer .g-content-array {margin: 0;}
#g-footer a {color: var(--default-white);} 

.site-1 #g-footer {
    padding-bottom: 2rem;
}

#g-footer a:hover {
    color: #c2c2c2;
}

.footer-logo > div {
    padding: 0;
}

.footer-logo img {
    width: 75%;
    max-width: 265px;
}

.footer-spacing p {
    margin-bottom: 0;
    line-height: 2;
}

.footer-spacing :is(h1,h2,h3,h4,h5,h6) {
    margin-top: 0;
    font-size: clamp(2rem, 3vw, 4rem);
}

.bottom-ads .g-content {
    padding-bottom: 0%;
}

@media (max-width: 50.99rem) {
    .site-1 #g-footer {
        padding: 0 10%;
    }

    .site-1 .footer-info {
        padding-top: 2rem;
    }
}

@media (max-width: 50.99rem) {

    .school .school-image img {
        width: 30%;
        text-align: center;
    }

}

/*************** COPYRIGHT ****************/ 
/*************** MODULES ******************/
.moduletable .nav.menu, .moduletable .unstyled {background: var(--primary-color);} 
.moduletable .nav.menu li.current.active a, .moduletable .nav.menu li a:hover {    
    color: var(--primary-color); 
    background: var(--secondary-color);
} 

/*************** SECTIONS *****************/
/*************** MOBILE *******************/ 
/*************** ADS **********************/

/* subpages */

.school .moduletable .nav.menu li.current.active a, .moduletable .nav.menu li a:hover {
    color: white;
}

/* Landing Page CSS /landing-cl or / */

.landing .ql-height-13vw .g-blockcontent-subcontent-block-content {
    height: 40vw;
}

.landing {
    --ql-font-size-desktop: 2.5vw;
}

.landing-logo img {
    width: 75% !important;
}

.landing .g-content-array .g-grid:not(:first-child) .g-content {
    padding-top: 0rem;
}

.landing #g-navigation,
.landing #g-footer {
    box-shadow: var(--default-box-shadow);
    position: relative;
}

.landing #g-top p {
    margin-bottom: 0;
    line-height: 1.5;
}

.landing #g-top .g-content-array .g-grid {
    margin-bottom: 0;
}

@media (max-width: 50.99rem) {
    .landing #g-top {
        padding: 0 !important;
    }

    .landing-logo img {
        width: 100% !important;
    }

    .landing #g-utility {
        padding: 5%;
    }
}

#mayfestCountdown {
  max-width: 900px;
  margin: 0 auto;
  background: #1f405f;
  padding: clamp(1rem, 2vw, 2rem);
  box-sizing: border-box;
  text-align: center;
  margin-bottom: 3rem;
}

#mayfestCountdown .mayfest-image-box {
  width: 100%;
  overflow: hidden;
}

#mayfestCountdown .mayfest-image-box img {
  display: block;
  width: 100%;
  height: auto;
}

#mayfestCountdown .mayfest-timer {
  margin: clamp(1rem, 2vw, 1.75rem) auto 0;
  background: #aebdca;
  border-radius: clamp(.5rem, 1vw, 1rem);
  padding: clamp(.75rem, 1.5vw, 1.25rem);
  display: flex;
  justify-content: center;
  gap: clamp(1rem, 4vw, 4rem);
  box-sizing: border-box;
}

#mayfestCountdown .mayfest-time-group {
  display: flex;
  flex-direction: column;
  align-items: center;
}

#mayfestCountdown .mayfest-label {
  font-family: Arial, sans-serif;
  font-size: clamp(.85rem, 2vw, 1.65rem);
  font-weight: 700;
  color: #3d432f;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: clamp(.35rem, .75vw, .6rem);
}

#mayfestCountdown .mayfest-digits {
  display: flex;
  gap: clamp(.35rem, .8vw, .75rem);
}

#mayfestCountdown .mayfest-digit {
  background: #ffdc64;
  color: #000;
  font-family: Impact, Haettenschweiler, "Arial Black", sans-serif;
  font-size: clamp(2.75rem, 9vw, 6.5rem);
  line-height: 1;
  min-width: clamp(2.5rem, 7vw, 5.5rem);
  padding: clamp(.35rem, 1vw, .75rem) clamp(.25rem, .75vw, .55rem);
  border-radius: clamp(.35rem, .75vw, .65rem);
  display: flex;
  justify-content: center;
  align-items: center;
}

.mayfest-popup-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(0, 0, 0, .65);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.mayfest-popup {
  position: relative;
  background: #1f405f;
  color: #ffdc64;
  border-radius: 1rem;
  padding: 2rem;
  max-width: 550px;
  width: 100%;
  text-align: center;
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, .35);
}

.mayfest-popup h2 {
  margin: 0 0 .5rem;
  font-size: clamp(2rem, 6vw, 4rem);
}

.mayfest-popup p {
  margin: 0;
  font-size: clamp(1.25rem, 4vw, 2rem);
  font-weight: 700;
}

.mayfest-popup-close {
  position: absolute;
  top: .5rem;
  right: .75rem;
  background: transparent;
  border: 0;
  color: #fff;
  font-size: 2rem;
  cursor: pointer;
}

@media only screen and (max-width: 50.99rem) {
  #mayfestCountdown .mayfest-timer {
    gap: clamp(.65rem, 3vw, 1.5rem);
    padding: .75rem;
  }

  #mayfestCountdown .mayfest-digit {
    font-size: clamp(2rem, 10vw, 4rem);
    min-width: clamp(1.8rem, 8vw, 3.25rem);
  }
}