#app,
body,
html,
button {
    font-family: Roboto, sans-serif !important;
    --font-family: Roboto, sans-serif !important;
}

#view-header .school-info .org-name {
    font-weight: 700;
    text-transform: uppercase;
}

@media only screen and (min-width: 600px) {
    #view-header .logo {
        height: 85px;
    }
}
#view-header .logo img {
    object-fit: contain;
}
@media only screen and (min-width: 1041px) {
    #view-header .logo {
        height: 104px;
    }
    .loudoun-county-public-schools #view-header .logo {
        height: 106px;
    }
    #view-header .menu:not(.search) .button-action-content svg {
        background-color: var(--primary-color);
        border-radius: 3px;
        fill: #FFF;
    }
    #view-header .m4--menu-item .m4--menu-item-text,
    #view-header .languages span, #view-header .menu span, #view-header .schools span {
        font-size: 15px;
    }
}
@media only screen and (min-width: 1280px) {
   #view-header #h1 .header-container {
    padding-block: 10px;
   }
}
@media only screen and (min-width: 1550px) {
    #view-header button.search svg {
        stroke: var(--primary-color);
    }
    #view-header .languages span, #view-header .menu span, #view-header .schools span {
        font-size: 17px;
    }
}
#cms-header:has(#customSchoolsDropdown) .mobile-header #schoolsbutton .button-action-content * {
    vertical-align: middle;
}
#cms-header:has(#customSchoolsDropdown) .mobile-header #schoolsbutton svg rect {
    fill: none !important;
}
#cms-header .arrow {
  fill: var(--bg-color) !important;
}
#languagebutton::before {
    background: var(--nav-color);
    content: close-quote;
    display: block;
    -webkit-mask-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIwNjlfNDczOCkiPgo8cGF0aCBkPSJNMi4xMDkzOCAzLjc0ODA1SDguNzUwMjEiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNNS40MTc5NyAyLjA4MjAzVjMuNzQ4NyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik03LjUgMy43NUM3LjE2OTA4IDQuOTQ0MTMgNi41MzQ2NCA2LjAzMjI0IDUuNjU4NDQgNi45MDg0NEM0Ljc4MjI0IDcuNzg0NjQgMy42OTQxMyA4LjQxOTA4IDIuNSA4Ljc1IiBzdHJva2U9IndoaXRlIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTMuMzMyMDMgMy43NUMzLjY2Mjk1IDQuOTQ0MTMgNC4yOTczOSA2LjAzMjI0IDUuMTczNTkgNi45MDg0NEM2LjA0OTc5IDcuNzg0NjQgNy4xMzc5IDguNDE5MDggOC4zMzIwMyA4Ljc1IiBzdHJva2U9IndoaXRlIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTEyLjA4MiAxNy45MTYzTDE0LjE5MiAxMi4yOTA1QzE0LjIyMTkgMTIuMjExMiAxNC4yNzUyIDEyLjE0MjggMTQuMzQ0OSAxMi4wOTQ2QzE0LjQxNDUgMTIuMDQ2NCAxNC40OTczIDEyLjAyMDUgMTQuNTgyIDEyLjAyMDVDMTQuNjY2OCAxMi4wMjA1IDE0Ljc0OTUgMTIuMDQ2NCAxNC44MTkyIDEyLjA5NDZDMTQuODg4OSAxMi4xNDI4IDE0Ljk0MjIgMTIuMjExMiAxNC45NzIgMTIuMjkwNUwxNy4wODIgMTcuOTE2MyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xMi43MDcgMTYuMjQ4SDE2LjQ2NyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xLjI1MTMgMC40MTUwMzlIOS41ODQ2NEM5LjU4NDY0IDAuNDE1MDM5IDEwLjQxOCAwLjQxNTAzOSAxMC40MTggMS4yNDgzN1Y5LjU4MTcxQzEwLjQxOCA5LjU4MTcxIDEwLjQxOCAxMC40MTUgOS41ODQ2NCAxMC40MTVIMS4yNTEzQzEuMjUxMyAxMC40MTUgMC40MTc5NjkgMTAuNDE1IDAuNDE3OTY5IDkuNTgxNzFWMS4yNDgzN0MwLjQxNzk2OSAxLjI0ODM3IDAuNDE3OTY5IDAuNDE1MDM5IDEuMjUxMyAwLjQxNTAzOVoiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMTIuNDk4NyA5LjU4MzAxSDE4Ljc0ODdDMTguOTY5NyA5LjU4MzAxIDE5LjE4MTcgOS42NzA4MSAxOS4zMzggOS44MjcwOUMxOS40OTQyIDkuOTgzMzcgMTkuNTgyIDEwLjE5NTMgMTkuNTgyIDEwLjQxNjNWMTguNzQ5N0MxOS41ODIgMTguOTcwNyAxOS40OTQyIDE5LjE4MjcgMTkuMzM4IDE5LjMzODlDMTkuMTgxNyAxOS40OTUyIDE4Ljk2OTcgMTkuNTgzIDE4Ljc0ODcgMTkuNTgzSDEwLjQxNTRDMTAuMTk0NCAxOS41ODMgOS45ODIzOSAxOS40OTUyIDkuODI2MTEgMTkuMzM4OUM5LjY2OTgzIDE5LjE4MjcgOS41ODIwMyAxOC45NzA3IDkuNTgyMDMgMTguNzQ5N1YxMi40OTk3IiBzdHJva2U9IndoaXRlIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTUgMTkuMTY1NEw2LjY2NjY3IDE3LjQ5ODdMNSAxNS44MzIiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMS42Njc5NyAxMy4zMzNDMS42Njc5NyAxNC40MzgxIDIuMTA2OTYgMTUuNDk3OSAyLjg4ODM2IDE2LjI3OTNDMy42Njk3NiAxNy4wNjA3IDQuNzI5NTcgMTcuNDk5NyA1LjgzNDY0IDE3LjQ5OTdINi42Njc5NyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xNC45OTg3IDAuODMyMDMxTDEzLjMzMiAyLjQ5ODdMMTQuOTk4NyA0LjE2NTM2IiBzdHJva2U9IndoaXRlIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTE4LjMzMiA2LjY2NjY3QzE4LjMzMiA1LjU2MTYgMTcuODkzIDQuNTAxNzkgMTcuMTExNiAzLjcyMDM5QzE2LjMzMDIgMi45Mzg5OSAxNS4yNzA0IDIuNSAxNC4xNjU0IDIuNUgxMy4zMzIiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzIwNjlfNDczOCI+CjxyZWN0IHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K);
    mask-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIwNjlfNDczOCkiPgo8cGF0aCBkPSJNMi4xMDkzOCAzLjc0ODA1SDguNzUwMjEiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNNS40MTc5NyAyLjA4MjAzVjMuNzQ4NyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik03LjUgMy43NUM3LjE2OTA4IDQuOTQ0MTMgNi41MzQ2NCA2LjAzMjI0IDUuNjU4NDQgNi45MDg0NEM0Ljc4MjI0IDcuNzg0NjQgMy42OTQxMyA4LjQxOTA4IDIuNSA4Ljc1IiBzdHJva2U9IndoaXRlIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTMuMzMyMDMgMy43NUMzLjY2Mjk1IDQuOTQ0MTMgNC4yOTczOSA2LjAzMjI0IDUuMTczNTkgNi45MDg0NEM2LjA0OTc5IDcuNzg0NjQgNy4xMzc5IDguNDE5MDggOC4zMzIwMyA4Ljc1IiBzdHJva2U9IndoaXRlIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTEyLjA4MiAxNy45MTYzTDE0LjE5MiAxMi4yOTA1QzE0LjIyMTkgMTIuMjExMiAxNC4yNzUyIDEyLjE0MjggMTQuMzQ0OSAxMi4wOTQ2QzE0LjQxNDUgMTIuMDQ2NCAxNC40OTczIDEyLjAyMDUgMTQuNTgyIDEyLjAyMDVDMTQuNjY2OCAxMi4wMjA1IDE0Ljc0OTUgMTIuMDQ2NCAxNC44MTkyIDEyLjA5NDZDMTQuODg4OSAxMi4xNDI4IDE0Ljk0MjIgMTIuMjExMiAxNC45NzIgMTIuMjkwNUwxNy4wODIgMTcuOTE2MyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xMi43MDcgMTYuMjQ4SDE2LjQ2NyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xLjI1MTMgMC40MTUwMzlIOS41ODQ2NEM5LjU4NDY0IDAuNDE1MDM5IDEwLjQxOCAwLjQxNTAzOSAxMC40MTggMS4yNDgzN1Y5LjU4MTcxQzEwLjQxOCA5LjU4MTcxIDEwLjQxOCAxMC40MTUgOS41ODQ2NCAxMC40MTVIMS4yNTEzQzEuMjUxMyAxMC40MTUgMC40MTc5NjkgMTAuNDE1IDAuNDE3OTY5IDkuNTgxNzFWMS4yNDgzN0MwLjQxNzk2OSAxLjI0ODM3IDAuNDE3OTY5IDAuNDE1MDM5IDEuMjUxMyAwLjQxNTAzOVoiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMTIuNDk4NyA5LjU4MzAxSDE4Ljc0ODdDMTguOTY5NyA5LjU4MzAxIDE5LjE4MTcgOS42NzA4MSAxOS4zMzggOS44MjcwOUMxOS40OTQyIDkuOTgzMzcgMTkuNTgyIDEwLjE5NTMgMTkuNTgyIDEwLjQxNjNWMTguNzQ5N0MxOS41ODIgMTguOTcwNyAxOS40OTQyIDE5LjE4MjcgMTkuMzM4IDE5LjMzODlDMTkuMTgxNyAxOS40OTUyIDE4Ljk2OTcgMTkuNTgzIDE4Ljc0ODcgMTkuNTgzSDEwLjQxNTRDMTAuMTk0NCAxOS41ODMgOS45ODIzOSAxOS40OTUyIDkuODI2MTEgMTkuMzM4OUM5LjY2OTgzIDE5LjE4MjcgOS41ODIwMyAxOC45NzA3IDkuNTgyMDMgMTguNzQ5N1YxMi40OTk3IiBzdHJva2U9IndoaXRlIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTUgMTkuMTY1NEw2LjY2NjY3IDE3LjQ5ODdMNSAxNS44MzIiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMS42Njc5NyAxMy4zMzNDMS42Njc5NyAxNC40MzgxIDIuMTA2OTYgMTUuNDk3OSAyLjg4ODM2IDE2LjI3OTNDMy42Njk3NiAxNy4wNjA3IDQuNzI5NTcgMTcuNDk5NyA1LjgzNDY0IDE3LjQ5OTdINi42Njc5NyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xNC45OTg3IDAuODMyMDMxTDEzLjMzMiAyLjQ5ODdMMTQuOTk4NyA0LjE2NTM2IiBzdHJva2U9IndoaXRlIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTE4LjMzMiA2LjY2NjY3QzE4LjMzMiA1LjU2MTYgMTcuODkzIDQuNTAxNzkgMTcuMTExNiAzLjcyMDM5QzE2LjMzMDIgMi45Mzg5OSAxNS4yNzA0IDIuNSAxNC4xNjU0IDIuNUgxMy4zMzIiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzIwNjlfNDczOCI+CjxyZWN0IHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K);
    block-size: 1.25rem;
    inline-size: 1.25rem;
    margin-inline-end: 0.25rem;
    -webkit-mask-position: 50% 50%;
    mask-position: 50% 50%;
    mask-repeat: no-repeat;
    -webkit-mask-size: 1.25rem;
    mask-size: 1.25rem;
}
#cms-header .mobile-header #languagebutton svg {
    display: none;
}
#cms-header:has(.mobile-header) #languagebutton::before {
    background: var(--nav-color);
}
/* ---------------  START Mobile Header --------------- */
@media only screen and (max-width: 1023px) {
    #app #cms-header #h1 .left {
        height: auto;
        padding: 48px 0;
        margin: 0;
    }

    #app #cms-header .bar-nav--drawer-element.mobile-element:has(#schools-header),
    #app #cms-header .mobile-header .left-icon .menu-field,
    #app #cms-header #h1 .left .school-info,
    #app #cms-header #h1 .right {
        display: none;
    }

    #app #cms-header #menubutton svg,
    #app #cms-header #closebutton svg {
        fill: var(--bg-color);
    }

    #app #cms-header #menubutton svg path,
    #app #cms-header #closebutton svg path {
        fill: var(--nav-color);
    }

    #app #cms-header .search-translate-buttons .menu-field {
        display: block;
        color: var(--mobile-menu-text-color);
        font-weight: 400;
    }

    #app #cms-header #languagebutton svg path,
    #app #cms-header #explore-header-collapsible svg path {
        fill: var(--mobile-menu-text-color);
    }
}
/* ---------------  END Mobile Header --------------- */
/* custom gallery v4 with social media icons */
#cms-gallery {
    --gallery-button-icon-color: #FFF;
}
.loudoun-county-public-schools #cms-gallery {
    --gallery-button-icon-color: #000;
}
#cms-gallery #g4 .text .title {
    margin-bottom: 16px;
}
#cms-gallery .text .title h1 {
    font-size: clamp(2.375rem, 1.608rem + 2.045vw, 4.063rem);
    line-height: 1.1;
    font-weight: 900;
}
#cms-gallery .text .title h2 {
    font-size: clamp(1.875rem, -0.833rem + 3.333vw, 2.5rem);
    line-height: 1.1;
    font-weight: 900;
}

