@charset "utf-8";
/* CSS Document */

/* Custom foundation.css */
.reveal-modal, dialog { padding:1.5rem; }
#institucionesModal, #funcionesModal { padding:1.5rem !important;  }
/*.reveal-modal, .reveal-modal-bg { position: fixed; overflow: scroll; }*/
[data-abide] .error small.error, [data-abide] .error span.error, [data-abide] span.error, [data-abide] small.error { font-size: 1.2rem; }
/* *** */

.fb-like-box, .fb-like-box > span, .fb-like-box > span > iframe { width: 100% !important; }

.panel {
    border: 0;
    padding: 1.5rem 1rem;
    margin: 0;
}

h1.logo {
    margin: 2rem 0 1.5rem 0;
}

h1.logo a img {
    display: inline-block;
    width: 90%;
    max-width: 250px;
}

.copy {
    display: inline-block;
    font-size: 1.3rem;
    line-height: 1.3rem;
    text-transform: uppercase;
    max-width: 250px;
    margin: 0 0 2rem 0;
}

.colors-line {
    width: 100%;
    overflow: hidden;
}

.colors-line ul {
    width: 100%;
}

.colors-line ul li {
    display: block;
    float: left;
    position: relative;
}

.colors-line.l18 ul li {
    width: 5.555%;
    height: 50px;
}

.colors-line.l5 ul li {
    width: 20%;
    height: 100px;
}

a.palabras-director {
    display: block;
    font-size: 1.4rem;
    line-height: 1.4rem;
}

a.palabras-director .inner-conent {

}

.btn {
    font-size: 1.2rem;
    line-height: 1.4rem;
    padding: .8rem;
    text-transform: uppercase;
    color: white;
    display: inline-block;
    margin: 5px;
}

.func-details .btn {
    margin-left: 0
}

.btn.outline-orange {
    border: 1px solid #e95d16;
    background: transparent;
    color: white;
}

.btn.outline-white {
    border: 1px solid #FFF;
    background: transparent;
    color: white;
}

.panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6, .panel p, .panel li, .panel dl { color: white; }

/* NAVIGATION */

ul.nav li {

}

ul.nav li a,
span.off-canvas-menu-title {
    display: block;
    font-size: 1.5rem;
    line-height: 1.7rem;
    color: #8b7a74;
    text-transform: uppercase;
    padding: 1.4rem .5rem;
}

ul.nav li a:hover {
    background-color: #f4f3f0;
}

.left-off-canvas-menu {
    background: #f4f3f0;
}

.left-off-canvas-menu .nav li {
    border-bottom: 1px solid white
}

.left-off-canvas-menu .nav li a,
span.off-canvas-menu-title {
    padding: 1rem;
}

span.off-canvas-menu-title a {
    font-size: 2rem !important;
}

.left-off-canvas-menu .nav li a:hover {
    background: white;
}


span.off-canvas-menu-title a:hover {
    background: transparent !important;
}


/* OBRAS */

.obras {
}

.obras.featured {
}

.featured .swiper-container,
.featured .swiper-slide {
    background: black;
}


/*.swiper-slide { opacity : 0; transition: all .5s ease; }*/

.obra {
    position: relative;
    background: black;
}

.featured > .obra-img {
    display: block !important;
    vertical-align: auto !important
}

.obra-detalle {
    position: relative;
}
.featured .obra-header,
.obra-detalle .obra-header {
    position: absolute;
    top: 0;
    bottom: 0;		/* Para que ocupe todo el alto de la diapo, porque sino no funca el swipe en moviles ¿? */
    left: 0;
    padding: 10px 15px;
    z-index: 5;
    width:100%;
}

.featured h1.obra-title,
.obra-detalle h1.obra-title {
    font-family: 	"ProximaNova";
    font-size: 		3rem;
    line-height: 	3.2rem;
    font-weight: 	400;
    color:			white;
    margin: 		.5rem 0 1.5rem 0;
}


.featured .obra-footer,
.obra-detalle .obra-footer {
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 10px 15px;
    z-index: 5;

    padding-top: 100px;

    /* can be treated like a fallback */
    background-color: transparent;

    /* will be "on top", if browser supports it */
    background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1) 80%);

    /* these will reset other properties, like background-position, but it does know what you mean */
    /*
    background: red;
    background: linear-gradient(red, orange);*/
}

.actualmente {
    margin: 0 0 0 .5rem;
}

.featured .func-cartel,
.obra-detalle .ver-escuela {
    position: absolute;
    right: 15px;
    bottom: 10px;
}


.obras-nav {
/*	display: table;*/
}

.obras-nav li {
    text-align: center;
    display: table !important;
    table-layout: fixed;
    overflow: hidden;
}

.obras-nav li span {
    font-size: 1rem;
    line-height: 1rem;
    color: white;
    padding: .5rem;

    width: 100%;
    height: 100%;

    cursor: pointer;

    display: inline-block;
    vertical-align: middle;

    display: table-cell;
    vertical-align: middle;

    /*text-indent: -9999px;*/
}

