* 
{
  margin: 0;
  padding: 0;
}

#wrapped 
{
  position: absolute;
  width: 100%;
  height: 60%;
  overflow: visible;
}

label 
{
  cursor: pointer;
}
label:focus 
{
  outline: none;
}

.menu 
{
  position: absolute;
  top: 0;
  left: 0;
  background: #E8E8E8;
  width: 17vw;
  height: 18vw;
  height: 23vw;  
  transform: translate3d(-17vw, 0, 0);
  transition: transform 0.35s;
}

.menu label.menu-toggle 
{
  margin-top: 1em;
  position: absolute;
  width: 3vw;
  height: 3vw;
  right:-3vw;
  line-height: 0vw;
  display: block;
  padding: 0;
  text-indent: -9999px;
  background-color: #E8E8E8;
  
  background-image: url(../images/whiteHamburger.png);
  background-image: url(../images/orangeMenu10a.png);
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
}
.menu ul li 
{
   list-style-type: none;
}

.menu ul li > label 
{
  background: url(../images/orangeArrow.png) 95% 50%/16px 16px no-repeat;
}
.menu ul li a, .menu ul li label 
{
  display: block;
  text-align: left;  
  padding: 0 1vw;
  line-height: 1.8vw;  
  text-decoration: none;
  color: brown;
}

.menu ul li a:hover, .menu ul li label:hover 
{
  color: #666;
}

/* hide inputs */
.menu-checkbox 
{
  display: none;
}

/* hide navigation icon for sublabels */
.menu .menu label.menu-toggle 
{
  background: none;
}

/* fade in checked menu */
.menu-checkbox:checked + .menu 
{
  transform: translate3d(0, 0, 0);
}