#cms-gallery .text .description p, .cycle-day {
    font-size: clamp(1rem, -0.083rem + 1.333vw, 1.25rem);
    line-height: 1.2;
    font-weight: 500;
    margin-bottom: 10px;
}
#cms-gallery .text .description p strong {
    font-weight: 900;
}
.cycle-day {
    display: inline-block;
    padding: 5px 15px;
    background-color: #000;
    color: #FFF;
    margin-top: 30px;
    border-radius: 30px;
    text-decoration: none;
    box-sizing: border-box;
}
@media only screen and (min-width: 1400px) {
    .cycle-day {
        padding-inline: 25px;
    }
}
a.cycle-day:hover {
    background-color: var(--primary-color);
}
#cms-gallery #g4,
#cms-gallery #g2 {
    padding-bottom: 10px;
    padding-top: 20px;
    box-sizing: border-box;
    max-width: 100%;
    position: relative;
}

#cms-gallery .img-slider {
    width: 100%;
    /* filter: drop-shadow(3px 45px 32px rgba(0, 0, 0, 0.25)); */
}

#cms-gallery .image-wrapper .position {
    position: absolute;
    left: 50%;
    bottom: 20px;
    right: auto;
    transform: translateX(-50%);
}

#cms-gallery .image-wrapper .position-and-play {
    right: 0;
    left: 0;
    bottom: 0;
}

