


.js #nav {
  clip: rect(0 0 0 0);
  max-height: 0;
  position: absolute;
  display: block;
  overflow: hidden;
  zoom: 1;
}

#nav.opened {
  max-height: 9999px;
}


#nav,
#nav * {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#nav-wrapper {
  width: 100%;
}


#nav {
  list-style: none;
  margin:50px 0 0 0;
  padding:0;
  width: 100%;
  background:#ba3e79;
}

#nav ul {
  list-style: none;
  margin:0;
  padding:0;
}


#nav li {
  height:auto;
  text-align:left;
}


#nav a {
font-family: 'Knockout 49 A', 'Knockout 49 B',helvetica,arial,sans-serif; 
font-weight: 400; 
font-style: normal;
  display:block;
  color: #fff;
  text-decoration: none;
  padding: .5em 1em;
  font-size:1.1em;
  letter-spacing:.075em;
  text-transform: uppercase;
}

#nav a:hover {
  color: #000;
}

#nav ul li ul li {
	border:none;
}

#nav ul li ul li a {
  padding: .25em 1em;
  font-size:1em;
}



@media screen and (min-width: 768px) {

.js #nav {
  overflow: visible;
}


#nav {
 background:none;
 padding:0;
 margin:5px auto;
 width:100%;
}

#nav ul {
	text-align: center; 
	margin:0;
	padding:12px;
}

  #nav li {
    width: auto;
    border-top:none;
    display: inline-block;
	margin: 0 .2em;
	padding: 0;
	zoom:1; 
	*display:inline;
  }
	

  #nav a::after {
	position: absolute;
	left: 50%;
	margin-left:-15px;
	width: 30px;
	height: 4px;
	background: #fff;
	content: '';
	opacity: 0;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: opacity 0.3s, -moz-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}


  #nav a::after {
	bottom: 0;
	-webkit-transform: translateY(10px);
	-moz-transform: translateY(10px);
	transform: translateY(10px);
}

  #nav a:hover,
  #nav a:focus {
	color: #fff;
}

  #nav li.current-menu-item a::after,
  #nav a:hover::after,
  #nav a:focus::after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}


  #nav a {
  -webkit-transition: color 0.3s;
  -moz-transition: color 0.3s;
  transition: color 0.3s;
    margin: 0;
    padding: 5px 5px 3px;
    text-align: center;
    color:#fff;
  }
  
  #nav a:hover {
  background:none;
}

  #nav ul ul a {
    display: none;
  }

#nav ul li {
	position:relative;
	}  
  

#nav ul li:hover > ul {
	display: block;
}	


  .js #nav {
    position: relative;
  }
  .js #nav.closed {
    max-height: none;
  }
  #nav-toggle {
    display: none;
  }


}

@media only screen and (min-width:768px) and (max-width:900px) {


#nav a {
  font-size:15px;
}

}


#nav-toggle { cursor: pointer; padding: 10px 35px 16px 0px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position:absolute;
  left:12px;
  top:12px;
   }
#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {

  cursor: pointer;
  border-radius: 1px;
  height: 5px;
  width: 35px;
  background: white;
  position: absolute;
  display: block;
  content: '';
}
#nav-toggle span:before {
  top: -10px; 
}
#nav-toggle span:after {
  bottom: -10px;
}

#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {
  transition: all 500ms ease-in-out;
}
#nav-toggle.active span {
  background-color: transparent;
}
#nav-toggle.active span:before, #nav-toggle.active span:after {
  top: 0;
}
#nav-toggle.active span:before {
  transform: rotate(45deg);
}
#nav-toggle.active span:after {
  transform: rotate(-45deg);
}






