@media all {
    /* common */
    h1 { text-align:center; }

    h2 { margin:0px 0px 30px 0px; padding:0px; line-height:1; font-weight:800; }

    .title { margin-bottom:var(--spacing-1L); text-align:center; }
    .title h2 { margin:0px; padding:0px; }

    a.order_online { position: fixed; left: 50%; bottom: 150vh; transform: translateX(-50%); font-size:var(--font-size-1S); text-align: center; font-weight:var(--font-weight-bolder); background-image: linear-gradient(-45deg, var(--color-light-blue), var(--color-blue), var(--color-light-blue)); background-size: 200% 200%; animation: gradient 5s ease infinite; z-index:100; }
    a.order_online:hover,
    a.order_online:focus { color:var(--color-white); background-color:var(--color-green) !important; background-image:none; }

    @keyframes gradient {
        0% { background-position: 0% 50%; }
        50% { background-position: 100% 50%; }
        100% { background-position: 0% 50%; }
    }

    #back_to_top { display:block; position: fixed; bottom:0px; right:10px; padding: var(--spacing-4S); background-color: var(--color-black); color:var(--color-white); font-size: var(--font-size-2L); font-weight: var(--font-weight-bold); border-radius: 50px; z-index: 50; transition: all .5s ease 0s; }
    #back_to_top:hover,
    #back_to_top:focus { color:var(--color-black); text-decoration: none;  background-color: var(--color-white); }

    #back_to_top { display: none;}

    /*-----------------------------*/
    /* HEADER */
    /*-----------------------------*/
    header .container_row_content { padding:var(--spacing-1S) 0px 0px 0px; }
    header .header_group { align-items:center; text-align:center; }
    header .header_group .logo img { width:35%; max-width:200px;}
    header .header_group .options { text-align:right; }

    /*-----------------------------*/
    /* FOOTER */
    /*-----------------------------*/
    footer { position: relative; color:var(--color-white); background-color:var(--color-red); }
    footer .container_row_content { padding:var(--spacing-2L) 0px; }

    footer .account_manager_group { gap:var(--spacing-5L); }

    footer h3 { margin-bottom:var(--spacing-4S); color:var(--color-white); }
    footer h3 span { display:block; font-size:var(--font-size-2S); text-transform:uppercase; letter-spacing:1px; }

    footer a { color:var(--color-white); text-decoration:underline; }
    footer a:hover,
    footer a:focus { color:var(--color-white); background-color:var(--color-black); text-decoration:none; }

    footer p:first-of-type { margin-top:0px; }
    footer p.legal { font-size:var(--font-size-2S); }

    /*-----------------------------------*/
    /* intro */
    #intro { position:relative; }
    #intro::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size:45vw; background-repeat:no-repeat; background-position:right -5vw top; opacity: 0.1; z-index: 0; }
    #intro .container_row_content { padding:var(--spacing-3L) 0px; z-index:1; }

    #intro ul.quick_link_list { margin:var(--spacing-4L) auto 0px auto; grid-template-columns:repeat(3, 1fr); gap:var(--spacing-1L); background-repeat:no-repeat; background-size:40%; background-position:right -100px top; }
    #intro ul.quick_link_list h2 { margin:0px 0px var(--spacing-2S) 0px; padding:0px; font-size:25px; color:var(--color-white); text-transform:uppercase; }

    #intro ul.quick_link_list li { position:relative; height:70vh; max-height:500px; border-radius:var(--spacing-1S); font-weight:var(--font-weight-bold); color:var(--color-white); background-color:var(--color-light-gray); background-size:cover; background-position:center center; }
    #intro ul.quick_link_list li:after { content:''; position:absolute; top:0px; right:0px; bottom:0px; left:0px; background:linear-gradient(to top, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0) 80%); border-radius:var(--spacing-1S); z-index:1; }

    #intro ul.quick_link_list li:nth-child(1) { background-image:url(/webimages/pages/default/i_everyday_offerings.jpg); }
    #intro ul.quick_link_list li:nth-child(2) { background-image:url(/webimages/pages/default/i_monthly_calendar.jpg); }
    #intro ul.quick_link_list li:nth-child(3) { background-image:url(/webimages/pages/default/i_my_school_account.jpg); }

    #intro ul.quick_link_list li a.link_as_button { padding:var(--spacing-1S) var(--spacing-1S); }
    #intro ul.quick_link_list li a.link_as_button:not(:last-of-type) { margin-right:var(--spacing-3S);}

    #intro ul.quick_link_list li .body { position:absolute; bottom:0px; right:0px; left:0px; padding: var(--spacing-1S); z-index:2;}
    #intro ul.quick_link_list li .body p.learn_more { font-weight:var(--font-weight-bolder); text-transform:uppercase; }

    #intro ul.quick_link_list li a.link_as_button:not(:last-of-type) { margin-bottom: 5px; }
    #intro ul.quick_link_list li a.link_as_button { margin-bottom: 5px; }

    /* everyday-offerings */
    #everyday-offerings { text-align:center; background-color:var(--color-light-gray); }
    #everyday-offerings .link_as_button { margin: var(--spacing-4L); }

    /* my-school-account */
    #my-school-account { text-align:center; background-color:var(--color-white); }
    
    #my-school-account ul.link_list { margin-top:var(--spacing-3L); gap:var(--spacing-2L); justify-content:space-around; }
    #my-school-account ul.link_list li { background-color:var(--color-white); border-radius:var(--spacing-1S); }
    #my-school-account ul.link_list li h3 { margin:0px; font-size:var(--font-size-0); }
    #my-school-account ul.link_list li .body { padding:var(--spacing-3L) var(--spacing-1L); }

    /* hours */
    #hours { background-position:center center; background-size:cover; background-image:url(/webimages/pages/default/i_background_hours_of_operation.jpg); }
    #hours .container_row { padding:var(--spacing-5L); }
    #hours .container_row_content { padding:var(--spacing-5L); background-color:rgba(255, 255, 255, .9); }

    #hours h3 { font-size:var(--font-size-0); font-weight:var(--font-weight-bolder); text-transform:uppercase; }
    #hours h4 { font-size:var(--font-size-1S); font-weight:var(--font-weight-bolder); text-transform:uppercase; text-align:center; }
    #hours h4:not(:first-of-type) { margin-top:var(--spacing-3L); }
    
    #hours ul.hour_list { column-gap:0px; }
    #hours ul.hour_list li { font-size:var(--font-size-0); border-bottom:1px var(--color-black) solid; text-transform:uppercase; }
    #hours ul.hour_list li:nth-child(odd) { font-size:var(--font-size-1L); font-weight:var(--font-weight-bolder); letter-spacing:1px; }
    #hours ul.hour_list li:nth-child(even) { text-align:right; }
}