#cms-gallery .navigation .arrows {
    left: 0;
    bottom: 0px;
    z-index: 2;
}

#cms-gallery .image-and-nav {
    padding: 0;
    width: 100%;
}

#cms-gallery .navigation {
    bottom: -1px;
    z-index: 2;
}

#cms-gallery .arrows svg,
#cms-gallery .position-and-play svg,
#g2 .play svg,
#g2 .pause svg,
#cms-gallery #g2 .left-arrow.button-action svg,
#cms-gallery #g2 .right-arrow.button-action svg  {
    display: block;
    opacity: 0;
    width: clamp(32px, 4vw, 64px);
    height: clamp(32px, 4vw, 64px);
}
#g2 .play,
#g2 .pause  {
    width: clamp(32px, 4vw, 64px);
    height: clamp(32px, 4vw, 64px);
}
#cms-gallery #g2 .slide .image-wrapper {
    position: relative;
}
.video-wrapper + div,
.img-slider + div {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: flex-end;
}
#cms-gallery #g2 .video-wrapper + div button,
#cms-gallery #g2 .img-slider + div button {
    position: relative;
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
}
#cms-gallery .button-action:not(.square) {
    background: color-mix(in srgb, var(--secondary-color) 90%, transparent);
    position: relative;
    transition: all .3s ease-in-out;
    margin: 0;
    border: 0;
    padding: 0;
}
#cms-gallery .button-action:focus .button-action-content {
    display: block;
}
#cms-gallery .button-action:hover {
    background-color: var(--secondary-color);
}

