/* TopBar */
.topbar { 
    font-size: .8rem; 
    line-height: 1.8rem; 
    background: rgba(134, 135, 137, 1); 
}

.topbar i { font-size: .8rem; }

.topbar, 
.topbar a { 
    color:rgba(255, 255, 255, 1); 
}

.topbar .nav-link { padding: 0; }

.topbar .topbar-item { 
    border-color: rgba(255, 255, 255, 1); 
    border-width: 0 1px 0 0; border-style: solid; 
    border-image: linear-gradient(transparent 0%, transparent 30%, rgba(255, 255, 255, 1) 30%, rgba(255, 255, 255, 1) 70%, transparent 70%, transparent 100%) 1 100%;
    -webkit-border-image: linear-gradient(transparent 0%, transparent 30%, rgba(255, 255, 255, 1) 30%, rgba(255, 255, 255, 1) 70%, transparent 70%, transparent 100%) 1 100%; 
}
.topbar .topbar-item:nth-child(2), 
.topbar .topbar-item:last-of-type { border-right: 0; }
.topbar .dropdown-menu { 
    position: absolute; 
    font-size: .8rem; line-height: 1rem; 
    min-width: 12rem; 
    padding: .5rem; 
    margin-top: .5rem; 
    background: rgba(255, 255, 255, 1); 
    background-clip: padding-box; 
    border-color: rgb(33, 112, 37,.35); 
    border-width: 1px 1px 1px 1px; 
    border-style: solid; 
    border-radius: 0; 
    box-shadow: 0 .125rem .25rem rgba(134, 135, 137,.175)!important; 
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
    clear: both; 
}
.topbar .dropdown-menu::after { 
    -webkit-transform: rotate(135deg); transform: rotate(135deg); 
    width: 0.5rem; 
    height: 0.5rem; 
    top: -0.3125rem; 
    right: 1.125rem; 
    content: ''; 
    display: block; 
    position: absolute; 
    background: rgba(255, 255, 255, 1); 
    border-color: rgba(33, 112, 37,.35); 
    border-width: 0 0 1px 1px; 
    border-style: solid; 
}

.topbar .dropdown-menu ul { margin: 0; }

.dropdown-item { 
    display: block;
    width: 100%;
    padding: .25rem 1rem; 
    white-space: unset; 
    background-color: transparent; 
    border-color: rgba(4, 74, 156,.35); 
    border-width: 0 0 1px 0; 
    border-style: solid; 
    clear: both; 
}

.dropdown-menu > li:last-of-type > .dropdown-item:last-of-type,
.dropdown-menu > ul:last-of-type > .dropdown-item:last-of-type { border: 0; }
.dropdown-menu .dropdown-item i { font-size:.8rem; }
a.dropdown-item, 
.dropdown-item a { color: rgb(134, 135, 137,1); }

.dropdown-item.active, 
.dropdown-item:active,
.dropdown-item:hover,
.dropdown-item:hover a { color: rgb(0, 122, 51,1); background-color: transparent; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; }


/* Page - Menu */
.page-menu { 
    padding: 0.625rem; 
    border-color:rgb(4, 74, 156,.35); 
    border-width: 1px; 
    border-style: solid; 
    background: rgb(248, 249, 250,1)!important; 
    clear: both; 
}

.page-menu .menu-item { 
    display: block; 
    width: 100%; 
    padding: .725rem .25rem; 
    text-align: inherit; 
    background-color: transparent; 
    border-color:rgb(4, 74, 156,.35); 
    border-width: 0 0 1px 0; 
    border-style: solid; 
    clear: both; 
}

.menu-item:last-of-type { border: 0; }

.page-menu .menu-item a,
.page-menu a.menu-item { color: rgba(51, 51, 51, 1); }

.page-menu > .menu-item:active > a,
.page-menu > .menu-item.active > a,
.page-menu > .sub-item:active > a,
.page-menu > .sub-item.active > a {
    color: rgba(0, 122, 51,1);
}

