/* || General setup */
* {
  border: 1px solid black;
}
html,
body {
  margin: 0;
  padding: 0;
}

body {
  width: 80%;
  max-width: 1280px;
  margin: 0 auto;
}

body > *, main > * {
  padding: 1%;
}

/* || header layout */

header {
  display: flex;
}
h1 {
  flex: 1;
  text-align: center;
}

header img {
  height: 60px;
}

/* || nav layout */

nav {
  display: flex;
  position: sticky;
  top: 0;
}

nav ul {
  padding: 0;
  list-style-type: none;
  flex: auto;
  display: flex;
}

nav li {
  text-align: center;
  flex: auto;
}

nav a {
  text-decoration: none;
  color: black;
}

/* || main layout */

main {
  display: flex;
}

article,
section {
  flex: 3;
}

aside {
  flex: 2;
}