body {
  font-family: 'Lato', sans-serif;
  font-size: 20px;
}

.page h1 {
  color: #009432;
}
.page h2 {
  color: #000099;
  font-size: 140%;
}

a {
  color: #3867f6;
}

.note {
  border-left: 4px solid #3867d6;
  color: #1e272e;
}

.image_expand {
  -webkit-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.5);
  box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.5);
}

.interactive {
  text-align: center;
  border: 1px solid #2ecc71;
  border-radius: 2px;
  background-color: rgba(255, 200, 180, 0);
  
}

li {
  padding: 0 0 0.4em 0;
}

code, code_math {
  display: inline;
}
code, pre, code_math {
  font-family: 'UbuntuMono', monospace;
  font-size: 107%;
  color: #778890;
}
xmp {
  font-family: 'UbuntuMono', monospace;
  font-size: 107%;
  color: #e67e22;
  border: 1px solid #e67e22;
}

.katex {
  font-size: 110% !important;
}

.cover_title {
  position: absolute;
  top: 595px;
  left: 57px;
  right: 0px;
  color: #0089cd;
  font-size: 350%;
  text-align: center;
  text-shadow: 1px 2px rgba(0,0,0,0.15);
}
.cover_subtitle {
  position: absolute;
  left: 57px;
  right: 0px;
  bottom: 45px;
  text-align: center;
  color: #0089cd;
  font-size: 220%;
  text-shadow: 1px 2px rgba(0,0,0,0.15);
}

.chap_text {
  position: absolute;
  right: var(--page-right-margin);
  top: 200px;
  color: #0089cd;
  font-size: 500%;
  text-shadow: 1px 2px rgba(0,0,0,0.15);
}
.chap_name {
  position: relative;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  left: 58px;
  width: 582px;
  top: 395px;
  height: 170px;
  color: #0089cd;
  font-size: 250%;
  text-shadow: 1px 2px rgba(0,0,0,0.15);
}


/*Aquí he puesto estilos para la revista */

/*Para el volumne y número de la revista */
.portada
{
   position:absolute;
	margin-left:400px;
	margin-top:40px;
	text-align:right;
	width: 170px;
	font-size: 1.2em;
	color:SkyBlue;
	border: 2px solid white;
}

/* Color de fondo para las páginas */
.page {
	background-color: aliceblue;
}

/* Caja para insertar los contenidos (índice) */
.caja_menu {
    position: relative;
	left: 215px;
    width: 330px;
    height: 725px;
    margin-left: 5px;
    margin-right: 10px;
    margin-top: -15px;
    padding: 10px;
    float: left;
    overflow: hidden;
	color: seagreen;
}

.caja_menu p {
	font-size: 1.4em;
	color: aqua;
	background: rgba(76, 175, 80, 0.0);
	margin-left: 0px;
	padding: 0px;
	margin-top: 5px;
	margin-bottom: 15px;
}

.caja_menu h2 {
	color: brown;
	font-size: 0.8em;
	background: rgba(176, 75, 80, 0.0);
	padding: 3px;
	text-align:left;
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
}

.caja_menu a {
	color: aqua;
	background: rgba(76, 175, 80, 0.0);
	padding: 0px;
	margin-left: 0px;
	
}

/* Caja llamada "section", que podemos usar para cambiar tamaño de fuente, fondos, etc., o combina con la caja 0 */


section
{
	 width: 512px;
	 padding: 15px 15px 10px 10px;
	
	 font-size: 0.9em;
	 text-align:left;
	
}

section h1
{
    color: #f22;
	font-size: 1.8em;
	text-align:center;
	margin-bottom: 0px;
	text-shadow: 1px 2px rgba(0,0,0,0.85);
}

.caja0
{
    margin-top: 15px;
	background-color: rgba(0, 165, 255,0.55);
    box-shadow: 0px 2px 5px #1c1a19;
    border-radius: 5px;
	padding:15px 25px 30px 15px;
	font-size: 1em;
	
}

