@charset "utf-8";
body{
	margin: 0;
	background-image:url("images/fondo.jpg");
	background-repeat: repeat;
	font-family: "Open Sans";
}

/*portada*/

.portada{
      width:100%;
    height: 768px;
    max-width: 1024px;
    opacity: 0;
      display: block;
    margin: 0 auto;
    margin-bottom: 0;
    background-image: url("images/portada.jpg");
    background-size:cover;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: local;
  
    }
.portada p{
    text-align: right;
    display: block;
    margin: 0;
    padding-top: 470px;
    padding-right: 5%;
    font-size: 4em;
    line-height: 0.9em;
    
}
.mek{
    font-family: "Cabin Sketch";
	color: #e6766c;
    opacity: 0;
}
.bout{
    font-family: 'Abril Fatface', cursive;
	color: #36c2ce;
    opacity: 0;
    
}

.portada a{
    text-decoration: none;
}

.portada h4{
    text-align: right;
    font-style: italic;
    padding-right: 5%;
    font-size: 1.4em;
    font-weight: 300;
    margin-top: 5px;
    opacity: 0;
}
.portada h2{
    
    text-align: right;
    padding-right: 5%;
    font-size: 1.2em;
    font-weight: 300;
    margin-top: -10px;
    opacity: 0;
}

.portada h3{
    text-align: right;
    font-size: 1em;
    font-weight: 300;
    margin-top: -10px;
    padding-right: 5%;
    opacity: 0;
}
.leer{
    cursor: pointer;
    display: block;
    width: 16%;
    min-width: 200px;
    margin:0;
    margin-top: -190px;
    margin-right: 35%;
    float:right;
    opacity: 0;
}


/*creditos*/
.parracre{
    margin:auto;
    margin-top: -200px;
    display: block;
    width: 60%;
    padding: 5%;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
}

.parracre2 {
    margin:auto;
    display: block;
   	margin-top: -40px;
    width:100%;
    box-sizing: border-box;
    background-color:#DBF8FC;
    padding: 5%;
	padding-top: 10px;
    

}
.parracre2 img{
    width: 10%;
    display: block;
    margin: auto;
    margin-top: 20px;
    margin-bottom: 20px;
}
.parracre2 p {
    margin: auto;
    
    display: block;
    width: 50%;
    text-align: center;
    font-weight: 600;
}

.parracre2 a {
    text-decoration: none;
    color: #ff4362;
}
.autora{
    display: block;
    font-family: 'Cabin Sketch';
    font-size: 2em;
    color: #006696;
    text-align: center;
    
    
    
}
/*contenedor blanco*/
.contenedor{
	background-color:#FFF;
    padding: 0;
	margin-bottom: 5%;
	margin:auto;
	width: 92%;
	height: auto;
	max-width: 950px;
	box-sizing:border-box;
	-webkit-box-shadow: 0px -7px 106px -10px rgba(0,0,0,0.48);
	-moz-box-shadow: 0px -7px 106px -10px rgba(0,0,0,0.48);
	box-shadow: 0px -7px 106px -10px rgba(0,0,0,0.48);
	
}
/*menu*/


.contenedor a{
  text-decoration: none;
}
.huecoinicial{
    display: block;
    width:100%;
    height: 83px;
    margin-top: -83px;
}
.boton{
    
    display: block;
   margin-top: -10px;
    margin-left: 2%;
    position: relative;
    padding-top: 2px;
    z-index: 5;
    cursor: pointer;
}
.boton p{
     color:#404041;
     font-weight: 700;
   font-size: 1.1em; 
    position: fixed;
}

