:root {
  --color_dark: #003366; /* #003366; 0 20 40 MR/darkblue */
  --color_company: #92B347; /* MR/red */
  --color_bluegray: #566275; /* MR/bluegray */
}

/* Link in Header */
.header_change_nav:hover {
  border: 1px solid var(--color_company) !important;
  background: var(--color_company ) !important;
}

/* Warenkorb Circle */
.cart_circle {
  position: relative;
  background: var(--color_company);
  width: 10px;
  height: 10px;
  border-radius: 50%;
  top: -5px;
  right: -15px;
  z-index: 1;
}

/* Navbar Style ------------------------------------------------------------------------------------------------------------------------------------------------------------ */
.navbar.website_default {
  background: transparent;
}

#navbar > .menu-bar > .navbar-nav > li > a  {
  color: white;
}

.nav_default > ul > li > ul.dropdown-menu > li > ul.dropdown-menu > li > a,
.nav_default > ul > li > ul.dropdown-menu > li > a {
  color: var(--color_dark) ;
}

.nav_default > ul > li > ul.dropdown-menu > li > ul.dropdown-menu > li > a:hover,
.nav_default > ul > li > ul.dropdown-menu > li > ul.dropdown-menu > li > a:focus,
.nav_default > ul > li > ul.dropdown-menu > li > ul.dropdown-menu > li > a:active,
.nav_default > ul > li > ul.dropdown-menu > li > a:hover,
.nav_default > ul > li > ul.dropdown-menu > li > a:focus,
.nav_default > ul > li > ul.dropdown-menu > li > a:active {
  background: white;
}

.nav_a_header {
  border-top: 4px solid transparent;
  font-weight: 500 !important;
  padding: 25px 15px 15px 15px !important;
}

.nav_a_header:active,
.nav_a_header:focus,
.nav_a_header:hover {
  border-top: 4px solid white !important;
}

.nav_a {
  color: var(--color_dark) !important;
  background: white;
}

.nav_a:hover {
  color: var(--color_company) !important;
}

.navbar.nav_default {
  background: transparent;
}

.iconbar_blue  {
  border-color: var(--color_dark) !important;
  background: var(--color_dark) !important;
}

.iconbar_white  {
  border-color: white !important;
  background: white !important;
}

/* Dropdown */
ul.dropdown-menu {
  color: var(--color_dark) !important;
  background: white !important;
}

/*menue default*/
#menue_default:focus,
#menue_default:active,
#menue_default {
  font-family: Ubuntu !important;
  background: var(--color_company) !important;
  font-weight: 700 !important;
}

/* Logout ------------------------------------------------------------------------------------------------------------*/
#menue_logout_btn {
  color: var(--color_company) !important;
}

#menue_logout_btn > .icon_logout_svg {
  fill: var(--color_company);
  width: 17px;
  height: 20px;
  margin-right: 8px;
}

#menue_logout_btn:hover {
  color: white !important;
  background: var(--color_company);
}

#menue_logout_btn:hover > .icon_logout_svg {
  fill: white;
}

/* Arrow - user menue */
#user_roles > a > .icon_arrow_down_svg {
  stroke: var(--color_dark);
  fill: var(--color_dark);
  margin-left: 8px;
  width: 15px;
}

#user_roles:active > a,
#user_roles:focus > a,
#user_roles:hover > a {
  color: var(--color_company) !important;
}

#user_roles:hover > a > .icon_arrow_down_svg {
  stroke: var(--color_company);
  color: var(--color_company);
  fill: var(--color_company);
}

@media(min-width: 1200px) {
  /*-----------------------------------------------------------------------------*/
  /* Active LI */
  .nav > li.active {
    border-top-color: white !important;
  }

  #nav_user_roles_admin {
    left: -60%;
  }

  #nav_user_roles {
     left: -54%;
   }

  .nav > .active > a,
  .navbar-nav > .open > a {
    color: white !important;
    background: transparent !important;
    border-top-color: white !important;
  }

  /* Hover --------------------------------------------------------------------*/
  #navbar > ul.navbar-nav.weblinks > li > a:hover,
  #navbar > ul.navbar-nav.weblinks > li > a:active,
  #navbar > ul.navbar-nav.weblinks > li > a:focus {
    color: white !important;
  }

  /*  Bilder*/
  .header_logo {
    background: white;
    height: 110px;
    width: auto;
    position: absolute;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    padding: 5px 3px !important;
  }

  /* menue cart */
  .icon_cart_bag_svg {
    fill: white;
    width: 25px;
    padding-left: 9px;
    position: relative;
    top: -2px;
  }

  /* menue admin */
  #menue_koordanisation > .icon_settings_svg,
  #menue_administrator > .icon_settings_svg {
    fill: white;
    width: 30px;
    padding-left: 6px;
  }
}

