@charset "utf-8";
html, body { height: 100%; }

/* Arreglos Bootstrap */
body{ color: #444444; background: #000000; padding-top: 15px; font-size: 13px; font-family: 'Open Sans', sans-serif;}
h1,h2,h3,h4,h5,h6{ font-weight: 300; font-family: 'Open Sans', sans-serif; }
h1{ font-size: 28px; line-height: 28px; color: #846d4d}
h1 small{ font-size: 24px; }
h2{ font-size: 26px; line-height: 26px; color: #a68c66}
h4{ color: #FFF; font-size: 19px;}
p {text-align: justify;}
#supersized{padding:0}


a{ color: #846d4d; } /* Rojo */
a:hover, a:focus{ color: #a68c66; }
a:hover i{ text-decoration: none; }
.sinmargin{ margin: 0;}
hr{ margin-bottom: 0; }
label{ font-weight: normal; padding-right:0 !important;}

.click_a{ cursor: pointer; }
.relative{ position: relative; }
.text-justify{ text-align: justify; }

/* Layout */
#wrap { min-height: 100%; height: auto; margin-bottom: -45px; padding-bottom: 45px; }
#wrap-contenido{ background: rgba(255,255,255,0.8); padding: 0px 50px 40px;}
#main-content{ min-height: 50px; max-width: 550px; }
.heading-content{ overflow: hidden; background: rgba(255, 255, 255, 0.8); max-width: 550px; }
.heading-content i { opacity: 0.15; }
.heading-content .btn { background: none; }
.heading-content .btn:focus { outline:none; }
#footer { height: 45px; background-color: rgba(0,0,0,0.85); position: relative; z-index: 1; }
/*#footer address{ margin-bottom: 0; margin-top: 5px; font-size: 10px;}*/
/*#footer a.menu-footer{padding:10px}*/
#wrap-contenido li{list-style-image: url("../images/general/li.png")}
#share_zone{float:left;width:100%;margin-bottom: 30px}
#share_zone div{float:left;margin-right:10px}

.bgdark .backstretch{ opacity: 0.5; }
.hr-black {border-color: #444444}

/* Menú principal */
#wrap-menu-principal{ /*background-color: rgba(0,0,0,0.8);*/ border-top: 5px solid #a68c66; position: relative; z-index: 150; }
#wrap-menu-principal .nav > li{ margin-top: 1px; }
#wrap-menu-principal .nav > li a{ background-color: rgba(0,0,0,0.8); color: #FFFFFF; text-transform: uppercase; font-size: 15px;padding: 10px 15px 10px 25px}
#wrap-menu-principal .nav > li a small{ display: block; text-transform:  none; color: #888; font-family:'Open Sans', sans-serif;  font-size: 12px; }
#wrap-menu-principal .nav > li > a:hover, #wrap-menu-principal .nav > li > a:focus{ background-color: rgba(0,0,0,0.9);}
#wrap-menu-principal .navbar-collapse{ padding: 0; border-top: 0; }
/* desplegable */
#wrap-menu-principal .nav > li ul.nav { padding: 10px 0; background-color: rgba(255,255,255,0.8); }
#wrap-menu-principal .nav > li .nav > li{ margin-top: 0; }
#wrap-menu-principal .nav > li .nav > li a{ background-color: rgba(255,255,255,0.0); color: #222; padding: 6px 15px 6px 35px; font-size: 12px; font-family: inherit;}
#wrap-menu-principal .nav > li .nav > li > a:hover, #wrap-menu-principal .nav > li .nav > li > a:focus{ background-color: rgba(255,255,255,0.9);}

#wrap-menu-principal button.btn{ background-color: rgba(0,0,0,0.8); padding: 0; color: rgba(255,255,255,0.5); width: 100%; text-align: left; padding-left: 23px; }

#wrap-menu-principal .nav > li ul.nav.level3{ padding-top: 0; box-shadow: inset 0 3px 3px rgba(0,0,0,0.1); padding-left: 10px; }
#wrap-menu-principal .nav-pills.level3 a{ text-transform: capitalize; }

/* Boton toggle para movil */
#wrap-menu-principal .navbar-toggle{ background-color: rgba(255,255,255,0.8); position: absolute; right: 0; margin-top: 15px; }
#wrap-menu-principal .navbar-toggle .icon-bar{ background-color: #a68c66; }

/***** Fin del menú ******/




/* Logo */
#wrap-menu-principal .navbar-brand{ padding: 30px 15px 15px 20px; max-width: 100%; }
#wrap-menu-principal .navbar-brand img{ display: inherit; }
#wrap-menu-principal .navbar-header{ float: inherit; background-color: rgba(0,0,0,0.8); }
#wrap-menu-principal .logo {max-width: 170px; width: 100%;}

/* Zona de enlaces top */
#enlacessuperiores a{ color: #FFF; font-size: 12px; padding: 0 10px; }
#enlacessuperiores .nav > li > a:hover, #enlacessuperiores .nav > li > a:focus{ background: transparent; text-decoration: underline;  }

#enlacessuperiores .dropdown-menu{ background: rgba(0, 0, 0, 0.8); border-radius: 0;}
#enlacessuperiores .dropdown-menu a{ padding: 5px 10px; }
#enlacessuperiores .dropdown-menu > li > a:hover, #enlacessuperiores .dropdown-menu > li > a:focus{ background: rgba(0, 0, 0, 0.9); }
#enlacessuperiores .nav .open > a, #enlacessuperiores .nav .open > a:hover, #enlacessuperiores .nav .open > a:focus{ background: none; border-color: #FFF; }
/*#enlacessuperiores .nav > li > a{}*/

/* Sidebar */
#sidebar h1.panel-title, #sidebar h1.panel-title a { color: #FFF; }
#sidebar{ margin-top: 10px; }
#sidebar.affix{ width: inherit; right: 20px; max-width: 320px; }
.panel-heading .accordion-toggle:after { font-family: 'FontAwesome'; content: "\f056"; color: #C7C7C7; float: right; opacity: 0.7; }
.panel-heading .accordion-toggle.collapsed:after { content: "\f055"; }
#specialoffers a{color:#fff}
#specialoffers a:hover{text-decoration:none}
#specialoffers .panel-body{padding:10px 40px}
#specialoffers .panel-body h3{font-size:22px}
#specialoffers .panel-body .carousel-inner h3{text-transform: uppercase;font-size:14px;margin-top:5px;margin-bottom: 0;font-weight: bold}
#specialoffers .controles{background:#000;opacity:0.8;padding:5px 10px}
#specialoffers .controles .view-all{position:absolute;left:0;right:0;text-align:center;text-transform: uppercase}

/* Rooms */
.rooms h3 {font-size: 20px; color: #a68c66; font-style: italic;}
.rooms #tab-rooms.nav > li > a{ padding: 10px 10px; }
.rooms #tab-rooms li > a{border-radius: 0;font-size:16px;color:#846d4d;border-bottom:none;background:#EEE;opacity:0.6}
.rooms #tab-rooms li > a:hover{opacity:1}
.rooms #tab-rooms li.active{border:0px solid #FFF;border-bottom:none;}
.rooms #tab-rooms li.active a{border:0px solid #FFF;opacity:1;background:#fff}
.rooms .tab-content{background:#fff;border:1px solid #ccc;padding:20px}
.rooms .tab-content .thumbnail {padding: 0;}


.btn.btn-black{background:#000;border:none;border-radius:3px;color:#fff}
.btn.btn-black:hover{background:#a68c66;}

a.thumbnail:hover, a.thumbnail:focus, a.thumbnail.active{ border-color: #a68c66; }
.thumbnail{ border-radius: 0;}

/* Girona */
.girona .pair{margin-left:-14px}
.girona .inpair{margin-right:-14px;}
.girona .thumbnail{padding:15px;margin-bottom: 10px; background: rgba (255,255,255,0.6);border-radius:0}
.girona .thumbnail h3{margin-top:0;color:#555}
.girona .thumbnail .caption{padding:9px 0 0}
.girona .thumbnail .caption p{text-align:justify;color:#000}
.girona .thumbnail .caption .btn-zone{text-align:right}

/* Ofertes */
.offers .oferta{background:#737369;padding:10px;margin-bottom:10px}
.offers .oferta p{color:#111}
.offers .oferta .media > .pull-left{margin-right:30px}
.offers .oferta .btn-link{color:#fff;font-size: 12px; padding:0 10px;}
.offers .oferta h4 {color:#fff; font-size: 18px; padding: 10px 0 0 0;}

/* Fitxa Oferta */
.oferta-single{color:#333}
.oferta-single .page-header{border:none;margin-bottom: 20px}
.oferta-single .precio-oferta{border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 10px 0px; margin-top: 20px; overflow: hidden;margin-bottom: 30px}
.oferta-single .precio-oferta p{margin-top:5px}
.oferta-single .return{margin-top:15px}
.oferta-single .return a{color:#999}
.oferta-single h2.grey{color:#444;font-size: 24px}
.oferta-single .img_oferta_principal{background-position: 100% center;background-size: 100% auto;border: 2px solid white;height: 200px;margin-bottom:10px}
.oferta-single .list-img img{margin-bottom:10px} 


/* Blog   */
#blog img {max-width: 100%; height: auto;}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    background-color: #846d4d;
    border-color: #846d4d;
}
#blog .list-img img{margin-bottom:10px}

/* Form reserva en sidebar */
.grupo-select{ float: right; margin-right: 15px; margin-left: 10px;}
.grupo-select label{ display: block; }
#rate{ /*opacity: 0.4;*/ background-color: rgba(106, 104, 102, 0.7); padding: 3px; height: 25px; color: #FFF; border:0;}
.popover { color: #222}
.popover-title { font-size: 12px;}

/* Genérico para todos los paneles, en concreto para el accordion */
.panel-heading a { transition: 0.5s all;}
.panel-group .panel{ border-radius: 0; border: 0;}
.panel-group .panel + .panel{ margin-top: 1px; }
.panel{ background-color: rgba(0,0,0,0.4); }
.panel-default > .panel-heading{ background-color: rgba(0,0,0,0.3); padding: 0; }
.panel-default > .panel-heading a{ padding: 15px 10px 15px 15px; display: block; opacity: 0.7; }
.panel-default > .panel-heading a:hover,.panel-default > .panel-heading a:focus{ text-decoration: none; color: inherit;  opacity: 1; }
.panel-default > .panel-heading a:focus{ background-color: rgba(0,0,0,0.4); }
.panel-default > .panel-heading:hover{ background-color: rgba(0,0,0,0.5); }
.panel-default > .panel-heading + .panel-collapse .panel-body{ border: 0; background-color: rgba(0,0,0,0.6); color: #aaa; }

.panel-heading a.accordion-toggle { font-size: 20px; background-color: rgba(0,0,0,0.6); }
.panel-heading a.accordion-toggle.collapsed { font-size: 16px; background-color: rgba(0,0,0,0.0); }


/* Interiores */
.page-header{ margin-bottom: 0; margin-top: 0; padding-bottom: 0; border-bottom: 1px solid #aaa;margin-bottom: 15px}
.page-header small{ text-transform: uppercase;}
.page-header h1{ margin-top: 0;}
.page-header h2{ margin-top: 0;margin-bottom: 15px;color:#846d4d;font-size: 28px}

/* Gallery */

#wrap-contenido-galeria{ height: auto; position: absolute; bottom: 45px; left: 0; right: 0; }
#wrap-contenido-galeria.principal{ /*height: 150px;*/ }
#wrap-contenido-galeria button.btn.coll, #wrap-contenido-galeria a.btn.coll{ position: absolute; right: 0; top: -34px; color: #FFF; background-color: rgba(0,0,0,0.5); border-radius: 4px 0 0 0; }
#wrap-contenido-galeria .arrowright{ position: absolute; right: 0; color: #FFF; background-color: rgba(0,0,0,0.5); top: 48px; bottom: 6px; z-index: 100; }
#wrap-contenido-galeria .arrowleft{ position: absolute; left: 0; color: #FFF; background-color: rgba(0,0,0,0.5); top: 48px; bottom: 6px; z-index: 100; }
#wrap-contenido-galeria .arrowright:hover,#wrap-contenido-galeria .arrowleft:hover{ background-color: rgba(0,0,0,0.9); }

#wrap-collapse{ background-color: rgba(0,0,0,0.5); overflow: hidden; }
#galeria_imagenes{ width: 100%; }
#galeria_imagenes ul{ padding: 0; margin: 0; position: relative; z-index: 99; }
#galeria_imagenes li{ display: table-cell; margin: 0; padding: 0; }
#galeria_imagenes a.thumbnail{ float: left; position: relative; overflow: hidden; margin-bottom: 0; border-radius: 0; border: 4px solid rgba(255,255,255,0); padding: 0; background: rgba(255,255,255,0); color: #FFF; }
#galeria_imagenes a.thumbnail:hover{ background: rgba(255,255,255,1); }
#galeria_imagenes a.thumbnail span{ background: rgba(0,0,0,0.8); position: absolute; top: 0; padding: 5px; left: 0; right: 0; }

.principal #galeria_imagenes a.thumbnail img{ height: 140px; margin-bottom: 0; }
.principal #galeria_imagenes a.thumbnail{ height: 100px; width: 150px; }
/*
#galeria_imagenes a.thumbnail img{ height: 84px; } 
#galeria_imagenes a.thumbnail{ margin-bottom: 2px; }
*/
.menu-galeria a{ color: #FFF; margin-top: 5px; }
.menu-galeria .nav > li > a:hover, .menu-galeria .nav > li > a:focus{ background: rgba(0,0,0,0.5); }
.menu-galeria .nav-pills > li.active > a, .menu-galeria .nav-pills > li.active > a:hover, .menu-galeria .nav-pills > li.active > a:focus{
    background: rgba(0,0,0,0.5); font-weight: bold;
}

/* Cover img sin usar background */ /* 20181022 Sergio R - añadir wrap-img-cover-object para maquetar correctamente los thumbnails de imgs verticales, q quedaban deformadas */
.wrap-img-cover-object.bbcode { display: block; height: 85px; margin: 15px 0; transition: 0.2s opacity }
.wrap-img-cover-object.bbcode:hover { opacity: 0.8; }
.wrap-img-cover-object { position: relative; width: 100%; height: 85px; width: 110px; display: block; margin: 0 5px 5px;  }
.wrap-img-cover-object img { width: 100%; height: 100%; object-fit: cover; font-family: 'object-fit: cover; object-position: 50% 50%;'; object-position: 50% 50%; transition: all 0.5s; }

/* Gallery en page.php */
/*.wrap-gallery-page{ height: 125px; overflow: hidden; }
gallery-more

*/
.wrap-button-readmore{ border-top: 1px solid #CCCCCC; overflow: visible; text-align: center; width: 100%; }
.wrap-button-readmore button{ background: none; margin-top: -10px; }
.wrap-button-readmore button i{ color: #999; }
.wrap-button-readmore button:focus{ outline:none;  }

/* Gallery Mobile */
#gallery_mobile .btn-close{ position: absolute; top: 0; right: 0; }
#gallery_mobile a.btn-close{ color: #CCC; }


/* Theme Bootstrap */
.btn{ border-radius: 0;}
.form-control:focus{ border-color: #CCCCCC; box-shadow: inset 0 5px 5px rgba(68,68,68,0.4);}
.alert{ margin-bottom: 15px; padding: 15px; border-radius: 0; }
.alert p {text-align: left;}
.alert button.close {padding: 0 0 0 15px}
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control{ cursor: auto; }
select.form-control{ padding-left: 5px; padding-right: 5px; background-color: #EEEEEE; }

/* Modal */
.modal h1, .modal h3 {margin: 0 0 20px 0; color: #846d4d}

/* Footer */
.info_footer { color: #999; font-size: 90%; padding: 2px 8px 2px 15px; }
.info_footer a img{ padding: 2px 0px 2px 8px;  }
.info_footer a {color: #999; /*font-size: 90%;*/ }
.info_footer a:hover{ color: #DDD; }
.info_footer ul{ margin-bottom: 0; }
/*.info_footer ul li:not(.logo){ position: relative; top: -15px; }*/
.info_footer ul li { position: relative; top: 2px; }
/*.info_footer ul.right li:not(.logo){ top: -10px; }*/
.info_footer .right li{ margin-top: 15px;}
.info_footer .right li.logo{ margin-top: 10px;}
.info_footer .fa.fa-2x{ position: relative; top: 4px;}
  
.btn-whatsapp-absolute{ position: fixed; z-index: 9999; border-radius: 4px 4px 0 0 ; right: 2rem; bottom: 0; color: #FFFFFF;background-color: #25D366;padding: 7px 10px 7px 10px; border-radius: 25px; margin-bottom: 60px; }
.btn-whatsapp-absolute:hover { color: #FFFFFF; }

/* Excepciones responsive */

    @media (min-width: 768px) { 
        
    }
    @media (min-width: 979px) { 
        .list-inline > li.visible-md { display: inline-block !important; }
        .list-inline > li.hidden-xs { display: inline-block !important; }
    }
    @media (min-width: 1200px) { 
        .list-inline > li.visible-lg { display: inline-block !important; }
    }
    
    /* Large desktop */
    @media (max-width: 1200px) { 
        #specialoffers .panel-body{ padding: 10px; }
    }
     
    /* Portrait tablet to landscape and desktop */
    @media (min-width: 768px) and (max-width: 979px) { 
        .list-inline > li.hidden-xs { display: inline-block !important; }
/*        .info_footer ul li:not(.logo){ top: 15px; }
        .info_footer ul.right li:not(.logo){ top: 5px;}*/
        #wrap-contenido{ padding: 0 20px 40px; }
    }
     
    /* Landscape phone to portrait tablet */
    @media (max-width: 767px) { 
        .info_footer ul li{ display: block; }
/*        .info_footer ul li:not(.logo){ top: 5px;}*/
        .info_footer .right li{ margin-top: 0;}
/*        .info_footer ul.right li:not(.logo){ top: -5px;}*/
        #wrap-menu-principal{ margin-top: 25px; }
        #wrap-menu-principal .navbar-brand{ padding-top: 15px; }
        #wrap-menu-principal .navbar-collapse{ max-height: 999px;}
        #caja-menu-principal.collapse:not(in){ display: block;}
        #wrap-contenido{ padding: 0 20px 40px; }
     }
     
    /* Landscape phones and down */
    @media (max-width: 480px) { 
        .oferta-single .img_oferta_principal{height: 150px}
    }
    
    @media (max-width: 350px) { 
        .media-body { display: block; width: 100%;}
    }

  
/* Cookies */
#cookiesdirective{position: absolute; bottom: 0px; left: 0px; width: 100%; height: auto; background: none repeat scroll 0% 0% rgb(50, 50, 50); opacity: 0.8; color: rgb(220, 220, 220); font-family: helvetica; font-size: 13px; text-align: center; z-index: 1000;padding:10px}
#cookiesdirective a{color:#cc0000;font-weight:bold;} 

/* Videos Responsive */
.videowrapper {
    float: none;
    clear: both;
    width: 100%;
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 25px;
    height: 0;
}
.videowrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}