div {
	float: left;
	clear: both;
}


/* this is how you center images  */
img {
	float: left;
	clear: both;
	width: 80%;
	margin-left: 10%;
	margin-right: 10%;
}

a {
	color: white;
	background-color: transparent;
	text-decoration: none;
}

#container {
	background-color: lightblue;
	/*height: 1800px;*/
	margin-bottom: 40px;
	width: 80%;
	margin-left: 10%;
	min-height: 90vh;

	/* stop using margin auto, does not work with float*/
	/*float is needed to make website more freindly*/
}

.sidebarofmenus {
	width: 8%;
	margin-top: 10px;
	margin-left: 2%;
	background-color: darkblue;
	height: 300px;
	clear: none;
	border-radius: 5px;
}

/* add class selector for menus */
.menu 
{
	padding: 25%;
	margin-left: 15px;
}

.textarea 
{
	background-color: darkseagreen;
	clear: none;

	/*if i add padding i need to reduce the width*/	
	width: 60%;
	margin-left: 5%;
	/*height: 300px;*/
	margin-top: 10px;
	border-radius: 15px;
	padding: 5px;

}


.contentholder{
	background-color: lightseagreen;
	clear: none;

	/*if i add padding i need to reduce the width*/	
	width: 60%;
	margin-left: 5%;
	height: 300px;
	margin-top: 10px;

}