
/*Einfärben der aktiven Links zu blau */
.navbar-light .navbar-nav .nav-link.active {
  color: #0062ae;
}

/* Der graue Balken für die Navbar wird damit gestylt */
.rectangle {
  height: 70px;
  background-color: #f8f5f2;
  padding-top: 0px;
  margin-top: -30px;
}
#collapsibleNavbar {
  margin-top: -48px;
}

.navbar-brand {
  padding: 0;
}

.multi-level .dropdown-divider {
  margin: 0 20px;
  border-top-color: #f1ebe5;
}


/*Das geforderte Padding der dropdown-Navbar, also nicht der immer sichtbaren Leiste.*/
.dropdown-menu {
  padding: 23px 0; /* Padding oben und unten 23, da die dropdown-items schon 7 oben haben */
  border-radius: 0 0 0 0;
  border: none;
  box-shadow: grey 0px 3px 30px;
}

/*.obermenu:hover > .dropdown-menu { Damit soll der Rand bei den Untermenus weggehen..
    box-shadow: 3px -5px 10px grey, -7px 2px 7px 0px grey, 3px 4px 6px grey;
}
.obermenu:hover > .ausklappbar {
    box-shadow: 3px -5px 10px grey, 6px 1px 14px 0px grey, 3px 4px 6px grey;
  } */

.dropdown-item a {
  color: #333333;
}

.dropdown-item a.active { color: #0062ae; }

.pfeil {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 20px 20px 20px;
  border-color: transparent transparent #ffffff transparent;
  visibility: hidden;
  margin-left: 28%;
  position: relative;
  z-index: 1001;
}
.nav-item:hover > .pfeil {
  visibility: visible;
}
/* Alte Variante mit dem Polygon .pfeil {  width: 20px;  height: 20px;  background-color: white;  clip-path: polygon(50% 0, 0 100%, 100% 100%);  padding-left: 50px;margin-left: 20%;  visibility: hidden;}*/
.dropdown-item {
  padding: 7px 20px;
}

.dropdown-item:hover {
  background-color: #e3d7cb;
  color: #0062ae;
  text-decoration: none;
}

.dropdown-item a:hover {
color: #0062ae;
text-decoration: none;
}

/* Der Abstand zwischen den einzelnen Links wird verkleinert von der Hauptleiste */
.dropdown-menu > li {
  margin-top: 0px;
  margin-bottom: 0px;
}

.dropdown-menu > .dropdown-divider:last-child {
  display: none;
}

/* Alle dropdownMenus, die ein nav-item als Vater haben, sollen beim hovern schon angezeigt werden */
.nav-item:hover > .dropdown-menu {
  display: block;
  margin-top: -5px;
  left: 50%;
  transform: translateX(-50%);
}

/* Alle dropdown-menüs auswählen, die ein submenu als Vater haben
(Im Code wird ein Untermenu zuvor mit einem Submenu bekanntgemacht)
Also alles Untermenus werden ausgewählt. Dann werden sie so verschoben,
dass sie rechts von dem Vatermenü sind */
.dropdown-submenu > .dropdown-menu {
  top: 0;
  left: 100%;
  height: 100%;
  margin-left: -1px;
  margin-top: -1px;
  border-radius: 0 0 0 0;
  background-color: #e3d7cb;
}

/* Block-Boxen nehmen die gesamte Breite des Elternelementes ein */
.dropdown-submenu:hover > .dropdown-menu {
  display: block;
}

/*Die Schriftgrößen für die verschiedenen Menüs */
.navbar-light .navbar-nav .nav-link  {
  font-size: 16px;
  line-height: 22px;
  color: #333333;
  font-family: 'source_sans_probold';
  letter-spacing: 1px;
  text-transform: uppercase;
}

#naviSubmenu{
  font-size: 16px;
  line-height: 22px;
  color: #333333;
  font-family: 'source_sans_proregular';
}

.navbar-light .navbar-nav .nav-link:hover {
  color: #0062ae;
}

#navbarDesktop {
  padding-bottom: 10rem;
}

.orange-header .rectangle {
  height: 70px;
  background-color: #ed6e2c;
}

.orange-header #navbarDesktop {
  background-color: #ed6e2c;
}

.orange-header .navbar-light .navbar-nav .nav-link {
  color: white;
}

.orange-header h3 p {
  margin-bottom: 0;
}

