body {
  margin: 15%;
  margin-top: 5%;
  background-color: #e4e2da;
}

/* HOME */

div.menu {
  width: 90%;
  text-align: center;
}

  .menu h1 {
    font-family: 'Courier New', monospace;
    font-variation-settings: 'wght' 100;
    color: #4d4f4b;
    font-size: calc(28px + 0.95vw);
  }

  .menu a {
    font-family: 'Courier New', monospace;
    color: #4d4f4b;
    font-size: calc(10px + 0.55vw);
    }

  .menu p {
    font-family: 'Courier New', monospace;
    font-size: calc(8px + 0.35vw);
        text-align: left;
    color: #4d4f4b;
    width: 65%;
    max-width: 1000px;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
  }

 /* ABOUT */

  div.about {
  background-color: #e4e2da;
  text-align: left;
  width: 65%;
  height: auto;
  display: block;
  margin-left: 17%;
  margin-right: auto;
  padding: 3%;
  border-style: solid;
  border-radius: 1px;
  border-width: 1px;
  border-color: #4d4f4b;
}

.button {
  border-style: solid;
  border-radius: 1px;
  border-width: 1px;
  border-color: #444444;
  background-color: #4d4f4b;
  color: #e4e2da;
  padding: 5px;
  text-decoration: none;
  text-align: center;
  margin:auto;
  display:block;
  }

  .button a {
    font-family: 'Courier New', monospace;
    color: #e4e2da;
      font-size: calc(10px + 0.25vw);
        }

        .button a:hover {
        font-style: italic;
        }


  .about h1  {
  font-family: 'Courier New', monospace;
      font-variation-settings: 'wght' 500;
    text-align: center;
    color: #4d4f4b;
  }

  .about p {
      font-size: calc(10px + 0.25vw);
      color: #4d4f4b;
      line-height: 130%;
        }

         /* PHOTOS */
        .responsive {
          width: 35%;
          max-width: 1000px;
          height: auto;
          display: block;
          margin-left: auto;
          margin-right: auto;
        }

        footer {
            position: fixed;
            left: 0;
            bottom: 0;
            width: 100%;
            background-color: #e4e2da;
            max-height: 5%;
            color: #4d4f4b;
            padding: 1px;
            padding-left: 32%;
            font-family: 'Courier New', monospace;
            font-size: calc(10px + 0.25vw);
          }
        }

 /* SMALL SCREENS */

@media screen and (max-width: 700px) {

  body {
    margin: 12%;
    margin-top: 25%;
    }


  div.about {
      width: 80%;
      margin-left: 3%;
      margin-right: 3%;
      padding: 2%;
          }


              }