body {
    display: flex;
    flex-direction: column;
    min-width: 375px;
  }
  
  header {
    flex: 0 80px;
  }
  
  main {
    flex: 1 calc(100vh - 110px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    font-family: sans-serif;

  }
  
  footer {
    flex: 0 30px;
  }
  
  menu {
    flex: 1;
    display: flex;
    /*  overwrite Bootstrap so the menu does not wrap */
    flex-direction: row !important;
    list-style: none;
  }
  
  .navbar-brand {
    padding-left: 0.3em;
    border-bottom: solid rgb(182, 182, 182) thin;
  }
  
  menu .nav-item {
    padding: 0 0.3em;
  }
  
  footer a {
    float: right;
  }
  
  input[type="text"], textarea {
    background-color: #202224;
    color: white;
  }

  input[type="password"], textarea {
    background-color: #202224;
    color: white;
  }

  @media (max-height: 600px) {
    header {
      display: none;
    }
    footer {
      display: none;
    }
    main {
      flex: 1 100vh;
    }
  }