#cms-gallery .button-action:not(.square):after {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: close-quote;
    font-size: 0;
    display: block;
    z-index: 1;
    transition: opacity .3s ease-in-out;
}

#cms-gallery .button-action.left-arrow:after {
    background-color: var(--gallery-button-icon-color);
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='15' viewBox='0 0 19 15' fill='none'%3E%3Cg clip-path='url(%23clip0_537_337)'%3E%3Cpath d='M17.5186 7.96155H1.86636' stroke='black' stroke-width='1.56522'/%3E%3Cpath d='M7.34462 13.4398L1.86636 7.96154L7.34462 2.48328' stroke='black' stroke-width='1.56522' stroke-linecap='square'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_537_337'%3E%3Crect width='18' height='14.087' fill='white' transform='translate(0.299988 0.626465)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    mask-repeat: no-repeat no-repeat;
    mask-position: center center;
    mask-size: 18px auto;
}

#cms-gallery .button-action.right-arrow:after {
    background-color:  var(--gallery-button-icon-color);
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='16' viewBox='0 0 19 16' fill='none'%3E%3Cg clip-path='url(%23clip0_537_343)'%3E%3Cpath d='M0.305969 7.97473H16.6696' stroke='black' stroke-width='1.63636'/%3E%3Cpath d='M10.9423 2.24744L16.6696 7.97471L10.9423 13.702' stroke='black' stroke-width='1.63636' stroke-linecap='square'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_537_343'%3E%3Crect width='18' height='14.7273' fill='white' transform='translate(0.299988 0.306274)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    mask-repeat: no-repeat no-repeat;
    mask-position: center center;
    mask-size: 18px auto;
}


#cms-gallery .button-action.pause:after {
    background-color:  var(--gallery-button-icon-color);
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' id='Layer_1' viewBox='0 0 18.4 28' fill='%23669EFE' data-livestyle-extension='available'%3E%3Cscript xmlns=''/%3E%3Crect width='4' height='28'/%3E%3Crect x='14.4' width='4' height='28'/%3E%3Cscript xmlns=''/%3E%3C/svg%3E");
    mask-repeat: no-repeat no-repeat;
    mask-position: center center;
    mask-size: 12px auto;
}

