:root{
    --blanco: #ffffff;
    --oscuro: #212121;
    --primario: #faf5f2;
    --secundario: #716ada;
    --gris: #8f8f8f;
    --grisOscuro: #5e5e5e;

	--fuentePrincipal: 'Roboto Condensed', sans-serif;
	--fuenteSecundaria: 'Open Sans Condensed', sans-serif;
}
html{
    box-sizing: border-box; 
    font-size: 62.5%;
}

*, *:before, *:after {
    box-sizing: inherit;
}

/* Tipografias */
h1{
    font-size: 4.5rem;
	
}
h2{
    font-size: 2.8rem;
	color: var(--grisOscuro);
	font-family: var(--fuenteSecundaria);
}
h3{
    font-size: 1.8rem;
}
h1,h2,h3{
    text-align: center;
}


#imgLogo{
	min-width: 14rem;
	max-width: 14rem;
}
/** Globales **/
body{
	background-color: var(--primario);
	font-family: var(--fuentePrincipal);
	line-height: 1.0;
}

.superior{
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.divPanelIzquierdo{
	text-align: center;
}

/* Barra de navegador*/
.navegador{
	margin-top: 2rem;
	text-align: center;
	background-color: var(--gris);
	display: flex;
	flex-direction: column ;
	box-shadow: 0px 4px 5px -2px rgba(0,0,0,0.64);
	text-transform: uppercase;
}
@media (min-width: 768px) {
	.navegador{
		flex-direction: row;
		justify-content: flex-end;
	}
}

.navegador__item{
	text-decoration: none;
	padding: 1rem;
	color: var(--blanco);
	font-size: 2rem;
	font-family: var(--fuentePrincipal);
	flex-basis: calc(50% 1rem);
	transition: 0.8s ease;
	
}
.navegador__item:hover{
	background-color: #bbbbbb;
	font-size: 2.1rem;
}

/** Titulo y subtitulo*/
#Titulo{
	margin: 0 0;
}
#SubTitulo{
	margin: 1 rem 0;
}
.footer{
	margin: 1;
	background-color: var(--gris);
	padding: 1.5rem;
	text-align: center;
	font-family: var(--fuentePrincipal);
	font-size: 2rem;
	color: var(--blanco);
	box-shadow: 0px 4px 5px -2px rgba(0,0,0,0.64);
}
.pie{
	margin: 0;
}
.imagen{
	margin: 1rem auto;
	background-image: url("../img/portada2.jpg");
    background-repeat: no-repeat;
    background-size: cover; /*Toma todo el ancho disponible de la web*/
    height: 450px;
	transition: 0.55s ease;
}
.imagen:hover{
	margin: 1rem auto;
	background-image: url("../img/portada2.jpg");
    background-repeat: no-repeat;
    background-size: cover; /*Toma todo el ancho disponible de la web*/
    height: 460px;
}