/* 
Keyword colors can be found at http://colours.neilorangepeel.com/
*/

/* border-box fix */
html {
  	box-sizing: border-box;
}
*, *:before, *:after {
  	box-sizing: inherit;
}

body {
  	padding: 0;
  	margin: 0;
	display: flex;
	justify-content: center;
}
h1, h2 {
  	text-transform: uppercase;
}

/* Add padding to all of the .container child elements */
.container > * {
  	padding: 20px;
}
.container {
	max-width: 1000px;
  	color: white;
  	font-family: helvetica, arial, sans-serif;
	display: flex;
	flex-wrap: wrap;
}

header {
  	background: darkblue;
	flex: 0 1 100%;
	order: 1;
}
main {
  	background: slategray;
	order: 3;
	flex: 1 0 500px;
}
nav {
  	background: cadetblue;
	order: 2;
	flex: 1 0 200px;
}
aside {
  	background: seagreen;
	order: 4;
	flex: 1 0 200px;
}
footer {
  	background: darkslateblue;
	flex: 1 0 100%;
	order: 5;
}