nav {
  display: block;}
.right {
  float: right; margin-left: 1em;}
/* ----------------------------- */
/* == Menu */
/* ----------------------------- */
.menu-wrapper {
  position: relative; z-index: 10;
  text-transform: uppercase; padding-top: 2px; padding-bottom: 2px; }
.menu-wrapper .menu {
  margin: 0; padding-left: 0; list-style: none; text-align: center;}
.menu-wrapper .menu > li {
  position: relative; display: inline-block; width: 20%;}
.menu-wrapper a.menu-link {
  display: none; padding: 0.7em 0;}
.menu-wrapper a {
  display: block; position: relative; 
  line-height: 1.3em; color: #000; text-decoration: none;}
.menu-wrapper .menu > .current-menu-item > a,
.menu-wrapper .menu > .current-menu-ancestor > a {
  position: relative; z-index: 12; color: #b92120;}
.menu-wrapper a:hover{
  color: #ac9d83;}
.menu-wrapper .sub-menu {
  position: absolute; width: 150px; max-height: 0em;
  overflow: hidden;}
.menu-wrapper .sub-menu li {
  display: block; background: #fff;}
.menu-wrapper .sub-menu a {
  margin: 0; white-space: nowrap; line-height: 1.8em; border: none;}
.menu-wrapper li:hover .sub-menu {
  max-height: 30em;
  transition: max-height 0.5s;}
.menu-wrapper li li{
	float: none; width: 100%;}
@media screen and (max-width: 550px) {
  .menu-wrapper{
	  margin-top: 15px;}
  .js .menu-wrapper nav[role=navigation] {
    overflow: hidden; max-height: 0em; }
  .js .menu-wrapper nav[role=navigation].active {
    max-height: 40em; transition: max-height 0.5s ease-out; }
  .menu-wrapper a.menu-link {
    display: block; width: 40px; height: 40px;
    padding-right: 10px; padding-left: 10px; border: none; 
	background:  url(../imagenes/menu.jpg) no-repeat center center; margin: 0 auto;}
  .menu-wrapper .menu li {
    display: block; border: none; }
  .menu-wrapper .menu > li {
    width: 100%; padding: 0px;  }
  .menu-wrapper .menu a {
    border: none; }
  .menu-wrapper .menu .rightalign {
    float: none;  }
  .menu-wrapper li + li a:before {
    content: "";  }
  .menu-wrapper li:hover .sub-menu {
    max-height: 0em; transition: none;  }
  .menu-wrapper .sub-menu {
    margin-left: 0px; display: block; width: 100%; }
  .menu-wrapper .sub-menu li,
  .menu-wrapper .sub-menu li a {
    margin: 0; display: block; width: 100%; background: #313439; color: #fff !important; }
  .menu-wrapper .sub-menu li a:hover {
    color: #333 !important; }
  .menu-wrapper .sub-menu li {
    border-bottom: 1px solid #fff;  }
  .menu-wrapper .sub-menu li:last-child a {
    border: none; }
  .menu-wrapper .menu .has-subnav {
    position: relative; }
  .menu-wrapper li .sub-menu.active {
    max-height: 300px; overflow: visible; position: relative; z-index: 9;
    transition: max-height 0.5s ease-out;  }
  .menu-wrapper .toggle-link {
    height: 55px; width: 66px; display: block; transform: rotate(180deg); padding-top: 18px;
    position: absolute; right: 0px; z-index: 200; font-size: 30px; cursor: pointer;}
  .menu-wrapper .toggle-link:before{
	content:'▲'; color: #5ac5bf; }
  .menu-wrapper .toggle-link:hover {
    transition: all 0.6s; background: #eee; }
  .menu-wrapper .menu .has-subnav > .toggle-link:after {
    position: absolute; width: 50px; top: 50%; bottom: 50%; right: 4px;
    color: #fff; }
}