.imgmenu{
	width: 92%;
    max-width: 950px;
    min-height: 40px;
	display: block;
    margin-top: 5px;
	position: relative;
    z-index: 4;
     position: fixed;
}
.menusote{
    width: 40%;
    min-width: 300px;
    max-width: 420px;
    height: auto;
    position: fixed;
    background-color: #dcf4f4;
    box-sizing: border-box;
    margin-top: -20px;
    padding: 5%;
    padding-top: 80px;
    padding-bottom: 10px;
    z-index: 3;
    display: none;
    -webkit-box-shadow: 10px 6px 58px -20px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 6px 58px -20px rgba(0,0,0,0.75);
box-shadow: 10px 6px 58px -20px rgba(0,0,0,0.75);
}
.menusote h1{
    font-size: 2.5em;
    font-family: "Cabin Sketch";
    line-height: 1em;
}
.menusote h1 a:hover{
    color: black;
}
.menusote h2{
    font-style: italic;
    font-weight: 400;
    font-size: 1.2em;
    margin-top: -25px;
}
.menusote h3 a{
    display: block;
    font-family: 'Open Sans'!important;
    font-weight: 400!important;
    font-size: 0.82em!important;
    margin-top: -10px!important;
    margin-bottom: 30px !important;
}
.menusote a{
    font-family: "Cabin Sketch"; 
    font-size: 1.05em;
    color: black;
}
.menusote a:hover{
    color:#e33c50;
}
#aqui{
    color:#e33c50;
}

/*contenido*/
/*navegación*/
#volverarriba{
	cursor: pointer;
    margin: auto;
    display: block;
}

/*flechas*/
.conflechas{
    width: 92%;
    max-width: 950px;
    display: block;
    margin: auto;
    padding-top: 50px;
}

.atras1{

	float: left;
}
.siguiente1{

	float: right;
}

/*titulos*/
.titulos{
    display: block;
    margin-top: 100px;
	line-height: 1;
	text-align: right;
	font-size:  3.8em;
	padding-right: 4%;	
}

.titulo1{
	
 
  	background: -webkit-linear-gradient(transparent, transparent), url('images/ondas.png') transparent;
    text-align:center;
	 background-image: -o-linear-gradient(transparent, transparent);
	 background-repeat: repeat;
	color: #50d0eb;
   
    -webkit-font-smoothing:antialiased;
    -webkit-background-clip:text;
    -moz-background-clip:text;
    -webkit-text-fill-color:transparent;
	font-family: 'Abril Fatface', cursive;
	 background-clip: text;
	

    margin:0;
	
}
.titulo2{
	font-family: "Cabin Sketch";
	color: #2B388F;
}

/*textos*/


.columdoble{
	-moz-column-count:2; 
    -webkit-column-count:2; 
    column-count:2;
 height: auto;
    -moz-column-gap:35px; 
    -webkit-column-gap:35px; 
    column-gap:35px;
   padding:0 5%;
   padding-top: 0;
   box-sizing:border-box;
}
.columdoble1{
	-moz-column-count:2; 
    -webkit-column-count:2; 
    column-count:2;
	height: auto;
 	background-color: #DBF8FC;
    -moz-column-gap:35px; 
    -webkit-column-gap:35px; 
    column-gap:35px;
   padding: 5%;
   padding-top: 5%;
   box-sizing:border-box;
   display:block;
   
}


.parraintro{
	width: 37%;
	float:right;
	display:block;
	margin-top: -60%;
	font-weight: 300;
	margin-right: 5%;
	font-size: 0.92em;
	line-height: 1.8em;
	color: #231F20;
	z-index: 2;
	position: relative;
}
.parraintroi{
	width: 37%;
	float:left;
	display:block;
	margin-top: -640px;
	font-weight: 300;
	margin-left: 5%;
	font-size: 0.92em;
	line-height: 1.8em;
	color: #231F20;
	z-index: 2;
	position: relative;
}

.parrafos{
	display:block;
	font-weight: 300;
	font-size: 0.92em;
	line-height: 1.8em;
	color: #231F20;
	margin:0;
	margin-bottom: 3%;
}

.advertencia{
	width: 100%;
	height: auto;
	display: block;
	background-color:#F7DDD5;
	border:1px dashed #D6562B;
	box-sizing:border-box;
	padding: 3%;
	font-weight: 300;
	font-size: 0.92em;
	line-height: 1.8em;
	color: #231F20;
}
.advertencia1{
	width: 50%;
	margin: auto;
	display: block;
	height: auto;
	background-color:#F7DDD5;
	border:1px dashed #D6562B;
	box-sizing:border-box;
	padding: 3%;
	font-weight: 300;
	font-size: 0.92em;
	line-height: 1.8em;
	color: #231F20;
	position: relative;
}

/*resaltado rojo*/
.resaltado{
	
	font-weight: 700;
}
/*inicio párrafo*/
.primerafrase{
	color: #00BBD6;
    font-weight: 600;
	letter-spacing: 0.3px;
	font-size: 1.3em;
}

