/*-----------------------------------------------------------------------------------

    Template Name: Espone - eCommerce bootstrap template
    Template URI: http://bootexperts.com
    Description: Digital eCommerce bootstrap template
    Author: BootExperts
    Author URI: http://bootexperts.com
    Version: 1.0

-----------------------------------------------------------------------------------

    CSS INDEX
    ===================

    1. Theme default CSS
    2. Header
    3. Mainmenu area
    4. Slider area
    5. Single product
    6. Banner area
    7. Best seller area
    8. Testimonial area
    9. Tab product area
    10. Brand area
    11. Shop page
    12. Checkout page
    13. Blog page
    14. Single blog page
    15. Not found page
    16. Contact us
    17. My account
    18. Wishlist page
    19. Cart page
    20. Footer area
    21. Bact to top
-----------------------------------------------------------------------------------*/

/*======================================
    1. Theme default CSS
========================================*/

html,
body {
    height: 100%;
}
.floatleft {
    float: left
}
.floatright {
    float: right
}
.alignleft {
    float: left;
    margin-right: 15px;
    margin-bottom: 15px
}
.alignright {
    float: right;
    margin-left: 15px;
    margin-bottom: 15px
}
.aligncenter {
    display: block;
    margin: 0 auto 15px
}
a:focus {
    outline: 0px solid
}
img {
    max-width: 100%;
    height: auto
}
.fix {
    overflow: hidden
}
p {
    margin: 0 0 15px;
    color: #222;
    font-size: 14px;
    line-height: 24px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0 0 10px;
}
a {
    transition: all 0.3s ease 0s;
    text-decoration: none;
}
a:hover {
    color: #ec4445;
    text-decoration: none;
}
a:active,
a:hover {
    outline: 0 none;
}
a:focus {
    text-decoration: none;
}
ul {
    list-style: outside none none;
    margin: 0;
    padding: 0
}
.clear {
    clear: both
}
body {
    font-family: 'Poppins', sans-serif;
    background: #ffffff none repeat scroll 0 0;
    color: #444444;
    font-size: 12px;
    font-weight: 400;
}
::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}
::selection {
    background: #b3d4fc;
    text-shadow: none;
}
.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}
/* small mobile :1280px. */
@media (min-width: 1250px) {
    .container {
        width: 1200px;
    }
}
.margin-top {
    margin-top: 40px;
}
.bg-black {
    background: #474b4f;
}
.width-sty {
    width: 738px;
}
.width-fty {
    width: 500px;
}
.width-twety {
    width: 282px;
}
.red-border {
    border-bottom: 2px solid #7ac143;
}
.black-border {
    border-bottom: 2px solid #9096a8;
}
.mb-30 {
    margin-bottom: 30px;
}
.mb-0 {
    margin-bottom: 0;
}
.mb-10 {
    margin-bottom: 10px;
}
.mt-20 {
    margin-top: 20px;
}
.mt-10 {
    margin-top: 10px;
}
.mb-20 {
    margin-bottom: 20px;
}
.mb-30 {
    margin-bottom: 30px;
}
.mtb-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
/*==============================
    2. Header
================================*/
.language-currency {
    display: inline-block;
}
.form-language {
    border-left: 1px solid #e1e1e1;
}
.form-language,
.currency {
    border-right: 1px solid #e1e1e1;
    display: inline-block;
    padding: 10px 30px;
    position: relative;
    vertical-align: middle;
}
.language-currency .select-lang {
    cursor: pointer;
    line-height: 36px;
    text-transform: uppercase;
}
.language-currency .select-option {
    background: #ffffff none repeat scroll 0 0;
    border-top: 3px solid #7ac143;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.3);
    opacity: 0;
    padding: 5px 15px;
    position: absolute;
    right: 0;
    top: 56px;
    transform: scaleY(0);
    transition: all 0.5s ease-out 0s;
    z-index: 9999;
}
.form-language:hover .select-option,
.currency:hover .select-option {
    opacity: 1;
    transform: scaleY(1);
}
.language-currency li {
    border-bottom: 1px solid #e5e5e5;
    line-height: 40px;
}
.language-currency li a {
    color: #222;
    display: block;
    padding: 0 15px;
    white-space: nowrap;
}
.currency li a {
    text-transform: uppercase;
}
.language-currency li a:hover,
.language-currency li.active a {
    color: #7ac143;
}
.language-currency li:last-child {
    border-bottom: 0 none;
}
/*phone*/
.phone.welcome-msg {
    color: #7ac143;
    display: inline-block;
    line-height: 15px;
    padding: 10px 0 10px 30px;
}
.phone.welcome-msg label {
    color: #222;
    font-weight: 400;
    margin: 0 5px 0 0;
}
.header-top {
    border-bottom: 1px solid #e1e1e1;
    color: #222;
}
/*box right*/
.box-right {
    float: right;
}
.box-right > ul > li {
    border-right: 1px solid #e1e1e1;
    display: inline-block;
    vertical-align: middle;
    float: left;
}
.box-right > ul > li:first-chaild {
    border-left: 1px solid #e1e1e1;
    padding-left: 0 !important;
}
.box-right > ul > li > a {
    display: block;
    height: 57px;
    text-indent: -9999px;
    width: 80px;
    transition: none;
}
.box-right > ul > li > a.checkout {
    background: rgba(0, 0, 0, 0) url("img/icon/checkout.png") no-repeat scroll 50% 18px;
}
.box-right > ul > li > a.account {
    background: rgba(0, 0, 0, 0) url("img/icon/account.png") no-repeat scroll 50% 17px;
}
.box-right > ul > li > a.login {
    background: rgba(0, 0, 0, 0) url("img/icon/login.png") no-repeat scroll 50% 18px;
}
.box-right > ul > li > a.wishlist {
    background: rgba(0, 0, 0, 0) url("img/icon/wishlist.png") no-repeat scroll 50% 19px;
}
.box-right > ul > li a.catmenu {
    display: block;
    height: 57px;
    text-indent: -9999px;
    width: 80px;
    transition: none;
}
.box-right > ul > li a.catmenu {
    background: #7ac143 url("img/topcart/topcart.png") no-repeat scroll 50% 50%;
}
.box-right > ul > li a.catmenu:hover {
    background-position: 50% 50%;
}
.box-right > ul > li a.catmenu span.count-item {
    background: #f7941d none repeat scroll 0 0;
    border: 1px solid #ffffff;
    border-radius: 100%;
    color: #ffffff;
    height: 22px;
    line-height: 20px;
    position: absolute;
    right: 25px;
    text-align: center;
    text-indent: 0;
    top: 7px;
    width: 22px;
}
.cartbox-style-2 .top-cart-content {
    right: 0px;
    top: 100%;
}
.top-cart-area.cartbox-style-2.hm-3 {
    position: relative;
}
.top-cart-area.cartbox-style-2 {
    position: relative;
}
.box-right > ul > li > a:hover {
    background-position: 50% -115px;
}
.box-right > ul > li:first-child {
    border-left: 1px solid #e1e1e1;
}
/*=================================
    Header mid area
===================================*/

.header-mid-area {
    padding: 25px 0;
}
/*.logo-container {*/
/*    text-align: left;*/
/*}*/
/*.logo-container a.logo {*/
/*    display: inline-block;*/
/*    margin: 0;*/
/*    padding: 0;*/
/*    text-decoration: none !important;*/
/*}*/

.logo-container {
    text-align: left;
}

.logo-container a.logo {
    display: inline-block;
    margin: 0;
    padding: 0;
    text-decoration: none !important;
}

.logo-container a.logo img {
    max-width: 180px;   /* DESKTOP NORMAL SIZE */
    width: 100%;
    height: auto;
}

@media (max-width: 768px) {
    .logo-container a.logo img {
        max-width: 140px;  /* MOBILE SIZE */
    }
}









