* {
	box-sizing:border-box;
}
html {
	background: rgb(15, 190, 167);
}
body {
	margin: 0px;
}
ul.navigate {
	list-style-type:none;
	padding: 5px;
	background-color:#0896f5f3;
	height:auto;
	display:block;

}

li a {
	color: #000;
	display: block;
}
li a:hover:not(.active) {
    background-color: #111;
 }

.active {
	background-color:#4CAF50;
}

div.wrapper {
	position:relative;
	width: 75%;
	height: 800px;
	margin: 0px auto;
	border: solid black 2px;
	overflow:auto
}
div.nav {
	float:left;
	width:15%;
	height:80%;
	border:solid black 1 px;
	background:#0896f5f3;
}

div.content {
	float:left;
	width:70%;
	height: 80%;
	border: solid black 1px;

}
div.note {
	float: left;
	width:15%;
	border: solid 1px;
	height:80%;
	background-color:rgb(153, 42, 218);
}
.sFooter {
	position:static;
	bottom: 0;
	width: 100%;
	height: 10px;
	
}
	
header {
	float: left; 
	width: 100%;
	height: 20%;
	border: solid black 1px;

}
h1 {
	margin:0px auto;
	
}