﻿.host1{
	background-color: #FFFFFF; 
	background-image: url('graphics/host1.jpg');
	background-repeat:no-repeat;
	background-position: center top; background-size: 145% auto;
}
.host2{width:100%; color: #000000;}
.host3{width:100%; padding-top:30%;}
.host4{width:100%;}

/* ESTILOS DE ESTA PAGINA */
@media (max-width: 335px){/*320*/

}
@media (min-width: 336px) and (max-width: 390px){/*375*/
	.host1{background-size: 150% auto;}
	.host3{padding-top:35%;}
}
@media (min-width: 391px) and (max-width: 555px){/*540*/
	.host1{background-size: 147% auto;}
	.host3{padding-top:40%;}
}

@media (min-width: 556px) and (max-width: 655px){/*640*/
	.host1{background-size: 150% auto;}
	.host3{padding-top:40%;}
}

@media (min-width: 656px) and (max-width: 783px){/*768*/
	.host1{background-size: 152% auto;}
	.host3{padding-top:43%;}
}

@media (min-width: 784px) and (max-width: 1039px){/*1024*/
	.host1{background-size: 164% auto;}
	.host3{width:60%; padding-top:0%;}
	.host4{ padding-top:40%;}
}

@media (min-width: 1040px) and (max-width: 1333px){
	.host1{background-size: 150% auto;}
	.host3{width:60%; padding-top:0%;}
	.host4{width:60%; padding-bottom:33%;}
}

@media (min-width: 1334px) and (max-width: 1626px){
	.host1{background-size: 140% auto; padding-left:7%;}
	.host3{width:53%; padding-top:0%;}
	.host4{width:55%; padding-bottom:33%;}
}

@media (min-width: 1627px){
	.host1{background-size: 120% auto; padding-left:10%;}
	.host3{width:50%; padding-top:0%;}
	.host4{width:50%; padding-bottom:30%;}
}
