:root {
  --color_dark: #083074; /* #003366; MH/darkblue */
  --color_company: #eb662d; /* MH/orange */
  --color_bluegray: #566275; /* MH/bluegray */
  font-family: 'Assistant', sans-serif !important;
}

/* Link in Header */
.header_change_nav:hover {
  border: 1px solid var(--color_dark) !important;
  background: var(--color_dark ) !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: white;
}

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

.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;
  margin: 16px 0;
}

.nav_a_header:active,
.nav_a_header:focus,
.nav_a_header:hover {
  border-top: 4px solid transparent !important;
  color: var(--color_company) !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 {
  background: var(--color_company) !important;
  color: var(--color_dark) !important;
  font-weight: 500 !important;
}

#menue_default > .icon_menue_lines_svg {
  stroke: var(--color_dark) !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: transparent !important;
  }

  #nav_user_roles_admin {
    left: -60%;
  }

  li:hover > #menue_administrator > .icon_settings_svg,
  li:hover > #menue_cart > .icon_cart_bag_svg {
    fill: var(--color_company) !important;
  }

  #nav_user_roles {
    left: -58%;
  }

  .nav > .active > a,
  .navbar-nav > .open > a {
    color: var(--color_company) !important;
    background: transparent !important;
    border-color: transparent !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;
  }

  /*#menue_main {*/
  /*  background: var(--color_company) !important;*/
  /*  color: white !important;*/
  /*  border-radius: 2px;*/
  /*  padding-top: 10px !important;*/
  /*  font-weight: 700 !important;*/
  /*}*/

  /*#menue_main:hover,*/
  /*#menue_main:active,*/
  /*#menue_main:focus {*/
  /*  background: var(--color_dark) !important;*/
  /*}*/

  /*  Bilder*/
  .header_logo {
    background: transparent !important;
    height: 155px;
    width: auto;
    position: absolute;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    padding: 28px 4px !important;
    top: -35px;
  }

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

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

@media(max-width: 1199px) {
  #menue_default:focus,
  #menue_default:active,
  #menue_default:hover,
  #menue_default {
    color: var(--color_dark) !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;
  }

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

  .nav_default > ul > li > .nav_a_header:hover {
    color: var(--color_company) !important;
  }
  /*-----------------------------------------------------------  */
  button.navbar-toggle {
    border: none !important;
    background: transparent !important;
  }
  /*-----------------------------------------------------------  */
  /* Logo */
  .header_logo {
    background: transparent !important;
    height: 155px;
    width: auto;
    position: absolute;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    padding: 40px 4px !important;
    top: -40px;
  }

  /* 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) !important;
  }

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

  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: 0.73em;
    padding-bottom: 0.73em;
  }

  #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: 120px;
    height: auto;
    position: absolute;
    border-radius: 50% !important;
    padding: 0 4px !important;
    margin-top: 20px !important;
  }

  .nav_logo {
    height: 155px;
    width: auto;
    position: absolute;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    padding: 34px 4px !important;
    top: -33px;
  }
}

@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);*/
    border: none !important;
  }

  #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);*/
    border: none !important;
  }

  /* 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);*/
    border: none !important;
  }

  /* 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: 21px;
  }

  .nav_logo_faq,
  .nav_logo {
    height: 140px;
    width: auto;
    position: absolute;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    padding: 40px 4px !important;
    top: -33px;
  }
}

@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;
  }
}
