@charset "utf-8";
/* CSS Document */
*{
	margin: 0;
	padding: 0;
}

/* se le dan las propiedades al contenedor exterior*/

#contenedor{
	width: 1200px;
	height: 1300px;
	background: #D8D8D8;
	margin: 0.5em auto;
	padding: 0.5em;
}

/* se le dan propiedades al encabezado*/

#header{
	height: 10%;
	background: #FFFFFF;
	margin: 1em;
}

/* se le dan las propiedades al nav*/

#nav{
	height: 3%;
	background: #000089;
	margin: 1em;
}

/* se le asignan propiedades al contenedor contenido */

#contenido{
	height: 68%;
	background: #F9F9F9;
	margin:1em;
}

/* se le asignan propiedades al contenedor footer*/

#footer{
	height: 7%;
	background: #000089;
	margin:1em;
}

.pie{
	text-align: center;
	color: #fff;
	font-size: 2;
	}


/* se definen los contenedores internos de contenido */

#section{
	height: 95%;
	width: 24%;
	background: #E0F2F7;
	border-radius: 1em;
	float: left;
	margin:1em;
	}

.modulos{
	text-align: center;
}

#aside{
   	height:95%;
	width: 70%;
	background: #E0F2F7;
	border-radius: 1em;
	float: right;
	margin: 1em;
}

/* aqui se define la posicion de la hoja del libro en el contenedor respectivo*/

.slider{
    position:relative;
    margin:auto;
    width:100%;
    height:100%;
    }


/* aqui se le da el formato a las fotos antes de la ultima*/

.slider img{
    width:90%;
    height:96%;
    padding:1em;
}



/* aqui se le da formato a la primera foto que mostrará. El ancho es el alto de la hoja y visceversa  overflow-x:scroll; */



/* se da formato a los botones de avance */

.botones{
	font-size: 30px;
	width: 70px;
	height: 70px;
	line-height: 70px;
	border-radius: 50%;
	background-color: rgba(0,0,0,0.70);
	text-align: center;
	font-weight: bold;
	position: absolute;
	color: #fff;
	box-shadow: 0 0 10px rgba(255,255,255,0.6);
	-webkit-transition: .3s ease all;
	-o-transition:  .3s ease all;
}

.botones:hover{
	cursor: pointer;
	transform: scale(1.2,1.2);
}

.atras{
	right:2%;
	top:250px;
}

.adelante{
	right:2%;
	top:calc(40%-70px);
}

/* se da colores a hipevinculos laterales */

	a: .com {
                            color: #D3D3D3;
                    }
/* color letras contenedor lateral---azul  */               
    a:visited {
                            color: #FF33F0;
                    }
/* color sobre letrero--gris claro */  
    a:hover {
                            color: #000000;
                    }
/* color cuando se pica el hipervinculo---rojo */                  
	a:active {
                            color: #FF33F0;
				}

.com {
display: none;
visibility: hidden;
}

