@media all {
    /*override */
    #container_body { width:100%; max-width:initial; }

    .wrapper_row:not(#sub_footer) p { font-size:1.4rem; }
    .container_row { max-width:1400px; }
    .container_row_content { padding:120px 0px; }

    h2 { margin:0px auto; font-size:2.4rem; font-weight:700; text-transform:uppercase; text-align:center; }
    h3 { font-size:1.6rem; font-weight:700; text-transform:uppercase; }

    .loyalty_program_banner h2 { font-size:3rem; }
    .loyalty_program_banner p { font-size:2.2rem;}

    #hero_controls { display:none !important; }

    /* intro */
    #intro h2 { width:60%; font-size:2.8rem; font-weight:600; text-align:center; line-height:1.4; }
    #intro .intro_group { margin-top:4rem; gap:3rem; align-items:center; }
    #intro .intro_group > div:nth-child(1) img { display:block; margin:0px; width:100%; }
    #intro .intro_group > div:nth-child(2) p.bold { font-size:1.6rem;}

    /* how */
    #how { background-color:#a29061; }
    #how h2 { margin-top:0px; color:#FFFFFF; }
    #how ul.how_list { margin-top:4rem; grid-template-columns:1fr 1fr 1fr; gap:3rem; align-items:stretch; }
    #how ul.how_list li { background-color:#FFFFFF; }
    #how ul.how_list li .body { padding:4rem; text-align:center; }
    #how ul.how_list li .body img { display:inline-block; margin:0px auto 2rem auto; width:80%; height:100px; object-fit:contain; max-width:100px; }
    #how ul.how_list li .body p { margin-bottom:0px; }
    #how ul.how_list li a { font-weight:600; }

    /* what */
    #what ul.what_list { grid-template-columns:1fr 1fr 1fr; column-gap:5rem; row-gap:3rem; text-align:center;}
    #what ul.what_list li { border-bottom:2px #a29061 solid; }
    #what ul.what_list li p { padding:2rem; }

    /* restaurants */
    #restaurants { text-align:center; }
    #restaurants h3 { color:#a29061;}
    #restaurants h3.new_york { margin-top:4rem; }
    #restaurants h3.florida { margin-bottom:2rem; }

    #restaurants hr { margin-top:6rem; margin-bottom:6rem; background-color:#a29061; }

    #restaurants ul.venue_list { grid-template-columns:repeat(4, 1fr); gap:3rem; align-items:center; }
    #restaurants ul.venue_list img { width:80%; transition:all .8s;}
    #restaurants ul.venue_list img:hover,
    #restaurants ul.venue_list img:focus { transform:scale(1.2); opacity:.8; }

    /* app */
    #app { background-color:#f5f5f5; }
    #app .container_row { max-width:1200px; }

    #app .intro_group { gap:5rem; grid-template-columns:3fr 7fr; align-items:center; }
    #app .intro_group > div:nth-child(1) img { display:inline-block; margin:0px; width:100%; }
    #app .intro_group > div:nth-child(2) h2 { text-align:left; }
    #app .intro_group > div:nth-child(2) a.link_as_button { color:#111111; background-color:#FFFFFF; border:1px #a29061 solid; }
    #app .intro_group > div:nth-child(2) a.link_as_button:hover,
    #app .intro_group > div:nth-child(2) a.link_as_button:focus { color:#FFFFFF; background-color:#a29061; border:1px #a29061 solid; }

    /* faq */
    #faq h3 { text-transform:none; }

    #faq ul.faq_list { margin-top:3rem; grid-template-columns:1fr; gap:2rem; }
    #faq ul.faq_list > li { padding-bottom:2rem; font-size:1.4rem; }
    #faq ul.faq_list > li:not(:last-of-type) { border-bottom:1px #a29061 solid; }
    #faq ul.faq_list > li > ul { padding-left:1rem; }
}

@media (max-width:1400px) {
    h2 { font-size:2rem; }
    h3 { font-size:1.4rem; }
    .wrapper_row:not(#sub_footer) p { font-size:1.2rem; }

    #intro h2 { width:50%; font-size:2rem; }
    #intro .intro_group { margin-top:3rem; }

    .container_row_content { padding-top:80px; padding-bottom:80px; }

    #intro .intro_group > div:nth-child(2) p.bold { font-size:1.2rem; }

    #how ul.how_list { gap:2rem; margin-top:3rem; }
    #how ul.how_list li .body { padding:3rem; }
    #how ul.how_list li .body img { height:75px; }

    #what ul.what_list li p { padding:1.5rem; }

    #restaurants hr { margin-top:5rem; margin-bottom:5rem; }

    #faq ul.faq_list { gap:1.5rem; }
    #faq ul.faq_list > li { padding-bottom:1rem;  font-size:1.5rem; }
}

@media (max-width:1000px) {
    h2 { font-size:1.6rem; }
    h3 { font-size:1.2rem; }
    .wrapper_row:not(#sub_footer) p { font-size:1rem; }

    #intro h2 { width:100%; font-size:2rem; }
    #intro .intro_group { margin-top:2rem; }

    #how ul.how_list { margin-top:2rem; }
    #how ul.how_list li .body { padding:2rem; }
    #how ul.how_list li .body img { height:50px; }

    #what ul.what_list { gap:3rem; }
    #what ul.what_list li p { padding:1rem; }
    
    #restaurants hr { margin-top:4rem; margin-bottom:4rem; }

    #app .intro_group { gap:2rem;}

    #faq ul.faq_list { gap:1rem; }
    #faq ul.faq_list > li { padding-bottom:1rem;  font-size:1rem; }
}

@media (max-width:800px) {
    .container_row_content { padding-top:60px; padding-bottom:60px; }
    #intro h2 { font-size:1.7rem; }
    #intro .intro_group { margin-top:1.5rem; }
    #intro .intro_group > div:nth-child(2) p.bold { font-size:1rem; }

    #restaurants ul.venue_list { grid-template-columns:repeat(3, 1fr); gap:2rem; }
}

@media (max-width:750px) {
    #how ul.how_list { grid-template-columns:1fr 1fr; }
    #how ul.how_list li:nth-child(3) { grid-column: 1 / -1;}
}

@media (max-width:650px) {
    .loyalty_program_banner { top:50% !important; }
    .loyalty_program_banner h2 { font-size:1.6rem;}
    .loyalty_program_banner p { display:none; }
    .loyalty_program_banner .explore_link { display:none; }
    .loyalty_program_banner .is_flex a.link_as_button { padding:.5rem 1rem; }

    #intro h2 { font-size:1.5rem; }
    #intro .intro_group { margin-top:1rem; grid-template-columns:1fr; gap:1rem; }
    #intro .intro_group > div:nth-child(1) { order:2; }
    #intro .intro_group > div:nth-child(2) { order:1; }
    #intro .intro_group > div:nth-child(1) img { margin:0px auto; width:70%; }

    #how ul.how_list { grid-template-columns:1fr; }

    #what ul.what_list { grid-template-columns:1fr; gap:1rem; }
    #what ul.what_list li p { padding:.5rem; }

    #restaurants ul.venue_list { grid-template-columns:repeat(2, 1fr); gap:1rem; }
    #restaurants ul.venue_list img { width:60%; }

    #app .intro_group > div:nth-child(2) h2 { font-size:1.3rem; text-align:center; }
    #app .intro_group { grid-template-columns:1fr; text-align:center;}
    #app .intro_group > div:nth-child(1) { order:2; }
    #app .intro_group > div:nth-child(1) img { display:inline-block; margin:0px auto; width:50%; }

    #app .intro_group > div:nth-child(2) { order:1; }
}