:root   {
    --item_topping_font: "Space Grotesk";
    --item_name_font: "Heebo";
    --specialty_header_font: "Londrina Solid";
    --menu_nav_font: "Space Grotesk";
    --specialty_nav_font: "Space Grotesk";
}
/* mobile settings */
@media only screen and (max-width: 480px)   {
    #specialty_navigation   { top: 73px; }
    #specialty_header,
    #salad_container,
    #cheesestyx_container,
    #dessert_container,
    #beverage_container,
    #meat_specialty,
    #veggie_specialty,
    #chicken_specialty,
    #pork_specialty,
    #shrimp_specialty,
    #cheese_specialty   { scroll-margin-top: 105px; }
}

/* desktop/tablet settings */
@media only screen and (min-width: 680px)   {
    #specialty_navigation   { top: 35px; }
    #specialty_header,
    #salad_container,
    #cheesestyx_container,
    #dessert_container,
    #beverage_container,
    #meat_specialty,
    #veggie_specialty,
    #chicken_specialty,
    #pork_specialty,
    #shrimp_specialty,
    #cheese_specialty   { scroll-margin-top: 65px; }
}

#menu_container {
    display: flex;
    flex-flow: column;
    margin: 0 auto;
    width: inherit;
}


#specialty_navigation   {
    display: flex;
    flex-flow: row;    
    width: inherit;
    position: sticky;
}

#menu_navigation    {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;   
    width: inherit;
    position: sticky;
    background-color: rgba(var(--wedge_green), 0.65);
    top: 0;
}

#soda_category  {
    
}
.specialty_nav_link {
    width: 75px;
    background-color: rgba(var(--wedge_purple), 0.9);
    width: 200px;
    padding: 5px 0px 5px 0px;
    font-family: var(--specialty_nav_font);
    font-size: 14px;
    color: #FFFFFF;
    text-decoration: none;
    text-align: center;
}
.specialty_nav_link:active, :link, :visited { 
    color:#FFFFFF; 
    text-decoration: none;
}

.menu_nav_link  {
    background-color: rgba(var(--wedge_purple), 0.9);
    padding: 5px 2px 5px 2px;
    font-family: var(--menu_nav_font);
    font-size: 18px;
    color: #FFFFFF;
    text-align: center;   
    border-color:rgba(var(--wedge_green), 1);
    border-width: 2px;
    border-style: solid;
    border-radius: 5px;
    margin: 1px;
}

.menu_category  {
    font-family: var(--specialty_header_font);
    color: var(--wedge_green);
    font-size: 24px;
    padding: 5px;
}

.specialty_category  {
    font-family: var(--specialty_header_font);
    color: var(--wedge_green);
    font-size: 28px;
    padding: 5px;
    text-align: right;
    margin: 1px;
}

.header_small_text  {
    font-family: var(--menu_body_font);
    color: var(--wedge_green);
    font-size: 14px;
}

#specialty_header, #salad_header, #cheesestyx_header, #dessert_header, #beverage_header   {
    display: flex;
    flex-flow: column;
    text-align: center;
    font-family: var(--specialty_header_font);
    color: var(--wedge_green);
    font-size: 30px;
    padding: 5px;
    scroll-margin-top: 100px;
}

#specialty_pizzas_container   {

}

.item_price {
    padding: 2px 1px 1px 5px;
    font-family: var(--item_topping_font);
    font-size: 12px;
}

.menu_item  {
    margin-bottom: 20px;
    
}

.item_name  {
    font-family: var(--item_name_font);
    color: #FFFFFF;
    font-size: 20px;
    border-radius: 5px;
    padding: 2px 2px 2px 5px;
    background-color: rgba(var(--wedge_green), 0.65);
}

.item_toppings  {
    padding: 2px 1px 1px 5px;
    font-family: var(--item_topping_font);
}

.dessert_category, .beverage_category   {
    font-family: var(--item_name_font);
    color: #FFFFFF;
    font-size: 20px;
    border-radius: 5px;
    padding: 2px 2px 2px 5px;
    margin-top: 15px;
    background-color: rgba(var(--wedge_green), 0.65);
}

.dessert_item  {
    padding: 2px 1px 1px 5px;
    font-family: var(--item_topping_font);
    font-size: 12px;
}

.dessert_name   {
    font-family: var(--item_name_font);
    color: #FFFFFF;
    font-size: 14px;
    border-radius: 5px;
    padding: 2px 2px 2px 5px;
    background-color: rgba(var(--wedge_purple), 0.65);
}

.dessert_ingredents {
    padding: 2px 1px 1px 5px;
    font-family: var(--item_topping_font);
    font-size: 12px;
}

.beverage_item  {
    display: flex;
    margin: 3px;
}

.beverage_name  {
    font-family: var(--item_name_font);
    color: #FFFFFF;
    font-size: 14px;
    border-radius: 5px;
    padding: 5px 5px 5px 5px;
    background-color: rgba(var(--wedge_purple), 0.65);
}

.beverage_category   {
    font-family: var(--item_name_font);
    color: #FFFFFF;
    font-size: 20px;
    border-radius: 5px;
    padding: px 2px 2px 5px;
    margin-bottom: 5px;
    background-color: rgba(var(--wedge_green), 0.65);
}

#soda_category, #sparkling_water_category, #water_category  {
    display: flex;
    flex-flow: row wrap;
}