/* MARK: 475px 
  */
  /* xs */
  @media (min-width: 475px) {
    .container {
      max-width: 475px;
    }

    .--desktop {
      display: block;
    }

    .--desktop .header u {
      display: inline;
}

    .--desktop form > h3 {
      font-size: 1.9rem;
    }

    .--desktop form button, .--desktop form .radio__label {
      font-size: 1rem;
    }

    .menu-item .carousel > h2 {
      margin-top: .9em;
    }

    .--desktop .imprint {
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 1fr 1fr;
    }
  }

  /* MARK: 640px 
  */
  /* sm */
  @media (min-width: 640px) {
    .container {
      max-width: 640px;
    }

    .--desktop .header .lang-btn > h2 {
      display: block;
    }

    .--desktop .header .header__contact {
      margin-left: 1.4em;
    }

    .--desktop .menu-item {
      width: auto;
    }

    .--desktop .menu-item h2 {
      font-size: 3.4em;
    }

    .--desktop .menu-item:not([data-active]):hover img:first-of-type {
      transform-origin: center;
      transform: scale(1.14);
      opacity: .8;
      height: auto;
    }
    .--desktop .menu-item:not([data-active]):hover > h2 {
      color: rgb(132, 234, 71)
    }

    .--desktop .menu-item[data-active] .item-description > div.placeholder {
      grid-area: 1/1/2/2;
      display: block;
    }
    .--desktop .menu-item[data-active] .item-description > div.background {
    grid-area: 3/1/6/2;
    }
    .--desktop .menu-item[data-active] .item-description > h2 {
      grid-area: 2/1/3/2;
      justify-self: center;
    }
    .--desktop .menu-item[data-active] .item-description > .paragraph {
      grid-area: 3/1/4/2;
      height: auto;
    }
    .--desktop .menu-item[data-active] .item-description > ul {
      grid-area: 4/1/5/2;
      padding-top: 1.2em;
      /* min-height: 45vh;
      max-height: 60vh; */
    }
    .--desktop .menu-item[data-active] .item-description > ul:last-of-type {
      grid-area: 5/1/6/2;
      min-height: 5vh;
    }
    .--desktop .menu-item[data-active] > h2 {
      justify-self: center;
      align-self: center;
      margin-top: unset;
      margin-left: unset;
      width: fit-content;
    }

    .--desktop .menu-item .paragraph > p {
      font-size: 1.9rem;
    }

    .--desktop .menu-item  li > u {
      font-size: 1.75rem;
      font-weight: 400;
    }

    .--desktop .menu-item  li {
      font-size: 1.35rem;
      width: 100%;
    }

    .--desktop .menu-item > button {
      transform: scale(1);
      margin-right: 1em;
    }

    .menu-item .slideshow {
    grid-area: 1/1/5/2;
    }

    .carousel-button {
    font-size: 4rem;
    border-radius: 0.35rem;
    padding: .3rem .8rem;
    }

    .bematrix {
      grid-template-rows: auto 24vh;
    }
    .bematrix > h3 {
      font-size: 1.5em;
    }

    .imprint-extended h5:first-of-type {
    padding-top: 4em;
    }
  }

  /* MARK: 768px 
  */
  /* md */
  @media (min-width: 768px) {
    .container {
      max-width: 768px;
    }

    /* Header */
    .--desktop .header .header__logo img {
      height: 3.2em;
    }

    .--desktop .header .header__logo h2 {
      font-size: 1.8em;
      padding-left: .15em;
    }

    .--desktop .header .header__contact h2 {
      font-size: 1.1em;
      font-weight: 600;
      padding-left: .1em;
    }

    .--desktop .header h2 {
      font-size: 1.1rem;
    }

    .--desktop form {
      height: 100vh;
    }

    /* Menu */
    .--desktop .item-1 {
      grid-row-start: span 2;
      grid-column-start: span 6;
    }

    .--desktop .item-4,
    .--desktop .item-5 {
      grid-row-start: span 2;
      grid-column-start: span 4;
    }

    .--desktop .item-3,
    .--desktop .item-6 {
      grid-row-start: span 2;
      grid-column-start: span 2;
    }


    .--desktop .menu-item h2 {
      font-size: 2.4em;
    }
  }

  /* MARK: 1024px 
  */
  /* lg */
  @media (min-width: 1024px) {
    .container {
      max-width: 1024px;
    }

    /* Header */
    .--desktop .header .header__logo img {
      height: 4.2em;
    }

    .--desktop .header .header__contact {
      padding: .7em .8em;
    }

    /* Formular */
    /* .--desktop #formG {
      grid-template-rows: auto;
      grid-auto-rows: auto;
      row-gap: .6rem;
    } */

    .--desktop input,
    .--desktop textarea {
      font-size: 1rem;
    }

    .--desktop form button,
    .--desktop form .radio__label {
      /* font-size: 1.25rem; */
      font-size: 1.6rem;

    }

    /* .--desktop form > h2 {
      font-size: 1.9rem;
    } */
    

    .--desktop input {
      width: 80%;
      padding: .2rem 0;
    }

    .--desktop textarea {
      width: 80%;
      height: 24vh;
    }

    .--desktop input::placeholder,
    .--desktop textarea::placeholder {
      font-size: 1.6rem;
    }

    .--desktop form div,
    .--desktop form>h3 {
      width: 80%;
    }

    /* Menu */
    .--desktop .menu-item .item-description h2 {
      font-size: 3.4em;
      font-weight: 700;
    }

    /* Impressum */
    .--desktop .imprint {
      width: 80%;
      grid-template-columns: 1fr 1fr 1fr 1fr;
      grid-template-rows: 1fr;
      grid-auto-flow: row;
    }

    .imprint-extended {
      width: 80%;
    }

    .carousel > h2 {
      padding-top: 6vh;
    }
    .slide img {
      width: 60%;
    }
  }

  /* MARK: 1280px 
  */
  /* XL */
  @media (min-width: 1280px) {
    .container {
      max-width: 1280px;
    }

    /* Header */
    .--desktop .header .header__logo img {
      height: 4.6em;
    }

    .--desktop .header .header__contact {
      padding: .9em 1em;
    }


    .--desktop .menu-item:not([data-active]) > h2 {
      font-size: 3.4em;
    }
    .--desktop .menu-item[data-active] .item-description > h2 {
      font-size: 3.8em;
    }
    /* .--desktop .menu-item[data-active] {
      height: fit-content;
    } */
    .--desktop .menu-item[data-active] .item-description {
      grid-template-rows: 37vh 12vh auto auto auto;
      /* background-color: linear-gradient; */
      /* height: fit-content; */
    }

    .--desktop .menu-item[data-active] .item-description > .paragraph {
      height: fit-content;
      min-height: 8vh;
    }
    .--desktop .menu-item[data-active] .item-description > ul:first-of-type  {
      min-height: auto;
      /* height: 46vh;
      max-height: 54vh; */
    }
    .--desktop .menu-item[data-active] .item-description > div.placeholder {
      height: 30vh;
    }
    .--desktop .menu-item .item-description > ul > li > u, .--desktop .menu-item .item-description > ul > li {
      width: 70%;
      padding-left: 15%;
      padding-right: 15%;
    }
    .--desktop .menu-item p {
      width: 80%;
    }
  }

  /* MARK: 1536px 
  */
  /* 2xl */
  @media (min-width: 1536px) {
    .container {
      max-width: 1536px;
    }
  }