
/* APP.CSS */

    html {height: 100%; min-height: 100%;}
    body {width: 100%; height: 100%; font-family: 'Hind Siliguri', sans-serif;}
    body {background:#eef3f2; color:#574f4d; overflow-y: scroll;}

/* HEADLINES */

    h1, h2, h3 {font-weight: 600;}
    h1 {font-size: 1.5rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem;}
    h2 {font-size: 1.25rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem;}
    h3 {font-size: 1.1875rem; line-height: 1.4; margin-top: 0; margin-bottom: 0.5rem;}

/* PARAGRAPHS ETC. */

    p {font-size: 1rem; line-height: 1.4; margin:0; padding:0;}
    b, strong {font-weight: 500;}

/* ANIMATIONS */

    a {-webkit-transition: all 100ms ease-in-out;-moz-transition: all 100ms ease-in-out;-o-transition: all 100ms ease-in-out;transition: all 100ms ease-in-out;}
    a:focus {outline: none;}
    *:focus {outline: none;}

/* ARCHITECTURE */

    header.nrml {max-width: 95rem; width: 100%; margin: 0 auto; padding: 5rem 0 0 0; background: white;}
    header.nrml h1.logo {font-weight: 700; text-align: right; padding:0; margin:0; line-height: 1;}
    header.nrml h1.logo a {color:#574f4d; font-weight: 700; font-size: 1.5rem;}
    header.nrml h1.logo span {color: #888; font-size: 1rem;}
    header.nrml h1.logo a:hover, header.nrml h1.logo a:focus {color:#2e2e2e;}

    header.nrml .menu.simple li {vertical-align: middle; margin-right: 2.5rem;}
    header.nrml .menu.simple li:last-child {margin-right:0;}
    header.nrml .menu.simple a {color:#574f4d; border-bottom: 2px solid #fff; padding-bottom: 2px;}
    header.nrml .menu.simple a:hover, header.stillepost .menu.simple a:focus {color:#2e2e2e;}
    header.nrml .menu.simple a.current {font-weight: 700; border-bottom: 2px solid #574f4d;}

    section.stillepost {max-width: 95rem; width: 100%; margin:0 auto; padding: 0 0 2.5rem 0; position: relative; background: white; overflow: hidden;}
    /*section.stillepost {background: white url('../assets/stillepost_02.png') bottom right no-repeat; background-size: 30%;}*/

    #sp-logo {
  position: static;
  width: 100%;
  max-width: 400px;
  margin: 2rem auto 0 auto;
  z-index: 1;
  text-align: center;
}

#sp-logo img {
  width: 100%;
  height: auto;
  display: inline-block;
  border-radius: 8px;
}

    section.stillepost .highlight {padding: 5rem 0 5rem 0;}
    section.stillepost .highlight h1 {padding-left: 0.9375rem; font-size: 1.75rem; line-height: 1.2; margin:0; position: relative; z-index: 100;}

    section.stillepost-grid {background: #f7f7f7; padding: 2.5rem 0 3.125rem 0; max-width: 95rem; margin:0 auto;}
    section.stillepost-grid .columns {margin-bottom: 1.875rem;}
    section.stillepost-grid.net {padding-top: 3rem; padding-bottom:1.35rem;}

    section.stillepost-grid .menu.simple {padding-left: 0.9375rem; margin-bottom: 1.5rem;}
    section.stillepost-grid .menu.simple li {vertical-align: middle; margin-right: 2.5rem; float: left;}
    section.stillepost-grid .menu.simple li:last-child {margin-right:0;}
    section.stillepost-grid .menu.simple a {color:#574f4d; font-size: .875rem;}
    section.stillepost-grid .menu.simple a:hover, section.stillepost-grid .menu.simple a:focus {color:#2e2e2e;}
    section.stillepost-grid .menu.simple a.is-checked {font-weight: 700; color:#97afaa;}

    section.stillepost-grid figcaption {text-align: left;}
    section.stillepost-grid figcaption h2 {font-size: 1.75rem; max-width: 70%; line-height: 1.2; margin:0;}
    section.stillepost-grid figcaption p {max-width: 85%; margin-top: 1.5rem;}
    section.stillepost-grid figcaption p:last-child {margin-bottom:0;}
    section.stillepost-grid figcaption .box p:last-child, section.stillepost-grid.net figcaption p:last-child {margin-bottom:0; margin-top:0;}
    section.stillepost-grid figcaption a {font-weight: 600; color: #574f4d; text-decoration: underline;}
    section.stillepost-grid figcaption a:hover, section.stillepost-grid figcaption a:focus {text-decoration: none;}

    footer {max-width: 95rem; width: 100%; margin:0 auto; padding: 1.875rem 0 1.875rem 0; background: white;}
    footer .menu.simple li {vertical-align: middle; margin:0;}
    footer .menu.simple li span {color: #888;}
    footer .menu.simple a {color:#574f4d; font-size: .875rem; font-weight: 500;}
    footer .menu.simple a:hover, header.stillepost .menu.simple a:focus {color:#2e2e2e;}
    footer .menu.simple a.current {font-weight: 700;}
    footer .menu.simple a i {position: relative; top:-1px; padding-right: 5px;}
    footer .menu.simple li {color:#574f4d; font-size: .875rem; font-weight: 500;}

    /* general stuff */
    .box {min-height: 400px; max-height: 400px;}
    .net .box {min-height: auto; max-height: auto; min-height: 196px;}
    .reveal {padding: 3rem;}
    .reveal a {color: #202020; text-decoration: none;}
    .reveal a:hover {text-decoration: underline;}

    /* mobile adjustments*/
    .desktop {display: block;}
    .mobile {display: none;}

     header.nrml .mobile h1.logo {text-align: left; margin-bottom: 1rem;}


@media screen and (max-width: 1444px) {
#sp-logo {width: 330px; z-index: 101;}
}
    @media screen and (max-width: 95rem) {
      section.stillepost, header.nrml, section.stillepost-grid .menu.simple {padding-left: 2.5rem; padding-right: 2.5rem;}
      section.stillepost .highlight h1 {font-size: 1.875vw;}
      section.stillepost .highlight {padding: 5% 0 5% 0;}
    }

    @media screen and (max-width: 1024px) {
      section.stillepost .highlight h1 {font-size: 1.5rem; max-width: 100%;}
      #sp-logo {width: 300px; right: 0rem;}
      /* .grid figure figcaption {
        opacity: 1 !important;
      } */
      section.stillepost-grid figcaption p {max-width: 100%;}
      section.stillepost-grid figcaption h2 {font-size: 1.5rem;}
      section.stillepost, header.nrml, section.stillepost-grid .menu.simple {padding-left: 1.25rem; padding-right: 1.25rem;}
      #sp-logo {width: 240px; right: -2rem; z-index: 0;}
    }

    @media screen and (max-width: 768px) {
      .desktop {display: none;}
      .mobile {display: block;}
      section.stillepost-grid .menu.simple li {display: inline-block; float: left; width: 100%; margin-bottom: 1rem;}
      section.stillepost-grid .menu.simple li:last-child {margin-bottom:0;}
      section.stillepost-grid {padding-top: 1.875rem;}
      section.stillepost-grid figcaption h2 {font-size: 1.5rem; line-height: 1;}
      section.stillepost-grid figcaption p {font-size: .875rem;}
      header.nrml {padding-top: 2.5rem;}
      header.nrml .menu.simple {margin-bottom: 2rem;}
      section.stillepost-grid {padding-bottom: 0rem;}
      section.stillepost-grid figcaption p {max-width: 100%;}
    }
    @media screen and (max-width: 639px) {
      #sp-logo {display: none !important;}
    }

    @media screen and (max-width: 480px) {
      .stillepost-grid figure .box {min-height: 350px;}
      .net .box {min-height: auto; max-height: auto; min-height: 182px !important;}
      section.stillepost, header.nrml, section.stillepost-grid .menu.simple {padding-left: 1.25rem; padding-right: 1.25rem;}
      .stillepost-grid figcaption {padding: 2.5rem 1.25rem;}

    }

  #sp-logo img {
  width: 100%;
  max-width: 400px;
  height: auto;
  display: block;
  margin: 0 auto;
  border-radius: 8px;
}

/* Headline und Fließtext links bündig in stillepost-Sektion */
.stillepost .highlight {
  padding-left: 0 !important;
}

.stillepost .columns {
  padding-left: 0 !important;
  margin-left: 0 !important;
}

.stillepost h1 {
  margin-left: 0 !important;
  padding-left: 0 !important;
  text-align: left;
}

/* Präsentationsbilder formatieren */
.presentation-gallery img {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
}
.presentation-gallery {
  padding: 0 !important;
  margin: 0 auto;
}
section.presentation {
  max-width: 95rem;
  width: 100%;
  margin: 0 auto;
  padding: 2rem 2.5rem; /* Innenabstand links/rechts */
  background: white;
  position: relative;
}

