:root {
        --color-dark-green: #3a3e1f;
        --color-cream: #e0db96;
        --color-red: #c84527;
        --color-red-var: #b73d26;
        --color-blue: #adbcbb;
        --color-blue-var: #9caeac;
        --color-green: #aaa327;
        
        --title-font-size: 6rem;
    	--title-line-height: 5.7rem;
        --subhead-font-size: 2rem;
        
        @media (max-width: 991.98px) {  
        --title-font-size: 3.2rem;
        --title-line-height: 3.3rem;
                --subhead-font-size: 1.3rem;

        }
        
        
        
    }

   
    @font-face {
    font-family: 'cardenio_modernbold';
    src: url('../fonts/cardeniomodern-bold-webfont.woff2') format('woff2'),
         url('../fonts/cardeniomodern-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'cardenio_modernregular';
    src: url('../fonts/cardeniomodern-regular-webfont.woff2') format('woff2'),
         url('../fonts/cardeniomodern-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
    @font-face {
        font-family: Sugar Pie W00 Regular;
        src: url(../fonts/bb7f78c6-adac-448a-9456-49ed1ff7a039.eot?#iefix);
        src: url(../fonts/bb7f78c6-adac-448a-9456-49ed1ff7a039.eot?#iefix) format("eot"), 
        url(../fonts/3557a99b-8a15-4f9e-bf2c-49de8605a896.woff2) format("woff2");
    }

    body, html {
        height: 100%;
        margin: 0;
        overflow-x: hidden;
    	scroll-behavior: smooth;
        display: flex;
        flex-direction: column;
		font-family: "brandon-grotesque", sans-serif;
		font-weight: 400;
		font-style: normal;
    }

.locations-section, .menus-section, .promo1-section, .promo4-section, .promo4-section-alt, .promo4-section-alt2, .promo4-section-alt3,  .promo4-section-alt4, .promo4-section-alt5, .promo5-section, .promo2-section, .waitlist-section, .news-section, .newsletter-section, .burgermonth-section, .footer-section, .hero-section, .order-online-section, promo4-section-alt6, .promo2-section-cheese {
    scroll-snap-align: start;
    height: 100vh; /* Each section takes up full viewport height */
    
}

/* Optional: smooth scrolling behavior */
html {
    scroll-behavior: smooth;
}
.policytext {
color: var(--color-cream);

font-size: 1.3rem;
}
.policytextgrn {
color: var(--color-dark-green);

font-size: 1.3rem;
}

.redtext {
color: var(--color-red) !important;

}

.loctext {
color: var(--color-cream);

font-size: 1.1rem;
}
.loctextgreen {
color: var(--color-dark-green);

font-size: 1.3rem;
}


.termstext {
color: var(--color-dark-green);
font-weight: 500;
font-size: 1.1rem;

}
.logo {max-width: 100%;}
.logo2 {width: 220px; max-width: 220px;}
    /* General wrapper structure */
    .container-wrapper {
        flex-grow: 1;
        display: flex;
        flex-direction: column;
    }

    /* Hero Section */
    .hero-section {
        background: url('/files/header.jpg') center center/cover no-repeat;
        height: 60vh;
        width: 100%;
        position: relative;
    }
    .privacy-section {
        background-color: var(--color-red);
        height: 100%;
        width: 100%;
        position: relative;
padding-bottom: 18vh;
}
.event-red-section {
    background: url(/files/background_events_cherrycreek_1.svg) ;
    background-color: var(--color-red-var);
    width: 100%;
    position: relative;
    padding-bottom: 18vh;
    
        
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 45vh, 45vw;
    background-position-y: 6vh;
    background-position-x: 65vw;


}
.event-red-section1 {
    background: url(/files/background_locations_cherrycreek_1.svg) ;
    background-color: var(--color-red-var);
    width: 100%;
    position: relative;
    padding-bottom: 18vh;
    
        
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 45vh, 45vw;
    background-position-y: 6vh;
    background-position-x: 65vw;


}
.locbuttons {
margin-top: 1rem;
margin-bottom: 1rem;
}

.event-blue-section {
    background: url(/files/background_events_ballpark_1.svg) ;
    background-color: var(--color-blue-var);
      
    width: 100%;
    position: relative;
    padding-bottom: 18vh;
    
    
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 36vh, 39vw;
    background-position-y: 12vh;
    background-position-x: 65vw;

  

}
.event-blue-section1 {
    background: url(/files/background_locations_ballpark_1.svg) ;
    background-color: var(--color-blue-var);
      
    width: 100%;
    position: relative;
    padding-bottom: 18vh;
    
    
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 45vh, 45vw;
    background-position-y: 6vh;
    background-position-x: 65vw;

  

}

.beer-section {
    background: url(/files/background_draft_list.svg);
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 40vh, 40vw;
    background-position-y: 6vh;
    background-position-x: 65vw;
    /* background-attachment: scroll, local; */
    background-color: var(--color-cream);
    width: 100%;
    position: relative;
    padding-bottom: 18vh;
}
.event-green-section {
    background: url(/files/background_events_littleton_1.svg) ;
    background-color: var(--color-green);
    width: 100%;
    position: relative;
    padding-bottom: 18vh;
    
        
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 45vh, 45vw;
    background-position-y: 6vh;
    background-position-x: 65vw;


}
.event-cream-section {
    background: url(/files/NEEDFILE.svg) ;
    background-color: var(--color-cream);
    width: 100%;
    position: relative;
    padding-bottom: 18vh;
    
        
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 45vh, 45vw;
    background-position-y: 6vh;
    background-position-x: 65vw;


}
.event-green-section1 {
    background: url(/files/background_locations_littleton_1.svg) ;
    background-color: var(--color-green);
    width: 100%;
    position: relative;
    padding-bottom: 18vh;
    
        
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 45vh, 45vw;
    background-position-y: 6vh;
    background-position-x: 65vw;


}
.event-green-section-music {
    background: url(/files/live_music_bkgrd.svg) ;
    background-color: var(--color-green);
    width: 100%;
    position: relative;
    padding-bottom: 18vh;
    
        
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 140vh, 100vw;
    


}

.location-hero-pad {padding-top: 6vh;}

.event-cream-section1 {
    background: url(/files/.svg) ;
    background-color: var(--color-cream);
    width: 100%;
    position: relative;
    padding-bottom: 18vh;
    
        
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 45vh, 45vw;
    background-position-y: 6vh;
    background-position-x: 65vw;


}
.about-green-section {
    background: url(/files/background_burger_flags_green.svg) ;
    background-color: var(--color-dark-green);
    width: 100%;
    position: relative;
    padding-bottom: 18vh;
    background-size: contain;
    background-repeat: repeat;
    background-position: top right;
    
}
.about-green-section2 {
    background: url(/files/ourstory_bkgrd_tmp_1.png) ;
    background-color: var(--color-dark-green);
    width: 100%;
    position: relative;
    padding-bottom: 18vh;
    background-size: contain;
    background-repeat: repeat;
    background-position: top right;
    
}
.twofifty {
width: 250px;
}
.news-green-section {
    background-color: var(--color-green);
    width: 100%;
    position: relative;
    padding-bottom: 18vh;

}
.treehunny {
width: 300px;
}

.event-image {
width: 100%;
border-radius: 18%;
text-align: center;
margin: 0 auto;
vertical-align: center;
padding: 20px;
}
    .privacy-header h1 {
     font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-dark-green);
    text-align: center;
    margin: 0 auto;
    margin-bottom: 40px; /* Adjust spacing below the title */
}

.location-top-pad {margin-top: -12px; line-height: 1.6rem;} 
   .terms-section {
        background-color: var(--color-cream);
        height: 100%;
        width: 100%;
        position: relative;
padding-bottom: 18vh;
}
    .terms-header h1 {
     font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-red);
    text-align: center;
    margin: 0 auto;
    margin-bottom: 40px; /* Adjust spacing below the title */
}
    
    .event-container {
    margin-top: 30vh;
    }
  

    .hero-content {
        text-align: center;
        position: absolute;
        top: 50px;
        left: 50%;
        transform: translateX(-50%);
        color: white;
    }
.hero-content-about {
        text-align: center;
        position: absolute;
        top: 50px;
        left: 50%;
        transform: translateX(-50%);
        color: white;


}
    .logo {
        width: 280px;
    }

    /* Menu and Order button positioning */
    .hero-container {
        position: absolute;
        width: 100%;
        max-width: 1335px;
        margin: 0 auto;
        left: 0;
        right: 0;
        top: 20px;
        padding: 0 20px;
        display: flex;
        justify-content: space-between;
    }
    .hero-container2 {
        position: absolute;
        width: 100%;
        max-width: 1335px;
        margin: 0 auto;
        left: 0;
        right: 0;
        top: 20px;
        padding: 0 20px;
        display: flex;
        justify-content: space-between;
    }

.nav-menu {
    float: left;
    width: 65px;
    height: 65px;
    background: url(/files/button_nav.svg) no-repeat center center / contain;
    cursor: pointer;
    margin-left: -95px;
    z-index: 1;
}
/* Hover effect to change the image */
.nav-menu:hover {
    background: url('/files/button_nav_rollover.svg') no-repeat center center/contain;
}

    /* Sticky Menu Button */
    .nav-menu.sticky {
        position: fixed;
        top: 20px;
        left: 20px;
    }

/* Fullscreen Menu with animation */
#menuContainer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #c84527;
    color: var(--color-cream);
    display: flex;
    opacity: 0; /* Initially hidden */
    transform: scale(0); /* Initially scaled down */
    transform-origin: center; /* Radial growth from the center */
    transition: transform 0.25s ease-in-out, opacity 0.25s ease-in-out; /* Slower transition for scaling and opacity */
    align-items: center;
    justify-content: center;
    flex-direction: column;
font-family: "brandon-grotesque", sans-serif;
font-weight: 600;
font-style: normal;
text-transform: uppercase;
z-index: 2;
    pointer-events: none; /* Prevent interaction when hidden */
}

/* Menu active (fullscreen with animation) */
#menuContainer.active {
    opacity: 1;
    transform: scale(1); /* Scale to full screen when active */
    pointer-events: auto; /* Enable interaction when visible */
}

#menuClose {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 30px;
    cursor: pointer;
    width: 20px;
    color: var(--color-cream);
}

