/* header.css */



.navbar {
    z-index: 1009;
}

.navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse {
    max-height: 100vh;
}

.navbar-nav > li {
    font-family: 'Oswald', sans-serif;
}

.navbar-default-transition .navbar-nav > .open > a, .navbar-inverse-transition .navbar-nav > .open > a, .navbar-default-transition .navbar-nav > .active > a, .navbar-inverse-transition .navbar-nav > .active > a, .navbar-default-transition .navbar-nav > li > a, .navbar-inverse-transition .navbar-nav > li > a, .navbar-default-transition .navbar-nav > .open > a:hover, .navbar-inverse-transition .navbar-nav > .open > a:hover, .navbar-default-transition .navbar-nav > .active > a:hover, .navbar-inverse-transition .navbar-nav > .active > a:hover, .navbar-default-transition .navbar-nav > li > a:hover, .navbar-inverse-transition .navbar-nav > li > a:hover, .navbar-default-transition .navbar-nav > .open > a:focus, .navbar-inverse-transition .navbar-nav > .open > a:focus, .navbar-default-transition .navbar-nav > .active > a:focus, .navbar-inverse-transition .navbar-nav > .active > a:focus, .navbar-default-transition .navbar-nav > li > a:focus, .navbar-inverse-transition .navbar-nav > li > a:focus {
    color: #ffffff;
    color: #99cc11;
    font-size: 1.2em;
}

.navbar-default .navbar-nav > li > a, .navbar-default-transition .navbar-nav > li > a, .navbar-default-transition.navbar-transition .navbar-nav > li > a {
    color: #ffd7a2;
    color: #99cc11;
    color: #030303;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus, .navbar-default-transition .navbar-nav > .active > a, .navbar-default-transition .navbar-nav > .active > a:hover, .navbar-default-transition .navbar-nav > .active > a:focus, .navbar-default-transition.navbar-transition .navbar-nav > .active > a, .navbar-default-transition.navbar-transition .navbar-nav > .active > a:hover, .navbar-default-transition.navbar-transition .navbar-nav > .active > a:focus {
    color: #007700;
    color: #99cc11;
    color:  #4e8134;
    background-color: transparent;
}

.navbar-default .navbar-nav > li > a:hover {
    color:  #4e8134;
}
/* Balken über Menülink */
.navbar-main > li > a .bar {
    background: #4e8134;
}



