    /* main css */

    @font-face {
      font-family: "Seven";
      src: url("type/Seven.otf") format("opentype");
    }

    @font-face {
      font-family: "SevenItalic";
      src: url("type/SevenItalic.otf") format("opentype");
    }

body {
      /* margin: 15px; */
      /* padding-top: 8px; */
      font-size: 20px;
      line-height: 23px;
      overflow: hidden;
      font-family: 'Seven';
      font-style: normal;
      letter-spacing: 0.015em;
      color: rgb(128, 114, 78);
      /* background: #f7f7f7; */
      background-color: whitesmoke;
      -moz-osx-font-smoothing: grayscale;
      text-rendering: optimizeLegibility !important;
      /* overflow: hidden; */
      /* filter: brightness(115%) grayscale(100%) contrast(5000%); */
    }

    .logo {
      z-index: 100;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 20vw;
    }

  i {
    font-family: 'SevenItalic';
    font-style: normal;
  }

a, a:active, a:visited {
      color: red;
      text-decoration: none;
    }

a:hover {
      color: blue;
      text-decoration: none;
      cursor: alias;
      /* color: rgb(132, 0, 255);
      font-style: normal;
      filter: brightness(115%) grayscale(100%) contrast(5000%); */
    }

ul {
      padding-left: 1em;
}

.flex-1 {
  display: flex;
  flex: 1 auto;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* .flex-1 img {
  width: 70vw;
  height: 100%;
} */

.flex-2 {
  display: flex;
  flex: 2 auto;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: left;
  text-align: left;
}

.flex-3 {
  display: flex;
  flex: 3 auto;
  flex-direction: row;
  justify-content: space-between;
  align-items: left;
  text-align: center;
}

    .intro {
      margin: 0 auto;
      max-width: 70vw;
    }

    .text {
      /* width: 100vw; */
      /* padding-top: 10px; */
      margin: 0 auto;
      text-align: center;
      margin-top: 20px;
      margin-bottom: 16vw;
    }

    .text-2 {
      /* width: 100vw; */
      /* padding-top: 10px; */
      margin: 0 auto;
      text-align: center;
      margin-top: 20px;
      margin-bottom: 1vw;
    }

    /* .img {
      display: inline-block;
      vertical-align: middle;
    } */

    .website {
      background: white;
      filter: drop-shadow(0px 0px 8px grey);
    }
    /*
    ************************************************************************
    für mobile
    */
    @media screen and (max-width: 1000px) {
      /* body {

      } */

      .text {
        width: 100% !important;
      }

      .img {
        width: 100% !important;
      }

      /* .website {
        width: 100% !important;
        height: 60vw !important;
        background: white;
        filter: drop-shadow(0px 0px 8px grey);
    } */
  }