.header-bottom .quick-access {
    padding: 12px 0 11px;
    position: relative;
    text-align: right;
}
#search_mini_form {
    display: inline-block;
    vertical-align: middle;
}
.header-bottom .form-search {
    border: 2px solid #707070;
    border-radius: 25px;
    display: inline-block;
    margin: auto;
    position: relative;
}
.header-bottom .form-search input.input-text {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    color: #222;
    font-size: 12px;
    font-weight: 300;
    height: 40px;
    line-height: 22px;
    padding: 10px;
    width: 410px;
}
.header-bottom .form-search button.button {
    height: 40px;
    padding: 0;
    width: 40px;
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    cursor: pointer;
    margin: 0;
    overflow: visible;
    padding: 0;
    width: auto;
}
.button {
    color: #ffffff;
    cursor: pointer;
    display: inline-block;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
}
.header-bottom .form-search button.button span {
    font-size: 0;
    font-weight: normal;
    padding: 0;
    text-transform: uppercase;
}
button.button span {
    display: block;
}
.header-bottom .form-search button.button span span::before {
    color: #444;
    content: "\f002";
    display: block;
    font-family: FontAwesome;
    font-size: 14px;
    transition: 0.3s;
}
.header-bottom .form-search button.button:hover span span::before {
    color: #7ac143;
}
.header-bottom .form-search button.button span span {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    height: 40px;
    line-height: 40px;
    padding: 0px 13px;
    text-align: center;
}
input,
select,
textarea,
button {
    background: #fff none repeat scroll 0 0;
    border: 0 none;
    color: #2f2f2f;
    font-size: 14px;
    vertical-align: middle;
}
.form-search select {
    background: transparent none repeat scroll 0 0;
    color: #222;
    font-size: 12px;
    font-weight: 300;
    line-height: 19px;
    padding-left: 15px;
    text-shadow: none;
    text-transform: capitalize;
}
.form-search select option {
    padding: 3px 20px;
}
.add-to-cart-area {
    position: relative;
    text-align: right;
}
.top-cart-wrapper {
    background: #ce9345 none repeat scroll 0 0;
    cursor: pointer;
    display: inline-block;
    left: 0;
    position: absolute;
    top: -6px;
    vertical-align: middle;
}
.top-cart-title a {
    color: #fff;
    display: block;
    text-align: left;
}
.top-cart-title {
    background: rgba(0, 0, 0, 0) url("img/icon/topcart.png") no-repeat scroll 0 50%;
    font-size: 12px;
    margin-top: 0;
    padding-left: 50px;
    position: relative;
    text-align: center;
    vertical-align: top;
}
.top-cart-title a .title-cart {
    display: block;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    text-transform: uppercase;
}
.top-cart-contain .count-item {
    color: #fff;
    display: inline-block;
    font-size: 12px;
}
.top-cart-title .price {
    font-size: 12px;
}
.block-cart {
    display: inline-block;
    padding: 21px 15px;
    position: relative;
    width: 180px;
}
.top-cart-wrapper::before {
    border-color: transparent transparent #80551d #80551d;
    border-style: solid;
    border-width: 3px 4px 3px 5px;
    content: "";
    height: 6px;
    position: absolute;
    right: -9px;
    top: 0;
    width: 9px;
}
.top-cart-wrapper::after {
    border-color: #80551d transparent transparent #80551d;
    border-style: solid;
    border-width: 3px 5px 3px 4px;
    bottom: 0;
    content: "";
    height: 6px;
    position: absolute;
    right: -9px;
    width: 9px;
}
.top-cart-wrapper {
    background: #ce9345 none repeat scroll 0 0;
    cursor: pointer;
    display: inline-block;
    position: relative;
    right: 0;
}
.top-cart-content {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: #ffffff none repeat scroll 0 0;
    border-color: #7ac143 #e1e1e1 #e1e1e1;
    border-image: none;
    border-style: solid;
    border-width: 2px 1px 1px;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.3);
    opacity: 0;
    padding: 20px;
    position: absolute;
    right: 0;
    text-align: left;
    top: 100%;
    transform: scaleY(0);
    transform-origin: 0 0 0;
    transition: all 0.3s ease 0s;
    width: 290px;
    visibility: hidden;
    z-index: 99999999;
}
.block-cart:hover .top-cart-content,
.cartbox-style-2:hover .top-cart-content {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
}
ul,
ol {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.mini-products-list .product-image {
    float: left;
    width: 30%;
    display: block;
}
.mini-products-list li {
    display: block;
    margin-bottom: 15px;
    overflow: hidden;
    padding-bottom: 15px;
}
.product-details {
    float: left;
    padding: 0 0px 0 15px;
    width: 55%;
}
.pro-action {
    float: left;
    padding-top: 10px;
    text-align: right;
    width: 15%;
}
.cartproduct-name {
    line-height: 20px !important;
    margin: 5px 0;
}
.cartproduct-name a {
    font-weight: 500;
    font-size: 14px;
    color: #333;
}
.cartproduct-name a:hover {
    color: #7ac143;
}
strong.qty {
    color: #9d9d9d;
    display: block;
    font-size: 11px;
    font-weight: normal;
}
.sig-price {
    color: #7ac143;
    display: block;
    font-size: 15px;
    font-weight: 500;
    line-height: 24px;
}
.top-subtotal {
    border-bottom: 1px solid #e5e5e5;
    border-top: 1px solid #e5e5e5;
    color: #333333;
    font-size: 13px;
    margin: 15px 0 0;
    padding: 15px 10px;
    text-transform: capitalize;
}
.top-subtotal .sig-price {
    float: right;
}
.top-cart-content .cart-actions {
    margin: 20px 0 0;
    padding: 0;
}
.top-cart-content .cart-actions button {
    display: block;
    width: 100%;
    padding: 0;
}
.top-cart-content .cart-actions button span {
    background: #7ac143 none repeat scroll 0 0;
    border: 0 none;
    border-radius: 0;
    color: #ffffff;
    display: block;
    font-size: 14px;
    font-weight: 700;
    padding: 10px 25px;
    text-transform: uppercase;
    width: 100%;
    transition: 0.3s;
}
.top-cart-content .cart-actions button:hover span {
    background: #424242 none repeat scroll 0 0;
}
.btn-edit {
    background: rgba(0, 0, 0, 0) url("img/topcart/btn_edit.gif") no-repeat scroll 0 0;
    display: block;
    font-size: 0;
    height: 11px;
    line-height: 0;
    overflow: hidden;
    text-indent: -999em;
    width: 11px;
    float: right;
}
.btn-remove {
    background: #404040 url("img/topcart/btn_remove.png") no-repeat scroll 0 0;
    display: block;
    font-size: 0;
    height: 15px;
    line-height: 0;
    overflow: hidden;
    text-indent: -999em;
    width: 15px;
    float: right;
    margin-left: 3px;
}
.btn-remove:hover {
    background: #f10 url("img/topcart/btn_remove.png") no-repeat scroll 0 0;
}
/*================================
    3. Mainmenu area
==================================*/

.mainmenu {
    background: #262b32 none repeat scroll 0 0;
    max-height: 63px;
}
.header-menu > ul > li {
    display: inline-block;
    padding: 12px 0;
    position: relative;
}
.header-menu > ul > li.first {
    padding-left: 0;
}
.header-menu > ul > li.first > a {
    padding-left: 0;
}
.header-menu > ul > li > a {
    color: #fff;
    display: block;
    font-size: 14px;
    font-weight: 600;
    padding: 20px 19px;
    text-decoration: none;
    text-transform: uppercase;
    line-height: 19px;
}
.header-menu > ul > li > a i {
    padding-left: 5px;
}
.dropedown-menu {
    background: #ffffff none repeat scroll 0 0;
    left: 0;
    padding: 20px 0;
    position: absolute;
    top: 100%;
    width: 220px;
    border-top: 3px solid #7ac143;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transform: scaleY(0);
    transform-origin: 0 0 0;
    transition: all 0.4s ease 0s;
    z-index: 99999999;
}
.dropedown-menu li {
    display: block;
}
.dropedown-menu li a {
    display: block;
    padding: 10px 25px;
    color: #6a6a6a;
    font-size: 12px;
    line-height: 18px;
    padding: 10px 25px;
    font-weight: 600;
}
/*===============================
    3.1 Megamenu
=================================*/

.header-menu ul li .megamenu-wrap {
    background: #ffffff none repeat scroll 0 0;
    border-top: 3px solid #7ac143;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.3);
    left: 0;
    opacity: 0;
    position: absolute;
    top: 100%;
    transform: scaleY(0);
    transform-origin: 0 0 0;
    transition: all 0.4s ease 0s;
    z-index: 99999999;
    padding: 25px 0;
    visibility: hidden;
    text-align: left;
}
.header-menu ul li .megamenu-wrap.four-column {
    width: 900px;
}
.header-menu ul li .megamenu-wrap.three-column {
    width: 700px;
}
.header-menu ul li .megamenu-wrap.two-column {
    width: 500px;
}
.megamenu-wrap .mega-child {
    float: left;
    padding: 0 25px;
}
.megamenu-wrap.four-column .mega-child {
    width: 50%;
}
.megamenu-wrap.three-column .mega-child {
    width: 33.33%;
}
.megamenu-wrap.two-column .mega-child {
    width: 50%;
}
.header-menu ul li .megamenu-wrap a.mega-menu-title {
    color: #545454;
    font-size: 12px;
    font-weight: 700;
    line-height: 24px;
    padding-bottom: 15px;
    text-transform: uppercase;
}
.megamenu-wrap ul li a {
    padding: 10px 15px;
    color: #6a6a6a;
    display: block;
    font-size: 12px;
    line-height: 18px;
    text-decoration: none;
    text-transform: capitalize;
}
.header-menu > ul > li:hover .megamenu-wrap .mega-child > a {
    color: #ec4445;
}
.header-menu > ul > li:hover > a,
.megamenu-wrap ul li a:hover {
    color: #7ac143;
}
.dropedown-menu li a:hover {
    color: #ec4445;
}
.megamenu-wrap .mega-child li .mega-menu-title:hover {
    color: #ec4445;
}
/*menu hover animation*/
.header-menu > ul > li:hover .dropedown-menu,
.header-menu > ul > li:hover .megamenu-wrap {
    opacity: 1;
    transform: scaleY(1);
    visibility: visible;
}
/*====================================
    3.2 menu style 2
======================================*/

.menu-style-2 ul li a {
    color: #363636;
}
.menu-style-3 ul li a {
    color: #363636;
}
.header-menu.menu-style-3 {
    margin-top: 5px;
}
.home-3.main-menu-area {
    float: left;
    width: 120%;
}
.home-3.search-area-style-3 {
    float: left;
    width: 5%;
}
.header-menu.menu-style-3 ul li .megamenu-wrap.four-column {
    width: 550px;
}
.header-menu.menu-style-3 ul li .megamenu-wrap.three-column {
    width: 600px;
}
.headertop-style-3 {
    color: #9c9c9c;
}
.headertop-style-3 .phone.welcome-msg label {
    color: #9c9c9c;
}
.form-language.from-language-style-3 {
    border-left: 1px solid #2e3445;
}
.form-language.from-language-style-3,
.currency.currency-style-3 {
    border-right: 1px solid #2e3445;
}
.box-right-style-3 > ul > li {
    border-right: 1px solid #2e3445;
}
.box-right-style-3 > ul > li:first-child {
    border-left: 1px solid #2e3445;
}
/*header-mid-area home-3*/

.mainmenu-style-3 {
    background: none;
}
.mainmenu-style-3 {
    border-color: 0px solid #f9f9fa;
    font-size: 14px;
    position: relative;
    z-index: 111;
}
.mainmenu.mainmenu-style-3 .menu nav ul li a {
    color: #222;
}
.mainmenu.mainmenu-style-3 .menu nav ul li a span i {
    color: #222;
    font-size: 12px;
    margin-left: 10px;
    transition: all 0.3s ease 0s;
}
.mainmenu.mainmenu-style-3 .menu nav li:hover a,
.mainmenu.mainmenu-style-3 .menu ul li a:hover span i {
    color: #59627c;
}
.mainmenu.mainmenu-style-3 button.button span {
    color: #000;
}
.search-area-style-3 {
    position: relative;
}
.search-form {
    background: #eeeeee none repeat scroll 0 0;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.3);
    height: 40px;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 100%;
    transition: all 0.3s ease 0s;
    visibility: hidden;
    width: 250px;
    z-index: 9999;
}
.search-area-style-3:hover .search-form {
    opacity: 1;
    visibility: visible;
}
.search-form .input-search {
    background: #eeeeee none repeat scroll 0 0;
    float: left;
    height: 40px;
    padding: 5px 15px;
    width: 85%;
}
.search-form button {
    background: #ededed none repeat scroll 0 0;
    float: left;
    height: 40px;
    transition: all 0.3s ease 0s;
    width: 15%;
}
.search-form button:hover {
    background: #7ac143 none repeat scroll 0 0;
    color: #ffffff;
}
.search-area-style-3 {
    float: right;
    height: 40px;
    margin-top: 16px;
    padding: 10px;
    text-align: center;
    width: 40px;
    cursor: pointer;
}
.search-area-style-3 .search-icon i {
    font-size: 17px;
}
.mainmenu-style-3 .menu ul > li a {
    padding: 15px 10px !important;
}
.mainmenu-style-3 .search-icon input {
    background: #f8f8f8 none repeat scroll 0 0;
    line-height: 22px;
    opacity: 0;
    padding: 10px;
    position: absolute;
    right: 0;
    top: 27px;
    transition: all 0.3s ease 0s;
    width: 260px;
    visibility: hidden;
}
.mainmenu-style-3 .search-icon:hover input {
    opacity: 1;
    visibility: visible;
}
/*home-4*/
.mainmenu.mainmenu-style-4 {
    border-color: #f9f9fa;
    border-style: solid;
    border-width: 1px 0;
    padding: 0;
    background: none;
    max-height: 63px;
}
.mainmenu.mainmenu-style-4 ul li a {
    display: block;
    font-weight: 700;
    padding: 0 15px;
}
.mainmenu.mainmenu-style-4 .menu ul li a {
    color: #363636;
    line-height: 43px;
}
.form-search-style-4.form-search select {
    margin-top: 6px;
    float: left;
}
.mainmenu.menu-style-4 {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border-bottom: 1px solid #f9f9fa;
    border-top: 1px solid #f9f9fa;
    max-height: 67px;
}
.mainmenu.menu-style-4 .menu ul > li > a {
    color: #333333;
    padding: 14px 15px;
}
.mainmenu.menu-style-4 .menu ul > li:hover > a {
    color: #7ac143;
}
.mainmenu .menu ul > li:hover > a,
.menu nav ul > li:hover > a span i {
    color: #7ac143;
}
.mainmenu.menu-style-4 .menu ul > li:first-child > a {
    padding-left: 0;
}
/*header mid quick-access*/

.header-bottom.header-bottom-style-4 .quick-access {
    padding: 0;
    position: relative;
    text-align: right;
    margin-top: 10px;
}
.form-search select.form-search-style-4 {
    background: transparent none repeat scroll 0 0;
    color: #81878f;
    font-size: 12px;
    font-weight: 300;
    line-height: 19px;
    padding-left: 15px;
    text-shadow: none;
    text-transform: capitalize;
    float: left;
    width: 40%;
}
.header-bottom .form-search.form-search-style-4 input.input-text {
    width: 50%;
    float: left;
}
.header-bottom .form-search.form-search-style-4 {
    background: #f8f8f8 none repeat scroll 0 0;
    border: 1px solid #f6f7f7;
    border-radius: 25px;
    display: inline-block;
    margin: auto;
    position: relative;
}
.header-bottom .form-search.form-search-style-4 input.input-text {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    color: #81878f;
    font-size: 12px;
    font-weight: 300;
    height: 40px;
    line-height: 22px;
    padding: 10px;
    width: 156px;
}

.dropdown-menu {
    display: none;
}

.dropdown:hover .dropdown-menu {
    display: block;
}


.dropdown-menu {
    min-width: 260px;
}

.dropdown-menu li a {
    padding: 10px 16px;
    font-size: 14px;
    white-space: nowrap;
}
/*==============================
    4. Slider area
================================*/

.slider-area {
    margin: 30px 0 30px;
    min-height: 130px;
    position: relative;
}
.slider-area.slider-style3 {
    margin: 0 0 0 0;
}
.slider-content {
    padding: 0 80px;
}
.slider-1 .title1 {
    color: #ffffff;
    font-size: 70px;
    line-height: 70px;
    font-weight: 700;
    text-transform: uppercase;
    -webkit-animation: 0.8s ease-in-out 1s normal backwards 1 running fadeInLeft;
    animation: 0.8s ease-in-out 1s normal backwards 1 running fadeInLeft;
}
.slider-1 .title2 {
    font-size: 24px;
    font-weight: 300;
    margin: 20px 0;
    -webkit-animation: 1.5s ease-in-out 1s normal backwards 1 running fadeInLeft;
    animation: 1.5s ease-in-out 1s normal backwards 1 running fadeInLeft;
}
.read-more {
    margin-top: 50px;
    -webkit-animation: 2s ease-in-out 1s normal backwards 1 running fadeInLeft;
    animation: 2s ease-in-out 1s normal backwards 1 running fadeInLeft;
}
.read-more a.button {
    border: 2px solid #ffffff;
    border-radius: 30px;
    color: #ffffff;
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 2px;
    line-height: 42px;
    text-decoration: none;
    text-transform: uppercase;
}
.read-more a.button:hover {
    border-color: #7ac143;
    color: #7ac143;
}
.slider-2 .title1 {
    color: #fff;
    font-size: 48px;
    font-family: Poppins;
    font-size: 72px;
    font-weight: 800;
    text-transform: uppercase;
    -webkit-animation: 0.8s ease-in-out 1s normal backwards 1 running fadeInRight;
    animation: 0.8s ease-in-out 1s normal backwards 1 running fadeInRight;
}
.slider-2 .title3 {
    font-size: 24px;
    font-weight: 300;
    margin: 20px 0;
    -webkit-animation: 1.5s ease-in-out 1s normal backwards 1 running fadeInLeft;
    animation: 1.5s ease-in-out 1s normal backwards 1 running fadeInLeft;
}
/*======================================
    5. Single product
========================================*/

.section-title h2 {
    background: #7ac143 none repeat scroll 0 0;
}
.section-title h2 {
    color: #fff;
    display: block;
    font-size: 18px;
    font-weight: 700;
    line-height: 41px;
    margin: 0;
    padding: 0 25px;
    position: relative;
    text-transform: uppercase;
}
.section-title h2::before {
    border-color: transparent transparent transparent #fff;
    border-style: solid;
    border-width: 6px 0 6px 6px;
    content: "";
    display: block;
    left: 0;
    margin-top: -6px;
    position: absolute;
    top: 50%;
}
.item-inner {
    margin-top: 35px;
}
.item-inner {
    padding: 5px;
}
.item-inner {
    border: 1px solid #fafafa;
    margin-bottom: 1px;
    padding: 3px;
    position: relative;
    text-align: center;
}
.item-inner .img-container {
    position: relative;
}
.item-inner .img-container::before {
    background: rgb(36 170 89 / 27%) none repeat scroll 0 0;
    bottom: 0;
    content: "";
    display: block;
    pointer-events: none;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: all 0.3s ease-out 0s;
}
.single-product:hover .img-container::before {
    opacity: 1;
}
.product-image {
    display: block;
}
.product-image img {
    width: 100%;
}
.item-inner button.btn-cart {
    float: none;
}
.item-inne .actions {
    bottom: 7px;
    opacity: 0;
    position: absolute;
    right: 7px;
    transition: all 0.3s ease 0s;
    visibility: hidden;
    z-index: 999;
}
/*------
.actions
--------*/

.actions {
    bottom: 7px;
    opacity: 0;
    position: absolute;
    right: 7px;
    transition: all 0.3s ease 0s;
    visibility: hidden;
    z-index: 999;
}
.single-product:hover .actions {
    opacity: 1;
    visibility: visible;
}
.actions a.add-to-cart,
.actions a.wishlist {
    border: 0 none;
    border-radius: 100%;
    color: #000;
    display: block;
    font-size: 0;
    height: 40px;
    line-height: 0;
    padding: 0;
    text-align: center;
    transform: translateY(110px);
    width: 40px;
}
.actions a.add-to-cart {
    background: #fff url("img/action/icon_cart.png") no-repeat scroll 0 0;
}
.actions a.wishlist {
    background: #fff url("img/action/icon_wishlist.png") no-repeat scroll 0 0;
}
.actions a.compare {
    background: #fff url("img/action/icon_compare.png") no-repeat scroll 0 0;
    transform: translateY(70px);
}
.actions a.quick-view {
    background: #fff url("img/action/icon_quickview.png") no-repeat scroll 0 0;
    transform: translateY(50px);
}
.actions a {
    border-radius: 100%;
    color: #000;
    display: block;
    float: none;
    font-size: 0;
    height: 40px;
    line-height: 0;
    text-align: center;
    width: 40px;
    display: block;
    margin-top: 7px;
}
.actions a:hover {
    background-color: #7ac143;
    background-position: 0 100%;
}
.single-product:hover .actions a {
    transform: translateY(0px);
}
/*=============
col-md-3
==============*/

.single-product-owl-active .col-md-3,
.feature-area-owl-active .col-md-3,
.single-product-owl-active-home-3 .col-md-3,
.bestseller-owl-active-home-3 .col-md-3,
.bestseller-owl-active-style-4 .col-md-3,
.hot-product-style-4-owl-active .col-md-6 {
    width: 100%;
}
.single-product-owl-active.indicator-style-1.owl-theme .owl-controls .owl-buttons div:hover {
    border-color: #000;
    color: #000;
}
.images-container {
    position: relative;
    overflow: hidden;
}
.timer-grid {
    overflow: hidden;
}
.timer-grid .box-time-date {
    border: 1px solid #7ac143;
    color: #ffffff;
    display: inline-block;
    font-size: 10px;
    font-weight: 400;
    margin: 10px 1px 0;
    padding: 2px;
    text-align: center;
    text-transform: uppercase;
    vertical-align: middle;
}
.timer-grid .box-time-date .box-time-date-inner {
    background: #7ac143 none repeat scroll 0 0;
    height: 56px;
    padding-top: 7px;
    width: 53px;
}
.timer-grid .box-time-date.sec {
    margin-right: 0;
}
.timer-grid .box-time-date span {
    display: block;
    font-family: Poppins;
    font-size: 17px;
    font-weight: 500;
    margin-bottom: 4px;
    position: relative;
}
.timer-grid .box-time-date span::after {
    background: #dd4243 none repeat scroll 0 0;
    bottom: 0;
    content: "";
    display: inline-block;
    height: 1px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    width: 27px;
}
.timer-grid .box-time-date span b {
    font-family: Poppins;
    font-weight: 400;
}
.ma-timer-container .ma-desc {
    border-top: 1px solid #dddddd;
    color: #a3a3a3;
    margin: 15px 0;
    padding-top: 30px;
}
.timer-grid {
    color: #000000;
    height: 100%;
}
.timer-list {
    color: #000000;
    float: left;
    font-family: arial;
    font-size: 18px;
    font-weight: bold;
    padding: 0;
    width: 100%;
}
.timer-view {
    color: #000000;
    float: left;
    font-family: arial;
    font-size: 40px;
    font-weight: bold;
    padding: 2px 0 0;
    width: 100%;
}
.timer-view {
    margin-bottom: 20px;
    overflow: hidden;
}
.timer-view .box-time-date {
    border: 1px solid #7ac143;
    color: #ffffff;
    display: inline-block;
    font-size: 10px;
    font-weight: 400;
    margin: 10px 7px 0 0;
    padding: 2px;
    text-align: center;
    text-transform: uppercase;
    vertical-align: middle;
}
.timer-view .box-time-date .box-time-date-inner {
    background: #7ac143 none repeat scroll 0 0;
    height: 56px;
    padding-top: 7px;
    width: 53px;
}
.timer-view .box-time-date.sec {
    margin-right: 0;
}
.timer-view .box-time-date span {
    display: block;
    font-family: Poppins;
    font-size: 17px;
    font-weight: 500;
    margin-bottom: 4px;
    position: relative;
}
.timer-view .box-time-date span::after {
    background: #dd4243 none repeat scroll 0 0;
    bottom: 0;
    content: "";
    display: inline-block;
    height: 1px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    width: 27px;
}
.timer-view .box-time-date span b {
    font-family: Poppins;
    font-weight: 400;
}
.timer_product .images-container img {
    border: 1px solid #e1e1e1;
    border-radius: 5px;
}
.timer_product .product-image img {
    margin: 0 auto;
}
.static-timer {
    position: relative;
}
.static-timer .text {
    font-family: Poppins;
    left: 50px;
    margin-top: -67px;
    position: absolute;
    top: 50%;
}
.static-timer .text h1 {
    color: #ff5555;
    font-size: 47px;
    font-weight: 700;
    margin: 0;
    text-transform: uppercase;
}
.static-timer .text h2 {
    color: #ffffff;
    font-size: 30px;
    font-weight: 700;
    margin: 0;
    text-transform: uppercase;
}
.static-timer .text h3 {
    color: #7ac143;
    font-size: 24px;
    font-weight: 700;
    margin: 0;
    text-transform: uppercase;
}
/*home-3*/

.time-container-area {
    margin: 0px 0px 30px;
}
.hot-deals-style-3 .section-title h2:before {
    display: none;
}
.hot-deals-style-3 .section-title h2 {
    background: #ececec;
    color: #7ac143;
}
.modul-title.modal-title-style-3 h2 {
    padding: 0 25px;
}
.before-style-3 .modul-title h2:before,
.before-style-3 .modul-title2 h2:before {
    display: none;
}
.before-style-3 .modul-title h2,
.before-style-3 .modul-title2 h2 {
    background: #ececec;
    color: #59627c;
}
/*home-4*/

.hot-deals-area-style-4 .section-title h2:before {
    display: none;
}
.hot-deals-area-style-4 h2 {
    padding: 0 4px;
}
.single-product .item-inner.item-inner.item-inner-style-4 .images-container {
    border: 1px solid #fafafa;
    margin-bottom: 1px;
    padding: 3px;
    position: relative;
    text-align: center;
    float: left;
    padding: 3px;
    width: 40%;
}
.hot-product-style-4-owl-active {
    margin-bottom: 40px;
}
.single-product .item-inner.item-inner-style-4 .des-container {
    float: left;
    padding-left: 30px;
    text-align: left;
    width: 60%
}
.single-product .item-inner.item-inner-style-4 .img-container {
    width: 40%;
    float: left;
}
.single-product .item-inner.item-inner-style-4 {
    border: 0 none;
    overflow: hidden;
    margin-top: 35px;
}
/*10. single-product page*/

.product-shop .des-container.des-container-2 h2 a {
    color: #3f3f3f;
    font-size: 24px;
}
.price-rt {
    overflow: hidden;
    position: relative;
}
.ratings .separator {
    margin: 0px 3px;
    color: #b9b9b9;
}
.product-shop .availability {
    margin: 10px 0;
    font-size: 12px;
}
.product-shop .availability span {
    color: #7ac143;
}
.product-shop .short-description {
    border-bottom: 1px solid #e5e5e5;
    border-top: 1px solid #e5e5e5;
    color: #777;
    line-height: 23px;
    margin: 15px 0;
    padding: 15px 0;
}

.product-shop .short-description pre {
    background-color: white;
    font-family: 'Poppins', sans-serif;
    border:0px;
    font-weight: 400;
    color: #777;
}

.add-to-cart label {
    color: #000;
    float: left;
    font-family: arial;
    font-size: 12px;
    font-weight: 400;
    line-height: 38px;
    margin: 3px 10px 0 0;
}
.add-to-cart .text-input {
    border: 1px solid #ddd;
    border-radius: 100%;
    color: #777;
    float: left;
    font-size: 14px;
    font-weight: 700;
    height: 35px;
    padding: 9px 0;
    text-align: center;
    width: 35px !important;
    margin-top: 5px;
}
.add-to-cart {
    margin-top: 12px;
    overflow: hidden;
}
.add-to-cart button.button {
    float: left;
    margin-left: 10px;
}
.product-shop button.btn-cart:hover span span {
    background-position: 25px -61px;
    color: #7ac143;
}
.product-shop button.btn-cart span span {
    background: rgba(0, 0, 0, 0) url("img/icon/icon_cart_list.png") no-repeat scroll 25px 7px;
    color: #777;
    font-weight: 600;
    padding-left: 55px;
    transition: 0.3s;
}
button.button span span {
    border: 2px solid #f2f2f2;
    border-radius: 20px;
    color: #3f3f3f;
    display: block;
    font-size: 11px;
    font-weight: 700;
    line-height: 40px;
    padding: 0 30px;
    text-transform: uppercase;
    height: 40px;
    transition: 0.3s;
}
button.button:hover span span {
    border-color: #7ac143;
    color: #7ac143;
}
.add-to-box-cart {
    margin: 15px 0px;
}
.add-to-cart .button {
    color: #ffffff;
    cursor: pointer;
    display: inline-block;
    padding: 3px 4px;
    text-align: center;
    text-decoration: none;
}
.add-to-box {
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
    margin: 15px 0;
    padding: 15px 0;
}
/*relatedslider-container*/

.relatedslider-container {
    border: 0 none;
    padding: 0 0 20px;
}
.relatedslider-container .related-product-title h2 {
    color: #444;
    display: block;
    font-size: 18px;
    font-weight: 700;
    line-height: 30px;
    margin: 0;
    text-transform: uppercase;
}
.relatedslider-container .related-product-title h2::after {
    background: #7ac143 none repeat scroll 0 0;
    content: "";
    display: block;
    height: 3px;
    width: 40px;
}
#gallery_01 img,
img#zoom_03 {
    border: 1px solid #ccc;
}
.input-box span {
    display: block;
    margin-bottom: 5px
}
.p-c {
    margin: 10px 3px 10px 0;
}
.indicator-style-5.owl-theme .owl-controls .owl-buttons div {
    border: 1px solid #d4d4d4;
    border-radius: 100%;
    color: #d4d4d4;
    display: block;
    height: 26px;
    line-height: 19px;
    margin-top: -13px;
    opacity: 0;
    position: absolute;
    text-decoration: none;
    top: 50%;
    width: 26px;
    z-index: 1;
    transition: 0.3s;
}
.indicator-style-5.owl-theme .owl-controls .owl-buttons div:hover {
    border: 1px solid #7ac143;
    color: #7ac143;
}
.indicator-style-5.owl-theme .owl-controls .owl-buttons .owl-prev {
    left: 0px;
    transition: 0.3s;
}
.indicator-style-5.owl-theme:hover .owl-controls .owl-buttons .owl-prev {
    left: -13px;
}
.indicator-style-5.owl-theme .owl-controls .owl-buttons .owl-next {
    right: 0px;
}
.indicator-style-5.owl-theme:hover .owl-controls .owl-buttons .owl-next {
    right: -13px;
}
.indicator-style-5.owl-theme:hover .owl-controls .owl-buttons div {
    opacity: 1;
}
.product-menu {
    margin-top: 30px;
}
.single-product-tablist {
    border-bottom: 1px solid #f8f8f8;
    overflow: hidden;
    position: relative;
}
.single-product-tablist li.first {
    margin-left: 0;
}
.single-product-tablist li {
    display: inline-block;
    margin: 0 0 0 35px;
}
.single-product-tablist a {
    color: #999;
    display: block;
    font-size: 14px;
    font-weight: 700;
    line-height: 40px;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
}
.single-product-tablist li a::after {
    background: #7ac143 none repeat scroll 0 0;
    bottom: -1px;
    content: "";
    display: block;
    height: 3px;
    left: 0;
    position: absolute;
    transition: all 0.3s ease-out 0s;
    width: 0;
}
.single-product-tablist a:hover::after,
.single-product-tablist li.active a::after,
.single-product-tablist li.active a:hover::after {
    width: 100%;
}
.single-product-tablist a:hover,
.single-product-tablist li.active a,
.single-product-tablistli.active a:hover {
    border-color: #7ac143;
    color: #7ac143;
    text-decoration: none;
}
.product-list {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #f8f8f8;
    margin-top: 40px;
    overflow: hidden;
    padding: 20px;
}
.product-list p {
    font-size: 12px;
    color: #959595;
    line-height: 26px;
}
.actions-2.tag-style-3 {
    margin-top: 15px;
}
.review-col1 h2 {
    font-size: 18px;
}
.product-view .box-reviews dl {
    margin: 15px 0;
}
.form-add-style {
    margin: 15px 0 0;
}
.form-add-style h2 {
    font-size: 18px;
    font-weight: normal;
}
.form-add-style h4 {
    font-size: 12px;
}
.data-table {
    display: block;
}
.data-table thead th {
    background: #363636 none repeat scroll 0 0;
    border: 0 none;
    color: #fff;
}
.data-table thead th {
    border-bottom: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
    color: #000;
    font-size: 13px;
    font-weight: normal;
    padding: 10px;
    text-align: center;
    text-transform: capitalize;
    vertical-align: middle;
    white-space: nowrap;
}
.data-table th {
    font-weight: 400;
    padding: 6px 10px;
}
.data-table tbody th,
.data-table tbody td {
    border-bottom: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
    vertical-align: middle;
}
.data-table th {
    font-weight: 400;
    padding: 6px 10px;
}
.data-table tbody th,
.data-table tbody td {
    border-bottom: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
    vertical-align: middle;
}
/*====================================
    6. Banner area
======================================*/

.banner-area {
    margin-bottom: 30px;
}
.banner-box a {
    position: relative;
    display: block;
}
.banner-box a::before {
    background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: all 0.3s ease 0s;
    width: 100%;
}
.banner-box a:hover::before {
    opacity: 1;
}
.item-inner {
    margin-top: 35px;
}
.single-item .item-inner .images-container a {
    position: relative;
}
.single-item .item-inner .images-container a::before {
    background: rgba(244, 92, 93, 0.2) none repeat scroll 0 0;
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    transition: all 0.3s ease-out 0s;
}
.single-item .item-inner .images-container img {
    transition: all 0.3s ease-out 0s;
}
.single-item .item-inner .images-container:hover img {
    opacity: 0.7;
}
#fp:hover img{
    opacity: 0.3;
}
.single-item .item-inner .des-container {
    padding: 0 0 10px;
    margin-top: 15px;
    position: relative;
}
.single-item .item-inner .des-container .title-blog {
    color: #383838;
    display: block;
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 10px;
    text-transform: uppercase;
}
.single-item .item-inner .des-container .title-blog:hover {
    color: #7ac143;
}
.single-item .date-comments {
    color: #7ac143;
    font-family: Arial;
    font-size: 12px;
    font-weight: 400;
    margin: 20px 0;
    overflow: hidden;
    text-transform: capitalize;
}
.single-item .date-comments .time {
    border-right: 1px solid #f5f5f5;
    display: inline-block;
    margin-right: 10px;
    padding-right: 10px;
}
.single-item .date-comments .author {
    display: inline-block;
}
.single-item .des-container .des {
    color: #222;
    font-family: "Poppins", sans-serif;
    font-size: 13px;
    font-style: italic;
    line-height: 25px;
    margin: 10px 0;
}
.single-blog-area-owl .col-md-4 {
    width: 100%;
}

.single-blog-area-owl .col-md-3 {
    width: 100%;
}
/*home-4 */

.banner-style-4 {
    min-height: 130px;
    position: relative;
}
.banner-style-4 .banner-box {
    margin-bottom: 30px;
}
.banner-style-4 .banner-box.mb-0 {
    margin-bottom: 0px;
}
/*==================================
    7. Best seller area
====================================*/

.bestsellerproductslider-area {
    border: 0 none;
    margin-bottom: 30px;
    padding: 0;
    position: relative;
}
.modul-title {
    background: #ececec none repeat scroll 0 0;
}
.modul-title.modul-title-style-1 h2 {
    padding: 0px 25px;
}
.modul-title2.modul-title-style-1 h2 {
    padding: 0px 25px;
}
.modul-title h2 {
    background: #424242 none repeat scroll 0 0;
    color: #fff;
    display: inline-block;
    font-size: 18px;
    font-weight: 700;
    line-height: 41px;
    margin: 0;
    min-width: 230px;
    padding: 0 25px;
    position: relative;
    text-transform: uppercase;
}
.modul-title h2::before {
    border-color: transparent transparent transparent #fff;
    border-style: solid;
    border-width: 6px 0 6px 6px;
    content: "";
    display: block;
    left: 0;
    margin-top: -6px;
    position: absolute;
    top: 50%;
}
.bestseller-owl-active .col-md-4 {
    width: 100%;
}
.indicator-style-1.owl-theme .owl-controls .owl-buttons div {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #222;
    border-radius: 100%;
    color: #222;
    font-size: 15px;
    height: 25px;
    line-height: 17px;
    opacity: 0.8;
    position: absolute;
    right: 15px;
    text-align: center;
    top: -38px;
    transition: all 0.3s ease 0s;
    width: 25px;
    z-index: 1;
}
.testimonial-sidebar .indicator-style-1.owl-theme .owl-controls .owl-buttons div, .hot-deals-area .indicator-style-1.owl-theme .owl-controls .owl-buttons div {
  border: 1px solid #fff;
  color: #fff;
}
.indicator-style-1.owl-theme .owl-controls .owl-buttons .owl-prev {
    right: 45px;
}
.indicator-style-1.owl-theme .owl-controls .owl-buttons div:hover {
    border-color: #7ac143;
    color: #7ac143;
}
/*des-container*/

.single-product .item-inner {
    border: 1px solid #fafafa;
    margin-bottom: 1px;
    padding: 3px;
    position: relative;
    text-align: center;
}
.item-inner .des-container {
    padding: 0 0 10px;
}
.item-inner .product-name {
    margin: 15px 0 10px;
    font-weight: 500;
}
.product-name a {
    color: #3f3f3f;
    font-size: 12px;
    text-decoration: none;
    text-transform: capitalize;
}
.wishlist-table .product-name a {
    font-weight: 600px;
}
.product-name a:hover {
    color: #7ac143;
    text-decoration: none;
}
.price-box {
    margin: 5px 0;
}
.price-box .price {
    color: #7ac143;
    font-family: Poppins;
    font-size: 14px;
    font-weight: 700;
}
.ratings {
    line-height: 1.25;
    margin: 8px 0;
}
.ratings .rating-box {
    display: inline-block;
    text-align: center;
}
.rating-box ul li.yes i {
    color: #ffa200;
}
.rating-box ul li {
    display: inline-block;
}
.rating-box ul li i {
    color: #a6a6a6;
}
.banner-area-2 {

}
.banner-area-2.mb-0.mt-20 {
  margin-top: 30px;
}
/*===================================
    8. Testimonial area
=====================================*/

