body{
	margin: 0;
	padding: 0;
    	position: relative;
}
@media (min-width: 1200px){
	#gatito2{
		position: absolute;
		top: 50%;
		left: 50%;
		width: 30%;
		height: 30%;
	}
	#atardecer,#gatito3,#noche,#gatito1,#sombrilla{
		display: none;
	}
}
@media (min-width: 1024px) and (max-width: 1200px){
	#gatito2{
		position: absolute;
		top: 50%;
		width: 30%;
		height: 30%;
		left: 50%;
	}
	#gatito3,#gatito1,#morning,#noche,#sombrilla{
		display: none;
	}
}

@media (min-width: 768px) and (max-width: 1023px){
    
#gatito2,#gatito1,#morning,#noche,#sombrilla{
		display: none;
	}
	#gatito3{
		position: absolute;
		left: 50%;
		top: 50%;
		width: 30%;
		height: 30%;
	}
}
@media (min-width: 320px) and (max-width: 767px){
	#gatito1{
		position: absolute;
		left: 50%;
		top: 50%;
		width: 30%;
		height: 30%;
	}
	#gatito2,#gatito3,#morning,#atardecer,#sombrilla{
		display: none;
	}
}
@media (min-width: 49px) and (max-width: 319px){
	#gatito2,#gatito3,#gatito1,#morning,#atardecer,#noche{
		display: none;
	}
	#sombrilla{
		width: 100%;
		/*display: block;*/
	}

}

.imagen{
    width: 100%;
}
.contenedorFoto{
    width: 100%;
    height: 100%;
}