/* Menu list styling */
#menuList {
    list-style: none;
    padding: 0;
    text-align: center;
    margin-bottom: 0;
}

#menuList li {
    margin: 12px 0;
    font-size: 1.3rem;
    letter-spacing: .1rem;
}

#menuList li a {
    color: var(--color-cream);
    text-decoration: none;
    transition: color 0.3s;
}

#menuList li a:hover {
    color: white;
}

.menubottom {
  margin: 0;
    font-size: 1rem;
    letter-spacing: .1rem;
        position: relative;
    bottom: 0;

}
.menubottom a {
  color: var(--color-cream);
    text-decoration: none;
    transition: color 0.3s;
}  
.menubottom a:hover {
    color: white;
}
#menusocial {
width: 32px;
height: 32px;
display: inline-block;
}

#menusocial2 {
width: 32px;
height: 32px;
display: inline-block;
}

/* Waitlist Button */
.btn-waitlist {
    background: url('/files/button_waitlist.svg') center center/contain no-repeat;
    width: 475px; /* Waitlist button size */
    height: 165px;
    display: inline-block;
    position: absolute;
filter: drop-shadow(0px 0px 8px #827c87);
left: 20%;
    top: 45vh;
    transform: translate(-50%, -50%);
    transition: background-image 0.3s ease-in-out, transform 0.3s ease-in-out;
}

/* Hover effect for Waitlist Button */
.btn-waitlist:hover {
    background: url('/files/button_waitlist_rollover.svg') center center/contain no-repeat;
    opacity: 1; /* Slight fade effect on hover */
    filter: drop-shadow(0px 0px 12px #827c87);

    transform: translate(-50%, -50%) scale(1.1); /* Increase size by 10% and maintain position */
}

 /* Styling for the button */
    .btn-order {
        position: relative; /* Required for the dropdown to position relative to the button */
        float: right;
        width: 200px; /* Fixed width for the button */
        height: 60px;
        background: url('/files/button_order_online.svg') no-repeat center center/contain;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--color-red);
        font-weight: bold;
        font-size: 16px;
        cursor: pointer;
        letter-spacing: .1rem;
        text-transform: uppercase;
    }

    /* Dropdown hidden initially */
    .order-dropdown {
        display: none;
        position: absolute;
        top: 100%; /* Directly below the button */
        left: 0;
        width: 100%; /* Match the button width */
        text-align: center;
        
    }

    /* Dropdown visible when active */
    .order-dropdown.active {
        display: block;
        animation: fadeIn 0.5s ease-in-out;
    }

    /* Dropdown button styles */
    .order-dropdown div {
        padding: 15px;
        margin-left: 16px;
        font-size: 16px;
          color: var(--color-red);
        font-weight: bold;
        text-align: center;
        background: url('/files/button_order_online_drop.svg') no-repeat center center/contain;
        margin-top: 5px; /* Reduced margin */
        text-transform: uppercase;
        width: 100%;
    }
    a.noline  {text-decoration: none;}

    /* Hover effect */
    .order-dropdown div:hover {
        background: url('/files/button_order_online_drop_rollover.svg') no-repeat center center/contain;
        color: var(--color-cream);
    }

    /* Fade in effect */
    @keyframes fadeIn {
        from {
            opacity: 0;
            transform: translateY(-10px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }


    /* Green Bar with scrolling text */
    .green-bar {
        background-color: var(--color-dark-green);
        color: var(--color-cream);
        color: white;
        height: 5vh;
        left: 0px;

        line-height: 40px;
        position: relative;
    }

    .green-bar p {
font-family: "brandon-grotesque", sans-serif;
font-weight: 900;
font-style: normal;
font-size: 1rem;
        letter-spacing: 2.5px;
        color: var(--color-green);
        white-space: nowrap;
        text-transform: uppercase;
        animation: scrollText 30s linear infinite;
        origin: left;
    }

    @keyframes scrollText {
        from {
            transform: translateX(100%);
        }
        to {
            transform: translateX(-100%);
        }
    }
.news-spacer {
height: 15vh;

}
    /* Info Section Styles */
    .info-section {
        background-color: #d14227;
        color: white;
        height: 35vh;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .info-box {
        position: relative;
        padding: 85px 50px;
        display: flex;
            min-height: 379px;
    max-width: 400px;
    min-width: 350px;
        flex-direction: column;
        justify-content: space-between;
        text-align: left;
        margin: 0 auto;

    }
    .info-box a {font-weight: bold; font-size: 1.3rem;}
    .info-box a:hover {color: var(--color-dark-green); 
    				 text-decoration: none !important;}
    .info-box p {font-size: 1.3rem}
.info-box li {font-size: 1.3rem}
.eventsheader-cream {
font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-cream);
    text-align: center;
    
}    
.eventsheader-dark-green {
font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-dark-green);
    text-align: center;
    
}    
.beer-header {
font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-red);
    text-align: center;
    }    
.eventsheader-red {
font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-red);
    text-align: center;
    
}    
    
  .frame-1 {
    color: var(--color-cream);
        background: url('/files/background_frame_1_promo.svg') no-repeat center center, url('/files/frame.svg') no-repeat center center;
        background-size: contain;
    }