.testimonial-sidebar {
    margin: 50px 0;
}
.modul-title2 h2::before {
    border-color: transparent transparent transparent #fff;
    border-style: solid;
    border-width: 6px 0 6px 6px;
    content: "";
    display: block;
    left: 0;
    margin-top: -6px;
    position: absolute;
    top: 50%;
}
.modul-title2 h2 {
    background: #424242 none repeat scroll 0 0;
    color: #fff;
    display: block;
    font-size: 18px;
    font-weight: 700;
    line-height: 41px;
    margin: 0;
    padding: 0 25px;
    position: relative;
    text-transform: uppercase;
}
.testimonial-sidebar .testimonial-content {
    padding: 30px 0px 0px;
}
.testimonial-list {
    border: 1px solid #fafafa;
}
.testimonial-sidebar-content {
  text-align: center;
}
.testimonial-list .content {
    min-height: 50px;
}
.testimonial-content-avatar {
    margin-bottom: 20px;
}
.testimonial-sidebar-content .testimonial-content-avatar img {
    border-radius: 100%;
    width: 100px;
}
.testimonial-list .des-container {
    padding: 15px;
}
.testimonial-list .content a {
    color: #262b32;
    font-size: 12px;
    font-style: italic;
    line-height: 23px;
}
.testimonial-list .content .box-author {
    margin-top: 15px;
}
.testimonial-author {
    color: #363636;
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    padding-right: 5px;
    text-transform: uppercase;
}
.testimonial-date {
    color: #363636;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
}
/*===================================
    9. Tab product area
=====================================*/

.tab-container {
    background: #424242 none repeat scroll 0 0;
    color: #fff;
    display: block;
    font-size: 18px;
    font-weight: 700;
    line-height: 41px;
    margin: 0;
    padding: 13px 15px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
}
.tab-container::before {
    border-color: transparent transparent transparent #fff;
    border-style: solid;
    border-width: 6px 0 6px 6px;
    content: "";
    display: block;
    left: 0;
    margin-top: -6px;
    position: absolute;
    top: 50%;
}
ul.tab-menu {
    list-style: outside none none;
    width: 100%;
}
ul.tab-menu li {
    border-right: 2px solid #585858;
    display: inline-block;
    float: left;
    transition: all 0.3s ease 0s;
    width: 50%;
}
ul.tab-menu li a {
    display: block;
    font-size: 14px;
    font-weight: 700;
    line-height: 17px;
    text-transform: uppercase;
    color: #fff;
    text-decoration: none;
}
ul.tab-menu li a:hover {
    color: #7ac143;
}
ul.tab-menu li:last-child {
    border: medium none;
}
.tab-container ul.tab-menu li.active a {
    color: #7ac143;
}
.tab-single-item {
    margin: 30px 0;
    overflow: hidden;
}
.tab-single-item .images-container {
    float: left;
    width: 50%;
}
.pro-img {
    display: block;
}
.item-container:hover .images-container a {
    border-color: #7ac143;
}
.tab-single-item .des-container {
    float: left;
    padding: 16px 8px;
    width: 50%;
}
.tab-single-item .product-name {
    margin: 0 0 5px;
    font-weight: 500;
}
.des-containe .price-box span {
    display: inline-block;
}
.des-container .product-name a {
    color: #3f3f3f;
    font-size: 12px;
    text-decoration: none;
    text-transform: capitalize;
    font-size: 12px;
    display: block;
}
.product-name a:hover {
    color: #7ac143;
    text-decoration: none;
}
.des-container .price-box {
    margin: 13px 0;
}
.price-box span.new-price {
    color: #7ac143;
    font-family: Poppins;
    font-size: 14px;
    font-weight: 700;
}
.price-box span.old-price {
    color: #838383;
    font-weight: 400;
    text-decoration: line-through;
}
.rating ul li {
    display: inline-block;
    margin: 0 1px;
}
.rating ul {
    margin-top: 14px;
}
.rating ul li.yes {
    color: #ffa200;
}
.rating ul li {
    color: #838383;
}
.tab-single-item .images-container a {
    border: 1px solid #fafafa;
    padding: 3px;
}
.tab-single-item:hover .images-container a {
    border-color: #7ac143;
}
/*Tooltip */

.tooltip > .tooltip-inner {
    background-color: #000;
    border-radius: 3px;
    padding: 6px 5px;
    min-width: 80px;
}
.tooltip-arrow,
.tooltip.top .tooltip-arrow {
    border-top-color: #000;
}
.modul-title {
    background: #ececec none repeat scroll 0 0;
}
.single-Sale-products .col-md-3 {
    width: 100%;
}
/*==home-2 ==*/

.hm-2.box-right ul li:last-child {
    border-right: 0 none;
}
.tab-container-owl-active .col-md-3 {
    width: 100%;
}
#producttabs .item::before {
    border-color: #414141 transparent transparent;
    border-style: solid;
    border-width: 5px 5px 0;
    bottom: -5px;
    content: "";
    display: block;
    height: 5px;
    left: 50%;
    margin-left: -5px;
    opacity: 0;
    position: absolute;
    transition: all 0.3s ease-out 0s;
    width: 10px;
}
#producttabs .item {
    display: inline-block;
    position: relative;
    width: 25%;
    float: left;
}
.tab-producttable-area {
    background: #ececec none repeat scroll 0 0;
    color: #414141;
    display: block;
    margin: 0;
    position: relative;
    text-align: center;
    text-transform: uppercase;
}
#producttabs .item:hover::before,
#producttabs .item.active::before {
    opacity: 1;
}
#producttabs .item a {
    display: block;
    text-decoration: none;
}
#producttabs .item a h3 {
    color: #000;
    font-size: 13px;
    font-weight: 700;
    height: 40px;
    line-height: 40px;
    margin: 0;
}
#producttabs .item.active a h3 {
    color: #fff;
}
#producttabs .item.active,
#producttabs .item:hover,
#producttabs .item:hover h3 {
    background: #414141 none repeat scroll 0 0;
    color: #fff;
}
#producttabs .item.active,
#producttabs .item,
#producttabs .item h3 {
    transition: all 0.3s ease 0s;
}
.bestsellerproductslider-area.mg-none {
    margin-bottom: 0px;
}
.testimonial-sidebar.mg-top-50 {
    margin: 0;
}
/*================================
    10. Brand area
==================================*/
.our-brand-section {
    border-top: 1px solid #f5f5f5;
}
.our-blog-area {
  margin: 0 0 30px;
}
.mt-30{margin-top:30px;}
.brand-list ul.brand-type {
    margin-top: 30px;
}
.brand-list ul.brand-type li {
    display: inline-block;
    overflow: hidden;
    padding: 0 7px;
}
.brand-list ul.brand-type li a {
    display: block;
    text-decoration: none;
}
.brand-list ul.brand-type li a {
    display: block;
    text-decoration: none;
}
.our-brand-area {
    margin-top: 30px;
    padding-bottom: 30px;
}
/*============
section title
=============*/

.section-title-style-4 {
    border: 1px solid #e5e5e5;
    padding: 0 10px;
}
.section-title-style-4 h2 {
    color: #363636;
    display: inline-block;
    font-size: 18px;
    font-weight: 700;
    line-height: 55px;
    margin: 0;
    position: relative;
    text-transform: uppercase;
}
.section-title-style-4 h2::after {
    background: #7ac143 none repeat scroll 0 0;
    bottom: 0;
    content: "";
    display: block;
    height: 3px;
    left: 0;
    position: absolute;
    width: 100%;
}
.section-title-style-4 h2 {
    background: none;
}
.section-title-style-4 {
    background: none;
}
.section-title-style-4 h2 {
    background: none;
    color: #363636;
}
.section-title-style-4 h2 {
    min-width: 0px;
}
.modul-title h2,
.modul-title2 h2 {
    padding: 0px;
}
/*===========
owl buttons
=============*/

.before-style-3 .section-title-style-4 h2,
.before-style-3 .modul-title2 h2 {
    background: none;
    color: #363636;
}
.indicator-style-4.owl-theme .owl-controls .owl-buttons div {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #c2c2c2;
    color: #c2c2c2;
    top: -47px;
    right: 20px;
}
.indicator-style-4.owl-theme .owl-controls .owl-buttons .owl-prev {
    right: 50px;
}
.home-tes-4.owl-theme .owl-controls .owl-buttons div {
    right: 10px;
}
.home-tes-4.owl-theme .owl-controls .owl-buttons div.owl-prev {
    right: 40px;
}
/*============================
    11. Shop page
==============================*/
/*breadcrumbs*/

.main-content-2 {
    border-top: 1px solid #ddd;
}
.breadcrumbs {
    border-bottom: 1px solid #ddd;
    font-size: 14px;
    line-height: 33px;
    padding: 15px 0;
}
.breadcrumbs li {
    display: inline-block;
}
.breadcrumbs li a {
    color: #373737;
    font-size: 14px;
    text-decoration: none;
    text-transform: capitalize;
}
.breadcrumbs li strong,
.breadcrumbs li a:hover {
    color: #7ac143;
    font-size: 14px;
    font-weight: normal;
    text-decoration: none;
    text-transform: capitalize;
}
.breadcrumbs li span {
    display: inline-block;
    font-size: 0;
    line-height: 0;
    padding: 0 10px;
}
.breadcrumbs li span::before {
    color: #000;
    content: "\f105 ";
    display: block;
    font-family: FontAwesome;
    font-size: 14px;
    line-height: 8px;
}
/*block*/

.main {
    margin: 30px auto 0;
}
.block-layered-nav {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    padding: 0;
}
.block {
    margin: 0 0 30px;
}
.block .block-title {
    border-bottom: 1px solid #000;
    margin-bottom: 20px;
    position: relative;
}
.block-layered-nav .block-title strong {
    background: #282828 none repeat scroll 0 0;
    color: #fff;
    display: block;
    font-size: 12px;
    font-weight: 700;
    line-height: 20px;
    margin: 0;
    padding-bottom: 5px;
    text-transform: uppercase;
    padding: 16px;
}
.block-layered-nav .block-content {
    border: 1px solid #f5f5f5;
    padding: 17px;
}
.block-layered-nav .block-content .layered {
    padding-bottom: 20px;
}
.block-layered-nav h2 {
    color: #000;
    display: block;
    font-size: 13px;
    font-weight: 700;
    line-height: 26px;
    text-transform: uppercase;
}
.block-layered-nav .content-shopby ul li {
    color: #797979;
    font-size: 12px;
    font-weight: 400;
    line-height: 39px;
    position: relative;
    text-align: right;
    text-transform: capitalize;
}
.block-layered-nav .content-shopby ul li a {
    clear: both;
    color: #797979;
    float: left;
    font-size: 12px;
    font-weight: 400;
    text-transform: capitalize;
}
.block-layered-nav .content-shopby ul li a::before {
    content: "\f101 ";
    display: inline-block;
    font-family: FontAwesome;
    margin-right: 10px;
}
.block-layered-nav .content-shopby ul li:hover,
.block-layered-nav .content-shopby ul li:hover a {
    color: #7ac143;
    cursor: pointer;
}
/*price-slider*/

.content-shopby .amount label {
    font-weight: 400;
    margin-bottom: 5px;
}
.block-layered-nav .content-shopby {
    margin-top: 15px;
    padding: 0;
}
.block-layered-nav .amount {
    margin-bottom: 20px;
}
.block-layered-nav .amount label {
    font-weight: 400;
}
input,
select,
textarea,
button {
    background: #ffffff none repeat scroll 0 0;
    color: #2f2f2f;
    font-size: 12px;
    vertical-align: middle;
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    background: #ffffff none repeat scroll 0 0;
    border-color: #7ac143;
    font-weight: normal;
}
.ui-slider .ui-slider-handle {
    background: #7ac143 none repeat scroll 0 0;
    cursor: pointer;
    height: 20px;
    position: absolute;
    width: 4px;
    z-index: 2;
    border-radius: 0;
}
.ui-slider-horizontal .ui-slider-handle {
    margin-left: -2px;
    top: -7px;
}
.ui-widget-content {
    background: #e7e7e7 none repeat scroll 0 0;
    color: #222222;
    margin-bottom: 30px;
    border: 0px solid #000;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
    border: none;
    border-radius: 0px;
}
.ui-slider-horizontal .ui-slider-range {
    height: 100%;
    top: 0;
    background: #7ac143 none repeat scroll 0 0
}
.ui-slider-horizontal {
    height: 5px;
}
.round-button {
    border: 2px solid #ededed;
    border-radius: 20px;
    display: inline-block;
    font-weight: 700;
    line-height: 24px;
    padding: 5px 30px;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
}
.round-button:hover {
    border: 2px solid #7ac143;
    color: #7ac143;
}
/*banner left*/

.banner-left {
    margin: 0 0 30px;
    overflow: hidden;
}
.banner-left img {
    transform: scale(1);
    transition: all 0.3s ease-out 0s;
    width: 100%;
}
.banner-left:hover img {
    transform: scale(1.2);
}
/*block*/

.block .block-title strong {
    display: block;
    font-size: 12px;
    font-weight: 700;
    margin: 0;
    text-transform: uppercase;
}
.block .empty {
    color: #939393;
    margin: 0;
    padding: 5px 9px;
}
/*block tags*/

.block-tags .block-content .tags-list {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    font-size: 12px;
    overflow: hidden;
}
.block-tags .block-content li {
    display: inline-block !important;
    line-height: 35px;
    margin: 5px 5px 0 0;
    font-size: 15px;
}
.block-tags .block-content li a {
    background: #efefef none repeat scroll 0 0;
    color: #838383;
    display: block;
    padding: 0 10px;
    text-transform: capitalize;
}
.block-tags .block-content li a:hover {
    background: #7ac143 none repeat scroll 0 0;
    color: #fff;
}
.block .actions-2 {
    margin-top: 15px;
}
.block-tags .actions-2 a {
    background: #efefef none repeat scroll 0 0;
    color: #838383;
    display: inline-block;
    line-height: 34px;
    padding: 0 12px;
    text-transform: capitalize;
    font-size: 13px;
    transition: 0.3s;
}
.block-tags .actions-2 a:hover {
    background: #7ac143 none repeat scroll 0 0;
    color: #fff;
}
/*category-image*/

.category-image {
    margin: 0 0 30px;
    overflow: hidden;
}
/*category-product*/

.product-option {
    border-bottom: 2px solid #ebebeb;
    border-top: 2px solid #ebebeb;
    padding: 10px 0;
}
.sort-by {
    margin: 0;
}
.custm-select-icon {
    display: inline-block;
}
.toolbar label {
    color: #3e3e3e;
    font-size: 12px;
    font-weight: 300;
    line-height: 30px;
    text-transform: capitalize;
    margin: 0px;
    display: inline-block;
}
.sort-by select {
    border: 1px solid #e5e5e5;
    color: #777;
    font-size: 14px;
    font-style: normal;
    height: 30px;
    padding: 2px 15px;
    display: inline-block
}
.sort-by select option {
    padding-left: 5px;
    padding-right: 10px;
}
/*view-mode-menu*/

.view-mode-menu li a {
    border: 1px solid #f2f2f2;
    color: #ddd;
    display: block;
    height: 28px;
    line-height: 28px;
    text-align: center;
    width: 28px;
}
.view-mode-menu li {
    float: left;
    margin-right: 5px;
}
.view-mode-menu li.active a {
    border-color: #7ac143;
    color: #7ac143;
}
/*list-view*/

.list-view .images-container {
    float: left;
    width: 33.33%;
}
.list-view .des-container {
    float: left;
    padding-left: 30px;
    text-align: left;
    width: 66.67%;
}
.list-view .item-inner .product-name {
    font-weight: 600;
}
.list-view .des-container .product-name a {
    color: #3f3f3f;
    font-size: 18px;
}
.list-view .ratings {
    line-height: 1.25;
    margin: 15px 0;
}
.learn-more2 {
    color: #7ac143;
    font-size: 11px;
    text-transform: capitalize;
}
.learn-more2:hover {
    color: #01c3c2;
}
.list-view .actions {
    bottom: 7px;
    opacity: 1;
    position: inherit;
    right: 7px;
    transition: all 0.3s ease 0s;
    visibility: visible;
    z-index: 999;
}
.list-view .actions a {
    float: left;
}
.list-view .single-product:hover .actions a {
    transform: translateY(1px);
}
.list-view .actions a.add-to-cart,
.list-view .actions a.wishlist,
.list-view .actions a.compare,
.list-view .actions a.quick-view {
    border: 1px solid;
    line-height: 40px;
    margin-right: 11px;
    transform: translateY(0px);
}
.list-view .actions a.add-to-cart:hover,
.list-view .actions a.wishlist:hover,
.list-view .actions a.compare:hover,
.list-view .actions a.quick-view:hover {
    background-color: none;
    transform: translateY(110px);
}
.list-view .actions a.add-to-cart {
    border: 1px solid #ddd;
    border-radius: 45px;
    font-size: 20px;
    line-height: 37px;
    width: 150px;
}
.list-view .actions a.add-to-cart:hover {
    color: #7ac143;
}
.list-view .add-to-cart > span {
    color: #777;
    font-size: 11px;
    font-weight: 600;
    padding-left: 45px;
    text-transform: uppercase;
}
.list-view .actions a:hover {
    background-color: inherit;
    background-position: 0 100%;
}
.list-view .actions a.add-to-cart {
    background: #fff url("img/icon/w2.png") no-repeat scroll 0 0;
}
/*item-old*/

.item-old {
    border-bottom: 2px solid #f8f8f8;
    margin-top: 35px;
    padding-bottom: 10px;
}
.des-container.des-container-2 .add-to-box {
    border-bottom: 0px solid #ddd;
}
.item-old .single-product .item-inner {
    margin-top: 0px;
}
.des-container.des-container-2 h2 {
    font-weight: 600;
    margin: 5px 0;
}
.des-container.des-container-2 h2 a {
    color: #3f3f3f;
    font-size: 18px;
}
.des-container.des-container-2 h2 a:hover {
    color: #7ac143;
}
.des-container.des-container-2 .ratings {
    margin: 13px 0;
}
.des-container-2 .product-desc {
    border-bottom: 1px solid #eee;
    border-top: 1px solid #eee;
    clear: both;
    color: #777;
    font-size: 14px;
    line-height: 24px;
    margin: 10px 0;
    padding: 20px 0;
}
.des-container.des-container-2 .ratings .amount a {
    color: #a5a5a5;
    font-size: 11px;
    line-height: 11px;
    text-transform: capitalize;
}
.des-container.des-container-2 .ratings .amount a:hover {
    color: #7ac143;
}
.des-container-2 button.btn-cart span span {
    background: rgba(0, 0, 0, 0) url("img/icon/icon_cart_list.png") no-repeat scroll 25px 7px;
    color: #777;
    font-weight: 600;
    padding-left: 55px;
    transition: all 0.3s ease 0s;
}
button.button:hover span span {
    border-color: #7ac143;
    color: #7ac143;
}
.des-container-2 button.btn-cart:hover span span {
    background-position: 25px -61px;
    color: #7ac143;
}
#list.tab-pane > div:last-child {
    border-bottom: 0 none;
    padding-bottom: 0;
}
/*=================================
   12. Checkout page
===================================*/

.main-container {
    border-top: 1px solid #ddd;
    margin-bottom: 30px;
}
.main-container .page-content {
    margin: 30px auto 0;
    min-height: 400px;
}
.main-container .page-content .page-title {
    margin: 0 0 25px;
}
.main-container .page-content .page-title h2 {
    color: #373737;
    font-size: 24px;
    font-weight: 700;
    margin: 0;
    text-transform: uppercase;
}
.main-container .page-content .cart-details p a {
    color: #7ac143;
}
.main-container .page-content .cart-details p a:hover {
    color: #01c3c2;
}
.entry-header {
    margin-top: 15px;
}
.coupon-area {} .coupon-accordion {} .coupon-accordion h3 {
    background-color: #f7f6f7;
    border-top: 3px solid #1e85be;
    color: #515151;
    font-size: 12px;
    font-weight: 300;
    list-style: outside none none !important;
    margin: 0 0 2em !important;
    padding: 1em 2em 1em 3.5em !important;
    position: relative;
    width: auto;
}
.coupon-accordion h3::before {
    color: #1e85be;
    content: "";
    display: inline-block;
    font-family: fontawesome;
    left: 1.5em;
    position: absolute;
    top: 1em;
}
.coupon-accordion span {
    cursor: pointer;
    color: #6f6f6f;
}
.coupon-accordion span:hover,
p.lost-password a:hover {
    color: #EC4445;
}
.coupon-content {
    border: 1px solid #e5e5e5;
    display: none;
    margin-bottom: 20px;
    padding: 20px;
}
.coupon-info p.coupon-text {
    margin-bottom: 15px
}
.coupon-info p {
    margin-bottom: 0
}
.coupon-info p.form-row-first label,
.coupon-info p.form-row-last label {
    display: block;
}
.coupon-info p.form-row-first label span.required,
.coupon-info p.form-row-last label span.required {
    color: red;
    font-weight: 700;
}
.coupon-info p.form-row-first input,
.coupon-info p.form-row-last input {
    border: 1px solid #e5e5e5;
    height: 36px;
    margin: 0 0 14px;
    max-width: 100%;
    padding: 0 0 0 10px;
    width: 370px;
}
.coupon-info p.form-row input[type="submit"]:hover,
p.checkout-coupon input[type="submit"]:hover {
    background: #EC4445
}
.coupon-info p.form-row input[type="checkbox"] {
    position: relative;
    top: 2px;
}
.form-row > label {
    margin-top: 7px;
}
p.lost-password {
    margin-top: 15px;
}
p.lost-password a {
    color: #6f6f6f;
}
p.checkout-coupon {} p.checkout-coupon input[type="text"] {
    border: 1px solid #dddddd;
    height: 36px;
    padding-left: 10px;
    width: 170px;
}
p.checkout-coupon input[type=submit] {
    background: #333 none repeat scroll 0 0;
    border: medium none;
    border-radius: 0;
    color: #fff;
    height: 36px;
    margin-left: 6px;
    padding: 5px 10px;
    transition: all 0.3s ease 0s;
}
.coupon-checkout-content {
    margin-bottom: 30px;
    display: none;
}
.checkbox-form h3 {
    border-bottom: 1px solid #e5e5e5;
    font-size: 30px;
    margin: 0 0 20px;
    padding-bottom: 10px;
    text-transform: uppercase;
    width: 100%;
}
.country-select {
    margin-bottom: 30px;
    position: relative;
}
.country-select label,
.checkout-form-list label {
    color: #333;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    margin: 0 0 5px;
    display: block
}
.country-select label span.required,
.checkout-form-list label span.required {
    color: red
}
.country-select select {
    -moz-appearance: none;
    border: 1px solid #ddd;
    height: 32px;
    padding-left: 10px;
    width: 100%;
}
.country-select::before {
    color: #989898;
    content: "";
    display: inline-block;
    font-family: fontawesome;
    font-size: 20px;
    position: absolute;
    right: 12px;
    top: 25px;
}
.checkout-form-list {
    margin-bottom: 30px;
}
.checkout-form-list label {
    color: #333;
}
.checkout-form-list label span.required {} .checkout-form-list input[type=text],
.checkout-form-list input[type=password],
.checkout-form-list input[type=email] {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #e5e5e5;
    border-radius: 0;
    height: 42px;
    width: 100%;
    padding: 0 0 0 10px;
}
.checkout-form-list {} .checkout-form-list input[type="checkbox"] {
    display: inline-block;
    margin-right: 10px;
    margin-top: 0;
    position: relative;
    top: 0;
}
.ship-different-title input[type="checkbox"] {
    margin-top: -4px;
}
.create-acc label {
    color: #333;
    display: inline-block;
}
.checkout-form-list input[type=password] {} .create-account {
    display: none
}
.ship-different-title {} .ship-different-title h3 label {
    display: inline-block;
    margin-right: 20px;
}
.ship-different-title input {} .order-notes {} .order-notes textarea {
    height: 90px;
    padding: 15px;
    width: 100%
}
#ship-box-info {
    display: none
}
.your-order {
    background: #f2f2f2 none repeat scroll 0 0;
    padding: 30px 40px 45px;
}
.your-order h3 {
    border-bottom: 1px solid #d8d8d8;
    font-size: 30px;
    margin: 0 0 20px;
    padding-bottom: 10px;
    text-transform: uppercase;
    width: 100%;
}
.your-order-table table {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: medium none;
    width: 100%;
}
.your-order-table table th,
.your-order-table table td {
    border-bottom: 1px solid #d8d8d8;
    border-right: medium none;
    font-size: 14px;
    padding: 15px 0;
    text-align: center;
}
.your-order-table table th {
    border-top: medium none;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-weight: normal;
    text-align: center;
    text-transform: uppercase;
    vertical-align: middle;
    white-space: nowrap;
    width: 250px;
}
.your-order-table table .shipping ul li input {
    margin-right: 5px;
    margin-top: 0;
    position: relative;
    top: 0;
}
.your-order-table table .shipping ul li label {
    font-weight: 500;
}
.your-order-table table .shipping th {
    vertical-align: top;
}
.your-order-table table .order-total th {
    border-bottom: medium none;
    font-size: 18px;
}
.your-order-table table .order-total td {
    border-bottom: medium none;
}
.your-order-table table tr.cart_item:hover {
    background: #F9F9F9
}
.your-order-table table tr.order-total td span {
    color: #ec4445;
    font-size: 20px;
}
.your-order-table table {} .payment-method {
    margin-top: 40px;
}
.payment-accordion {} .payment-accordion h3 {
    border-bottom: 0 none;
    margin-bottom: 10px;
    padding-bottom: 0;
}
.payment-accordion h3 a {
    color: #6f6f6f;
    font-size: 14px;
    padding-left: 25px;
    position: relative;
    text-transform: capitalize;
    text-decoration: none
}
.payment-accordion h3 a:before,
.payment-accordion h3.open a:after {
    content: "";
    display: inline-block;
    font-family: fontawesome;
    font-size: 20px;
    left: 0;
    position: absolute;
    top: -2px;
}
.payment-accordion h3.open a:after {
    content: "\f056";
}
.payment-content {} .payment-content p {
    font-size: 13px;
}
.payment-accordion img {
    height: 60px;
    margin-left: 15px;
}
.order-button-payment {} .order-button-payment input {
    background: #ec4445 none repeat scroll 0 0;
    border: medium none;
    color: #fff;
    font-size: 17px;
    font-weight: 600;
    height: 50px;
    margin: 20px 0 0;
    padding: 0;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
    width: 100%;
}
.order-button-payment input:hover {
    background: #E61719
}
.panel-group img {
    height: 60px;
    margin-left: 15px;
}
.panel-heading h4 a.collapsed,
.panel-heading h4 a {
    color: #6f6f6f;
    font-size: 14px;
    padding-left: 25px;
    position: relative;
}
.panel-heading h4 a.collapsed::before,
.panel-heading h4 a::before {
    content: "";
    display: inline-block;
    font-family: fontawesome;
    font-size: 20px;
    left: 0;
    position: absolute;
    top: 2px;
}
.panel-heading h4 a::before {
    content: "\f068";
}
/*============================
    13. Blog page
==============================*/

