nav{
	position: relative;
	font-size: 15px;
	margin-right: auto;
	margin-left: auto;
	max-width:1050px;
}

/* Main Menu */
.mainmenu{
	display: inline-block;
	cursor:pointer;
	outline:none;
}
.mainmenu a{
	color: #FFF;
	text-decoration: none;
	border-radius:0px;
	display: block;
	padding-top: 15px;
	padding-right: 20px;
	padding-bottom: 15px;
	padding-left: 20px;
	background-color: #333	;
	margin-right: -3px;
	box-shadow: 0px 0px 3px #333;
}
.mainmenu a:hover{
	background-color: #000;
	color: #F30;
}


/* Sub Menu */
.submenu{
	z-index: 9999;
	opacity:0;
	position: absolute;
	visibility:hidden;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	transition: all 0.5s ease;
	box-shadow: 0px 0px 3px #333;
	max-width:600px; /* max width is for multi column */
	text-align: left;
	border-top-width: 3px;
	border-top-style: solid;
	border-top-color: #CCC;
}

.submenu a{
	display: block; /*change to inline-block for multi column*/
	min-width: 200px;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	background-color: #000000;
	color: #CCC;
}
.submenu a:hover{
	opacity:1;
	color: #FFF;
	background-color: #F00;
}

/*on rollover */
.mainmenu:focus .submenu, .mainmenu:hover .submenu{
	visibility:visible;
	opacity:1;
}


@media only screen and (max-width: 700px) {
.mainmenu{
	display: block;
}
.mainmenu:focus .submenu, .mainmenu:hover .submenu{
	position: static;
}
nav{
	max-height:99999px;
	overflow:hidden;
}

}






.hiddenbox {
	box-shadow:0px 1px 3px #333;
	background-image: url(../css/navbar.jpg);
	background-repeat: repeat-x;
	background-position: center center;
	background-color: #000;
}


#toggle, #toggle + label {
	display:none;
	background-color: #CCC;
	color: #FFF;
	
}

@media only screen and (max-width: 700px) {
	
.hiddenbox {
	background-image: url();
	transition: all 0.5s ease;
	max-height:0px;
	opacity:0;
}
#toggle + label {
  display:block;
}

#toggle + label:hover {
  cursor:pointer;
  
}
#toggle:checked ~ .hiddenbox {
  max-height:9999px;
  opacity:1;
}
}