.swiper-active-switch {
    /*box-shadow: inset 0 0 0 2px white;*/
    background: black !important;
}

.func-para-escuelas {
    height: 280px;
    background: url(../img/funciones-para-escuelas.jpg) center center no-repeat;
    background-size: cover;
    text-align: center;
    padding: 1.5rem 2rem;
    position: relative;
}

.quiero-escuelas {
    position: absolute;
    bottom: 15px;
    width: 80%;
    left: 10%;
}

#escuelas .reserva-btn,
#escuelas .fechas-programadas {
    display: block;
}

.modalForm {
    padding: 1rem;
}

.modalForm label {
    color: white;
    text-transform: uppercase;
}

.modalForm input,
.modalForm textarea {
    color: black;
    background: white !important;
    border: 1px solid #cac4b2 !important;
}

/* Programacion */

.program-filters,
.critica-filters {
    float: none;
    margin: 1rem 0 !important;
    display: inline-block;
}

.program-filters li,
.critica-filters li {
    float: left;
    margin: 2px;
}

.program-filters li a,
.critica-filters li a {
    font-size: 1rem;
    line-height: 2.4rem;
    display: block;
    border: 1px solid white;
    text-decoration: none !important;
    text-transform: uppercase;
    text-align: center;
    padding: 3px;
    display: table-cell;
    vertical-align: middle;
    height: 2.4rem;
    /*width: 65px;*/
}


.critica-filters li a {
    border-color: #e95d16;
    color: #e95d16;
}

.program-filters li a.active,
.critica-filters li a.active {
    background: white;
    color: #e95d16;
}

.critica-filters li a.active {
    background: #e95d16;
    color: white;
}


.sala-header {
    padding: .7rem 0 0;
    border-bottom: 1px solid #e95d16;
    margin-bottom: 1rem;
}

.sala-info {
    float: right;
    margin-top: 2rem;
}

.funcion {
    padding: 7px 0 10px;
    border-bottom: 1px solid #999;
    margin-bottom: 15px;
}

.funcion * {
    color: #958968
}

.funcion a {
    color: #e95d16  !important
}

.func-date {
    width: 120px;
    float: left;
}

.title_month {
    border-bottom:  2px solid #958968;
    margin-bottom: 10px;
    margin-top: 20px;
}
.title_month h3 {
    color: #958968;
    text-transform:  uppercase;
    margin-bottom: 5px;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
}

.title_month h3:hover {
    color: #e95d16;
}

.title_month h3 i {
    left: 10px;
}

.func-date p {
    font-size: 1.3rem;
    line-height: 1.4rem;
}

.func-date p span.hour {
    font-size: 1.7rem;
    display: block;
    margin: .5rem 0;
}

.func-thum {
    width: 120px;
    float: right;
}

.func-thum img {
    width: 100%;
}

.func-details {
    padding-top: 60px;
}

.func-date,
.func-details .func-sala,
.func-details .func-publico {
    text-transform: uppercase;
}

.func-details .func-publico.adultos,
.func-details .agotada {
    background: #e95d16;
    padding: 0 5px;
    color: white;
}

.func-details .agotada {
    margin-left: 8px;
}

.func-details h4 {
    font-family: "ProximaNovaBold";
    margin: .5rem 0;
}

.sala-nombre {
    color:#e95d16 !important;
    font-family: "ProximaNova";
    font-size: 1.7rem;
    margin-left: 0 !important;
    position: relative;
}

.sala-ubicacion {
    display: inline-block;
    vertical-align: top;
    position: relative;
    margin: 1.5rem;
}

.sala-ubicacion span {
    font-size: 2em;
}

.mje-sin-funciones *,
.mje-fechas * {
    font-size: 18px;
    line-height: 2.2rem;
    color: #958968 !important;
}

.mje-sin-funciones a:hover,
.mje-fechas a:hover {
    text-decoration: underline
}


#messageModal p {
    font-size: 18px !important;
    line-height: 22px !important;
}

#messageModal .info-icon span {
    font-size: 5rem;
}


/* Modal Obra */
/*#obraModal .swiper-container { height: 406px; }*/

.reveal-modal h4 {
    margin: 0.5rem 0 1.5rem;
}

.reveal-modal .close-reveal-modal,
dialog .close-reveal-modal,
.next-slide {
    position: absolute;
    color: #e95d16;
    font-size: 3.6rem;
    right: 20px;
    z-index: 9999;
}

.reveal-modal .close-reveal-modal,
dialog .close-reveal-modal {
    top: 20px;
}

.reveal-modal .close-reveal-modal:hover,
dialog .close-reveal-modal:hover,
.next-slide:hover {
    color: white;
}

.next-slide {
    bottom: 70px;
}

.bottom-close-reveal {
    top: auto !important;
    bottom: 20px;
    color: white !important;
}

.obra-ficha {
    position: relative;
}

/* Obras */

#obrasMosaic {
    background: black
}

#obrasMosaic .isotope-item {
    padding: 15px 0 10px 0;
}

