div{
	float:left;
}

img, p {
float: left;
width: 70%;
margin-left: 15%;
clear: both;
margin-bottom: 2%;
/* these rules cause both paragraphs and pictures to behave*/
/* they will center with 15% margins on both sides */
}


#container {
background-color: darkgray;
/*height:400px;*/
/* turn off the height and then... parent always grows to fit child objects */
width: 80%;
margin-bottom: 40px;
margin-left: 10%;
clear:both;
}

.headerofmenus{
/*height:80px;*/
width:90%;
margin-left:5%;
background-color: gray;
}

.menu {
margin-top: 4px;
height: 50px;
width: 11%;
margin-left: 3%;
background-color: gray;
font-family: 'Indie Flower', cursive;

/* we wish to have words centered in the div , center vert, and center horizontal */
text-align: center;
padding-top: 4px;
}


.divwithcontent {
margin-top: 10px;
background-color: lightgray;
padding:10%;
width:60%;
margin-left:10%;
/*height: 600px;*/
/* parent should be elastic to fit all the child objects*/
margin top:10px;
clear:both;

}
body {
	background-color:black;
}