@media (max-width: 812px) {
  body {
    line-height: 1.4;
  }
  .container {
    margin: auto;
    padding: 0;
    overflow: hidden;
  }

  p {
    font-size: 0.8rem;
  }

  li {
    font-size: 0.8rem;
  }

  h3 {
    font-size: 0.9rem;
    margin: 0.3rem 0;
  }
  h2 {
    font-size: medium;
    font-weight: 600;
  }
  .lead {
    font-size: 0.8rem;
    margin-bottom: 1rem;
  }
  .heading {
    font-size: medium;
  }
  .section-title {
    font-size: 1.3rem;
    margin-top: 0.5rem;
  }

  .flex-items {
    flex-direction: column;
  }

  .flex-items > div {
    padding: 1rem;
    margin: 0 1rem;
    border-bottom: 1px dotted var(--dark-grey);
  }

  .flex-items > div:last-child {
    border: none;
  }

  #logo {
    display: none;
  }

  #kontakt-logo {
    width: 130px;
  }

  #home-nav {
    height: 3rem;
    background: rgba(255, 255, 255, 0);
  }
  #main-nav {
    height: 3rem;
    background: var(--light-grey);
  }
  #home-nav .container,
  #main-nav .container {
    /* align-items: flex-start; */
    border-bottom: 0;
    height: 3rem;
    /* margin-left: 3rem; */
  }

  #home-nav ul,
  #main-nav ul {
    height: 3rem;
    margin-left: 0;
  }

  .showcase {
    margin-top: 0;
    padding: 1rem;
  }
  #showcase-home {
    height: 40vh;
    background: url(../img/Schrift.svg) no-repeat 25% 41%;
    background-size: 50%;
  }
  #showcase-home h1 {
    padding-top: 3.4rem;
    font-size: 1.1rem;
    padding-left: 8rem;
  }
  #showcase-home p {
    display: none;
  }

  .icons {
    background: rgba(248, 249, 250, 0.5);
    height: auto;
    padding: 0;
    margin-bottom: 2rem;
  }
  .icons h3 {
    font-size: medium;
  }
  .icons a {
    padding: 0.5rem;
  }
  .icons i {
    padding: 0.5rem;
  }
  #kontakt {
    padding-bottom: 1rem;
  }
  .kontakt-icons {
    margin-top: 1.3rem;
  }

  #map {
    display: none;
  }

  /* Workshops */
  .workshop-a {
    margin-bottom: 0;
    padding: 1rem 1rem;
  }
  .workshop-flex {
    flex-direction: column-reverse;
  }
  .workshop-flex .item2 {
    padding: 1rem 1rem 0 1rem;
  }

  #itworks {
    width: 80%;
    padding: 1rem;
    border-radius: 50px;
  }

  .workshop-a1,
  .workshop-b,
  .workshop-c,
  .beratung-b,
  .web-b {
    background: rgba(248, 249, 250, 0.5);
  }
  .workshop-a1,
  .beratung-b,
  .web-b {
    margin-top: 1rem;
  }

  #workshops,
  #beratung,
  #web,
  #kontakt {
    padding: 3rem 0;
  }

  /* Footer */
  #home-footer,
  #main-footer {
    height: 3rem;
  }
  #home-footer .container,
  #main-footer .container {
    background: var(--light-grey);
  }

  #home-footer .footer-content,
  #main-footer .footer-content {
    display: flex;
    flex-direction: column-reverse;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 4rem;
    padding: 0;
  }

  #home-footer .footer-links,
  #main-footer .footer-links {
    padding: 0.5rem;
  }
  #home-footer .footer-links a,
  #main-footer .footer-links a {
    font-size: 0.71rem;
  }
  #home-footer .footer-content p,
  #main-footer .footer-content p {
    font-size: 0.71rem;
    margin: 0;
    padding-bottom: 0.5rem;
  }
}

@media (max-width: 340px) {
  body {
    line-height: 1.3;
  }

  p {
    font-size: small;
  }
  h3 {
    font-size: smaller;
  }

  li {
    font-size: small;
  }
  .lead {
    font-size: smaller;
    margin-bottom: 0.5rem;
  }
  .heading {
    font-size: smaller;
    margin: 1rem 0.5rem 0.5rem 0;
  }

  .section-title {
    font-size: large;
    margin-top: 0.5rem;
  }

  #showcase-home .showcase-home-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
  }
  #showcase-home .logo {
    width: 80%;
    height: 80%;
  }
  #showcase-home h1 {
    font-size: 0.8rem;
  }

  /* Kontakt */
  #showcase-kontakt .address h3 {
    margin: 1rem 0;
    padding: 0.5rem;
    font-size: small;
  }
  #showcase-kontakt .address {
    margin: 0;
    font-size: small;
  }

  #showcase-kontakt .list-a {
    font-size: small;
  }

  #showcase-kontakt .contact-icons {
    padding: 0.3rem;
  }

  #showcase-kontakt .contact-icons i {
    padding: 1rem;
  }

  /* Impressum */
  #showcase-im .heading-1 {
    font-size: medium;
  }

  /* Footer */
  #main-footer {
    height: 3rem;
  }
  #main-footer .footer-content {
    height: 3rem;
  }

  #main-footer .footer-links a {
    font-size: x-small;
  }
  #main-footer .footer-content p {
    font-size: x-small;
  }
}