.bloquearScroll {
   overflow-y: hidden !important;
} 
header {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 50px;
}
.logoResabooking{
height: auto;
width:160px;
position:fixed;
top:0;
left: calc(50% - 80px) !important;
transition:0.5s;
} 
.burger-container {
   background-color: #2c2c2c;
   width: 100%;
   height: 50px; 
} 
.burger {
   position: relative; 
   height: 50px;
   cursor: pointer;
} 
.burgerBar1 {
position: absolute;
top: 10px;
left: 15px;
background: rgb(255, 255, 255);
background: linear-gradient(83deg, rgba(255, 255, 255, 0.384) 6%, rgb(255, 255, 255) 29%, rgb(255, 255, 255) 100%);
width: 50px;
height: 5px;
transition:0.75s;
} 
.burgerBar2 {
position: absolute;
top: 22px;
left: 15px;
background: rgb(255, 255, 255);
background: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 74%, rgb(255, 255, 255) 85%);
width: 50px;
height: 5px;
transition:0.50s;
}

.burgerBar3 {
position: absolute;
top: 35px;
left: 15px;
background: rgb(255, 255, 255);
background: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 29%, rgba(255, 255, 255, 0) 97%);
width: 50px;
height: 5px;
transition:0.25s;
}
.burgerOn>.burgerBar1{
   transform: rotate(-40deg);
   top: 22px;
   transition: 0.75s;
}
.burgerOn>.burgerBar2{
   transform: rotate(40deg);
   transition:0.5s;
}
.burgerOn>.burgerBar3{
   width:0px;
   transition:0.25s;
} 
#menu-container {
   background-color: white ;
   width: 0vw;
   height: calc(100vh - 50px) !important;
   transition: 0.5s;
  padding-top: 50px;
  padding-bottom: 50px;
} 
.menuContainerOn {
   width: 100vw !important;
 /*   height: calc(100vh - 50px) !important; */
   overflow-y: auto;
   transition: width 1s ease;
}

.menuContainerOn::-webkit-scrollbar {
   -webkit-appearance: none;
} 
.menu {

   margin: 0 !important;
   padding:0 !important;
   text-align:center;
   opacity: 0;
   width: 0%;
   height: 0%;
   display:none;
}
.menu>li{
   padding:0 !important;
 border-bottom: solid 1px #888; 
}
.menu > li a> span{
   display: block;
   font-size: 25px;
   color:#444 ;
}   
.menu li a> span:hover{
   color:#1e7a85;
}   
.menuOn {
   display:flex !important;
   justify-content:center;
   align-items:center;
   flex-flow:column;
   width: 100%;
   height: 100%;
   animation-name: menuOnAnimation;
   animation-fill-mode: forwards;
   animation-duration: 1s;
}
.menuOn > li {
  width: 100%;
} 
@keyframes menuOnAnimation {
   0% {
       opacity: 0;
   }
   100% {
       opacity: 1;
   }
} 
.subopcionTitre {
   display:block;
   cursor: pointer;
   color:#444 ;
   font-size: 25px;
}

.subopcionTitre::after{
display: inline-block;
margin-left: 15px;

content: "+";
}

.subopcionTitreOn::after{
content: "-" !important;
vertical-align: 3px;
}

.subopcionTitre:hover {
color:#1e7a85;
}
.subopcionTitre+ul {
   display: none;
}

.subopcionTitreOn+ul {
   display: block;
}

.subopcionContainer{
padding:0 !important;

background-color:white;
}
.subopcionContainer>li>a>span {
display: block;
color:#444 ;
font-size: 25px;
}   
.subopcionContainer>li>a>span:hover{   
}  
.subopcionDescripcion{
display:none;
}
.menuIconos{
   border:none !important;
} 
.logo-menu{width: 110px;position: fixed;left: calc(50% - 55px);margin-top: 3px;}
/*  FIN - OPCIONES DEL MENU */

