﻿a {
  text-decoration: none;
}
a em {
  font: 0/0 a;
  text-shadow: none;
  color: transparent;
}
nav h1{
	font-size:1.4em;
	color:white;
	margin:0 0 0 10px;
}
nav {
  background-color: rgba(0, 0, 0, 0.6);
  height: auto;
  position: fixed;
  right: -220px;
  top: 25%;
  -moz-transition: right 0.2s linear;
  -o-transition: right 0.2s linear;
  -webkit-transition: right 0.2s linear;
  transition: right 0.2s linear;
  width: 220px;
  z-index: 9001;
  /* IT'S OVER 9000! */
}
nav #menuToggle {
  background: rgba(0, 0, 0, 0.6);
  display: block;
  position: relative;
  height: 40px;
  left: -50px;
  top: 15px;
  width: 50px;
}
nav #menuToggle span {
  background: white;
  display: block;
  height: 10%;
  left: 10%;
  position: absolute;
  top: 45%;
  width: 80%;
}
nav #menuToggle span:before, nav #menuToggle span:after {
  background: white;
  content: '';
  display: block;
  height: 100%;
  position: absolute;
  top: -250%;
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  width: 100%;
}
nav #menuToggle span:after {
  top: 250%;
}
nav a:nth-child(n+2) {
  color: white;
  display: block;
  font-size: 1em;
  margin: 10px 0 10px 10px;
  text-decoration:none;
}
nav a:nth-child(n+2):after {
  background: #ed682f;
  content: '';
  display: block;
  height: 2px;
  -moz-transition: width 0.2s;
  -o-transition: width 0.2s;
  -webkit-transition: width 0.2s;
  transition: width 0.2s;
  width: 0;
}
nav a:nth-child(n+2):hover:after {
  width: 100%;
}

.open {
  right: 0;
}
.open #menuToggle span {
  background: transparent;
  left: 10%;
  top: 45%;
}
.open #menuToggle span:before, .open #menuToggle span:after {
  background: white;
  top: 0;
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.open #menuToggle span:after {
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#menuToggle .navClosed {
  -moz-transition: background 0.1s linear;
  -o-transition: background 0.1s linear;
  -webkit-transition: background 0.1s linear;
  transition: background 0.1s linear;
}
#menuToggle .navClosed:before, #menuToggle .navClosed:after {
  -moz-transition: top 0.2s linear 0.1s, -moz-transform 0.2s linear 0.1s;
  -o-transition: top 0.2s linear 0.1s, -o-transform 0.2s linear 0.1s;
  -webkit-transition: top 0.2s linear, -webkit-transform 0.2s linear;
  -webkit-transition-delay: 0.1s, 0.1s;
  transition: top 0.2s linear 0.1s, transform 0.2s linear 0.1s;
}
#menuToggle .navOpen {
  -moz-transition: background 0.1s linear 0.2s;
  -o-transition: background 0.1s linear 0.2s;
  -webkit-transition: background 0.1s linear;
  -webkit-transition-delay: 0.2s;
  transition: background 0.1s linear 0.2s;
}
#menuToggle .navOpen:before, #menuToggle .navOpen:after {
  -moz-transition: top 0.2s linear, -moz-transform 0.2s linear;
  -o-transition: top 0.2s linear, -o-transform 0.2s linear;
  -webkit-transition: top 0.2s linear, -webkit-transform 0.2s linear;
  transition: top 0.2s linear, transform 0.2s linear;
}
@media all and (max-width: 768px) {

 nav {
  background-color: rgba(0, 0, 0, 0.6);
  height: 100%;
  position: fixed;
  right: -220px;
  top: 0;
  width: 220px;
  z-index: 9001;
  /* IT'S OVER 9000! */
}
nav #menuToggle {
  background: rgba(0, 0, 0, 0.6);
  display: block;
  position: relative;
  height: 40px;
  left: -50px;
  top: 20px;
  width: 40px;
}
nav a:nth-child(n+2) {
  color: white;
  display: block;
  font-size: .875em;
  margin: 5px 5px 5px 5px;
  text-decoration:none;
}


}