/*imagenes*/
.saludo{
	width: 98%;
	display: block;
	margin: auto;
	margin-bottom: 2%;
	position: relative;
	z-index: 1;
}

.galeria{
	margin:auto;
	display: block;
	width: 100%;
	height: auto;
	claer: both;
}
.mini{
	width: 33%;
	position: relative;
}
#img2{
	width: 33%;
	z-index: 0;
	-ms-transform: rotate(7deg); /* IE 9 */
    -webkit-transform: rotate(7deg); /* Chrome, Safari, Opera */
    transform: rotate(7deg);
}
#img1{
	
    z-index: 2;
	-ms-transform: rotate(-2deg); /* IE 9 */
    -webkit-transform: rotate(-2deg); /* Chrome, Safari, Opera */
    transform: rotate(-2deg);
}

.minicen{
	margin:auto;
	width: 30%;
	display: block;
}

.imgtotal{
	width: 100%;
	height:auto;
	margin-bottom: 6%;
	position: relative;
	z-index: 2;
}

.imgtotal1{
	width: 100%;
	height:auto;
	margin-bottom: 0;
	position: relative;
	z-index: 2;
}
.imgdentro{
	width:98%;
	display:block;
}
.imgdentro1{
	width:60%;
	display:block;
    margin: auto;
}
/*imagen del color de la cenefa*/
.imgdentro2{
	width:100%;
	display:block;
	margin: auto;
	margin-bottom: 5%;
	background-color: #1E2CB7;
	padding-top:2%;
	padding-bottom:2%;
	box-sizing:border-box;
}
.imgdentrico{
	width:30%;
	margin:auto;
	display:block;
	
}
.imgcentrada{
	margin:auto;
	margin-top: 2%;
	margin-bottom: 2%;
	width: 90%;
	display:block;
	
}

.imgcentrada4{
	margin:auto;
	margin-top: 200px;
	margin-bottom: 5%;
    width: 100%;
    height: auto;
	display:block;
	
}

.imgcentradapeq{
	width: 55%;
    margin: auto;
	position: relative;
	display: block;
}
/*elementos falsos*/
.element{
	-webkit-shape-outside: circle(50%);
  shape-outside: circle(50%);
  width: 220px;
  height: 230px;
  float: right;
}
.element2{
	-webkit-shape-outside: circle(50%);
  shape-outside: circle(50%);
  width: 220px;
  height: 230px;
  float: left;
}

.element3{
display: block;
  width: 100%;
  height: 230px;
}
/*animaciones*/

#globoapar{
	opacity: 1;
}





/*separador*/
.separador{
	width: 100%;
	height: 20px;
}



/*globos*/
.globos{
	display:block;
	position:relative;
	width: 30%;
	height:auto;
	margin-top:-447px;
	margin-left: 25%;
	z-index: 2;
}

.globos03{
	display:block;
	position:relative;
	width: 73%;
	height:auto;
	margin-top: -550px;
    margin-left: 8%;
	z-index: 2;
}
.globos04{
	display:block;
	position:relative;
	width: 73%;
	height:auto;
	margin-top: -400px;
    margin-left: 8%;
	z-index: 2;
}

/*footer*/

.footer{
	margin-top: 6%;
    display: block;
	width: 100%;
	height: 150px;
	background-color: #404041;	
}

.contenedorfooter{
	
	width: 95%;
	margin: auto;
	max-width:950px;

}
.partefoot{
	width:40%;
	float: left;
	box-sizing: border-box;
	padding-top: 5%;
    padding-left: 3%;
	
}

.partefoot h1{
	color: #D0D2D3;
	font-size: 1.5em;
	font-weight:700;
    margin-top: -2px;
}

.partefoot h2{
    font-size: 1.2em;
    font-style: italic;
    color: #D0D2D3;
    margin-top: -15px;
}
.partefoot1{
	width:60%;
	float: left;
	box-sizing: border-box;
	padding: 5%;
    
	
}

.partefoot1 img{
    display: block;
    float: right;
    width: 12%;
    margin-top: -5px;
    margin-left: 3%;
    
}