.main-content-style-2 {
    border-top: 1px solid #ddd;
    margin-bottom: 30px;
}
.postWrapper img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;

}
.postWrapper {
    clear: both;
    margin: 40px 0;
}
.postWrapper .item-inner {
    border: none;
    margin-bottom: 0;
    padding: 0;
    text-align: left;
}
.postTitle h2 {
    margin: 0;
    padding: 0;
    margin-top: -12px;
}
.postTitle h2 a {
    color: #333;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 2px;
    text-decoration: none;
    text-transform: uppercase;
}
.postTitle h2 a:hover {
    color: #7ac143;
}
.postTitle {
    margin: 15px 0;
    padding: 0;
}
.blog-des-container .date-comments .post-by {
    color: #7ac143;
    font-size: 12px;
    overflow: hidden;
    text-transform: capitalize;
}
.postContent {
    padding: 15px 0 0;
}
.magentothem-blog-read-more {
    border: 2px solid #f2f2f2;
    border-radius: 20px;
    color: #3f3f3f;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    height: 40px;
    line-height: 40px;
    margin-top: 30px;
    padding: 0 25px;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
}
.magentothem-blog-read-more:hover {
    border-color: #7ac143;
    color: #7ac143;
}
/*==================================
    14. Single blog page
====================================*/

.main-content-style-2 {
    border-top: 1px solid #ddd;
    margin-bottom: 30px;
}
.breadcrumbs li strong,
.breadcrumbs li a:hover {
    color: #7ac143;
    font-size: 14px;
    font-weight: normal;
    text-decoration: none;
    text-transform: capitalize;
}
.postWrapper .poster {
    display: inline;
}
.single-blog-des-container .date-comments .post-by {
    color: #222;
    font-size: 12px;
    overflow: hidden;
    text-transform: capitalize;
}
.postWrapper.postwrapper-style-2 .post-by h3 {
    font-size: 16px;
    font-weight: bold;
    margin: 10px 0;
}
.item-inner.item-blog-inner {
    margin-top: 0px;
}
.postWrapper.postwrapper-style-2 {
    clear: both;
    margin: 0 0 30px;
}
.postWrapper.postwrapper-style-2 .time {
    margin-bottom: 5px;
}
.entry-content blockquote {
    background: #f2f2f2 none repeat scroll 0 0;
    border-color: #7ac143;
    font-style: italic;
    padding: 20px;
}
.entry-meta {
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
    padding: 10px 0;
}
/*==================================
    15. Not found page
====================================*/

.main.not-found-page-conten {
    margin: 30px auto 0;
    min-height: 400px;
}
.page-not-found {
    text-align: center;
}
.page-not-found .page-title {
    margin: 80px 0 10px;
}
.page-not-found .page-title h1 {
    color: #222;
    font-size: 104px;
    line-height: 104px;
    text-transform: capitalize;
    font-weight: 700;
    margin: 0;
}
.page-not-found .page-content .page-desc {
    padding: 0 0 110px;
}
.page-not-found .page-content p {
    color: #222;
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
}
.page-not-found .back-home {
    display: block;
    margin-top: 70px;
    text-align: center;
}
.page-not-found .back-home a {
    border: 1px solid #ddd;
    border-radius: 20px;
    color: #3f3f3f;
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    line-height: 26px;
    padding: 5px 25px;
    text-decoration: none;
    text-transform: uppercase;
    transition: 0.3s;
}
.page-not-found .back-home a:hover {
    border-color: #7ac143;
    color: #7ac143;
}
.contact-page-title,
.entry-header {
    border: 0 none;
    margin: 0 0 25px;
    overflow: hidden;
}
.contact-page-title h1,
.contact-page-title h2,
.my-account-page-title h1,
.entry-header h1 {
    color: #373737;
    font-size: 24px;
    font-weight: 700;
    margin: 0;
    text-transform: uppercase;
}
.fieldset {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #ddd;
    margin: 28px 0;
    padding: 22px 25px 12px 33px;
}
.fieldset .legend {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #ddd;
    color: #333;
    float: left;
    font-size: 13px;
    font-style: italic;
    margin: -33px 0 0 -10px;
    padding: 3px 8px;
    position: relative;
}
.form-list li {
    margin: 0 0 8px;
}
.form-list .field {
    float: left;
    width: 275px;
}
.form-list label {
    color: #000;
    display: inline-block;
    float: left;
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 5px;
    position: relative;
    text-transform: capitalize;
    z-index: 0;
}
.form-list label.required em {
    color: #f22e3b;
    float: right;
    font-family: arial;
    font-style: normal;
    position: absolute;
    right: -8px;
    top: 0;
}
/*============================
    16. Contact us
==============================*/

#googleMap {
    height: 350px;
    width: 100%
}
.contact-page-title,
.my-account-page-title {
    border: 0 none;
    margin: 0 0 25px;
    overflow: hidden;
}
.fieldset {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #ddd;
    margin: 28px 0;
    padding: 22px 25px 12px 33px;
}
.fieldset .legend {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #ddd;
    color: #333;
    float: left;
    font-size: 13px;
    font-style: italic;
    margin: -33px 0 0 -10px;
    padding: 3px 8px;
}
.form-list li {
    display: block;
    margin: 0 0 15px;
    overflow: hidden;
}
.form-list .field {
    float: left;
    width: 50%;
}
.form-list label {
    color: #000;
    float: left;
    font-size: 12px;
    font-weight: 400;
    position: relative;
    text-transform: capitalize;
    z-index: 0;
}
.form-list label.required em {
    color: #f22e3b;
    font-family: arial;
    font-style: normal;
    position: absolute;
    right: -8px;
    top: 0;
}
.form-list .input-box {
    clear: both;
    display: block;
    width: 100%;
}
.form-list input.input-text {
    width: 100%;
}
.input-box input.input-text,
textarea {
    height: 34px;
    padding: 5px;
}
.input-box input.input-text,
textarea {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #ddd;
}
.form-list li.wide textarea {
    width: 529px;
}
.form-list textarea {
    height: 10em;
}
.buttons-set {
    border-top: 1px solid #e4e4e4;
    clear: both;
    margin: 4em 0 2em 0;
    padding: 8px 0 0;
    text-align: right;
}
.buttons-set p.required {
    margin: 0 0 10px;
    color: #e95668;
    font-family: arial;
    font-size: 11px;
    text-align: right;
}
#contactForm .buttons-set .button {
    padding: 7px 0;
}
.form-list .field.left {
    padding-right: 15px;
}
.form-list .field.right {
    padding-left: 15px;
}
.form-list .input-box textarea {
    height: 200px;
    width: 100% !important;
}
.form-list {
    padding: 25px 0;
}
.form-list .input-box input {
    padding: 0 15px;
    height: 40px;
}
.form-list .input-box textarea {
    padding: 10px 15px;
}
/*====================================
    17. My account
======================================*/

.my-account-area {
    padding-bottom: 70px;
}
.form-fields {
    border-color: #e8e8e9 #e8e8e9 -moz-use-text-color;
    border-style: solid solid none;
    border-width: 1px 1px medium;
    float: left;
    padding: 20px 25px;
    width: 100%;
}
.form-fields h2 {
    border-bottom: 1px solid #e8e8e9;
    font-size: 18px;
    margin: 0 0 15px;
    padding: 0 0 5px;
    text-transform: uppercase;
}
.form-fields p {} .form-fields p label {
    display: block;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-weight: 400;
    margin: 0 0 5px;
}
.form-fields p label span.required {} .form-fields p input {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #e8e8e9;
    border-radius: 0;
    height: 32px;
    width: 100%;
    padding: 0 0 0 10px;
}
.form-action {
    background: #f5f5f5 none repeat scroll 0 0;
    border-color: #e8e8e9 #e8e8e9;
    border-style: none solid solid;
    border-width: medium 1px 1px;
    float: left;
    padding: 15px 10px;
    width: 100%;
}
.form-action p.lost_password {
    float: left;
    line-height: 36px;
    margin: 0;
}
.form-action input[type="submit"] {
    background: #252525 none repeat scroll 0 0;
    border: medium none;
    border-radius: 0;
    box-shadow: none;
    color: #fff;
    display: inline-block;
    float: right;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    height: 40px;
    line-height: 40px;
    padding: 0 15px;
    text-shadow: none;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
}
.form-action input[type="submit"]:hover {
    background: #EC4445
}
.form-action label {
    float: right;
    font-weight: normal;
    line-height: 36px;
    margin: 0 20px 0 0;
}
.form-action label input {
    margin-right: 3px;
    margin-top: 0;
    position: relative;
    top: 2px;
}
/*=====================================
    18. Wishlist page
======================================*/

.wishlist-area {} .wishlist-content {} .wishlist-title {} .wishlist-title h2 {} .wishlist-table {} .wishlist-table table {
    background: #fff none repeat scroll 0 0;
    border-color: #e8e8e9;
    border-radius: 0;
    border-style: solid;
    border-width: 1px 0 0 1px;
    margin: 20px 0 50px;
    width: 100%;
}
.wishlist-table table {} .wishlist-table table th {
    font-weight: 600;
}
.wishlist-table table th,
.wishlist-table table td {
    border-bottom: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
    font-size: 14px;
    padding: 15px 10px;
    text-align: center;
    color: #777;
}
.wishlist-table table .product-remove {
    padding: 0 15px;
    width: 20px;
}
.wishlist-table table .product-remove > a {
    font-size: 25px;
}
.wishlist-table table .product-thumbnail {
    width: 150px;
}
.wishlist-table table td.product-price .amount {
    font-weight: 700;
}
.wishlist-table table .wishlist-in-stock {
    color: #ec4445;
}
.wishlist-table table .product-add-to-cart > a {
    background: #000 none repeat scroll 0 0;
    color: #fff;
    display: block;
    font-weight: 700;
    padding: 10px 56px;
    text-transform: uppercase;
    width: 260px;
}
.wishlist-table table .product-add-to-cart > a:hover {
    background: #EC4445
}
.wishlist-table table .product-add-to-cart {
    width: 240px;
}
.wishlist-table table .wishlist-table table .wishlist-share {} h3.wishlist-share-title {} .wishlist-share {
    margin-bottom: 35px;
    margin-top: 20px;
}
.wishlist-share ul {} .wishlist-share ul li {
    display: inline-block;
    height: 21px;
    margin-left: 0;
    margin-right: 0;
}
.wishlist-share ul li a {
    background-position: left top;
    border: medium none;
    display: inline-block;
    height: 21px;
    width: 21px;
}
.wishlist-share ul li a.facebook {
    background: url("img/icon/facebook.png") no-repeat scroll 0 0;
}
.wishlist-share ul li a.twitter {
    background: url("img/icon/twitter.png") no-repeat scroll 0 0;
}
.wishlist-share ul li a.pinterest {
    background: url("img/icon/pinterest.jpg") no-repeat scroll 0 0;
}
.wishlist-share ul li a.googleplus {
    background: url("img/icon/googleplus.jpg") no-repeat scroll 0 0;
}
.wishlist-share ul li a.email {
    background: url("img/icon/email.jpg") no-repeat scroll 0 0;
}
.wishlist-share ul li a:hover {
    background-position: left bottom;
}
/*===========================
    19. Cart page
============================= */

.cart-main-area {
    margin-bottom: 100px;
}
.cart-title-area {
    padding-top: 30px;
}
.car-header-title {} .car-header-title h2 {
    font-size: 20px;
    margin: 0;
    text-transform: uppercase;
}
.table-content {} .table-content table {
    background: #fff none repeat scroll 0 0;
    border-color: #e5e5e5;
    border-radius: 0;
    border-style: solid;
    border-width: 1px 0 0 1px;
    margin: 0 0 50px;
    text-align: center;
    width: 100%;
}
.table-content table {} .table-content table th {
    border-top: medium none;
    font-weight: bold;
    padding: 20px 10px;
    text-align: center;
    text-transform: uppercase;
    vertical-align: middle;
    white-space: nowrap;
}
.table-content table th,
.table-content table td {
    border-bottom: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
}
.table-content table td {
    border-top: medium none;
    padding: 20px 10px;
    vertical-align: middle;
    font-size: 13px;
}
.table-content table td input {
    background: #e5e5e5 none repeat scroll 0 0;
    border: medium none;
    border-radius: 3px;
    color: #6f6f6f;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-size: 15px;
    font-weight: normal;
    height: 40px;
    padding: 0 5px 0 10px;
    width: 60px;
}
.table-content table td.product-subtotal {
    font-size: 14px;
    font-weight: bold;
    width: 120px;
    color: #777;
}
.table-content table td.product-name a {
    font-size: 14px;
    font-weight: 700;
    margin-left: 10px;
    color: #6f6f6f;
}
.table-content table td.product-name {
    width: 270px;
}
.table-content table td.product-thumbnail {
    width: 130px;
}
.table-content table td.product-remove i {
    color: #919191;
    display: inline-block;
    font-size: 20px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    width: 40px;
}
.table-content table .product-price .amount {
    font-size: 15px;
    font-weight: 700;
    color: #777;
}
.table-content table td.product-remove i:hover {
    color: #EC4445
}
.table-content table td.product-quantity {
    width: 180px;
}
.table-content table td.product-remove {
    width: 150px;
}
.table-content table td.product-price {
    width: 130px;
}
.table-content table td.product-name a:hover,
.buttons-cart a:hover {
    color: #EC4445
}
.buttons-cart {
    margin-bottom: 30px;
    overflow: hidden;
}
.buttons-cart input,
.coupon input[type="submit"],
.buttons-cart a,
.coupon-info p.form-row input[type="submit"] {
    background: #252525 none repeat scroll 0 0;
    border: medium none;
    border-radius: 0;
    box-shadow: none;
    color: #fff;
    display: inline-block;
    float: left;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 700;
    height: 40px;
    line-height: 40px;
    margin-right: 15px;
    padding: 0 15px;
    text-shadow: none;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
    white-space: nowrap;
}
.buttons-cart input:hover,
.coupon input[type=submit]:hover,
.buttons-cart a:hover {
    background: #EC4445;
    color: #fff
}
.buttons-cart a {
    color: #fff;
    float: left;
    height: 40px;
    line-height: 40px;
}
.coupon {
    margin-bottom: 40px;
    overflow: hidden;
    padding-bottom: 20px;
}
.coupon h3 {
    margin: 0 0 10px;
    font-size: 14px;
    text-transform: uppercase;
}
.coupon p {} .coupon input[type=text] {
    border: 1px solid #e5e5e5;
    float: left;
    height: 40px;
    margin: 0 6px 20px 0;
    max-width: 100%;
    padding: 0 0 0 10px;
    width: 170px;
}
.coupon input[type=submit] {} .cart_totals {
    float: left;
    text-align: right;
    width: 100%;
}
.cart_totals h2 {
    border-bottom: 2px solid #333;
    display: inline-block;
    font-size: 30px;
    margin: 0 0 35px;
    text-transform: uppercase;
}
.cart_totals table {
    border: medium none;
    float: right;
    margin: 0;
    text-align: right;
}
.cart_totals table th {
    border: medium none;
    font-size: 14px;
    font-weight: bold;
    padding: 0 20px 12px 0;
    text-align: right;
    text-transform: uppercase;
    vertical-align: top;
}
.cart_totals table td {
    border: medium none;
    padding: 0 0 12px;
    vertical-align: top;
}
.cart_totals table {} .cart_totals table td .amount {
    color: #ec4445;
    float: right;
    font-size: 13px;
    font-weight: bold;
    margin-left: 5px;
    text-align: right;
    text-transform: uppercase;
}
.cart_totals table td ul#shipping_method {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.cart_totals table td ul#shipping_method li {
    float: left;
    margin: 0 0 10px;
    padding: 0;
    text-indent: 0;
    width: 100%;
}
.cart_totals table td ul#shipping_method li input {
    margin: 0;
    position: relative;
    top: 2px;
}
.cart_totals table {} a.shipping-calculator-button {
    font-weight: bold;
    color: #6f6f6f;
}
a.shipping-calculator-button:hover {
    color: #83CBDC
}
.cart_totals table tr.order-total th,
.cart_totals table tr.order-total .amount {
    font-size: 20px;
    text-transform: uppercase;
    white-space: nowrap;
}
.cart_totals table tr.order-total .amount {} .wc-proceed-to-checkout a {
    background: #ec4445 none repeat scroll 0 0;
    color: #fff;
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    height: 50px;
    line-height: 50px;
    margin-top: 20px;
    padding: 0 30px;
    text-transform: none;
}
.wc-proceed-to-checkout a:hover {
    background: #E61719;
}
.owl-theme .owl-controls .owl-page span {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #e5e5e5;
    border-radius: 100%;
    display: block;
    height: 13px;
    margin: 3px;
    width: 13px;
    transition: 0.3s;
}
.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span {
    border: 2px solid #7ac143;
}
.slider-area.slider-v4 {
    margin: 30px 0 35px 0;
}
/*single product page extra code*/

.cart-plus-minus {
    display: inline-block;
}
.cart-quantity {
    display: inline-block;
    float: left;
}
.cart-plus-minus {
    position: relative;
    width: 100px;
}
.cart-plus-minus-box {
    border: 2px solid #f2f2f2;
    border-radius: 30px;
    height: 40px;
    text-align: center;
    width: 100%;
}
.qtybutton {
    cursor: pointer;
    height: 30px;
    line-height: 30px;
    position: absolute;
    right: 5px;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
}
.inc.qtybutton {} .dec.qtybutton {
    left: 5px;
    right: auto;
}
.cart-quantity {
    padding-top: 5px;
}
.add-to-box-cart .add-to-cart {
    margin-bottom: 25px;
    margin-top: 20px;
    overflow: hidden;
}
.single-product-action a {
    border: 2px solid #f2f2f2;
    border-radius: 50%;
    color: #999999;
    display: inline-block;
    height: 40px;
    line-height: 37px;
    margin-right: 5px;
    padding: 0;
    text-align: center;
    transition: all 0.3s ease 0s;
    width: 40px;
}
.single-product-action a:hover {
    border: 2px solid #7ac143;
    color: #7ac143;
}
/*review single product*/

#reviews .review-title {
    font-size: 20px;
    margin-bottom: 50px;
}
#reviews .commentlist .comment {
    border-bottom: 1px solid #ececec;
    list-style: outside none none;
    margin-bottom: 20px;
}
#reviews .commentlist .comment:last-child {
    border: medium none;
    margin-bottom: 0;
}
#reviews .avatar {
    border-radius: 50%;
    float: left;
    height: 70px;
    width: 70px;
}
#reviews .comment-text {
    overflow: hidden;
    padding-left: 20px;
}
#reviews .comment-text .rating {
    color: #7ac143;
    font-size: 10px;
}
#review_form input[type="text"],
#review_form input[type="email"],
#review_form textarea {
    width: 100%;
}
#review_form label {
    display: block;
    font-weight: normal;
}
#review_form .stars {
    margin: 0;
}
#review_form .stars a {
    border-right: 1px solid #eeeeee;
    color: #cccccc;
    display: inline-block;
    font-size: 0;
    line-height: 12px;
    padding: 0 10px;
}
#review_form .stars a:first-child {
    padding-left: 0;
}
#review_form .stars a::before {
    display: inline-block;
    font-family: "FontAwesome";
    font-size: 12px;
}
#review_form .stars .star-1::before {
    content: "";
}
#review_form .stars .star-2::before {
    content: "";
}
#review_form .stars .star-3::before {
    content: "";
}
#review_form .stars .star-4::before {
    content: "";
}
#review_form .stars .star-5::before {
    content: "";
}
#review_form .stars a:hover,
#review_form .stars a.active {
    color: #7ac143;
}
#review_form input[type="text"],
#review_form input[type="email"],
#review_form input[type="password"],
#review_form input[type="tel"] {
    border: 1px solid #e5e5e5;
    padding: 7px 25px;
}
#review_form textarea {
    border: 1px solid #e5e5e5;
    padding: 7px 25px;
    min-height: 100px;
}
#review_form .button,
#review_form input[type="submit"],
#review_form button {
    background-color: #ffffff;
    border: 1px solid #e5e5e5;
    border-radius: 20px;
    color: #444444;
    display: inline-block;
    font-family: "Montserrat";
    font-size: 10px;
    padding: 8px 35px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    transition: all 0.5s ease 0s;
}
#review_form .button:hover,
#review_form input[type="submit"]:hover,
#review_form button:hover {
    background-color: #7ac143;
    border: 1px solid #7ac143;
    color: #fff;
}
/*===========================
    30. Product Modal
============================= */

