﻿@media all {
    /* ------------------------------ */
    /* STANDARD HTML STYLES */
    /* ------------------------------ */
    /* calculator logic: */
    /* at with of 320 font size of 12 */
    /* at with of 1600 font size of 20 */

    :root {
        /* fonts */
        --font-0: 'Open Sans', sans-serif;
        --font-1: 'Open Sans', sans-serif;

        --font-weight-lighter: 100;
        --font-weight-light: 300;
        --font-weight-normal: 400;
        --font-weight-bold: 600;
        --font-weight-bolder: 700;
        --font-weight-boldest: 800;

        --font-size-5S: clamp(0.30rem, calc(0.27rem + 0.14vw), 0.41rem);
        --font-size-4S: clamp(0.36rem, calc(0.32rem + 0.19vw), 0.51rem);
        --font-size-3S: clamp(0.43rem, calc(0.38rem + 0.26vw), 0.64rem);
        --font-size-2S: clamp(0.52rem, calc(0.45rem + 0.35vw), 0.80rem);
        --font-size-1S: clamp(0.63rem, calc(0.53rem + 0.47vw), 1.00rem);
        --font-size-0: clamp(0.75rem, calc(0.63rem + 0.63vw), 1.25rem);
        --font-size-1L: clamp(0.90rem, calc(0.73rem + 0.83vw), 1.56rem);
        --font-size-2L: clamp(1.08rem, calc(0.86rem + 1.09vw), 1.95rem);
        --font-size-3L: clamp(1.30rem, calc(1.01rem + 1.43vw), 2.44rem);
        --font-size-4L: clamp(1.56rem, calc(1.18rem + 1.87vw), 3.05rem);
        --font-size-5L: clamp(1.87rem, calc(1.38rem + 2.44vw), 3.82rem);

        /* padding and margins */
        --spacing-5S: clamp(0.06rem, calc(0.02rem + 0.23vw), 0.25rem);
        --spacing-4S: clamp(0.13rem, calc(0.08rem + 0.23vw), 0.31rem);
        --spacing-3S: clamp(0.19rem, calc(0.16rem + 0.16vw), 0.31rem);
        --spacing-2S: clamp(0.38rem, calc(0.31rem + 0.31vw), 0.63rem);
        --spacing-1S: clamp(0.56rem, calc(0.47rem + 0.47vw), 0.94rem);
        --spacing-0: clamp(0.75rem, calc(0.63rem + 0.63vw), 1.25rem);
        --spacing-1L: clamp(1.13rem, calc(0.94rem + 0.94vw), 1.88rem);
        --spacing-2L: clamp(1.50rem, calc(1.25rem + 1.25vw), 2.50rem);
        --spacing-3L: clamp(2.25rem, calc(1.88rem + 1.88vw), 3.75rem);
        --spacing-4L: clamp(3.00rem, calc(2.50rem + 2.50vw), 5.00rem);
        --spacing-5L: clamp(4.50rem, calc(3.75rem + 3.75vw), 7.50rem);

        /* colors - branding */
        --color-blue: #002b49;
        --color-light-blue:#1779be;

        --color-light-green: #89dd5f;
        --color-green: #76a730;

        /* color - other */
        --color-white: #FFFFFF;
        --color-black: #111111;

        --color-light-gray: #f8f8f7;
        --color-gray: #ebe9ed;
        --color-dark-gray: #bbb9be;

        --color-red:#dd4f4f;
    }

    /* general CSS */
    *:not(p) { margin:0px; }
    *, *::before, *::after { box-sizing: border-box; }

    html, body { width:100%; min-height:100%; padding:0px; z-index:-2; }
    
    html { background-color:var(--color-light-gray); font-size:20px; font-family: var(--font-0); color:var(--color-black); line-height:1.5; }
    body { position:relative; max-width:1800px; margin:0px auto; background-color: var(--color-white); -webkit-font-smoothing: antialiased; }

    hr {  margin:var(--spacing-2L) auto; width:50%; max-width:100px; background-color:var(--color-black); height:var(--spacing-2S); border:0px; }

    a { color:var(--color-light-blue); text-decoration:none; transition: all .5s ease 0s; }
    a:hover,
    a:focus { color:var(--color-black); text-decoration:underline; }

    a[href^="tel:"] { color:var(--color-light-blue); text-decoration:underline; font-weight:600; letter-spacing:2px;  }

    h1 { margin-bottom:var(--spacing-2S); color:var(--color-black); font-family: var(--font-0); font-size:var(--font-size-4L); line-height:1; font-weight:var(--font-weight-bolder); letter-spacing:-1px; text-transform:uppercase; }
    
    h2 { margin-bottom:var(--spacing-2S); color:var(--color-black); font-family: var(--font-0); font-size:var(--font-size-3L); line-height:1; font-weight:var(--font-weight-bold); letter-spacing:1px; text-transform:uppercase; }
    h3 { margin-top:var(--spacing-0); margin-bottom:var(--spacing-2S); color:var(--color-black); font-family: var(--font-0); font-size:var(--font-size-1L); line-height:1.4; font-weight:var(--font-weight-bold); }
    h4 { margin-top:var(--spacing-0); margin-bottom:var(--spacing-2S); color:var(--color-black); font-family: var(--font-0); font-size:var(--font-size-1L); line-height:1; font-weight:var(--font-weight-bold); }
    h5 { margin-top:var(--spacing-0); margin-bottom:var(--spacing-2S); color:var(--color-black); font-family: var(--font-0); font-size:var(--font-size-0); line-height:1; font-weight:var(--font-weight-bold); }
    h6 { margin-top:var(--spacing-0); margin-bottom:var(--spacing-2S); color:var(--color-black); font-family: var(--font-0); font-size:var(--font-size-0); line-height:1; font-weight:var(--font-weight-bold); }

    p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }
    p:not(:last-of-type) { margin-bottom:var(--spacing-0); }

    img	{ padding:0px; border:0px; }
    img, picture, video, canvas, svg { display: block; max-width: 100%; }

    ul { position:relative; list-style-type:disc; }
    li { position:relative; padding:0px; }

    ul.no_bullets,
    ol.no_bullets { padding:0px; list-style:none; }

    ul.horizontal_list { display:flex; align-items:center; padding:0px; list-style:none; }
    ul.vertical_list { display:flex; align-items:center; flex-wrap:wrap; padding:0px; list-style:none; }
    ul.vertical_list > li { flex:1; flex-basis:100%; }

    /* start inputs */
    input, button, textarea, select { position:relative; font: inherit; }

    input, 
    textarea,
    select { background-color:var(--color-light-gray); font-size:var(--font-size-2S); -ms-box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box; }

    input:not([type='checkbox'], [type='radiobutton']),
    input[type="submit"] { border-radius:5px; }

    input:not([type='checkbox'], [type='radiobutton']),
    input[type="submit"],
    select,
    textarea { -webkit-appearance:none; -moz-appearance:none; appearance:none; border-radius:5px; }

    input:focus-visible,
    select:focus-visible,
    textarea:focus-visible { outline:none; }

    input:not([type='checkbox'], [type='radiobutton'], [type='submit']),
    select,
    textarea { border:0px; padding:var(--spacing-2S); width:calc(100% - calc(var(--spacing-2S) * 2)); vertical-align:middle;}

    input[disabled='disabled'],
    input[disabled],
    textarea[disabled='disabled'],
    textarea[disabled],
    input[type=text]:read-only { color:var(--color-black); background-color:var(--color-light-gray); border:0px; }

    select { background-size: var(--font-size-0); background-position: right var(--spacing-3S) center; background-repeat:no-repeat; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"><path d="m480 705 173-173-43-42-130 130-130-130-43 42 173 173Zm0 271q-82 0-155-31.5t-127.5-86Q143 804 111.5 731T80 576q0-83 31.5-156t86-127Q252 239 325 207.5T480 176q83 0 156 31.5T763 293q54 54 85.5 127T880 576q0 82-31.5 155T763 858.5q-54 54.5-127 86T480 976Zm0-60q142 0 241-99.5T820 576q0-142-99-241t-241-99q-141 0-240.5 99T140 576q0 141 99.5 240.5T480 916Zm0-340Z"/></svg>'); }
    select::-ms-expand { display:none; }

    fieldset { border:0px; padding:0px; }
    /* end inputs */

    /* start text */
    .small_text { padding:0px; font-size:var(--font-size-0); line-height:1; letter-spacing:0px; text-transform: uppercase; }
    .medium_text { font-size:var(--font-size-3L); letter-spacing:1px; line-height: 1.4; }
    .large_text { font-size:var(--font-size-5L); letter-spacing:2px; font-weight:var(--font-weight-normal); line-height:1.4; }

    .uppercase { text-transform:uppercase; }
    .italic { font-style:italic; }
    .bold { font-weight:var(--font-weight-bold); }

    .no_uppercase { text-transform:none; }
     /* end text */

    /* start controls */
    .control_small_width { width:10% !important; min-width:100px; }
    .control_quarter_width { width:25%  !important; }
    .control_half_width { width:50% !important; }
    .control_three_quarters_width { width:75%  !important; }
    /* end controls */

    /* start buttons */
    .input_button,
    .link_as_button { display:inline-block; padding:var(--spacing-1S) var(--spacing-2L); font-size:var(--font-size-2S); font-weight:var(--font-weight-bolder); line-height:1; cursor:pointer; color:var(--color-white); text-transform:uppercase; background-color:var(--color-blue); border:0px; border-radius: 50px; } 

    .input_button:hover,
    .input_button:focus,
    .link_as_button:hover,
    .link_as_button:focus { background:none; font-weight: var(--font-weight-bold); color:var(--color-blue); background-color:var(--color-white); }

    .input_button:disabled,
    .link_as_button:disabled { background-color:var(--color-dark-gray); color:var(--color-white); cursor:default; }

    .link_arrow_next { padding-right: var(--spacing-2L); background-repeat: no-repeat; background-size: var(--font-size-1S); background-position: right var(--spacing-0) center; background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"%3E%3Cpath d="m480 896-42-43 247-247H160v-60h525L438 299l42-43 320 320-320 320Z" fill="%23ffffff" /%3E%3C/svg%3E');}
    .link_arrow_previous { padding-left: var(--spacing-2L); background-repeat: no-repeat; background-size: var(--font-size-1S); background-position: left var(--spacing-0) center; background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg xmlns="http://www.w3.org/2000/svg" height="48" viewBox="0 96 960 960" width="48"%3E%3Cpath d="M480 896 160 576l320-320 42 42-248 248h526v60H274l248 248-42 42Z" fill="%23ffffff" /%3E%3C/svg%3E');}

    .black_button { background-color:var(--color-black); color:var(--color-white); }
    .black_button:hover,
    .black_button:focus { background-color:var(--color-blue); color:var(--color-white); }

    .red_button { background-color:var(--color-red); }
    .red_button:hover,
    .red_button:focus { color:var(--color-white); background-color:var(--color-dark-red); }

    .transparent_button { color:var(--color-black); background-color:transparent; border:1px var(--color-black) solid; }
    .transparent_button:hover,
    .transparent_button:focus { color:var(--color-white); background-color:var(--color-black); }
    /* end buttons */

    /* flex and grid */
    .is_flex { display:flex; align-items: center; gap:var(--spacing-0); }
    .is_grid { display:grid; grid-template-columns: repeat(2, 1fr); gap:var(--spacing-0); }

    /* form */
    .form_box { display:grid; grid-template-columns:repeat(2, 1fr); gap:var(--spacing-0); list-style:none; }
    .form_box > div { position:relative; }
    .form_box > div.full_row { padding:0px; grid-column: 1 / -1 }

    .form_box > div label { display: block; margin-bottom: var(--spacing-3S); font-size:var(--font-size-2S); letter-spacing:1px; z-index:2; transition: top 0.3s ease-in-out;}

    .form_box > div .input_error { border-bottom: 4px var(--color-red) solid; }

    .form_box > div:focus-within textarea { height:7rem; }

    .form_box > div .form_icon { width: var(--font-size-3S); height: var(--font-size-3S); position: absolute; top: 50%; right: var(--spacing-2S); transform:translateY(-50%); pointer-events: none; z-index: 2; }
    .form_box > div .form_icon.icon_success { stroke: var(--color-green); }
    .form_box > div .form_icon.icon_error { stroke: var(--color-red); }
    
    .form_box > div .form_error { font-size: 0.85rem; color: var(--color-red); }
    
    .form_error_box { color: var(--color-red); }

    /* end form */

    /* start message */
    .message { display:block; }
    .message .material-icons { font-size:var(--font-size-1S); margin-right:10px; color:var(--color-white); vertical-align:middle; }

    .message .ok,
    .message .warning,
    .message .error,
    .message .nothing_defined { padding:var(--spacing-1S); color:var(--color-white); }

    .message .error { background-color:var(--color-dark-red); }
    .message .warning { background-color:var(--color-dark-yellow); }
    .message .ok { background-color:var(--color-dark-green); }
    .message .nothing_defined { background-color:var(--color-dark-gray); }
    /* end message */

    /* alignments */
    left { text-align:left; }
    .right { text-align:right; }
    .center { text-align:center; }
    /* end alignments */

    /*required*/
    .required { position:absolute; top:0px; right:0px; z-index:1; background:linear-gradient(to left, #ef473a, #cb2d3e); padding:2px 8px; color:var(--color-red); font-size:var(--font-size-2S); } 
    /*end required*/

    /* overlays */
    .overlay_black_10:before,
    .overlay_black_20:before,
    .overlay_black_30:before,
    .overlay_black_40:before,
    .overlay_black_50:before,
    .overlay_black_60:before,
    .overlay_black_70:before,
    .overlay_black_80:before,
    .overlay_black_90:before { content:''; position:absolute; top:0; right:0; bottom:0; left:0; background-color:var(--color-black); }

    .overlay_black_10:before { opacity:.1; }
    .overlay_black_20:before { opacity:.2; }
    .overlay_black_30:before { opacity:.3; }
    .overlay_black_40:before { opacity:.4; }
    .overlay_black_50:before { opacity:.5; }
    .overlay_black_60:before { opacity:.6; }
    .overlay_black_70:before { opacity:.7; }
    .overlay_black_80:before { opacity:.8; }
    .overlay_black_90:before { opacity:.9; }
    /* end overlays */

    /* catcpha */
    .catcpha { font-size:1.1rem; letter-spacing:2px; }
    /* end catcpha */

    /* other */
    .hide { display:none; }

    #quick_row { position: fixed; display: inline-block; margin:0px auto; bottom: var(--spacing-3S); left: 50%; transform: translateX(-50%); text-align: center; z-index: 50; transition: all .5s ease 0s; }
    #quick_row a { padding: var(--spacing-3S); margin: 0px var(--spacing-5S); background-color: var(--color-blue); color:var(--color-white); font-size: var(--font-size-1L); font-weight: var(--font-weight-bold); border-radius: 50px; transition: all .5s ease 0s; }
    #quick_row a:not(:last-of-type) { margin-bottom: var(--spacing-4S);}
    #quick_row a:hover,
    #quick_row a:focus { background-color: var(--color-light-blue); text-decoration: none; transform: scale(1.2); }

    #quick_row { display: none;}

    /*-----------------------------*/
    /* MAIN BODY ROWS */
    /*-----------------------------*/
    .wrapper_row { position:relative; background-color:var(--color-white); }
    .container_row { position:relative; margin:0px auto; width:96%; max-width:1400px; }
    .container_row_content { position:relative; padding:var(--spacing-5L) 0px; border-radius:var(--spacing-1L); }

    .width_400 { max-width:400px; }
    .width_500 { max-width:500px; }
    .width_600 { max-width:600px; }
    .width_800 { max-width:800px; }
    .width_1000 { max-width:1000px; }
    .width_1200 { max-width:1200px; }
    .width_1400 { max-width:1400px; }
    .width_1600 { max-width:1600px; }
    .width_full { max-width:initial; }

    /*-----------------------------*/
    /* BRAND SPECIFIC */
    /*-----------------------------*/
    .green_text { color:var(--color-green); }
}

@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:120px;}

    #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-3L);}
    #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); }

    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: 500px) {
    #intro ul.quick_link_list li { height: auto; min-height: 250px; }
    header .header_group .logo img { max-width:120px; }
    #everyday-offerings ul.eo_menu_list { display: none; }
    body { font-size: var(--font-size-1); }
    a.order_online { bottom: 20px; animation: none; }
}