@charset "UTF-8";
/* CSS Document */
body{

    background-color:#5C7953;
	height: 100vh;
	margin: 0;
	font-family:  -apple-system, BlinkMacSystemFont, sans-serif;
    
	}
		
.header{ 
	height: 30vh;  
	background-color:#E3E3E3 ; 
	text-align: left;
	font-size: 24px;
	color: #2B5500 ;
	padding: 5px; 
	overflow:hidden;
	}

/*navbar container*/ 
.navbar{ 

	height:10%;
    width:150vw;
    border-radius: 5px;
	background-color: #FFF5F5;
	font-family:  -apple-system, BlinkMacSystemFont, sans-serif; 
	font-size: 20px;
    top: 10%; 
}


/*links within the navbar*/
.navbar a{ 
	float: left; 
	font-size: 16px; 
	color: #000000; 
	text-align: center; 
	padding: 14px 10px; 
	text-decoration: none; 
	}
/*drop container*/
.drop{ 
	float:left; 
	overflow: hidden; 

	}
/*drop button*/
.drop .dropbutton{ 
	font-size: 16px; 
	border: none; 
	outline: none; 
	color: #000000; 
	background-color: #f1f1f1;
	padding: 14px 16px; 
	font-family: inherit; 
	text-align: center;
	margin: 0; 
	}

/*add hover color to links in navbar*/
.navbar a:hover, .drop:hover  { 
	color: #F89000; 
	}
.dropbutton:hover, dropbutton:focus {
	background-color:#f1f1f1;
			}
/*add hover color to links in navbar*/
.drop-content{ 
	display: none; 
	position: absolute; 
	background-color: #C2D2BB;
	min-width: 160px; 
	box-shadow: 0px 8px 16px 0px #F89000; 
	z-index:1; 
	text-align: center;
	}

/*links inside*/
.drop-content a { 
	float: none;
	color:none ; 
	padding: 12px 16px;
	text-decoration: none; 
	display: block; 
	text-align: center;
	}
/*add gray bg to dro links*/
.drop-content a:hover{ 
	background-color: #F1F1F1;
	} 
/*show menu on hover*/
.drop:hover .drop-content{ 
	display: block; 
	}
.show{display:block;}

#overlay{ 
	position: fixed; 
	display: none; 
	width: 100%; 
	height: 100%; 
	top:0%;
	left: 0; 
	right:0; 
	bottom: 0; 
	background-color: rgba(0,0,0,0.5);
	z-index:2; 
	cursor: pointer; 
}