.orange-header .navbar-light .navbar-nav .nav-link.active { color: #0062ae; }

.orange-header #grauerBalken {
  background-color: #ed6e2c !important;
}

.orange-header .navbarMobilgeraet .nav li, #menuSchrift, .navbarMobilgeraet .nav a {
  color: white;
}


body .content-wrapper {
  overflow: hidden; }
body.mobile-menu--open {
  width: 100%;
  height: 100%; }
  body.mobile-menu--open .off-canvas-menu {
    position: fixed;
    width: 100%;
    height: 100%;
    overflow: scroll; }

    .off-canvas-menu {
      position: relative;
      z-index: 10000;
      font-family: "SourceSansProLight", Helvetica, Arial, sans-serif; }

    .off-canvas-menu menu menu span {
      display: block; }

    .off-canvas-menu menu menuitem > .heading {
      font-family: "SourceSansProLight", Helvetica, Arial, sans-serif;
      text-transform: uppercase; }

    .off-canvas-menu input[type="checkbox"],
    .off-canvas-menu input[type="reset"] {
      display: none !important; }

    .off-canvas-menu > nav span {
      cursor: default; }

    .off-canvas-menu nav,
    .off-canvas-menu nav nav {
      background: #fff;
      font-size: 1.25rem;
      height: 100vh;
      left: 0;
      padding-top: 20px;
      position: absolute;
      top: 0;
      transform: translateX(-100vw);
      transition: transform .4s ease-in-out;
      width: 100vw;
      z-index: 10003; }

    .off-canvas-menu nav > main,
    .off-canvas-menu nav nav > main {
      height: 100%;
      overflow-x: hidden;
      overflow-y: auto;
      padding: 0 20px;
      width: 100%;
      position: static; }

    .off-canvas-menu nav label {
      cursor: pointer;
      font-weight: normal;
      margin: 0; }

    .off-canvas-menu nav label:focus {
      outline: none; }

    .off-canvas-menu nav label.menu-close {
      display: inline-block;
      padding: 0;
      z-index: 10002; }

    .off-canvas-menu nav label.menu-toggle {
      display: inline-block;
      line-height: 1.375rem;
      font-size: 1.375rem;
      padding: 0;
      z-index: 10002;
      height: auto;
      margin-top: 2px;
      font-family: "SourceSansProLight", Helvetica, Arial, sans-serif; }
      .off-canvas-menu nav label.menu-toggle span {
        font-size: 1.375rem;
        line-height: 1.375rem; }
        .off-canvas-menu nav label.menu-toggle span:before {
          position: relative;
          /* top: 3pt; Uncomment this to lower the icons as requested in comments*/
          content: "";
          display: inline-block;
          /* By using an em scale, the arrows will size with the font */
          width: 17px;
          height: 17px;
          border-right: 3px solid #ed6e2c;
          border-top: 3px solid #ed6e2c;
          transform: rotate(-135deg);
          margin-right: 10px; }

    .off-canvas-menu nav label.menu-toggle-first {
      opacity: 0; }

    .off-canvas-menu nav label.menu-close {
      z-index: 10004;
      line-height: 0;
      position: absolute;
      top: 32px;
      right: 40px; }

    .off-canvas-menu nav label.menu-close > span:after,
    .off-canvas-menu nav label.menu-close > span:before {
      background: #ed6e2c;
      display: block;
      height: 3px;
      pointer-events: none;
      transition: transform .4s ease-in-out,background-color .4s ease-in-out 0s;
      width: 30px; }

    .off-canvas-menu nav label.menu-close > span {
      display: block;
      position: relative; }

    .off-canvas-menu nav label.menu-close > span:after,
    .off-canvas-menu nav label.menu-close > span:before {
      content: "";
      position: absolute;
      transform: rotate(0) translateY(0); }

    .off-canvas-menu nav label.menu-close {
      opacity: 0;
      transition: all .4s ease-in; }

    .off-canvas-menu nav label.menu-close > span:after {
      transform: rotate(45deg); }

    .off-canvas-menu nav label.menu-close > span:before {
      transform: rotate(-45deg); }

    .off-canvas-menu nav menu {
      margin: 0;
      padding: 0;
      margin-top: 20px; }

    .off-canvas-menu nav menu menuitem {
      display: block;
      list-style: none; }
      .off-canvas-menu nav menu menuitem label {
        position: relative; }
      .off-canvas-menu nav menu menuitem nav main menuitem:first-child a {
        font-family: "SourceSansProLight", Helvetica, Arial, sans-serif; }

    .off-canvas-menu form > nav > main > menu > menuitem label[for="menu-item-71"] {
      color: #729B42; }

    .off-canvas-menu nav menu menuitem {
      border-bottom: 1px solid #ccc; }

    .off-canvas-menu nav menu menuitem > a,
    .off-canvas-menu nav menu menuitem > label,
    .off-canvas-menu nav menu menuitem > span {
      display: block;
      line-height: 1.875rem;
      padding: 15px 0;
      text-decoration: none; }

    .off-canvas-menu nav menu menuitem:first-child label:after {
      display: none; }

    .off-canvas-menu nav menu menuitem label,
    .off-canvas-menu nav menu menuitem a {
      color: #000000;
      font-family: "SourceSansProSemiBold", Helvetica, Arial, sans-serif;
      text-transform: uppercase; }

    .off-canvas-menu nav menu menuitem:last-child .menu-item {
      color: #ed6e2c; }

    .off-canvas-menu nav menu menuitem .menu-item--active {
      color: #ed6e2c; }

    .off-canvas-menu nav menu menuitem nav label {
      font-family: "SourceSansProSemiBold", Helvetica, Arial, sans-serif;
      text-transform: none; }

    .off-canvas-menu nav menu menuitem > label:after {
      position: absolute;
      /* top: 3pt; Uncomment this to lower the icons as requested in comments*/
      content: "";
      display: inline-block;
      /* By using an em scale, the arrows will size with the font */
      width: 17px;
      height: 17px;
      border-right: 3px solid #ed6e2c;
      border-top: 3px solid #ed6e2c;
      transform: rotate(45deg);
      right: 5px;
      top: 16px; }

    .off-canvas-menu input[type="checkbox"]:checked ~ nav {
      transform: translateX(0); }

    .off-canvas-menu input[type="checkbox"]:checked ~ nav label.menu-close {
      opacity: 1; }

      .mobile-service-menu {
        margin-top: 50px;
        margin-bottom: 50px; }
        .mobile-service-menu ul {
          display: block;
          margin: 0;
          padding: 0; }
          .mobile-service-menu ul li {
            display: block;
            border-bottom: 1px solid #ccc; }
            .mobile-service-menu ul li.o-footer__copyright__nav-item {
              padding: 0; }
              .mobile-service-menu ul li.o-footer__copyright__nav-item:last-child {
                border-bottom: 1px solid #ccc; }
            .mobile-service-menu ul li a {
              color: #707070;
              font-family: "SourceSansProLight", Helvetica, Arial, sans-serif;
              display: block;
              font-size: 1.125rem;
              line-height: 2.5rem; }
              .mobile-service-menu ul li a.o-mobile-menu__link--active {
                color: #729B42; }

                .menu-item-empty {
                  display: none !important;
                }

                .menu-item,
                .menu-item--active {
                  font-size: 14.4px;
                }

.navbar-nav > .dropdown:last-child a.nav-link {
  display: inline-block;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid transparent;
  padding: .375rem .75rem .375rem .75rem;
  border-radius: .25rem;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  background-color: #0062ae;
  border-width: 0;
  border-width: 1px;
  border-color: #0062ae;
  color: #fff;
}

.navbar-nav > .dropdown:last-child a.nav-link:hover,
.navbar-nav > .dropdown:last-child a.nav-link.active {
  background-color: white;
  color: #0062ae;
  border-width: 1px;
  border-color: #0062ae;
}

.navbar-nav > .dropdown:last-child a.nav-link.active:hover {
  background-color: #0062ae;
  color: #fff;
  border-width: 1px;
  border-color: #fff;
}

.orange-header .navbar-nav > .dropdown:last-child a.nav-link {
  background-color: white;
  color: #ed6e2c;
  border-width: 1px;
  border-color: #0062ae;
}

.orange-header .navbar-nav > .dropdown:last-child a.nav-link.active {
  background-color: #0062ae;
  color: #fff;
  border-width: 1px;
  border-color: #0062ae;
}

.orange-header .navbar-nav > .dropdown:last-child a.nav-link:hover {
  background-color: #fff;
  color: #0062ae;
  border-width: 1px;
  border-color: #0062ae;
}