.frame-1 h3 {text-transform: uppercase; font-size: 1.5rem;}
    .frame-2 {
        color: var(--color-cream);

        background: url('/files/background_frame_2_promo.svg') no-repeat center center, url('/files/frame.svg') no-repeat center center;
        background-size: contain;
    }
.frame-2 h3 {text-transform: uppercase;  font-size: 1.5rem;}
    .frame-3 {
        color: var(--color-cream);

        background: url('/files/background_frame_3_promo.svg') no-repeat center center, url('/files/frame.svg') no-repeat center center;
        background-size: contain;
    }
.frame-3 h3 {text-transform: uppercase;  font-size: 1.5rem;}


    #menuClose {
        position: absolute;
        top: 20px;
        right: 20px;
        font-size: 30px;
        cursor: pointer;
        color: var(--color-cream);
    }




    /* Locations Section Styling */
.locations-section {
    position: relative;
    width: 100%;
    background-color: var(--color-cream);
    background-image: url('/files/background_locations.svg');
    background-position: center;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
}

.locations-container {
    text-align: center;
    color: var(--color-dark-green);
}

.locations-title {
    font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-dark-green);
    margin-bottom: 20px; /* Adjust spacing below the title */
}

.location-nav {
font-family: "brandon-grotesque", sans-serif;
font-weight: 900;
font-style: normal;
font-size: 2rem; /* Increase the size for the location nav */
    color: var(--color-red);
    margin: 30px 0; /* Increase spacing */
    letter-spacing: 0.2rem; /* Adjust letter spacing */
}

.location-nav span {
    padding: 0 25px; /* Increase padding between locations */
}

.location-details {
    display: flex;
    justify-content: space-around;
    gap: 40px;
    margin-top: 50px; /* Adjust top margin for more spacing */
}

.location-item {
    text-align: center;
    font-family: "brandon-grotesque", sans-serif;
font-weight: 600;
font-style: normal;
    color: var(--color-dark-green);
}

.location-item-address {
    text-align: center;
    font-family: "brandon-grotesque", sans-serif;
font-weight: 400;
font-style: normal;
    color: var(--color-dark-green);
    padding-bottom: 20px;
}

.location-item h3 {
    font-size: 1.8rem; /* Increase size for the location name */
    margin-bottom: 10px;
}

.location-item p {
    font-size: 1.3rem; /* Adjust the font size for the address */
    
    text-transform: uppercase;
}

.location-phone {
    font-size: 1.3rem; /* Adjust the font size for the phone number */
    font-weight: 900;
    color: var(--color-dark-green);
    padding-bottom: 20px;
}
.footer-location-name {
    font-size: 1.3rem; /* Adjust the font size for the phone number */
    font-weight: 400;
    padding-bottom: 10px;
    
}


.more-details-button {
       background: url('/files/button_triangle_red.svg') no-repeat center center;
    background-size: contain;
    width: 100%;
    height: 75px;
    line-height: 1.1;
    border: none;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
    font-family: 'cardenio_modernbold', sans-serif;
    font-size: 1.3rem;
    text-transform: uppercase;
    letter-spacing: 0.05rem !important;
    text-align: center;
    color: var(--color-cream);
    transition: transform 0.3s ease-in-out;
    flex-direction: column;
}

.more-details-button img {
    width: 100%; /* Adjust size of the button icon */
    height: 85px;
}

.more-details-button:hover {
    transform: scale(1.1);
}

.more-details-button span {
    font-size: 1.3rem; /* Adjust font size for the 'More Details' text */
    line-height: 15px;
}

.locations-container {
    text-align: center;
    color: var(--color-dark-green);
    max-width: 1000px;
    width: 100%;
    max-width: 1200px; /* Set this to the same max-width as your main container */
    margin: 0 auto; /* Center the container */
    padding: 0 20px; /* Add padding for small screens */
}
/* Menus Section Styling */
.menus-section {
    width: 100%;
    background-color: var(--color-dark-green);
    text-align: center;
    padding: 20px;
	background: url('/files/menus_bkgrd.svg') center center/cover;
color: var(--color-cream);
    display: flex;
    flex-direction: column;
    justify-content: center; /* Center vertically */
}

.menus-section h2 {
    font-family: 'Sugar Pie W00 Regular', sans-serif;
        font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    margin-bottom: 20px;
}