@media(max-width: 1199px) {
  #menue_default:focus,
  #menue_default:active,
  #menue_default:hover,
  #menue_default {
    color: white !important;
  }

  #navbar > .menu-bar > .navbar-nav > li > a {
    color: var(--color_dark) ;
  }

  /* -----------------------------------------------------------------------*/
  li.border_collapse_in_li {
    border-top: 1px solid var(--color_bluegray);
    background: white;
  }

  .nav_default > ul > li > .nav_a_header:hover {
    color: var(--color_company) !important;
  }

  /* -----------------------------------------------------------------------*/
  /* Active LI */
  .nav > .active > a,
  .navbar-nav > .open > a {
    color: var(--color_company) !important;
    background: transparent !important
  }

  /*-----------------------------------------------------------  */
  button.navbar-toggle {
    border: none !important;
    background: transparent !important;
  }
  /*-----------------------------------------------------------  */
  /* Logo */
  .header_logo {
    background: white;
    width: 70px;
    height: auto;
    position: absolute;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
  }

  /* menue cart */
  .icon_cart_bag_svg {
    fill: var(--color_dark);
    width: 25px;
    padding-left: 9px;
    position: relative;
    top: -2px;
  }

  li:hover > #menue_cart > .icon_cart_bag_svg {
    fill: var(--color_company);
  }

  /* menue admin */
  #menue_koordanisation > .icon_settings_svg,
  #menue_administrator > .icon_settings_svg {
    fill: var(--color_dark);
    width: 30px;
    padding-left: 6px;
  }

  li:hover > #menue_koordanisation > .icon_settings_svg,
  li:hover > #menue_administrator > .icon_settings_svg {
    fill: var(--color_company);
  }
}

@media(max-width: 728px) {
  .navbar-nav {
    margin:7.5px -15px;
    margin-top:-7px;
  }
}
/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/* Page Navbar -------------------------------------------------------------------------------------------------------*/
.pagy-nav > .page > a {
  color: var(--color_dark);
}

span.page > a {
  color: var(--color_dark) !important;
}

.pagy-nav > .page.active {
  color: var(--color_company);
}

/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/* Regionale Navbar --------------------------------------------------------------------------------------------------*/
.nav_regional,
.nav_regional2 {
  border: none !important;
}

.navbar.nav_regional {
  background: transparent;
}

.navbar.nav_regional2 {
  background: transparent;
}

#nav_regional > .menu-bar > .navbar-nav > li > a {
  color: white;
}

#nav_regional2 > .menu-bar > .navbar-nav > li > a {
  color: var(--color_dark);
}

/*.navbar-toggle.mr_header_nav,*/
.navbar-toggle.header_navigation,
.navbar-toggle.header_navigation:hover,
.navbar-toggle.header_navigation:focus,
.navbar-toggle.header_navigation:active {
  background:  var(--color_bluegray);
}

.header_navigation > ul > li > ul.dropdown-menu > li > ul.dropdown-menu > li > a:hover,
.header_navigation > ul > li > ul.dropdown-menu > li > ul.dropdown-menu > li > a:focus,
.header_navigation > ul > li > ul.dropdown-menu > li > ul.dropdown-menu > li > a:active,
.header_navigation > ul > li > ul.dropdown-menu > li > a:hover,
.header_navigation > ul > li > ul.dropdown-menu > li > a:focus,
.header_navigation > ul > li > ul.dropdown-menu > li > a:active {
  color: var(--color_company) !important;
  background: white;
  border: none !important;
}

