/*--------------------------------------------------------------
13 Grid
--------------------------------------------------------------*/

/* 3 column, 1/4 1/3 2/3 3/3 classes */

.container {
	margin: 0 auto!important;
	max-width: 400px;
	width: 100%;
}
.container:before,
.container:after {
	content: " "; /* 1 */
	display: table; /* 2 */
}
.container:after {
	clear: both;
}
.container {
	*zoom: 1;
}

[class*="column-"] {
	width: 100%;
	margin: 0;
}
.container > [class*="column-"] > * {
	margin-left: 12px;
	margin-right: 12px;
}
.container .container > [class*="column-"] > * {
	margin-left: 12px;
	margin-right: 12px;
}

.container > [class*="column-"] .sidebar {
	margin: 0;
}

.container > [class*="column-"] .sidebar > * {
	margin: 0;
}
.container .container > [class*="column-"] .sidebar > * {
	margin: 0;
}

.column-full {
	float: none;
}

.column-nofloat {
	float: none!important;
}

@media only screen and (min-width: 340px) {
	.container {
		max-width: 100%;
	}
	.column-one-quarter,
	.column-two-thirds .column-one-third {
		width: 50%;
		float: left;
	}
	.column-one-quarter:nth-of-type(2n+1),
	.column-two-thirds .column-one-third:nth-of-type(2n+1) {
		clear: left;
	}

	.noclear .column-one-quarter:nth-of-type(2n+1),
	.noclear .column-two-thirds .column-one-third:nth-of-type(2n+1) {
		clear: none;
	}
}

@media only screen and (min-width: 500px) {

	.column-one-third {
		width: 50%;
		float: left;
	}
	.column-two-thirds {
		width: 100%;
	}
	.column-two-thirds .column-one-third {
		width: 33.3333%;
	}
	.column-two-thirds + .column-one-third,
	.column-one-third + .column-two-thirds {
		width: 100%;
	}
	.column-one-quarter {
		width: 50%;
		float: left;
	}
	.column-half {
		width: 100%;
	}
	.column-three-quarters {
		width: 100%;
	}
	.column-two-thirds .column-one-third:nth-of-type(2n+1) {
		clear: none;
	}

	.column-one-quarter:nth-of-type(2n+1),
	[class*="column-"] .column-one-quarter:nth-of-type(4n+1) {
		clear: left;
	}

	.noclear .column-one-quarter:nth-of-type(2n+1),
	[class*="column-"] .noclear .column-one-quarter:nth-of-type(4n+1) {
		clear: none;
	}

	.column-right {
		float: right;
	}
}

@media only screen and (min-width: 640px) {
	.container {
		max-width: 668px;
	}
	.column-one-third {
		float: left;
		width: 50%;
	}

	.column-full {
		float: none;
		width: auto;
	}
	[class*="column-"] .column-one-quarter:nth-of-type(2n+1) {
		clear: none;
	}
	[class*="column-"] .column-one-quarter {
		width: 25%;
	}
	.column-right {
		float: right;
	}
}

@media only screen and (min-width: 500px) and (max-width: 900px) {
	.container .column-make-half {
		width: 50%;
		float: left;
	}
	.column-make-half .column-half {
		width: 100%;
	}
}

@media only screen and (min-width: 900px) {
	.container {
		max-width: 1002px;
	}
	.column-two-thirds + .column-one-third,
	.column-one-third {
		width: 33.3333%;
	}
	.column-one-third + .column-two-thirds,
	.column-two-thirds {
		width: 66.6666%;
		float: left;
	}
	.column-one-quarter {
		width: 25%;
	}
	.column-half {
		width: 50%;
		float: left;
	}
	.column-three-quarters {
		width: 75%;
	}
	.column-one-quarter:nth-of-type(2n+1) {
		clear: none;
	}
	.column-one-quarter:nth-of-type(4n+1),
	.column-one-third:nth-of-type(3n+1) {
		clear: left;
	}

	.noclear .column-one-quarter:nth-of-type(4n+1),
	.noclear .column-one-third:nth-of-type(3n+1) {
		clear: none;
	}

	.column-right {
		float: right;
	}
}

.column-right.sidebar {
	order: 6;
}

.flex-me {
	display: flex;
	align-items: flex-start;
	align-content: flex-start;
	flex-direction: row;
	flex-wrap: wrap;
}

.flex-me > * {
	flex: 1;
}
