/**
 * layout.css
 *
 * Sections, major components and containing elements
 * Layouts specify widths and margins
 *
 * - Grid systems have their own stylesheet in layout
 * - Mostly use single class names
 * - No use of ID's
 * - No use of !important
 * - Prefix layout classes with l-
 *
**/

.l-site {
	margin: 0 auto;
	padding: 0 10px 10px;
	position: relative;
}

.l-header {
	display: none;
}

@media screen and (min-width: 768px) {
	.l-site {
		margin: 0 auto;
		padding: 30px 10px 10px;
		position: relative;
	}
}

@media screen and (min-width: 1024px) {
	.l-site {
		max-width: 1170px;
	}

}