/* ==========================
   Navbar
========================== */

.navbar{
    padding:0;
    background:#fff;
}

.navbar-brand img{
    height:80px;
}

.navbar .nav-link{
    font-size:14px;
    font-weight:500;
    text-transform:uppercase;
    color:#222;
    padding:35px 12px;
    transition:.3s;
    font-family:'Montserrat', sans-serif;
}

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

/* ==========================
   Main Dropdown
========================== */

.dropdown{
    position:relative;
}

.dropdown-menu{
    display:none;
    min-width:280px;
    padding:8px 0;
    border:none;
    border-radius:10px;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    margin-top:0;
    animation:fadeDown .25s ease;
}

.dropdown:hover > .dropdown-menu{
    display:block;
}

/* ==========================
   Dropdown Items
========================== */

.dropdown-item{
    padding:12px 20px;
    font-size:13px;
    font-weight:500;
    color:black;
    transition:.3s;
    font-family: 'Montserrat', sans-serif;
    white-space:normal;
    text-transform: uppercase;
}

.dropdown-item:hover{
    background:#f8f8f8;
    color:#528300;
    padding-left:28px;
}

/* ==========================
   Submenu
========================== */

.dropdown-submenu{
    position:relative;
}

.dropdown-submenu > .dropdown-menu{
    position:absolute;
    top:0;
    left:100%;
    display:none;
    min-width:300px;
    border-radius:10px;
}

.dropdown-submenu:hover > .dropdown-menu{
    display:block;
}

/* Right Arrow */

.dropdown-submenu > .dropdown-toggle{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.dropdown-submenu > .dropdown-toggle::after{
    content:"\f105";
    font-family:"Font Awesome 6 Free";
    font-weight:900;
    border:none;
    margin-left:10px;
    font-size:12px;
}



/* ==========================
   Enquire Button
========================== */

.quote-btn{
    background:#528300;
    color:#fff;
    text-decoration:none;
    padding:12px 28px;
    border-radius:6px;
    font-size:14px;
    font-weight:600;
    transition:.3s;
}

.quote-btn:hover{
    background:#406800;
    color:#fff;
}

/* ==========================
   Toggle Button
========================== */

.navbar-toggler{
    border:none;
    box-shadow:none !important;
}

.navbar-toggler i{
    font-size:24px;
    color:#528300;
}

/* ==========================
   Offcanvas Mobile
========================== */

.offcanvas{
    width:320px !important;
}

.offcanvas-header{
    border-bottom:1px solid #eee;
}

.offcanvas .nav-link{
    padding:14px 0;
}

.offcanvas .dropdown-menu{
    display:none;
    box-shadow:none;
    border:none;
    padding-left:15px;
}

/* ==========================
   Animation
========================== */

@keyframes fadeDown{
    from{
        opacity:0;
        transform:translateY(10px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}
.navbar-nav .nav-item{
    margin:0 8px;
}
/* ==========================
   Mobile
========================== */

@media (max-width:991px){

    .dropdown-submenu > .dropdown-menu{
        display:none;
        position:static !important;
        left:auto !important;
        min-width:100%;
        box-shadow:none;
        border:none;
        padding-left:15px;
    }

    .dropdown-submenu.active > .dropdown-menu{
        display:block !important;
    }
    
    .dropdown-submenu:hover > .dropdown-menu{
        display:none;
    }

    .dropdown-submenu.active > .dropdown-menu{
        display:block !important;
    }
.nav-item.dropdown > .dropdown-menu{
    display:none !important;
}

.nav-item.dropdown > .dropdown-menu.show-mobile{
    display:block !important;
}


}

/* Products Arrow */
.products-toggle::after{
    display:inline-block !important;
    transition:transform .3s ease;
}



/* Submenu Arrow */
.dropdown-submenu > .dropdown-toggle::after{
    transition:transform .3s ease;
}

.dropdown-submenu:hover > .dropdown-toggle::after{
    transform:rotate(90deg);
}

.products-toggle::after,
.dropdown-submenu > .dropdown-toggle::after{
    transition:all .3s ease;
}



.dropdown-submenu.active > .dropdown-toggle::after{
    transform:rotate(90deg);
}

/* Desktop Only */
@media (min-width:992px){

    .dropdown:hover > .products-toggle::after{
        transform:rotate(180deg);
    }

    .dropdown-submenu:hover > .dropdown-toggle::after{
        transform:rotate(90deg);
    }

}

/* Mobile Only */
@media (max-width:991px){

    .products-toggle.active::after{
        transform:rotate(180deg);
    }

    .dropdown-submenu.active > .dropdown-toggle::after{
        transform:rotate(90deg);
    }

}