@charset "UTF-8";
/**
 *
 * llal.ch: Stylesheet public web
 *
 * @author     Manuel Märklin
 * @copyright  2021 Manuel Märklin Programmierung, Switzerland
 * @link       https://www.2mp.ch
 */
@font-face {
  font-family: "Founders Grotesk Regular";
  src: url("../Fonts/FoundersGrotesk/founders-grotesk-web-regular.eot") format("eot"), url("../Fonts/FoundersGrotesk/founders-grotesk-web-regular.woff") format("woff"), url("../Fonts/FoundersGrotesk/founders-grotesk-web-regular.woff2") format("woff2"); }
@font-face {
  font-family: "Founders Grotesk Regular Italic";
  src: url("../Fonts/FoundersGrotesk/founders-grotesk-web-regular-italic.eot") format("eot"), url("../Fonts/FoundersGrotesk/founders-grotesk-web-regular-italic.woff") format("woff"), url("../Fonts/FoundersGrotesk/founders-grotesk-web-regular-italic.woff2") format("woff2"); }
@media all {
  	/**
        * Basic elements
        */
  * {
    box-sizing: border-box;
    margin: 0;
    padding: 0; }

  html {
    height: 100% !important;
    margin: 0;
    padding: 0;
    font-size: 10pt;
    font-family: "Founders Grotesk Regular", Arial, sans-serif; }

  body {
    margin: 0;
    padding: 0;
    height: 100%; }

  a {
    color: black;
    text-decoration: none; }

  h1, h2, h3 {
    padding: 0;
    margin: 0; }

  h1 {
    font-size: 55px;
    line-height: 56px;
    font-weight: 400;
    font-style: normal; }

  h2 {
    font-size: 44px;
    line-height: 48px;
    font-weight: 400;
    font-style: normal; }

  h3 {
    font-size: 35px;
    line-height: 40px;
    font-weight: 400;
    font-style: normal; }

  h5 {
    font-size: 22.5px;
    line-height: 28px;
    font-weight: 400;
    font-style: normal; }

  img {
    height: auto;
    max-width: 100%; }

  ol, ul {
    margin: 0;
    padding: 0;
    list-style-type: none; }

  p {
    margin: 0; }

  table {
    width: 100%;
    border-collapse: collapse; }

  td,
  th {
    vertical-align: top;
    padding-right: 0.5em; }

  .bg0600 {
    background-image: linear-gradient(359.93deg, #E5964D 0.06%, #F1F1F1 53.16%); }

  .bg0700 {
    background-image: linear-gradient(359.93deg, #DA9B7C 0.06%, #F1F1F1 60.06%); }

  .bg0800 {
    background-image: linear-gradient(359.93deg, #D1A59E 0.06%, #F1F1F1 60.06%); }

  .bg0900 {
    background-image: linear-gradient(359.93deg, #D1AEB3 0.06%, #F1F1F1 60.06%); }

  .bg1000 {
    background-image: linear-gradient(359.93deg, #B7B9D2 0.06%, #F1F1F1 60.06%); }

  .bg1100 {
    background-image: linear-gradient(359.93deg, #BCCADC 0.06%, #F1F1F1 60.06%); }

  .bg1200 {
    background-image: linear-gradient(359.93deg, #CFCFE3 0.06%, #F1F1F1 60.06%); }

  .bg1300 {
    background-image: linear-gradient(359.93deg, #DDCFE3 0.06%, #F1F1F1 60.06%); }

  .bg1400 {
    background-image: linear-gradient(359.93deg, #CEC1DE 0.06%, #F1F1F1 60.06%); }

  .bg1500 {
    background-image: linear-gradient(359.93deg, #E1BAB6 0.06%, #F1F1F1 60.06%); }

  .bg1600 {
    background-image: linear-gradient(359.93deg, #E3BBB7 0.06%, #F1F1F1 60.06%); }

  .bg1700 {
    background-image: linear-gradient(359.93deg, #F7BA9E 0.06%, #F1F1F1 60.06%); }

  .bg1800 {
    background-image: linear-gradient(359.93deg, #FFB365 0.06%, #F1F1F1 60.06%); }

  .content,
  .detail,
  footer,
  header,
  .kontakt,
  .projekte {
    margin: 0 auto; }

  .container,
  .content,
  .kontakt,
  .page,
  .projekte,
  section,
  .team {
    width: 1312px; }

  header {
    position: fixed;
    width: 100vw;
    background: #FFFFFF;
    padding: 20px 32px;
    font-size: 28px;
    line-height: 32px;
    height: 96px;
    display: flex;
    justify-content: space-between;
    z-index: 100; }
    header .close {
      display: flex;
      background-color: #FF5909;
      background-image: url("../images/close.png");
      background-repeat: no-repeat;
      background-position: center center;
      width: 56px;
      height: 56px;
      border-radius: 30px; }
    header .subtitle {
      display: flex;
      align-items: center;
      color: #656565;
      font-size: 28px;
      line-height: 32px; }

  main {
    background-color: #F1F1F1;
    color: white;
    padding-top: 96px;
    /* Portrait */
    /* Projekte */ }
    main #quelle {
      position: fixed;
      display: flex;
      align-items: center;
      top: 10vh;
      right: 15vw;
      aspect-ratio: 1/1;
      border-radius: 50%;
      color: black;
      background-color: #fff;
      padding: .5em;
      font-size: 35px;
      line-height: 1;
      transform: rotate(-9deg); }
    main .nav,
    main a {
      font-size: 35px;
      line-height: 40px;
      color: white; }
    main h2 a {
      color: black; }
    main .kontakt {
      padding-left: 80px;
      background-image: url("../images/arrow_orange.png");
      background-repeat: no-repeat;
      justify-content: center;
      width: 800px; }
      main .kontakt p {
        color: black;
        font-size: 35px;
        line-height: 40px; }
        main .kontakt p a[href^="tel:"] {
          padding-left: 180px; }
        main .kontakt p a[href^="mailto:"] {
          padding-left: 180px;
          text-decoration: underline; }
    main .page {
      padding: 79px 82px 79px 44px;
      font-size: 29px;
      line-height: 32px;
      color: black;
      margin: 0 auto; }
      main .page h1 {
        display: none; }
      main .page h2 {
        font-size: 22.5px;
        line-height: 28px; }
      main .page a {
        color: black;
        text-decoration: underline;
        font-size: 26px;
        line-height: 32px; }
    main .video {
      width: 100%;
      height: 100%;
      min-width: 100%;
      min-height: 100%;
      overflow: hidden; }
      main .video button,
      main .video .w-bottom-bar {
        display: none !important; }
      main .video img {
        min-width: 100%;
        min-height: 100%;
        overflow: hidden; }
    main .portraittotal {
      background-color: #381C4A;
      padding-top: 25px; }
      main .portraittotal section {
        padding: 25px 0;
        border-top: #ffffff solid 2px;
        margin: 0 auto; }
        main .portraittotal section:first-of-type {
          border-top: none;
          padding-top: 0; }
      main .portraittotal .expertise h2,
      main .portraittotal .team h2,
      main .portraittotal .kontakte h2 {
        font-size: 35px;
        line-height: 40px;
        padding-bottom: 56px; }
      main .portraittotal .portrait p,
      main .portraittotal .expertise p {
        font-size: 44px;
        line-height: 48px; }
      main .portraittotal .team a,
      main .portraittotal .team p,
      main .portraittotal .kontakte a,
      main .portraittotal .kontakte p {
        font-size: 29px;
        line-height: 33px; }
      main .portraittotal .info p,
      main .portraittotal .kontakt p {
        font-size: 35px;
        line-height: 40px; }
      main .portraittotal .portrait h2 {
        font-size: 86px;
        line-height: 88px;
        padding-bottom: 86px; }
      main .portraittotal .portrait .info {
        padding-left: 50%; }
      main .portraittotal .kontakt {
        background-image: url("../images/arrow_orange.png");
        margin: 168px auto; }
        main .portraittotal .kontakt p {
          color: white; }
      main .portraittotal .expertise {
        position: relative; }
        main .portraittotal .expertise h2 {
          position: absolute;
          flex-basis: 50%; }
        main .portraittotal .expertise p {
          padding-left: 50%; }
      main .portraittotal .team {
        display: flex; }
        main .portraittotal .team h2,
        main .portraittotal .team .ma {
          flex-basis: 50%; }
        main .portraittotal .team .ma {
          display: grid;
          grid-template-columns: repeat(2, 1fr);
          column-gap: 32px;
          row-gap: 90px; }
          main .portraittotal .team .ma .mitarbeiter img {
            padding-bottom: 29px; }
          main .portraittotal .team .ma .mitarbeiter a[href^="tel:"],
          main .portraittotal .team .ma .mitarbeiter a[href^="mailto:"] {
            display: block;
            max-width: 300px; }
          main .portraittotal .team .ma .mitarbeiter a[href^="mailto:"] {
            margin-top: 10px;
            line-height: 44px;
            font-size: 44px;
            color: transparent;
            background-image: url("../images/mail.png");
            background-repeat: no-repeat;
            background-position: left center; }
        main .portraittotal .team .wrap {
          display: flex;
          flex-basis: 50%; }
      main .portraittotal .kontakte {
        display: flex;
        flex-wrap: wrap;
        padding-bottom: 104px;
        padding-right: 0; }
        main .portraittotal .kontakte h2 {
          flex: 1 100%; }
        main .portraittotal .kontakte a {
          text-decoration: underline; }
        main .portraittotal .kontakte div {
          font-size: 29px;
          line-height: 33px;
          flex: 1 50%;
          padding-bottom: 48px; }
    main .projekte {
      padding: 72px 0 168px 0; }
      main .projekte h1 {
        font-size: 35px;
        line-height: 40px;
        color: black; }
      main .projekte h2 {
        color: black;
        font-size: 35px;
        line-height: 40px; }
      main .projekte .tags {
        display: flex;
        flex-wrap: wrap;
        padding: 20px 0; }
        main .projekte .tags .tag {
          color: #656565;
          font-size: 16px;
          line-height: 24px;
          border-radius: 24px;
          background-color: #FFFFFF;
          margin: 4px 8px 4px 0;
          padding: 4px 20px;
          cursor: pointer; }
          main .projekte .tags .tag.active {
            color: white;
            background-color: #FF5909;
            background-image: url("../images/circle_error.png");
            background-position: right 8px top 6px;
            background-repeat: no-repeat;
            padding-right: 40px; }
      main .projekte .overview {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        column-gap: 30px;
        row-gap: 124px;
        padding: 120px 0; }
        main .projekte .overview .projekt.hidden {
          display: none; }
        main .projekte .overview .projekt h2 {
          font-size: 29px;
          line-height: 33px; }
        main .projekte .overview .projekt .tags .tag {
          cursor: default; }
          main .projekte .overview .projekt .tags .tag.active {
            background-image: none;
            padding-right: 20px; }
        main .projekte .overview .projekt .image {
          position: relative; }
          main .projekte .overview .projekt .image .video {
            height: 401px; }
          main .projekte .overview .projekt .image .view {
            position: absolute;
            display: none;
            padding: 10px 0 18px 0;
            font-size: 29px;
            text-align: center;
            bottom: 0;
            width: 100%;
            background-color: #FF5909; }
          main .projekte .overview .projekt .image a {
            display: block;
            position: absolute;
            top: 0;
            height: 100%;
            width: 100%; }
      main .projekte .kontakt p a[href^="tel:"],
      main .projekte .kontakt p a[href^="mailto:"] {
        color: black; }
      main .projekte .single .image {
        position: relative;
        margin-top: 32px; }
        main .projekte .single .image .video {
          height: 865px; }
        main .projekte .single .image .overlay {
          display: block;
          position: absolute;
          top: 0;
          height: 100%;
          width: 100%; }
      main .projekte .single .details {
        display: grid;
        grid-template-columns: repeat(7, 1fr);
        grid-template-rows: auto auto auto auto auto;
        padding-top: 92px;
        color: black;
        font-size: 35px;
        line-height: 40px; }
        main .projekte .single .details a {
          color: black;
          text-decoration: underline;
          font-size: 35px;
          line-height: 40px; }
        main .projekte .single .details img {
          width: 608px; }
        main .projekte .single .details .block_1,
        main .projekte .single .details .block_2,
        main .projekte .single .details .block_3,
        main .projekte .single .details .block_4,
        main .projekte .single .details .block_5,
        main .projekte .single .details .block_6,
        main .projekte .single .details .block_7 {
          padding-bottom: 35px; }
          main .projekte .single .details .block_1 img,
          main .projekte .single .details .block_2 img,
          main .projekte .single .details .block_3 img,
          main .projekte .single .details .block_4 img,
          main .projekte .single .details .block_5 img,
          main .projekte .single .details .block_6 img,
          main .projekte .single .details .block_7 img {
            width: auto; }
          main .projekte .single .details .block_1 .left,
          main .projekte .single .details .block_2 .left,
          main .projekte .single .details .block_3 .left,
          main .projekte .single .details .block_4 .left,
          main .projekte .single .details .block_5 .left,
          main .projekte .single .details .block_6 .left,
          main .projekte .single .details .block_7 .left {
            padding-right: 184px; }
          main .projekte .single .details .block_1 .right,
          main .projekte .single .details .block_2 .right,
          main .projekte .single .details .block_3 .right,
          main .projekte .single .details .block_4 .right,
          main .projekte .single .details .block_5 .right,
          main .projekte .single .details .block_6 .right,
          main .projekte .single .details .block_7 .right {
            padding-left: 184px; }
          main .projekte .single .details .block_1 .center,
          main .projekte .single .details .block_2 .center,
          main .projekte .single .details .block_3 .center,
          main .projekte .single .details .block_4 .center,
          main .projekte .single .details .block_5 .center,
          main .projekte .single .details .block_6 .center,
          main .projekte .single .details .block_7 .center {
            padding: 46px 92px; }
          main .projekte .single .details .block_1 .bottom,
          main .projekte .single .details .block_2 .bottom,
          main .projekte .single .details .block_3 .bottom,
          main .projekte .single .details .block_4 .bottom,
          main .projekte .single .details .block_5 .bottom,
          main .projekte .single .details .block_6 .bottom,
          main .projekte .single .details .block_7 .bottom {
            padding-top: 92px; }
        main .projekte .single .details .block_1,
        main .projekte .single .details .block_3,
        main .projekte .single .details .block_4 {
          padding-right: 35px; }
        main .projekte .single .details .block_1 {
          grid-column-start: 1;
          grid-column-end: 5;
          grid-row-start: 1;
          grid-row-end: 1; }
        main .projekte .single .details .block_2 {
          color: black;
          font-size: 22.5px;
          line-height: 28px;
          grid-column-start: 5;
          grid-column-end: 8;
          grid-row-start: 1;
          grid-row-end: 3; }
          main .projekte .single .details .block_2 h2 {
            color: black;
            font-size: 18px;
            line-height: 28px; }
          main .projekte .single .details .block_2 a {
            font-size: 22.5px;
            line-height: 28px; }
        main .projekte .single .details .block_3 {
          grid-column-start: 1;
          grid-column-end: 5;
          grid-row-start: 2;
          grid-row-end: 2; }
        main .projekte .single .details .block_4 {
          grid-column-start: 1;
          grid-column-end: 4;
          grid-row-start: 3;
          grid-row-end: 5; }
        main .projekte .single .details .block_5 {
          grid-column-start: 4;
          grid-column-end: 8;
          grid-row-start: 3;
          grid-row-end: 3; }
        main .projekte .single .details .block_6 {
          grid-column-start: 4;
          grid-column-end: 8;
          grid-row-start: 4;
          grid-row-end: 5; }
        main .projekte .single .details .block_7 {
          grid-column-start: 1;
          grid-column-end: 8;
          grid-row-start: 6;
          grid-row-end: 6; }
        main .projekte .single .details section {
          border: none;
          padding: 0;
          width: auto;
          margin: 0; }
        main .projekte .single .details.more {
          padding-top: 0; }
          main .projekte .single .details.more .block_2 {
            font-size: 35px;
            line-height: 40px; }
            main .projekte .single .details.more .block_2 a {
              font-size: 35px;
              line-height: 40px; }
      main .projekte .single .kontakt {
        margin-top: 92px; }
        main .projekte .single .kontakt p a[href^="tel:"],
        main .projekte .single .kontakt p a[href^="mailto:"] {
          color: black; }

  footer {
    color: black;
    margin: 0 auto; }
    footer a {
      text-decoration: none; }
    footer ul {
      display: flex;
      justify-content: flex-end; }
      footer ul li {
        padding-right: 32px;
        font-size: 18px;
        line-height: 96px; }

  /* Home */
  .home header {
    display: none; }
  .home main,
  .home footer {
    width: 100vw; }
  .home footer {
    position: absolute;
    bottom: 0;
    background-color: #FFFFFF; }
  .home main {
    height: 100vh;
    max-height: 100vh;
    padding-top: 0; }
    .home main .overlay {
      position: absolute;
      top: 0;
      width: 100%;
      height: 100%; }
      .home main .overlay .logo,
      .home main .overlay .headline,
      .home main .overlay .nav {
        position: absolute;
        color: #ffffff; }
      .home main .overlay .logo {
        top: 40px;
        left: 32px; }
        .home main .overlay .logo img {
          height: 53px; }
      .home main .overlay .headline {
        top: 45px;
        left: 320px;
        width: 800px;
        font-size: 55px;
        line-height: 56px; }
      .home main .overlay .nav {
        bottom: 144px;
        left: 0;
        font-size: 35px;
        line-height: 40px; }
        .home main .overlay .nav ul {
          display: flex;
          width: 100vw;
          height: 56px;
          justify-content: center; }
          .home main .overlay .nav ul li {
            background-image: url("../images/arrow_orange.png");
            background-repeat: no-repeat;
            padding-top: 6px;
            padding-left: 55px;
            margin-right: 48px;
            text-indent: 16px; }
            .home main .overlay .nav ul li a {
              color: #ffffff; } }
@media screen and (max-width: 1390px) {
  .container,
  .content,
  footer,
  main,
  .page,
  .projekte,
  section,
  .team {
    width: auto; }

  main .portraittotal {
    padding-left: 32px;
    padding-right: 32px; }
    main .portraittotal .team .ma .mitarbeiter a[href^="tel:"],
    main .portraittotal .team .ma .mitarbeiter a[href^="mailto:"] {
      max-width: 200px; }
  main .projekte,
  main .content {
    padding: 72px 32px 25px 32px; }
  main .projekte .overview {
    grid-template-columns: repeat(1, 1fr);
    width: 642px;
    left: 50%;
    position: relative;
    margin-left: -321px; }
  main .projekte .single .image .video {
    height: 60vw; } }
@media screen and (max-width: 1056px) {
  main #quelle {
    top: 35vh; }
  main .portraittotal .expertise h2,
  main .portraittotal .team h2,
  main .portraittotal .kontakte h2 {
    font-size: 32px;
    line-height: 36px; }
  main .portraittotal .portrait p,
  main .portraittotal .expertise p {
    font-size: 39px;
    line-height: 40px; }
  main .portraittotal .team a,
  main .portraittotal .team p,
  main .portraittotal .kontakte a,
  main .portraittotal .kontakte p {
    font-size: 26px;
    line-height: 32px; }
  main .portraittotal .team {
    display: block; }
    main .portraittotal .team h2 {
      position: unset; }
    main .portraittotal .team p {
      padding: 0; }
    main .portraittotal .team .ma .mitarbeiter a[href^="tel:"],
    main .portraittotal .team .ma .mitarbeiter a[href^="mailto:"] {
      max-width: 300px; }
  main .portraittotal .info p,
  main .portraittotal .kontakt p {
    font-size: 32px;
    line-height: 36px; }
  main .portraittotal .portrait h2 {
    font-size: 72px;
    line-height: 72px;
    padding-bottom: 72px; }
  main .portraittotal .kontakt {
    width: 647px; }
  main .projekte {
    padding: 72px 32px 25px 32px; }
    main .projekte .overview {
      padding: 56px 0;
      row-gap: 56px; }
    main .projekte .single .details {
      padding-top: 72px;
      font-size: 32px;
      line-height: 36px; }
    main .projekte.more .block_2 {
      font-size: 32px;
      line-height: 36px; }
      main .projekte.more .block_2 a {
        font-size: 32px;
        line-height: 36px; }
    main .projekte .kontakt {
      margin-top: 72px; }

  .home main .overlay .headline {
    width: auto; }
  .home main .overlay .nav {
    bottom: 160px;
    font-size: 29px;
    line-height: 40px;
    left: 32px; }
    .home main .overlay .nav ul {
      display: block;
      width: auto;
      height: auto; }
      .home main .overlay .nav ul li {
        padding-bottom: 40px; } }
@media screen and (max-width: 720px) {
  main .content {
    display: block;
    font-size: 29px;
    line-height: 32px; }
  main .kontakt {
    width: auto;
    margin: 0 32px; }
    main .kontakt a, main .kontakt p {
      font-size: 22.5px;
      line-height: 28px; }
    main .kontakt p a[href^="tel:"],
    main .kontakt p a[href^="mailto:"] {
      padding-left: 0; }
  main .portraittotal section {
    padding: 24px 0; }
  main .portraittotal .expertise h2,
  main .portraittotal .team h2,
  main .portraittotal .kontakte h2 {
    font-size: 26px;
    line-height: 32px; }
  main .portraittotal .portrait p,
  main .portraittotal .expertise p {
    font-size: 29px;
    line-height: 32px; }
  main .portraittotal .team a,
  main .portraittotal .team p,
  main .portraittotal .kontakte a,
  main .portraittotal .kontakte p {
    font-size: 22.5px;
    line-height: 28px; }
  main .portraittotal .info p,
  main .portraittotal .kontakt p {
    font-size: 26px;
    line-height: 34px; }
  main .portraittotal .portrait h2 {
    font-size: 41px;
    line-height: 40px;
    padding-bottom: 41px; }
  main .portraittotal .portrait .info {
    padding: 0; }
  main .portraittotal .kontakt {
    width: auto;
    margin: 80px 32px; }
  main .portraittotal .expertise {
    display: block; }
    main .portraittotal .expertise h2 {
      position: unset; }
    main .portraittotal .expertise p {
      padding: 0; }
  main .portraittotal .team .ma {
    row-gap: 56px; }
    main .portraittotal .team .ma .mitarbeiter img {
      padding-bottom: 24px; }
    main .portraittotal .team .ma .mitarbeiter a[href^="tel:"],
    main .portraittotal .team .ma .mitarbeiter a[href^="mailto:"] {
      float: left;
      margin-top: 10px;
      margin-right: 10px;
      line-height: 44px;
      font-size: 44px;
      color: transparent;
      overflow: hidden;
      max-width: 44px;
      max-height: 44px; }
    main .portraittotal .team .ma .mitarbeiter a[href^="tel:"] {
      background-image: url("../images/phone.png");
      background-repeat: no-repeat;
      background-position: left center; }
  main .projekte {
    padding-top: 25px; }
    main .projekte .overview {
      width: auto;
      margin: auto;
      left: auto; }
      main .projekte .overview .projekt .image .video {
        height: 60vw; }
    main .projekte .single .details {
      display: block;
      padding-top: 17px;
      font-size: 29px;
      line-height: 32px; }
      main .projekte .single .details .block_1 .left,
      main .projekte .single .details .block_2 .left,
      main .projekte .single .details .block_3 .left,
      main .projekte .single .details .block_4 .left,
      main .projekte .single .details .block_5 .left,
      main .projekte .single .details .block_6 .left,
      main .projekte .single .details .block_7 .left {
        padding-right: 92px; }
      main .projekte .single .details .block_1 .right,
      main .projekte .single .details .block_2 .right,
      main .projekte .single .details .block_3 .right,
      main .projekte .single .details .block_4 .right,
      main .projekte .single .details .block_5 .right,
      main .projekte .single .details .block_6 .right,
      main .projekte .single .details .block_7 .right {
        padding-left: 92px; }
      main .projekte .single .details .block_1 .center,
      main .projekte .single .details .block_2 .center,
      main .projekte .single .details .block_3 .center,
      main .projekte .single .details .block_4 .center,
      main .projekte .single .details .block_5 .center,
      main .projekte .single .details .block_6 .center,
      main .projekte .single .details .block_7 .center {
        padding: 23px 46px; }
      main .projekte .single .details .block_1 .bottom,
      main .projekte .single .details .block_2 .bottom,
      main .projekte .single .details .block_3 .bottom,
      main .projekte .single .details .block_4 .bottom,
      main .projekte .single .details .block_5 .bottom,
      main .projekte .single .details .block_6 .bottom,
      main .projekte .single .details .block_7 .bottom {
        padding-top: 46px; }
      main .projekte .single .details .block_1,
      main .projekte .single .details .block_3,
      main .projekte .single .details .block_4 {
        padding-right: 0; }
      main .projekte .single .details.more {
        padding-top: 0; }
        main .projekte .single .details.more .block_2 {
          font-size: 29px;
          line-height: 32px; }
          main .projekte .single .details.more .block_2 a {
            font-size: 29px;
            line-height: 32px; }
      main .projekte .single .details .kontakt {
        margin-top: 41px; }

  .home main .overlay .headline {
    top: 145px;
    left: 32px; }
    .home main .overlay .headline p {
      font-size: 41px;
      line-height: 40px; }
  .home main .overlay .nav {
    font-size: 26px;
    line-height: 32px; }
    .home main .overlay .nav ul li {
      text-indent: unset;
      margin: 0;
      background-size: 34px;
      padding: 0 0 20px 55px; }
      .home main .overlay .nav ul li a {
        font-size: 26px;
        line-height: 6px;
        /* ??? */ } }
@media screen and (max-width: 420px) {
  header {
    padding: 18px;
    height: 80px; }
    header .close {
      width: 44px;
      height: 44px; }

  main {
    padding-top: 80px; }
    main #quelle {
      top: 50vh;
      padding: .3em;
      font-size: 28px; }
    main .projekte,
    main .content {
      padding: 25px 18px 25px 18px; }
    main .content {
      display: block; }
    main .kontakt {
      margin: 0 18px;
      width: auto;
      background-size: 44px; }
    main .portraittotal .expertise h2,
    main .portraittotal .team h2,
    main .portraittotal .kontakte h2 {
      font-size: 26px;
      line-height: 32px; }
    main .portraittotal .portrait a,
    main .portraittotal .portrait p,
    main .portraittotal .expertise a,
    main .portraittotal .expertise p,
    main .portraittotal .team a,
    main .portraittotal .team p,
    main .portraittotal .kontakte a,
    main .portraittotal .kontakte p {
      font-size: 29px;
      line-height: 32px; }
    main .portraittotal .info p {
      font-size: 26px;
      line-height: 32px; }
    main .portraittotal .kontakt p {
      font-size: 22.5px;
      line-height: 28px; }
    main .portraittotal .portrait p {
      width: auto; }
    main .portraittotal .portrait .info {
      padding-left: 0; }
    main .portraittotal .kontakt {
      width: auto;
      margin: 80px 0 56px 0;
      background-size: 44px;
      padding: 0 60px; }
    main .portraittotal .team .ma {
      grid-template-columns: repeat(1, 1fr);
      column-gap: 0; }
    main .portraittotal .kontakte {
      display: block; }
      main .portraittotal .kontakte h2 {
        position: unset; }
    main .projekte h1 {
      display: none; }
    main .projekte .tags {
      padding-top: 0; }
    main .projekte .kontakt {
      margin: 0; }
    main .projekte .single .kontakt {
      margin-top: 41px; }

  .home main .overlay .logo {
    top: 24px;
    left: 18px; }
  .home main .overlay .headline {
    font-size: 29px;
    line-height: 32px;
    top: 109px;
    left: 18px; }
  .home main .overlay .nav {
    bottom: 32px;
    font-size: 26px;
    line-height: 32px;
    left: 18px; }
    .home main .overlay .nav ul li {
      text-indent: unset;
      margin: 0;
      background-size: 34px;
      padding-left: 55px;
      padding-top: 0; }
      .home main .overlay .nav ul li a {
        font-size: 26px;
        line-height: 6px;
        /* ??? */ }
  .home footer {
    display: none; } }