.modal {
    z-index: 13000
}
#productModal .modal-dialog {
    margin: 5% auto;
    max-width: 96%;
    min-height: 300px;
    padding: 20px;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    width: 870px;
}
#productModal .modal-header {
    border: 0 none;
    padding: 0;
    min-height: auto;
}
#productModal button.close {
    position: absolute;
    right: 10px;
    top: 10px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    z-index: 2;
}
#productModal button.close:hover {
    opacity: 1;
}
#productModal button.close span {
    border: 1px solid #909295;
    border-radius: 60px;
    color: #909295;
    display: block;
    height: 30px;
    line-height: 29px;
    text-align: center;
    width: 30px;
    padding-top: 1px;
}
#quickview-wrapper .modal-content {
    border-radius: 0;
}
.modal-product {
    overflow: hidden
}
.modal-product .product-images {
    float: left;
    width: 40%;
}
.modal-product .product-images .quick-thumbnails {
    float: left;
    width: 100%;
}
.modal-product .product-images .main-image {
    float: left;
    width: 100%;
}
.modal-product .product-images .main-image img {
    box-shadow: none
}
.modal-product .product-info {
    float: left;
    padding-left: 30px;
    width: 60%;
}
.modal-product .product-info h1 {
    font-size: 22px;
    font-weight: normal;
    margin: 0 0 20px;
}
.modal-product .product-info .price-box {
    float: left;
    margin: 0 0 12px;
    width: 100%;
}
.modal-product .product-info .price-box p {
    margin: 0
}
.modal-product .product-info .price-box .special-price {
    color: #83cbdc;
    font-family: "Raleway", sans-serif;
    font-size: 24px;
    font-weight: 400;
}
.modal-product .product-info .see-all {
    color: #42414f;
    display: inline-block;
    margin-bottom: 35px;
    text-decoration: underline;
}
.numbers-row > input {
    float: left;
    height: 40px;
    text-align: center;
    width: 60px;
    border: none;
    border: 1px solid #ddd;
}
.quick-add-to-cart .single_add_to_cart_button {
    background: #7ac143;
    border: medium none;
    box-shadow: 0 1px 2px 0 #7c7c7c;
    color: #ffffff;
    float: left;
    font-weight: 700;
    height: 40px;
    margin-left: 15px;
    padding: 0 60px;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
}
.quick-add-to-cart .single_add_to_cart_button:hover {
    background: #444;
    color: #fff;
}
.modal-product .product-info .see-all:hover {
    color: #212121
}
h3.widget-title-modal {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #42414f;
    float: left;
    font-size: 16px;
    line-height: 30px;
    margin: 0 0 5px;
    text-align: left;
    text-transform: none;
    width: 100%;
}
.widget-title-modal {} .modal-product .product-info .quick-add-to-cart {
    border-bottom: 1px solid #e5e5e5;
    float: left;
    margin: 0 0 20px;
    padding: 0 0 38px;
    width: 100%;
}
.modal-product .product-info .quick-desc {
    border-bottom: 1px solid #e5e5e5;
    color: #909295;
    float: left;
    font-size: 14px;
    line-height: 21px;
    margin: 0 0 25px;
    padding: 0 0 15px;
    width: 100%;
}
.modal-product .widget {
    float: left;
    width: 100%;
}
.modal-product .widget .widget-title {
    background: none;
    color: #909295;
    float: left;
    font-size: 16px;
    line-height: 30px;
    margin: 0 0 5px;
    text-align: left;
    text-transform: none;
    width: 100%;
}
.modal-product .widget .social-icons {
    float: left;
    margin: 0;
    padding: 0;
}
.modal-product .widget .social-icons li {
    float: left;
    line-height: 30px;
    list-style: none;
    margin-right: 10px;
}
.modal-product .widget .social-icons li .social-icon {
    border: 1px solid #e5e5e5;
    border-radius: 3px;
    color: #909295;
    display: inline-block;
    font-size: 18px;
    line-height: 28px;
    text-align: center;
    width: 40px;
}
.modal-product .widget .social-icons li .social-icon:hover {
    color: #fff
}
.modal-product .widget .social-icons li .social-icon.facebook:hover {
    background: #3B579D;
    border: 1px solid #3B579D;
}
.modal-product .widget .social-icons li .social-icon.twitter:hover {
    background: #3ACAFF;
    border: 1px solid #3ACAFF;
}
.modal-product .widget .social-icons li .social-icon.pinterest:hover {
    background: #CB2027;
    border: 1px solid #CB2027;
}
.modal-product .widget .social-icons li .social-icon.tumblr:hover {
    background: #304E6C;
    border: 1px solid #304E6C;
}
.modal-product .widget .social-icons li .social-icon.gplus:hover {
    background: #D11717;
    border: 1px solid #D11717;
}
.modal-product .widget .social-icons li .social-icon.linkedin:hover {
    background: #0097BD;
    border: 1px solid #0097BD;
}
.s-price-box {
    display: inline-block;
    padding: 5px 0px;
    position: relative;
    margin-bottom: 30px;
    border-top: 2px solid #4C4C4C;
    border-bottom: 2px solid #4C4C4C;
}
.s-price-box .new-price {
    font-size: 26px;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 25px;
}
.s-price-box .old-price {
    font-size: 21px;
    font-weight: 400;
    margin-left: 7px;
    text-decoration: line-through;
    color: #939295;
}
/*pagination*/

.toolbar-bottom {
    border-bottom: 2px solid #ebebeb;
    border-top: 2px solid #ebebeb;
    margin: 0;
    overflow: hidden;
    padding: 10px 0;
    margin: 30px 0 0;
}
.toolbar-bottom .pages ol li a {
    color: #373737;
    display: block;
    height: 29px;
}
.toolbar-bottom .pages ol li.current,
.toolbar-bottom .pages ol li a:hover {
    color: #7ac143;
}
.toolbar-bottom .pages ol li {
    display: inline-block;
    font-size: 14px;
    line-height: 29px;
    padding: 0 5px;
}
/*==================================
    20. Footer area
====================================*/

.footer-top-area {
    background: #0e0e0e none repeat scroll 0 0;
    padding: 50px 0;
}
.footer-title {
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}
.footer-title h2 {
    color: #444;
    display: block;
    font-size: 20px;
    font-weight: 700;
    line-height: 30px;
    margin: 0;
    text-transform: uppercase;
}
.footer-title h2::after {
    background: #7ac143 none repeat scroll 0 0;
    content: "";
    display: block;
    height: 3px;
    width: 40px;
}
.footer-content {
    color: #444;
    font-size: 12px;
    font-weight: 400;
    margin-top: 25px;
}
.about-us .footer-content .box {
 
 
    padding: 25px 15px;
}
.about-us p {
    color: #222;
    font-size: 12px;
    line-height: 24px;
    margin: 0;
}
.about-us .footer-content .link-web {
    margin: 24px 0 0;
}
.about-us .footer-content .link-web ul li {
    display: inline-block;
    margin: 10px 10px 0 0;
}
.about-us .footer-content .link-web ul li a {
    border: 1px solid #cbcbcb;
    border-radius: 100%;
    color: #cbcbcb;
    display: block;
    height: 38px;
    line-height: 43px;
    padding: 0;
    text-align: center;
    width: 38px;
    transition: 0.4s;
}
.about-us .footer-content .link-web ul li a:hover {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border-color: #7ac143;
    color: #7ac143;
}
.about-us .footer-content .link-web ul li a:hover i {
    color: #7ac143;
}
.about-us .footer-content .link-web ul li a i {
    display: inline-block;
    font-size: 18px;
    transition: 0.3s;
}
.twitter-article {
    min-height: 171px;
    padding: 20px 0 0;
    position: relative;
}
.twitter-feed {
    background-color: #fff;
    border: 1px solid #f5f5f5;
    padding: 19px 15px;
}
.twitter-pic {
    overflow: hidden;
}
.twitter-pic .img {
    float: left;
}
.twitter-link {
    display: block;
    margin-left: 60px;
    padding-right: 35px;
}
.twitter-link strong {
    display: block;
}
.twitter-link strong a {
    color: #2f2f2f;
    font-size: 13px;
    font-weight: 400;
    text-decoration: none;
}
.twitter-link strong a:hover {
    color: #0084b4;
}
.twitter-link a,
.tweet-time a {
    color: #999;
    text-decoration: none;
}
.twitter-text {
    line-height: 20px;
    margin: 21px 0 0;
}
.twitter-text p span {
    color: #7ac143;
    cursor: pointer;
}
.tweet-time {
    position: absolute;
    right: 0;
    top: 20px;
}
.delivery-support .footer-content .box {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #f5f5f5;
    margin-bottom: 11px;
    min-height: 120px;
    padding: 25px;
    transition: 0.3s;
}
.delivery-support .footer-content .box .box-inner {
    margin-top: 15px;
    padding-left: 75px;
}
.delivery-support .footer-content .box.box1 .box-inner {
    background: rgba(0, 0, 0, 0) url("img/footer-img/shipping.png") no-repeat scroll 0 0;
}
.delivery-support .footer-content .box.box2 .box-inner {
    background: rgba(0, 0, 0, 0) url("img/footer-img/order_online.png") no-repeat scroll 0 0;
}
.delivery-support .footer-content .box.box3 .box-inner {
    background: rgba(0, 0, 0, 0) url("img/footer-img/money_back.png") no-repeat scroll 0 0;
}
.delivery-support .footer-content .box .box-inner h3 {
    color: #444;
    font-size: 14px;
    margin: 0 0 5px;
}
.delivery-support .footer-content .box .box-inner p {
    color: #444;
    line-height: 24px;
    margin: 0;
}
.delivery-support .footer-content .box:hover {
    background: #7ac143 none repeat scroll 0 0;
}
.delivery-support .footer-content .box:hover p,
.delivery-support .footer-content .box:hover h3 {
    color: #fff;
}
.delivery-support .footer-content .box.box1: hover {
    background-position: 0 -141px;
}
.delivery-support .footer-content .box.box1:hover .box-inner,
.box-inner,
.delivery-support .footer-content .box.box3:hover .box-inner {
    background-position: 0 -141px;
}
.delivery-support .footer-content .box.box2:hover .box-inner {
    background-position: 0 -130px;
}
/*strat footer bottom area*/
.footer-bottom-area {
    background: #000 none repeat scroll 0 0;
    text-align: center;
}
.footer-bottom-area .footer-bottom-top {
    border-bottom: 1px solid #2a2f36;
    color: #7ac143;
    padding: 50px 0;
    text-align: left;
}
.footer-bottom-area .footer-static-bottom .footer-bottom-title h2 {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 30px;
    text-transform: uppercase;
}
.footer-static-bottom .footer-bottom-content .icon {
    display: block;
    margin-bottom: 20px;
    min-height: 33px;
    padding: 0 0 0 48px;
    position: relative;
}
.footer-static-bottom .footer-bottom-content .icon::before {
    border: 2px solid #74797f;
    border-radius: 100%;
    color: #fff;
    display: inline-block;
    font-family: FontAwesome;
    font-size: 14px;
    height: 33px;
    left: 0;
    line-height: 29px;
    margin-right: 10px;
    margin-top: -16px;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 33px;
}
.footer-static-bottom .footer-bottom-content .icon.phone::before {
    content: "\f095";
}
.footer-static-bottom .footer-bottom-content .icon.address::before {
    content: "\f041 ";
}
.footer-static-bottom .footer-bottom-content .icon.email::before {
    content: "\f003 ";
}
.footer-static-bottom .footer-bottom-content .icon.website::before {
    content: "\f0c1";
}
.footer-static-bottom .footer-bottom-content .icon.email {
    padding-top: 12px;
}
.footer-static-bottom .footer-bottom-content .icon.website {
    margin: 0;
    padding-top: 12px;
}
.footer-static-bottom .footer-bottom-content ul li a {
    color: #ccd1d7;
    display: block;
    font-size: 16px;
    line-height: 16px;
    text-decoration: none;
    text-transform: capitalize;
}
.footer-static-bottom .footer-bottom-content ul li.first a {
    padding-top: 0;
}
.footer-static-bottom .footer-bottom-content ul li a:hover {
    color: #7ac143;
    text-decoration: none;
}
.footer-static-bottom footer-bottom-content ul li span.time {
    text-align: right;
}
.footer-static-bottom .single-content .payment {
    margin: 30px 0 0;
}
/*link*/

.footer-bottom-area ul.links {
    border-bottom: 1px solid #2a2f36;
    display: block;
    padding: 23px 0;
}
.footer-bottom-area ul.links li {
    display: inline-block;
}
.footer-bottom-area ul.links li a {
    color: #ccd1d7;
    display: block;
    font-size: 10px;
    font-weight: 500;
    line-height: 13px;
    padding: 0 15px;
    text-decoration: none;
    text-transform: uppercase;
}
.footer-bottom-area ul.links li a:hover {
    color: #7ac143;
}
.footer-bottom-area address {
    color: #a1a6ac;
    font-size: 14px;
    line-height: 30px;
    margin: 0;
    padding: 15px 0;
    text-transform: capitalize;
}
.footer-bottom-area address a {
    color: #7ac143;
    text-decoration: none;
}
.footer-bottom-area address a:hover {
    text-decoration: underline;
}
.footer-bottom-content ul li {
    padding: 10px 0;
}
.footer-bottom-content ul li span.time {
    float: right;
}


/*==================================
    21. Bact to top
====================================*/
#back-top {
    background: #7ac143 none repeat scroll 0 0;
    bottom: 35px;
    color: #ffffff;
    cursor: pointer;
    display: none;
    font-size: 25px;
    height: 45px;
    line-height: 45px;
    position: fixed;
    right: 12px;
    text-align: center;
    width: 45px;
    z-index: 9999;
}
.product-thumbnail img {
  width: 100%;
}
.map-contacts {
  clear: both;
}
.owl-theme .owl-controls {
  margin-top: 0;
}

/*call to action */
/* CTA SECTION WRAPPER */
/*section {*/
/*  margin: 40px 0;*/
/*}*/

/* CTA BOX */
.cta-box {
  background: #f1f5f9;
  border-radius: 12px;
  padding: 35px 25px;
  display: flex;
  flex-direction: column;        /* CENTER STACK */
  align-items: center;           /* HORIZONTAL CENTER */
  justify-content: center;       /* VERTICAL CENTER */
  gap: 18px;
  text-align: center;            /* TEXT CENTER */
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

/* CONTENT */
.cta-content h3 {
  font-size: 24px;
  margin-bottom: 8px;
  color: #0f172a;
  font-weight: 600;
}

.cta-content p {
  margin: 0;
  font-size: 15px;
  color: #475569;
  max-width: 620px;              /* NICE READABLE WIDTH */
}

/* BUTTON GROUP */
.cta-actions {
  display: flex;
  gap: 14px;
  justify-content: center;       /* BUTTON CENTER */
  flex-wrap: wrap;
  margin-top: 8px;
}

/* COMMON BUTTON */
.cta-btn {
  padding: 12px 28px;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* CALL BUTTON */
.call-btn {
  background: #2563eb;
  color: #ffffff;
}

.call-btn:hover {
  background: #1e40af;
  transform: translateY(-2px);
  color: #ffffff;   
}

/* WHATSAPP BUTTON */
.whatsapp-btn {
  background: #22c55e;
  color: #ffffff;
}

.whatsapp-btn:hover {
  background: #15803d;
  transform: translateY(-2px);
  color: #ffffff;   
}

/* MOBILE */
@media (max-width: 768px) {
  .cta-content h3 {
    font-size: 20px;
  }

  .cta-btn {
    width: 100%;                 /* FULL WIDTH BUTTONS ON MOBILE */
    justify-content: center;
  }
}



/*new*/
.cta-btn-wrap {
  display: flex;
  justify-content: center;
  gap: 18px;
  margin-top: 25px;
  flex-wrap: wrap;
}

/* COMMON BUTTON */
.cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 22px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 600;
  color: #ffffff;
  text-decoration: none;
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
  transition: all 0.3s ease;
}

/* ICON */
.cta-btn i {
  font-size: 18px;
}

/* CALL */
.cta-btn.call {
  background: linear-gradient(135deg, #2563eb, #1e40af);
}

/* WHATSAPP */
.cta-btn.whatsapp {
  background: linear-gradient(135deg, #22c55e, #15803d);
}

/* HOVER */
.cta-btn:hover {
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 18px 35px rgba(0,0,0,0.25);
}

/* MOBILE */
@media (max-width: 768px) {
  .cta-btn {
    width: 100%;
    justify-content: center;
  }
}


/*new1*/
.cta-trust {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 18px;
  font-size: 13px;
  color: #64748b;
}


/*SERVICE*/
.services-section-pro {
  padding: 90px 0;
  background:
    radial-gradient(circle at top left, rgba(37,99,235,0.08), transparent 55%),
    radial-gradient(circle at bottom right, rgba(34,197,94,0.08), transparent 55%),
    #f8fafc;
}

/* HEADER */
.services-header {
  text-align: center;
  margin-bottom: 70px;
}

.services-eyebrow {
  font-size: 12px;
  letter-spacing: 2px;
  color: #2563eb;
  font-weight: 600;
  text-transform: uppercase;
}

.services-header h2 {
  font-size: 34px;
  font-weight: 700;
  margin: 10px 0;
}

.services-header p {
  max-width: 760px;
  margin: 0 auto;
  font-size: 16px;
  color: #64748b;
}

/* GRID FIX */
.services-grid-pro {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 35px;
}

/* CARD */
.service-card {
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 20px 50px rgba(0,0,0,0.08);
  transition: all 0.4s ease;
}

.service-card:hover {
  transform: translateY(-14px);
  box-shadow: 0 40px 80px rgba(0,0,0,0.15);
}

/* IMAGE */
.service-img {
  height: 260px;
  overflow: hidden;
  position: relative;
}

.service-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}

.service-card:hover img {
  transform: scale(1.15);
}

.service-img::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.15),
    rgba(0,0,0,0.75)
  );
}

/* CONTENT */
.service-content {
  padding: 28px;
  position: relative;
}

.service-content h3 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 12px;
}

.service-content p {
  font-size: 14px;
  line-height: 1.7;
  color: #475569;
}

/* BADGE */
.service-badge {
  position: absolute;
  top: -16px;
  left: 28px;
  background: linear-gradient(135deg, #2563eb, #22c55e);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 16px;
  border-radius: 999px;
}

/* RESPONSIVE */
@media (max-width: 991px) {
  .services-grid-pro {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 575px) {
  .services-grid-pro {
    grid-template-columns: 1fr;
  }

  .services-header h2 {
    font-size: 26px;
  }

  .service-img {
    height: 220px;
  }
}





/*product*/

/* FULL WIDTH FEATURED SECTION */
.featured-fullwidth {
  width: 100%;
  padding: 90px 0 110px;
  background: #ffffff;
}

/* CENTER CONTENT */
.featured-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 15px;
}

/* HEADER */
.featured-header {
  text-align: center;
  margin-bottom: 60px;
}

.featured-eyebrow {
  font-size: 12px;
  letter-spacing: 2px;
  font-weight: 600;
  color: #2563eb;
}

.featured-header h2 {
  font-size: 36px;
  font-weight: 700;
  margin: 10px 0;
}

.featured-header p {
  max-width: 760px;
  margin: 0 auto;
  font-size: 16px;
  color: #64748b;
}

/* GRID */
.featured-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
}

/* CARD */
.featured-card {
  background: #ffffff;
  border-radius: 18px;
  overflow: hidden;
  text-align: center;
  box-shadow: 0 20px 45px rgba(0,0,0,0.08);
  transition: all 0.4s ease;
  text-decoration: none;
  color: inherit;
}

.featured-card:hover {
  transform: translateY(-12px);
  box-shadow: 0 35px 70px rgba(0,0,0,0.16);
}

/* IMAGE */
.featured-img {
  height: 220px;
  overflow: hidden;
}

.featured-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}

.featured-card:hover img {
  transform: scale(1.12);
}

/* TITLE */
.featured-card h3 {
  padding: 18px;
  font-size: 15px;
  font-weight: 600;
  text-transform: uppercase;
  background: #f8fafc;
}

/* RESPONSIVE */
@media (max-width: 991px) {
  .featured-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 575px) {
  .featured-grid {
    grid-template-columns: 1fr;
  }

  .featured-header h2 {
    font-size: 26px;
  }
}




/**/
/* FULL WIDTH WHITE SECTION */
.content-section {
  width: 100%;
  background: #ffffff;
  padding: 90px 0;
}

/* CENTER CONTENT */
.content-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* GRID */
.content-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 60px;
}

/* REVERSE ORDER */
.content-grid.reverse {
  grid-template-columns: 1fr 1fr;
}

/* IMAGE */
.content-image img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  border-radius: 14px;
  box-shadow: 0 20px 45px rgba(0,0,0,0.12);
}

/* TEXT */
.content-text h1,
.content-text h2 {
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 18px;
  color: #111827;
}

.content-text p {
  font-size: 16px;
  line-height: 1.75;
  color: #374151;
  margin-bottom: 16px;
}

.content-text a {
  color: #2563eb;
  text-decoration: none;
  font-weight: 500;
}

/* MOBILE */
@media (max-width: 991px) {
  .content-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .content-image img {
    height: 300px;
  }

  .content-text h1,
  .content-text h2 {
    font-size: 24px;
  }
}




/**/
/* SECTION */
.gmb-section {
  padding: 90px 0;
  background: #ffffff;
}

/* HEADER */
.gmb-header {
  text-align: center;
  margin-bottom: 50px;
}

.gmb-eyebrow {
  font-size: 12px;
  letter-spacing: 2px;
  font-weight: 600;
  color: #2563eb;
}

.gmb-header h2 {
  font-size: 34px;
  font-weight: 700;
  margin: 10px 0;
}

.gmb-header p {
  max-width: 720px;
  margin: 0 auto;
  font-size: 16px;
  color: #64748b;
}

/* WRAPPER */
.gmb-wrapper {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 30px;
  align-items: stretch;
}

/* INFO CARD */
.gmb-info {
  background: #f8fafc;
  padding: 30px;
  border-radius: 16px;
  box-shadow: 0 15px 40px rgba(0,0,0,0.08);
}

.gmb-info h3 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 10px;
}

.gmb-info p {
  font-size: 14px;
  color: #475569;
  line-height: 1.6;
}

.gmb-rating {
  margin: 15px 0;
  font-size: 14px;
  font-weight: 600;
  color: #f59e0b;
}

/* BUTTONS */
.gmb-actions {
  display: flex;
  gap: 12px;
  margin-top: 20px;
}

.btn-directions,
.btn-call {
  padding: 10px 18px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  color: #fff;
}

.btn-directions {
  background: #2563eb;
}

.btn-call {
  background: #22c55e;
}

/* MAP */
.gmb-map {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 25px 60px rgba(0,0,0,0.12);
}

.gmb-map iframe {
  width: 100%;
  height: 100%;
  min-height: 380px;
  border: 0;
}

/* RESPONSIVE */
@media (max-width: 991px) {
  .gmb-wrapper {
    grid-template-columns: 1fr;
  }

  .gmb-map iframe {
    min-height: 320px;
  }
}



/**/
/* SECTION */
.testimonial-section {
  padding: 90px 0;
  background: #ffffff;
}

/* HEADER */
.testimonial-header {
  text-align: center;
  margin-bottom: 60px;
}

.testimonial-eyebrow {
  font-size: 12px;
  letter-spacing: 2px;
  color: #2563eb;
  font-weight: 600;
}

.testimonial-header h2 {
  font-size: 34px;
  font-weight: 700;
  margin: 10px 0;
}

.testimonial-header p {
  max-width: 720px;
  margin: 0 auto;
  font-size: 16px;
  color: #64748b;
}

/* GRID */
.testimonial-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

