.grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6,
.grid-half, .grid-full, 
.grid-unit {
	margin-top:0;
	/*margin-bottom:.5em;*/
	box-sizing: border-box;
}


.cols-1, .cols-2, .cols-3, .cols-4, .cols-5, .cols-6,
.cols-half, .cols-full {
	float: left;
	box-sizing: border-box;
	margin-top:0;
	margin-bottom:0;
	
	margin-left:.515151515152%;
	margin-right:.515151515152%;
}

.cols-1     { width: 15.636363636364%; }
.cols-2     { width: 32.30303030303%; }
.cols-3, .cols-half  { width: 48.969696969697%; }
.cols-4     { width: 65.636363636364%; }
.cols-5     { width: 82.30303030303%; }
.cols-6, .cols-full  { width: 98.969696969697%; }



@media screen and (min-width: 415px) {
	.grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6,
	.grid-half, .grid-full, 
	.grid-unit {
		float: left;
		width:98.969696969697%;
		margin-left:.515151515152%;
		margin-right:.515151515152%;
		margin-bottom:1em;
	}
	
	/*
	.gallery .grid-unit,
	.grid-half {
		width:48.969696969696%;	/ * 46.969696969697 * /
	}
	*/
	
	.grid-flow-opposite {
		float:right
	}

}


@media screen and (min-width: 768px) {
	.grid-1     { width: 15.636363636364%; }
	.grid-2     { width: 32.30303030303%; }
	.grid-3, .grid-half  { width: 48.969696969697%; }
	.grid-4     { width: 65.636363636364%; }
	.grid-5     { width: 82.30303030303%; }
	.grid-6, .grid-full  { width: 98.969696969697%; }
	
	.gallery .grid-unit {
		width: 32.30303030303%;
	}
	
	/*
	.grid-flow-opposite {
		min-width: 380px;
	}
	*/
}




@media (min-width:320px) { /* smartphones, iPhone, portrait 480x320 phones */ }
@media (min-width:481px) { /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */ }
@media (min-width:641px) { /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */ }
@media (min-width:961px) { /* tablet, landscape iPad, lo-res laptops ands desktops */ }
@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */ }
@media (min-width:1281px) { /* hi-res laptops and desktops */ }