.menus-nav {
font-family: "brandon-grotesque", sans-serif;
font-weight: 900;
font-style: normal;
    letter-spacing: 0.2rem;

font-size: 2rem; /* Increase the size for the location nav */
    color: var(--color-red);
    margin-bottom: 50px;
    text-transform: uppercase;
}
.menus-nav span {
    padding: 0 25px; /* Increase padding between locations */
}

.menus-buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px; /* Increased the gap between all buttons by 50% */
}

.menus-buttons-row1,
.menus-buttons-row2 {
    display: flex;
    justify-content: center;
    gap: 30px; /* Increased gap between buttons by 50% */
}

.menu-btn {
    background-color: var(--color-cream);
    color: var(--color-dark-green);
    padding: 18px 15px;
    border-radius: 50px;
    font-size: 1.5rem;
    letter-spacing: .1rem;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
    width: 240px; /* Same width for all buttons */
    height: 70px; /* Set a fixed height for all buttons */
    z-index: 1;
}

.loc-btn {
    background-color: var(--color-cream);
    color: var(--color-dark-green);
    padding: 12px 5px;
    border-radius: 50px;
    font-size: 1.3rem;
    letter-spacing: .1rem;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
    width: 240px;
    height: 51px;
}
.loc-btn:hover {
    background-color: var(--color-red);
    color: var(--color-cream);
}
.loc-btn-red {
    background-color: var(--color-red);
    color: var(--color-cream);
    padding: 12px 5px;
    border-radius: 50px;
    font-size: 1.3rem;
    letter-spacing: .1rem;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
    width: 240px;
    height: 51px;
}
.loc-btn-red:hover {
    background-color: var(--color-dark-green);
    color: var(--color-cream);
}
.twoforty {
width: 240px;
}
.twofifty {
width: 250px;
}

.loc-btn-green {
    background-color: var(--color-dark-green);
    color: var(--color-cream);
    padding: 13px 35px;
    border-radius: 50px;
    font-size: 1.3rem;
    letter-spacing: .1rem;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
    width: 240px;
    height: 51px;
}
.loc-btn-green:hover {
    background-color: var(--color-red);
    color: var(--color-cream);
}


.menu-btn:hover {
    background-color: var(--color-red);
    color: var(--color-cream);
}

.menu-btn hr {
    border: none;
    border-top: 2px solid var(--color-dark-green);
    margin: 0 auto;
    width: 22px;
    color: var(--color-dark-green);
    margin-bottom: -5px;
}

/* Adjust location text size */
.location-text {
    font-size: 0.75rem; /* Smaller text for location */
    font-weight: bold; /* Make the location names bold */
    display: block; /* Ensure Cherry Creek stays on one line */
    margin-top: -5px;
    font-weight: 800;

    white-space: nowrap;

}

.beer-text {
    font-size: 1.6rem; /* Larger and bold text for Beer */
    font-weight: bold;
    margin-top: -9px;
}
.menu-text {
    font-size: 1.6rem; /* Larger and bold text for Beer */
    font-weight: bold;
    }


/* Kids Menu Styling */
.kids-menu {
    background: url('/files/button_kids_menu.svg') center center/contain no-repeat;
    width: 360px;
    height: 110px;
    margin-top: 30px;
    cursor: pointer;
    transition: transform 0.3s ease-in-out;
    display: block; /* Ensure it's a block-level element */
    margin-left: auto;
    margin-right: auto; /* Center the kids menu button */
}

.kids-menu:hover {
    background: url('/files/button_kids_menu_rollover.svg') center center/contain no-repeat;
    transform: scale(1.1); /* Scaling effect on hover */
}


.igrow {
padding-bottom: 40px;
}


/* Waitlist Section Full Height and Width */
/* Waitlist Section Full Height and Width */
.waitlist-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    background-color: #c7d1d3; /* Background color matching the image */
    padding: 40px 0; /* Increase padding at the top and bottom */
}

/* Header for the section */
.waitlist-header {
    font-family: 'Sugar Pie W00 Regular';
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-red);
    
    text-align: center;
}

/* Container for the 3 images and buttons */
.waitlist-images {
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    text-align: center;
}

.waitlist-container {
    display: flex;
    align-items: center;
    justify-content: center;
    height: auto;
    position: relative;
    margin-bottom: 20px; /* Adds 20px of space between containers */
}

.waitlist-image {
    width: 80%;
    margin: 0 auto;
    height: auto;
    object-fit: cover;
    border-radius: 40%; /* Rounded rectangle shape */
    mask-image: none; /* Masking can be added if necessary */
    -webkit-mask-image: none;
    margin-bottom: 20px; /* Adds space between image and button */
}

.waitlist-text {
font-family: "brandon-grotesque", sans-serif;
font-weight: 900;
    letter-spacing: 0.2rem;
font-style: normal;
font-size: 2rem; /* Increase the size for the location nav */    color: var(--color-dark-green);
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 40px; /* Adds more space between the headline and the location names */
        margin-top: 25px;
}
.waitlist-text2 {
font-family: "brandon-grotesque", sans-serif;
font-weight: 700;
    letter-spacing: 0.2rem;
font-style: normal;
font-size: 1.4rem; /* Increase the size for the location nav */    color: var(--color-dark-green);
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 25px; /* Adds more space between the headline and the location names */
        margin-top: 15px;
}

.waitlist-text-red {
font-family: "brandon-grotesque", sans-serif;
font-weight: 900;
    letter-spacing: 0.2rem;
font-style: normal;
font-size: 2rem; /* Increase the size for the location nav */    color: var(--color-red);
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 40px; /* Adds more space between the headline and the location names */
        margin-top: 25px;
}
.about-sub-text {
font-family: "brandon-grotesque", sans-serif;
font-weight: 900;
color: var(--color-red) !important;
    letter-spacing: 0.2rem;
font-style: normal;
font-size: 2rem; /* Increase the size for the location nav */    color: var(--color-dark-green);
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 40px; /* Adds more space between the headline and the location names */
        margin-top: 25px;
}
.beer-subhead {
font-family: "brandon-grotesque", sans-serif;
font-weight: 900;
    letter-spacing: 0.2rem;
font-style: normal;
color: var(--color-red) !important;
font-size: 2rem; /* Increase the size for the location nav */    color: var(--color-dark-green);
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 40px; /* Adds more space between the headline and the location names */
        margin-top: 25px;
}