/* CARD */
.testimonial-card {
  background: #f8fafc;
  border-radius: 18px;
  padding: 30px;
  box-shadow: 0 15px 35px rgba(0,0,0,0.06);
  transition: all 0.35s ease;
}

.testimonial-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 30px 60px rgba(0,0,0,0.12);
}

/* RATING */
.testimonial-rating {
  color: #f59e0b;
  font-size: 18px;
  margin-bottom: 12px;
}

/* TEXT */
.testimonial-text {
  font-size: 14px;
  line-height: 1.7;
  color: #334155;
  margin-bottom: 20px;
}

/* AUTHOR */
.testimonial-author strong {
  display: block;
  font-size: 14px;
  color: #0f172a;
}

.testimonial-author span {
  font-size: 13px;
  color: #64748b;
}

/* RESPONSIVE */
@media (max-width: 991px) {
  .testimonial-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 575px) {
  .testimonial-grid {
    grid-template-columns: 1fr;
  }

  .testimonial-header h2 {
    font-size: 26px;
  }
}
/**/


.why-choose-section {
  padding: 90px 0;
  background: #ffffff;
}

/* HEADER */
.why-header {
  text-align: center;
  margin-bottom: 60px;
}

.why-eyebrow {
  font-size: 12px;
  letter-spacing: 2px;
  font-weight: 600;
  color: #2563eb;
}

.why-header h2 {
  font-size: 34px;
  font-weight: 700;
  margin: 12px 0;
}

.why-header p {
  max-width: 760px;
  margin: 0 auto;
  font-size: 16px;
  color: #64748b;
}

/* GRID */
.why-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

/* CARD */
.why-card {
  background: #f9fbff;
  border-radius: 16px;
  padding: 30px;
  box-shadow: 0 20px 40px rgba(0,0,0,0.06);
  transition: all 0.3s ease;
}

.why-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 35px 70px rgba(0,0,0,0.12);
}

.why-icon {
  width: 46px;
  height: 46px;
  background: linear-gradient(135deg, #2563eb, #22c55e);
  color: #fff;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  margin-bottom: 18px;
}

.why-card h3 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px;
}

.why-card p {
  font-size: 14px;
  line-height: 1.7;
  color: #475569;
}

/* RESPONSIVE */
@media (max-width: 991px) {
  .why-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 575px) {
  .why-grid {
    grid-template-columns: 1fr;
  }

  .why-header h2 {
    font-size: 26px;
  }
}
/**/
.why-choose-us {
  padding: 90px 0;
  background: #ffffff;
}

/* HEADER */
.why-header {
  text-align: center;
  max-width: 900px;
  margin: 0 auto 60px;
}

.why-eyebrow {
  font-size: 12px;
  letter-spacing: 2px;
  font-weight: 600;
  color: #2563eb;
}

.why-header h2 {
  font-size: 36px;
  font-weight: 700;
  margin: 12px 0;
}

.why-header p {
  font-size: 16px;
  color: #64748b;
}

/* GRID */
.why-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}

/* IMAGE */
.why-image img {
  width: 100%;
  border-radius: 18px;
  box-shadow: 0 30px 60px rgba(0,0,0,0.12);
}

/* FEATURES */
.why-features {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.why-item {
  display: flex;
  gap: 18px;
}

.why-icon {
  width: 36px;
  height: 36px;
  background: linear-gradient(135deg, #2563eb, #22c55e);
  color: #fff;
  font-weight: bold;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.why-item h4 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 6px;
}

.why-item p {
  font-size: 14px;
  color: #475569;
  line-height: 1.6;
}

/* RESPONSIVE */
@media (max-width: 991px) {
  .why-grid {
    grid-template-columns: 1fr;
  }

  .why-header h2 {
    font-size: 28px;
  }
}


/**/
.about-company-section {
  padding: 100px 0;
  background: #ffffff; /* clean white */
}

.about-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr; /* text slightly wider */
  gap: 60px;
  align-items: stretch; /* IMPORTANT */
}

/* TEXT */
.about-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.about-label {
  font-size: 12px;
  letter-spacing: 2px;
  font-weight: 600;
  color: #2563eb;
  margin-bottom: 10px;
}

.about-content h2 {
  font-size: 36px;
  line-height: 1.25;
  font-weight: 700;
  margin-bottom: 20px;
}

.about-content p {
  font-size: 16px;
  line-height: 1.7;
  color: #475569;
  margin-bottom: 16px;
}

.about-points {
  list-style: none;
  padding: 0;
  margin-top: 15px;
}

.about-points li {
  font-size: 15px;
  color: #1f2937;
  margin-bottom: 10px;
  padding-left: 26px;
  position: relative;
}

.about-points li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: #22c55e;
  font-weight: 700;
}

/* IMAGE */
.about-image {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0,0,0,0.15);
}

.about-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;   /* THIS MAKES IMAGE SAME HEIGHT AS TEXT */
  display: block;
}

/* RESPONSIVE */
@media (max-width: 991px) {
  .about-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .about-content h2 {
    font-size: 28px;
  }

  .about-image {
    min-height: 360px; /* keeps image big on mobile */
  }
}



/*last section cta*/
 .final-cta-section {
  width: 100%;
  padding: 80px 20px;
  background: linear-gradient(135deg, #f1f6ff, #eefcf5);
}

.cta-container {
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
}

.final-cta-section h2 {
  font-size: 32px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 15px;
}

.final-cta-section p {
  font-size: 16px;
  color: #475569;
  max-width: 820px;
  margin: 0 auto 40px;
}

/* BUTTON GROUP */
.cta-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* BASE BUTTON */
.cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 28px;
  border-radius: 50px;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 12px 25px rgba(0,0,0,0.12);
}

/* ICON */
.cta-btn i {
  font-size: 18px;
}

/* CALL */
.call-btn {
  background: #2563eb;
  color: #fff;
}

.call-btn:hover {
  background: #1e40af;
  transform: translateY(-3px);
}

/* WHATSAPP */
.whatsapp-btn {
  background: #22c55e;
  color: #fff;
}

.whatsapp-btn:hover {
  background: #16a34a;
  transform: translateY(-3px);
}

/* QUOTE */
.quote-btn {
  background: #0f172a;
  color: #fff;
}

.quote-btn:hover {
  background: #020617;
  transform: translateY(-3px);
}

/* MOBILE */
@media (max-width: 768px) {
  .final-cta-section h2 {
    font-size: 24px;
  }

  .cta-btn {
    width: 100%;
    justify-content: center;
  }
}










/*header cta*/
.header-top-simple {
  background: #1f2933; /* clean dark */
  padding: 8px 0;
}

.top-contact-wrap {
  display: flex;
  justify-content: center;
  gap: 24px;
  flex-wrap: wrap;
}

.top-contact-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  color: #e5e7eb;
  text-decoration: none;
  transition: all 0.3s ease;
}

/* ICON SIZE */
.top-contact-item i {
  font-size: 16px;
}

/* BRAND COLORS */
.top-contact-item.whatsapp i {
  color: #25D366;
}

.top-contact-item.call i {
  color: #3b82f6;
}

.top-contact-item.email i {
  color: #ffffff;
}

/* HOVER EFFECT (VERY CLEAN) */
.top-contact-item:hover {
  color: #ffffff;
  transform: translateY(-1px);
}

/* MOBILE */
@media (max-width: 768px) {
  .top-contact-wrap {
    gap: 14px;
  }

  .top-contact-item span {
    font-size: 13px;
  }
}



/**/
/**/
/**/
/* ================================
   DESKTOP / TABLET STICKY NAVBAR
================================ */
.header-mid-area {
  position: relative;
  width: 100%;
  z-index: 999;
  transition: all 0.3s ease;
}

.header-mid-area.sticky {
  position: fixed;
  top: 0;
  left: 0;
  background: #ffffff;
  box-shadow: 0 6px 20px rgba(0,0,0,0.12);
  animation: slideDown 0.35s ease-in-out;
}

/* Slide animation */
@keyframes slideDown {
  from { transform: translateY(-100%); }
  to { transform: translateY(0); }
}

/* Prevent content jump (desktop only) */
@media (min-width: 992px) {
  body.has-sticky {
    padding-top: 85px;
  }
}

/* ================================
   MAIN MENU COLORS (DESKTOP)
================================ */
.main-menu-area ul li a {
  padding: 10px 16px;
  border-radius: 6px;
  color: #111;
  font-weight: 600;
  transition: all 0.25s ease;
}

.main-menu-area ul li:hover > a,
.main-menu-area ul li.active > a {
  /*background: #22c55e;*/
  color: #7ac143 !important;
}







/**/
/* ===== MOBILE MENU STICKY FIX ===== */
@media (max-width: 991px) {

  .mean-container {
    width: 100%;
  }

  .mean-container.mobile-sticky {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  }

  body.mobile-padding {
    padding-top: 60px;
  }

}

/* ===== MOBILE MENU THEME FIX ===== */
@media (max-width: 991px) {

  /* Menu bar background */
  .mean-bar {
    background: #ffffff !important; /* white base */
    border-bottom: 2px solid #7ac143; /* ZKTeco green */
    padding: 10px 15px;
  }

  /* MENU text */
  .mean-bar span {
    color: #222 !important;
    font-weight: 600;
    text-transform: uppercase;
  }

  /* Hamburger icon */
  .meanmenu-reveal {
    color: #7ac143 !important;
  }

  .meanmenu-reveal span {
    background: #7ac143 !important;
  }

}

/**/

.mean-container .mean-bar {
  position: relative;
  min-height: 50px; /* lock height */
}

/* FIXED MENU TEXT – WILL NOT MOVE */
.mean-container .mean-bar::after {
  content: "MENU";

  position: absolute;
  left: 15px;
  top: 14px;              
  font-size: 16px;
  font-weight: 600;
  color: #7ac143;         
  letter-spacing: 0.5px;
  pointer-events: none;   
}


/*CONTACT PAGE CODE*/











:root {
  --dark: #0b1220;
  --light: #f8fafc;
  --green: #7ac143;
  --blue: #2563eb;
  --text: #475569;
}



/* HERO */
/* HERO */
.contact-hero-simple {
  background: linear-gradient(135deg, #0b1220, #111827);
  text-align: center;
  padding: 90px 20px 160px;
  color: #ffffff;
  position: relative;
  /* ❌ REMOVE THIS */
  /* overflow: hidden; */
}


.contact-hero-simple h1 {
  font-size: 34px;
  font-weight: 700;
  margin-bottom: 8px;
}

.contact-hero-simple p {
  font-size: 14px;
  color: #cbd5e1;
}

/* ================= DESKTOP FLOAT ================= */
.contact-call-cards {
  position: absolute;
  left: 50%;
  bottom: -55px;
  transform: translateX(-50%);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  max-width: 760px;
  width: 100%;
  padding: 0 15px;
}

/* CARD */
.call-card {
  background: #ffffff;
  padding: 18px 20px;
  border-radius: 14px;
  text-align: center;
  text-decoration: none;
  color: #0b1220;
  box-shadow: 0 20px 45px rgba(0,0,0,.15);
  border-top: 4px solid #7ac143;
  transition: transform .2s ease;
}

.call-card i {
  font-size: 22px;
  color: #7ac143;
  margin-bottom: 8px;
}

.call-card span {
  display: block;
  font-weight: 600;
  font-size: 14px;
}

.call-card small {
  font-size: 13px;
  color: #475569;
}

.call-card:hover {
  transform: translateY(-4px);
}

/* WHATSAPP */
.call-card.whatsapp {
  border-top-color: #25D366;
}
.call-card.whatsapp i {
  color: #25D366;
}

/* ================= TABLET FIX ================= */
@media (max-width: 1024px) {
  .contact-hero-simple {
    padding-bottom: 70px;
  }

  .contact-call-cards {
    position: relative;
    left: auto;
    bottom: auto;
    transform: none;
    margin: 30px auto 0;
    grid-template-columns: repeat(2, 1fr);
    justify-content: center;
  }
}

/* ================= MOBILE FIX ================= */
@media (max-width: 767px) {
  .contact-call-cards {
    grid-template-columns: 1fr;
    max-width: 340px;
    margin-left: auto;
    margin-right: auto;
  }

  .contact-hero-simple h1 {
    font-size: 26px;
  }
}




/* BRANCHES */
.branches {
  padding: 80px 20px;
  background: #ffffff;
}

.branches h2 {
  text-align: center;
  font-size: 32px;
  margin-bottom: 60px;
}

.branch-card {
  max-width: 1100px;
  margin: 0 auto 50px;
  background: #f8fafc;
  padding: 35px;
  border-radius: 24px;
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 30px;
  box-shadow: 0 25px 60px rgba(0,0,0,.12);
}

/* INFO */
.branch-info h3 {
  font-size: 24px;
  margin-bottom: 10px;
}

.branch-info p {
  font-size: 15px;
  color: var(--text);
}

.branch-info ul {
  padding: 0;
  list-style: none;
  margin: 15px 0;
}

.branch-info ul li {
  font-size: 14px;
  margin-bottom: 6px;
}

/* BUTTONS */
.branch-buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.btn {
  padding: 12px 22px;
  border-radius: 30px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  color: #fff;
}

.btn.green { background: var(--green); }
.btn.blue { background: var(--blue); }

/* MODERN MAP */
.modern-map {
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  box-shadow: 0 30px 70px rgba(0,0,0,.25);
}

.modern-map iframe {
  width: 100%;
  height: 340px;
  border: 0;
  filter: grayscale(10%) contrast(1.05);
}

/* MAP OVERLAY */
.map-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(11,18,32,.6),
    rgba(11,18,32,.05)
  );
  pointer-events: none;
}

.map-badge {
  position: absolute;
  top: 18px;
  left: 18px;
  background: #ffffff;
  color: #0b1220;
  padding: 8px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 600;
  box-shadow: 0 10px 25px rgba(0,0,0,.15);
}

.map-actions {
  position: absolute;
  bottom: 18px;
  right: 18px;
}

.map-actions a {
  pointer-events: auto;
  background: linear-gradient(135deg, #7ac143, #5fa82e);
  color: #fff;
  padding: 10px 18px;
  border-radius: 30px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 12px 30px rgba(122,193,67,.5);
}

/* FORM */

/* FORM */
/*.contact-form-section {*/
/*    background: #eef2ff;*/
/*    padding: 70px 20px;*/
/*}*/

/*.form-box {*/
/*    max-width: 650px;*/
/*    margin: auto;*/
/*    background: #fff;*/
/*    padding: 40px;*/
/*    border-radius: 16px;*/
/*    box-shadow: 0 10px 30px rgba(0,0,0,.1);*/
/*}*/

/*.form-box h2 {*/
/*    text-align: center;*/
/*    margin-bottom: 25px;*/
/*}*/

/*.form-row {*/
/*    display: grid;*/
/*    grid-template-columns: 1fr 1fr;*/
/*    gap: 15px;*/
/*}*/

/*.form-box input,*/
/*.form-box textarea {*/
/*    width: 100%;*/
/*    padding: 14px;*/
/*    border-radius: 8px;*/
/*    border: 1px solid #ddd;*/
/*    margin-bottom: 15px;*/
/*}*/

/*.form-box textarea {*/
/*    min-height: 120px;*/
/*}*/

/*.captcha-row {*/
/*    display: flex;*/
/*    align-items: center;*/
/*    gap: 10px;*/
/*    margin-bottom: 20px;*/
/*}*/

/*.form-box button {*/
/*    width: 100%;*/
/*    padding: 14px;*/
/*    background: #2563eb;*/
/*    color: #fff;*/
/*    border: none;*/
/*    border-radius: 10px;*/
/*    font-size: 16px;*/
/*    cursor: pointer;*/
/*}*/

/*.form-box button:hover {*/
/*    background: #1e40af;*/
/*}*/



/* ================================
   CONTACT FORM – MODERN UI
================================ */

/* Wrapper */
/*.contact-page-content {*/
/*  background: #ffffff;*/
/*  padding: 40px;*/
/*  border-radius: 14px;*/
/*  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08);*/
/*  margin: 60px auto;*/
/*}*/

/* Title */
/*.contact-page-title h1 {*/
/*  text-align: center;*/
/*  font-size: 28px;*/
/*  font-weight: 700;*/
/*  color: #0f172a;*/
/*  margin-bottom: 10px;*/
/*}*/

/*.legend {*/
/*  text-align: center;*/
/*  font-size: 16px;*/
/*  font-weight: 600;*/
/*  color: #475569;*/
/*  margin-bottom: 25px;*/
/*}*/

/* Remove default UL style */
/*.form-list {*/
/*  list-style: none;*/
/*  padding: 0;*/
/*  margin: 0;*/
/*}*/

/* Two column fields */
/*.fields {*/
/*  display: flex;*/
/*  gap: 20px;*/
/*  margin-bottom: 20px;*/
/*}*/

/* Field blocks */
/*.field {*/
/*  flex: 1;*/
/*}*/

/* Labels */
/*.field label,*/
/*.wide label {*/
/*  font-size: 13px;*/
/*  font-weight: 600;*/
/*  color: #334155;*/
/*  margin-bottom: 6px;*/
/*  display: block;*/
/*}*/

/*.field label em,*/
/*.wide label em {*/
/*  color: #dc2626;*/
/*  font-style: normal;*/
/*}*/

/* Inputs */
/*.input-box input,*/
/*.input-box textarea,*/
/*.form-control {*/
/*  width: 100%;*/
/*  padding: 12px 14px;*/
/*  border-radius: 8px;*/
/*  border: 1px solid #cbd5e1;*/
/*  font-size: 14px;*/
/*  transition: all 0.3s ease;*/
/*  background: #ffffff;*/
/*}*/

/* Focus state */
/*.input-box input:focus,*/
/*.input-box textarea:focus,*/
/*.form-control:focus {*/
/*  outline: none;*/
/*  border-color: #22c55e;*/
/*  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.15);*/
/*}*/

/* Textarea */
/*.input-box textarea {*/
/*  min-height: 130px;*/
/*  resize: vertical;*/
/*}*/

/* Full width row */
/*.wide {*/
/*  margin-bottom: 25px;*/
/*}*/

/* Captcha row */
/*.row .form-group p {*/
/*  font-size: 18px;*/
/*  font-weight: 700;*/
/*  color: #0f172a;*/
/*}*/

/*.row .form-group img {*/
/*  vertical-align: middle;*/
/*}*/

/* Required text */
/*.required {*/
/*  font-size: 12px;*/
/*  color: #dc2626;*/
/*  margin-bottom: 10px;*/
/*}*/

/* Error messages */
/*.help-block {*/
/*  color: #dc2626;*/
/*  font-size: 12px;*/
/*  margin-top: 5px;*/
/*}*/

/* Success alert */
/*.alert-success {*/
/*  background: #dcfce7;*/
/*  border: 1px solid #22c55e;*/
/*  color: #166534;*/
/*  border-radius: 8px;*/
/*  font-size: 14px;*/
/*  margin-bottom: 20px;*/
/*}*/

/* Submit button */
/*.buttons-set {*/
/*  text-align: center;*/
/*  margin-top: 25px;*/
/*}*/

/*.button {*/
/*  background: linear-gradient(135deg, #22c55e, #16a34a);*/
/*  border: none;*/
/*  padding: 14px 45px;*/
/*  border-radius: 10px;*/
/*  font-size: 15px;*/
/*  font-weight: 700;*/
/*  color: #ffffff;*/
/*  cursor: pointer;*/
/*  transition: all 0.3s ease;*/
/*  box-shadow: 0 10px 25px rgba(34, 197, 94, 0.35);*/
/*}*/

/*.button:hover {*/
/*  transform: translateY(-2px);*/
/*  box-shadow: 0 15px 35px rgba(34, 197, 94, 0.45);*/
/*}*/

/* Mobile responsive */
/*@media (max-width: 768px) {*/
/*  .fields {*/
/*    flex-direction: column;*/
/*  }*/

/*  .contact-page-content {*/
/*    padding: 25px;*/
/*  }*/

/*  .contact-page-title h1 {*/
/*    font-size: 24px;*/
/*  }*/
/*}*/











/* ================================
   CONTACT FORM – PREMIUM UI
================================ */

/* MAIN FORM CARD */
.contact-page-content {
  background: linear-gradient(180deg, #ffffff, #f8fafc);
  padding: 45px;
  border-radius: 18px;
  box-shadow: 0 25px 60px rgba(15, 23, 42, 0.12);
  margin: 70px auto;
  position: relative;
}

/* Soft top accent */
.contact-page-content::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 6px;
  width: 100%;
  background:#7ac143;
  border-radius: 18px 18px 0 0;
}

/* PAGE TITLE */
.contact-page-title h1 {
  text-align: center;
  font-size: 30px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 5px;
}

/* SUB TITLE */
.legend {
  text-align: center;
  font-size: 15px;
  font-weight: 600;
  color: #64748b;
  margin-bottom: 30px;
}

/* RESET LIST */
.form-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* ROWS */
.fields {
  display: flex;
  gap: 22px;
  margin-bottom: 22px;
}

/* FIELD */
.field {
  flex: 1;
}

/* LABELS */
.field label,
.wide label {
  font-size: 13px;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 6px;
  display: block;
  text-transform: capitalize;
}

.field label em,
.wide label em {
  color: #dc2626;
  font-style: normal;
}

/* INPUTS */
.input-box input,
.input-box textarea,
.form-control {
  width: 100%;
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid #d1d5db;
  font-size: 14px;
  background: #ffffff;
  transition: all 0.25s ease;
}

/* INPUT HOVER */
.input-box input:hover,
.input-box textarea:hover,
.form-control:hover {
  border-color: #94a3b8;
}

/* INPUT FOCUS */
.input-box input:focus,
.input-box textarea:focus,
.form-control:focus {
  outline: none;
  border-color: #22c55e;
  box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.18);
}

/* TEXTAREA */
.input-box textarea {
  min-height: 150px;
  resize: vertical;
}

/* FULL WIDTH */
.wide {
  margin-bottom: 28px;
}

/* CAPTCHA ROW */
.row .form-group p {
  font-size: 20px;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: 1px;
}

/* ERROR MESSAGE */
.help-block {
  color: #dc2626;
  font-size: 12px;
  margin-top: 6px;
}

