*{
	margin: 0;
	padding: 0;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing: border-box;
}


 #contenido
{
	padding:3em;
	margin: .3em auto;
	width: 20%;
	background: #FFA726;
	display: inline-block;
	text-align: center;
	color: royalblue;

}


 #contenido2
{
	padding:3em ;
	margin: .3em auto;
	width: 20%;
	background: #F57C00;
	display: inline-block;
	text-align: center;
	color: slateblue;
}


#contenido3
{
	padding:3em ;
	margin: .3em auto;
	width: 20%;
	background: #E65100;
	display: inline-block;
	text-align: center;
	color: limegreen;
}


#contenido:hover{
	background: royalblue;
	color:  #FFA726;
}

#contenido2:hover{
	background: slateblue;
	color: #F57C00;
}


#contenido3:hover{
	background:limegreen;
	color: #E65100;
}


h1{
	
	padding: .2em;
}

 .Contenedor a{
	
	font-size:120% ;
	color: white;
}

body{
	margin-bottom: 50px;
}

.btn-regresar
{
	text-decoration: none;
	margin-left: 3%;
	
	font-size: 140%;
}

strong{
	font-size: 125%;
}

ul li{
	list-style: none;
}

h2{
	color: darkred;
}

body {

                background-image: url("../img/fondoheader.png");
                background-position: top center;
                height: auto;
                background-size: 100% 100%;
                background-repeat: no-repeat;
}




@media only screen and (min-width: 481px) and (max-width: 768px) {


 #contenido
{
	width: 45%;
	display: inherit;
}


 #contenido2
{
	width: 45%;
	display: inherit;
}


#contenido3
{
	width: 45%;
	display: inherit;
}



}



@media only screen and ( orientation: landscape) and (min-width: 769px) and (max-width: 900px)   {


 #contenido
{
	width: 50%;

}


 #contenido2
{
	width: 50%;
	
}


#contenido3
{
	width: 50%;
	
}


}


@media only screen and ( orientation: landscape) and (min-width: 900px) and (max-width: 1100px)   {


 #contenido
{
	width: 50%;

}


 #contenido2
{
	width: 50%;
	
}


#contenido3
{
	width: 50%;
	
}

}


@media only screen and (min-width: 320px) and (max-width: 480px) {


 #contenido
{
	width: 50%;
	display: inherit;
}


 #contenido2
{
	width: 50%;
	display: inherit;
}


#contenido3
{
	width: 50%;
	display: inherit;
}



}