.waitlist-button {
    background: url('/files/button_triangle_green.svg') no-repeat center center;
    background-size: contain;
    width: 100%; /* Adjust width to fit the image */
    height: 75px; /* Adjust height to fit the image */
    border: none;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px; /* Adds space between button and image */
    color: var(--color-cream); /* Text color */
    font-family: 'cardenio_modernbold', sans-serif; /* Use the imported font */
    font-size: 1.3rem; /* Adjust font size */
    text-transform: uppercase; /* Ensure text is uppercase */
    letter-spacing: 0.05rem; /* Adjust letter spacing */
    text-align: center;
    padding-top: 5px;
    transition: transform 0.3s ease-in-out;
}
.waitlist-button a {text-decoration: none;}
.waitlist-button:hover {
    transform: scale(1.1);
    background: url('/files/button_triangle_red.svg') no-repeat center center;
}



    .info-box a {
    color: var(--color-cream); /* Set the color to --color-cream */
    text-decoration: none; /* Remove underline */
    text-transform: uppercase; /* Make text uppercase */
}

.info-box a:hover {
    text-decoration: underline; /* Optional: Add underline on hover if desired */
}

/* More Details Button Styling */
.more-details-button {
    background: url('/files/button_triangle_red.svg') no-repeat center center;
    background-size: contain;
    width: 100%; /* Adjust width to fit the image */
    height: 75px; /* Adjust height to fit the image */
    border: none;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
    color: var(--color-cream); /* Text color */
    font-family: 'cardenio_modernbold', sans-serif; /* Use the imported font */
    font-size: 1.3rem; /* Adjust font size */
    text-transform: uppercase; /* Ensure text is uppercase */
    letter-spacing: 0.1rem; /* Adjust letter spacing */
    text-align: center;
    padding: 0;
    transition: transform 0.3s ease-in-out;
}
.happenings {
max-width: 50%;
padding-top: 80px;
padding-bottom: 30px;
}
.more-details-button:hover {
    background: url('/files/button_triangle_green.svg') no-repeat center center;
    transform: scale(1.1);
    color: var(--color-cream); /* Hover color */
}
     /* Footer Section */
   /* Footer Section */
.footer-section {
    width: 100%;
    background-color: var(--color-dark-green);
    padding: 40px;
    color: var(--color-cream);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative; /* Changed from absolute to relative */
}

.footer-container {
    max-width: 1200px; /* Set this to the same max-width as your main container */
    margin: 0 auto; /* Center the container */
    padding: 0 20px; /* Add padding for small screens */
    position: relative; /* Ensure child elements are positioned relative to this */
}

.footer-header {
    font-family: 'Sugar Pie W00 Regular', sans-serif;
        font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    text-align: left;
    margin-bottom: 50px;
    width: 100%;
}

/* Social Media Icons */
.footer-social-icons {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    margin-top: 70px;
    right: 10px;
    position: absolute;
}

.footer-social-icons img {
    width: 30px;
    margin: 0 10px;
    cursor: pointer;
    transition: transform 0.3s ease-in-out;
}

.footer-social-icons img:hover {
    transform: scale(1.1);
}

.footer-social-icons2 {
    display: flex ;
    justify-content: center;
    width: 100%;
    
}

.footer-social-icons2 img {
    width: 30px;
    margin: 0 auto;
    cursor: pointer;
    transition: transform 0.3s ease-in-out;
}

.footer-social-icons2 img:hover {
    transform: scale(1.1);
}

/* Footer images */
.footer-images {
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    margin-bottom: 40px;
}

.igimage {
    border-radius: 15px;
    margin-right: 15px;
    object-fit: cover;
width: 100%;
  aspect-ratio: 1;


}
.footer-images img {
    width: 19.5%;
    height: 20%;
    border-radius: 15px;
    margin-right: 15px;
    object-fit: cover;
}

/* Locations */
.footer-locations {
    display: flex;
    justify-content: space-around;
    width: 100%;
}

.footer-location {
    text-align: center;
    text-transform: uppercase;
    font-family: "brandon-grotesque", sans-serif;
    font-weight: 600;
    font-style: normal;
    color: var(--color-cream);
}

.footer-location h3 {
    font-size: 1.8rem;
    margin-bottom: 10px;
}

.footer-location p {
    font-size: 1.3rem;
    margin: 5px 0;
}

.footer-location-phone {
    font-size: 1.3rem;
    font-weight: bold;
}

/* "More Details" button */
.footer-more-details-button {
    background: url('/files/button_triangle_red.svg') no-repeat center center;
    background-size: contain;
    width: 100%;
    height: 85px;
    border: none;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
    font-family: 'cardenio_modernbold', sans-serif;
    font-size: 1.3rem;
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: 0.05rem;
    text-align: center;
    color: var(--color-cream);
    transition: transform 0.3s ease-in-out;
    flex-direction: column;
}

.footer-more-details-button:hover {
    transform: scale(1.1);
    background: url('/files/button_triangle_cream.svg') no-repeat center center;
    color: var(--color-red);
}

/* Footer Logo */
.footer-logo {
    position: relative; /* Changed to relative so it's positioned within the footer */
    align-self: flex-start; /* Move it to the left inside the footer container */
    margin-top: auto;
}

.footer-logo img {
    width: 275px;
    height: auto;
}

#waitlist {  scroll-behavior: smooth;
}
/* Order Online Section Styles */
.order-online-section {
    background-color: var(--color-red); /* Background color similar to the provided design */
    background-image: url('/files/background_burger_flags.svg'); /* Add the background pattern */
    background-position: center;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.order-online-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto;
}

.order-online-content {
    text-align: center;
    color: var(--color-cream);
}

.order-online-title {
    font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    margin-bottom: 10px;
    color: var(--color-cream);
}

.order-online-subtitle {
    font-family: "brandon-grotesque", sans-serif;
    font-size: var(--subhead-font-size);
    font-weight: 900;
    letter-spacing: 2.5px; 
    color: var(--color-dark-green);
    margin-bottom: 40px;
}

.order-online-buttons {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.order-button {
    background-color: var(--color-cream);
    color: var(--color-dark-green);
    padding: 15px 30px;
    border-radius: 50px;
    font-size: 1.6rem;
    width: 55%;
    margin: 0 auto;
        letter-spacing: 2.5px;

    text-transform: uppercase;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
    border: none;
}

.order-button:hover {
    background-color: var(--color-dark-green);
    color: var(--color-cream);
}

.order-online-image-container {
    flex-shrink: 0;
}

.order-online-image {
    max-width: 450px;
    border-radius: 35%;
    
    width: 100%; /* Adjust as needed */
}

.location-image {
    max-width: 450px;
    border-radius: 25%;
    width: 100%;
}
/* Burger of the Month Section */
.burgermonth-section {
    background-color: var(--color-cream); /* Match the site's cream color */
    background-image: url('/files/background_burger_of_the_month.svg'); /* Background stars pattern */
    background-position: center;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;    
}

.burgermonth-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 80%;
    max-width: 1200px;
    margin: 0 auto;
}