/* Para las pestañas de página */

.pestana_izq
{
    position: relative;
	width: 129px;
	font-size:17px;
	text-align:left;
	padding: 5px;
	margin-top: -30px;
	margin-left: -50px;
	padding-top:2px;
	background-color: rgba(125, 9, 220, 0);
	color:#e6ffff;
	background-repeat: no-repeat;
}

.pestana_izq2
{
    position: relative;
	width: 129px;
	font-size:17px;
	text-align:left;
	padding: 5px;
	margin-top: 0px;
	margin-left: 2px;
	padding-top:2px;
	background-color: rgba(125, 9, 220, 0);
	color:#e6ffff;
	background-repeat: no-repeat;
}

.pestana_der
{
    position: relative;
	width: 129px;
	font-size:17px;
	text-align:right;
	padding: 5px;
	margin-top: -30px;
	margin-left: 450px;
	padding-top:2px;
	padding-right:-20px;
	background-color: rgba(25, 119, 20, 0.0);
	color:#e6ffff;
	background-repeat: no-repeat;
}




article
{
	
	width: 230px;
    
	margin-bottom: 0px;
	padding: 15px 25px 30px 15px;
	font-size: 0.9em;
	text-align:left;
}

article p
{
    
}

aside
{
    position: relative;
    width: 210px;
	display: inline-block;
	 background-color: rgba(180, 200, 255, 0.3);
	margin-top: 10px;
	margin-bottom: 0px;
	 padding: 0px 25px 10px 25px;
	 font-size: 0.9em;
	 text-align:right;
}

aside p
{
	
	padding: 0px 0px 0px 0px;
	font-size: 1.2em;
	text-align:right;
	color:Maroon;
	margin: 10px;
}

article, aside
{
    display: inline-block;
    vertical-align: top;
    
}

.caja1
{
    position: relative;
	width: 90%;
    background-color: #fff;
    box-shadow: 0px 2px 5px #1c1a19;
    border-radius: 5px;
    padding: 10px;
	margin-bottom: 25px;
	margin-top: 25px;
	background-image: linear-gradient(white, palegreen);
	text-align:center;
}

.caja1 h1
{
    color: #f22;
	
	font-size: 1.8em;
	text-align:center;
	margin-bottom: 0px;
	text-shadow: 1px 2px rgba(0,0,0,0.85);
}

.caja2
{
    margin-top: 15px;
	margin-left: 65px;
    background-color: rgba(100,149,237,0.55);
    box-shadow: 0px 2px 5px #1c1a19;
    border-radius: 5px;
   	font-size: 2em;
	width: 70%;
	padding-top:3px;
	padding-bottom:8px;
	margin-top:25px;
	
}

.caja2 h1
{
    color: 	#4169E1;
	font-size: 1.4em;
	text-align:center;
	text-shadow: 1px 2px rgba(0,0,0,0.75);
	
}

.caja2 p
{
    color: 	#4169E1;
	font-size: 0.7em;
	color:white;
	text-align:center;
	text-shadow: 1px 2px rgba(0,0,0,0.75);
	margin-top:5px;
	margin-bottom:5px;
	
}

.caja2b
{
    margin-top: 15px;
	margin-left: 65px;
    background-color: rgba(255, 69, 0,0.55);
    box-shadow: 0px 2px 5px #1c1a19;
    border-radius: 5px;
   	font-size: 2em;
	width: 70%;
	padding-top:3px;
	padding-bottom:8px;
	margin-top:25px;
	
}

.caja2b h1
{
    color: 	rgba(255, 69, 0);
	font-size: 1.4em;
	text-align:center;
	text-shadow: 1px 2px rgba(0,0,0,0.85);
	
}

.caja3
{
    position: relative;
	margin-left: 15px;
	display: inline-block;
	width: 315px;
 
}