.page-menu > .menu-item.active,
.page-menu > .menu-item a:hover {
    cursor: pointer;
    font-weight: 600;
    color: rgb(0, 122, 51,1);
    background-color: transparent;
    
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

/* Submenu */
.page-menu li > .sub-menu, 
.page-menu li > .page-menu {
    font-weight: 400;
    padding: .625rem 0 0 .625rem;
    border: 0;
    clear: both;
}

.sub-menu > .sub-item, 
.page-menu > .sub-item {
    display: block;
    width: 100%;
    padding: .5rem;
    text-align: inherit;
    background-color: transparent;
    border: 0;
    clear: both;
}

.sub-menu > .sub-item > a,
.sub-menu > a.sub-item, 
.page-menu > .sub-item > a, 
.page-menu > a.sub-item {
    color: rgba(51, 51, 51, 1);
}

.sub-menu > .sub-item.active,
.sub-menu > .sub-item a:hover, 
.page-menu > .sub-item.active, 
.page-menu > .sub-item a:hover {
    cursor: pointer;
    font-weight: 600;
    color: rgb(0, 122, 51,1);
    background-color: transparent;
  
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}


/* Main - Navigation */
nav.navbar {
    font-family: 'Open Sans', Arial, sans-serif;
    background: rgba(0, 122, 51,1);
    padding: 0;
    
    border-color: rgb(0, 122, 51,1);
    border-width: 1px 0 1px 0;
    border-style: solid;
    
    z-index: 9;
}

ul.mobile-nav li,
ul.navbar-nav li { width: 100%; }

.navbar .nav-link {
    padding: 0 .5rem;
    color: rgba(255, 255, 255, 1);
    text-transform: uppercase;
    display: block;
    font-weight: 400;
}

.navbar .nav-link > a {
    color: rgba(255, 255, 255, 1);
    font-weight: 600;
    text-transform: uppercase;
}

.nav-pills .nav-link {
    background-color:rgba(248, 249, 250,1);
    color:rgba(51, 51, 51, 1);
}

.nav-pills .nav-link.active, 
.nav-pills .show>.nav-link {
    color: #fff;
    background-color: rgba(0, 122, 51,1)!important;
}

.nav-pills .nav-link.active {
    box-shadow: 0 0.5rem 1.125rem -0.5rem rgba(134, 135, 137,.9);
}

.nav-pills .nav-link:hover:not(.active):not([aria-expanded=true]), .nav-pills .nav-link.show {
    background-color: #dfe4ef;
}

/* Tabs - Nav */
.tabs .nav-link {
    color: rgba(134, 135, 137, 1);
}

.tabs > a.nav-link:hover
,.tabs > .nav-item:hover {
    background: #4e50521!important; 
}

.tabs .nav-link.active {
    color: rgb(0, 122, 51,1);
    font-weight: 600;
    border-color: rgb(0, 122, 51,1);
    border-width: 0 0 2px 0;
    border-style: solid; 
}

li.tg-item {
    display:flex;
    min-height:3.5em;
}

@media screen and (min-width: 480px) {
}

@media screen and (min-width: 576px) {
}

@media screen and (min-width: 768px) {
}

/* MOBILE BREAKPOINT */
@media screen and (max-width: 991px) {
    .mobile-mnu {
        cursor: pointer;
        padding: 0 .5rem;
        color: rgba(255, 255, 255, 1);
        text-transform: uppercase;
        font-size: 1.2em;
        font-weight: 400;
        line-height: 1.8em;
    }
  
    .cart-link a {
        color: #fff!important;
        padding: 0;
    }
  
    .navbar .nav-link,
    .navbar .nav-link > a {
        color: rgba(0, 122, 51,1); 
    }
  
    nav.navbar .oc-header {
        display:block;
        background: rgb(0, 122, 51,1);
        color: rgba(255, 255, 255, 1);
        padding: .5rem;
        margin-bottom: 1rem;
        cursor: pointer;
    }
  
    nav.navbar .desktop-item {
        display:none;
    }
  
    nav.navbar .mobile-item {
        display:block;
        position: relative;
    }
  
    .navbar .nav-item {
        padding: 1rem 0;
    }
  
    .navbar .navbar-collapse .nav-item {
        padding: .75rem .5rem;
        border-color:rgba(4, 74, 156,.35);
        border-width: 0 0 1px 0;
        border-style: solid;
    }
  
    .navbar-collapse {
        visibility: hidden;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        border-radius: 0;
        z-index: 1200;
        background-color: rgba(248, 249, 250, 1);
        width: 100%;
        max-width: 20rem;
        overflow-y: auto;
        overflow-x: hidden;
        font-size: .9rem;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        -webkit-transition: all .4s;
        -moz-transition: all .4s;
        -o-transition: all .4s;
        transition: all .4s;
    }
  
    .navbar-collapse.show {
        visibility: visible;
        box-shadow: 0 0 10px rgba(10, 10, 10, 0.7);  
        transform: translate3d(0, 0, 0);
    }
  
    .navbar-nav.nav-catalog {
        background: rgba(255, 255, 255, 1);
    }
  
    .navbar-nav .dropdown-menu {
        border:0;
        box-shadow: unset;
        padding: 0;
        background: transparent;
    }
  
    .navbar-nav .dropdown-menu ul.sub-nav > li {
        padding: .5rem .25rem;
    }
  
    .navbar-nav .dropdown-menu ul.sub-nav > li:hover a {
        color:rgba(0, 122, 51,1);
    }
  
    .nav-item > .dropdown-toggle::after {
        margin: 0 .5rem;
        vertical-align: unset;
        border:unset;
        font-family: 'themify';
        font-size: .7rem;
        content: '\e61a';
        float: right;
    }
  
    .nav-item.show > .dropdown-toggle::after {
        content: '\e622';
    }

    .dropdown-menu .dropdown-menu {
        margin-left:0.7rem; 
        margin-right:0.7rem; 
        margin-bottom: .5rem;
    }
}


/* DESKTOP BREAKPOINT */
@media screen and (min-width: 992px) { 
    .navbar .has-megamenu { position:static!important; }

    .navbar .megamenu,
    .navbar .dropdown-menu { 
        left:0; 
        right:0; 
        min-width:320px;
        width:100%; 
        margin: auto; 
        padding:0; 
        box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
    }
    
    nav.navbar .oc-header{ display:none; }
  
    nav.navbar .mobile-item {
        display:none;
    }
  
    .navbar .nav-item {
        padding-top: 1rem;
        padding-bottom: 1rem;
        text-align: center;
    }
  
    .navbar .nav-item:hover {
        background: rgba(0, 102, 42,1);
        cursor: pointer;
    
        -webkit-transition: all .4s ease;
        -moz-transition: all .4s ease;
        -o-transition: all .4s ease;
        transition: all .4s ease;
    }
  
    .navbar-nav .dropdown:hover > .main-stage, 
    .navbar-nav .nav-item:hover > .main-stage {
        /* display: block; */
        opacity: 1;
        visibility: visible;
        top: 100%;
        -webkit-transform: rotateX(0);
        transform: rotateX(0);
        -webkit-transition: all .4s ease;
        -moz-transition: all .4s ease;
        -o-transition: all .4s ease;
        transition: all .4s ease;
    }
    
    .navbar .dropdown-menu-end{ right:0; left: auto; }
    .navbar .nav-item .dropdown-menu { 
        display:block; 
        opacity: 0;  
        visibility: hidden; 
        transition:.3s; margin-top:0;  
    }

    .navbar .nav-item:hover .nav-link{ color: #fff; }

    .navbar .dropdown-menu.fade-down{ 
        top:80%; 
        transform: rotateX(-75deg); 
        transform-origin: 0% 0%; 
    }

    .navbar .dropdown-menu.fade-up{ top:180%; }
    
    /* .navbar .nav-item:hover .main-stage { 
        transition: .3s; 
        opacity:1; 
        visibility:visible; 
        top:100%; 
    } */

    .main-stage .main-stage-item:hover > .submenu { 
        /* transition: .3s;  */
        -webkit-transition: all .4s ease;
        -moz-transition: all .4s ease;
        -o-transition: all .4s ease;
        transition: all .4s ease;
        opacity:1; 
        visibility:visible; 
    }

    .sub-stage-item:hover > .dropdown-menu { 
        /* transition: .3s;  */
        -webkit-transition: all .4s ease;
        -moz-transition: all .4s ease;
        -o-transition: all .4s ease;
        transition: all .4s ease;
        opacity:1; 
        visibility:visible; 
    }

    .dropdown-menu li { position: relative; }

    .nav-item .submenu { 
        /* display: none;  */
        position: absolute; 
        left:100%; 
        top:0; 
        /* opacity:0; */
    }

    .nav-item .submenu-left { right:100%; left:auto; }

    .dropdown-menu li:hover > .submenu { 
        display: block; 
    }
  
    /*
    .navbar .megamenu,
    .navbar .mega-box {
        z-index: 200;
        background-color: rgba(248, 249, 250, 1);
        text-align: left;
        padding: 0;
        margin-top: .1rem;
        border: unset;
        border-radius: 0;
        box-shadow: 0 .125rem .25rem rgba(33, 112, 37,.175)!important;
        visibility: hidden;
        opacity: 0;    
        clear: both;
    }
  
    .navbar .megamenu > .mega-box-header,
    .navbar .mega-box .mega-box-header {
        background: rgba(0, 122, 51,1);
        padding: 1rem 1.5rem;
    }
    
    .navbar .megamenu .mega-box-header a,
    .navbar .mega-box .mega-box-header a {    
        color:rgba(255, 255, 255, 1);
        padding: 0;
    }
  
    .navbar .megamenu > .mega-box-header a::before,
    .navbar .mega-box .mega-box-header a::before {
        content: 'Zum Sortiment ';
        text-transform: none;
    }
  
    .navbar .megamenu > .mega-box-header a::after,
    .navbar .mega-box .mega-box-header a::after {
        font-family: 'themify';
        font-size: .7rem;
        content: '\e661';
        padding-left: .25rem;
    }
  
    .navbar .megamenu > .mega-box-header a:hover,
    .navbar .mega-box .mega-box-header a:hover {
        color:rgba(255, 255, 255, 1);
        padding-left: .15rem;
        -webkit-transition: padding .4s ease;
        -moz-transition: padding .4s ease;
        -o-transition: padding .4s ease;
        transition: padding .4s ease;
    }
  
    .mega-box-sub {
        border:0;
    }
  
    .navbar .megamenu > .content,
    .navbar .mega-box > .content {
        padding: 1.25rem 0;
        min-height: 15rem;
    }
    
    .navbar .megamenu ul.sub-nav > li { 
        padding: 1rem;
    }
  
    .navbar .megamenu ul.sub-nav > li:hover {
        padding-left: 1.15rem;
        -webkit-transition: padding .4s ease;
        -moz-transition: padding .4s ease;
        -o-transition: padding .4s ease;
        transition: padding .4s ease;
    }
  
    .navbar .megamenu ul.sub-nav > li:hover a {
        color:rgba(0, 122, 51,1);
    }
    */

    .shop-icon .dropdown-menu{ 
        display:block; 
        opacity: 0;
        visibility: hidden; 
        transition:.3s; margin-top:0;
    }

    .shop-icon .dropdown-menu.fade-down{ 
        top:80%; 
        transform: rotateX(-75deg); transform-origin: 0% 0%; 
    }

    .shop-icon .dropdown-menu.fade-up{ top:180%; }
    .shop-icon:hover .dropdown-menu{ 
        transition: .3s; 
        opacity:1; 
        visibility:visible; 
        top:100%; 
        transform: rotateX(0deg); 
    }
}

@media screen and (min-width: 1200px) {

}

@media screen and (min-width: 1600px) {

}

.accordion-button {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0.625rem 1.25rem;
  font-size: 1rem;
  color: #373f50;
  text-align: left;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  overflow-anchor: none;
  transition: color 0.25s ease-in-out, background-color 0.25s ease-in-out, border-color 0.25s ease-in-out, box-shadow 0.2s ease-in-out, border-radius 0.15s ease;
}

@media (prefers-reduced-motion: reduce) {
  .accordion-button {
    transition: none;
  }
}

.accordion-button:not(.collapsed) {
  color: #373f50;
  background-color: transparent;
  box-shadow: inset 0 -1px 0 #dde4eb;
}

.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23373f50'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  transform: rotate(-180deg);
}

.accordion-button::after {
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  margin-left: auto;
  content: "";
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23373f50'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-size: 1rem;
  transition: transform 0.2s ease-in-out;
}

@media (prefers-reduced-motion: reduce) {
  .accordion-button::after {
    transition: none;
  }
}

.accordion-button:hover {
  z-index: 2;
}

.accordion-button:focus {
  z-index: 3;
  border-color: #dde4eb;
  outline: 0;
  /*box-shadow: unset;*/
}

.accordion-header {
  margin-bottom: 0;
}

.accordion-item {
  background-color: transparent;
  border: 1px solid #dde4eb;
}

.accordion-item:first-of-type {
  border-top-left-radius: 0.4375rem;
  border-top-right-radius: 0.4375rem;
}

.accordion-item:first-of-type .accordion-button {
  border-top-left-radius: calc(0.4375rem - 1px);
  border-top-right-radius: calc(0.4375rem - 1px);
}

.accordion-item:not(:first-of-type) {
  border-top: 0;
}

.accordion-item:last-of-type {
  border-bottom-right-radius: 0.4375rem;
  border-bottom-left-radius: 0.4375rem;
}

.accordion-item:last-of-type .accordion-button.collapsed {
  border-bottom-right-radius: calc(0.4375rem - 1px);
  border-bottom-left-radius: calc(0.4375rem - 1px);
}

.accordion-item:last-of-type .accordion-collapse {
  border-bottom-right-radius: 0.4375rem;
  border-bottom-left-radius: 0.4375rem;
}

.accordion-body {
  padding: 1.25rem 1.25rem;
}

.accordion-flush .accordion-collapse {
  border-width: 0;
}

.accordion-flush .accordion-item {
  border-right: 0;
  border-left: 0;
  border-radius: 0;
}

.accordion-flush .accordion-item:first-child {
  border-top: 0;
}

.accordion-flush .accordion-item:last-child {
  border-bottom: 0;
}

.accordion-flush .accordion-item .accordion-button {
  border-radius: 0;
}