/* Row
============================================================= */

.row {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-flow: row wrap;
		-ms-flex-flow: row wrap;
			flex-flow: row wrap;
}

.row.xs {
	max-width: 32rem;
	margin-left: auto;
	margin-right: auto;
}

.row.sm {
	max-width: 48rem;
	margin-left: auto;
	margin-right: auto;
}

.row.md {
	max-width: 64rem;
	margin-left: auto;
	margin-right: auto;
}

.row.lg {
	max-width: 80rem;
	margin-left: auto;
	margin-right: auto;
}

.row.xl {
	max-width: 96rem;
	margin-left: auto;
	margin-right: auto;
}

/* Column
============================================================= */

.col {
	display: block;
	-webkit-box-flex: 0;
	-webkit-flex: none;
		-ms-flex: none;
			flex: none;
	width: auto;
}

/* Extra-Small (>= 0px)
----------------------------- */

.row > .col.xs-0 {
	display: none;
}

.row > .col.xs-1 {
	display: block;
	width: 8.3333%;
}

.row > .col.xs-2 {
	display: block;
	width: 16.6667%;
}

.row > .col.xs-3 {
	display: block;
	width: 25%;
}

.row > .col.xs-4 {
	display: block;
	width: 33.3333%;
}

.row > .col.xs-5 {
	display: block;
	width: 41.6667%;
}

.row > .col.xs-6 {
	display: block;
	width: 50%;
}

.row > .col.xs-7 {
	display: block;
	width: 58.3333%;
}

.row > .col.xs-8 {
	display: block;
	width: 66.6667%;
}

.row > .col.xs-9 {
	display: block;
	width: 75%;
}

.row > .col.xs-10 {
	display: block;
	width: 83.3333%;
}

.row > .col.xs-11 {
	display: block;
	width: 91.6667%;
}

.row > .col.xs-12 {
	display: block;
	width: 100%;
}

.row > .col.xs-fixed {
	display: block;
	width: auto;
}

.row > .col.xs-auto {
	display: block;
	-webkit-box-flex: 1;
	-webkit-flex: 1 1 0.00000001px; /* IE Flex bug, cannot use 0 as flex-shrink, but minification removes unit. */
		-ms-flex: 1 1 0.00000001px;
			flex: 1 1 0.00000001px;
	width: auto;
}

/* Small (>= 512px)
----------------------------- */
@media (min-width: 32em) {
	.row > .col.sm-0 {
		display: none;
	}

	.row > .col.sm-1 {
		display: block;
		width: 8.3333%;
	}

	.row > .col.sm-2 {
		display: block;
		width: 16.6667%;
	}

	.row > .col.sm-3 {
		display: block;
		width: 25%;
	}

	.row > .col.sm-4 {
		display: block;
		width: 33.3333%;
	}

	.row > .col.sm-5 {
		display: block;
		width: 41.6667%;
	}

	.row > .col.sm-6 {
		display: block;
		width: 50%;
	}

	.row > .col.sm-7 {
		display: block;
		width: 58.3333%;
	}

	.row > .col.sm-8 {
		display: block;
		width: 66.6667%;
	}

	.row > .col.sm-9 {
		display: block;
		width: 75%;
	}

	.row > .col.sm-10 {
		display: block;
		width: 83.3333%;
	}

	.row > .col.sm-11 {
		display: block;
		width: 91.6667%;
	}

	.row > .col.sm-12 {
		display: block;
		width: 100%;
	}

	.row > .col.sm-fixed {
		display: block;
		width: auto;
	}

	.row > .col.sm-auto {
		display: block;
		-webkit-box-flex: 1;
		-webkit-flex: 1 1 0.00000001px; /* IE Flex bug, cannot use 0 as flex-shrink, but minification removes unit. */
			-ms-flex: 1 1 0.00000001px;
				flex: 1 1 0.00000001px;
		width: auto;
	}
}

/* Medium (>= 768px)
----------------------------- */

