@charset "utf-8";
/* CSS Document */
* {/*its necessary*/
	margin: 0;
	padding: 0;
}

body {/* change background color*/
	background-color: chocolate
}

header img {/*makes the image in the header fit the box and not look weird*/
	vertical-align: middle;
}

nav {/* needed for navigation to work/look nice*/
	background-color:saddlebrown;
	margin-bottom: 0px;
}

nav ul{/* needed for navigation to work/look nice*/
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
	list-style-type: none;
	border-top-style: solid;
	border-bottom-style: solid;
}

nav a  {/* needed for navigation to work/look nice*/
 	color:black;
 	background-color:sandybrown;
 	display: block;
 	padding: 5px 25px;
 	text-decoration: none;
 	border-radius: 15px;
 	margin: 10px;
 	width: 120px;
	text-align: center;
	border: 2px solid black;
	font-family: 'Gill Sans', 'Gill Sans MT', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, 'sans-serif';
 }

nav a:hover  {/* makes hovering over the links cool */
 	color:black;
 	text-decoration:underline;
 }

footer {/*makes the footer fit with the page*/
	text-align: center;
	background-color: black;
	color: aliceblue;
}

footer a {/*make footer links look nice*/
	color:azure;
	text-decoration: none;
	font-style: italic
}

footer a:hover {/*makes hovering over the footer links cool*/
	text-decoration:underline;
}

#container {/*the container that the entire website uses*/
	width:960px;
	border: 4px solid #000000;
	box-shadow: 5px 4px 8px 5px rgba(0, 0, 0, 0.5);
	background-color: sandybrown;
	margin:50px auto;
	display: block;
}

flexcontainer {/*needed to make smallcontainer work*/
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
}

smallcontainer {/*makes health page look nice*/
	width:260px;
	border: 4px solid #000000;
	box-shadow: 0px 0px 8px 10px rgba(0, 0, 0, 0.5);;
	background-color: sandybrown;
	margin:20px 20px;
	display: block;
}

.center {/*for the bigger words that need centered*/
	text-align: center;
	font-family: 'Amandine Light';
}

.center2 {/*for the smaller words that need centered*/
	text-align: center;
	font-family: 'Amandine Light';
	margin: auto;
	font-weight: bolder;
}

floatleft {/*makes the chocolate bar fit on the left of the index page*/
	float:left;
	margin: 0;
	padding: 0;
}

floatright {/*makes the chocolate bar fit on the right of the index page*/
	float: right;
	margin: 0;
	padding: 0;
}