/* Reset */
html{overflow-x: hidden; height: 100%;}
*::before, *::after{box-sizing:border-box;}
body{background:#f389d9 url(../img/body/bg-body.jpg) no-repeat top center; font-size:14px; font-family: 'Fredericka the Great', cursive; color: #000; padding: 40px 0 0 0; margin: 0;}
body.no-scroll{overflow: hidden; height: 100%;}
h1,h2,h3,h4,h5,h6, p{margin: 0; padding: 0;}
a{outline:0; color: #000; text-decoration: none;}
a:active{outline:0;}
a:hover{text-decoration:none;}
a:focus{outline:0;}
ul{list-style-type:none; margin: 0; padding: 0;}
img {border: 0 none;height: auto; max-width: 100%;vertical-align: middle;}


/* Mensaje horizontal para moviles */
.msg-horizontal{background: #222; width: 100%; height: 100%; position: absolute; display: none; text-align: center;}
.msg-horizontal .logo{position: relative; float: left; width: 100%; text-align: center; margin-top: 13%;}
.msg-horizontal .logo img{width: 45%;}
.msg-horizontal p{color: #ccc; display: block; float: left;width: 100%; font-size: 20px; margin-top: 35px;}


/* Contenedores generales */
.container{width: 1100px; margin: 0 auto;}
.bloque{float: left; width: 100%;}


/* Cabecera */
header{margin-bottom: 50px;}
header .logo{background:#fff; width:600px; height:auto; border-radius:  950px / 200px; -webkit-border-radius:950px / 200px; padding: 20px; text-align: center; margin: 0 auto;}
.abre-lateral{display: none;}


/* Menu */
nav ul li{display: inline-block; float: left; width: 24.3%; text-align: center; margin-right: 10px;}
nav ul li:last-child{margin-right: 0;}
nav ul li a{color: #000; font-size: 17px; -webkit-box-shadow: 0px 1px 3px 0px rgba(50, 50, 50, 0.45);
-moz-box-shadow:    0px 1px 3px 0px rgba(50, 50, 50, 0.45);
box-shadow:         0px 1px 3px 0px rgba(50, 50, 50, 0.45); font-weight: 600; text-transform: uppercase; display: block; border-radius: 10px; padding: 20px 0; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,a5c86d+8,a5c86d+27,749b33+100 */
background: rgb(188,205,210); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(188,205,210,1) 0%, rgba(111,144,161,1) 18%, rgba(111,144,161,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(188,205,210,1) 0%,rgba(111,144,161,1) 18%,rgba(111,144,161,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(188,205,210,1) 0%,rgba(111,144,161,1) 18%,rgba(111,144,161,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bccdd2', endColorstr='#6f90a1',GradientType=0 ); /* IE6-9 */

}
nav ul li a:hover{color: #fff;}
nav ul li.current a{color: #fff;}


/* Menu lateral */
#menu-lateral .logo-menu{padding: 15px 0; position: relative; background: #000;}
#menu-lateral .logo-menu img{margin-left: 15px; width: 70%;}
#menu-lateral .logo-menu .txt{display: block; background: #000; color: #fff; text-align: center; font-weight: 600; text-transform: uppercase; padding: 5px;}
#menu-lateral .logo-menu .txt:hover{color: #00aeef;}
#menu-lateral .logo-menu .txt span{font-size: 11px; color: #666;}
#menu-lateral .logo-menu .lupa{position: absolute; top: 37%; right: 0; left: 0; margin: 0 auto; opacity: 0; transition: all 0.5s ease 0s;}
#menu-lateral .logo-menu:hover .lupa{opacity: 1;}
#menu-lateral .social-copy{float: left; display:block; width: 100%; background: #000;}
#menu-lateral .social-copy .inner{padding: 20px;}
#menu-lateral .social-copy a{margin-right:10px; display: inline-block; float: left; color: #fff; font-size: 19px;}
#menu-lateral .social-copy p{font-size: 12px; font-family: 'Slabo 27px', serif; line-height: 15px; color: #fff; display: block; float: left; width: 100%; margin: 0px 0 20px 0;}
#menu-lateral .cierra{text-align: right; padding:0; background: #000; display: none;}
#menu-lateral .cierra i{background: #333; color: #fff; padding: 5px; font-size: 28px;}

.cortina{background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0; display: none; height: 100%; left: 0; position: fixed; top: 0; transition: all 0.5s ease 0s; width: 100%; z-index: 999999;}
.cortina.visible{display: block;}


/* Contenido */
.contenido{margin: 40px 0;}
.contenido.oferta{text-align: center;}
.contenido .inner{padding: 0 30px;}
.contenido .inner-oferta{padding: 10px; background:#fff; margin-top: 40px;}
.contenido h2{margin-bottom: 25px; font-size: 25px; text-transform: uppercase;}
.contenido .texto{font-size: 17px; font-family: 'Slabo 27px', serif; line-height: 25px;}
.contenido .texto h2{margin-bottom: 25px; font-size: 30px; text-transform: uppercase; font-family: 'Fredericka the Great', cursive;}
.contenido .texto h3{margin-bottom: 10px; margin-top: 45px; font-size: 22px; text-transform: uppercase;}
.contenido .texto h3 i{margin-right: 10px; color: #fff;}
.contenido .texto h4{font-size: 22px; margin-bottom: 10px; margin-top: 45px; text-transform: uppercase; color: #fff;}
.contenido .texto .btn{text-decoration: underline; font-size: 20px;}
.contenido .texto .btn:hover{}
.contenido .texto p{margin-bottom: 20px;}
.contenido .texto a{font-weight: 600; text-decoration: underline;}
.contenido .texto i{margin-right: 10px;}
.contenido .texto ul{margin: 0 0 20px 20px;}
.contenido .texto .foto{float:left; width: 35%; margin-top: 10px; border: 5px solid #fff;}
.contenido .texto .text-right{float: right; width: 60%; margin: 5px 0 20px 0;}


/* Calendario */
.contenido .calendario{margin-top: 50px;}
.contenido .calendario h2{font-size: 20px; margin-bottom: 15px; color: #CC167A;}
.contenido .calendario h2 i{margin-right: 10px;}


/* Caja temas */
.caja-temas{background:#749b33; border: 5px solid #000; margin-top: 50px;}
.caja-temas .in{padding: 0 15px;}
.caja-temas .tema{display: inline-block; width: 22.7%; text-align: center; margin: 25px 10px;}
.caja-temas .tema:last-child{border:0;}
.caja-temas .tema .foto{margin-bottom: 10px; border: 2px solid #fff;}
.caja-temas .tema h3{text-transform: uppercase; font-size: 20px; margin-bottom: 15px;}
.caja-temas .tema .info{color: #fff; font-family:'Slabo 27px', serif; font-weight: 600;}
.caja-temas .tema .info i{margin-right: 5px;}
.caja-temas .tema a:hover{text-decoration: underline;}


.caja-dos .tema{display: inline-block; width: 22.7%; text-align: center; margin: 25px 20px 0 0;}
.caja-dos .tema:last-child{border:0;}
.caja-dos .tema .foto{margin-bottom: 10px; border: 2px solid #fff; width: 100%;}
.caja-dos .tema h3{text-transform: uppercase; font-size: 20px; margin-bottom: 15px;}
.caja-dos .tema h3 a{text-decoration: none;}
.caja-dos .tema .info{color: #fff; font-family:'Slabo 27px', serif; font-weight: 600;}
.caja-dos .tema .info i{margin-right: 5px;}
.caja-dos .tema a:hover{text-decoration: underline;}


/* Contenido largo temas */
.contenido.largo h2{text-align: center;}
.contenido.largo .temas{margin-top: 20px;}
.contenido.largo .temas .tema{display: inline-block; width: 33%; text-align: center; margin: 25px 0;}
.contenido.largo .temas .tema .in{padding: 0 20px;}
.contenido.largo .texto{text-align: center; margin-top: 20px;}


/* Contacto */
.mapa{border: 5px solid #fff; margin-top: 20px; display: block; background: #fff; border-bottom: 1px solid #fff;}



/* Footer */
footer{background: #000; height: auto; color: #ccc; font-family: 'Slabo 27px', serif; padding: 30px 0; text-align: center; font-size: 15px;}
footer p{display: block; margin-bottom: 10px;}
footer p.social a{display: inline-block; margin: 0 3px; font-size: 20px;}
footer a{color: #ccc;}
footer a:hover{text-decoration: underline;}



/* Desktops and laptops ----------- */
@media only screen and (min-width : 1280px) and (max-width: 1440px) {

}

@media only screen and (min-width : 1366px) and (max-width: 1440px) {

}

@media only screen and (min-width : 1440px) and (max-width: 1440px) {

}


@media only screen and (min-width : 1600px) and (max-width: 1680px) {

}