#cms-gallery .button-action.play:after {
    background-color:  var(--gallery-button-icon-color);
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' id='Layer_1' viewBox='0 0 22.95 30.61' data-livestyle-extension='available'%3E%3Cscript xmlns=''/%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:none;stroke:%23444;stroke-linecap:square;stroke-width:3px;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M1.5,27.8V2.8L20.25,15.3,1.5,27.8Z'/%3E%3Cscript xmlns=''/%3E%3C/svg%3E");
    mask-repeat: no-repeat no-repeat;
    mask-position: center center;
    mask-size: 12px auto;
}

#cms-footer .footer-social-links {
    --icon-color: var(--text-color);
    --icon-color-hover: var(--text-color);
}
#cms-gallery #cms-footer .footer-social-links {
    --icon-color: #000;
    --icon-color-hover: var(--primary-color);
    --icon-size: 36px;
}
.loudoun-county-public-schools #cms-gallery #cms-footer .footer-social-links {
    --icon-color: var(--secondary-color);
}
#cms-gallery #cms-footer .footer-social-links li a img {
    width: var(--icon-size);
    height: var(--icon-size);
    display: block;
}
#cms-gallery #cms-footer {
    z-index: 2;
    padding: 0 10px 15px;
}
#cms-gallery #cms-footer ul {
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin: 0;
}

#cms-gallery #cms-footer li {
    margin-right: 20px;
}

#cms-gallery #cms-footer li:last-child {
    margin: 0;
}

#cms-gallery #cms-footer svg {
    width: var(--icon-size);
    height: auto;
}

#cms-gallery #cms-footer svg path {
    fill: var(--icon-color);
    transition: all .4s linear;
}
#cms-gallery #cms-footer a:hover svg path {
    fill: var(--icon-color-hover);
}
#cms-gallery #cms-footer .footer-social-links li[data-newid=social-icon] a {
    margin-bottom: 0;
}
#cms-gallery #cms-footer li[data-newid="social-icon"] a {
    display: flex;
    justify-content: center;
    align-items: center;
}
@media screen and (min-width: 600px) {
    #cms-gallery #g4,
    #cms-gallery #g2 {
        padding-right: 110px;
        padding-bottom: 30px;
    }

    #cms-gallery .navigation .arrows {
        bottom: 1px;
    }
    #cms-gallery #cms-footer ul {
        display: block;
    }

    #cms-gallery #cms-footer {
        position: absolute;
        display: block;
        right: 33px;
        top: 50%;
        transform: translateY(-50%);
        z-index: 2;
        padding: 0;
    }

    #cms-gallery #cms-footer li {
        display: block;
        margin-right: 0;
        margin-bottom: 20px;
    }
}
@media screen and (min-width: 1280px) {
    #cms-gallery #cms-footer .footer-social-links {
        --icon-size: 38px;
    }
    #cms-gallery #g4 .slide .text {
        margin-inline: 35px;
    }
}
@media screen and (min-width: 1360px) {
    #cms-gallery #g4 .slide .text {
        margin-inline: 45px;
    }
    #cms-gallery #cms-footer .footer-social-links {
        --icon-size: 42px;
    }
}
@media only screen and (min-width: 1600px) {
    #cms-gallery #cms-footer li {
        margin-bottom: 40px;
    }
}
@media only screen and (max-width: 599px) {
    #app #cms-gallery .footer-social-links li a {
        margin-bottom: 0;
    }
}
/* Gallery v4 END */

/* custom gallery v2 with video */
/* ------------------------------------------ */
/* ------------- MAKE GALLERY v2 LOOK lIKE v4 START --------------- */
#cms-gallery #g2 .left-arrow.button-action,
#cms-gallery #g2 .right-arrow.button-action {
    position: absolute;
    bottom: 0;
    top: auto;
    margin: 0;
    right: auto;
    transform: none;
    display: block;
    z-index: 2;
}
#cms-gallery #g2 .left-arrow.button-action {
    left: 0;
}
#cms-gallery #g2 .right-arrow.button-action {
    left: clamp(32px, 4vw, 64px);
}
@media only screen and (min-width: 960px) {
    #cms-gallery:has(#g2) {
      padding-left: 0;
      box-sizing: border-box;
    }

    #cms-gallery #g2 .position {
      z-index: 9;
    }

    #cms-gallery #g2 .slide {
      display: flex;
      --image-height: 35.9vw;
    }
    #cms-gallery #g2 .button-action:not(.square) {
        z-index: 1;
    }

    #cms-gallery #g2 .slide .text {
      position: static;
      order: 0;
      text-align: left;
      transform: none;
      width: 33%;
      margin-inline: 35px;
      min-width: 220px;
    }
    #cms-gallery #g2 .slide .text .title {
      margin-left: 0;
    }

    #cms-gallery #g2 .slide .text .description {
      margin-left: 0;
    }

    #cms-gallery #g2 .slide .image-wrapper {
      order: 1;
    }
    #cms-gallery #g2 .slide .image-wrapper:after {
      content: "";
      display: block;
      position: absolute;
      width: 100%;
      height: 200px;
      left: 0;
      bottom: 0;
      background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.4) 100%);
    }

    #cms-gallery #g2:after {
      display: none;
    }
  }
  @media only screen and (min-width: 1360px) {
    #cms-gallery #g2 .slide .text {
        margin-inline: 45px;
    }
  }
  @media only screen and (max-width: 600px) {
    #cms-gallery #g2 .slide {
        --image-height: 55vw;
      }
  }
  /* ------------------------------------------ */
  /* ------------- MAKE GALLERY v2 LOOK lIKE v4 END --------------- */

