/*-----------------------------------------------------------------------------------
Template Name: labella - The Responsive Multipurpose Shopify Theme
Description: The eCommerce Bootstrap4 Shopify Theme
Author: Webheay Theme
Author URI: http://webheay.co.uk
Version: 1.0
-----------------------------------------------------------------------------------
CSS INDEX
=========================================
01. Theme default CSS
- Common Classes
- Section Padding
02. Element
- Button Style
- Section Title Css
- Breadcrumb Style
- Paginatoin Css
03. Header-top css
- Header Bottom Css
- Main Menu Css
- Right Blok Box Css
- Shopping Cart Css
04. Hero Css
05. About Area Css
06. Product Area Css
07. Banner Area Css
08. Testimonial Area Css
09. Instagram Css
10. Footer Area Css
11. Mobile Menu Css
12. Service Area Css
13. Blog Page Css
14. sidebar Css
15. Product Details Css
16. Checkout Page Css
17. Cart Page Css
18. My Account Page Css
19. Login And Register Page Css
20. About Us Page Css
21. Contact Us Page Css
22. Error 404 Page Css
23. Compare Page Css
24. Frequently Question Page Css
-----------------------------------------------------------------------------------*/
/* transition */
/* flex */
/* transform */
/* opacity */

/*=====================================
    Google Font
======================================*/
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,700&display=swap');

@font-face {
    font-family: 'DM Sans Bold';
    font-style: normal;
    font-weight: normal;
    src: url('DMSans-Bold.woff') format('woff');
}