/* SUCCESS MESSAGE */
.alert-success {
  background: linear-gradient(90deg, #dcfce7, #bbf7d0);
  border: 1px solid #22c55e;
  color: #14532d;
  border-radius: 12px;
  font-size: 14px;
  padding: 14px 18px;
  margin-bottom: 25px;
}

/* REQUIRED TEXT */
.required {
  font-size: 12px;
  color: #dc2626;
  margin-bottom: 10px;
}

/* BUTTON WRAPPER */
.buttons-set {
  text-align: center;
  margin-top: 35px;
}

/* SUBMIT BUTTON */
.button {
  background: #7ac143;
  border: none;
  padding: 15px 55px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 800;
  color: #ffffff;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 18px 35px rgba(34, 197, 94, 0.4);
}

/* BUTTON HOVER */
.button:hover {
  transform: translateY(-3px);
  box-shadow: 0 25px 45px rgba(34, 197, 94, 0.55);
  
}

/* MOBILE */
@media (max-width: 768px) {
  .fields {
    flex-direction: column;
  }

  .contact-page-content {
    padding: 28px;
  }

  .contact-page-title h1 {
    font-size: 24px;
  }
}





































/* SOCIAL */
/* SOCIAL FOLLOW SECTION */
.social-follow {
  background: #ffffff;
  padding: 60px 20px;
  text-align: center;
}

.social-follow h3 {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 6px;
  color: #0b1220;
}

.social-follow p {
  font-size: 14px;
  color: #64748b;
  margin-bottom: 26px;
}

/* ICON WRAPPER */
.social-icons-modern {
  display: flex;
  justify-content: center;
  gap: 18px;
}

/* ICON STYLE */
.social-icons-modern a {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  color: #ffffff;
  text-decoration: none;
  transition: all 0.25s ease;
  box-shadow: 0 10px 25px rgba(0,0,0,0.18);
}

/* BRAND COLORS */
.social-icons-modern .facebook {
  background: #1877f2;
}

.social-icons-modern .instagram {
  background: linear-gradient(135deg, #f58529, #dd2a7b, #8134af);
}

.social-icons-modern .linkedin {
  background: #0a66c2;
}

.social-icons-modern .twitter {
  background: #000000;
}

/* HOVER EFFECT */
.social-icons-modern a:hover {
  transform: translateY(-5px) scale(1.08);
  box-shadow: 0 15px 35px rgba(0,0,0,0.3);
}


/* MOBILE */
@media (max-width: 900px) {
  .branch-card {
    grid-template-columns: 1fr;
  }

  .form-grid {
    grid-template-columns: 1fr;
  }

  .contact-hero h1 {
    font-size: 28px;
  }

  .modern-map iframe {
    height: 260px;
  }
}



/*ZKTECO DUBAI PAGE*/

.zkteco-hero {
  background: linear-gradient(135deg, #f5f7fa 60%, #eaf6df 100%);
  padding: 70px 0;
}
.zkteco-hero h1 {
  font-size: 38px;
  font-weight: 700;
  color: #1f2933;
  margin-bottom: 15px;
}
.zkteco-hero h1 span {
  color: #78be20;
}
.zkteco-hero p {
  font-size: 17px;
  color: #4b5563;
  margin-bottom: 20px;
}
.zkteco-badges span {
  display: inline-block;
  background: #fff;
  padding: 8px 14px;
  border-radius: 20px;
  margin: 5px 5px 15px 0;
  font-size: 14px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.05);
}
.zkteco-hero .btn-main {
  background: #78be20;
  color: #fff;
  padding: 12px 26px;
  font-weight: 600;
  border-radius: 4px;
  border: none;
}
.zkteco-hero .btn-main:hover {
  background: #5fa415;
}
.zkteco-hero .btn-outline {
  border: 2px solid #78be20;
  color: #78be20;
  padding: 11px 24px;
  font-weight: 600;
  border-radius: 4px;
  background: transparent;
}
.zkteco-hero .btn-outline:hover {
  background: #78be20;
  color: #fff;
}
@media (max-width: 768px) {
  .zkteco-hero h1 {
    font-size: 28px;
  }
  .zkteco-hero {
    text-align: center;
  }
}

.zkteco-image-box {
  position: relative;
  background: #ffffff;
  border-radius: 14px;
  padding: 18px;
  box-shadow: 0 20px 40px rgba(0,0,0,0.08);
  border: 1px solid #eef2f6;
}

.zkteco-image-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 6px;
  width: 100%;
  background: linear-gradient(90deg, #78be20, #5fa415);
  border-radius: 14px 14px 0 0;
}

.zkteco-image-box img {
  width: 100%;
  border-radius: 10px;
}

.zkteco-badge {
  position: absolute;
  top: -14px;
  right: 16px;
  background: #78be20;
  color: #ffffff;
  font-size: 13px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 20px;
  box-shadow: 0 6px 15px rgba(120,190,32,0.35);
}

@media (max-width: 768px) {
  .zkteco-image-box {
    margin-top: 30px;
  }
}

/*bar*/
.zkteco-trust-bar {
  background: #ffffff;
  border-top: 1px solid #eef2f6;
  border-bottom: 1px solid #eef2f6;
  padding: 25px 0;
}

.trust-items {
  display: flex;
  justify-content: space-between;
  text-align: center;
  flex-wrap: wrap;
}

.trust-item {
  flex: 1;
  min-width: 200px;
  padding: 10px 15px;
}

.trust-icon {
  width: 46px;
  height: 46px;
  margin: 0 auto 10px;
  border-radius: 50%;
  background: rgba(120,190,32,0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #78be20;
  font-size: 22px;
  font-weight: bold;
}

.trust-text {
  font-size: 15px;
  font-weight: 600;
  color: #1f2933;
}

@media (max-width: 768px) {
  .trust-items {
    gap: 15px;
  }
}



/*dubai about*/
.zkteco-about {
  padding: 60px 0;
  background: #f9fafb;
}

.zkteco-about h2 {
  font-size: 30px;
  font-weight: 700;
  color: #1f2933;
  margin-bottom: 20px;
}

.zkteco-about h2 span {
  color: #78be20;
}

.zkteco-about p {
  font-size: 16px;
  line-height: 1.8;
  color: #4b5563;
  margin-bottom: 15px;
}

.zkteco-highlight {
  background: #ffffff;
  border-left: 4px solid #78be20;
  padding: 15px 20px;
  border-radius: 6px;
  margin-top: 20px;
  font-weight: 600;
  color: #1f2933;
}

/*dubai product*/
.zkteco-products {
  padding: 70px 0;
  background: #ffffff;
}

.zkteco-products h2 {
  font-size: 30px;
  font-weight: 700;
  color: #1f2933;
  text-align: center;
  margin-bottom: 15px;
}

.zkteco-products h2 span {
  color: #78be20;
}

.zkteco-products .sub-text {
  text-align: center;
  font-size: 16px;
  color: #4b5563;
  margin-bottom: 45px;
}

.product-img-card {
  background: #ffffff;
  border: 1px solid #eef2f6;
  border-radius: 14px;
  overflow: hidden;
  transition: all 0.3s ease;
  height: 100%;
}

.product-img-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,0.08);
  border-color: #78be20;
}

/* PRODUCT IMAGE SIZE CONTROL */
.product-img-card img {
  max-height: 200px;          /* 👈 reduce size */
  width: auto;
  margin: 0 auto;
  display: block;
  object-fit: contain;
  padding: 10px;
  background: #f9fafb;
}

.product-info {
  padding: 18px 20px 25px;
  text-align: center;
}

.product-info h3 {
  font-size: 17px;
  font-weight: 600;
  color: #1f2933;
  margin-bottom: 8px;
}

.product-info p {
  font-size: 14px;
  color: #6b7280;
}

.zkteco-products .cta-wrap {
  text-align: center;
  margin-top: 45px;
}

.zkteco-products .cta-btn {
  background: #78be20;
  color: #ffffff;
  padding: 14px 36px;
  font-size: 16px;
  font-weight: 600;
  border-radius: 6px;
  text-decoration: none;
}

.zkteco-products .cta-btn:hover {
  background: #5fa415;
}
.zkteco-products .row {
  row-gap: 30px;
}

.product-img-card {
  margin-bottom: 5px;
}
/*dubai product end*/


/*DUBAI SOFTWARE SECTION*/
.zkteco-software {
  padding: 70px 0;
  background: #f9fafb;
}

.zkteco-software h2 {
  font-size: 30px;
  font-weight: 700;
  color: #1f2933;
  margin-bottom: 15px;
}

.zkteco-software h2 span {
  color: #78be20;
}

.zkteco-software p {
  font-size: 16px;
  color: #4b5563;
  line-height: 1.8;
}

.software-box {
  background: #ffffff;
  border: 1px solid #eef2f6;
  border-radius: 14px;
  padding: 25px;
  height: 100%;
  transition: all 0.3s ease;
}

.software-box:hover {
  box-shadow: 0 18px 40px rgba(0,0,0,0.08);
  border-color: #78be20;
}

.software-box h3 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px;
  color: #1f2933;
}

.software-list li {
  list-style: none;
  font-size: 15px;
  margin-bottom: 10px;
  color: #374151;
}

.software-list li::before {
  content: "✔";
  color: #78be20;
  font-weight: bold;
  margin-right: 8px;
}

.software-benefits {
  margin-top: 25px;
}

.software-benefits span {
  display: inline-block;
  background: rgba(120,190,32,0.12);
  color: #1f2933;
  padding: 8px 14px;
  border-radius: 20px;
  font-size: 14px;
  margin: 6px 6px 0 0;
  font-weight: 600;
}

.software-cta {
  margin-top: 30px;
}

.software-cta a {
  background: #78be20;
  color: #ffffff;
  padding: 14px 32px;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
}

.software-cta a:hover {
  background: #5fa415;
}





.zkteco-software {
  position: relative;
  overflow: visible;
}

/* Right column overlap */
.zkteco-software .software-box {
  position: relative;
  top: -50px;                 /* 👈 OVERLAP AMOUNT */
  z-index: 2;
  box-shadow: 0 30px 60px rgba(0,0,0,0.12);
}

/* Optional left spacing for balance */
.zkteco-software .col-md-6:first-child {
  padding-right: 40px;
}

/* Decorative background accent */
.zkteco-software::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: 35%;
  height: 100%;
  background: linear-gradient(180deg, #eaf6df, #ffffff);
  z-index: 0;
}

/* Ensure content stays above background */
.zkteco-software .container {
  position: relative;
  z-index: 1;
}

/* Mobile safety */
@media (max-width: 768px) {
  .zkteco-software .software-box {
    top: 0;
    margin-top: 30px;
  }

  .zkteco-software::after {
    display: none;
  }
}
/*DUBAI SOFTWARE SECTION END */


/*DUBAI PAGE HARDWARE + SOFTWARE INTEGRATION*/
.zkteco-integration {
  padding: 70px 0;
  background: #ffffff;
}

.zkteco-integration h2 {
  font-size: 30px;
  font-weight: 700;
  color: #1f2933;
  margin-bottom: 20px;
}

.zkteco-integration h2 span {
  color: #78be20;
}

.zkteco-integration p {
  font-size: 16px;
  color: #4b5563;
  line-height: 1.8;
}

.integration-steps {
  margin-top: 30px;
}

.integration-step {
  display: flex;
  gap: 15px;
  margin-bottom: 18px;
}

.step-icon {
  min-width: 42px;
  height: 42px;
  border-radius: 50%;
  background: rgba(120,190,32,0.15);
  color: #78be20;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
}

.step-text {
  font-size: 15px;
  color: #374151;
  font-weight: 600;
}

.integration-box {
  background: #f9fafb;
  border-left: 5px solid #78be20;
  padding: 25px;
  border-radius: 10px;
}
/*/*DUBAI PAGE HARDWARE + SOFTWARE INTEGRATION*/ END*/


/*DUBAI PAGE INDUSTRY SECTION*/
.zkteco-industries {
  padding: 70px 0;
  background: #f9fafb;
}

.zkteco-industries h2 {
  font-size: 30px;
  font-weight: 700;
  color: #1f2933;
  text-align: center;
  margin-bottom: 15px;
}

.zkteco-industries h2 span {
  color: #78be20;
}

.zkteco-industries .sub-text {
  text-align: center;
  font-size: 16px;
  color: #4b5563;
  margin-bottom: 45px;
}

.industry-card {
  background: #ffffff;
  border: 1px solid #eef2f6;
  border-radius: 12px;
  padding: 25px 20px;
  text-align: center;
  transition: all 0.3s ease;
  height: 100%;
}

.industry-card:hover {
  box-shadow: 0 18px 40px rgba(0,0,0,0.08);
  border-color: #78be20;
  transform: translateY(-6px);
}

