html{
	font-family: 62.5%;/*reset para REMS - 62.5% = 10px de 16px*/
}
body{
	font-family: 'Lato', sans-serif;
	font-size: 1.6rem;
}
img{
	max-width: 100%;
	height: 500px;

}
.site-header.inicio{

}	
.contenido-header{
	height: 100%;
	display: flex;
	flex-direction: column;/*de arriba para abajo*/
	justify-content: space-between;
}

.contenido-header h1{
	color: white;
	padding-bottom: 2rem;/*separacion hacia adentro del elemento*/
	max-width: 60rem;
	line-height: 2;/*aqui hay un problema*/

}

.barra{
	/*vamos a utilizar flexbox*/
	display: flex;
	justify-content: space-between;
	padding-top: 3rem;
	/*padding-top espacio hacia adentro del elemento
	margin es la separacion de otro elemento hacia afuera*/
	align-items: center;

}