body {font-family: "Lato", sans-serif;}

.sidenav {
	height: 			100%;
	width: 				0;
	position: 			fixed;
	z-index: 			1;
	top:				0;
	left:				0;
	background-color: 	Black;
	overflow-x: 		hidden;
	transition: 		0.5s;
	padding-top: 		60px;
	text-align:			Left;
  	font-weight:		Bold;
}

.sidenav a {
	padding: 			8px 8px 8px 32px;
	text-decoration: 	none;
	font-size: 			25px;
	color:				White;
	display: 			block;
	transition: 		0.3s;
	font-weight:		Bold;
}

.sidenav a:hover {
	color: 				#FFFFFF;
  	font-weight:		Bold;
	background-color:	darkred;
}

.sidenav .closebtn {
	position: 			absolute;
	top: 				0;
	right: 				30px;
	font-size: 			80px;
	margin-left: 		50px;
}

.sidenav .closebtn2 {
	right: 				60px;
	font-size: 			80px;
	margin-left: 		150px;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

.collapsible {
	background-color: 	Black; 
	font-size: 			25px;
	cursor: 			pointer;
	padding: 			4px;
	width: 				100%;
	border: 			none;
	outline: 			none;
	color:				White;
	text-align:			Left;
  	font-weight:		Bold;
}

.active, .collapsible:hover {
	color: 				#FFFFFF;
	font-weight:		Bold;
	background-color:	darkred;

}

.content {
	color: 				#FFFFFF;
	padding: 			0 4px;
	display: 			none;
	overflow: 			hidden;
	background-color:	darkslategray;
  	font-weight:		Bold;
}

.menu {
	bottom:40px;
	top:;
}

@media screen and (min-width: 979px) {
  .menu {
	bottom:10px;
	top:;
  }
}

@media screen and (min-width: 1180px) {
  .menu {
	bottom:;
	top:10px;
  }
}

.phpmenu {bottom:40px; top:;}
@media screen and (min-width: 979px) { .phpmenu {bottom:10px; top:; }}