/* Base color  2F4272*/
/* https://paletton.com/#uid=33M0u0kl4ljaxvQfQqtq8gavyaP */
@charset "utf-8";

@font-face {
    font-family:"coolvetica";
	src: url(fonts/coolvetica.otf) format("opentype");
	font-display: swap;
}

@font-face {
    font-family:"hack";
	src: url(fonts/Hack-Regular.ttf) format("truetype");
	font-display: swap;
}

:root{
	--color1: #2f4272;
	--color2: #734f96;				/* Púrpura */
	--fondo_codigo: #eeeeee;
	--fluorescente: #ffff33;
}

html{	/* M */
  font-family: sans-serif;
  max-width: 100%;
}

body{
	font-size: 1.2rem;
}

header{
	height: 6rem;
	padding: 1rem;
}
header img{
	float: left;
}

header h1{
	border: unset;
	margin: unset;
	font-family: "hack", monospace;
	margin-left: 70px;
	font-size: 3rem;
}

header h2{
	font-size: 1rem;
	padding: unset;
	color: grey;
	margin: unset;
	clear: left;
}

header h2::before{
	content: unset;
}

nav.toc{
	display: inline-block;
	color: var(--color1);
	padding: 1rem;
	margin-left: 1rem;
	border: 1px solid black;
}

nav.toc h1{
	font-size: 1.5rem;
	border: unset;
	color: black;
}

nav.toc ul{
	counter-reset: capitulo;
}


nav.toc li{
	counter-increment: capitulo;
	margin-bottom: 1rem;
	list-style-type: unset;
}

nav.toc li::before{
	content: counter(capitulo) ". ";
}

main{	/* M */
	padding: 0 1rem 3rem 1rem;
	line-height: 1.5rem;
}

h1, h2, h3{
  color: var(--color1);
  font-weight: bold;
  font-family: "coolvetica";
  line-height: 1;
}

h1{
  font-size: 2.8rem;
  font-weight: bold;
  text-align: left;
  padding: 1rem 0 0 0;
  border-bottom: 2px solid var(--color1);
  margin-bottom: 2rem;
  counter-reset: secccion;

}

h2{	/* M */
  counter-increment: seccion;
  counter-reset: subsecccion;
  font-size: 1.8rem;
  padding: 3rem 0 1rem 0;
}

h2::before{
	content: counter(seccion) ". ";
}

h3{
  counter-increment: subseccion;
  font-size: 1.4rem;
  padding: 1.4rem 0;
}

h3::before{
	content: counter(seccion) "." counter(subseccion) ". ";
}

main img{
	max-width: 100%;
}

p{	/* M */
	line-height: 1.5rem;
	margin-bottom: 1rem;
}

i{
	font-style: italic;
}

b{
	font-weight: bold;
}

code{
	font-family: "hack", monospace;
	background-color: var(--fondo_codigo);
}

code span{
	line-height: 1.5rem;
}


a{
  color: #3c92d1;
  text-decoration: none;
}

pre{
	font-family: monospace;
}

ul{

}

ul ul{
	margin-left: 2rem;
}

li{
	list-style-type: circle;
	margin-bottom: 0.5rem;
	list-style-position: inside;
}

table{
	border: 1px solid black;
	margin-bottom: 2rem;
}

table th{
	background-color: var(--color1);
	color: white;
	font-weight: bold;
	padding: 0.2rem 0.4rem;
}

table td{
	border: 1px solid black;
	padding: 0.2rem 0.4rem;
}

footer{
	height: 2rem;
}