/* END custom gallery v2 */

#home .see-all-container h1, #home .see-all-container h2, #home .see-all-container h3 {
    font-size: clamp(1.75rem, 1rem + 1.25vw, 2.5rem); /* 40>28, 1920>960 */
}
#home .see-all-container .see-all-button, #home .see-all-container a {
    font-size: clamp(1rem, 0.563rem + 0.729vw, 1.438rem); /* 23>16, 1920>960 */
    font-weight: 700;
}
/* Custom footer */
#view-footer {
    border-top: clamp(0.375rem, -0.094rem + 0.781vw, 0.688rem) solid var(--primary-color);
    --footer-logo-width: 180px;
}
#view-footer #cms-footer .footer-social-links {
    display: none;
}
.loudoun-county-public-schools #view-footer {
    border-top-color: var(--secondary-color);
}
#view-footer #footer-f1 .footer-logo {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: var(--footer-logo-width);
    height: var(--footer-logo-width);
    margin: 0;
    padding: 0;
    object-fit: contain;
    object-position: top center;
    display: block;
}
#view-footer .row:has(.footer-wrapper) {
    justify-content: space-between;
    position: relative;
    min-height: var(--footer-logo-width);
}
#view-footer .footer-wrapper, #view-footer .row:has(.footer-wrapper) .footer-column-main {
    width: calc(47% - (var(--footer-logo-width)/2));
    box-sizing: border-box;
    flex: none;
    padding: 0;
}
#view-footer #footer-f1 .app-link {
    margin-right: 0;
}
.footer-wrapper {
    order: 2;
    text-align: right;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
#view-footer .footer-columns h2,
#view-footer .footer-column-last h2 {
    display: none;
}
#footer-f1 .footer-column-last .footer-social-links {
    --icon-size: 35px;
}
#cms-footer .footer-social-links li[data-newid=social-icon] {
    padding: 0;
	margin-right: 7px;
    display: inline-block;
	vertical-align: top;
}
#cms-footer .footer-social-links li[data-newid=social-icon]:last-child {
	margin-right: 0;
}
#cms-footer .footer-social-links li[data-newid=social-icon] a {
    display: inline-block;
    margin-bottom: 20px;
    background-color: transparent;
}
#cms-footer .footer-social-links li svg,
#app #footer-f1 .footer-column-last .footer-social-links li img {
    width: var(--icon-size);
    height: auto;
}
#cms-footer .footer-social-links li a svg path {
    transition: all .35s ease-in-out;
    fill: var(--icon-color);
}
#cms-footer .footer-social-links li a:hover svg path {
    fill: var(--icon-color-hover);
}
#peachjar a {
    background-color: var(--icon-color) !important;
    border-radius: 50%;
    padding: 5px;
    box-sizing: border-box;
    width: var(--icon-size);
    height: var(--icon-size);
}
#peachjar a:hover {
    background-color: var(--icon-color-hover) !important;
}
#peachjar a svg {
    max-width: 100%;
    height: 100%;
}
#peachjar a path {
    fill: var(--bg-color) !important;
}
#view-footer #footer-f1 ul li a {
    text-decoration: underline !important;
}
#view-footer #footer-f1 ul li a:hover {
    text-decoration: none !important;
}
#view-footer #footer-f1 .additional-text-bottom {
    padding-top: 10px;
}
#view-footer .footer-column-main .logo-wrapper + h2 {
    padding-bottom: 0;
}
#view-footer .footer-column-main .logo-wrapper + h2 + p span:first-child {
    font-weight: 600;
    letter-spacing: 0.03em;
    margin-bottom: 20px;
}
@media only screen and (min-width: 1280px) {
    #view-footer {
        --footer-logo-width: 248px;
    }
}
@media only screen and (min-width: 1440px) {
    #view-footer #footer-f1 p,
    #footer-f1 .footer-columns ul li {
        font-size: 16px;
    }
    #view-footer #footer-f1 .additional-text-bottom p {
        font-size: 18px;
        letter-spacing: 0.02em;
    }
}
@media only screen and (max-width: 700px) {
    #view-footer #footer-f1 .row:has(.footer-wrapper) {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    #view-footer #footer-f1 .footer-logo {
        position: relative;
        left: 0;
        transform: unset;
        margin-inline: auto;
    }
    #view-footer .footer-wrapper, #view-footer .row:has(.footer-wrapper) .footer-column-main {
        width: 100%;
    }
    .footer-wrapper {
        display: block;
        text-align: center;
    }
    #view-footer #footer-f1 .app-link {
        margin-right: auto;
    }
}
/* End Custom footer */