.burgermonth-image-container {
    flex-shrink: 0;
}

.burgermonth-image {
    max-width: 450px;
    border-radius: 35%; /* Slightly rounded image */
    width: 100%;
}

.burgermonth-content {
    text-align: left;
    color: var(--color-dark-green); /* Use dark green for text */
    padding-left: 30px;
}

.burgermonth-month {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.5rem;
    color: var(--color-dark-green);
    margin-bottom: 10px;
    text-transform: uppercase;
}

.burgermonth-title {
    font-family: "brandon-grotesque", sans-serif;
        font-size: var(--subhead-font-size);
    color: var(--color-dark-green);
    margin-bottom: 10px;
    letter-spacing: 2.5px; 
    font-weight: 900;
}
.gd-title {
    font-family: "brandon-grotesque", sans-serif;
        font-size: var(--subhead-font-size);
    color: var(--color-red);
    margin-bottom: 10px;
    letter-spacing: 2.5px;
    font-weight: 900;
}
.gd-title-alt {
    font-family: "brandon-grotesque", sans-serif;
        font-size: var(--subhead-font-size);
    color: var(--color-dark-green);
    margin-bottom: 10px;
    letter-spacing: 2.5px;
    font-weight: 900;
}
.burgermonth-name {
        font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-red);
    margin-bottom: 20px;
    
}

.burgermonth-description {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.3rem;
    color: var(--color-dark-green);
    margin-bottom: 30px;
        font-weight: 500;

}

.burgermonth-button {
    background-color: var(--color-dark-green);
    color: var(--color-cream);
    padding: 15px 30px;
    border-radius: 50px;
    font-size: 1.6rem;
        letter-spacing: 2.5px;

    text-transform: uppercase;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
    border: none;
}

