@charset "utf-8";

/*#capa {content:""; display:block; position:fixed; top:0; bottom:0; left:0; right:0; background:rgba(136,0,215,0.20); z-index:-1;}*/
.cell {width:auto; height:100%; display:table-cell; vertical-align:inherit;}
* {box-sizing:border-box;}
body #container > .container {display:table !important;}
body #container > .container > .margin_menu {display:table-cell !important; width:200px; height:100%; vertical-align:top;}
body #container > .container > .content_container {display:table-cell !important; width:80%; height:100%; vertical-align:top; padding:10px; background:rgba(255,255,255,0.80); margin-bottom:15px;}
body.mobile #container > .container > .margin_menu {display:none !important;}
body.mobile #container > .container > .content_container {width:100%;}
h1 {width:100%; height:auto; display:table; padding:15px; border-bottom:2px solid #9100B1; font-weight:bold; color:#9100B1;}
body.mobile h1 {padding:10px; font-size:22px;}
input, select {width:100%; height:30px; padding:5px; border:1px solid #c3c3c3; color:#212121;}
textarea {width:100%; height:100px; padding:5px; border:1px solid #c3c3c3; resize:none; color:#212121;}

/* Calendario */
#Calendario {width:100%; height:auto; padding:0; background:#eaeaea; text-align:center; font-size:18px; margin:20px auto; border:0px solid #212121;}
#Calendario td {width:14%; height:auto; border:1px solid #c3c3c3;}
#Calendario td > button {width:100%; height:100%; display:block; padding:10px; background:0; border:0; line-height:16px;}
#Calendario thead td {padding:5px;}
#Calendario select {cursor:pointer; width:auto; height:40px; padding:5px 10px; border:0; background:none;}
#Calendario a {cursor:pointer; display:inline-block; height:auto; padding:10px; border:0; background:none;}
#Calendario .Pasado {background:#ccc;}
#Calendario .Solicitado {background:#EBC500;}
#Calendario .Ocupado {background:#BB0003; color:#fafafa;}
#Calendario tfoot {font-size:14px;}
#Calendario .horario {font-size:12px; line-height:13px; background:none;}
#Calendario .horario:before {background:none !important;}

//#Calendario.mobile {width:100%; height:auto; padding:0; background:#eaeaea; text-align:center; font-size:14px; margin:10px auto;}
//#Calendario.mobile td {width:14%; height:auto; border:1px solid #c3c3c3;}
//#Calendario.mobile td > button {width:100%; height:auto; padding:5px;}
//#Calendario.mobile select {cursor:pointer; width:auto; height:30px; padding:2px; border:0; background:none; font-size:14px;}
//#Calendario.mobile a {cursor:pointer; display:inline-block; height:auto; padding:2px; border:0; background:none; font-size:14px;}
//#Calendario.mobile .horario {display:none;}

/* Bloqueo */
#WrapBloqueo {display:none; width:100%; height:100%; position:fixed; background:rgba(0,0,0,0.60); top:0; left:0; padding:10px; z-index:100005;}
#WrapBloqueo > .cerrar {display:block; width:35px; height:35px; position:absolute; top:0; right:0; color:#fff; border:0; background:none; font-size:20px;}
#WrapBloqueo > #ContenidoBloqueo {display:table-cell; width:100%; height:100%; vertical-align:middle; text-align:center; color:#fff;}

/* Reservar Dia */

#WrapFormReservarDia {width:500px; height:auto; display:inline-table; background:#eaeaea;}
#WrapFormReservarDia > #FormReservarDia {width:100%; height:auto; display:table; padding:10px;}
#WrapFormReservarDia table {width:100%; height:auto; display:table; padding:10px; color:#212121; text-align:left;}
#WrapFormReservarDia table td {padding:2px;}

body.mobile #WrapFormReservarDia {width:100%;}

/* Galeria */
#Galeria {width:100%; height:auto; display:table; padding:10px; text-align:center;}
#Galeria > .img {width:200px; height:200px; display:inline-block; margin:5px; background:center center no-repeat; background-size:cover; border:5px solid #fafafa; cursor:pointer;}

#WrapGaleria {display:inline-table; background:#fff; padding:5px; max-width:100%;}
#WrapGaleria > img {display:block; max-width:100%; max-height:100%;}
#WrapGaleria > .controls {display:table; position:absolute; width:100%; height:100%; vertical-align:middle;}
#WrapGaleria > .controls button {display:block; height:30px; width:30px; background:#fff; border:1px solid #c3c3c3; color:#a1a1a1; margin:5px; border-radius:50%;}

body.mobile #WrapGaleria > .controls button {height:20px; width:20px; font-size:10px;}

/* Nuevo */

/* Header */
@charset "utf-8";

body {background:#fff; font-family:open-sans, sans-serif;}
.left {float:left;}
.right {float:right;}
.cell {width:auto; height:100%; display:table-cell; vertical-align:inherit;}

/* Header */
#header {background:#fff; border-width:0 0 1px; border-radius:0; margin-bottom:0; z-index:1000;
-moz-box-shadow: 0 8px 8px -6px rgba(0, 0, 0, 0.15); -webkit-box-shadow: 0 8px 8px -6px rgba(0, 0, 0, 0.15); -o-box-shadow: 0 8px 8px -6px rgba(0, 0, 0, 0.15); box-shadow: 0 8px 8px -6px rgba(0, 0, 0, 0.15);}
#header #logo {width:200px; height:100px; background:url(../images/LogoChocolate.png) no-repeat center center; background-size:contain; display:block; padding:10px;}

.navbar-nav {display:table; float:right;}
.navbar-nav>li {height:100px; display:table;}
.navbar-nav>li>a {height:80px; display:table-cell; vertical-align:middle;}
.navbar-nav>li>a:hover {background:#f58634 !important; color:#fff !important;}
.navbar-nav>li.espcontacto {padding:0 10px;}
.navbar-nav>li.espcontacto span {width:100%; height:auto; display:table; padding:0 0 3px; text-align:center; color:#7c7c7c;}
.navbar-nav>li.espcontacto span.tel {width:100%; height:auto; display:table; padding:0px; font-size:22px; color:#3A7A8B; padding-top:15px; font-family:open-sans, sans-serif; font-weight:400; line-height:18px;}
.navbar-nav>li.espcontacto a {width:100%; height:auto; border:1px solid #c3c3c3; display:table; padding:3px; text-align:center; text-transform:uppercase; font-size:12px; font-weight:bold;}
.navbar-nav>li.espcontacto a:hover {background:none !important; color:#777 !important;}
.navbar-nav>li.espcontacto a.selected {background:#015e6d; color:#fff;}

@media screen and (max-width: 1000px) {
#header #logo {width:130px !important; height:100px !important; padding:5px; margin-left:15px;}
#contenedor_header {width:100% !important;}
.navbar-nav>li.espcontacto {padding:0 5x;}
}

#header.mobile {height:auto;}
#header.mobile #logo {height:50px !important; width:100px; margin-left:10px;}
.navbar-nav.mobile {display:table; width:100%; float:none;}
.navbar-nav.mobile>li {height:auto; display:table; width:100%; text-align:center; min-width:80px;}
.navbar-nav.mobile>li>a {height:auto; display:table-cell; text-align:left; vertical-align:middle;}
.navbar-nav.mobile>li.espcontacto {display:none;}

/* Wrap */
#container {width:100%; height:auto; display:table; margin:15px auto;}

/* Banners */
#banners {width:100%; height:auto; padding:0px; border-bottom:10px solid #f58634; overflow:hidden;}
#banners.mobile {border-bottom:5px solid #f58634;}
#banners .banner {position:relative;}
#banners .banner.mobile {position:relative; height:300px;}
#banners .banner:before {content:""; display:block; position:absolute; top:0; bottom:0; left:0; right:0; background:none;
	-moz-transition-property: all;
    -moz-transition-duration: 300ms;
    -moz-transition-timing-function: ease-out;
    -moz-transition-delay: 20ms;
    /* Chrome / Safari */
    -webkit-transition-property: all;
    -webkit-transition-duration: 300ms;
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-delay: 20ms; 
    /* Opera */
    -o-transition-property: all;
    -o-transition-duration: 300ms;
    -o-transition-timing-function: ease-out;
    -o-transition-delay: 20ms;
    /* Default */
    transition-property: all;
    transition-duration: 300ms;
    transition-timing-function: ease-out;
    transition-delay: 20ms;
}

#banners .banner.filtro:before {background:rgba(245,135,52,0.60) center center no-repeat;}
#banners .banner img {width:100%;}
#banners .banner.mobile img {width:auto; max-height:100%;}

/* Banners Portada */
#opciones_portada {width:100%; min-height:100px; display:table; position:absolute; z-index:1001; display:none; border-bottom:10px solid #f58634; background:none;}
#opciones_portada.fondo {background:url(../images/web/banner_s1.png) center center no-repeat; background-size:40%;}
#opciones_portada.selected {background-color:rgba(255,255,255,0.50);}
.contenedor {width:900px; height:100%; display:table-cell;}
/*.col {width:auto; display:table-cell;}*/
.contenedor #eventos {width:100%; padding:10px; height:80%; display:block; text-align:center;}
.contenedor #eventos span {display:block; float:left; background:center center no-repeat; background-size:cover; position:relative;}
.contenedor #eventos span:before {content:""; display:block; position:absolute; top:0; bottom:0; left:0; right:0; background:rgba(245,135,52,0.60) center center no-repeat;}
.contenedor #eventos span:hover:before {background-color:transparent;}
.contenedor #tipo_anuncio {width:100%; padding:10px; height:20%; display:table; text-align:center;}
.contenedor #eventos span.boda:before{background-image:url(../images/web/texto_boda.png); background-size:85%;}
.contenedor #eventos span.posada:before{background-image:url(../images/web/texto_posada.png); background-size:85%;}
.contenedor #eventos span.xvanios:before{background-image:url(../images/web/texto_xvanios.png); background-size:85%;}
.contenedor #eventos span.bautizo:before{background-image:url(../images/web/texto_bautizo.png); background-size:85%;}
.contenedor #eventos span.cumpleanios:before{background-image:url(../images/web/texto_cumpleanios.png); background-size:45%;}
.contenedor #eventos span.baby:before{background-image:url(../images/web/texto_baby.png); background-size:85%;}
.contenedor #eventos span.bs50:before{background-size:45% !important;}

#opciones_portada.mobile.fondo {background-size:60%;}

/* Footer */
footer {width:100%; height:auto; display:table; background:#f58634; margin-top:00px; padding:10px;}

/* Contacto */
.contacto {width:100%; height:auto; display:table; background:url(../images/web/muebleviva.jpg) center center no-repeat; background-size:cover; padding:30px 0 20px 0; margin-top:0px;}
.contacto input {width:70%; height:35px; display:table; margin-bottom:15px; border:1px solid #c3c3c3; padding:5px;}
.contacto input:focus, .contacto textarea:focus {outline:2px solid #f58634;}
.contacto textarea {width:70%; height:80px; display:table; margin-bottom:15px; border:1px solid #c3c3c3;}
.contacto input.enviar {width:auto; height:auto; display:table; margin-bottom:15px; border:1px solid #c3c3c3; padding:0; background-image:url(../images/iconos/icono_email_bco.png);}

#form_contacto {display:table-cell; width:50%; height:auto; text-align:center; vertical-align:top; padding:10px; float:right;}
#form_contacto #FormTelefonos {width:100%; text-align:left; display:table; margin-top:70px; font-size:16px;}
#form_contacto #FormTelefonos > span {padding:5px; display:table; width:100%; height:auto; padding-left:30px; background:center left no-repeat; background-size:20px;}
#form_contacto #FormTelefonos > span > b {display:table-cell; vertical-align:middle; font-weight:normal;}
#form_contacto #FormTelefonos > span.telefono {background-image:url(../images/iconos/icono_telefono.png);}
#form_contacto #FormTelefonos > span.ubicacion {background-image:url(../images/iconos/icono_ubicacion.png);}

#imagen_contacto {display:table-cell; width:50%; height:auto; text-align:center; vertical-align:top; padding:10px; float:left;}
#imagen_contacto p {width:50%; display:table; height:auto; padding:10px 30px; margin:10px auto; text-align:left; font-size:16px; background:url(../images/web/flechaatencion.png) center right no-repeat;}

.contacto.mobile {background:none; padding:0; border-top:1px solid #6B6B6B; margin-top:0;}
.contacto.mobile input, .contacto.mobile textarea {width:100%; margin-bottom:5px}
.contacto.mobile input.enviar {width:auto; margin-bottom:10px;}
#form_contacto.mobile {display:table; width:100%; height:auto; text-align:center; vertical-align:top; padding:20px;}
#form_contacto.mobile #FormTelefonos {margin-top:10px; font-size:14px;}
#imagen_contacto.mobile {display:table; width:100%; height:auto; text-align:center; vertical-align:top; padding:10px; background:url(../images/web/muebleviva.jpg) center center no-repeat; background-size:cover;}
#imagen_contacto.mobile p {width:90%; padding:5px 20px; margin:5px auto;}

/* Clases */
.animado {
	-moz-transition-property: all;
    -moz-transition-duration: 300ms;
    -moz-transition-timing-function: ease-out;
    -moz-transition-delay: 20ms;
    /* Chrome / Safari */
    -webkit-transition-property: all;
    -webkit-transition-duration: 300ms;
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-delay: 20ms; 
    /* Opera */
    -o-transition-property: all;
    -o-transition-duration: 300ms;
    -o-transition-timing-function: ease-out;
    -o-transition-delay: 20ms;
    /* Default */
    transition-property: all;
    transition-duration: 300ms;
    transition-timing-function: ease-out;
    transition-delay: 20ms;
}