.zoomEstructura2BisMenu {
position: relative;
/* top: 0px; */
/* left: calc(50% - 100px); */
border-radius: 50%;
overflow: hidden;
width: 200px;
height: 200px;
z-index: 1;
}

.zoomEstructura2BisMenu>a>img {
border: solid 1px var(--color-4);
border-radius: 50%;
padding: 10px;
height: 200px;
width: 200px;
transition: 0.5s;
}

.zoomEstructura2BisMenu:hover>a>img {
padding: 0px !important;
transition: 0.5s;
}

.menuTextAux{ 
display:none; 
}
  @media only screen and (min-width: 400px) {
 
  }

@media only screen and (min-width: 576px) {
   .logoResabooking{
      width: 180px !important;
      left: calc(50% - 90px) !important;
      transition: 0.5s;
   }
}

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

@media only screen and (min-width: 992px) {
   header {
      height: 60px;
  } 
   .burger-container {
      height: 60px;
  }
   .burger {
      height: 60px; 
   } 
   .burgerBar1 {
      top: 13px;
   } 
   .burgerBar2 {
      top: 26px; 
   } 
   .burgerBar3 {
      top: 40px;
      
   } 
   .burgerOn>.burgerBar1{
      transform: rotate(-40deg);
      top: 25px;
      transition: 0.75s;
   }
   .burgerOn>.burgerBar2{
      transform: rotate(40deg);
      transition:0.5s;
   }
   .burgerOn>.burgerBar3{
      width:0px;
      transition:0.25s;
   } 
   .menu{
      border-right: solid 1px #c9c9c9; 
   }
   .menuOn{
      width:35% !important; 
   }
   .menu>li{
    border-bottom:inherit !important; 
    display:none;
  }
   .menuOn>li{
    border-bottom:inherit !important; 
    display:flex;
  } 
  .subopcionContainer{ 
      display:none !important;
      flex-flow: column;
      justify-content: center;
      position: absolute;
      top: 100px;
      left: 35%; 
      width: 65%;  
      height: calc(100% - 160px);
      overflow-y: auto; 
  }
  .subopcionContainer::-webkit-scrollbar {
      -webkit-appearance: none;
   } 
  .subopcionTitreOn+ul{
    display: flex !important; 
 
   transition:width 0.5s,opacity 1s;
  } 
  .menuIconos{
   border:none !important;
  }
  .menuIconos>div{
   border-top:solid 1px #888;
  } 
  .logo-menu{width: 140px;left: calc(50% - 70px);margin-top: 3px; }
  .menuTextAux{
   position: absolute;
   top: 60px;
   left: 35%;
   width:65%;
   height: calc(100% - 60px);
   overflow-y:auto;
   display:flex;
   flex-flow:column;
   align-items: center;
   justify-content: center;
   opacity:0;
   transition:opacity 1s;
}
.menuContainerOn>.menuTextAux{
   opacity:1;
}
}

@media only screen and (min-width: 1200px) {
   .menuOn{
      width:25% !important;
   }
   .subopcionContainer{
      left: 25% !important; 
      border-right: solid 1px #c9c9c9; 
      background-color:white;
     } 
     .subopcionTitreOn+ul{
      width: 25%; 
      transition:1s;
     } 
     ul+.subopcionDescripcion{
      position: absolute;
      top: 60px;
      left: 50%; 
      width:50% !important;
      height: calc(100% - 60px);
      overflow-y:auto; 
      display:none!important;
      flex-flow: column;
      align-items: center;
      justify-content: center;
      /* background-color:white; */ 
   } 
  .subopcionTitreOn+ul+.subopcionDescripcion{ 
    display: flex !important;
   }
   .subopcionTitreOn+ul+.subopcionDescripcion::-webkit-scrollbar {
      -webkit-appearance: none;
   }
   .subopcionTitreOn+ul+.subopcionDescripcion>p{
      color:#444;
   }
   .menuTextAux{ 
      left: 25%; 
      width:75%; 
   }
   .desaparecer{
      display:none;
      transition:0.5s;
   }
}
