/* Extra small devices (phones, max 600px) */

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

  section#imprint .center {
    font-size: 0.8rem;
    width: unset;
  }

  section#imprint h2 {
    font-size: 1.5rem;
  }

  section#imprint h3 {
    font-size: 1.2rem;
  }

}


/* Small devices (portrait tablets and large phones, max 768px) */

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

  h1, ul {
    margin: 0;
  }

  section#reservation button {
    display: none;
  }

  section#home button {
    display: none;
  }

  section#equipment button {
    display: none;
  }

  section#insights button {
    display: none;
  }
  
}


/* Medium devices (landscape tablets, max 992px) */

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

  section#contact .grid {
    display: grid;
    grid-template-columns: 50% 50%;
    display: -ms-grid;
    -ms-grid-columns: 50% 50%;
  }

  section#contact .grid input {
    float: right;
    margin-right: 10px;
  }

  section#contact .grid textarea {
    float: left;
    margin-left: 10px;
  }

  section#contact .grid #name {
    grid-column: 1/2;
    grid-row: 1/2;
    -ms-grid-column: 1;
    -ms-grid-row: 1;
  }

  section#contact .grid #email {
    grid-column: 1/2;
    grid-row: 2/3;
    -ms-grid-column: 1;
    -ms-grid-row: 2;
  }

  section#contact .grid #phone {
    grid-column: 1/2;
    grid-row: 3/4;
    -ms-grid-column: 1;
    -ms-grid-row: 3;
  }

  section#contact .grid #message {
    grid-column: 2/3;
    grid-row: 1/4;
    -ms-grid-column: 2;
    -ms-grid-row: 1;
    -ms-grid-row-span: 3;
  }

  section#contact .grid #sendMessageButton {
    grid-column: 1/3;
    grid-row: 4/5;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
    -ms-grid-row: 4;
  }

  section#contact .grid #hint {
    grid-column: 1/3;
    grid-row: 4/5;
    -ms-grid-column-span: 3;
    -ms-grid-row: 4;
  }

}


/* Large devices (laptops/desktops, max 1200px) */

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


/* Header menu changer */

@media only screen and (min-width: 1200px) {

  menu.small {
    display: none;
  }

  menu.wide {
    display: inline-block;
  }

}


/* Textbox changer */

@media only screen and (min-width: 800px) {

  section .textbox {
    width: 40%;
  }

}