div {
float: left;
clear: both;
}

.container {
width: 70%;
margin-left: 15%;
/*padding: 30px;*/
height: 1600px;
background:#99ccff;
}

.headbox {
font-size: 29pt;
font-family: Comic Sans MS;
padding: 1%;
margin-left: 25%;
margin-right: 25%;
}


.headerofmenu {
width: 80%;
margin-left: 10%;
background: yellow;
}

.textcontent {
width: 70%;

/* our padding and margin are total 30 */
padding: 5%;
margin-left: 10%;
/* any time we add padding or margin, we must consider there is both left and right */

padding-top: 100px;
background: pink;
font-size: 20pt;
}


.menubox {
width: 20%;
margin: 5px;
padding: 10px;
background-color: #32CD32;
height: 50px;
color: white;
font-size: 15pt;
border-radius: 5px;
text-align: center;
float: left;
clear: none;
/* we learned the menus will now allow another menu to the left and right */
}


img {
width: 80%;
margin-left: 10%;
margin-right: 10%;
clear: both;
float: left;
padding: 20px;
}