body {
	font-family:sans-serif;
}

h1 {color: #000000; font-family: "Comic Sans MS", cursive; font-size: 20pt;}

.carousel-caption {
font-size:25px;
color:blue;
background-color:white;
margin-bottom:30px;
}

#left {
	width:15%;
}

#middle {
	width:55%;
	margin-left:50px;
	margin-right:50px;
}		

#right {
	width:15%;
}

div {
	float:left;
	margin-bottom:50px;
}	



nav {
    font-size:25px;
    height:60px;
    list-style-type: none;
    margin: 0;
    padding: 0;
	overflow: hidden;
	background-color: #DA81F5;
	vertical-align: text-top;
} 

li {
	display: inline-block;
	float:left;
}	

li a {
	color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

li a:hover {
    background-color: #A9F5F2;
    padding:3px;
}

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

@media only screen and (max-width: 1250px) {

	nav {
		height:90px;
	}
	
}		

@media only screen and (max-width: 1000px) {
    
    div {
    	clear: left;
    }	
    
    #middle {
	margin-left:0px;
	margin-right:0px;
	}		
	
	nav {
		height:90px;
	}
}

@media only screen and (max-width: 980px) {

	nav {
		height:120px;
	}	
}		

@media only screen and (max-width: 780px) {

	nav {
		height:150px;
	}	
}		

@media only screen and (max-width: 680px) {

	nav {
		height:200px;
	}	
}		

@media only screen and (max-width: 430px) {

	nav {
		height:350px;
	}	
}		


/*
body {
		background-color:green;
	}
*/