html {
  height: 100%;
}
body {
  height: 100%;
  position: relative;
  margin: 0;
  font-family: var(--bs-body-font-family);
  font-size: var(--bs-body-font-size);
  font-weight: var(--bs-body-font-weight);
  line-height: var(--bs-body-line-height);
  color: var(--bs-body-color);
  text-align: var(--bs-body-text-align);
  background-color: var(--bs-body-bg);
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body:before {
  content: "";
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

hr {
  margin: 1rem 0;
  color: inherit;
  border: 0;
  border-top: 1px solid;
  opacity: 0.25;
}
.btn-bg{
  background-color: #45627A;
  color: #fff;
}
.link-color{
  color: #45627A;
}
.link-color-lighter{
  color: #D0D7E2;
}
/*#region Main View (Mobile) */
  /*#region Nav*/
    #mainNav {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
      background-color: #203240;
      font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
      letter-spacing: 0.0625em;
    }
    #mainNav .navbar-toggler {
      padding: 0.75rem;
      font-size: 0.95rem;
      text-transform: uppercase;
      font-weight: 700;
    }
    /* #mainNav .navbar-brand {
      margin-left: 1rem; 
    } */
    #mainNav .navbar-brand img {
      width: 50%;

    }
    #mainNav .navbar-nav .nav-item .nav-link {
      font-size: 0.95rem;
      color: #fff;
    }
    #mainNav .navbar-nav .nav-item .nav-link.active, #mainNav .navbar-nav .nav-item .nav-link:hover {
      color: #F99E21;
    }
  /*#endregion*/

  /*#region Masthead*/
  .masthead {
    position: relative;
    overflow: hidden;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .masthead:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: #203240;
  }
  .masthead .masthead-content {
    position: relative;
    max-width: 40rem;
    padding-top: 7rem;
    padding-bottom: 5rem;
  }
  .masthead .masthead-content h1, .masthead .masthead-content .h1 {
    font-size: 2.5rem;
  }
  .masthead .masthead-content p {
    font-size: 1.2rem;
  }
  .masthead .masthead-content p strong {
    font-weight: 700;
  }
  .masthead .masthead-content .input-group-newsletter input {
    height: auto;
    width: 100%;
    font-size: 1rem;
    padding: 1rem;
  }
  .masthead .masthead-content .input-group-newsletter button {
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: calc(1rem + 2px);
  }
  .social-icons {
    position: relative;
    z-index: 2;
  }
  .social-icons .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    height: 4rem;
    width: 4rem;
    border-radius: 100rem;
    background-color: #203240;
    color: #F1EFEE;
  }
  /* .masthead-bg-image {
    position: relative;
    height: 100%;
    width: 100vw;
    min-height: 0;
    padding-bottom: 0;
    background-image: url('/assets/img/background.jpg'); 
    background-size: contain; 
    background-position: center; 
    background-repeat: no-repeat; 
    z-index: -1; 
  } */
/*#endregion */

  #unternehmen, #preise, #kontakt {
      position: relative !important; 
  }
  .footer {
    text-align: center;
    font-size: 0.9rem;
    font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  }
  .block-color{
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    background-color: #203240;
    /* height: 6.625rem; */
  }
  #unternehmen, #preise, #kontakt {
    scroll-margin-top: 6.625rem;
}
/*#endregion */

/*#region media 992 */
  @media (min-width: 992px) {
  /*#region Nav */
    #mainNav {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
      border: none;
      background-color: transparent;
      transition: padding-top 0.3s ease-in-out, padding-bottom 0.3s ease-in-out;
    }
    #mainNav .navbar-brand img {
      /* height: 1.5rem; */
      width: 30%;
      transition: height 0.3s ease-in-out;
    }
    #mainNav.navbar-shrink {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }
    #mainNav.navbar-shrink .navbar-brand {
      font-size: 0.75em;
    }
    #mainNav.navbar-shrink .navbar-brand svg,
    #mainNav.navbar-shrink .navbar-brand img {
      height: 0.5rem;
    }
    #mainNav .navbar-nav .nav-item {
      margin-right: 0.5rem;
    }
    #mainNav .navbar-nav .nav-item:last-child {
      margin-right: 0;
    }
  /*#endregion */
  /*#region Masthead */
    .masthead {
      height: 100%;
      width: 55vw;
      min-height: 0;
      padding-bottom: 0;
    }
    .masthead:before {
      transform: skewX(-9deg);
      transform-origin: top right;
    }
    .masthead .masthead-content {
      padding-top: 0;
      padding-bottom: 0;
      padding-left: 2rem;
      padding-right: 9rem;
    }
    .masthead .masthead-content h1, .masthead .masthead-content .h1 {
      font-size: 3.5rem;
    }
    .masthead .masthead-content p {
      font-size: 1.3rem;
    }
    .social-icons {
      position: absolute;
      height: 100%;
      top: 0;
      right: 2.5rem;
      width: auto;
    }
    .masthead-bg-image {
    position: relative;
    height: 100%;
    width: 100vw;
    min-height: 0;
    padding-bottom: 0;
    background-image: url('/assets/img/background.jpg'); 
    background-size: cover; 
    background-position: center; 
    background-repeat: no-repeat; 
    /* z-index: -1;  */
  }
  /*#endregion */
  }
/*#endregion */