/* DEFAULT THEME STYLES
**************************************************/
body {
    background: url('../images/tile.webp') repeat;
}
body, div, td {
    color: #5c5859;
}
.product {
    background: #edf1fa;
}
.product {
     border-color: #458718 !important;
 }
.product h3 a, .product p {
    color: #620866 !important;
}
div.product div.product_quantity_type {
    background: #d5f3e2 !important;
    border: solid 1px #ddd !important;
}
div.product div.product_quantity_type div.submit-product-form {
    background: #01642b !important;
    color: #fff !important;
    border: none !important;
}
#wrapper {
    border: 0;
    background: url('../images/shadow.webp') repeat-x;
}
/* FOOTER STYLES
**************************************************/
#container {
    background-image: url("../images/footer-grass.webp");
    background-repeat: repeat-x;
    background-position: bottom;
}
#footer {
    border-color: #5ab220;
    background: rgba(90,178,32,1);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(90,178,32,1)), color-stop(50%, rgba(68,131,25,1)), color-stop(100%, rgba(68,131,25,1)));
    background: -webkit-linear-gradient(top, rgba(90,178,32,1) 0%, rgba(68,131,25,1) 50%, rgba(68,131,25,1) 100%);
    background:    -moz-linear-gradient(top, rgba(90,178,32,1) 0%, rgba(68,131,25,1) 50%, rgba(68,131,25,1) 100%);
    background:      -o-linear-gradient(top, rgba(90,178,32,1) 0%, rgba(68,131,25,1) 50%, rgba(68,131,25,1) 100%);
    background:     -ms-linear-gradient(top, rgba(90,178,32,1) 0%, rgba(68,131,25,1) 50%, rgba(68,131,25,1) 100%);
    background:         linear-gradient(to bottom, rgba(90,178,32,1) 0%, rgba(68,131,25,1) 50%, rgba(68,131,25,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5ab220', endColorstr='#448319', GradientType=0 );
    color: #fff;


}
/* HEADER STYLES
**************************************************/
#header {
    background: url('../images/header.webp') center 35px no-repeat;
}
/* LOGO
**************************************************/
@media only screen and (max-width: 500px) {
    #header-bar-top #header_logo img {
        margin: 0 !important;
    }
}
#header-bar-top #header_logo {
    height: 120px;
}

/* HEADER BAR TOP STYLES
**************************************************/
#hbt-collapse .hbt-li input,
#hbt-collapse .hbt-li a {
    border-radius: 0;
}
#hbt-collapse .hbt-li .dropdown-menu,
#hbt-collapse .hbt-li a {
    background-color: #458718; /* MAIN COLOR*/
    color: #fff;
}
#hbt-collapse .hbt-li a:active,
#hbt-collapse .hbt-li a:focus,
#hbt-collapse .hbt-li a:hover {
    background-color: #620866; /* ACTIVE/HOVER COLOR*/
    border: 1px solid #458718; /* MAIN COLOR*/
    color: #fff;
    border-radius: 0 !important;
}
/* TOGGLE STYLES
**************************************************/
#header-bar-top .navbar-toggle.collapsed {
    background-color: #458718; /* MAIN COLOR*/
    border-color: #fff;
    color: #fff;
}
#header-bar-top .navbar-toggle,
#header-bar-top .navbar-toggle:active,
#header-bar-top .navbar-toggle:focus,
#header-bar-top .navbar-toggle:hover {
    background-color: #620866; /* ACTIVE/HOVER COLOR*/
    border-color: #458718; /* MAIN COLOR*/
    color: #458718; /* MAIN COLOR*/
}
/* MENU MEDIA STYLES
**************************************************/
@media only screen and (max-width: 768px) {
    #hbt-collapse .hbt-li input,
    #hbt-collapse .hbt-li a {
        border: 1px solid #620866; /* ACTIVE/HOVER COLOR*/
        border-radius: 0 !important;
    }
    #header-bar-top #hbt-collapse {
        background-color: #458718; /* MAIN COLOR*/
    }
    #menu ul.nav > li > a {
        margin-top: 5px;
        margin-right: 0 !important;
    }
    #menu li ul.dropdown-menu {
        border: 1px solid #620866; /* ACTIVE/HOVER COLOR*/
    }
}
/* MENU TOGGLE
**************************************************/
#menu .navbar-toggle {
    border-color: #fff;
}
#menu .navbar-toggle .icon-bar {
    background-color: #fff;
}
#menu .navbar-toggle:active .icon-bar,
#menu .navbar-toggle:focus .icon-bar,
#menu .navbar-toggle:hover .icon-bar {
    background-color: #458718; /* MAIN COLOR*/
}
#menu .navbar-toggle:active,
#menu .navbar-toggle:focus,
#menu .navbar-toggle:hover {
    background-color: #620866; /* ACTIVE/HOVER COLOR*/
    border-color: #458718; /* MAIN COLOR*/
}
#menu .navbar-collapse {
    border-color: #620866; /* ACTIVE/HOVER COLOR*/
}

/* MAIN MENU
**************************************************/
#menu {
    background-color: #458718; /* MAIN COLOR*/
    margin-bottom: 0;
}
/* ACTIVE/HOVER */
#menu ul.nav li.active a,
#menu ul.nav > li > a:active,
#menu ul.nav > li > a:focus,
#menu ul.nav > li > a:hover,
#menu a:active,
#menu a:focus,
#menu a:hover {
    background-color: #620866; /* ACTIVE/HOVER COLOR*/
}
/* SUB MENU
**************************************************/
#menu li ul.dropdown-menu li {
    border: 1px solid #458718; /* MAIN COLOR*/
    border-top: 0;
}
#menu li.active ul.dropdown-menu a,
#menu li:hover ul.dropdown-menu {
    background-color: #458718; /* MAIN COLOR*/
}
/* ACTIVE/HOVER */
#menu li.active ul.dropdown-menu li a:active,
#menu li.active ul.dropdown-menu li a:focus,
#menu li.active ul.dropdown-menu li a:hover,
#menu li ul.dropdown-menu li a:active,
#menu li ul.dropdown-menu li a:focus,
#menu li ul.dropdown-menu li a:hover,
#menu ul.dropdown-menu li.active a {
    background-color: #620866; /* ACTIVE/HOVER COLOR*/
}
/* MAIN BG COLOR */
#menu li.active ul.dropdown-menu li a,
#menu ul.dropdown-menu li a {
    background-color: #458718; /* MAIN COLOR*/
}
