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

* {
margin:0;
padding:0;
}


#cartel1 {
    width:100%;
    height:auto;
    margin-top: -7px;
    background-image: url("../imagenes/fondo_iconos.jpg");
    background-repeat: repeat-x;
    float:left;

}

#fondo_evento {
    background-image: url("../imagenes/fondo_eventos.jpg");
     background-position: right bottom;
    background-repeat: no-repeat;
    opacity: 0.9;
}

.titulo {
color:#2E9AFE;
  font-family: 'Josefin Sans', sans-serif;
   font-size: 30pt;
   letter-spacing: 3px
}
.titulo1 {
color:#2E9AFE;
  font-family: 'Josefin Sans', sans-serif;
   font-size: 30pt;
   letter-spacing: 3px
   float: right;
}
.txt {
color: #2ECCFA;
margin-right: 3%;
  margin-left: 3%;
  margin-bottom: 2%;
  font-size: 5em;
font-family: 'Josefin Sans', sans-serif;

}
.txt1 {
color: #2ECCFA;
margin-right: 3%;
  margin-left: 3%;
  margin-bottom: 2%;
  font-size: ;
font-family: 'Josefin Sans', sans-serif;

}
.txt2 {
color: #2ECCFA;
margin-right: 3%;
  margin-left: 3%;
  margin-bottom: 2%;
font-family: 'Josefin Sans', sans-serif;

}

.txt_centrado {
  margin-right: 3%;
  margin-left: 3%;
  font-family: 'Josefin Sans', sans-serif;

}

#activar {
  display: none;
}

#activar ~ .desplegable {
  position: fixed;
  top: 65px;
  left: 0;
  width: 100%;
  max-height: 30px;
  overflow: hidden;
  text-align: center;
  transition: max-height 0.8s linear;
  z-index: 1;
}

#activar ~ .desplegable .contenido {
  width: 100%;
  max-height: 0;
  overflow: hidden;
  padding: 0 20px;
  border: 0;
  box-sizing: border-box;
  color: #fff;
  background: #000;
}

.label {
  position: relative;
  width: 200px;
  margin: 0 auto;
  padding: 5px 20px;
  line-height: 30px;
  font-size: 14px;
  box-sizing: border-box;
  color: #000;
  background: #FF0000;
  border-radius: 0 0 20px 20px;
  text-align: center;
  font-family: Oswald;
  cursor: pointer;
}

.boton_personalizado{
	padding-left:1%;
	padding-right:1%;
    text-decoration: none;
   text-align: center;
    font-weight: 900;
    font-size: 20px;
    color: #585858;
    background-color: #ffffff;
    border-radius: 0px;
    border: 2px solid #2e9afe;
	opacity:0.7;
	}

	
#activar ~ .desplegable .label:before {
  content: "+ INFO";
}

#activar:checked ~ .desplegable,
#activar:checked ~ .desplegable .contenido {
  max-height: 100%;
}

#activar:checked ~ .desplegable .contenido {
  padding: 30px 20px;
}

#activar:checked ~ .desplegable .label:before {
  content: "CERRAR";
}

/* Sólo formato para contenido */



.cabecera {
  width: 100%;
  height: 0;
  padding-bottom: 35%;
  overflow: hidden;
  position: relative;
}

header img {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: auto;
  margin: auto;
  padding: 0;
}

section {
  padding: 20px 40px;
  text-align: left;
}

section img {
  width: 100%;
  height: auto;
  margin: 0 0 10px 0;
}
h1 {
  display: block;
  margin: 10px auto 0;
  padding: 10px;
  text-align: center;
  font-size: 30px;
  line-height: 32px;
  letter-spacing: -2px;
  font-weight: bold;
  box-sizing: border-box;
}

ul.iconmenu {
  margin: 0 auto;
  padding: 0;
  text-align: center;
  font-size: 0;
}

ul.iconmenu li {
  position: relative;
  display: inline-block;
  overflow: hidden;
}

ul.iconmenu li a {
  text-decoration: none;
  color: orange;
  padding: 0 10px;
  font-family: 'Josefin Sans', sans-serif;
  font-size: 26px;
  line-height: 26px;
  box-sizing: border-box;
}