.caja3b
{
   position:absolute;
	margin-left: 0px;
	width: 290px;
	font-size: 1.2em;
}



.caja4
{
    position: relative;
	display: inline-block;	
	width: 280px;
 
}

.caja4 h1
{
    color: DarkSeaGreen;
	font-size: 3em;
	text-align:center;
	margin-bottom: 0px;
	text-shadow: 2px 3px rgba(0,0,0,0.95);
}


.caja5
{
    position: relative;
	width: 190px;
	display: inline-block;
	margin-left:20px;
	text-align:left;
}

.caja6
{
    position: relative;
	width: 510px;
	font-size:29px;
	text-align:center;
	border: 2px solid white;
    border-radius: 10px;
	padding: 5px;
}

.caja7
{
    position: relative;
	width: 510px;
	font-size:29px;
	text-align:center;
	padding: 5px;
	 
}



.caja8 {
    position: relative;
    width: 270px;
    height: 220px;
    margin-left: 5px;
    margin-right: 10px;
    margin-top: 20px;
    padding: 0px;
    float: left;
    border: 2px solid aliceblue;
    border-radius: 10px;
    overflow: hidden;
}

.caja9
{
   
	width: 560px;
	margin:0; 
	padding:0; 
	transform: scale(1.2);
	 
}



.image {
    position: relative;
    
    display: block;
    
    transition: transform 0.07s ease-in-out;
}

.image:hover {
    transform: scale(1.5);
}

.vertical-menu {
  width: 300px;
}

.vertical-menu a {
  background-color: bisque;
  color: black;
  display: block;
  padding: 12px;
  text-decoration: none;
}

.vertical-menu a:hover {
  background-color: #ccc;
}

.vertical-menu a.active {
  background-color: #4CAF50;
  color: white;
}


.caja10 h1
{
    color: 	OrangeRed;
	font-size: 1.4em;
	text-align:center;
	text-shadow: 1px 2px rgba(0,0,0,0.75);
	
}

.caja11 {
	width: 80%;
	margin-left: 8%;
    background-color: rgba(0,0,100,0.15);
    box-shadow: 6px 6px 10px #000;
    border-radius: 5px;
    padding: 15px;
}

.caja12 {
	width: 50%;
	margin-left: 40%;
    background-image: url("../images/ejercicios.png");
	background-repeat: no-repeat; 
	background-color: rgba(200,200,200,0.45);
    box-shadow: 6px 6px 10px #000;
    border-radius: 10px;
    padding: 25px;
	padding-top:70px;
	font-size: 20px;
}

.caja13 {
	width: 50%;
	margin-left: 40%;
    background-image: url("../images/ejemplo.png");
	background-repeat: no-repeat; 
	background-color: rgba(250,250,250,0.15);
    box-shadow: 6px 6px 10px #000;
    border-radius: 10px;
    padding: 25px;
	padding-top:70px;
	padding-bottom:10px;
	font-size: 20px;
}

.caja14 {
	width: 60%;
	background-color: rgba(250,250,250,0.15);
    box-shadow: 6px 6px 10px #000;
    border-radius: 10px;
    padding: 25px;
	padding-top:15px;
	padding-bottom:10px;
	font-size: 20px;
	color:white;
}
.caja14 a {
	color: orange;
}

.caja15 {
	width: 90%;
	background-color: rgba(250,250,250,0.15);
    box-shadow: 6px 6px 10px #000;
    border-radius: 10px;
    padding: 25px;
	padding-top:15px;
	padding-bottom:10px;
	font-size: 20px;
	color:white;
}
.caja15 a {
	color: orange;
}


/* Para el texto de imágenes */
.fig{
	color:#000;	font-size:15px; padding:0; 
	}
	
/* Estilo para los números de página */
.specialnum1 .page_number {
  color: #bdb7b8;
}
.specialnum2 .page_number {
  color: #fff;
}