.burgermonth-button:hover {
    background-color: var(--color-red);
    color: var(--color-cream);
}
/* Promo1 Section Styles */
.promo1-section {
    background-color: var(--color-blue); /* Match the background color from the design */
    background-image: url('/files/background_patio.svg'); /* Background image */
    background-position: center;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.promo4-section {
    background-color: var(--color-cream); /* Match the background color from the design */
    background-image: url('/files/background_watch_party_cream.svg'); /* Background image */
    background-position: center;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.promo4-section-alt {
    background-color: var(--color-red);
    background-image: url(/files/background_watch_party_red.svg);
   background-position: center;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.promo4-section-alt3 {
    background-color: var(--color-dark-green);
    background-image: url(/files/background_watch_party_green.svg);
   background-position: center;
    background-size: cover;
     display: flex;
     justify-content: center;
    align-items: center;
    position: relative;

}
.promo4-section-alt5 {
    background-color: var(--color-dark-green);
    background-image: url(/files/background_watch_party_green.svg);
   background-position: center;
    background-size: cover;
     display: flex;
     justify-content: center;
    align-items: center;
    position: relative;

}

.promo4-section-alt4 {
    background-color: var(--color-red); /* Match the background color from the design */
    background-image: url('/files/background_burger_battle.svg'); /* Background image */

background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.promo4-section-alt2 {
    background-color: var(--color-red); /* Match the background color from the design */
    background-image: url('/files/background_weekly_events.svg'); /* Background image */
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.promo4-section-alt3 {
    background-color: var(--color-dark-green); /* Match the background color from the design */
    background-image: url('/files/background_trivia.svg'); /* Background image */
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.promo4-section-alt5 {
    background-color: var(--color-dark-green); /* Match the background color from the design */
    background-image: url('/files/background_watch_party_green.svg'); /* Background image */
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.promo4-section-alt6 {
    background-color: var(--color-dark-green); /* Match the background color from the design */
    background-image: url('/files/downtown_gameday_brews_bkgrd.svg'); /* Background image */
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    color: white; 
}
.brews-img {
max-width: 100%;
}
.brews-huge {

     font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: 16rem;
       
    
    margin-bottom: 20px; /* Adjust spacing below the title */
}
.brews-text {

font-size: 4.5rem;
line-height: 4.5rem;
font-weight: 600;
}

.promo5-section {
    background-color: var(--color-blue); /* Match the background color from the design */
    background-image: url('/files/background_happy_hour.svg'); /* Background image */
    background-position: center;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.promo1-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 80%;
    max-width: 1200px;
    margin: 0 auto;
}
.promo5-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 80%;
    height: 100vh;
    max-width: 1200px;
    margin: 0 auto;
}
.promo4-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
        height: 100vh;

    width: 80%;
    max-width: 1200px;
    margin: 0 auto;
}


.promo1-content {
    text-align: left;
    color: var(--color-dark-green); /* Dark green text */
    padding-right: 30px;
}

.promo1-header {
    font-family: "brandon-grotesque", sans-serif;
    font-size: var(--subhead-font-size);
    color: var(--color-dark-green);
    text-transform: uppercase;
    margin-bottom: 10px;
    font-weight: 600;
}

.promo1-title {
    font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-red); /* Red title */
    margin-bottom: 10px;
}

.promogd-title {
    font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-dark-green);
    margin-bottom: 10px;
}
.promogd-title-alt {
    font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-cream);
    margin-bottom: 10px;
}

.promo1-description {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.3rem;
    color: var(--color-dark-green);
    margin-bottom: 20px;
    font-weight: 500;
    padding-top: 15px;
}

.promo1-features {
    list-style-type: none;
    padding: 0;
    padding-top: 40px;
        padding-bottom: 20px;
    margin-bottom: 30px;
    font-size: 1.3rem;
    font-weight: 500;

    
}

.promo1-features li {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.6rem;
    color: var(--color-dark-green);
    font-weight: 800;
}
.promo1-title-alt {
    font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-dark-green); /* Red title */
    margin-bottom: 10px;
}



.promo1-description-alt {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.3rem;
    color: var(--color-cream);
    margin-bottom: 20px;
    font-weight: 500;
    padding-top: 15px;
}

.promo1-features-alt {
    list-style-type: none;
    padding: 0;
letter-spacing: 2.5px;
    margin-bottom: 30px;
    font-weight: 800;
    
}

.promo1-features-alt2 {
    list-style-type: none;
    padding: 0;
    margin-bottom: 30px;
       padding-top: 40px;
        padding-bottom: 20px;
    margin-bottom: 30px;
    color: var(--color-cream);
    font-size: 1.3rem;
    font-weight: 500;
    
}

.promo1-features-alt li {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.6rem;
    color: var(--color-cream);
    font-weight: 800;
}




.highlight-text {
    color: var(--color-red); /* Red highlight */
}

.promo1-button {
    background-color: var(--color-dark-green);
    color: var(--color-cream);
    padding: 15px 30px;
    border-radius: 50px;
    font-size: 1.6rem;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
    border: none;
}

.promo1-button:hover {
    background-color: var(--color-red);
    color: var(--color-cream);
}

.promo1-image-container {
    flex-shrink: 0;
}

.promo1-image {
 max-width: 450px;
    border-radius: 35%;
    padding-top: 20px;
    padding-bottom: 20px;
    width: 100%; /* Adjust as needed */
}
/* Promo2 Section Styles */
.promo2-section {
        background-color: var(--color-dark-green); /* Dark green background */
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.promo2-section-cheese {
background-image: 
        background-color: var(--color-dark-green); /* Dark green background */
         background-image: url('/files/big_cheese_bkgrd.jpg'); /* Background pattern */
    background-position: center;
    background-size: cover;
    
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

big_cheese_bkgrd.jpg

.promo2-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.promo2-content {
    text-align: left;
    color: var(--color-cream); /* Cream color for text */
        font-size: 1.3rem;
    font-weight: 500;
}
    width: 60%;
}

.promo2-header {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.5rem;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.promo2-title {
    font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: 4rem;
    line-height: 3.8rem;
    color: white;
    margin-bottom: 30px;
}

.promo2-description {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.3rem;
    margin-bottom: 20px;
    color: white;
}

.promo2-event-details {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.6rem;
    font-weight: bold;
    color: var(--color-cream);
}

.promo2-partner {
    margin-bottom: 15px;
    font-size: 1rem;
}

.promo2-partner img {
    max-width: 200px;
}

.promo2-button {
    background-color: var(--color-red);
    color: var(--color-cream);
    padding: 15px 30px;
    border-radius: 50px;
    font-size: 1.6rem;
    text-transform: uppercase;
    font-weight: 600;
letter-spacing: 2.5px;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
    border: none;
}

.promo2-button:hover {
    background-color: var(--color-cream);
    color: var(--color-red);
}

.promo2-button-grn {
    background-color: var(--color-dark-green);
    color: var(--color-cream);
    padding: 15px 30px;
    border-radius: 50px;
    font-size: 1.6rem;
letter-spacing: 2.5px;
    text-transform: uppercase;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
    border: none;
}

.promo2-button-grn:hover {
    background-color: var(--color-cream);
    color: var(--color-red);
}

.promo2-image-container {
    width: 40%;
}

.promo2-image {
    max-width: 100%;
    border-radius: 15px;
    width: 100%;
}


.promo-button {
       background: url('/files/button_triangle_red.svg') no-repeat center center;
    background-size: contain;
    width: 30%;
    height: 75px;
    line-height: 1.1;
    border: none;
    cursor: pointer;
    margin-top: 15px;
    font-family: 'cardenio_modernbold', sans-serif;
    font-size: 1.3rem;
    text-transform: uppercase;
    letter-spacing: 0.05rem !important;
    text-align: center;
    color: var(--color-cream);
    transition: transform 0.3s ease-in-out;
    flex-direction: column;
}

.promo-button img {
    width: 100%; /* Adjust size of the button icon */
    height: 85px;
}

.promo-button:hover {
    transform: scale(1.1);
}

.promo-button span {
    font-size: 1.3rem; /* Adjust font size for the 'More Details' text */
    line-height: 15px;
}




/* News Section Styling */
.news-section {
    background-color: #a3a837; /* Background color similar to the provided design */
    background-image: url('/files/background_news.svg'); /* Background pattern */
    background-position: center;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.news-container {
    text-align: center;
    margin: 0 auto;
}

.news-header {
    margin-bottom: 40px;
}

.news-title {
    font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    color: var(--color-cream);
}

.news-subtitle {
    font-family: "brandon-grotesque", sans-serif;
    font-size: var(--subhead-font-size);
    font-weight: 900;
    letter-spacing: 2px;
    color: var(--color-dark-green);
    margin-top: 10px;
    text-transform: uppercase; 
    margin-bottom: 0px;
}

.news-content {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    margin-top: 0px;
}

.news-item {
    
            background: url('/files/frame.svg') no-repeat center center;
        background-size: contain;
    max-height: 250px;
    display: flex;
    min-height: 230px;
    max-width: 384px;
    margin: 0 auto;
    min-width: 350px;
    flex-direction: column;
    justify-content: space-between;

}

.news-frame {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    
}

.news-item-content {
    padding: 15px 20px;
    text-align: left;
    
        min-height: 250px;
            display: flex;
    flex-direction: column;
      justify-content: space-between;


}

.news-item h3 {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.5rem;
    font-weight: 900;
    margin-bottom: 15px;
    color: var(--color-dark-green);
    text-transform: uppercase;
}

.news-description {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.3rem;
    margin-bottom: 15px;
}
.news-description2 {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.3rem;
    margin-bottom: 15px;
    color: var(--color-cream);
}
news-item-title2 {
    
    color: var(--color-cream);
}



.news-date {
    font-family: "brandon-grotesque", sans-serif;
    font-size: .7rem;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--color-cream);
    margin-bottom: 10px;    margin-top: 10px;

}

.news-link {
    font-family: "brandon-grotesque", sans-serif;
    font-size: 1.1rem;
    color: var(--color-cream);
    text-transform: uppercase;
    text-decoration: none;
    font-weight: 900;
    letter-spacing: 1px;
    position: relative;
}

.news-link:hover {
    color: var(--color-red);
    text-decoration: none;
}

/* Arrows Styling */
.news-arrows {
    margin-top: 30px;
    display: flex;
    justify-content: center;
    gap: 50px;
}
.news-arrows2 {
    margin-top: 5px;
    margin-bottom: 15px;
    display: flex;
    justify-content: center;
    gap: 50px;
}
.news-arrow-left, .news-arrow-right {
    width: 50px;
    cursor: pointer;
    transition: transform 0.3s ease, filter 0.3s ease;
}

.news-arrow-left:hover, .news-arrow-right:hover {
    transform: scale(1.1);
}

.news-arrow-left:hover {
    content: url('/files/button_arrow_left_green.svg'); /* Hover for left arrow */
}

.news-arrow-right:hover {
    content: url('/files/button_arrow_right_green.svg'); /* Hover for right arrow */
}
.newsletter-section {
    background-color: var(--color-red); 
    background-image: url('/files/background_burger_flags.svg'); 
    background-position: center;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.newsletter-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 80%;
    max-width: 1200px;
    margin: 0 auto;
}

.newsletter-content {
    color: var(--color-cream);
    text-align: left;

}

.newsletter-title {
    font-family: 'brandon-grotesque', sans-serif;
    font-size: 1.5rem;
    font-weight: 900;
    color: var(--color-dark-green);
    text-transform: uppercase;
    margin-bottom: 10px;
}

.newsletter-signup {
    font-family: 'Sugar Pie W00 Regular', sans-serif;
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    margin-bottom: 20px;
    color: var(--color-cream);
}

.newsletter-text {
    font-family: 'brandon-grotesque', sans-serif;
    font-size: 1.5rem;
    margin-bottom: 40px;
    font-weight: 400;
    color: var(--color-dark-green);
}

.newsletter-form {
    display: flex;
    flex-direction: column;
}

.form-row {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

.newsletter-input {
    flex: 1;
    padding: 15px;
        width: 100%;

    border: none;
    background-color: var(--color-cream);
    font-family: 'brandon-grotesque', sans-serif;
    font-size: 1.3rem;
    border-radius: 50px; /* Rounded input fields */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* Optional shadow effect */
}

/* Triangular button for Sign Up Now */
.newsletter-triangle-button {
    background: url('/files/button_triangle_green.svg') center center no-repeat;
    background-size: contain;
    width: 160px;
    height: 85px;
    border: none;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--color-cream);
    font-family: 'cardenio_modernbold', sans-serif;
    font-size: 1.3rem;
        padding-top: .5rem;
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: 0.1rem;
    text-align: center;
    transition: transform 0.3s ease-in-out;
}

.newsletter-triangle-button:hover {
    transform: scale(1.1);
    color: var(--color-dark-green);
    background: url('/files/button_triangle_cream.svg') center center no-repeat;
}

.newsletter-thankyou {
    margin-top: 20px;
    font-family: 'brandon-grotesque', sans-serif;
    font-size: 1.5rem;
    color: var(--color-cream);
    font-weight: 900;
}

.newsletter-image-container {
    flex-shrink: 0;
}

.newsletter-image {
    max-width: 450px;
    border-radius: 35%;
    width: 100%;
}
.orderbutton {
padding-left: 30px;

}

.hidden {display: none;}
.center {text-align: center; margin: 0 auto;}
@media (max-width: 1499px) {  
.nav-menu {margin-left: 0px;}

}

@media (max-width: 1199px) {  

    body, html {
        
    	scroll-snap-type: none ; /* Enable vertical scroll snapping */
  		
    }
    .locations-section, .menus-section, .order-online-section, .waitlist-section, .promo1-section, .promo2-section, .news-section, .promos-section, .newsletter-section, .burgermonth-section, .footer-section, .info-section, .promo4-section-alt4, .promo5-content, .promo5-container, .promo4-section, .promo5-section, .promo4-section-alt5, .promo2-section-cheese, .promo4-section-alt3, .promo4-section-alt6, .promo4-section-alt, .promo-1 {
    scroll-snap-align: none;
    height: 100%;
    padding-top: 45px;
    padding-bottom: 45px;
}
.twoforty {
    width: 100%;
}
.promo7-container {
        height: 60vh !important;
    }
.twofifty {
    width: 100%;
}
.about-sub-text {
    font-family: "brandon-grotesque", sans-serif;
    font-weight: 900;
    color: var(--color-red) !important;
    letter-spacing: 0.2rem;
    font-style: normal;
    font-size: 1.3rem;
    color: var(--color-dark-green);
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 40px;
    margin-top: 25px;
}
.aboutsquiggle {
    margin: 0 auto;
    max-width: 80%;
    padding-bottom: 25px;
}
.btn-waitlist {
display: none;
}    	
.putt-date {
font-size: 1.3rem;
}
.orderbutton {
display: none;
}    	
.loc-btn-red {
margin: 0 auto;
margin-top: 1rem;
margin-bottom: 1rem;
}
.loc-btn {
    background-color: var(--color-cream);
    color: var(--color-dark-green);
    padding: 12px 5px;
    border-radius: 50px;
    font-size: 1.3rem;
    letter-spacing: .1rem;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
    width: 240px;
    height: 51px;
    margin: 0 auto;
    margin-top: 1rem;
    margin-bottom: 1rem;
    }
    .nav-menu {
    margin-left: 0px;
    }
    .mobilespacer {
    min-height: 55vh;
    }
        .hero-section {
        background: url('/files/header_mobile.jpg') center center/cover no-repeat;
        
    }
    .logo {
    width: 100%;
    }

    .green-bar p {
            animation: scrollText 8s linear infinite;

    }
    .mobilecenter {
    margin: 0 auto;
    }
    .menu-btn {
    margin: 0 auto;
    }
    .location-item {
    margin-bottom: 60px;
    }
    .waitlist-image {
    display: none;
    }
    .waitlist-text { font-size: 1.3rem;
    
    }
        .waitlist-button {
        margin-bottom: 30px;
        margin-top: -20px;
    
}
    .order-online-image {
    display: none;
    }
    .order-button {
    	padding: 15px 15px;
        width: 80%;

    }
    .location-nav, .menus-nav {
        padding: 0px 0px;
    font-size: 1.3rem;
    letter-spacing: .1rem;
    }
        .location-nav span, .menus-nav span {
        padding: 0px 0px;
    
    }
    .promo2-image {
    width: 80%;
    margin: 0 auto;
    text-align: center;
}
.info-box {
     padding: 50px 25px;
             min-height: 250px;

 }
 
 .promo4-container {
        height: 100%;

    
}
.burgermonth-content {padding-top: 30px;}
.burgermonth-title {padding-top: 30px;}
.promo2-description {padding-top: 30px;}
.promo-button {width: 40%;}
.promo2-container {width: 80%;}
.footer-bar {padding-bottom: 40px;}
.footer-social-icons {margin-top: -30px;}
.promo1-section {    background-image: none;}
.burgermonth-section {    background-image: none;}
.news-section {    background-image: none;}
.privacy-section {    padding-bottom: 30vh; }
.terms-section {    padding-bottom: 30vh; }
.footer-header { text-align: center;}
.promo2-button {font-size: 1.1rem;         padding: 15px 28px;}
.promo1-button {font-size: 1.1rem;         padding: 15px 28px;}
.burgermonth-button {font-size: 1.1rem;         padding: 15px 28px;}
.order-button {font-size: 1.1rem;         padding: 15px 28px;}
.promo2-button-grn  {font-size: 1.1rem;         padding: 15px 28px;}
}



       @media (max-width: 991.98px) {  
        --title-font-size: 4rem;
        --title-line-height: 3.9rem;
        }