:root {
  --green: #50611D;
  --red: #BA1229;
  --brown: #502D16;
  --green2: #758D2A;
  --tan: #DED7BA; }

@media (max-width: 800px) {
  .description-grid { flex-grow: 1; }
}

body {
  padding: 3%;
  background: var(--green);
  background-image: url(/images/grass.png); }

#menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: -5.5%;
  margin-left: -5.5%;
  margin-right: -5.5%;
  padding: 25px 10px 0px 10px;
  background: var(--brown);
  a { color: var(--red); font-size: 1.15em; font-weight: bold; text-decoration: none; }
}

#header {
  text-align: center;
  font-family: monospace;
  color: white; }

#description {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 70%;
  margin: 30px auto 30px auto;
  padding: 20px;
  background-color: var(--tan);
  border: 3px solid var(--red);
  font-family: monospace;
  color: var(--brown); }

#db {
  background-color: white;
  border: 3px solid var(--green2);
  font-family: monospace; }

.menu-grid {
  float: left;
  box-sizing: border-box;
  margin: 10px;
  padding: 0px 10px 0px 10px;
  vertical-align: middle; }

.description-grid {
  float: left;
  box-sizing: border-box;
  width: 25%;
  min-width: 160px;
  padding: 0 7px 0 7px; }

h1 {
  font-size: 3em; }