#obrasMosaic .isotope-item.brown-bgr { background: linear-gradient(#000, #000 80%, #958968 80%) !important; }
#obrasMosaic .isotope-item.turquoise-bgr { background: linear-gradient(#000, #000 80%, #00a095 80%) !important; }
#obrasMosaic .isotope-item.pink-bgr { background: linear-gradient(#000, #000 80%, #d20072 80%) !important; }
#obrasMosaic .isotope-item.red-bgr { background: linear-gradient(#000, #000 80%, #c71625 80%) !important; }
#obrasMosaic .isotope-item.violet-bgr { background: linear-gradient(#000, #000 80%, #773e8c 80%) !important; }
#obrasMosaic .isotope-item.ocre-bgr { background: linear-gradient(#000, #000 80%, #e1ab00 80%) !important; }
#obrasMosaic .isotope-item.green-bgr { background: linear-gradient(#000, #000 80%, #97bf15 80%) !important; }
#obrasMosaic .isotope-item.orange-bgr { background: linear-gradient(#000, #000 80%, #e95d16 80%) !important; }
#obrasMosaic .isotope-item.yellow-bgr { background: linear-gradient(#000, #000 80%, #fdc400 80%) !important; }
#obrasMosaic .isotope-item.grey-bgr { background: linear-gradient(#000, #000 80%, #cac4b2 80%) !important; }

#obrasMosaic .isotope-item .obra-name {
    height: 80px;
    /*border-bottom: 1px solid white;*/
}

#obrasMosaic .isotope-item .obra-name,
#obrasMosaic .isotope-item .obra-publico {
    display: block;
    margin: 5px 10px;
    text-align: center;
}

#obrasMosaic .isotope-item .obra-name a {
    font-size: 1.8rem !important;
    line-height: 2.2rem !important;
    max-height: 6.6rem;
    overflow: hidden;
    display: block;
}

#obrasMosaic .isotope-item img {
    margin-top: 5px;
}

/* Nuestra Sala */

.anios {
    position: relative;
}

.anios img {
    max-width: 90%;
    margin: 15px 0;
}

.map { width: 100% !important; }


/* Novedades */

.novedad-paginator a {
    font-size: 3.5rem;
}



/* Desargas */


.disco {
    margin: 20px 0;
}

.disco-header {
    margin-bottom: 15px;
    position: relative;
}

.disco-header img {
}

.disco-title {
    position: absolute;
    bottom: 0;
    padding-left: 115px;
    margin: 0;
}

.disco .disco-tracks {
    overflow: hidden;
    /*height: 1px;*/
    transition: all .7s ease;
}

.disco.open .disco-tracks {
    /*height: 100px;*/
}

.disco .tracks-btn {
    margin-left: 0 !important;
}

.descarga {
    margin: 20px 0;
}

.descarga a.download-btn {
    color: whie !important;
    font-size: 3rem;
    margin: 10px 0;
}

.desc-title {
    padding-right: 40px;
}


/* Contacto */

.grecaptcha-badge {
    margin: 20px 0;
    display: inline-block;
}
.contact-wrapper {
}

.contact-wrapper form {
    padding: 15px 0;
}

label.block {
    display: block !important;
    padding: 5px 0 5px 25px;
    font-size: 1.2rem;
    line-height: 1.2rem;
}

input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea, button, .button {
    box-shadow: none;
}

input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, input[type="color"]:focus, textarea:focus {
    box-shadow: none;
    background: white !important;
}

input {
    background: none !important;
    border: 0 !important;
    border-bottom: 1px solid #958968 !important;
    height: 3rem !important;
}

textarea {
    background: none;
    border: 1px solid #958968;
    height: 7rem;
}

::-webkit-input-placeholder {
  color: #958968;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #958968;
}
:-ms-input-placeholder {
  color: #958968;
}
:-moz-placeholder { /* Firefox 18- */
  color: #958968;
}


#response,
#funcForm_response,
#cursosForm_response {

    display: inline-block;
    width: 100%;
    margin-top: 10px;
    text-align: center;
}

#response p,
#funcForm_response p,
#cursosForm_response p {
    display: block;
    padding: 1rem;
}




/* Subsidios */

table.subsidios {
    border: 0;
    margin: 2rem;
}

table.subsidios tr td {
    font-size: 1.2rem;
    line-height: 1.4rem;
    font-family: "ProximaNova", sans-serif;
    font-style: normal;
    font-weight: normal;
    color: #958968;
    text-align: center;
    background: white;
}

table.subsidios tr td img {
    max-width: 100%;
}

/* Premios */

.premio-img {
    float: right;
}

.premio-title {
    margin-top: 6rem;
}

/* WhatsApp */

.whatsapp-widget {
    position: fixed;
    z-index: 1;
    bottom: 20px;
    right: 20px;
    opacity: 0;
    transform: scale(.8);
    transition: all .3s ease-out;
}

.whatsapp-widget.show {
    opacity: 1;
    transform: scale(1);
}

.whatsapp-widget a {
    transition: all .15s ease-out;
}

.whatsapp-widget a:hover {
    transform: scale(1.1);
}

.whatsapp-widget a img {
    width: 80px;
}