.partefoot1 p{
    margin: 0;
	color: #D0D2D3;
	font-size: 0.8em;
	font-weight:300;
	text-align: right;
}


	


@media screen and (max-width:1006px){
	
	.columdoble {
	-moz-column-count:1;
    -webkit-column-count:1;
    column-count: 1;
 
    -moz-column-gap:0; 
    -webkit-column-gap:0; 
    column-gap:0;
	}
	.columdoble1 {
	-moz-column-count:1;
    -webkit-column-count:1;
    column-count: 1;
 
    -moz-column-gap:0; 
    -webkit-column-gap:0; 
    column-gap:0;
	}
	.columdoble2 {
	-moz-column-count:1;
    -webkit-column-count:1;
    column-count: 1;
 
    -moz-column-gap:0; 
    -webkit-column-gap:0; 
    column-gap:0;
	}
    	
	.element{
	display:none;	
	}
	.element2{
		
	display:none;	
	}
    .element3{
		
	display:none;	
	}
	.elementDerecho{
		margin-top: -500px;
	}
	.imgdentro{
		width: 75%;
		margin:auto;
		margin-top: 3%;
		margin-bottom: 5%;
		
	}
    .imgdentro1{
		width: 40%;
		margin:auto;
		margin-top: 3%;
		margin-bottom: 5%;
		
	}
	
    .imgcentrada4{
		display: none;
	}
	.globos{
		margin-top: -350px;
		margin-left: 5%;
	}

    #desaparece{
        display: none;
    }

    .globos03{
        margin: auto;
        margin-top: 0;
        width: 100%;
    }
     .globos04{
            margin: auto;
            margin-top: 0;
          width: 100%;
            
        }
	
	.titulos{
	margin-top: 15%;

	text-align: center;
	font-size:  3.5em;
	padding-right: 0;
	float: none;
	clear:both;	
	}
	.parraintroi{
	float:none;
	width: 90%;
	padding: 5%;
	display:block;
	margin: auto;
	}
	.parraintro{
	float:none;
	width: 90%;
	padding: 5%;
	display:block;
	margin: auto;
	}
	
	
}
@media screen and (max-width:904px){
	
.mini {
		width: 100%;
	}
	#img2{
		width: 100%;
		margin: 0;
		-ms-transform: rotate(0deg); /* IE 9 */
    -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
    transform: rotate(0deg);
	}
    #img1{
		width: 100%;
		margin: 0;
		-ms-transform: rotate(0deg); /* IE 9 */
    -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
    transform: rotate(0deg);
	}
    .leer{
    min-width: 150px;
    margin-top: -370px;
    margin-right: 5%;
    float:right;
    opacity: 0;
    }
    
   .parracre{
    margin:auto;
    margin-top: -30px;
    display: block;
    width: 100%;
}



.parracre2 p {
   
     margin-top: 10px;
   
    width: 100%;
    
}

}
@media screen and (max-width:800px){
 .boton{
        font-size: 0.8em;
    }
    .menusote {
        font-size: 0.8em;
    }
     .menusote h1 {
        font-size: 1.9em;
    }
     .menusote h2 {
         margin-top: -10px;
         margin-bottom: 10px;
        font-size: 1em;
    }
    .footer{
        height: 320px;
    }
    .partefoot{
        width:100%;
    }
    .partefoot h1{
        text-align: center;
    }
     .partefoot h2{
        text-align: center;
    }
    .partefoot1{
        margin-top: -30px;
        width:100%;
    }
    .partefoot1 img{
        display: block;
        margin: auto;
        float: none;
        clear: both;
        margin-bottom: 15px;
    }
     .partefoot1 p{
       text-align: center;
    }
 }
@media screen and (min-height:800px){
    .portada{
        height: 1024px;
        max-width: 1280px;
    }
    
    .portada p{
        padding-top: 670px;
    }
    .leer {
        margin-top: -250px;
    }
}
@media screen and (max-width:600px){
    .titulos{
        font-size: 2.5em;
        padding-left: 1%;
        padding-right: 1%;
    }
    
    .footer{
        height: 270px;
    }
    .partefoot1 img{
        width: 18%;
    }
}

@media screen and (max-height:450px){

    .menusote {
        overflow-y: scroll;
        height: 380px;
    }
    
   
 }




