
/*=========================================================STYLES=========================================================*/

body {
	background-repeat:no-repeat; 
	background-size: cover;
	background-color:darkblue;
	font-family: verdana;
}
/*gives the body a background color*/

div {
	border: 2px solid black;
	border-radius: 20px;
	color: black;
	background: white;
}
/*gives all divs a small curved black border*/


h1 {
	text-align: center;
}
/*centers all of the h1s*/


#bigheader {
	width:50%;
	margin: 5% 25% 0% 25%;
	background:lightblue;
}
/*makes the large overarching header div 50% width and placed in the middle of the page*/


#container {
	width:90%;
	height:1000px;
	margin:5% 5% 5% 5%;
	background:lightgrey;
}
/*makes the div containing the information very big so that it can fit everything*/


#navbar {
	clear:none;
	float: left;
	width: 10%;
	margin: 3% 0% 3% 3%;
	height: 94%;
	background-repeat:no-repeat; 
	background-size: cover;
	background-image: url("coolimage.jpg");
}
/*makes the navigation bar tall and skinny in the left side of the container*/


.menuitem {
	float:left;
	clear:both;
	width: 90%;
	height:13%;
	margin:20% 5% 20% 5%;
	transform: scale(1.1); 
	transition: all .2s ease-in-out;
	background:lightblue;
}
/*applies to all of the clickable divs inside the nav bar. Makes them fit evenly inside the bar*/

.menuitem:hover {
	background:red;
	transform: scale(1.1); 
	transition: all .2s ease-in-out;
}
/*makes menu items highlight red when hovered over with the mouse*/

#subheader {
	float:left;
	margin: 3% 3% 0% 6%;
	width: 72%;
	height: 15%;
	text-align: center;
	background:lightblue;
}
/*the div that contains each pages title*/


.textarea {
	float:left;
	margin:3% 6% 3% 6%;
	width: 72%;
	height: 76%;
	font-size: 16px;
	padding-left:10px;
	background:lightblue;
}
/*the div where all of the information appears on each page of the site*/


.menutext {
	text-align: center;
}
/*makes it so that the text inside of each menu div is aligned in the center of the div*/

.emphasize {
	font-style: bold;
	font-size: 25px
}
/*emphasizes certain words, makes them bold*/

.textareaimg {
	height:200px;
}
/*makes any images in the textarea a certain size */

