/*
	Content	: Responsive layout grid system
	Version	: 1.0
	Descr..	: 12 column layout
	Author	: Yngve Wikøren Nilsen (@InBusiness)
	Created	: 20141112
	Update	: (yyyymmdd/name)
*/
[data-columns]{
	width:100%;
	width:calc(100% + 30px);
	display:inline-block;
	margin:0 -15px;}
[data-columns="1"] > *,
[data-columns="2"] > *,
[data-columns="3"] > *,
[data-columns="4"] > *,
[data-columns="5"] > *,
[data-columns="6"] > *,
[data-columns="7"] > *,
[data-columns="8"] > *,
[data-columns="9"] > *,
[data-columns="10"] > *,
[data-columns="11"] > *,
[data-columns="12"] > *{
	float:left;
	-moz-box-sizing:border-box;
	box-sizing:border-box}
	
/*clearing rows*/
[data-columns="1"] > *:nth-child(1n+1),
[data-columns="2"] > *:nth-child(2n+1),
[data-columns="3"] > *:nth-child(3n+1),
[data-columns="4"] > *:nth-child(4n+1),
[data-columns="5"] > *:nth-child(5n+1),
[data-columns="6"] > *:nth-child(6n+1),
[data-columns="7"] > *:nth-child(7n+1),
[data-columns="8"] > *:nth-child(8n+1),
[data-columns="9"] > *:nth-child(9n+1),
[data-columns="10"] > *:nth-child(10n+1),
[data-columns="11"] > *:nth-child(11n+1),
[data-columns="12"] > *:nth-child(12n+1){clear:both}
/*default widths*/
[data-columns="1"] > *{width:100%}
[data-columns="2"] > *{width:50%}
[data-columns="3"] > *{width:33.333333333333333333333333333333%}
[data-columns="4"] > *{width:25%}
[data-columns="5"] > *{width:20%}
[data-columns="6"] > *{width:16.666666666666666666666666666667%}
[data-columns="7"] > *{width:14.285714285714285714285714285714%}
[data-columns="8"] > *{width:12.5%}
[data-columns="9"] > *{width:11.111111111111111111111111111111%}
[data-columns="10"] > *{width:10%}
[data-columns="11"] > *{width:9.0909090909090909090909090909091%}
[data-columns="12"] > *{width:8.3333333333333333333333333333333%}
/*default spacing (set to 0 for one-column layout in mq.css*/
[data-columns]>*{padding:0 15px}
x[data-columns]>*:first-child{padding-left:0}
x[data-columns]>*:last-child{padding-right:0}
/*override*/
@media only screen and (max-width: 400px) {
/*[data-columns]>*{width:calc(100% - 30px);margin:0 15px;xpadding:0;}*/
}
@media only screen and (max-width: 800px) {
	[data-columns="1"] > *{width:100%}
	[data-columns="2"] > *{width:50%}
	[data-columns="3"] > *{width:33.333333333333333333333333333333%}
	[data-columns="4"] > *{width:50%}/*changed*/
	[data-columns="5"] > *{width:20%}
	[data-columns="6"] > *{width:16.666666666666666666666666666667%}
	[data-columns="7"] > *{width:14.285714285714285714285714285714%}
	[data-columns="8"] > *{width:12.5%}
	[data-columns="9"] > *{width:11.111111111111111111111111111111%}
	[data-columns="10"] > *{width:10%}
	[data-columns="11"] > *{width:9.0909090909090909090909090909091%}
	[data-columns="12"] > *{width:8.3333333333333333333333333333333%}
	/*override*/
	footer [data-columns="2"] > *{width:100%!important}/*if footer menu make cols 100%*/
}
@media only screen and (max-width: 600px) {
	[data-columns="1"] > *{width:100%}
	[data-columns="2"] > *{width:50%}
	[data-columns="3"] > *{width:33.333333333333333333333333333333%}
	[data-columns="4"] > *{width:100%}/*changed*/
	[data-columns="5"] > *{width:20%}
	[data-columns="6"] > *{width:16.666666666666666666666666666667%}
	[data-columns="7"] > *{width:14.285714285714285714285714285714%}
	[data-columns="8"] > *{width:12.5%}
	[data-columns="9"] > *{width:11.111111111111111111111111111111%}
	[data-columns="10"] > *{width:10%}
	[data-columns="11"] > *{width:9.0909090909090909090909090909091%}
	[data-columns="12"] > *{width:8.3333333333333333333333333333333%}
}