/* ------------------------------------------------------------------ */
/*  Menu
/* ------------------------------------------------------------------ */
.menu{
	background: #141414;
	position: -webkit-sticky;
}


#nav-wrap, #nav-wrap ul, #nav-wrap li, #nav-wrap a {
   margin: 0;
   padding: 0;
   border: none;
   outline: none;
}

/* nav-wrap */
#nav-wrap {
   letter-spacing: 1.5px;
}

/* hide toggle button */
#nav-wrap > a { display: none; }

ul#nav {
   min-height: 40px;
   width: auto;

   /* left align the menu */
   text-align: center;
   opacity: 0.9;
}
ul#nav li {
   position: relative;
   list-style: none;
   height: 40px;
   display: inline-block;

}

/* Links */
ul#nav li a {

   /* 8px padding top + 8px padding bottom + 38px line-height = 54px */
   display: inline-block;
   padding: 0 10px;
   height: 40px;
   line-height: 48px;
   text-decoration: none;
   text-align: left;
   color: #ffffff;
   font-family: 'bebasregular';
   font-size: 0.9em;
   text-transform:uppercase;
  
  transition: color .2s ease-in-out;
}
ul#nav li a:hover { color: #D1DA87; }
ul#nav li a:active { background-color: transparent !important; }
ul#nav li.current a { color: #fff; }


@media screen and (max-width: 778px) {

/* Menu navegación
   -------------------------------------------------------------------- */
  .menu{
      width: 100%;
    }

  #nav-wrap {
      font: 12px;
      background: transparent !important;
      letter-spacing: 1.5px;  
      color: #515968;
   }
   #nav-wrap > a {     
      text-align: left;
    border: none;            
      color: #fff;
      font-size: 12px;
      height: 54px;
      line-height: 54px; 
      float: right;     
                        
      font: 0/0 a;
      text-shadow: none;
      color: transparent;

      position: relative;
      top: 0px;
      right: 20px;
   }
  #nav-wrap > a:before {
     font-family: 'FontAwesome';
      content: "\f0c9";
      color: #fff;
      margin: 0;
      font-size: 25px;
      line-height: 55px;
      text-align: left;      
      display: block; 
      float: right;     
  }

   /* hide menu panel */
   #nav-wrap ul#nav {
      padding: 24px 36px 48px 36px;
      background: #42ae4d;
      height: auto;
      display: none;
      clear: both;
      width: auto;  
      position: relative;
      top: 0;
      right: 0;
      -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;         
   }
   
   /* display toggle buttons */
  .no-js #nav-wrap:not( :target ) > a:first-of-type,
  .no-js #nav-wrap:target > a:last-of-type  {
     display: block;
  } 
   .js #nav-wrap a { display: block; }  

   /* display menu panels - no JS*/
   .no-js #nav-wrap:target > ul#nav  {
      display: block;           
   }

   ul#nav li {
      display: block;
      height: auto;      
      text-align: left;
      border-bottom: 1px solid #fff;
      border-bottom-style: dotted; 
   }
  
   ul#nav li a {  
      display: block;   
      width: auto;  
      margin: 0;
      padding: 0;      
      margin: 12px 0; 
      line-height: 16px; /* reset line-height from 54px */
      border: none;
      color: #fff;
   } 

}

@media only screen and (max-width: 777px) {   

   /* Menu navegacion
   -------------------------------------------------------------------- */
   #nav-wrap { width: 100%; }
   #nav-wrap ul#nav { 
      width: 100%;
      float: none;
      right: 0;             
   }
}