@media only screen and (min-width: 1460px) {
    #home .story .news-title {
        font-size: 22px;
    }
}
/* Events v4 two rows */
#home #events-e4 {
    --heading-color: var(--event-bg-color) !important;
    --button-text-color: var(--event-bg-color) !important;
}
#events-e4 .cards-slider-arrow,
#home #events-e4 .events-info .events-card .events-card-mobile-border-right,
#home #events-e4 .events-info .events-card .events-card-mobile-border-top {
    display: none;
}

#home #events-e4 .events-info {
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding-top: 10px;
    padding-left: 0;
    padding-right: 0;
}

#home #events-e4 .events-info .events-card.events-card-hidden {
    visibility: visible;
}

#home #events-e4 .events-info .events-card .events-date {
    font-size: 22px;
}

#home #events-e4 .cards-slider-container {
    flex-wrap: wrap;
    gap: 25px;
}

#home #events-e4 .events-info .events-card {
    border: 0;
    background: var(--event-bg-color);
    border-top: 2px solid var(--event-separator-color);
    width: calc(50% - 19px);
    padding: 30px 50px 40px 25px;
    display: none;
}

#home #events-e4 .events-info .events-card:nth-child(-n+8) {
    display: flex;
    flex-direction: column;
}

#events-e4 .events-info .events-card .events-title {
    order: 2;
    padding-top: 10px;
}

@media only screen and (min-width: 1280px) {
    #home #events-e4 .see-all-container.see-all-top {
        padding: 0;
    }
}

@media only screen and (max-width: 599px) {
    #home #events-e4 .events-info .events-card {
        width: 100%;
    }
}

@media only screen and (min-width: 1000px) {
    #home #events-e4 .events-info .events-card {
        width: calc(25% - 19px);
    }
}
/* end custom events */

/* programs */
#home #programs-v3 .programs-wrapper .program .program-bottom-card:after {
    display: none;
}
#home #programs-v3 .programs-wrapper .program .program-bottom-card {
    min-height: 150px;
}

/* video section */
#home #video-component .mirrors .prev {
    mask-image: linear-gradient(to right, transparent 0%, white 35%);
    text-align: right;
}
#home #video-component .mirrors .next {
    mask-image: linear-gradient(to left,transparent 0%,white 35%);
}
@media only screen and (min-width: 1280px) {
    #home #video-component .video-wrapper {
        max-width: 35%;
    }
    #home #video-component .mirrors .thumbnail {
        height: 17vw;
    }

}

@media only screen and (min-width: 1400px) {
    #home #video-component .video-info .title {
        font-size: 28px;
    }
    #home #video-component .video-info .description {
        font-size: 18px;
    }
}

@media only screen and (min-width: 1500px) {
    #home .live-feed-details .post-status {
        font-size: 18px;
        line-height: 1.4;
    }
}

/* division resources */
#resources-buttons .standard-row .heading-block div > * {
    font-size: clamp(1.75rem, 1rem + 1.25vw, 2.5rem) !important;
}

#resources-buttons .button-block {
    justify-content: center !important;
}

#resources-buttons .button-block .button.square {
    --icon-size: 35px !important;
    gap: 6px !important;
    padding: 6px !important;
    padding-right: 15px !important;
    max-width: 260px !important;
    min-width: 200px !important;
}

#resources-buttons .button-block .button.dark .icon-wrapper .raw-svg svg {
    max-width: 63% !important;
    max-height: 63% !important;
}
#resources-buttons .button-block .button.square {
    margin-right: 10px;
}
@media only screen and (min-width: 1280px) {
    #resources-buttons .button-block .button.square {
        --icon-size: 40px !important;
    }

    #resources-buttons .button-block .button.dark .title {
        font-size: 16px !important;
    }

    #resources-buttons .button-block .button.dark .icon-wrapper .raw-svg svg {
        max-width: 70% !important;
        max-height: 70% !important;
    }
}

@media only screen and (min-width: 1440px) {
    #resources-buttons .button-block .button.dark .title {
        font-size: 18px !important;
    }

    #resources-buttons .button-block .button.square {
        --icon-size: 45px !important;
    }

    #resources-buttons .button-block .button.dark .icon-wrapper .raw-svg svg {
        max-width: 80% !important;
        max-height: 80% !important;
    }
}

