body {
      display: -webkit-flex;
      display: flex;
      -webkit-flex-flow: row wrap;
      flex-flow: row wrap;
      margin: 1em;
      background: #333333;
    }

    a:link, a:visited {
      text-decoration: none;
      color: black;
    }
    a:hover {
      color: #0387c9;
      text-decoration: underline;
    }
    a:active {
      text-decoration: none;
    }

    nav,
    header,
    article,
    section,
    aside {
      border-radius: 5px;
      border: 2px solid;
      padding: 5px;
      margin: 5px;
     -webkit-flex: 1 100%;
      flex: 1 100%;
    }

    header {
      background: #a6a6a6;
      border-color: #666666;
      font-weight: bold;
      font-family: Arial;
    }

    nav {
      background: #a6a6a6;
      border-color: #666666;
      -webkit-flex: 0.5 0.5 0%;
      flex: 0.5 0.5 0%;
      font-family: Arial, Helvetica, sans-serif;
    }

    section {
      background: #a6a6a6;
      border-color: #666666;
    }

    article {
      background: #0387c9;
      border-color: #666666;
      -webkit-flex: 3 1 0%;
      flex: 3 1 0%;
      font-family: Courier New;
    }

    aside {
      background: #ebf5d7;
      border-color: #d5d5d5;
      -webkit-flex: 1 1 0%;
      flex: 1 1 0%;
    }