.btn-success { background-color: #448030; border-color: #448030; color: white; border-radius: .8em; text-align: center; padding-left: 2em; padding-right: 2em;}


/* Logo in Smarfone Menü */ 
@media (max-width: 992px) {

.topnavLogo { height: 37px; display: none;}
.topnavLogoText { }
.mobile-only-menu-item { }
.desktop-only-item { border: 0px solid red; height: 0px;}
.nav .desktop-only-menu-item { /*border: 1px solid red;*/ display: none;}

}
@media (min-width: 992px) {
.topnavLogoText { display: none; }
.nav .mobile-only-menu-item { display: none; }

.nav .desktop-only-menu-item { /*border: 0px solid red;*/ }
}



/* Logo links bei Desktop ausbelnden */
@media (min-width: 992px) {
    
    .spiruli-top-nav-mod { display: none; }

   .topnavLogo {height: 90px;margin-top: 10px;}

    /* gescrollt */
    .navbar-main > li > .navbar-text, .navbar-main > li > a {
         line-height: 70px;
         height: 70px;
         /* font-size: 14px; */
    }

    /* nicht gescrollt */
.navbar-transition .navbar-header-main .navbar-brand, .navbar-transition .navbar-main > li > .navbar-text, .navbar-transition .navbar-main > li > a {
    line-height: 70px;
    height: 70px;
}
    .body-bg-top { padding-top: 70px; }
    


}

/* Größder schrift navigation */
@media (min-width: 992px) and (max-width: 1200px) {
    
    /* gescrollt */
    .navbar-main > li > .navbar-text, .navbar-main > li > a {
       font-size: 16px;
    }

    /* nicht gescrollt */
.navbar-transition .navbar-header-main .navbar-brand, .navbar-transition .navbar-main > li > .navbar-text, .navbar-transition .navbar-main > li > a {
   font-size: 16px;
}

}
/* Größder schrift navigation */
@media (min-width: 1200px) and (max-width: 1600px) {
    
    /* gescrollt */
    .navbar-main > li > .navbar-text, .navbar-main > li > a {
       font-size: 20px;
    }

    /* nicht gescrollt */
.navbar-transition .navbar-header-main .navbar-brand, .navbar-transition .navbar-main > li > .navbar-text, .navbar-transition .navbar-main > li > a {
   font-size: 20px;
}

}
/* Größder schrift navigation */
@media (min-width: 1600px) {
    
    /* gescrollt */
    .navbar-main > li > .navbar-text, .navbar-main > li > a {
       font-size: 20px;
    }

    /* nicht gescrollt */
.navbar-transition .navbar-header-main .navbar-brand, .navbar-transition .navbar-main > li > .navbar-text, .navbar-transition .navbar-main > li > a {
   font-size: 20px;
}

}







@media (min-width: 768px) and (max-width: 1200px) {
    
.navbar-default-transition .navbar-nav > .open > a, .navbar-inverse-transition .navbar-nav > .open > a, .navbar-default-transition .navbar-nav > .active > a, .navbar-inverse-transition .navbar-nav > .active > a, .navbar-default-transition .navbar-nav > li > a, .navbar-inverse-transition .navbar-nav > li > a, .navbar-default-transition .navbar-nav > .open > a:hover, .navbar-inverse-transition .navbar-nav > .open > a:hover, .navbar-default-transition .navbar-nav > .active > a:hover, .navbar-inverse-transition .navbar-nav > .active > a:hover, .navbar-default-transition .navbar-nav > li > a:hover, .navbar-inverse-transition .navbar-nav > li > a:hover, .navbar-default-transition .navbar-nav > .open > a:focus, .navbar-inverse-transition .navbar-nav > .open > a:focus, .navbar-default-transition .navbar-nav > .active > a:focus, .navbar-inverse-transition .navbar-nav > .active > a:focus, .navbar-default-transition .navbar-nav > li > a:focus, .navbar-inverse-transition .navbar-nav > li > a:focus {
   font-size: 1.0em;
}

}



@media (min-width: 992px) {
    
    .headerrow1 {
        
    }
    
    .shopping-cart {
        height: 40px;
        margin-top: -6px;
    }

    .shopping-cart-menu-link {
        /* color: red; */
    }
    .navbar-main > li > a .redbar {
    position: absolute;
    top: -10px;
    left: 0px;
    width: 100%;
    height: 4px;
    background: #4e8134;
    opacity: 0;
    -webkit-transition: top .19s ease-in-out 0s, opacity .25s ease-in-out;
    -o-transition: top .19s ease-in-out 0s, opacity .25s ease-in-out;
    transition: top .19s ease-in-out 0s, opacity .25s ease-in-out;
}
    
    
    
}




/* RTE Header Kopf */

@media (max-width: 768px) {

    .kopf-rechts {position: relative;text-align: center;float: left;margin-top: 150px;width:  100%;}
    
    .head-box-right-bg {
        background: #99cc11;
        width:100%;
        float: right;
        border: 0px solid red;
        padding: 32px;
        box-shadow: 5px 5px 5px #666;
        margin-top: -150px;
        z-index: 10008;
    }

    .head-box-right-text {
        color: white;
        font-weight: 500;
        font-size: 1.5em;
    }

    /* Dose */
    .kopf-links {margin-top: -100px;}
    .kopf-links img { max-width: 50%; z-index: 10008;}

    .top-of-all { z-index: 101; }

}

@media (min-width: 768px) {

    
    .kopf-rechts {position: relative;text-align: left;float: right;margin-top: 145px;}
    
    
    .head-box-right-bg {
        background: #99cc11;
        width:75%;
        float: right;
        border: 0px solid red;
        padding: 32px;
        box-shadow: 5px 5px 5px #666;
        margin-top: -240px;
        z-index: 10008;
    }

    .head-box-right-text {
        color: white;
        font-weight: 500;
        font-size: 2.2em;
    }

    /* Dose */
    .kopf-links {margin-top: -80px;}
    .kopf-links img { max-width: 50%; z-index: 10008;}

    .top-of-all { z-index: 101; }

}

/* RTE Header Kopf */

@media (min-width: 992px) {

    .kopf-rechts {position: relative;text-align: left;float: right;margin-top: 100px;}
    
    .head-box-right-bg {
        background: #99cc11;
        width:75%;
        float: right;
        border: 0px solid red;
        padding: 32px;
        box-shadow: 5px 5px 5px #666;
        margin-top: -240px;
        z-index: 10008;
    }

    .head-box-right-text {
        color: white;
        font-weight: 500;
        font-size: 2.8em;
    }

    /* Dose */
    .kopf-links {margin-top: -150px;}
    .kopf-links img { max-width: 50%; z-index: 10008;}

    .top-of-all { z-index: 101; }

}


/* Header Startseite */


@media ( max-width: 600px) {
    
    .carousel .item {
        max-height: 160px;
    }
}

@media ( max-width: 768px) {
    
    .carousel .item {
        max-height: 240px;
    }
}
@media ( max-width: 992px) {
    
    .carousel .item {
        max-height: 260px;
    }
}

@media ( min-width: 992px) {
    
   .carousel {
    overflow: hidden;
    border: 0px solid red;
}

}



/* Knöpfe für den Slider im Header ausblenden */
/* ------------------------------------------ */
.carousel .carousel-control.left, .carousel .carousel-control.right {
    opacity: 0;
    display: none;
}

.carousel-item-type-backgroundimage {
    border-bottom: 0px solid #94c11c;
}
/* Keine Pfeile im Slider */
.carousel .right .carousel-control-icon {
    right: -100%;
    display: none;
}
.carousel .left .carousel-control-icon {
    right: -100%;
    display: none;
}

/* Indicator immer sichtbar */
.carousel .carousel-control, .carousel .carousel-indicators {
    opacity: 1;
}
/* außer mobil */
@media screen and (max-width: 991px) {
    .carousel .carousel-control, .carousel .carousel-indicators {
    opacity: 0;
}
}


.left .carousel-control { display: none;}
.right .carousel-control { display: none;}

.carousel .carousel-indicators {border: 0px solid red;text-align: left;/* margin-right: 0; *//* margin-left: 0; */left: calc(-42vw);}
.carousel .carousel-indicators li {/* margin-left: 30px; */}
.carousel-indicators li {
    
    width: 15px;
    height: 15px;
    margin: 0px;
   
    border: 0px solid #94c11c;
    border-radius: 0px;
    cursor: pointer;
    background-color: #94c11c;
    /* background-color: rgba(0,0,0,0); */
}

.carousel-indicators .active {
    width: 15px;
    height: 15px;
    margin: 1px;
    background-color: #94c11c;
}


@media (max-width: 768px) {
    .carousel-indicators {
    position: absolute;
/*    bottom: 10px;
    left: 0px;
    z-index: 15;*/
    width: 100%;
    margin-left: calc(0);
    
/*    list-style: none;
    text-align: center;*/
}
   
}

@media (min-width: 768px) {
    .carousel-indicators {
    position: absolute;
    bottom: 10px;
    width: 350px;
    margin-left: calc(50vw);
}
   
}

@media (min-width: 992px) {
    .carousel-indicators {
    position: absolute;
    width: 445px;
    margin-left: calc(50vw);
}
   
}


@media (min-width: 1200px) {
    .carousel-indicators {
    position: absolute;
    width: 580px;
    margin-left: calc(50vw);
}
   
}


/* Anpassen der Höhe des Slider Images auf der Startseite */
@media ( min-width: 992px) {
   .carousel .item {
    overflow: hidden;
    height: calc(50vw);
    width: 100%;
    height: calc(100vh - 110px);
    border: 0px solid red;
}



@media ( min-width: 992px) {
   .container-slider-startseite {
    overflow: hidden;
    height: calc(50vw);
    width: 100%;
    height: calc(100vh - 110px);
    border: 0px solid red;
}




.container-slider-startseite .slick-initialized .slick-slide {
    outline: none;
    height:  calc(100vh);
    border: 1px solid red;
}

.container-slider-startseite .height100vh {
    outline: none;
    height:  calc(100vh);
    border: 1px solid red;
}

.start-slider-left { posttion: relative; padding-top: calc(100vh - 110px - 400px); }

.start-slider-right { posttion: relative; padding-top: calc(100vh - 110px - 500px); }