@import url(http://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700);

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,300);
@charset "UTF-8";
/* Base Styles */







/* SOCIAL Styles */
#boton{
  position:absolute;
  z-index: 9;
  top:0%;
   right:301px;
   width:30px;

 
}

.social{
  position:absolute;
  z-index: 1;
  top:40px;
   right:325px;
   width:30px;
display: none;
 
}


.fa {
  padding: 10px;
  font-size: 20px;
  width: 30px;
  text-align: center;
  text-decoration: none;
  margin: 5px 2px;
}


.fa:hover {
    opacity: 0.7;
}

.fa-facebook {
  background: #3B5998;
  color: white;
}

.fa-twitter {
  background: #55ACEE;
  color: white;
}

.fa-google {
  background: #dd4b39;
  color: white;
}

.fa-linkedin {
  background: #007bb5;
  color: white;
}

.fa-youtube {
  background: #bb0000;
  color: white;
}

.fa-instagram {
  background: #125688;
  color: white;
}

.fa-whatsapp {
  background: #cb2027;
  color: white;
}

.fa-share-alt {
  background: black;
  color: white;
}



/* SOCIAL Styles */






#logo  {
  height:110px;
   background: url(logo.png)  no-repeat center; 
 background-color: rgba(25, 25, 25, .5);
   margin-right: auto;
    margin-left: auto;
}
#closeinfo {  
  position:absolute;
    z-index: 22;
right: 20px;
    margin-top: -40px;
    }
#info {  

   position:absolute;
    z-index: 14;
   margin-left: auto;
    margin-right: auto;
    left:50%;margin-left:79px;
    margin-top: -40px;
    }
#iframe {  

width:60%;
height:80%;
 position:absolute;
     left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    z-index: 11;
    background-color:transparent !important;

  
    }
#frame {  

width:100%;

height:100%;
  
    }
#cssmenu,
#cssmenu ul,
#cssmenu li,
#cssmenu a {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  font-weight: normal;
  text-decoration: none;
  line-height: 1;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  position: relative;
}
 /* BORDE INFERIOR */
#cssmenu {
  width: 250px;
  border-bottom: 4px solid #333333;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;

}

 /* ALTURA CAJAS */
#cssmenu a {
  line-height: 1.3;
}


 /* text-shadow: 0 -1px 1px #000000;*/
}
#cssmenu > ul > li:first-child > a > span {
  padding: 0;
}

 /* colores del primer nivel*/
#cssmenu > ul > li {
  background: rgba(25, 25, 25, .3);
 
}
#cssmenu > ul > li:hover {
 background: rgba(25, 25, 25, .5);

}
 /* colores texto del primer nivel*/
#cssmenu > ul > li > a {
  font-size: 14px;
  display: block;
  background: url(images/pattern.png) top left repeat;
  color: #FFFFFF;
  border: 1px solid  rgba(25, 25, 25, .2);
  border-top: none;
 text-shadow: 0 1px 1px #000000;
}
#cssmenu > ul > li > a > span {
  display: block;
  padding: 12px 10px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
#cssmenu > ul > li > a > span.has-sub-idiomas {
  display: block;
  padding: 6px 5px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
#cssmenu > ul > li > a:hover {
  text-decoration: none;
}
#cssmenu > ul > li.active {
  border-bottom: none;
}
#cssmenu > ul > li.has-sub > a span {
  background: url(images/icon_plus.png) 96% center no-repeat;
}

#cssmenu > ul > li.has-sub-idiomas > a span {
  background: url(images/icon_plus.png) 96% center no-repeat;
}
#cssmenu > ul > li.has-sub.active > a span {
  background: url(images/icon_minus.png) 96% center no-repeat;
}
/* Sub menu  cerrado*/
#cssmenu ul ul {
  display: none;
    background: rgba(225, 225, 225, .5);
  border-right: 1px solid #666666;
  border-left: 1px solid #a2a194;
}
/* Sub menu  abierto*/
#cssmenu ul ul li {
  padding: 0;
  border-bottom: 1px solid #d4d4d4;
  border-top: none;
  background: rgba(225, 225, 225, .5);

}
#cssmenu ul ul li:last-child {
  border-bottom: none;
}
#cssmenu ul ul a {
  padding: 10px 10px 10px 25px;
  display: block;
  color: #676767;
  font-size: 12px;
  font-weight: normal;
}
#cssmenu ul ul a:before {
  content: "»";
  position: absolute;
  left: 10px;
  color: #D4D4D4;
}
#cssmenu ul ul a:hover {
  color: #666666;
}
body
{
	margin: 0;
	padding: 0;
} 

#close {  
    width:20px;
    height:18px;
    position:absolute;
    z-index: 2;
    margin-left:225px;
    margin-top: 10px;
    }
#show { 
   width:103px;
   height:66px;
    position:absolute;
    z-index: 1;
    margin-left: -30px;
    margin-top: 10px;
  
    }

#reservas { 
   width:148px;
   height:44px;
    position:absolute;
    z-index: 1;
   top:5px;
   right:5px;
  
    }



















@media only screen and (-webkit-min-device-pixel-ratio: 2)  and (min-device-width : 24px) and (max-device-width : 1024px) { 
  
  /* Retina-specific stuff here */



  #closeinfo {  
  position:absolute;
    z-index: 92;
  right:10px;
    margin-top: -20px;
      width:33px;
    height:50px;
    }
#info {  

   position:absolute;
    z-index: 14;
   margin-left: auto;
    margin-right: auto;
    left:50%;margin-left:41px;
    margin-top: -12px;
      width:33px;
    height:54px;
    }
/*#closeinfo {  
 right: 0px;
    position:absolute;
    z-index: 90;

    margin-top: -20px;
  width:30px;
    height:50px;
    }
#info {  
 right: 0px;
    position:absolute;
    z-index: 92;

    margin-top: -20px;
  width:30px;
    height:50px;
    }*/
#close { 
    width:20px;
    height:20px;
    margin-left:90px;
    margin-top: 0px;
    }
#show { 
 
    width:51px;
   height:33px;
    margin-left: -15px;
    margin-top: 5px;
  
    }
    #reservas { 
 
    width:74px;
   height:22px;
   
  
    }
#cssmenu { 
		width:100px;
}
#cssmenu ul ul a {

  font-size: 6px;
   padding: 2px 2px 7px 15px;

}
#cssmenu > ul > li:first-child > a {

  font-size: 9px;

}
#cssmenu a {

  font-size: 7px;

}
#cssmenu > ul > li > a {
  font-size: 7px;
}
  #cssmenu > ul > li > a > span {

  padding: 6px 10px;

}

#cssmenu > ul > li.has-sub > a span {
  background: url(images/icon_plus.png) 96% center no-repeat;
     background-size: 7px 7px;
  
}
#cssmenu > ul > li.has-sub.active > a span {
  background: url(images/icon_minus.png) 96% center no-repeat;
  background-size: 7px 7px;
}

#logo  {
  height:55px;
       background-size: 70px 30px;
}
#cssmenu > ul > li > a > span.has-sub-idiomas {
  display: block;
  padding: 3px 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}


#iframe {  

width:90%;
height:90%;

    }
#frame {  


  width: 90%;
 overflow: scroll;
height:100px;
  -webkit-overflow-scrolling: touch;
    }
}