@media (max-width:1400px) {
    .container_row_content { padding: calc(var(--spacing-5L) * 1.2) var(--spacing-4L); }

    #intro .container_row_content { padding:var(--spacing-3L) 0px; }
    #intro ul.quick_link_list li { height:40vh; }

    footer .container_row_content { padding:var(--spacing-2L) var(--spacing-4L); }
}

@media (max-width:1200px) {
    header .header_group .logo img { width:80%; max-width:160px;}

    #intro h1 { margin-top:var(--spacing-2L); }
}

@media (max-width:1100px) {

}

@media (max-width:1000px) {
    header ul.top_links_list { padding:var(--spacing-3S) var(--spacing-2L) var(--spacing-2S) var(--spacing-2L); }
    header .header_group .logo img { max-width:140px;}

    #intro .container_row_content { padding:var(--spacing-3L) var(--spacing-1S); }
    #intro ul.quick_link_list li { height:30vh; }
    #intro ul.quick_link_list li a.link_as_button:not(:last-of-type) { margin-bottom: 5px; }
    #intro ul.quick_link_list li a.link_as_button { margin-bottom: 5px; }
    img.title_icon { width:50px; }
}

@media (max-width:700px) {
    header { left:var(--spacing-4L); }
    header ul.top_links_list { justify-content:center;}
    header .header_group .logo img { max-width:100px;}

    #intro h1 { margin-top:0px; }
    #intro .container_row { width:90%; }
    #intro ul.quick_link_list { grid-template-columns: repeat(1, 1fr); gap: var(--spacing-0); }
    #intro ul.quick_link_list li {  height:40vh; }
    #intro ul.quick_link_list li .body { padding: var(--spacing-2L);}
    #intro ul.quick_link_list li a.link_as_button:not(:last-of-type) { margin-bottom: 5px; }
    #hours .container_row { padding:var(--spacing-3L) var(--spacing-0); }
    #hours .container_row_content { padding:var(--spacing-3L) var(--spacing-1L); }

    /*#everyday-offerings .link_as_button { margin: 0 0 var(--spacing-4L) 0; }*/

    footer .is_flex { display:block;}
    footer .container_row_content { padding: var(--spacing-2L) var(--spacing-4L) var(--spacing-4L) var(--spacing-4L); text-align:center;  }
    footer .container_row_content img { margin:0px auto; }
    footer .container_row_content .box { margin-bottom:var(--spacing-2L); }

    a.order_online { font-size:var(--font-size-1L); }
    #back_to_top { font-size:var(--font-size-4L); }
}

@media (max-width:400px) {
     #intro ul.quick_link_list li .body { padding: var(--spacing-1S); }
     .link_as_button { padding: var(--spacing-1S) var(--spacing-1L) }
}