/* Analogous Mono version*/
/* #fff - #C0C0C0 - #005A28 - #184E3F - #107E73 */
/* rgba(0, 100, 0, 1) - rgba(192, 192, 192, 1) - rgba(0, 90, 40, 1) - rgba(24, 78, 63, 1) - rgba(16, 126, 115, 1) */
:root {
    --green_nl: rgba(90, 159, 28, 1); /*#5A9F1C*/
    --green_nl_light: rgba(114, 213, 21, 1); /*#72D515*/
    --green_nl_xlight: rgba(114, 213, 21, 0.1); /*#72D515*/
    --green_nl_dark: rgba(49, 92, 9, 1); /*#315C09*/
    --gray: rgba(100, 100, 100, 1); /*#646464*/
    --gray_dark: rgba(63, 63, 63, 1); /*#3F3F3F*/
    --gray_light: rgba(192, 192, 192, 1); /*#C0C0C0*/
    --gray_xlight: rgba(242, 242, 242, 1); /*#F2F2F2*/
}

body {
    background-color: #fff;
    color: var(--gray);
}

a {
    color: var(--gray_dark);
}

    a:hover {
        color: var(--green);
    }

/* Override Bootstrap */
.btn-primary {
    border-color: var(--green_nl_light) !important;
    background-color: var(--green_nl) !important;
    color: #fff;
}

    .btn-primary:hover,
    .btn-primary:focus,
    .btn-primary:active {
        border-color: var(--green_nl_dark) !important;
        background-color: var(--green_nl_light) !important;
        color: var(--gray_dark) !important;
    }

.btn-outline-primary {
    border-color: var(--green_nl) !important;
    color: var(--gray_dark) !important;
}

    .btn-outline-primary:hover,
    .tn-outline-primary:focus,
    .btn-outline-primary:active {
        background-color: var(--green_nl_light) !important;
    }

.btn-secondary {
    border-color: var(--gray_xlight) !important;
    background-color: var(--gray_light) !important;
    color: #fff;
}

    .btn-secondary:hover,
    .btn-secondary:focus,
    .btn-secondary:active {
        border-color: var(--gray_dark) !important;
        background-color: var(--gray_light) !important;
        color: var(--gray_dark) !important;
    }

.btn-outline-secondary {
    border-color: var(--gray) !important;
    color: var(--gray_dark) !important;
}

    .btn-outline-secondary:hover,
    .tn-outline-secondary:focus,
    .btn-outline-secondary:active {
        background-color: var(--gray_light) !important;
    }

.hr-gd {
    border: 1px solid var(--green_nl_dark);
}

.bg-xlight {
    background-color: var(--gray_xlight) !important;
}

.bg-gray-light {
    background-color: var(--gray_light) !important;
}

.bg-gray {
    background-color: var(--gray) !important;
}

.bold-light {
    font-weight: 500;
}

.form-control {
    border-color: var(--green_nl);
    color: var(--green_nl_dark);
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: var(--gray_light) !important;
}

::-moz-placeholder { /* Firefox 19+ */
    color: var(--gray_light) !important;
}

:-ms-input-placeholder { /* IE 10+ */
    color: var(--gray_light) !important;
}

:-moz-placeholder { /* Firefox 18- */
    color: var(--gray_light) !important;
}

.form-select {
    border-color: var(--green_nl);
    color: var(--green_nl_dark);
}


.nlGreen {
    color: olivedrab;
}

.hrGreen {
    display: block;
    height: 1px;
    border: 0;
    border-top: 8px solid var(--green_nl) !important;
    margin: 1em 0;
    padding: 0;
}

.hrDashed {
    border-top: 1px dashed var(--green_nl) !important;
}


/* #########################  HEADER ########################## */
/* TOP */
#top-nav-bar {
    background-color: var(--gray_dark);
    color: #fff;
}

.socialIcon a {
    color: #fff;
}

/* NAV TOP */
.navbar-light .navbar-nav .nav-link, .navbar-nav a, .navbar-nav a:hover {
    color: #fff;
}

.nav-top-log, .nav-top-log a, .nav-top-log a:hover {
    color: #fff;
}


/* scrollmark - Container that retract the nav by scrolling*/
.scrollmark {
    background-color: var(--gray_xlight);
}

.sm-nav-toggler-btn {
    background-color: transparent;
    border: 1px solid var(--gray_light);
    color: var(--gray);
}

.sm-search-toggler-btn {
    background-color: transparent;
    color: var(--gray);
}

#cartNbProductTxt {
    color: #000;
    background-color: var(--green_nl_light);
}

