/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

 .roundpeg_menu_class_title{
	width:100%;
	font-size: xx-large;
	font-weight: bold;
	text-align: center;
}

 .roundpeg_menu_section_title{
    width: 100%;
    text-align: center;
    font-weight: bold;
    font-size: 3.5rem;
 }

 .roundpeg_menu_section {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: flex-start;
 }

 .roundpeg_menu_item_container {
    width: 25%;
    max-width: 25%;
    padding: 1em;
    font-size: large;
 }
 
 .roundpeg_menu_item_img {
	width: 100%;
 }

 .roundpeg_menu_item_name{
    width: 100%;
    text-align: center;
    font-weight: bold;
    font-size: larger;
 }

/* LOW-RES DESKTOPS */
@media only screen 
  and (min-device-width: 741px) 
  and (max-device-width: 1280px) /* 1024 ? */
{
	.roundpeg_menu_item_container{
		width:33%;
		max-width:33%;
	}
}

/* NORMAL MOBILE PHONES */
@media only screen 
   and (min-device-width: 200px) 
   and (max-device-width: 740px) 
{
    .roundpeg_menu_section_title{
        font-size: 3.2rem;
     }
    .roundpeg_menu_item_container {
        width: 100%;
        max-width: 100%;
        padding: 2.0rem;
    }
    .roundpeg_menu_item_name{
        font-size: 2.8rem;
    }
    .roundpeg_menu_item_description{
        font-size: 1.3rem;
    }
}