div { 
	float: left;
	clear: both;
	text-align:center ;
}

#container{
	background-color: grey;
	/*height: 1800px;*/
	margin-bottom: 40px;
	width: 80%;
	margin-left: 10%;
}

.headerofmenus {
	width: 8vw;
	margin-top: 10px;
	margin-left: 2%;
	background-color: black;
	/*height: 300px;*/
	flout:left;
	clear: none;	


}

.textcontent {
	background-color: darkgrey;
	clear: none;	
	/*if I add padding I must  reduce the width, can't exceed 100%*/
	width: 80%;
	margin-left: 5%;
	/*height: 300px;*/
	margin-top: 10px;
	margin-bottom: 2%;
	padding-left: 1%;
	padding-right: 1%;
}

.submenu {
	width: 80%;
	margin-top: 5px;
	margin-left: 5%;
	margin-bottom: 5%;
	background-color: white;
	/*height: 20%;*/
	clear: none;
	float: none;
	border-style: dotted;
	/*the up part is from the box and the bottom is from the text*/
	color: black;
	font-family: "Parisienne", cursive;
	font-weight: 400;
	font-style: normal;
	font-size: 14pt;
	text-align: center;

}

#container {	
	font-size: 45pt;
	
}



/*font for page 4 and 2*/
.google-sans-flex {
  font-family: "Google Sans Flex", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "wdth" 100,
    "GRAD" 0,
    "ROND" 0;
  font-size: 25pt;

}

img {
	float:left;
	width:50%;
	margin-right:25%;
	margin-left:25%;
	margin-bottom:3%;
	margin-top:2%;
}