.industry-icon {
  width: 58px;
  height: 58px;
  margin: 0 auto 15px;
  border-radius: 50%;
  background: rgba(120,190,32,0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  color: #78be20;
}

.industry-card h3 {
  font-size: 17px;
  font-weight: 600;
  color: #1f2933;
}
.industry-card {
  margin-bottom: 10px;
}
/*DUBAI PAGE INDUSTRY SECTION END*/

/*DUBAI PAGE WHY CHOOSE US*/
.zkteco-why {
  padding: 70px 0;
  background: #ffffff;
}

.zkteco-why h2 {
  font-size: 30px;
  font-weight: 700;
  color: #1f2933;
  text-align: center;
  margin-bottom: 15px;
}

.zkteco-why h2 span {
  color: #78be20;
}

.zkteco-why .sub-text {
  text-align: center;
  font-size: 16px;
  color: #4b5563;
  margin-bottom: 45px;
}

.why-card {
  background: #f9fafb;
  border: 1px solid #eef2f6;
  border-radius: 12px;
  padding: 25px 22px;
  display: flex;
  align-items: flex-start;
  gap: 15px;
  height: 100%;
  transition: all 0.3s ease;
  margin-bottom: 30px;
}

.why-card:hover {
  border-color: #78be20;
  box-shadow: 0 18px 40px rgba(0,0,0,0.08);
  transform: translateY(-5px);
}

.why-icon {
  min-width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(120,190,32,0.15);
  color: #78be20;
  font-size: 20px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
}

.why-text h3 {
  font-size: 17px;
  font-weight: 600;
  color: #1f2933;
  margin-bottom: 6px;
}

.why-text p {
  font-size: 14px;
  color: #6b7280;
  margin: 0;
}
/*DUBAI PAGE WHY CHOOSE US END */

/*DUBAI PAGE CLIENT BENIFFIT*/
.zkteco-benefits {
  padding: 70px 0;
  background: #f9fafb;
}

.zkteco-benefits h2 {
  font-size: 30px;
  font-weight: 700;
  color: #1f2933;
  text-align: center;
  margin-bottom: 15px;
}

.zkteco-benefits h2 span {
  color: #78be20;
}

.zkteco-benefits .sub-text {
  text-align: center;
  font-size: 16px;
  color: #4b5563;
  margin-bottom: 45px;
}

.benefit-card {
  background: #ffffff;
  border: 1px solid #eef2f6;
  border-radius: 12px;
  padding: 30px 22px;
  text-align: center;
  height: 100%;
  transition: all 0.3s ease;
}

.benefit-card:hover {
  border-color: #78be20;
  box-shadow: 0 18px 40px rgba(0,0,0,0.08);
  transform: translateY(-6px);
}

.benefit-icon {
  width: 60px;
  height: 60px;
  margin: 0 auto 15px;
  border-radius: 50%;
  background: rgba(120,190,32,0.15);
  color: #78be20;
  font-size: 26px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
}

.benefit-card h3 {
  font-size: 17px;
  font-weight: 600;
  color: #1f2933;
  margin-bottom: 8px;
}

.benefit-card p {
  font-size: 14px;
  color: #6b7280;
  margin: 0;
}
/*DUBAI PAGE CLIENT BENIFFIT END*/

/*DUBAI PAGE CONTACT FORM*/
.zkteco-lead {
  padding: 80px 0;
  background: linear-gradient(135deg, #f9fafb, #eef7e6);
}

.zkteco-lead h2 {
  font-size: 32px;
  font-weight: 700;
  color: #1f2933;
  margin-bottom: 10px;
}

.zkteco-lead h2 span {
  color: #78be20;
}

/* ZKTeco Urgency Highlight Box */
.zkteco-urgency {
  margin-top: 22px;
  padding: 16px 20px;
  background: #ffffff;
  border-left: 5px solid #78be20;   /* ZKTeco green */
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  color: #1f2933;
  line-height: 1.6;
  box-shadow: 0 10px 24px rgba(0,0,0,0.06);
  margin-bottom: 30px;
}

/* Optional icon / emphasis */
.zkteco-urgency strong {
  color: #78be20;
}

/* Mobile optimization */
@media (max-width: 768px) {
  .zkteco-urgency {
    font-size: 14px;
    padding: 14px 16px;
  }
}




.zkteco-lead p {
  font-size: 16px;
  color: #4b5563;
  margin-bottom: 30px;
}
.zkteco-left-cta {
  padding-right: 50px;
}

.zkteco-left-cta h2 {
  font-size: 38px;
  font-weight: 800;
  color: #1f2933;
  line-height: 1.15;
  margin-bottom: 18px;
}

.zkteco-left-cta h2 span {
  color: #78be20;
}

.zkteco-left-cta p {
  font-size: 18px;
  color: #4b5563;
  line-height: 1.8;
  margin-bottom: 30px;
}

.zkteco-cta-points {
  list-style: none;
  padding: 0;
  margin-bottom: 35px;
}

.zkteco-cta-points li {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 17px;
  font-weight: 600;
  color: #374151;
  margin-bottom: 16px;
}

.zkteco-cta-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #78be20;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}

.zkteco-action-buttons {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
  margin-bottom: 25px;
}

.zkteco-btn-main {
  background: #78be20;
  color: #ffffff;
  padding: 16px 30px;
  font-size: 17px;
  font-weight: 700;
  border-radius: 8px;
  text-decoration: none;
  box-shadow: 0 12px 25px rgba(120,190,32,0.35);
}

.zkteco-btn-main:hover {
  background: #5fa415;
  color: #fff;
}

.zkteco-btn-outline {
  border: 2px solid #78be20;
  color: #78be20;
  padding: 14px 26px;
  font-size: 16px;
  font-weight: 700;
  border-radius: 8px;
  text-decoration: none;
}

.zkteco-btn-outline:hover {
  background: #78be20;
  color: #fff;
}

.zkteco-urgency {
  background: #ffffff;
  border-left: 5px solid #78be20;
  padding: 16px 20px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  color: #1f2933;
  box-shadow: 0 10px 20px rgba(0,0,0,0.05);
}
/*DUBAI PAGE CONTACT FORM*/





/* ===============================
   DUBAI MAP SECTION
================================ */
/* ===============================
   DUBAI MAP SECTION – FULL CSS
================================ */

.dubai-map {
  padding: 80px 0;
  background: linear-gradient(180deg, #ffffff, #f8fafc);
  position: relative;
  overflow: hidden;
}

/* Decorative right background */
.dubai-map::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: 35%;
  height: 100%;
  background: linear-gradient(180deg, #eef6ff, transparent);
  z-index: 0;
}

.dubai-map .container {
  position: relative;
  z-index: 1;
}

/* GRID LAYOUT */
.dubai-map-wrapper {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 40px;
  align-items: center;
}

/* LEFT CONTENT */
.dubai-map-left {
  padding-right: 20px;
}

.dubai-map-badge {
  display: inline-block;
  background: rgba(120,190,32,0.15);
  color: #78be20;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 14px;
}

.dubai-map-left h3 {
  font-size: 30px;
  font-weight: 800;
  color: #1f2933;
  margin-bottom: 14px;
}

.dubai-map-left h3 span {
  color: #78be20;
}

.dubai-map-address {
  font-size: 16px;
  color: #4b5563;
  line-height: 1.7;
}

/* RATING */
.dubai-map-rating {
  margin: 18px 0;
  font-size: 15px;
  font-weight: 700;
  color: #f59e0b;
}

.dubai-map-rating span {
  color: #6b7280;
  font-weight: 600;
}

/* TRUST PILLS */
.dubai-map-trust {
  margin-top: 18px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.dubai-map-trust span {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  padding: 8px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 700;
  color: #1f2933;
  box-shadow: 0 6px 16px rgba(0,0,0,0.06);
}

/* CTA */
.dubai-map-cta {
  display: flex;
  gap: 14px;
  margin-top: 28px;
  flex-wrap: wrap;
}

.dubai-map-btn {
  padding: 14px 26px;
  border-radius: 50px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.3s ease;
}

.dubai-map-btn.direction {
  background: linear-gradient(90deg, #2563eb, #1e40af);
  color: #ffffff;
}

.dubai-map-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 15px 30px rgba(0,0,0,0.15);
}

/* MAP FRAME */
.dubai-map-frame {
  position: relative;
}

.dubai-map-frame iframe {
  width: 100%;
  height: 420px;
  border-radius: 22px;
  border: none;
  box-shadow: 0 35px 70px rgba(0,0,0,0.18);
}

/* LIVE BADGE – RIGHT SIDE */
.map-live-badge {
  position: absolute;
  top: 18px;
  right: 18px;
  background: #78be20;
  color: #ffffff;
  font-size: 12px;
  font-weight: 800;
  padding: 6px 16px;
  border-radius: 20px;
  z-index: 2;
  box-shadow: 0 8px 22px rgba(120,190,32,0.55);
}

/* MOBILE OPTIMIZATION */
@media (max-width: 768px) {

  .dubai-map-wrapper {
    grid-template-columns: 1fr;
  }

  .dubai-map-left {
    text-align: center;
    padding-right: 0;
  }

  .dubai-map-cta,
  .dubai-map-trust {
    justify-content: center;
  }

  .map-live-badge {
    right: 50%;
    transform: translateX(50%);
  }

  .dubai-map::after {
    display: none;
  }
}


/* MAP */


/*DUBAI PAGE CTA */

.zkteco-final-cta {
  background: linear-gradient(90deg, #78be20, #5fa415);
  padding: 45px 0;
  color: #ffffff;
  text-align: center;
}

.zkteco-final-cta h3 {
  font-size: 28px;
  font-weight: 800;
  margin-bottom: 10px;
}

.zkteco-final-cta p {
  font-size: 16px;
  opacity: 0.95;
  margin-bottom: 30px;
}

.zkteco-cta-center {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 15px;
}

.zkteco-cta-btn {
  background: #ffffff;
  color: #1f2933;
  padding: 14px 26px;
  font-size: 16px;
  font-weight: 700;
  border-radius: 50px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
  transition: all 0.3s ease;
}

.zkteco-cta-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 35px rgba(0,0,0,0.25);
}

.zkteco-cta-btn.call { color: #0f172a; }
.zkteco-cta-btn.whatsapp { color: #16a34a; }
.zkteco-cta-btn.mail { color: #2563eb; }
.zkteco-cta-btn.social { color: #7c3aed; }

@media (max-width: 768px) {
  .zkteco-final-cta h3 {
    font-size: 22px;
  }
}

/*DUBAI PAGE CTA END */

/*DUBAI PAGE MINI BAR*/

.zkteco-cta-bar {
  background: linear-gradient(90deg, #78be20, #5fa415);
  padding: 30px 0;
  color: #ffffff;
}

.zkteco-cta-bar .cta-inner {
  text-align: center;
}

.zkteco-cta-bar h4 {
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 18px;
}

.zkteco-cta-buttons {
  display: flex;
  justify-content: center;
  gap: 15px;
  flex-wrap: wrap;
}

.zkteco-cta-btn {
  background: #ffffff;
  color: #1f2933;
  padding: 12px 22px;
  font-size: 15px;
  font-weight: 700;
  border-radius: 8px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 10px 22px rgba(0,0,0,0.2);
  transition: all 0.25s ease;
}

.zkteco-cta-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 35px rgba(0,0,0,0.3);
}

/* Button Accent Colors */
.zkteco-cta-btn.call { color: #0f172a; }
.zkteco-cta-btn.whatsapp { color: #16a34a; }
.zkteco-cta-btn.mail { color: #2563eb; }

@media (max-width: 768px) {
  .zkteco-cta-bar h4 {
    font-size: 20px;
  }
}


/*END*/


/*DUBAI PAGE MINI BAR*/

.zkteco-cta-bar-home {
  background: linear-gradient(90deg, #78be20, #5fa415);
  padding: 30px 0;
  color: #ffffff;
  
  
}

.zkteco-cta-bar-home .cta-inner {
  text-align: center;
}

.zkteco-cta-bar-home h4 {
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 18px;
}
@media (max-width: 768px) {
  .zkteco-cta-bar-home h4 {
    font-size: 20px;
  }
}


/*dorpdown menu sub*/
.dropdown-submenu {
  position: relative;
}

.dropdown-submenu > .dropdown-menu {
  top: 0;
  left: 100%;
  margin-top: -1px;
  display: none;
}

.dropdown-submenu.open > .dropdown-menu {
  display: block;
}



/**/










/* ZKTeco FAQ Section */
.zkteco-faq {
  padding: 70px 0;
  background: #f9fafb;
}

.zkteco-faq .faq-title {
  text-align: center;
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 40px;
}

.zkteco-faq .faq-title span {
  color: #78be20;
}

.faq-wrapper {
  max-width: 900px;
  margin: 0 auto;
}

.faq-item {
  background: #ffffff;
  border-radius: 8px;
  margin-bottom: 15px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
  overflow: hidden;
}

.faq-question {
  width: 100%;
  background: none;
  border: none;
  padding: 18px 22px;
  font-size: 17px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.faq-question:hover {
  background: #78be20;
}

.faq-icon {
  font-size: 22px;
  font-weight: bold;
  color: #78be20;
  transition: transform 0.3s ease;
}

.faq-answer {
  display: none;
  padding: 0 22px 18px;
  font-size: 15px;
  line-height: 1.6;
  color: #555;
}

.faq-item.active .faq-answer {
  display: block;
}

.faq-item.active .faq-icon {
  transform: rotate(45deg);
}











/**/









/*product page design*/

/* ZKTeco palette */
:root {
  --zk-green: #6ACF00;
  --zk-green-dark: #4da300;
  --zk-dark: #0d0f0f;
  --zk-muted: #6b7280;
  --zk-border: #e5e7eb;
  --zk-bg: #f5f7fa;
}

/* Page background */
.product-page-alt {
  background: var(--zk-bg);
  padding: 40px 0 60px;
  color: var(--zk-dark);
  font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
}

/* Cards */
.product-page-alt .card {
  background: #ffffff;
  border-radius: 16px;
  border: 1px solid var(--zk-border);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
  margin-bottom: 22px;
  padding: 18px 20px 22px;
}

/* Header grid */
.product-header-grid {
  display: grid;
  grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
  gap: 26px;
  align-items: center;
}

/* Image block */
.product-header-image {
  border-radius: 16px;
  padding: 18px;
  background: linear-gradient(145deg, #ffffff 0%, #f0fdf4 40%, #f5f7fa 100%);
  border: 1px solid #d1d5db;
  text-align: center;
}
.product-header-image img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

/* Right side text */
.product-header-info {
  padding-right: 10px;
}
.product-label {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .16em;
  color: var(--zk-muted);
  margin-bottom: 4px;
}
.product-label::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--zk-green);
  margin-right: 6px;
}
.product-title {
  font-size: 26px;
  font-weight: 600;
  color: var(--zk-dark);
  margin-bottom: 8px;
}

/* Tags */
.product-tags {
  margin-bottom: 12px;
}
.product-tags .tag {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid #d1d5db;
  color: #374151;
  margin-right: 6px;
  background: #f9fafb;
}

/* Short description */
.product-header-description {
  font-size: 13px;
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 16px;
}

/* Buttons (ZKTeco green) */
.btn-pill {
  border-radius: 999px !important;
}
.btn-main {
  background: var(--zk-green);
  color: #ffffff !important;
  border: none;
  padding: 9px 18px;
  font-size: 13px;
  box-shadow: 0 10px 24px rgba(106, 207, 0, 0.35);
}
.btn-main:hover {
  background: var(--zk-green-dark);
  color: #ffffff !important;
}
.btn-soft {
  background: #ffffff;
  border: 1px solid var(--zk-green);
  color: var(--zk-green) !important;
  padding: 9px 16px;
}
.btn-soft:hover {
  background: var(--zk-green);
  color: #ffffff !important;
}
.product-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 12px;
}

/* Info pills */
.product-info-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 11px;
  color: #6b7280;
}
.product-info-pills span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #f3f4f6;
}

/* Tabs */
.product-body-card {
  margin-top: 8px;
}
.product-alt-tabs {
  border-bottom: 1px solid #e5e7eb;
  margin-bottom: 16px;
}
.product-alt-tabs > li > a {
  color: #6b7280;
  font-size: 13px;
  padding: 8px 10px;
  border: none;
  border-bottom: 2px solid transparent;
}
.product-alt-tabs > li.active > a,
.product-alt-tabs > li > a:hover {
  background: transparent;
  border: none;
  border-bottom: 2px solid var(--zk-green);
  color: var(--zk-dark);
}
.product-alt-tab-content {
  font-size: 13px;
  color: #4b5563;
}

/* Bento specs */
.spec-bento-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 16px;
}
.spec-bento-card {
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  padding: 12px 14px;
}
.spec-bento-card h3 {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--zk-dark);
  margin-top: 0;
  margin-bottom: 8px;
}
.spec-bento-card dl {
  margin: 0;
}
.spec-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 4px 0;
  border-bottom: 1px dashed #e5e7eb;
}
.spec-row:last-child {
  border-bottom: none;
}
.spec-row dt {
  font-weight: 500;
  color: #4b5563;
  flex: 0 0 45%;
  text-align: left;
}

.spec-row dd {
  margin: 0;
  color: #111827;
  flex: 1;
  text-align: left;   /* was right */
}

/* Overview + downloads */
.overview-content {
  line-height: 1.7;
}
.downloads-content p {
  margin-bottom: 10px;
}

/* Responsive */
@media (max-width: 991px) {
  .product-header-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 767px) {
  .product-page-alt {
    padding: 24px 0 40px;
  }
  .product-page-alt .card {
    padding: 14px 14px 18px;
  }
  .product-title {
    font-size: 22px;
  }
}







































/**/



/* =========================
   ZKTeco Category Page Theme
   (works with existing HTML)
   ========================= */

/* Core palette (ZKTeco-inspired) */
:root {
    --zk-green: #78be20;
    --zk-green-dark: #4a8d0e;
    --zk-dark: #0d1117;
    --zk-muted: #6b7280;
    --zk-border: #e5e7eb;
    --zk-bg: #f5f7fa;
    --zk-danger: #ef4444;
}

/* Global reset overrides */
body {
    font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
    background: var(--zk-bg);
    color: #111827;
    font-size: 14px;
}

/* Main wrapper */
.page-content {
    background: linear-gradient(180deg, #ffffff 0, #f5f7fa 60%, #eff3f9 100%);
    padding-bottom: 40px;
}

.main-content-2 {
    border-top: 1px solid #d1d5db;
}

/* =========================
   Breadcrumbs
   ========================= */
.breadcrumbs {
    border-bottom: 1px solid #e5e7eb;
    padding: 16px 0;
    font-size: 13px;
    background: #f9fafb;
}

.breadcrumbs ul {
    margin: 0;
    padding: 0;
}

.breadcrumbs li {
    display: inline-block;
    color: #6b7280;
}

.breadcrumbs li a {
    color: #4b5563;
    text-decoration: none;
    text-transform: capitalize;
}

.breadcrumbs li a:hover {
    color: var(--zk-green);
}

.breadcrumbs li span {
    display: inline-block;
    padding: 0 8px;
    color: #9ca3af;
}

.breadcrumbs li strong {
    color: #111827;
    font-weight: 600;
}

/* =========================
   Layout & Sidebar
   ========================= */
.main {
    margin: 24px auto 0;
}

.block-layered-nav {
    background: #ffffff;
    border-radius: 14px;
    border: 1px solid var(--zk-border);
    padding: 16px 18px 18px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.block-layered-nav .block-title strong {
    background: transparent;
    color: #111827;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 8px;
    display: block;
}

.block-layered-nav .block-content {
    border: none;
    padding: 12px 0 0;
}

.block-layered-nav h2 {
    font-size: 12px;
    text-transform: uppercase;
    color: #4b5563;
    margin-bottom: 4px;
}

.block-layered-nav .content-shopby ul li {
    font-size: 12px;
    line-height: 30px;
    color: #6b7280;
    text-align: right;
}

.block-layered-nav .content-shopby ul li a {
    float: left;
    color: #374151;
}

.block-layered-nav .content-shopby ul li:hover,
.block-layered-nav .content-shopby ul li:hover a {
    color: var(--zk-green);
    cursor: pointer;
}

/* =========================
   Category header
   ========================= */
.category-image {
    margin: 0 0 22px;
    padding: 18px 22px;
    border-radius: 18px;
    background: radial-gradient(circle at top left, rgba(120, 190, 32, 0.1), transparent 55%),
                #ffffff;
    border: 1px solid var(--zk-border);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.category-image h1 {
    font-size: 26px;
    font-weight: 700;
    margin: 0;
    color: #111827;
}

/* =========================
   Top toolbar (view mode)
   ========================= */
.product-option {
    border-top: none;
    border-bottom: 1px solid #e5e7eb;
    padding: 10px 0 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.toolbar label {
    color: #6b7280;
    font-size: 12px;
    margin: 0 6px 0 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* Sort dropdown (if used) */
.sort-by select {
    border-radius: 999px;
    border: 1px solid #d1d5db;
    padding: 4px 20px;
    font-size: 13px;
    color: #374151;
    background: #ffffff;
}

/* View mode icons */
.view-mode-menu {
    margin: 0;
    padding: 0;
}

.view-mode-menu li {
    float: left;
    margin-right: 6px;
}

.view-mode-menu li a {
    border-radius: 999px;
    border: 1px solid #d1d5db;
    color: #9ca3af;
    display: block;
    width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    background: #ffffff;
    transition: all 0.25s ease;
}

.view-mode-menu li a i {
    font-size: 14px;
}

.view-mode-menu li.active a,
.view-mode-menu li a:hover {
    border-color: var(--zk-green);
    color: var(--zk-green);
    box-shadow: 0 6px 16px rgba(120, 190, 32, 0.25);
}

/* =========================
   Grid / List containers
   ========================= */
.product-view-mode .tab-content {
    margin-top: 20px;
}

/* Product card base */
.single-product .item-inner,
.product-list,
.list-view .item-inner {
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid var(--zk-border);
    padding: 10px;
    margin-top: 18px;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.08);
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.single-product:hover .item-inner,
.product-list:hover,
.list-view .item-inner:hover {
    transform: translateY(-6px);
    border-color: rgba(120, 190, 32, 0.5);
    box-shadow: 0 22px 55px rgba(15, 23, 42, 0.16);
}

/* Image container */
.item-inner .img-container,
.list-view .images-container {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    background: #f3f4f6;
}

.product-image img {
    width: 100%;
    height: auto;
    object-fit: contain;
    transition: transform 0.35s ease;
}

.single-product:hover .product-image img,
.list-view .item-inner:hover .product-image img {
    transform: scale(1.06);
}

/* Badge example (sale/new) – optional */
/* Product name as button */
.product-name {
    margin: 12px 0 4px;
    text-align: center;
}

.product-name a {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 999px;
    background: var(--zk-green);
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border: 1px solid var(--zk-green);
    box-shadow: 0 8px 20px rgba(120, 190, 32, 0.35);
}

.product-name a:hover {
    background: #ffffff;
    color: var(--zk-green);
    border-color: var(--zk-green);
}
/* Price + rating */
.price-box {
    margin: 4px 0 6px;
}

.price-box .price,
.price-box span.new-price {
    color: var(--zk-green);
    font-size: 15px;
    font-weight: 700;
}

.price-box span.old-price {
    color: #9ca3af;
    font-size: 13px;
}

.ratings {
    margin: 6px 0 0;
    line-height: 1.25;
}

.ratings .rating-box ul li.yes i {
    color: #f59e0b;
}

.ratings .rating-box ul li i {
    color: #d1d5db;
}

/* =========================
   Card actions (grid)
   ========================= */
.actions {
    position: absolute;
    right: 8px;
    bottom: 8px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.25s ease;
    z-index: 2;
}

.single-product:hover .actions {
    opacity: 1;
    visibility: visible;
}

.actions a {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    display: block;
    margin-top: 6px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    text-align: center;
    line-height: 34px;
    font-size: 0;
    transition: all 0.25s ease;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
}

/* If you keep icon sprites: only hover colors change */
.actions a:hover {
    border-color: var(--zk-green);
    background-color: var(--zk-green);
    box-shadow: 0 10px 24px rgba(120, 190, 32, 0.35);
}

/* =========================
   List view overrides
   ========================= */
.list-view .images-container {
    float: left;
    width: 30%;
}

.list-view .des-container {
    float: left;
    width: 70%;
    padding-left: 24px;
    text-align: left;
}

.list-view .des-container .product-name a {
    font-size: 18px;
}

.list-view .product-desc,
.des-container-2 .product-desc {
    border-top: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
    margin: 10px 0;
    padding: 12px 0;
    color: #4b5563;
    font-size: 13px;
    line-height: 1.8;
}

/* List actions horizontal */
.list-view .actions {
    position: static;
    opacity: 1;
    visibility: visible;
    margin-top: 12px;
}

.list-view .actions a {
    float: left;
    margin-right: 10px;
    width: auto;
    height: 36px;
    line-height: 34px;
    border-radius: 999px;
    font-size: 11px;
    text-transform: uppercase;
    padding: 0 20px 0 44px; /* room for icon sprite if you use it */
    color: #374151;
    background: #ffffff;
    border: 1px solid #d1d5db;
}

/* Main CTA in list */
.list-view .actions a.add-to-cart {
    border-color: var(--zk-green);
    color: var(--zk-green);
    box-shadow: 0 10px 24px rgba(120, 190, 32, 0.25);
}

.list-view .actions a.add-to-cart:hover {
    background: var(--zk-green);
    color: #ffffff;
}

/* =========================
   Pagination (bottom toolbar)
   ========================= */
.toolbar-bottom {
    border-top: 1px solid #e5e7eb;
    border-bottom: none;
    margin: 26px 0 0;
    padding: 14px 0 6px;
}

.toolbar-bottom .pages {
    text-align: right;
}

.toolbar-bottom .pages ol {
    margin: 0;
    padding: 0;
}

.toolbar-bottom .pages ol li {
    display: inline-block;
    font-size: 13px;
    margin: 0 2px;
}

.toolbar-bottom .pages ol li a,
.toolbar-bottom .pages ol li span {
    display: block;
    min-width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    border-radius: 999px;
    padding: 0 6px;
    color: #4b5563;
    background: transparent;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}

.toolbar-bottom .pages ol li a:hover,
.toolbar-bottom .pages ol li.current span {
    color: var(--zk-green);
    border-color: var(--zk-green);
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(120, 190, 32, 0.25);
}

/* =========================
   Category description
   ========================= */
.product-view-mode > .tab-content + * {
    /* This targets the {!! $category->description !!} block right after tabs */
    margin-top: 26px;
    padding: 18px 22px;
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid var(--zk-border);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
    font-size: 14px;
    line-height: 1.8;
    color: #4b5563;
}

/* =========================
   Responsive
   ========================= */
@media (max-width: 991px) {
    .category-image {
        padding: 14px 16px;
    }
    .category-image h1 {
        font-size: 22px;
    }
    .product-option {
        flex-direction: row;
        justify-content: space-between;
    }
}

@media (max-width: 767px) {
    .breadcrumbs {
        font-size: 12px;
        padding: 10px 0;
    }

    .category-image {
        margin-bottom: 16px;
    }

    .product-option {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .list-view .images-container,
    .list-view .des-container {
        float: none;
        width: 100%;
        padding-left: 0;
    }

    .list-view .actions a {
        margin-bottom: 8px;
    }

    .toolbar-bottom .pages {
        text-align: center;
    }
}




/**/


/* Elegant ZKTeco Categories */
.zkteco-elegant {
  padding: 90px 0;
  background: linear-gradient(135deg, #fefefe 0%, #f9fafb 100%);
}

.featured-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.featured-header {
  text-align: center;
  margin-bottom: 70px;
}

.featured-eyebrow {
  font-size: 14px;
  font-weight: 600;
  color: #7ac143;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 20px;
  display: block;
}

.featured-header h2 {
  font-size: 40px;
  font-weight: 700;
  color: #1f2937;
  margin: 0 0 18px;
  letter-spacing: -0.02em;
}

.featured-header p {
  font-size: 17px;
  color: #6b7280;
  max-width: 550px;
  margin: 0 auto;
  line-height: 1.7;
}

/* Perfect 2x3 Grid */
.elegant-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 32px;
}

/* Elegant Cards */
.elegant-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 0;
  overflow: hidden;
  box-shadow: 0 10px 45px rgba(0, 0, 0, 0.06);
  transition: all 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  text-decoration: none;
  color: inherit;
  border: 1px solid #f3f4f6;
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.elegant-card:hover {
  transform: translateY(-12px);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.12);
  border-color: #7ac143;
}

/* Image Container */
.featured-img {
  height: 240px;
  overflow: hidden;
  position: relative;
}

.featured-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.elegant-card:hover .featured-img img {
  transform: scale(1.06);
}

/* Content */
.elegant-content {
  padding: 28px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.elegant-content h3 {
  font-size: 20px;
  font-weight: 700;
  color: #111827;
  margin: 0 0 12px;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.elegant-content p {
  color: #6b7280;
  font-size: 15px;
  margin: 0 0 25px;
  line-height: 1.6;
  flex-grow: 1;
}

/* Elegant Button */
.elegant-btn {
  background: transparent;
  color: #7ac143 !important;
  padding: 12px 0;
  border-top: 2px solid #f3f4f6;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  position: relative;
}

.elegant-card:hover .elegant-btn {
  color: #6aa738 !important;
  padding-left: 8px;
  border-top-color: #7ac143;
}

/* Badges */
.popular::after {
  content: 'POPULAR';
  position: absolute;
  top: 18px;
  right: 18px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: white;
  padding: 6px 14px;
  border-radius: 16px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.8px;
  z-index: 2;
}

.new-badge {
  position: absolute;
  top: 18px;
  left: 18px;
  background: linear-gradient(135deg, #10b981, #059669);
  color: white;
  padding: 6px 14px;
  border-radius: 16px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.8px;
  z-index: 2;
}

/* Responsive */
@media (max-width: 991px) {
  .elegant-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
  }
}

@media (max-width: 575px) {
  .elegant-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  
  .featured-header h2 {
    font-size: 32px;
  }
}













/* ZKTeco Clean CTA */
.zkteco-cta {
  padding: 70px 20px;
  background: #f9fafb;
}

.zkteco-cta-box {
  max-width: 900px;
  margin: auto;
  background: #ffffff;
  border-radius: 18px;
  padding: 45px 30px;
  text-align: center;
  box-shadow: 0 15px 40px rgba(122, 193, 67, 0.12);
  border: 1px solid rgba(122, 193, 67, 0.25);
}

.zkteco-cta-box h2 {
  font-size: 28px;
  font-weight: 700;
  color: #1f2937;
  margin-bottom: 10px;
}

.zkteco-cta-box p {
  font-size: 16px;
  color: #4b5563;
  margin-bottom: 28px;
}

.zkteco-cta-points {
  display: flex;
  justify-content: center;
  gap: 25px;
  margin-bottom: 35px;
  flex-wrap: wrap;
}

.zkteco-cta-points span {
  font-size: 14px;
  font-weight: 500;
  color: #374151;
}

.zkteco-cta-actions {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

.zkteco-btn {
  padding: 13px 26px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
}

/* WhatsApp Primary */
.zkteco-btn.whatsapp {
  background: #7ac143;
  color: #ffffff;
}

.zkteco-btn.whatsapp:hover {
  background: #6aae3a;
  transform: translateY(-2px);
}

/* Call Secondary */
.zkteco-btn.call {
  border: 2px solid #7ac143;
  color: #7ac143;
  background: #ffffff;
}

.zkteco-btn.call:hover {
  background: #7ac143;
  color: #ffffff;
  transform: translateY(-2px);
}

/* Mobile */
@media (max-width: 768px) {
  .zkteco-cta-box h2 {
    font-size: 22px;
  }

  .zkteco-cta-actions {
    flex-direction: column;
  }

  .zkteco-btn {
    width: 100%;
    max-width: 280px;
    justify-content: center;
  }
}







/**/

/* MOBILE LOGO SIZE FIX */
@media (max-width:768px){

.logo img{
max-width:110px !important;
height:auto !important;
}

/* reduce header height */
.header-mid-area{
padding-top:5px !important;
padding-bottom:5px !important;
}

}

/* MOBILE HERO TEXT SIZE */
@media (max-width:768px){

.zkteco-cta-bar-home h1{
font-size:18px !important;
line-height:26px !important;
padding:0 10px;
text-align:center;
}

}






/* MOBILE HEADER GAP FIX */

/* FIX GAP BETWEEN LOGO AND MOBILE MENU */
@media (max-width:768px){

/* reduce logo section height */
.header-mid-area{
padding-top:2px !important;
padding-bottom:2px !important;
margin-bottom:0 !important;
}

/* reduce logo spacing */
.logo img{
max-width:90px !important;
margin:0 auto !important;
display:block;
}

/* remove gap before menu bar */
.mobile-menu-area{
margin-top:-10px !important;
padding-top:0 !important;
}

/* reduce menu bar padding */
.mean-container .mean-bar{
padding:5px 0 !important;
margin-top:0 !important;
}

}



/* Locations Mobile Menu Style */

@media (max-width:768px){

.location-menu .location-dropdown{
background:#111827 !important;
border:none;
}

.location-menu .location-dropdown li a{
color:#ffffff !important;
padding:10px 15px;
display:block;
font-size:16px;
}

.location-menu .location-dropdown li a:hover{
background:#1f2937;
color:#ffffff !important;
}

.location-menu .location-toggle{
color:#ffffff !important;
}

}




.header-top-bar{
background:#222;
color:#fff;
font-size:14px;
padding:8px 0;
}

.topbar-wrapper{
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
}

.topbar-left{
display:flex;
align-items:center;
gap:8px;
}

.topbar-left i{
color:#ffc107;
margin-right:4px;
}

.authority strong{
color:#66cc33;
font-weight:600;
}

.divider{
margin:0 6px;
color:#999;
}

.topbar-right{
display:flex;
align-items:center;
gap:18px;
}

.top-contact{
color:#fff;
text-decoration:none;
display:flex;
align-items:center;
gap:6px;
}

.top-contact:hover{
color:#25D366;
}

.whatsapp i{
color:#25D366;
}

.location-link{
color:#fff;
text-decoration:none;
display:flex;
align-items:center;
gap:6px;
}

.location-link:hover{
color:#25D366;
}















.company-stats{
  background:#ffffff;
  padding:50px 0;
}

.stats-grid{
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  text-align:center;
}

.stat-box{
  flex:1;
  min-width:200px;
  margin:10px;
}

.stat-box h3{
  font-size:36px;
  color:#4CAF50;
  margin-bottom:8px;
}

.stat-box p{
  font-size:16px;
  color:#555;
}









.featured-products{
  padding:70px 0;
  background:#f5f7f9;
}

.section-header{
  text-align:center;
  margin-bottom:50px;
}

.section-header h2{
  font-size:34px;
  font-weight:700;
  margin-bottom:10px;
}

.products-wrapper{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:30px;
}

.product-item{
  background:#fff;
  border-radius:8px;
  overflow:hidden;
  box-shadow:0 8px 20px rgba(0,0,0,0.05);
  transition:0.3s;
  text-align:center;
}

.product-item:hover{
  transform:translateY(-6px);
  box-shadow:0 12px 30px rgba(0,0,0,0.12);
}

.product-item img{
  width:100%;
  height:220px;
  object-fit:contain;
  padding:20px;
  background:#fafafa;
}

.product-info{
  padding:20px;
}

.product-info h3{
  font-size:18px;
  margin-bottom:6px;
}

.product-info p{
  font-size:14px;
  color:#666;
  margin-bottom:15px;
}

.btn-product{
  display:inline-block;
  padding:10px 18px;
  background:#4CAF50;
  color:#fff;
  text-decoration:none;
  border-radius:4px;
  font-size:14px;
}

.btn-product:hover{
  background:#3f8f42;
}