@font-face {
    font-family: 'Futura PT';
    src: url('FuturaPT-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Futura PT';
    src: url('FuturaPT-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Futura Bk BT';
    src: url('FuturaBT-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Futura PT';
    src: url('FuturaPT-DemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Futura PT';
    src: url('FuturaPT-Heavy.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

/*=====================================
    Typography
======================================*/
body {
    font-size: 14px;
    font-family: 'DM Sans', sans-serif;
    font-weight: 400;
    line-height: normal;
    letter-spacing: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/*=====================================
    Headings
======================================*/
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #222222;
    margin: 0;
    padding: 0;
    font-family: 'Futura PT', sans-serif;
    font-weight: 600;
    line-height: normal;
}

/*=====================================
    lazyload css
======================================*/
.lazyload,
.lazyloading {
    opacity: 0;
}
.lazyload,
.lazyloading {
    background: url("loading-black-small.svg") center center no-repeat #fff !important;
    position: relative;
    border-color: transparent !important;
    opacity: 1 !important;
    transition: all 0s ease-in-out !important;
    -moz-transition: all 0s ease-in-out !important;
    -webkit-transition: all 0s ease-in-out !important;
    -ms-transition: all 0s ease-in-out !important;
    -o-transition: all 0s ease-in-out !important;
}

/*=====================================
    container css
======================================*/
.container {
    max-width: 1400px;
}
.container-fluid{
    padding: 0 45px;
}
@media (max-width: 1599px) and (min-width: 1360px) {
    .container{
        max-width: 1140px;
    }
}
@media (max-width: 1366px) and (min-width: 767px) {
    .container{
       max-width: 1140px;
    }
}
@media (max-width: 1359px) and (min-width: 1200px) {
    .container{
        max-width: 1140px;
    }
}
@media (max-width: 1199px){
    .container{
        max-width: 980px;
    }
    .container-fluid{
        padding: 0 30px;
    }
}
@media (max-width: 991px){
    .container{
        max-width: 720px;
    }
}
@media (max-width: 767px){
    .container{
        max-width: 100%;
    }
    .container-fluid{
        padding: 0 15px;
    } 
}

/*=====================================
    tag element css
======================================*/
a {
    color: #222;
    display: inline-block;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}
a:focus{
    outline: none;
}
a:hover {
    text-decoration: none;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}
span {
    display: inline-block;
}
button,
button:hover{
    -webkit-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}
button,
button:focus,
a:focus {
    outline: none;
}
p{
    line-height: 25px;
    margin-bottom: 0px;
}

.btn:focus,
.btn:active:focus,
.btn.active:focus {
    outline: none;
    box-shadow: none;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
input,
select,
textarea{
    font-size: 16px;
    padding: 12px 30px;
    border: 1px solid #e2e2e2;
    border-radius: 5px;
    font-weight: 400;
    font-family: 'DM Sans', sans-serif;
}
textarea{
    display: block;
    resize: none;
}
input:focus,
select:focus,
textarea:focus {
    outline: none;
    border: 1px solid #e2e2e2;
    box-shadow: none;
}

/*=====================================
    body hidden css
======================================*/
body.hidden {
    overflow-y: hidden;
    padding-right: 17px;
}
@media (max-width: 1199px){
    body.hidden {
        padding-right: 0px;
    }
}

/*=====================================
    col center css
======================================*/
.col-center {
    margin-left: auto;
    margin-right: auto;
}

/*=====================================
    tooltip css
=======================================*/
.tooltip {
    text-transform: uppercase;
    font-size: 13px;
}

/*=====================================
    sidesection title css
======================================*/
.side-section-capture{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
}
.side-section-title h2{
    font-size: 44px;
    text-transform: capitalize;
    font-weight: 900;
    line-height: 1;
}
.side-section-title p{
    font-size: 16px;
    margin-top: 16px;
}
@media (max-width: 1199px) {
    .side-section-title h2{
        font-size: 30px;
    }
}
@media (max-width: 767px){
    .side-section-capture{
        margin-bottom: 30px;
    }
    .side-section-title h2{
        font-size: 20px;
    }
    .side-section-title p{
        margin-top: 10px;
    }
}
@media (max-width: 479px){
    .side-section-capture{
        flex-direction: column;
        align-items: flex-start;
    }
}

/*=====================================
    section title css
======================================*/
.section-capture{
    margin-bottom: 40px;
    text-align: center;
}
.section-title h2{
    font-size: 44px;
    text-transform: capitalize;
    font-weight: 900;
    line-height: 1;
}
.section-title span.title-img{}
.section-title p{
    font-size: 16px;
    max-width: 60%;
    margin: 16px auto 0;
}
@media (max-width: 1199px) {
    .section-title h2{
        font-size: 30px;
    }
    .section-title p{
        max-width: 70%;
    }
}
@media (max-width: 991px) {
    .section-title p{
        max-width: 95%;
    }
}
@media (max-width: 767px) {
    .section-capture{
        margin-bottom: 30px;
    }
    .section-title h2 {
        font-size: 20px;
    }
    .section-title p{
        max-width: 100%;
        margin: 10px auto 0;
    }
}

/*=====================================
    tab css
======================================*/
.tab ul.nav-tabs li a {
    display: block;
    white-space: nowrap;
}
@media (max-width: 767px) {}

/*=====================================
    product tab slider css
======================================*/
.product-tab-ptb .tabs {
    padding: 20px;
    border: 1px solid #e2e2e2;
    background-color: #fff;
}
.product-tab-ptb .tab ul.nav-tabs{
    display: flex;
    justify-content: flex-start;
    overflow-x: auto;
    flex-wrap: nowrap;
    max-width: 100%;
    border-bottom: none;
    scrollbar-width: thin;
    -webkit-scrollbar-width: thin;
}
.product-tab-ptb .tab ul.nav-tabs::-webkit-scrollbar {
    height: 0px;
}
.product-tab-ptb .tab ul.nav-tabs li{
    margin-right: 30px;
}
.product-tab-ptb .tab ul.nav-tabs li:last-child{
    margin-right: 0;
}
.product-tab-ptb .tab ul.nav-tabs li a{
    color: #999;
    font-size: 14px;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    font-weight: 500;
    -webkit-transition: all 0s ease-in-out 0s;
    -o-transition: all 0s ease-in-out 0s;
    transition: all 0s ease-in-out 0s;
}
.product-tab-ptb .swiper-container.feture_pro_tab{}
@media (max-width: 1199px) {
    .product-tab-ptb .tab ul.nav-tabs{
        margin-top: 30px;
    }
}
@media (max-width: 767px) {
    .product-tab-ptb .tab ul.nav-tabs{
        margin-top: 20px;
    }
    .product-tab-ptb .tab ul.nav-tabs li{
        margin-right: 15px;
    }
    .product-tab-ptb .swiper-container.feture_pro_tab{}
}

/*=====================================
    header css
======================================*/
.header-area{
    padding: 20px 0;
    position: relative;
    z-index: 3;
}
.header-area .header-main {
    display: flex;
    align-items: center;
}
.header-area .header-main .header-element.search-wrap{ 
    width: 16.67%;
}
.header-area .header-main .search-wrap .search-rap a.search-crap{
    display: none;
}
.header-area .header-main .search-wrap .search-rap .crap-search.collapse:not(.show){
    display: block;
}
.header-area .header-main .search-wrap .search-rap .crap-search{
    width: 240px;
}
.header-area .header-main .search-wrap .search-rap .form-search input.input-text{
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, 0.3);
}
.header-area .header-main .search-wrap .search-rap .form-search button{
    color: #fff;
}
.header-area .header-main .header-element.logo{ 
    width: 66.66%;
    text-align: center;
}
.header-area .header-main .header-element.right-block-box{
    width: 16.67%;
}
@media (max-width: 1359px) and (min-width: 1200px){
    .header-area .header-main .header-element.search-wrap{
        width: 30%;
    }
    .header-area .header-main .header-element.logo{ 
        width: 40%;
        text-align: center;
    }
    .header-area .header-main .header-element.right-block-box{
        width: 30%;
    }
}
@media (max-width: 1199px) {
    .header-area{
        padding: 15px 0;
    }
    .header-area .header-main .header-element.toggler-wrap{
        margin-right: 15px;
    }
    .header-area .header-main .search-wrap .search-rap{
        position: relative;
    }
    .header-area .header-main .search-wrap .search-rap a.search-crap{
        display: block;
        position: relative;
    }
    .header-area .header-main .search-wrap .search-rap a.search-crap span.close-svg,
    .header-area .header-main .search-wrap .search-rap a.search-crap[aria-expanded="true"] span.search-svg,
    .header-area .header-main .search-wrap .search-rap a.search-crap[aria-expanded="false"] span.close-svg{
        display: none;
        opacity: 0;
        visibility: hidden;
    }
    .header-area .header-main .search-wrap .search-rap a.search-crap[aria-expanded="false"] span.search-svg,
    .header-area .header-main .search-wrap .search-rap a.search-crap[aria-expanded="true"] span.close-svg{
        display: block;
        opacity: 1;
        visibility: visible;
    }
    .header-area .header-main .search-wrap .search-rap .crap-search.collapse:not(.show){
        display: none;
    }
    .header-area .header-main .search-wrap .search-rap .form-search input.input-text{
        background-color: #fff;
        border: 1px solid #e2e2e2;
    }
    .header-area .header-main .search-wrap .search-rap .form-search button{
        color: #222;
    }
}
@media (max-width: 767px) {
    .header-area .header-main{
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        position: relative;
    }
    .header-area .header-main .header-element.toggler-wrap{
        order: -1;
        width: 25%;
        margin-right: 0px;
    }
    .header-area .header-main .header-element.search-wrap{ 
        width: 25%;
    }
    .header-area .header-main .search-wrap .search-rap{
        text-align: right;
        position: unset;
    }
    .header-area .header-main .header-element.logo{ 
        order: -1;
        width: 50%;
        text-align: center;
    }
    .header-area .header-main .header-element.right-block-box{
        width: 100%;
    }
}

/* logo css */
@media (max-width: 767px) {
    .header-area .header-main .logo a img{
        /*max-width: 119px;*/
    }
}

/* right block css */
.right-block-box {
    display: flex;
    justify-content: flex-end;
}
.right-block-box ul.shop-element{
    display: flex;
    align-items: center;
}
.right-block-box ul.shop-element li.side-wrap{
    position: relative;
    margin-left: 30px;
}
.right-block-box ul.shop-element li.side-wrap:first-child{
    margin-left: 0;
}
@media (max-width: 1199px){
    .right-block-box ul.shop-element li.side-wrap{
        margin-left: 15px;
    }
}
@media (max-width: 767px){
    .right-block-box ul.shop-element{
        width: 100%;
        justify-content: space-between;
        padding-top: 15px;
        margin-top: 14px;
        border-top: 1px solid rgba(255, 255, 255, 0.2);
    }
    .right-block-box ul.shop-element li.side-wrap{
        margin-left: 0px;
    }
}

/* button toggler css */
button.navbar-toggler{
    display: none;
    color: #fff;
    padding: 0;
    border: none;
    outline: none;
    border-radius: 0;
    line-height: 0;
    -webkit-transition: all 0s ease-in-out 0s;
    -o-transition: all 0s ease-in-out 0s;
    transition: all 0s ease-in-out 0s;
}
button.navbar-toggler svg{
    width: 24px;
    height: 24px;
}
@media (max-width: 1199px) {
    button.navbar-toggler {
        display: block;
    }
}

/*=====================================
    header bottom css
======================================*/
.header-bottom-area{
    position: relative;
    z-index: 2;
}
@media (max-width: 1199px) {
    .header-bottom-area{
        position: unset;
    }
}

/* box-heder css */
.main-menu-area {
    display: flex;
    justify-content: center;
}
.main-menu-area .main-navigation .box-header{
    display: none;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 1;
    line-height: 0;
}
.main-menu-area .main-navigation .box-header button.close-box{
    font-size: 16px;
    color: #222;
}
@media (max-width: 1199px) {
    .main-menu-area{
        position: fixed;
        top: 0;
        left: -300px;
        width: 300px;
        height: 100%;
        overflow-y: auto;
        background-color: #fff;
        z-index: 5;
        opacity: 0;
        visibility: hidden;
    }
    .main-menu-area.active{
        left: 0px;
        opacity: 1;
        visibility: visible;
    }
    .main-menu-area,
    .main-menu-area.active{
        -webkit-transition: all 0.3s ease-in-out 0s;
        -o-transition: all 0.3s ease-in-out 0s;
        transition: all 0.3s ease-in-out 0s;
    }
    .main-menu-area .main-navigation{
        width: 100%;
    }
    .main-menu-area .main-navigation .box-header{
        display: block;
    }
}

/* mainmenu area css */
.main-menu-area .main-navigation .navbar-collapse .vegamenu-content{
    position: relative;
    width: 25%;
    margin-right: 15px;
}
.main-menu-area .main-navigation .navbar-collapse .megamenu-content{}
@media (max-width: 1199px) {
    .main-menu-area .main-navigation .navbar-collapse{
        display: flex;
        flex-direction: column-reverse;
        margin-top: 35px;
    }
    .main-menu-area .main-navigation .navbar-collapse .vegamenu-content{
        width: 100%;
        margin-right: 0;
    }
    .main-menu-area .main-navigation .navbar-collapse .megamenu-content{
        width: 100%;
        border-bottom: 1px solid #e2e2e2;
    }
}

/*=====================================
    vega-menu css
======================================*/
.vegamenu-content .browse-cat{
    color: #fff;
    font-size: 16px;
    padding: 12px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;
    font-weight: 500;
    position: relative;
    -webkit-transition: all 0s ease-in-out 0s;
    -o-transition: all 0s ease-in-out 0s;
    transition: all 0s ease-in-out 0s;
}
.vegamenu-content .browse-cat span{
    text-transform: uppercase;
}
.vegamenu-content .browse-cat i{
    font-size: 17px;
}
.vegamenu-content .vegawrap{
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background-color: #fff;
    border: 1px solid #e2e2e2;
    border-top: none;
    z-index: 3;
}
.vegamenu-content .vegawrap ul.vega-menu{
    position: relative;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link{
    padding: 0 15px;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link a.link-title{
    color: #666;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0px;
    text-transform: capitalize;
    border-top: 1px solid #e2e2e2;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link:first-child a.link-title{
    border-top: none;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link a.link-title.link-title-lg{
    display: none;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link a.link-title img{
    margin-right: 10px;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link a.link-title span.sp-link-title{
    display: flex;
    align-items: center;
    margin-right: auto;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link a.link-title span.sp-link-title span{
    color: #fff;
    font-size: 8px;
    margin-left: 5px;
    width: 30px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ee433f;
    text-transform: uppercase;
    border-radius: 3px;
    position: relative;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link a.link-title span.sp-link-title span::before{
    content: "";
    position: absolute;
    left: -9px;
    bottom: 50%;
    transform: translateY(50%);
    height: 10px;
    width: 10px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent #ee3b36 transparent transparent;
    border-image: none;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.collapse:not(.show){
    display: block;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu {
    position: absolute;
    top: 0px;
    left: 100%;
    padding: 15px 0;
    width: max-content;
    width: -moz-max-content;
    background-color: #fff;
    z-index: 2;
    border: 1px solid #e2e2e2;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translate(20px,0);
    -moz-transform: translate(20px,0);
    -o-transform: translate(20px,0);
    -ms-transform: translate(20px,0);
    transform: translate(20px,0);
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link:hover ul.dropdown-submenu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translate(0,0);
    -moz-transform: translate(0,0);
    -o-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0);
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu,
.vegamenu-content .vegawrap ul.vega-menu li.menu-link:hover ul.dropdown-submenu{
    -webkit-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.sub-menu {
    width: 280px;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.sub-menu li.submenu-li {
    padding: 0 15px;
    margin-top: 15px;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.sub-menu li.submenu-li:first-of-type {
    margin-top: 0px;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.sub-menu li.submenu-li a{
    display: block;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.mega-menu li.megamenu-li,
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner {
    display: inline-block;
    float: left;
    padding: 0 15px;
    width: 25%;
    min-width: 200px;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.banner-menu div.menu-banner.bottom{
    margin: 0px 15px;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.banner-menu div.menu-banner.bottom a{
    display: inline-block;
    float: left;
    width: 50%;
    margin-top: 30px;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.banner-menu div.menu-banner.bottom a img{
    width: 100%;
    margin-left: 30px;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.banner-menu div.menu-banner.bottom:first-of-type a img{
    margin-left: 0px;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.mega-menu li.megamenu-li h2{
    font-size: 16px;
    text-transform: capitalize;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e2e2e2;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.mega-menu li.megamenu-li a.sublink-title{
    display: none;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-supmenu.collapse:not(.show){
    display: block;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-supmenu li.supmenu-li{
    margin-top: 10px;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-supmenu li.supmenu-li:first-of-type{
    margin-top: 0;
}
.vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-supmenu li.supmenu-li a{
    display: block;
    color: #666;
}
@media (max-width: 1199px){
    .vegamenu-content .browse-cat{
        color: #222;
        font-size: 16px;
        padding: 10px 15px;
        justify-content: flex-start;
        flex-direction: row;
        font-weight: 600;
        background-color: #fff;
        border: none;
        border-top: 1px solid #e2e2e2;
        border-radius: 0;
    }
    .vegamenu-content a.browse-cat[aria-expanded="false"]{
        color: #222;
    }
    .vegamenu-content .browse-cat span{
        margin-left: 10px;
        text-transform: capitalize;
    }
    .vegamenu-content .vegawrap{
        position: unset;
        border: none;
    }
    .vegamenu-content .vegawrap ul.vega-menu{
        display: flex;
        flex-direction: column;
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link{
        padding: 0 0;
        border-top: 1px solid #e2e2e2;
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link a.link-title{
        display: none;
        color: #222;
        padding: 10px 15px;
        border-top: none;
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link a.link-title i{
        -webkit-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        transform: rotate(90deg);
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link a.link-title.link-title-lg{
        display: flex;
        justify-content: space-between;
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link a.link-title.link-title-lg[aria-expanded="false"]{
        color: #222;
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link a.link-title.link-title-lg[aria-expanded="true"] i{
        -webkit-transform: rotate(270deg);
        -o-transform: rotate(270deg);
        transform: rotate(270deg);
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.collapse:not(.show){
        display: none;
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu{
        position: unset;
        padding: 15px 0 15px 15px;
        border: none;
        border-top: 1px solid #e2e2e2;
        opacity: 1;
        visibility: visible;
        filter: alpha(opacity=100);
        -webkit-transform: scale(1,1);
        -moz-transform: scale(1,1);
        -ms-transform: scale(1,1);
        -o-transform: scale(1,1);
        transform: scale(1,1);
        -webkit-transform-origin: unset;
        transform-origin: unset;
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.sub-menu,
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.mega-menu,
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.banner-menu{
        width: 100%;
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.mega-menu li.megamenu-li,
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner{
        display: block;
        float: none;
        width: 100%;
        min-width: 100%;
        margin-top: 15px;
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.mega-menu li.megamenu-li:first-of-type,
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner:first-of-type{
        margin-top: 0px;
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.banner-menu div.menu-banner.bottom{
        margin: 0 0;
        padding: 0 15px;
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.banner-menu div.menu-banner.bottom a{
        display: block;
        float: none;
        width: 100%;
        margin-top: 15px;
    }
    .vegamenu-content .vegawrap ul.vega-menu li.menu-link ul.dropdown-submenu.banner-menu div.menu-banner.bottom a img{
        margin-left: 0;
    }
}

/*=====================================
    main-menu css
======================================*/
.megamenu-content a.browse-cat{
    display: none;
    color: #666;
    font-size: 16px;
    padding: 15px 15px;
    font-weight: 700;
    border-top: 1px solid #e2e2e2;
    -webkit-transition: all 00s ease-in-out 0s;
    -o-transition: all 00s ease-in-out 0s;
    transition: all 00s ease-in-out 0s;
}
.megamenu-content a.browse-cat i{
    font-size: 17px;
}
.megamenu-content a.browse-cat span{
    margin-left: 10px;
}
.megamenu-content .mainwrap.collapse:not(.show){
    display: block;
}
.megamenu-content .mainwrap ul.main-menu{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title{
    color: #fff;
    font-size: 13px;
    display: flex;
    align-items: center;
    padding: 20px 20px;
    position: relative;
    text-transform: uppercase;
    font-weight: 700;
    white-space: nowrap;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 20px;
    right: 20px;
    height: 2px;
    background-color: transparent;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title::after,
.megamenu-content .mainwrap ul.main-menu li.menu-link:hover a.link-title::after{
    -webkit-transition: all .3s ease-in-out 0s;
    -o-transition: all .3s ease-in-out 0s;
    transition: all .3s ease-in-out 0s;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title.link-title-lg{
    display: none;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title span.sp-link-title{
    display: flex;
    align-items: center;
    position: relative;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title i{
    font-size: 15px;
    margin-left: 5px;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.collapse:not(.show){
    display: block;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu {
    position: absolute;
    top: calc(100% + 15px);
    padding: 30px 15px;
    background-color: #fff;
    z-index: 3;
    opacity: 0;
    visibility: hidden;
    border: 1px solid #e2e2e2;
    box-shadow: 0 0 15px rgb(0, 0, 0, 0.15);
}
.megamenu-content .mainwrap ul.main-menu li.menu-link:hover ul.dropdown-submenu {
    top: 100%;
    opacity: 1;
    visibility: visible;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu,
.megamenu-content .mainwrap ul.main-menu li.menu-link:hover ul.dropdown-submenu{
    -webkit-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

/* submenu css */
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.sub-menu{
    left: auto;
    width: 200px;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.sub-menu li.submenu-li {
    padding: 0 15px;
    margin-top: 15px;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.sub-menu li.submenu-li:first-child {
    margin-top: 0px;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.sub-menu li.submenu-li a{
    display: block;
    color: #666;
    font-size: 15px;
}

/* megamenu css */
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu{
    width: max-content;
    -ms-width: max-content;
    right: 0;
    left: 0;
    margin: 0 auto;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu li.megamenu-li{
    display: inline-block;
    float: left;
    padding: 0 15px;
    width: 25%;
    min-width: 250px;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu li.megamenu-li h2.sublink-title{
    font-size: 18px;
    text-transform: capitalize;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu li.megamenu-li a.sublink-title{
    display: none;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-supmenu.collapse:not(.show){
    display: block;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-supmenu li.supmenu-li{
    margin-top: 15px;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-supmenu li.supmenu-li:first-child{
    margin-top: 21px;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-supmenu li.supmenu-li a{
    color: #666;
    font-size: 15px;
    display: block;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
}

/* megamenu with banner css */
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu.banner-menu div.menu-banner.bottom{
    margin-left: -30px;
    padding: 0 15px;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu.banner-menu div.menu-banner.bottom a{
    display: inline-block;
    float: left;
    width: calc(50% - 30px);
    margin-top: 25px;
    margin-left: 30px;
}

/* bannermenu css */
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu{
    width: max-content;
    -ms-width: max-content;
    right: 0;
    left: 0;
    margin: 0 auto;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner{
    margin-left: -30px;
    padding: 0 15px;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner .banner-wrap{
    display: inline-block;
    float: left;
    width: calc(50% - 30px);
    margin-left: 30px;
    text-align: center;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner .banner-wrap a{
    display: block;
}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner .banner-wrap a.menu-banner-img{}
.megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner .banner-wrap a.menu-banner-title{
    color: #666;
    font-size: 15px;
    font-weight: 500;
    margin-top: 15px;
}
@media (max-width: 1199px) {
    .megamenu-content a.browse-cat{
        display: flex;
        align-items: center;
    }
    .megamenu-content a.browse-cat[aria-expanded="false"]{
        color: #666;
    }
    .megamenu-content .mainwrap.collapse:not(.show){
        display: none;
    }
    .megamenu-content .mainwrap ul.main-menu{
        flex-direction: column;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link{
        border-top: 1px solid #e2e2e2;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title{
        display: none;
        padding: 15px 15px;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title::after{
        display: none;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title.link-title-lg{
        display: flex;
        justify-content: space-between;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title,
    .megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title.link-title-lg[aria-expanded="false"]{
        color: #666;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title.link-title-lg[aria-expanded="true"] i{
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.collapse:not(.show){
        display: none;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu{
        position: unset;
        padding: 0px 15px 0px 25px;
        border: none;
        border-top: 1px solid #e2e2e2;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
    }

    /* submenu css */
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.sub-menu{
        width: 100%;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.sub-menu li.submenu-li {
        padding: 0px;
        margin-top: 0px;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.sub-menu li.submenu-li a{
        padding-top: 10px;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.sub-menu li.submenu-li:first-child a{
        padding-top: 15px;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.sub-menu li.submenu-li:last-child a{
        padding-bottom: 15px;
    }

    /* megamenu css */
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu{
        width: 100%;
        -ms-width: 100%;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu li.megamenu-li{
        display: block;
        float: none;
        padding: 0;
        margin-top: 19px;
        width: 100%;
        min-width: 100%;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu li.megamenu-li:first-child{
        margin-top: 15px;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu li.megamenu-li:last-child{
        margin-bottom: 15px;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-supmenu li.supmenu-li{
        margin-top: 10px;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-supmenu li.supmenu-li:first-child{
        margin-top: 21px;
    }

    /* megamenu with banner css */
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu.banner-menu div.menu-banner.bottom{
        padding: 0;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu.banner-menu div.menu-banner.bottom a{
        display: block;
        float: none;
        width: calc(100% - 30px);
        margin-top: 30px;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu.banner-menu div.menu-banner.bottom:first-of-type a{
        margin-top: 25px;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.mega-menu.banner-menu div.menu-banner.bottom:last-of-type a{
        margin-bottom: 15px;
    }

    /* bannermenu css */
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu{
        width: 100%;
        -ms-width: 100%;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner{
        padding: 0px;
        margin-top: 30px;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner:first-child{
        margin-top: 15px;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner:last-child{
        margin-bottom: 15px;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner .banner-wrap{
        display: block;
        float: none;
        width: calc(100% - 30px);
        text-align: left;
    }
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner .banner-wrap a.menu-banner-img{}
    .megamenu-content .mainwrap ul.main-menu li.menu-link ul.dropdown-submenu.banner-menu li.menu-banner .banner-wrap a.menu-banner-title{}
}

/* product grid-list css */
.product-grid-list .single-product-wrap{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    background-color: #fff;
}
.product-grid-list .single-product-wrap .product-image{
    width: 200px;
}
.product-grid-list .single-product-wrap:hover .product-image a.pro-img .img1{
    opacity: 1;
}
.product-grid-list .single-product-wrap .product-content{
    width: calc(100% - 200px);
    justify-content: center;
    padding: 20px 0px 20px 20px;
}
.product-grid-list .single-product-wrap .product-content .product-action{
    display: flex;
    margin-top: 14px;
}
.product-grid-list .single-product-wrap .product-content .product-action,
.product-grid-list .single-product-wrap:hover .product-content .product-action{
    -webkit-transition: all 0s ease-in-out 0s;
    -o-transition: all 0s ease-in-out 0s;
    transition: all 0s ease-in-out 0s;
}
.product-grid-list .single-product-wrap .product-content .product-action a{
    color: #333;
    font-size: 13px;
    width: 36px;
    height: 36px;
    margin-right: 5px;
    background-color: transparent;
    text-transform: capitalize;
    font-weight: 700;
    border: 1px solid #e2e2e2;
    border-radius: 5px;
}
.product-grid-list .single-product-wrap .product-content .product-action a:hover{
    color: #fff;
}
.product-grid-list .single-product-wrap .product-content .product-action a svg{
    width: 13px;
    height: 13px;
    stroke-width: 3px;
}
.product-grid-list .single-product-wrap .product-content .product-action a.add-to-cart{
    width: 120px;
    height: 36px;
    padding: 0 15px;
}
.product-grid-list .single-product-wrap .product-content .product-action a.add-to-cart span.cart-title{
    line-height: 1;
}
@media (max-width: 479px) {
    .product-grid-list .single-product-wrap{}
    .product-grid-list .single-product-wrap .product-image{
        width: 100%;
    }
    .product-grid-list .single-product-wrap .product-content{
        width: 100%;
        padding: 20px 15px;
    }
}

/*=====================================
    product css
======================================*/
.shop-product-wrap ul.product-view{
    margin-top: -50px;
}
.shop-product-wrap ul.product-view li.st-col-item{
    margin-top: 50px;
}
@media (max-width: 991px) {
    .shop-product-wrap ul.product-view{
        margin-top: -30px;
    }
    .shop-product-wrap ul.product-view li.st-col-item{
        margin-top: 30px;
    }
}

/* grid css */
.shop-product-wrap.grid-3 ul.product-view{
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -30px;
}
.shop-product-wrap.grid-3 ul.product-view li.st-col-item{
    display: flex;
    width: calc(33.33% - 30px);
    margin-left: 30px;
}
.shop-product-wrap.grid-3 ul.product-view li.st-col-item.no-col-item{
    width: calc(25% - 30px);
}
.shop-product-wrap .single-product-wrap .product-content h6 a{
    -webkit-transition: all 0s ease-in-out 0s;
    -o-transition: all 0s ease-in-out 0s;
    transition: all 0s ease-in-out 0s;
}
@media (max-width: 1199px) {
    .shop-product-wrap.grid-3 ul.product-view li.st-col-item{
        width: calc(50% - 30px);
    }
    .shop-product-wrap.grid-3 ul.product-view li.st-col-item.no-col-item{
        width: calc(33.33% - 30px);
    }
}
@media (max-width: 991px) {
    .shop-product-wrap.grid-3 ul.product-view li.st-col-item.no-col-item{
        width: calc(50% - 30px);
    }
}
@media (max-width: 767px) {
    .shop-product-wrap.grid-3 ul.product-view{
        margin-left: -15px;
    }
    .shop-product-wrap.grid-3 ul.product-view li.st-col-item{
        width: calc(50% - 15px);
        margin-left: 15px;
    }
    .shop-product-wrap.grid-3 ul.product-view li.st-col-item.no-col-item{
        width: calc(50% - 15px);
    }
}
@media (max-width: 479px) {
    .shop-product-wrap.grid-3 ul.product-view li.st-col-item,
    .shop-product-wrap.grid-3 ul.product-view li.st-col-item.no-col-item{
        width: calc(100% - 15px);
    }
}

/* list css */
.shop-product-wrap.grid-1 ul.product-view li.st-col-item .single-product-wrap{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -30px;
    background-color: transparent;
    border-radius: 0;
    overflow: visible;
}
.shop-product-wrap.grid-1 ul.product-view li.st-col-item .single-product-wrap .product-image{
    width: calc(33.33% - 30px);
    margin-left: 30px;
    border-radius: 5px;
}
.shop-product-wrap.grid-1 ul.product-view li.st-col-item.no-col-item .single-product-wrap .product-image{
    width: calc(25% - 30px);
}
.shop-product-wrap.grid-1 ul.product-view li.st-col-item .single-product-wrap .product-image .product-action{
    display: none;
}
.shop-product-wrap.grid-1 ul.product-view li.st-col-item .single-product-wrap .product-content{
    width: calc(66.67% - 30px);
    justify-content: center;
    margin-left: 30px;
    padding: 30px;
    border-radius: 5px;
}
.shop-product-wrap.grid-1 ul.product-view li.st-col-item.no-col-item .single-product-wrap .product-content{
    width: calc(75% - 30px);
}
.shop-product-wrap.grid-1 .single-product-wrap .product-content h6{
    font-size: 18px;
}
.shop-product-wrap.grid-1 .single-product-wrap .product-content .price-box{
    margin-top: 10px;
}
.shop-product-wrap.grid-1 .single-product-wrap .product-content .product-ratting{
    margin-top: 15px;
}
.shop-product-wrap.grid-1 .single-product-wrap .product-content p.product-description{
    display: block;
    font-size: 16px;
    margin-top: 10px;
}
.shop-product-wrap.grid-1 .single-product-wrap .product-content .product-action{
    display: flex;
    margin-top: 11px;
}
@media (max-width: 1199px) {
    .shop-product-wrap.grid-1 ul.product-view{
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin-left: -30px;
    }
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item{
        width: calc(50% - 30px);
        margin-left: 30px;
        background-color: #fff;
    }
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item.no-col-item{
        width: calc(33.33% - 30px);
    }
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item .single-product-wrap{
        border-radius: 5px;
    }
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item .single-product-wrap .product-image,
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item .single-product-wrap .product-content{
        width: calc(100% - 30px);
        border-radius: 0;
    }
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item.no-col-item .single-product-wrap .product-image,
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item.no-col-item .single-product-wrap .product-content{
        width: calc(100% - 30px);
    }
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item .single-product-wrap .product-content{
        padding: 20px;
    }
}
@media (max-width: 991px){
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item.no-col-item{
        width: calc(50% - 30px);
    }
}
@media (max-width: 767px){
    .shop-product-wrap.grid-1 ul.product-view{
        margin-left: -15px;
    }
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item{
        width: calc(50% - 15px);
        margin-left: 15px;
    }
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item.no-col-item{
        width: calc(50% - 15px);
    }
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item .single-product-wrap{
        margin-left: -15px;
    }
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item .single-product-wrap .product-image,
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item .single-product-wrap .product-content{
        width: calc(100% - 15px);
        margin-left: 15px;
    }
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item.no-col-item .single-product-wrap .product-image,
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item.no-col-item .single-product-wrap .product-content{
        width: calc(100% - 15px);
    }
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item .single-product-wrap .product-content{
        padding: 20px 15px;
    }
}
@media (max-width: 479px){
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item,
    .shop-product-wrap.grid-1 ul.product-view li.st-col-item.no-col-item{
        width: calc(100% - 15px);
    }
}

/* product img css */
.single-product-wrap{
    position: relative;
    background-color: #fff;
    cursor: pointer;
    border-radius: 5px;
    overflow: hidden;
}
.single-product-wrap .product-image{
    position: relative;
    overflow: hidden;
}
.single-product-wrap .product-image a.pro-img{
    display: block;
    position: relative;
}
.single-product-wrap .product-image a.pro-img img{
    width: 100%;
    backface-visibility: hidden;
}
.single-product-wrap:hover .product-image a.pro-img .img1{
    opacity: 0;
}
.single-product-wrap .product-image a.pro-img .img2{
    top: 0;
    position: absolute;
    left: 0;
    right: 0;
    opacity: 0;    
}
.single-product-wrap:hover .product-image a.pro-img .img2{
    opacity: 1;
}
.single-product-wrap .product-image a.pro-img .img1,
.single-product-wrap .product-image a.pro-img .img2{
    -webkit-transition: all 0.5s ease-in-out 0s;
    -o-transition: all 0.5s ease-in-out 0s;
    transition: all 0.5s ease-in-out 0s;
}

/* product stockout css */
.single-product-wrap .product-image.stock-out{
    position: relative;
    cursor: not-allowed;
}
.single-product-wrap .product-image.stock-out::after{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    opacity: 0.7;
}

/* product timer css css */
.single-product-wrap .product-image .timer-section{
    width: auto;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    padding: 10px;
}

/* product action button css */
.single-product-wrap .product-image .product-action{
    display: flex;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 15px;
    z-index: 1;
}
.single-product-wrap .product-image .product-action,
.single-product-wrap:hover .product-image .product-action{
    -webkit-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}
.single-product-wrap .product-action a{
    color: #fff;
    font-size: 16px;
    height: 40px;
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #222;
    margin-right: 10px;
    border-radius: 100%;
    line-height: 0;
}
.single-product-wrap .product-action a:last-child{
    margin-right: 0;
}
.single-product-wrap .product-image .product-action a{
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
}
.single-product-wrap:hover .product-image .product-action a{
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}
.single-product-wrap .product-image .product-action a:nth-child(1) {
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}
.single-product-wrap .product-image .product-action a:nth-child(2) {
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}
.single-product-wrap .product-image .product-action a:nth-child(3) {
    -webkit-transition-delay: 0.3s;
    transition-delay: 0.3s;
}
.single-product-wrap .product-action a svg{
    width: 18px;
    height: 18px;
}
.single-product-wrap .product-content .product-action{
    display: none;
}
@media (max-width: 1199px) {
    .single-product-wrap .product-image .product-action{
        display: none;
    }
    .single-product-wrap .product-content .product-action{
        display: flex;
        margin-top: 15px;
    }
}

/* product content css */
.single-product-wrap .product-content{
    display: flex;
    flex-direction: column;
    padding: 20px 20px 25px;
    background-color: #fff;
}
.single-product-wrap .product-content h6{
    font-size: 15px;
    text-transform: capitalize;
    font-family: 'DM Sans', sans-serif;
    font-weight: 500;
}
.single-product-wrap .product-content h6 a{
    color: #222;
    display: block;
}
.single-product-wrap .product-content .price-box{
    margin-top: 8px;
}
.single-product-wrap .product-content .product-ratting{
    margin-top: 12px;
}
.single-product-wrap .product-content p.product-description{
    display: none;
}
@media (max-width: 767px) {
    .single-product-wrap .product-content{
        padding: 20px 15px;
    }
}

/* product price css */
.price-box{
    display: flex;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    line-height: 1;
}
.price-box span.new-price{
    font-size: 17px;
    font-weight: 700;
}
.price-box .old-price {
    color: #a3a3a3;
    font-size: 14px;
    margin-right: 5px;
    text-decoration: line-through;
    white-space: nowrap;
}
.price-box .old-price .money {
    text-decoration: line-through;
}

/* product rating css */
.product-ratting .spr-badge{
    display: flex;
    line-height: 1;
}
.product-ratting .spr-badge .spr-badge-starrating,
.spr-container .spr-header .spr-summary .spr-summary-starrating,
.spr-container .spr-content .spr-form .spr-form-review .spr-form-review-rating .spr-starrating,
.spr-container .spr-content .spr-reviews .spr-review .spr-review-header .spr-review-header-starratings{
    display: flex;
    margin: 0 0px 0 0;
    line-height: 0;
}
.product-ratting .spr-badge .spr-badge-starrating .spr-icon{
    font-size: 12px !important;
}
.spr-container .spr-header .spr-summary .spr-summary-starrating .spr-icon,
.spr-container .spr-content .spr-form .spr-form-review .spr-form-review-rating .spr-starrating .spr-icon,
.spr-container .spr-content .spr-reviews .spr-review .spr-review-header .spr-review-header-starratings .spr-icon{
    font-size: 14px !important;
}
.product-ratting .spr-badge .spr-badge-starrating .spr-icon,
.spr-container .spr-header .spr-summary .spr-summary-starrating .spr-icon,
.spr-container .spr-content .spr-form .spr-form-review .spr-form-review-rating .spr-starrating .spr-icon,
.spr-container .spr-content .spr-reviews .spr-review .spr-review-header .spr-review-header-starratings .spr-icon{
    top: 0;
    width: auto;
    height: auto;
    margin-right: 1px;
    opacity: 1;
}
.product-ratting .spr-badge .spr-badge-starrating .spr-icon:last-child,
.spr-container .spr-header .spr-summary .spr-summary-starrating .spr-icon:last-child,
.spr-container .spr-content .spr-form .spr-form-review .spr-form-review-rating .spr-starrating .spr-icon:last-child,
.spr-container .spr-content .spr-reviews .spr-review .spr-review-header .spr-review-header-starratings .spr-icon:last-child{
    margin-right: 0;
}
.product-ratting .spr-badge .spr-icon-star::before,
.product-ratting .spr-badge .spr-icon-star-half-alt::before,
.product-ratting .spr-badge .spr-icon-star-empty::before,
.spr-container .spr-header .spr-summary .spr-summary-starrating .spr-icon-star::before,
.spr-container .spr-header .spr-summary .spr-summary-starrating .spr-icon-star-half-alt::before,
.spr-container .spr-header .spr-summary .spr-summary-starrating .spr-icon-star-empty::before,
.spr-container .spr-content .spr-reviews .spr-review .spr-review-header .spr-review-header-starratings .spr-icon-star::before,
.spr-container .spr-content .spr-reviews .spr-review .spr-review-header .spr-review-header-starratings .spr-icon-star-half-alt::before,
.spr-container .spr-content .spr-reviews .spr-review .spr-review-header .spr-review-header-starratings .spr-icon-star-empty::before,
.spr-container .spr-content .spr-form .spr-form-review .spr-form-review-rating .spr-starrating .spr-icon-star::before,
.spr-container .spr-content .spr-form .spr-form-review .spr-form-review-rating .spr-starrating .spr-icon-star-hover::before{
    color: #ffb503;
}
.product-ratting .spr-badge .spr-badge-caption{
    color: #bbb;
    margin-left: 5px;
    padding: 0 10px;
    position: relative;
    text-transform: capitalize;
    line-height: 1;
}
.product-ratting .spr-badge .spr-badge-caption::before{
    content: "(";
    position: absolute;
    left: 0;
}
.product-ratting .spr-badge .spr-badge-caption::after{
    content: ")";
    position: absolute;
    right: 0;
}

/*=====================================
    account page css
======================================*/
.my-account-page .page-title{
    margin-bottom: 40px;
    text-align: center;
}
.my-account-page .page-title span.sub-title{
    display: block;
    font-size: 16px;
    text-transform: uppercase;
    margin-bottom: 9px;
    line-height: 1;
}
.my-account-page .page-title h2{
    font-size: 44px;
    text-transform: capitalize;
    font-weight: 900;
    line-height: 1;
}
@media (max-width: 1199px) {
    .my-account-page .page-title h2 {
        font-size: 30px;
    }
}
@media (max-width: 767px) {
    .my-account-page .page-title{
        margin-bottom: 30px;
    }
    .my-account-page .page-title h2{
        font-size: 20px;
    }
}

/*=====================================
    other page content main title css
======================================*/
.content-main-title{
    margin-bottom: 40px;
    text-align: center;
}
.content-main-title h2 {
    font-size: 44px;
    text-transform: capitalize;
    font-weight: 900;
    line-height: 1;
}
.content-main-title span.title-img{}
.content-main-title p{
    font-size: 16px;
    max-width: 60%;
    margin: 16px auto 0;
}
@media (max-width: 1199px) {
    .content-main-title h2 {
        font-size: 30px;
    }
    .content-main-title p{
        max-width: 70%;
    }
}
@media (max-width: 991px) {
    .content-main-title p{
        max-width: 95%;
    }
}
@media (max-width: 767px) {
    .content-main-title{
        margin-bottom: 30px;
    }
    .content-main-title h2 {
        font-size: 20px;
    }
    .content-main-title p{
        max-width: 100%;
        margin: 10px auto 0;
    }
}
/* select2 */
.select2 .selection{
    width: 100%;
}
.select2 .selection .select2-selection{
    width: 100%;
    border-radius: 8px;
    height: calc(1.8em + .75rem + 5px);
    padding: .375rem .75rem;
    border: 1px solid #afafaf;
}
.select2-container .select2-selection--single .select2-selection__rendered{
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow{
    height: calc(1.8em + .75rem + 5px) !important;
}
.select2-container{
    margin-top: -5px !important;
}