@charset "UTF-8";

/*GLOBAL STYLES*/

article {
	width: 100%;
	min-width: 250px;
}

div {
	float: left;
	line-height: 0;
}

img {
	width: 100%;
}

/*MEDIA QUERIES*/


@media (max-width: 320px){
	
	body {  
		background-color: white;
	}
	img {
		margin-bottom: 20px;
	}
	
	article {
		margin-top: 20px;
	}	
}


@media (min-width: 321px) and (max-width: 500px){
	div {
		width: 50%;
	}
}

@media (min-width: 501px) and (max-width: 600px){
	div {
		width: 33.33%;
	}
}

@media (min-width: 601px) and (max-width: 700px){
	div {
		width: 25%;
	}
}

@media (min-width: 701px) and (max-width: 800px){
	div {
		width: 20%;
	}
}

@media (min-width: 801px) and (max-width: 900px){
	div {
		width: 16.66%;
	}
}

@media (min-width: 901px) and (max-width: 1000px){
	div {
		width: 14.28571%;
	}
}

@media (min-width: 1001px) and (max-width: 1100px){
	div {
		width: 12.5%;
	}
}

@media (min-width: 1101px) and (max-width: 1200px){
	div {
		width: 11.11%;
	}
}

@media (min-width: 1201px){
	div {
		width: 10%;
	}
	img {
		margin-bottom: 20px;
	}
	article {
		margin-top: 20px;
	}
	body {
		background-color: black;
	}
}