@media(min-width: 1200px){
  /*UL --------------*/
  #nav_regional > div > ul,
  #nav_regional2 > div > ul {
    background: transparent !important;
  }


  /*LI -------------------------*/
  #nav_regional > .header_navigation > ul > li:hover {
    border-top-color: var(--color_company);
    background: transparent !important;
  }

  /* Text des LI */
  .header_navigation > ul > li > a {
    color: var(--color_dark);
  }

  .header_navigation > ul > li {
    border-top: 4px solid transparent;
  }

  .header_navigation > ul > li > ul.dropdown-menu > li > ul.dropdown-menu > li > a,
  .header_navigation > ul > li > ul.dropdown-menu > li > a {
    color: var(--color_dark) !important;
    background: white;
  }
  #navbar > .header_navigation > ul > li:hover {
    border-top-color: white;
  }
  /*-----------*/

  #nav_regional > .navbar-right,
  #nav_regional2 > .navbar-right{
    padding-top: 1.45em !important;
    padding-bottom: 1.45em !important;
  }

  #nav_regional2 > div > ul > li > a {
    color: var(--color_dark);
    background: transparent !important;
    color: white;
  }

  #nav_regional > ul.navbar-nav.weblinks > li > a:hover,
  #nav_regional > ul.navbar-nav.weblinks > li > a:active,
  #nav_regional > ul.navbar-nav.weblinks > li > a:focus,
  #nav_regional > .header_navigation > ul > li > a:hover,
  #nav_regional > .header_navigation > ul > li > a:active,
  #nav_regional > .header_navigation > ul > li > a::selection,
  #nav_regional > .header_navigation > ul > li > a:focus {
    color: var(--color_company) !important;
  }

  #navbar > .header_navigation > ul > li > a:hover,
  #navbar > .header_navigation > ul > li > a:active,
  #navbar > .header_navigation > ul > li > a::selection,
  #navbar > .header_navigation > ul > li > a:focus {
    color: white !important;
  }
  /*-----------*/
  .header_navigation > ul.navbar-nav.weblinks > li > a:hover,
  .header_navigation > ul.navbar-nav.weblinks > li > a:active,
  .header_navigation > ul.navbar-nav.weblinks > li > a:focus {
    background: transparent !important;
  }

  .header_navigation > ul > li > a:hover,
  .header_navigation > ul > li > a:active,
  .header_navigation > ul > li > a::selection,
  .header_navigation > ul > li > a:focus {
    background: transparent !important;
  }

  /*  Bilder*/
  .nav_logo_faq {
    background: white;
    width: auto;
    height: 140px;
    position: absolute;
    border-radius: 50% !important;
    padding: 0 !important;
    margin-top: 20px !important;
  }

  .nav_logo {
    background: white;
    height: 130px;
    width: auto;
    position: absolute;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    padding: 5px 3px !important;
  }
}

@media(max-width: 1199px) {
  #nav_regional.navbar-collapse.collapse.in > .header_navigation > ul > li,
  #nav_regional2.navbar-collapse.collapse.in > .header_navigation > ul > li {
    border-top: 1px solid var(--color_grey);
  }

  #nav_regional.navbar-collapse.collapse.in > .header_navigation > ul > li#mitmachen,
  #nav_regional2.navbar-collapse.collapse.in > .header_navigation > ul > li#mitmachen {
    border-bottom: 1px solid var(--color_grey);
  }

  /* Text des LI */
  .header_navigation > ul > li > a {
    color: var(--color_dark) !important;
  }

  /* Text des LI Dropdown */
  .header_navigation > ul > li > ul.dropdown-menu > li > ul.dropdown-menu > li > a,
  .header_navigation > ul > li > ul.dropdown-menu > li > a {
    color: var(--color_dark) !important;
    background: white;
  }

  /* Hover LI --------------------------------------------------------------*/
  .header_navigation > ul.navbar-nav.weblinks > li > a:hover,
  .header_navigation > ul.navbar-nav.weblinks > li > a:active,
  .header_navigation > ul.navbar-nav.weblinks > li > a:focus {
    background: transparent !important;
    color: var(--color_company) !important;
  }

  .header_navigation > ul > li > a:hover,
  .header_navigation > ul > li > a:active,
  .header_navigation > ul > li > a::selection,
  .header_navigation > ul > li > a:focus {
    background: transparent !important;
    color: var(--color_company) !important;
  }

  #nav_regional > div > ul,
  #nav_regional2 > div > ul,
  #nav_regional > div > ul > li > a,
  #nav_regional2 > div > ul > li > a {
    background: white !important;
  }

  #nav_mitmachen {
    border-bottom: 1px solid var(--color_grey);
  }

  /* Logo */
  .navbar > .center_position > a > .nav_logo,
  .navbar > .center_position > a > form > .nav_logo {
    margin-left: 0 !important;
  }

  .nav_regional > div.center_position > .navbar-header,
  .nav_regional2 > div.center_position > .navbar-header {
    padding-bottom: 12px;
  }

  .nav_logo_faq,
  .nav_logo {
    background: white;
    width: 68px;
    height: auto;
    position: absolute;
    border-radius: 4px;
    padding: 0 4px !important;
  }
}

@media(max-width: 1199px) and (min-width: 729px){
  #nav_regional > div > ul > li > a,
  #nav_regional2 > div > ul > li > a {
    color: var(--color_dark);
    width: 61px !important;
  }
}

/* ------------------------------------------------------------------------------------------------------------------ */
.nav_border_bottom {
  border-bottom: 6px solid var(--color_company) !important;
}
