You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
59 lines
854 B
59 lines
854 B
3 months ago
|
/*
|
||
|
|
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;
|
||
|
|
}
|