ul.iconmenu li a.blanco {
  color: #FFFFFF;
}

ul.iconmenu li a.faface {
  color: #3C599F;
}

ul.iconmenu li a.fagoog {
  color: #DA2713;
}

ul.iconmenu li a.fatwit {
  color: #5DD7FC;
}

ul.iconmenu li a:hover {
  color: #BDBDBD;
}

#caja_fondo{
  width:100%;
    background-color: #F2F2F2;
    float:left;

}

#caja1{
  width:auto;
   margin-right: 3%;
  margin-left: 3%;
  margin-bottom: 3%;
    text-align: left;
    background-color: #F2F2F2;
    float:left;

}

#texto{
width:60%;
  height: auto;
  display: inline-block;
  vertical-align: top;
  float:left;
}
#caja2{
  width:85%;
  height: auto;
   margin-right: 3%;
 margin-left: 6%;
  margin-bottom: 3%;
    text-align: left;
    background-color: #FFFFFF;
   float:left;
    border-bottom-color: #CCC;
   border-bottom-style: dotted; border-width: 1px;

}
#caja2 img {
width: 15%;
  height: auto;
  margin-top: 0px;
  margin-right: 10%;
  float:right;
}

#caja3{
  width:85%;
  height: auto;
   margin-right: 3%;
  margin-right: 6%;
  margin-bottom: 3%;
    text-align: left;
    background-color: #FFFFFF;
   float:right;
    border-bottom-color: #CCC;
   border-bottom-style: dotted; border-width: 1px;

}
#caja3 img {
width: 15%;
  height: auto;
  margin-top: 0px;
  margin-right: 10%;
  float:left;
}

   #caja2 img {
            -webkit-transition: all .6s ease-in-out;    /* safari - Chrome*/
            -moz-transition: all .6s ease-in-out;       /* Firefox */
            -o-transition: all .6s ease-in-out;         /* Opera */
            transition: all .6s ease-in-out;
        }
          #caja2 img:hover    {
            -webkit-transform: rotate(360deg);  /* safari - Chrome*/
            -moz-transform: rotate(360deg);     /* Firefox */
            -o-transform: rotate(360deg);       /* Opera */
            transform: rotate(360deg);
        }



 #caja3 img {
            -webkit-transition: all .6s ease-in-out;    /* safari - Chrome*/
            -moz-transition: all .6s ease-in-out;       /* Firefox */
            -o-transition: all .6s ease-in-out;         /* Opera */
            transition: all .6s ease-in-out;
        }
          #caja3 img:hover    {
            -webkit-transform: rotate(360deg);  /* safari - Chrome*/
            -moz-transform: rotate(360deg);     /* Firefox */
            -o-transform: rotate(360deg);       /* Opera */
            transform: rotate(360deg);
        }

@font-face {
  font-family: 'chunk-webfont';
  src: url('../../includes/fonts/chunk-webfont.eot');
  src: url('../../includes/fonts/chunk-webfont.eot?#iefix') format('eot'),
  url('../../includes/fonts/chunk-webfont.woff') format('woff'),
  url('../../includes/fonts/chunk-webfont.ttf') format('truetype'),
  url('../../includes/fonts/chunk-webfont.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'chunk-webfont';
    src: url('../../includes/fonts/chunk-webfont.svg') format('svg');
  }
}


@media (max-width: 767px) {
    #caja1 {
       width: auto;


    }
     #caja2 {
       width:94%;


    }

    #caja2 img {
width: 25%;
  height: auto;
  margin-top: 0px;
  margin-right: 10%;
  float:right;
}
#caja3 img {
width: 25%;
  height: auto;
  margin-top: 0px;
  margin-right: 10%;
  float:left;
}


    }
    .txt {
color: #2ECCFA;
margin-right: 3%;
  margin-left: 3%;
  margin-bottom: 2%;
  font-size: 2em;
font-family: 'Josefin Sans', sans-serif;

}
.txt1 {
color: #2ECCFA;
margin-right: 3%;
  margin-left: 3%;
  margin-bottom: 3%;
  font-size: 1em;
font-family: 'Josefin Sans', sans-serif;

}



}