// Copyright (c) 2021 Julien Floret
// Copyright (c) 2021 Robin Jarry
// SPDX-License-Identifier: BSD-3-Clause

body {
  display: flex;
  flex-direction: column;
  height: 100vh;
  color: $darkgray;
  font-weight: 500;
  font-family: $font_sans;

  header {
    color: $white;
    background-color: $primary;

    > div {
      height: $banner_height;
      max-width: $width;
      padding: $padding;
      display: flex;
      flex-direction: row;
      align-items: flex-end;
      margin: 0 auto;

      img {
        display: inline;
        height: $banner_height - 2 * $padding;
      }

      h1 {
        display: inline;
        font-weight: 800;
        padding-left: 2 * $padding;
        font-size: 2rem;
      }
    }
  }

  nav {
    background-color: $lightgray;

    > div {
      height: $banner_height / 2;
      max-width: $width;
      padding: $padding;
      color: lighten($darkgray, 30%);
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: center;
      margin: 0 auto;

      .crumb:before {
        content: "/ ";
      }
      .crumb {
        padding-right: $padding;
      }
      a {
        color: $darkgray;
      }
      a:hover {
        text-decoration: underline;
      }
    }
  }

  main {
    flex-grow: 1;

    section {
      max-width: $width;
      padding: $padding;
      margin: 0 auto;
    }
  }

  footer {
    color: $darkgray;
    background-color: $lightgray;

    > div {
      height: $banner_height / 2;
      max-width: $width;
      padding: $padding;
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      margin: 0 auto;
      font-size: 0.75rem;

      a {
        color: lighten($darkgray, 20%);
      }

      a:hover {
        color: $darkgray;
        text-decoration: underline;
      }
    }
  }
}