/* MAIN NAV */
#main-nav-bar {
    background-color: var(--gray);
    color: #fff;
    border-color: var(--gray);
}

    #main-nav-bar a {
        color: #fff;
    }

        #main-nav-bar a:hover, #main-nav-bar a:focus, #main-nav-bar a:active {
            color: #000;
            background-color: var(--gray_xlight);
        }

    #main-nav-bar .active-section {
        color: #000;
        background-color: #fff;
        border-bottom: 3px solid var(--green_nl_light);
    }

    #main-nav-bar .dropdown-menu, #main-nav-bar .dropdown-menu a {
        color: #fff;
        background-color: var(--gray);
        border-color: var(--gray_xlight);
    }

        #main-nav-bar .dropdown-menu a:hover, #main-nav-bar .dropdown-menu a:focus, #main-nav-bar .dropdown-menu a:active {
            color: #000;
            background-color: var(--gray_xlight);
            border-color: var(--gray_xlight);
        }

        #main-nav-bar .dropdown-menu .active-section-child {
            color: #000;
            background-color: var(--gray_xlight);
            border-bottom: 1px solid var(--green_nl_light);
        }


/* #########################  MODAL ########################## */
.modal-content {
    border: solid var(--green_nl_light);
}

#overlayFilter {
    background-color: var(--green_nl_xlight);
}

.Caret-right-fill, .Caret-down-fill {
    background-repeat: no-repeat;
    background-position: left;
}

.Caret-right-fill {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-caret-right-fill' viewBox='0 0 16 16'%3E%3Cpath d='m12.14 8.753-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z'/%3E%3C/svg%3E");
}

.Caret-down-fill {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-caret-down-fill' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");
}
/* #######  Mini Cart ####### */

.modal-miniCartResum {
    background-color: var(--gray_xlight);
    color: var(--gray_dark);
}


/* #########################  HOME ########################## */
.prod-list .product-wrap:hover {
    box-shadow: 0 4px 8px 0 var(--gray_xlight), 0 6px 20px 0 var(--gray_light);
}

#carouselNLHome .carousel-caption {
    background-color: var(--gray_xlight);
    color: var(--gray) !important;
}


/* #########################  PRODUCT SHEET ########################## */
.breadcrumb {
    background-color: #fff;
}
/* carousel */
.carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='Chartreuse' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='Chartreuse' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
}
/* shopping-area */
.shopping-area-wrapper {
    border-top: solid var(--green_nl_xlight);
}

    .shopping-area-wrapper .InCartShop {
        background-color: var(--gray_xlight);
    }

@media (min-width: 768px) {
    .shopping-area-wrapper {
        border-top: none;
    }
}
/* End shopping-area */

#product-other-details .description-txt {
    background-color: var(--gray_xlight);
}

/*   KITS  */
#changeItemWrapper .chosen-colour:hover {
    box-shadow: 0 4px 8px 0 var(--gray_xlight), 0 6px 20px 0 var(--gray_light);
}

/*   CART  */
.cart-kit-item {
    background-color: var(--gray_xlight);
    border-top: dashed thin var(--gray_light);
}

/* ######################################  GENERAL ########################## */
.advice {
    background-color: var(--green_nl_xlight);
}

.bi-info-circle {
    color: var(--green_nl_dark);
}

/* ######################################  CHECKOUT ########################## */
.sb-menu {
    margin-top: 1rem;
    margin-bottom: 2rem;
}

    .sb-menu .separator {
        color: var(--gray);
        font-weight: bold;
    }

    .sb-menu .sb-menu-item {
        padding: 0.2rem;
    }

    .sb-menu .actif {
        background-color: var(--green_nl);
        color: var(--gray_xlight);
    }

    .sb-menu .next {
        background-color: var(--gray_xlight);
        color: var(--gray_light);
    }

    .sb-menu .previous {
        background-color: var(--green_nl_xlight);
        color: var(--green_nl);
    }

@media (min-width: 768px) {
    .sb-menu .separator {
        font-size: 1.6rem;
    }

    .sb-menu .sb-menu-item {
        padding: 0.6rem;
    }
}

@media (min-width: 992px) {
    .sb-menu .separator {
        font-size: 2.3rem;
    }

    .sb-menu .sb-menu-item {
        padding: 1rem;
    }
}




/* ######################################  CHECKOUT ########################## */
.jsonAddress {
    background-color: var(--green_nl_xlight);
    color: var(--green_nl_dark);
    font-weight: bolder;
    padding: 1em;
}


footer {
    background-color: var(--gray_dark);
    color: #fff;
}

    footer a, footer a:hover {
        color: #fff;
    }
