/*
 * skel-grid-static.css
 * Static replacement for skel.js v0.4.9.
 * Replicates the exact CSS that skel.js generates dynamically.
 */

/* ==========================================================================
   Eric Meyer Reset CSS (from resetCSS: true)
   ========================================================================== */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,
strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,
label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,
details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,
section,summary,time,mark,audio,video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
	display: block;
}

body {
	line-height: 1;
}

ol,ul {
	list-style: none;
}

blockquote,q {
	quotes: none;
}

blockquote:before,blockquote:after,q:before,q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

body {
	-webkit-text-size-adjust: none;
}

/* ==========================================================================
   Box Model (from boxModel: "border")
   ========================================================================== */

*,*:before,*:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

/* ==========================================================================
   Container (from containers: "fluid")
   ========================================================================== */

body {
	min-width: 100%;
}

.container {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

.container.small {
	width: 75%;
}

.container.big {
	width: 100%;
	max-width: 125%;
	min-width: 100%;
}

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

.row > * {
	float: left;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.row:after {
	content: '';
	display: block;
	clear: both;
	height: 0;
}

.row:first-child > * {
	padding-top: 0 !important;
}

/* ==========================================================================
   Column Widths (12-column grid)
   ========================================================================== */

.\31 2u { width: 100%; }
.\31 1u { width: 91.6666666667%; }
.\31 0u { width: 83.3333333333%; }
.\39 u  { width: 75%; }
.\38 u  { width: 66.6666666667%; }
.\37 u  { width: 58.3333333333%; }
.\36 u  { width: 50%; }
.\35 u  { width: 41.6666666667%; }
.\34 u  { width: 33.3333333333%; }
.\33 u  { width: 25%; }
.\32 u  { width: 16.6666666667%; }
.\31 u  { width: 8.3333333333%; }

/* ==========================================================================
   Column Offsets (margin-left)
   ========================================================================== */

.\-11u { margin-left: 91.6666666667%; }
.\-10u { margin-left: 83.3333333333%; }
.\-9u  { margin-left: 75%; }
.\-8u  { margin-left: 66.6666666667%; }
.\-7u  { margin-left: 58.3333333333%; }
.\-6u  { margin-left: 50%; }
.\-5u  { margin-left: 41.6666666667%; }
.\-4u  { margin-left: 33.3333333333%; }
.\-3u  { margin-left: 25%; }
.\-2u  { margin-left: 16.6666666667%; }
.\-1u  { margin-left: 8.3333333333%; }

/* ==========================================================================
   Default Gutters: 30px (for narrow breakpoint)
   Used as default, overridden by wide @media query below
   ========================================================================== */

.row.flush { margin-left: 0; }
.row.flush > * { padding: 0 !important; }

.row > * { padding-left: 30px; }
.row + .row > * { padding: 30px 0 0 30px; }
.row { margin-left: -30px; }

.row.half > * { padding-left: 15px; }
.row + .row.half > * { padding: 15px 0 0 15px; }
.row.half { margin-left: -15px; }

.row.quarter > * { padding-left: 7.5px; }
.row + .row.quarter > * { padding: 7.5px 0 0 7.5px; }
.row.quarter { margin-left: -7.5px; }

.row.oneandhalf > * { padding-left: 45px; }
.row + .row.oneandhalf > * { padding: 45px 0 0 45px; }
.row.oneandhalf { margin-left: -45px; }

.row.double > * { padding-left: 60px; }
.row + .row.double > * { padding: 60px 0 0 60px; }
.row.double { margin-left: -60px; }

/* ==========================================================================
   Wide Gutters: 50px (min-width: 1200px)
   ========================================================================== */

@media (min-width: 1200px) {
	.row.flush { margin-left: 0; }
	.row.flush > * { padding: 0 !important; }

	.row > * { padding-left: 50px; }
	.row + .row > * { padding: 50px 0 0 50px; }
	.row { margin-left: -50px; }

	.row.half > * { padding-left: 25px; }
	.row + .row.half > * { padding: 25px 0 0 25px; }
	.row.half { margin-left: -25px; }

	.row.quarter > * { padding-left: 12.5px; }
	.row + .row.quarter > * { padding: 12.5px 0 0 12.5px; }
	.row.quarter { margin-left: -12.5px; }

	.row.oneandhalf > * { padding-left: 75px; }
	.row + .row.oneandhalf > * { padding: 75px 0 0 75px; }
	.row.oneandhalf { margin-left: -75px; }

	.row.double > * { padding-left: 100px; }
	.row + .row.double > * { padding: 100px 0 0 100px; }
	.row.double { margin-left: -100px; }
}

/* ==========================================================================
   Mobile Grid Collapse (max-width: 480px)
   CSS media query fallback for no-JS
   ========================================================================== */

@media (max-width: 480px) {
	.row:not(.no-collapse):not(.no-collapse-1):not(.no-collapse-2):not(.no-collapse-3) {
		margin-left: 0;
	}

	.row:not(.no-collapse):not(.no-collapse-1):not(.no-collapse-2):not(.no-collapse-3) > * {
		float: none !important;
		width: 100% !important;
		margin-left: 0 !important;
	}

	.row:not(.flush):not(.no-collapse):not(.no-collapse-1):not(.no-collapse-2):not(.no-collapse-3) > * {
		padding: 15px 0 15px 0 !important;
	}

	.container {
		max-width: none !important;
		min-width: 0 !important;
		width: 100% !important;
	}
}

/* ==========================================================================
   JS-detected Mobile Collapse (skel.js DPR-aware breakpoint)
   skel.js divides viewport width by devicePixelRatio before checking
   breakpoints, so on HiDPI screens mobile triggers at wider viewports.
   ========================================================================== */

html.skel-mobile .row:not(.no-collapse):not(.no-collapse-1):not(.no-collapse-2):not(.no-collapse-3) {
	margin-left: 0;
}

html.skel-mobile .row:not(.no-collapse):not(.no-collapse-1):not(.no-collapse-2):not(.no-collapse-3) > * {
	float: none !important;
	width: 100% !important;
	margin-left: 0 !important;
}

html.skel-mobile .row:not(.flush):not(.no-collapse):not(.no-collapse-1):not(.no-collapse-2):not(.no-collapse-3) > * {
	padding: 15px 0 15px 0 !important;
}

html.skel-mobile .container {
	max-width: none !important;
	min-width: 0 !important;
	width: 100% !important;
}

/* JS-detected Wide Gutters override */
html.skel-wide .row.flush { margin-left: 0; }
html.skel-wide .row.flush > * { padding: 0 !important; }
html.skel-wide .row > * { padding-left: 50px; }
html.skel-wide .row + .row > * { padding: 50px 0 0 50px; }
html.skel-wide .row { margin-left: -50px; }