/* end division resources */

/* programs */
#home #programs-v3 .programs-wrapper {
    gap: 10px;
}
#home #programs-v3 .programs-wrapper .program {
    max-width: 255px;
    min-width: 255px;
}
#home #programs-v3 .programs-wrapper .program.card-style-1 {
    background-color: var(--card-1-bg-color);
}
#home #programs-v3 .programs-wrapper .program.card-style-2 {
    background-color: var(--card-2-bg-color);
}
#home #programs-v3 .programs-wrapper .program.card-style-3 {
    background-color: var(--card-3-bg-color);
}
#home #programs-v3 .programs-wrapper .program.card-style-4 {
    background-color: var(--card-4-bg-color);
}
#home #programs-v3 .programs-wrapper .program.card-style-5 {
    background-color: var(--card-5-bg-color);
}
#home #programs-v3 .programs-wrapper .program .program-bottom-card .program-title {
    font-size: clamp(1rem, 0.563rem + 0.729vw, 1.438rem);
}
/* end programs */

/* School Board member in footer*/
.school-board-members {
    padding-top: 10px;
    padding-bottom: 20px;
}
.school-board-members *:first-child {
    padding-bottom: 10px;
}
.school-board-members a {
    color: currentColor;
}
/* end */


/* -------- START Custom Component Fix --------- */
.style-bold .header-slot-container {
    border-right: 0;
    padding-right: 0;
}
.headlines-list {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 34px;
}
.headlines-list > div {
    width: 100%;
    background-color: #FFF;
}
.headlines-list img {
    max-width: 100%;
    height: auto;
}
#customHeadlines.is-not-in-cms .headlines-list .headline-image {
    display: block;
    position: relative;
    width: 100%;
    padding-top: 50%;
    overflow: hidden;
}
#customHeadlines.is-not-in-cms .headlines-list .headline-image img {
    object-fit: cover;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    display: block;
    transition: all .35s ease-in-out;
}
.headlines-list .headline-title {
    display: block;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 900;
    color: var(--primary-color);
    box-sizing: border-box;
    border-top: 4px solid var(--secondary-color);
}
.headlines-list .headline-title:not(:has(a)) {
    padding: 20px 20px 10px;
    min-height: 110px;
}
.headlines-list .headline-title a {
    color: var(--primary-color);
    text-decoration: none;
    padding: 20px 20px 10px;
    min-height: 110px;
    display: block;
    box-sizing: border-box;
}
#customHeadlines.is-not-in-cms .headlines-list > div:has(a):hover .headline-image img {
    transform: scale(1.1);
}
#customHeadlines:not(.is-not-in-cms) .headlines-list {
    padding-top: 20px;
}

#customHeadlines:not(.is-not-in-cms) .homepage-image-wrapper .image-container-image {
    object-fit: contain;
    height: auto;
  }
  #customHeadlines:not(.is-not-in-cms) .homepage-image-wrapper {
    height: auto;
    min-height: 150px;
    padding-block: 20px;
  }

.custom-section:has(.link-actions) .headline-text {
    padding-inline: 20px;
    line-height: 1.4;
}

.custom-section:not(:has(.link-actions)) .headline-text {
    display: none;
}
.headline-image .headline-text {
    display: flex !important;
    align-items: center;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    text-align: center;
    font-size: 16px;
    line-height: 1.5;
    background-color: color-mix(in srgb, var(--primary-color) 85%, transparent);
    color: #FFF;
    overflow: auto;
    transition: all .35s ease-in-out;
    opacity: 0;
    white-space: normal !important;
}
.headline-image .headline-text span {
    display: block;
    box-sizing: border-box;
    max-height: 100%;
    max-width: 100%;
    padding: 10px 20px;
}
.headlines-list > div:hover .headline-image .headline-text {
    opacity: 1;
}
@media only screen and (min-width: 600px) {
    .headlines-list > div {
        width: calc(50% - 17px);
    }
}
@media only screen and (min-width: 960px) {
    .headlines-list > div {
        width: calc(33% - 21px);
    }
    .headline-image .headline-text {
         font-size: 18px;
    }
}
@media only screen and (min-width: 1400px) {
    #customHeadlines.is-not-in-cms .headlines-list .headline-title {
        font-size: 21px;
        border-top-width: 8px;
    }
    #customHeadlines.is-not-in-cms .headlines-list .headline-title:not(:has(a)) {
        padding: 30px 30px 10px;
        min-height: 125px;
    }
    #customHeadlines.is-not-in-cms .headlines-list .headline-title a {
        color: var(--primary-color);
        text-decoration: none;
        padding: 30px 30px 10px;
        min-height: 125px;
    }
}
/* -------- END Custom Component Fix --------- */