@media only screen and (max-width: 1280px) {}

@media only screen and (max-width: 950px) {
  .responsive {
    width: 49%;
    margin: 1% 0;
  }

  #booking {
    flex-flow: column;
  }

  #my_calendar {
    width: 90%;
    margin: 5%;
    padding-bottom: 0%;
  }

  #contact {
    width: 100%;
    padding-top: 0%;
  }

  #availability {
    padding: 0 2% 2% 2%;
    text-align: center;
  }

}

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

  /*Global Site Elements*/

  /*Header Elements*/

  /*Page 1 Settings*/
  .grid-item1 {
    grid-area: 1/1/2/4;
  }

  .grid-item2 {
    grid-area: 2/1/3/4;
  }

  #headline1 {
    font-size: 2em;
  }

  #protea {
    width: 10%;
  }

  .grid-item3 {
    grid-area: 3/1/4/4;
    padding: 3% 20% 3% 20%;
  }

  .grid-item4 {
    grid-area: 4/1/5/4;
    padding: 3% 20% 3% 20%;
  }

  .grid-item5 {
    grid-area: 5/1/6/4;
    padding: 3% 20% 8% 20%;
  }

  /*Page 2 Settings*/
  #headline2 {
    text-align: center;
  }

  #home1 {
    font-size: 0.9em;
  }

  .mini {
    flex-direction: column;
    align-items: center;
  }

  .mini img {
    width: 100%;
    padding: 5% border-radius: 1em;
  }

  .mini p {
    padding: 0% 5% 0% 5%;
  }

  .art {
    width: 100%;
  }

  /*Page 3 Settings*/
  #headline3 {
    text-align: center;
  }

  #home2 {
    font-size: 0.9em;
  }

  .responsive {
    width: 100%;
    margin: 1% 0;
    padding: 0% 5% 0% 5%;
  }

  /*Page 4 Settings*/


  /*Footer*/
  .grid-item10 {
    grid-area: 9/1/10/5;
    gap: 0;
    flex-direction: column;
    justify-content: center;
  }

  .footeritem {
    margin: 2% 0% 0% 0%;
  }

  /*Page Terms*/
  .content-14 {
    grid-area: content-14;
    display: block;
    max-width: 100%;
    padding: 0% 5% 0% 5%;
    background: white;
  }
}