@media (min-width: 48em) {
	.row > .col.md-0 {
		display: none;
	}

	.row > .col.md-1 {
		display: block;
		width: 8.3333%;
	}

	.row > .col.md-2 {
		display: block;
		width: 16.6667%;
	}

	.row > .col.md-3 {
		display: block;
		width: 25%;
	}

	.row > .col.md-4 {
		display: block;
		width: 33.3333%;
	}

	.row > .col.md-5 {
		display: block;
		width: 41.6667%;
	}

	.row > .col.md-6 {
		display: block;
		width: 50%;
	}

	.row > .col.md-7 {
		display: block;
		width: 58.3333%;
	}

	.row > .col.md-8 {
		display: block;
		width: 66.6667%;
	}

	.row > .col.md-9 {
		display: block;
		width: 75%;
	}

	.row > .col.md-10 {
		display: block;
		width: 83.3333%;
	}

	.row > .col.md-11 {
		display: block;
		width: 91.6667%;
	}

	.row > .col.md-12 {
		display: block;
		width: 100%;
	}

	.row > .col.md-fixed {
		display: block;
		width: auto;
	}

	.row > .col.md-auto {
		display: block;
		-webkit-box-flex: 1;
		-webkit-flex: 1 1 0.00000001px; /* IE Flex bug, cannot use 0 as flex-shrink, but minification removes unit. */
			-ms-flex: 1 1 0.00000001px;
				flex: 1 1 0.00000001px;
		width: auto;
	}
}

/* Large (>= 1024px)
----------------------------- */

@media (min-width: 64em) {
	.row > .col.lg-0 {
		display: none;
	}

	.row > .col.lg-1 {
		display: block;
		width: 8.3333%;
	}

	.row > .col.lg-2 {
		display: block;
		width: 16.6667%;
	}

	.row > .col.lg-3 {
		display: block;
		width: 25%;
	}

	.row > .col.lg-4 {
		display: block;
		width: 33.3333%;
	}

	.row > .col.lg-5 {
		display: block;
		width: 41.6667%;
	}

	.row > .col.lg-6 {
		display: block;
		width: 50%;
	}

	.row > .col.lg-7 {
		display: block;
		width: 58.3333%;
	}

	.row > .col.lg-8 {
		display: block;
		width: 66.6667%;
	}

	.row > .col.lg-9 {
		display: block;
		width: 75%;
	}

	.row > .col.lg-10 {
		display: block;
		width: 83.3333%;
	}

	.row > .col.lg-11 {
		display: block;
		width: 91.6667%;
	}

	.row > .col.lg-12 {
		display: block;
		width: 100%;
	}

	.row > .col.lg-fixed {
		display: block;
		width: auto;
	}

	.row > .col.lg-auto {
		display: block;
		-webkit-box-flex: 1;
		-webkit-flex: 1 1 0.00000001px; /* IE Flex bug, cannot use 0 as flex-shrink, but minification removes unit. */
			-ms-flex: 1 1 0.00000001px;
				flex: 1 1 0.00000001px;
		width: auto;
	}
}

/* Extra-Large (>= 1280px)
----------------------------- */

@media (min-width: 80em) {
	.row > .col.xl-0 {
		display: none;
	}

	.row > .col.xl-1 {
		display: block;
		width: 8.3333%;
	}

	.row > .col.xl-2 {
		display: block;
		width: 16.6667%;
	}

	.row > .col.xl-3 {
		display: block;
		width: 25%;
	}

	.row > .col.xl-4 {
		display: block;
		width: 33.3333%;
	}

	.row > .col.xl-5 {
		display: block;
		width: 41.6667%;
	}

	.row > .col.xl-6 {
		display: block;
		width: 50%;
	}

	.row > .col.xl-7 {
		display: block;
		width: 58.3333%;
	}

	.row > .col.xl-8 {
		display: block;
		width: 66.6667%;
	}

	.row > .col.xl-9 {
		display: block;
		width: 75%;
	}

	.row > .col.xl-10 {
		display: block;
		width: 83.3333%;
	}

	.row > .col.xl-11 {
		display: block;
		width: 91.6667%;
	}

	.row > .col.xl-12 {
		display: block;
		width: 100%;
	}

	.row > .col.xl-fixed {
		display: block;
		width: auto;
	}

	.row > .col.xl-auto {
		display: block;
		-webkit-box-flex: 1;
		-webkit-flex: 1 1 0.00000001px; /* IE Flex bug, cannot use 0 as flex-shrink, but minification removes unit. */
			-ms-flex: 1 1 0.00000001px;
				flex: 1 1 0.00000001px;
		width: auto;
	}
}