@import url('https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200..1000;1,200..1000&family=Parkinsans:wght@300..800&display=swap');


/* main styles*/

:root {
    --main-theme-color: #980dfd;
    --white-color: #fff;
    --black-color: #222;
    --border-blocks: #d9d9d9;
    --breadcrumb-background: #ededed;
}

body::-webkit-scrollbar-track {
  background: var(--black-color);        
}
body::-webkit-scrollbar-thumb {
    cursor: pointer;
    background: var(--main-theme-color);
    border-radius:10px;
}
body::-webkit-scrollbar {
    background-color: var(--black-color);
    width: 8px;
    height: 8px;
}
*{
    transition:0.3s cubic-bezier(0.85, 0, 0.15, 1);
}
:hover{
    transition:0.3s cubic-bezier(0.85, 0, 0.15, 1);
}
body{
    margin:0;
    position:relative;
    font-family: 'Parkinsans', sans-serif!important;
    background: var(--white-color);
}
span, a, p, h1, h2, h3, h4, h5, h6, label, ol, ul, li, button, input, textarea{
    font-family: 'Parkinsans', sans-serif!important;
}
a {
    color: #666;
    text-decoration: none;
    background-color: transparent;
    transition: all .4s ease;
}
.wrapper{
    width: 100%;
    position: relative;
}
section{
    position: relative;
    margin: auto;
    width: 100%;
    display: flex;
    padding: 40px 0;
    transition: padding-top 1s ease;
    background: var(--white-color);
    z-index: 3;
    overflow: hidden;
        max-width: 1920px;
}

.mainButton{
    background: var(--main-theme-color);
    border: 0;
    outline: 0;
    color: #fff;
    padding: 12px 24px;
    border-radius: 10px;
    font-weight: 600;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    grid-gap: 8px;
    width: max-content;
}
.mainButton:hover{
    opacity: 0.7;
}
.mainButton svg{
        width: 24px;
    height: 24px;
}
.customButtonOne{
    background: var(--black-color);
    color: var(--white-color);
}
.container{
        max-width: 1680px;
}

/* preloader */

.preloaderAngel{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--white-color);
    z-index: 1000;
    display: flex;
    justify-content: center;
    padding: 10px;
    align-items: center;
    grid-gap: 10px;
}
.preloaderAngelDis{
        display: flex;
    width: 100%;
    max-width: 380px;
}
.preloadWingsOne{
    display: flex;
    width: 100%;
    max-width: 160px;
    animation: preloadWingsOne 2s ease-out infinite;
}
.preloadWingsOne img{
    width: 100%;
}
.preloadAletter{
    width: 100%;
    max-width: 64px;
    animation: preloadWingsLetter 2s ease-out infinite;
}
.preloadAletter img{
    width: 100%;
}
.preloadWingsTwo{
    display: flex;
    width: 100%;
    max-width: 160px;
    animation: preloadWingsTwo 2s ease-out infinite;
}
.preloadWingsTwo img{
    width: 100%;
}
@keyframes preloadWingsOne{
    0% {
        
    }
    50% {
        transform: rotate(10deg) translate(-10px, -10px);
    }
    100% {
        
    }
}
@keyframes preloadWingsLetter{
    0% {
        
    }
    50% {
            transform: translate(0, -10px);
    opacity: 0;
    }
    100% {
        
    }
}
@keyframes preloadWingsTwo{
    0% {
        
    }
    50% {
            transform: rotate(-10deg) translate(10px, -10px);
    }
    100% {
        
    }
}
/* header */


.headerTop{
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    background: var(--white-color);
    z-index: 777;
    height: 65px;
}
.headerTContainer{
    display: flex;
    grid-gap: 20px;
    justify-content: space-between;
    align-items: center;
        height: 100%;
}
.headerTLogo{
        justify-content: start;
    display: flex;
        width: 100%;
    max-width: 200px;
    height: 100%;
    align-items: center;
    align-content: center;
        padding: 10px;
    padding-left: 0;
}
.headerTLogo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.headerTMNav{
    display: flex;
    grid-gap: 20px;
    padding: 0;
    list-style: none;
    margin: 0;
}
.headerTMNav a{
        color: var(--black-color);
    font-size: 16px;
    position: relative;
}
.headerTMNav a:after{
    content: "";
    width: 0;
    height: 2px;
    background: var(--black-color);
    display: flex;
    bottom: -1px;
    left: 0;
    position: absolute;
    transition:0.3s;
    opacity: 0;
}
.headerTMNavActive:after{
    content: "";
    width: 100%!important;
    height: 2px;
    background: var(--black-color);
    display: flex;
    bottom: -1px;
    left: 0;
    position: absolute;
    transition:0.3s;
    opacity: 1!important;
}
.headerTMNav a:hover:after{
    right: 0;
    left: initial;
    width: 100%;
    transition:0.3s;
    height: 2px;
    opacity: 1;
}
.headerTTheme{
        display: flex;
    grid-gap: 10px;
    align-items: center;
}
.headerTLan{
        display: flex;
    grid-gap: 5px;
    color: #666;
}
.headerTLan a{
        color: #666;
    font-weight: 600;
}
.headerTLan a:hover{
    color: var(--main-theme-color);
}

.headerMenuBar{
    display: none;
}
.headerMenuBar svg{
    
}

/**/
.headerTLogo img:nth-child(2), .theme2{
    display: none;
}


.headerMain{
    position: relative;
    width: 100%;
    height: 70px;
    z-index: 777;
    background: var(--white-color);
    display: flex;
    align-items: center;
        border-bottom: 1px solid #d7d7d747;
    border-radius: 0 0 20px 20px;
}
.headerMain:after {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    top: 0;
    left: 50%;
    background: linear-gradient(90deg, rgba(42, 123, 155, 0) 0%, var(--border-blocks) 50%, rgba(237, 221, 83, 0) 100%);
    transform: translateX(-50%);
}

.headerShopButton{
    background: var(--main-theme-color);
    color: #fff;
    display: flex;
    grid-gap: 10px;
    padding: 14px 26px;
    border-radius: 10px;
    align-items: center;
    font-size: 18px;
    width: 300px;
    position: relative;
    cursor: pointer;
    height: 54px;
}
.headerShopButton div{
        margin-left: auto;
}
.headerShopButton:hover{
    background: var(--breadcrumb-background);
    color: var(--main-theme-color);
}
.headerShopButton:hover .headerSBArrow{
    transform: rotate(180deg);
}

.headerShopMenu{
    background: var(--white-color);
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 100%;
    border-radius: 10px;
    width: 300px;
    /*overflow: hidden;*/
        padding: 10px 0;
    z-index: 99;
    visibility: hidden;
    opacity: 0;
    margin-block-start: 16px;
    
}

.headerShopButton:hover  .headerShopMenu{
    visibility: visible;
    opacity: 1;
    margin-block-start: 0;
}
.headerSMMainMenu{
        padding: 0;
    list-style: none;
    margin: 0;
        display: grid;
    overflow-y: overlay;
    max-height: 400px;
}
.headerSMMainMenu li{
    background: transparent;
    
        color: var(--black-color);
        
}
.headerSMMainMenu li:hover{
    background: #e6e6e6;
}
.headerSMMainMenu li a{
    padding: 10px;
color: var(--black-color);
    font-size: 16px;
    position: relative;
    width: 100%;
    display: flex;
    padding-right: 25px;
}
.headerSMSubMenu{
    background: var(--white-color);
    position: absolute;
    inset-inline-start: 100%;
    inset-block-start: 0;
    border-radius: 10px;
    width: 300px;
    /*overflow: hidden;*/
        padding: 20px 0;
    z-index: 99;
    visibility: hidden;
    opacity: 0;
    margin-block-start: 0;
    box-shadow: 0px 7px 21px -5px rgba(0, 0, 0, 0.1), 0 4px 21px -4px rgba(0, 0, 0, 0.1);
        height: 100%;
    min-height: 420px;
}

.headerSubMenuHover:hover .headerSMSubMenu{
        visibility: visible;
        opacity: 1;
}
.headerSubMenuHover > a:after{
    content:"";
      display: inline-block;
      width: 24px;
      height: 24px;
        --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23222' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m10 17l5-5m0 0l-5-5'/%3E%3C/svg%3E");
      background-color: currentColor;
      -webkit-mask-image: var(--svg);
      mask-image: var(--svg);
      -webkit-mask-repeat: no-repeat;
      mask-repeat: no-repeat;
      -webkit-mask-size: 100% 100%;
      mask-size: 100% 100%;
      transform: translateY(-50%);
        top: 50%;
        right: 0;
        position: absolute;
}
.headerSMSubMenu > ul{
            padding: 0;
    list-style: none;
    margin: 0;
    overflow-y: overlay;
    max-height: 358px;
}
.headerSMSubMenu > h6{
    font-size: 18px;
    padding: 0 10px;
    font-weight: 600;
}

.headerSMSubMenu > ul::-webkit-scrollbar-track, .headerSMMainMenu > ul::-webkit-scrollbar-track {
    background-color: #d6d9de;
}
.headerSMSubMenu > ul::-webkit-scrollbar-thumb, .headerSMMainMenu > ul::-webkit-scrollbar-thumb {
    background-color: #b1b3b8;
}
.headerSMSubMenu > ul::-webkit-scrollbar, .headerSMMainMenu > ul::-webkit-scrollbar {
    width: 4px !important;
    height: 4px !important;
}

.headerMContainer{
        display: flex;
    grid-gap: 20px;
    justify-content: space-between;
    align-items: center;
    height: 100%;
}

.headerMSettings{
        display: flex;
    align-items: center;
    grid-gap: 20px;
}
.headerMSettingsLink{
        display: flex;
    grid-gap: 8px;
    color: var(--black-color);
    font-size: 14px;
    align-items: center;
}
.headerMSettingsLink:hover{
    color: var(--main-theme-color);
}
.headerMSettingsLink div{
        position: relative;
}
.headerMSettingsLink div span{
        display: flex;
    position: absolute;
    top: -7px;
    right: -7px;
    background: var(--main-theme-color);
    color: var(--white-color);
    padding: 0px 5px;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}
.headerMSettingsLinkAccount{
    background: #980dfd30;
    color: var(--main-theme-color);
    border-radius: 20px;
    padding: 10px 16px;
}
.headerMSettingsLinkAccount:hover{
    background: var(--main-theme-color);
    color:var(--white-color);
}
.headerMobileSearch{
    display: none;
    align-items: center;
    grid-gap: 5px;
    font-size: 14px;
    border: 1px solid var(--border-blocks);
    border-radius: 20px;
    padding: 10px 16px;
}
.headerMSearch{
    width: 100%;
}
.headerSearch{
    margin:0;
    width: 100%;
    position: relative;
}
.headerSearch input{
    color: var(--black-color);
    display: flex;
    grid-gap: 10px;
    padding: 14px 26px;
    border-radius: 10px;
    align-items: center;
    font-size: 16px;
    width: 100%;
    position: relative;
    cursor: pointer;
    background: transparent;
    border: 1px solid var(--border-blocks);
    height: 54px;
    box-shadow: none;
    outline: 0;
}
.headerSearch input:focus, .headerSearch input:focus-visible, .headerSearch input:active{
    border-color: var(--main-theme-color);
}
.headerSearch button{
        background: none;
    border: 0;
    outline: none;
    position: absolute;
    top: 0;
    right: 5px;
    height: 54px;
    width: 54px;
    color: var(--black-color);
}

/* mobile menu */

.mobileMenuOverlay{
        position: fixed;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 999;
    opacity: 0;
    top: 0;
    left: 0;
    visibility: hidden;
}

.mobileMenu{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    max-width: 400px;
    background: var(--white-color);
    z-index: 1000;
    height: 100%;
    display: grid;
    align-items: self-start;
    align-content: flex-start;
    padding: 20px 0;
    grid-gap: 20px;
    overflow: auto;
    padding-top: 0;
    transform: translateX(-400px);
    transition: 0.6s cubic-bezier(0.85, 0, 0.15, 1);
}
.mobileMenuOpen{
    transform: translateX(0);
}
.mobileMenuOpen + .mobileMenuOverlay{
    opacity: 0.5;
    visibility: visible;
}
.mobileMTop{
display: flex;
    align-items: center;
    grid-gap: 10px;
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10;
    background: var(--black-color);
    padding: 20px;
    justify-content: space-between;
    color: var(--white-color);
    border-radius: 0 0 20px 20px;
}
.mobileMTop img{
    width: 100%;
    max-width: 200px;
}
.mobileMTop span{

    cursor: pointer;
}
/*.mobileMTop:after{
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 50%;
    background: linear-gradient(90deg, rgba(42, 123, 155, 0) 0%, rgba(63, 63, 63, 1) 50%, rgba(237, 221, 83, 0) 100%);
    transform: translateX(-50%);
}*/

.mobileMMiddle{
    position: relative;
}
.mobileMMOthersLinks{
    display: grid;
    grid-gap: 10px;
    padding-top: 20px;
    position: relative;
    margin-top:20px;
}
.mobileMMOthersLinks:after{
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    top: 0;
    left: 50%;
    background: linear-gradient(90deg, rgba(42, 123, 155, 0) 0%, rgba(63, 63, 63, 1) 50%, rgba(237, 221, 83, 0) 100%);
    transform: translateX(-50%);
}
.accordion-button:after{
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='currentColor'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.accordion-button:not(.collapsed):after{
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='currentColor'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.mobileMenuAccordion .accordion-item{
        border: 0;
    box-shadow: none;
    outline: 0;
}
.mobileMenuAccordion button{
    padding: 10px 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    outline: 0;
    font-size: 16px;
    color: var(--black-color);
}
.mobileMenuAccordion > a{
        color: var(--black-color);
    font-size: 16px;
        padding: 10px 0;
    display: block;
}
.mobileMenuAccordion ul{
    padding: 0;
    list-style: none;
    grid-gap: 10px;
    display: grid;
    margin: 0;
}
.mobileMenuAccordion ul a{
        color: var(--black-color);
    font-size: 14px;
}
.mobileMenuAccordion ul a:hover{
    color: var(--main-theme-color);
}
.mobileMenuAccordion button:hover, .mobileMenuAccordion button:focus, .mobileMenuAccordion button:focus-visible{
    border: 0;
    box-shadow: none;
    outline: 0;
}
.mobileMenuAccordion button:not(.collapsed){
    background: transparent;
    color: var(--black-color);
    border: 0;
    outline: 0;
    box-shadow: none;
}
.mobileMenuAccordion .accordion-body{
    padding: 0;
}

.mobileMBottom{
        position: relative;
}
/*.mobileMBottom:before{
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    top: 0;
    left: 50%;
    background: linear-gradient(90deg, rgba(42, 123, 155, 0) 0%, rgba(63, 63, 63, 1) 50%, rgba(237, 221, 83, 0) 100%);
    transform: translateX(-50%);
}*/
.mobileMBottom ul{
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: start;
    grid-gap: 10px;
    margin: 0;
}
.mobileMBottom a{
    color: var(--black-color);
}
.mobileMenuAccordion, .mobileMMOthersLinks, .mobileMBottom{
    padding-left: 20px;
    padding-right: 20px;
}
/* home banner */
.homeBannerSlider {
    width: 100%;
}
.homeBanner{
    padding: 0;
    margin-top:10px;
}
.homeBannerLayer{
    position: absolute;
    bottom: -1px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    background-image: url(/assets/img/homeBannerLayer.webp);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
    display: flex;
    justify-content: center;
    align-items: end;
    width: 100%;
    height: 55px;
    max-width: 290px;
    padding-bottom: 10px;
}
.homeBannerLayer svg{
        width: 30px;
    height: 30px;
    animation: homeBannerScroll 3s infinite normal ease-in-out;
}


.hSliderSlide{
    padding: 90px;
    min-height: 700px;
    display: grid;
    align-content: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
}
.hSliderSlide:after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #222;
    width: 100%;
    height: 100%;
    z-index: 0;
    opacity: 0.7;
}
.HSOverley{
    position: relative;
    z-index: 10;
    width: 100%;
    max-width: 800px;
}
.hSliderSlide h1{
    color: #fff;
    font-size: 60px;
    width: 100%;
    max-width: 700px;
    margin-bottom: 20px;
}
.hSliderSlide h2{
    color: #fff;
    font-size: 60px;
    width: 100%;
    max-width: 800px;
    margin-bottom: 20px;
}
.hSliderSlide p{
    color: #fff;
    font-size: 16px;
    width: 100%;
    max-width: 700px;
}
.hSliderSlide a{
    margin-top:60px;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--main-theme-color);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transform-origin: left top;
}
@keyframes homeBannerScroll{
0% {
    transform: translateY(0px);
}
100% {
    transform: translateY(50px);
}
}

/* home categories */

.homeCategories{
    
}
.homeCBlocks{
        display: flex;
    grid-gap: 20px;
    justify-content: space-between;
}
.homeCBlock{
    background: #b47add;
        width: 100%;
    border-radius: 20px;
    height: 300px;
    position: relative;
    overflow: hidden;
    /*    display: grid;
    align-content: space-between;*/
}
.homeCBlock img{
        position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: 1.2s;
}
.homeCBlock:hover img{
    transform: scale(1.1);
}
.homeCBlock:after{
    content:"";
    width: 100%;
    height: 100%;
    position: absolute;
    top:0;
    left:0;
    background: #222;
    opacity: 0.4;
    z-index: 5;
}
.homeCBlock a{
    position: relative;
    z-index: 10;
    padding: 40px;
    display: grid;
    align-content: space-between;
    width: 100%;
    height: 100%;
}
.homeCBlocks h2{
    color: #fff;
    
    font-size: 32px;
    width: 100%;
    max-width: 400px;
    margin-bottom: 20px;
}
.homeCBlocks p{
    color: #f5f5f5;
    text-transform: uppercase;
    font-size: 14px;
    margin-bottom: 20px;
}
.homeCBlocks .customButtonOne{
    padding: 12px;
    margin-left: auto;
    border-radius: 50%;
    color: var(--white-color);
}
.homeCBlocks .customButtonOne svg{
    width: 32px;
    height: 32px;
    transform: rotate(45deg);
}
.homeCBLeft{
        width: 40%;
}
.homeCBLeftMobile{
    display: none;
}
.homeCBLeft .homeCBlock{
        height: 100%;
}
.homeCBRight{
    width: 60%;
    display: flex;
    grid-gap: 20px;
    flex-wrap: wrap;
}
.homeCBRTwo{
        grid-template-columns: repeat(2, 48.9%);
    display: grid;
    grid-gap: 20px;
    width: 100%;
}


/**/

.swiperCustomBtn{
    display: flex;
    grid-gap: 12px;
    justify-content: start;
    position: relative;
        z-index: 10;
}
.swiperCustomBtn span{
    border: 2px solid  var(--black-color);
    border-radius: 50%;
    display: flex;
    width: max-content;
    height: max-content;
    padding: 8px;
    color: var(--black-color);
}
.swiperCustomBtn span:hover{
    background: var(--black-color);
}
.swiperCustomBtn span:hover svg path{
    fill:var(--white-color);
}
.swiperCustomBtn svg{
        font-size: 30px;
    transform: rotate(-90deg);
}
.swiperCustomBtn span:last-child svg{
        font-size: 30px;
    transform: rotate(90deg);
}

/* homeList */

.homeLTop{
        display: flex;
    flex-wrap: wrap;
    grid-gap: 10px 30px;
    align-items: center;
    justify-content: space-between;
        padding-bottom: 20px;
}
.homeLTop h2{
    margin: 0;
    color: var(--black-color);
}

/* all product */

.allProduct{
    
}
.allProducts{
/*        display: grid;
    grid-gap: 20px;
    grid-template-columns: repeat(5, 18.9%);*/
    margin: 0 -10px;
        display: grid;
    grid-gap: 20px 0;
    grid-template-columns: repeat(5, 20%);
}
.aPProduct{
        border: 1px solid var(--border-blocks);
    border-radius: 20px;
    overflow: hidden;
    background: var(--white-color);
    padding: 20px;
    position: relative;
    margin: 0 10px;
}
.homeNPSOne .aPProduct, .homeNPSTwo .aPProduct, .homeNPSThree .aPProduct{
    margin: 0;
}
.aPProduct img{
    width: 100%;
    border-radius: 10px;
    height: 280px;
    object-fit: cover;
    transition: 1.2s;
}
.aPProduct img:hover{
    transform: scale(1.2);
}
.aPPContent{
    padding-top: 20px;
}
.aPPContent h6{
    font-size: 16px;
    font-weight: 600;
    max-height: 40px;
    overflow: hidden;
    color: var(--black-color);
}
.APPPrices{
        display: flex;
    grid-gap: 8px;
}
.APPPrices .oldPrice{
    color: #999;
    text-decoration: line-through;
    font-weight: 600;
    font-size:16px;
}
.APPPrices .newPrice{
    color: var(--black-color);
    font-weight: 600;
    font-size: 20px;
    
}

.productAddCart{
    background: var(--breadcrumb-background);
    color: var(--main-theme-color);
    padding: 7px 20px;
    border-radius: 10px;
    text-align: center;
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 20px;
    grid-gap: 8px;
    align-items: center;
    font-size: 14px;
}
.productAddCart:hover{
    background: var(--main-theme-color);
    color: var(--white-color);
}
.productAddCart svg{
    width: 28px;
    height: 28px;
}
.productAddCart:hover svg path{
    stroke:var(--white-color);
}
.productSale{
    border-radius: 10px 0 10px 0;
    background: var(--main-theme-color);
    color: var(--white-color);
    padding: 2px 10px;
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 10;
}
.aPPImgOverflow{
    overflow: hidden;
}

/* home about */
.homeAbout{
        border-radius: 20px 20px 0 0;
    background: var(--breadcrumb-background);
}
.homeATwo{
    position: relative;
    display: flex;
    grid-gap: 20px;
}
.homeAContent{
        width: 100%;
}
.homeAContent h2{
        font-size: 48px;
}
.homeAContent h2 span{
    color: var(--main-theme-color);
    text-transform: uppercase;
}
.homeAContent p{
    color: #666;
}

.homeALogoName{
    text-transform: uppercase;
    display: flex;
    align-items: center;
    margin-bottom: 0;
    font-family: sans-serif;
    -webkit-text-fill-color: rgb(0 0 0 / 0%);
    -webkit-text-stroke: 2px #1e1e28;
    writing-mode: vertical-rl;
    font-size: 48px;
    opacity: .3;
    width: 160px;
}
.homeACTwo{
        display: grid;
    grid-template-columns: repeat(2, 49.1%);
    grid-gap: 20px;
}
.homeACDes{
    
}
.homeACDes p{
        font-size: 14px;
}
.homeACOther{
    
}


/* footer */

footer{
    background: var(--black-color);
    position: relative;
    overflow: hidden;
}
.footerTop{
        padding: 30px 0;
}
.footerCol{
        display: grid;
    grid-template-columns: repeat(4, 25%);
    margin: 0 -10px;
    grid-gap: 40px 0;
}
.footerBlock{
    margin: 0 10px;
}
.footerBlock h6{
    color: var(--white-color);
    font-size: 24px;
    margin-bottom: 20px;
    border-radius: 20px;
    width: max-content;
}
.footerBlock ul{
padding: 0;
    list-style: none;
    display: grid;
    grid-gap: 10px;
    margin: 0;
}
.footerBlock ul li{
    position: relative;
}
.footerBlock ul li a{
position: relative;
    display: flex;
    align-items: center;
        background: var(--black-color);
    color: #999;
        z-index: 2;
    
}
.footerBlock ul li:hover{
    padding-left: 24px;
}
.footerBlock ul li:hover a{
    color: var(--white-color);
}
.footerBlock ul li:after{
    content:"";
  display: inline-block;
  width: 24px;
  height: 24px;
   --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23000' d='M3.201 8.735a.75.75 0 1 0 1.09 1.03l4.955-5.239V17.25a.75.75 0 0 0 1.5 0V4.524l4.957 5.241a.75.75 0 1 0 1.09-1.03l-6.07-6.418a1 1 0 0 0-.566-.3a.75.75 0 0 0-.328.002a1 1 0 0 0-.558.298z'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  transform: rotate(45deg);
  position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    color: #666;
}
.footerLogo{
    width: 100%;
    max-width: 250px;
}
.footerLogo img{
    width: 100%;
}

.footerMiddle{
    padding: 20px 0;
    position: relative;
}
.footerMiddle:after{
content: "";
    width: 40%;
    height: 1px;
    position: absolute;
    top: 0;
    left: 50%;
    background: linear-gradient(90deg,rgba(42, 123, 155, 0) 0%, rgba(63, 63, 63, 1) 50%, rgba(237, 221, 83, 0) 100%);;
    transform: translateX(-50%);
}
.footerMiddle:before{
content: "";
    width: 70%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 50%;
    background: linear-gradient(90deg,rgba(42, 123, 155, 0) 0%, rgba(63, 63, 63, 1) 50%, rgba(237, 221, 83, 0) 100%);;
    transform: translateX(-50%);
}
.footerMiddle ul{
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: center;
    grid-gap: 10px;
    margin: 0;
}
.footerMiddle ul li a svg{
    width: 32px;
    height: 32px;
}

.footerBottom{
    padding: 20px 0;
}
.footerBottom p{
        color: #666;
    font-size: 14px;
    text-align: center;
    margin: 0;
}
.footerContact{
        margin-top: 20px;
    display: grid;
    grid-gap: 10px;
}
.footerContact div{
        display: flex;
    grid-gap: 10px;
    align-items: center;
}
.footerContact div span{
        background: #980dfd30;
    color: var(--main-theme-color);
    border-radius: 50%;
    padding: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.footerContact div a{
        word-break: break-word;
    color: #999;
}
.footerContact div a:hover{
    color: var(--white-color);
}


/* homeMarquee */

@-webkit-keyframes scroll {
    0% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
    100% {
        -webkit-transform: translate(-100%, 0);
        transform: translate(-100%, 0)
    }
}
 
@-moz-keyframes scroll {
    0% {
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
    }
    100% {
        -moz-transform: translate(-100%, 0);
        transform: translate(-100%, 0)
    }
}
 
@keyframes scroll {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(-100%, 0)
    }
}
 
.homeMarquee {
display: block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    background: #980dfd;
    color: #fff;
    font-size: 24px;
    padding: 20px 0;
}
 
.homeMarquee span {
    display: inline-block;
    padding-left: 100%;
    -webkit-animation: scroll 15s infinite linear;
    -moz-animation: scroll 15s infinite linear;
    animation: scroll 15s infinite linear;
}

/* breadcrumb */

.breadcrumb{
    background: var(--breadcrumb-background);
    padding: 15px 0;
    margin-top: 10px;
    margin-bottom: 0;
}
.breadcrumbAll{
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-gap: 10px;
}
.breadcrumbHeading h4, .breadcrumbHeading h1{
    font-size: 24px;
    margin: 0;
}
.breadcrumbList{
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0;
    grid-gap: 5px;
}
.breadcrumbList li:not(.breadcrumbListMain){
        display: flex;
    align-items: center;
    grid-gap: 5px;
}
.breadcrumbList li:not(.breadcrumbListMain):before{
    content:"";
  display: inline-block;
  width: 18px;
  height: 18px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cpath fill='%23000' d='M488.8 344.3L149 701a32 32 0 0 0 0 44.2l.4.3a29.4 29.4 0 0 0 42.7 0l320-335.8l319.8 335.8a29.4 29.4 0 0 0 42.7 0l.4-.3a32 32 0 0 0 0-44.2L535.2 344.3a32 32 0 0 0-46.4 0'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
      transform: rotate(90deg);
}
.breadcrumbListMain{
    
}
.breadcrumbListMain a{
    display: flex;
    align-items: center;
    grid-gap: 5px; 
}

/* shop */

.allProductsShop{
        display: grid;
    grid-gap: 20px 0;
    grid-template-columns: repeat(4, 25%);
    margin: 0 -10px;
}
.shopProductListDes{
    display: none;
    color: #666;
    font-size: 14px;
    padding-top: 20px;
}
@media (min-width: 768px){
    .shopListMesh[data-shop-grid-all="list"]{
        grid-template-columns: repeat(2, 49%);
    }
    .shopListMesh[data-shop-grid-all="list"] .aPProduct{
        display: grid;
        grid-gap: 0 20px;
        grid-template-columns: repeat(2, 47.8%);
    }
    .shopListMesh[data-shop-grid-all="list"] .aPProduct img{
        height: initial;
        max-height: 210px;
    }
    .shopListMesh[data-shop-grid-all="list"] .shopProductListDes{
        display: block;
    }
    .shopListMesh[data-shop-grid-all="list"]{
        
    }
}

.shopPCFilter{
        display: grid;
    grid-gap: 20px;
    position: relative;
}
.shopPCFBlock{
        border: 1px solid var(--border-blocks);
    border-radius: 20px;
    overflow: hidden;
    padding: 20px;
    position: relative;
}
.shopPCFBlock h4{
font-size: 16px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--border-blocks);
    padding-bottom: 10px;
    text-transform: capitalize;
}
.shopPCFChecksGroup{
    display: grid;
    grid-gap: 10px;
}

.form-controlCustom {
    font-family: system-ui, sans-serif;
    font-size: 16px;
    font-weight: 400;
    display: flex;
    gap: 10px;
    align-items: center;
    text-transform: capitalize;
}

.form-controlCustom--disabled {
  color: var(--form-control-disabled);
  cursor: not-allowed;
}

input[type="checkbox"] {
  /* Add if not using autoprefixer */
  -webkit-appearance: none;
  /* Remove most all native input styles */
  appearance: none;
  /* For iOS < 15 */
  background-color: var(--form-background);
  /* Not removed via appearance */
  margin: 0;

  font: inherit;
  color: currentColor;
  width: 1.15em;
  height: 1.15em;
  border: 0.15em solid currentColor;
  border-radius: 5px;
  transform: translateY(-0.075em);

  display: grid;
  place-content: center;
}

input[type="checkbox"]::before {
  content: "";
  width: 0.65em;
  height: 0.65em;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
  transform: scale(0);
  transform-origin: bottom left;
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1em 1em var(--main-theme-color);
  /* Windows High Contrast Mode */
  background-color: CanvasText;
}

input[type="checkbox"]:checked::before {
  transform: scale(1);
}

input[type="checkbox"]:focus {
  outline: max(2px, 0.15em) solid currentColor;
  outline-offset: max(2px, 0.15em);
}

input[type="checkbox"]:disabled {
  color: #959495;
  cursor: not-allowed;
}

.shopMobileFilter{
        position: fixed;
    top: 0;
    left: 0;
    z-index: 1001;
    width: 100%;
    max-width: 400px;
    background: var(--white-color);
    transform: translateX(-400px);
    transition: 0.6s cubic-bezier(0.85, 0, 0.15, 1);
    overflow-y: auto;
    height: 100%;
}

.shopMobileFilterOpen {
    transform: translateX(0);
}
.shopMobileFilterOverlay {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 999;
    opacity: 0;
    top: 0;
    left: 0;
    visibility: hidden;
}
.shopMobileFilterOpen + .shopMobileFilterOverlay {
    opacity: 0.5;
    visibility: visible;
}
.shopMFTop{
        padding: 20px;
    display: flex;
    justify-content: space-between;
        align-items: center;
        position: sticky;
    top: 0;
    left: 0;
    background: var(--white-color);
    z-index: 10;
    border-bottom: 1px solid var(--border-blocks);
    border-radius: 0 0 20px 20px!important;
}
.shopMFTopName{
        font-size: 32px;
    font-weight: 600;
}
.shopMobileFilter .shopPCFBlock{
    border: 0;
    border-radius: 0;
}
.shopMobileFilter form{
    position: relative;
        margin: 0;
}
.shopMFTopBottom{
        position: sticky;
    bottom: 0;
    left: 0;
    background: var(--white-color);
    z-index: 10;
    justify-content: center;
    display: flex;
    width: 100%;
    border-top: 1px solid var(--border-blocks) !important;
    border-radius: 20px 20px 0 0 !important;
}

.shopTopPanel{
        display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    grid-gap: 20px;
    align-items: center;
    padding-bottom: 20px;
}
.shopTPVariation{
        display: flex;
    flex-wrap: wrap;
    grid-gap: 10px;
}
.shopTPVButton{
        border: 1px solid var(--border-blocks);
    border-radius: 10px;
    padding: 5px;
    cursor: pointer;
}
.shopTPVButton[data-shop-grid="mesh"], .shopTPVButton[data-shop-grid="list"]{
    background: var(--main-theme-color);
    color: var(--white-color);
}

.shppTPSort{
        display: flex;
    grid-gap: 10px;
    align-items: center;
}
.shopTPSText{
    color: #666;
    font-size: 14px;
    width: 100px;
}
.common-input:focus {
    border-color: hsl(var(--main));
    box-shadow: none;
}
.form-control:focus {
    color: var(--black-color);
    border-color: var(--main-theme-color);
    outline: 0;
}
.shopTopPanel select{
    cursor: pointer;
}

.shopBottomButtons{
        display: flex;
    justify-content: center;
    padding-top: 30px;
}
.shopBBLoad{
        background: var(--main-theme-color);
    clip-path: polygon(0 0, 100% 0, 90% 100%, 0% 100%);
    border: 0;
    outline: 0;
    color: var(--white-color);
    padding: 12px 24px;
    border-radius: 10px;
    font-weight: 600;
    display: flex;
    text-align: center;
    justify-content: center;
}
.shopBBLoad:hover, .shopBBUp:hover{
    opacity: 0.9;
}
.shopBBUp{
        background: var(--border-blocks);
    clip-path: polygon(10% 0, 100% 0, 100% 100%, 0% 100%);
    border: 0;
    outline: 0;
    color: var(--black-color);
    padding: 12px 24px;
    border-radius: 10px;
    font-weight: 600;
    display: flex;
    text-align: center;
    justify-content: center;
}

.shopBBLoad:hover, .shopBBUp:hover{
    opacity: 0.7;
}

.shopPCFButton{
    display: grid;
    grid-gap: 10px;
}
.shopPCFClean{
    background: none;
    color: var(--black-color);
    border-radius: 10px;
    padding: 0 24px;
    width: 100%;
    font-weight: 600;
    border: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    grid-gap: 5px;
}

.shopPCFClean:hover{
    opacity: 0.7;
}

/* product */

.product{
    
}
.productDis{
        display: grid;
    grid-template-columns: repeat(2, 50%);
    grid-gap: 20px 0;
    margin: 0 -10px;
}
.productSlider{
    position: relative;
    margin:0 10px;
}
.productDiscount{
    border-radius: 10px 0 10px 0;
    background: var(--main-theme-color);
    color: #fff;
    padding: 4px 16px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    font-size: 18px;
}
.productSlider img{
    width: 100%;
}


    .productSlider .swiper-slide {
      text-align: center;
      font-size: 18px;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .productSlider .swiper-slide img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .productSlider1 {
      width: 100%;
      height: 300px;
      margin-left: auto;
      margin-right: auto;
    }

    .productSlider .swiper-slide {
      background-size: cover;
      background-position: center;
    }

    .productSlider2 {
      width: 100%;
    }

    .productSlider1 {
      height: 20%;
      box-sizing: border-box;
      padding: 20px 0;
    }

    .productSlider1 .swiper-slide {
      width: 25%;
      height: 100%;
    }


    .productSlider .swiper-slide img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 20px;
      border: 1px solid var(--border-blocks);
    }

.productContent{
    margin: 0 10px;
}
.productContentH1{
    margin-bottom: 20px;
    
}
.productSkuStock{
    display: flex;
    justify-content: space-between;
    padding-top: 10px;
}
.productSKU{
        font-size: 14px;
    color: #666;
    font-weight: 600;
}
.productSKU span{
    color: var(--black-color);
    text-transform: uppercase;
}
.productStock_instock{
    font-size: 14px;
    color: green;
    font-weight: 600;
}
.productStock_not{
    font-size: 14px;
    color: red;
    font-weight: 600;
}
.productHR{
    width: 100%;
    height: 1px;
    background: var(--border-blocks);
    margin: 15px 0;
}
.productDescriptionMain{
    font-size: 16px;
    margin-bottom: 20px;
    color: #666;
}
.productPrice{
    display: flex;
    grid-gap: 10px;
    align-items: flex-start;
}
.productPriceNew{
        font-size: 32px;
    font-weight: 600;
}
.productPriceOld{
        color: #666;
    text-decoration: line-through;
    font-weight: 600;
    font-size: 16px;
}


.productAddToCart{
    display: flex;
    grid-gap: 30px;
    align-items: center;
}
.productQuantity {
display: flex;
    border: 1px solid var(--border-blocks);
    overflow: hidden;
    border-radius: 20px;
}

.productQuantity button {
  background-color: transparent;
  color: var(--black-color);
  border: none;
  cursor: pointer;
  font-size: 20px;
  width: 30px;
  height: auto;
  text-align: center;
  transition: background-color 0.2s;
}

.productQuantity button:hover {
  background-color: transparent;
}

.input-box {
  width: 40px;
  text-align: center;
  border: none;
  padding: 8px 10px;
  font-size: 16px;
  outline: none;
}

/* Hide the number input spin buttons */
.input-box::-webkit-inner-spin-button,
.input-box::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.input-box[type="number"] {
  -moz-appearance: textfield;
}


.productAddButton{
    background: var(--main-theme-color);
    border: 0;
    outline: 0;
    color: var(--white-color);
    padding: 12px 24px;
    border-radius: 10px;
    font-weight: 600;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    grid-gap: 8px;
}
.productAddButton:hover{
    opacity: 0.7;
}

.productFilters{
    padding-bottom: 20px;
}
.productFilters h4{
        font-size: 18px;
}
.productFCheck{
    display: flex;
    flex-wrap: wrap;
    grid-gap: 10px;
    width: 100%;
    margin-bottom: 20px;
}
.productFCheck div{
        border: 1px solid var(--border-blocks);
    border-radius: 20px;
    padding: 6px 18px;
    cursor: pointer;
    font-size: 14px;
}
.productFCheck div:hover{
    border-color: var(--main-theme-color);
}
.productFCheck div.productFCheckDisabled{
    opacity: 0.5;
    cursor: initial;
}
.productFCheck div.productFCheckDisabled:hover{
    border-color: var(--border-blocks);
}
.productFCheckAdd{
    border-color: var(--main-theme-color)!important;
}
.productPageWishlist{
    background: #980dfd30;
    color: var(--main-theme-color);
    padding: 10px;
    border-radius: 50%;
    margin-left: auto;
    border: 0;
    outline: none;
    justify-content: center;
    display: flex;
    align-self: center;
    cursor: pointer;
}
.productPageWishlist:after{
    content:"";
  display: inline-block;
  width: 28px;
  height: 28px;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M16.696 3C14.652 3 12.887 4.197 12 5.943C11.113 4.197 9.348 3 7.304 3C4.374 3 2 5.457 2 8.481s1.817 5.796 4.165 8.073S12 21 12 21s3.374-2.133 5.835-4.446C20.46 14.088 22 11.514 22 8.481S19.626 3 16.696 3'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}
.productPageWishlist.active:after{
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M16.696 3C14.652 3 12.887 4.197 12 5.943C11.113 4.197 9.348 3 7.304 3C4.374 3 2 5.457 2 8.481s1.817 5.796 4.165 8.073S12 21 12 21s3.374-2.133 5.835-4.446C20.46 14.088 22 11.514 22 8.481S19.626 3 16.696 3'/%3E%3C/svg%3E");
}
.productSidebar{
        border-radius: 20px;
    border: 1px solid var(--border-blocks);
    display: grid;
}
.productSTop{
    padding: 20px;
}
.productSTContent{
        background: var(--main-theme-color);
    border-radius: 20px;
    display: flex;
    align-items: center;
    grid-gap: 15px;
    color: #fff;
    padding: 15px;
    font-size: 18px;
}
.productSTCSvg{
        background: var(--white-color);
    color: var(--black-color);
    border-radius: 50%;
    padding: 7px;
}
.productSBlock{
    background: var(--breadcrumb-background);
    padding: 20px;
    display: flex;
    grid-gap: 10px;
    border-bottom: 1px solid var(--border-blocks);
}
.productSBlock:last-child{
    border: 0;
    border-radius: 0 0 15px 15px;
}
.productSBSvg{
        background: var(--white-color);
    color: var(--main-theme-color);
    border-radius: 50%;
    height: fit-content;
    padding: 8px;
}
.productSBContent{
    
}
.productSBContent h6{
    font-size: 16px;
    font-weight: 600;
}
.productSBContent p{
    font-size: 14px;
    margin:000;
}


.shopFilterButtonOpen{
        border: 1px solid var(--border-blocks);
    border-radius: 10px;
    padding: 5px;
    cursor: pointer;
    display: none;
}
.shopFilterButtonOpen:hover{
    background: var(--main-theme-color);
    color: var(--white-color);
}

.productDescription{
        display: grid;
    border: 1px solid var(--border-blocks);
    border-radius: 20px;
    margin-top:20px;
}
.productDTop{
        padding: 10px 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    grid-gap: 10px 20px;
    border-bottom: 1px solid var(--border-blocks);
}
.productDTabs{
    display: flex;
    grid-gap: 10px;
    flex-wrap: wrap;
}
.productDTButton{
    color: var(--black-color);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 7px 16px;
    cursor: pointer;
}
.productDTButton:hover{
    
    background: transparent;
    color: var(--main-theme-color);
}
.productDTButtonActive{
    background: transparent;
    color: #000;
    border: 1px solid var(--main-theme-color);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 7px 16px;
    cursor: pointer;
}
.productDTButtonActive:hover{
    background: transparent;
    color: #000;
    border: 1px solid var(--main-theme-color);
}
.productDDetails{
        display: flex;
    grid-gap: 10px;
    background: #980dfd30;
    border-radius: 20px;
    align-items: center;
    padding: 10px 16px;
    color: var(--main-theme-color);
    font-size: 16px;
}
.productDDetails div{
        background: var(--white-color);
    padding: 8px;
    border-radius: 50%;
}
.productDContent{
        padding: 30px;
}

/* stylesForDescription */
.stylesForDescription h1, .stylesForDescription h2, .stylesForDescription h3, .stylesForDescription h4, .stylesForDescription h5, .stylesForDescription h6{
    font-size: 22px;
    color: var(--black-color);
    font-weight: 600;
    margin-bottom: 20px;
    position: relative;
}
.stylesForDescription p{
        font-size: 14px;
    color: var(--black-color);
    line-height: 25px;
    margin-bottom: 10px;
    font-weight: 300;
}
.stylesForDescription ul{
    list-style: none;
    padding-left: 40px;
    grid-gap: 8px;
    display: grid;
}
.stylesForDescription ul li:before{
        content: "•";
    position: absolute;
    left: -20px;
    font-size: 30px;
}
.stylesForDescription ul li{
        font-size: 14px;
    color: var(--black-color);
    line-height: 25px;
    position: relative;
    display: flex;
    align-items: self-start;
}
.stylesForDescription ol{
        margin-left: 0;
    padding-left: 0;
    list-style-type: none;
    padding-left: 40px;
    grid-gap: 8px;
    display: grid;
}
.stylesForDescription ol li{
        color: var(--black-color);
    position: relative;
    font-size:14px;
}
.stylesForDescription ol li::before {
    content: "—";
    font-weight: 600;
    position: absolute;
    left: -20px;
}

.productWishlistSvg{
    position: absolute;
    top: 25px;
    right: 25px;
    z-index: 10;
    cursor: pointer;
    background: #00000038;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
    color: var(--white-color);
}
.productWishlistSvg:hover{
        background: #0000008f;
}
.productWishlistSvg:after {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M16.696 3C14.652 3 12.887 4.197 12 5.943C11.113 4.197 9.348 3 7.304 3C4.374 3 2 5.457 2 8.481s1.817 5.796 4.165 8.073S12 21 12 21s3.374-2.133 5.835-4.446C20.46 14.088 22 11.514 22 8.481S19.626 3 16.696 3'/%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}
.productWishlistSvg.active:after {
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M16.696 3C14.652 3 12.887 4.197 12 5.943C11.113 4.197 9.348 3 7.304 3C4.374 3 2 5.457 2 8.481s1.817 5.796 4.165 8.073S12 21 12 21s3.374-2.133 5.835-4.446C20.46 14.088 22 11.514 22 8.481S19.626 3 16.696 3'/%3E%3C/svg%3E");
}


/* cart */
.cart{
    overflow: initial;
}
.cartDis{
    display: flex;
    grid-gap: 20px;
    align-items: flex-start;
}

.cartTotal{
    width: 350px;
}
.cartTableFirst{
        width: calc(100% - 350px);
}

.cartTotal{
    padding: 40px 20px;
    border: 1px solid var(--border-blocks);
    border-radius: 20px;
    grid-gap: 30px;
    display: grid;
        position: sticky;
    top: 80px;
}
.cartTotal h4{
        font-weight: 600;
    font-size: 20px;
margin: 0;
}
.cartTSubtotal{
    padding: 30px 20px;
    background: var(--breadcrumb-background);
    border-radius: 20px;
    grid-gap: 20px 10px;
    display: grid;
}
.cartTSRow{
    display: flex;
    grid-gap: 10px;
    justify-content: space-between;
}
.cartTSRow div:first-child{
    color:#666;
}
.cartTSRow div:last-child{
    color:var(--black-color);
    font-weight: 600;
}
.cartTSRowMain{
        display: flex;
    grid-gap: 10px;
    justify-content: space-between;
}
.cartTSRowMain div:first-child{
    color:var(--black-color);
    font-weight: 600;
    font-size: 20px;
}
.cartTSRowMain div:last-child{
    color:var(--black-color);
    font-weight: 600;
    font-size: 20px;
}

.cartTableFirst{
    border: 1px solid var(--border-blocks);
    border-radius: 20px;
    padding: 40px;
}
.cartTableOverflow{
    overflow-x: auto;
}
.cartTable{
    min-width: max-content;
}
.cartTable thead th{
    padding: 0 30px 30px 30px;
    font-size: 16px;
    font-weight: 600;
}
.cartTable thead th:first-child{
    padding-left: 0;
}
.cartTable thead th:last-child{
    padding-right: 0;
}
.cartTable tbody td{
    padding: 20px 30px;
}
.cartTable tbody td:first-child{
    padding-left: 0;
}
.cartTable tbody td:last-child{
    padding-right: 0;
}
.cartTableRemove{
    display: flex;
    grid-gap: 5px;
    color: var(--black-color);
    font-size: 14px;
    align-items: center;
}
.cartTableRemove:hover{
    color: red;
}
.cartTableProduct{
        display: flex;
    grid-gap: 20px;
}
.cartTPPhoto{
        padding: 20px;
    border-radius: 20px;
    border: 1px solid var(--border-blocks);
    width: 115px;
    height: 115px;
}
.cartTPPhoto img{
    width: 100%;
    max-width: 75px;
    border-radius: 20px;
        height: 100%;
    object-fit: cover;
}
.cartTPPhoto img:hover{
        transform: scale(1.2);
}
.cartTPName{
    display: grid;
    grid-gap: 5px;
    margin: 0;
        align-content: center;
}
.cartTPNameName{
        color: var(--black-color);
    font-size: 18px;
    display: flex;
}
.cartTPNameName:hover{
    color: var(--main-theme-color);
}
.cartTPNameVar{
    font-size: 14px;
    color: #666;
}
.cartTPNameVar span:last-child{
    color:var(--black-color);
}
.cartTPnameView{
    color: var(--main-theme-color);
    padding: 7px 20px;
    border-radius: 10px;
    text-align: center;
    width: max-content;
    display: flex;
    justify-content: center;
    grid-gap: 8px;
    align-items: center;
    font-size: 14px;
    border: 1px solid var(--main-theme-color);
}
.cartTablePrice{
    display: grid;
}
.cartTPNew{
        font-size: 20px;
    font-weight: 600;
}
.cartTPOld{
    color: #666;
    text-decoration: line-through;
    font-weight: 600;
    font-size: 14px;
}
.cartTableTotal{
    font-size: 20px;
    font-weight: 600;
}



/* checkout */

.checkout{
    margin-top: 10px;
}
.checkoutDis{
    display: grid;
    grid-template-columns: repeat(2, 50%);
    margin: 0 -10px;
}
.checkoutList{
    margin:0 10px;
}
.checkoutLAll{
        display: grid;
    grid-gap: 20px;
}
.checkoutLBlock{
        border-radius: 20px;
    border: 1px solid var(--border-blocks);
    padding: 30px;
    display: grid;
}
.checkoutLBlock h4{
        font-size: 24px;
    font-weight: 600;
    margin: 0;
        padding-bottom: 20px;
}
.formGroup{
    display: flex;
    flex-wrap: wrap;
    grid-gap: 20px;
    justify-content: space-between;
}
.formInput{
    position: relative;
}
.formInput input{
border: 1px solid var(--border-blocks);
    border-radius: 10px;
    padding: 15px 10px 10px 10px;
    font-size:14px;
    width:100%;
}
.formInput input::placeholder{
    color: transparent!important;
}
.formInput textarea{
border: 1px solid var(--border-blocks);
    border-radius: 10px;
    padding: 15px 10px 10px 10px;
    font-size:14px;
    width:100%;
    min-height: 150px;
}
.formInput textarea::placeholder{
    color: transparent!important;
}
.formInput label{
        position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 10px;
    font-size: 14px;
    overflow: hidden;
    text-align: start;
    text-overflow: ellipsis;
    white-space: nowrap;
    pointer-events: none;
    border: 1px solid transparent;
    transform-origin: 0 0;
    transition: opacity .1s ease-in-out, transform .1s ease-in-out;
    color: #666;
}
.formInput select{
    border: 1px solid var(--border-blocks);
    border-radius: 10px;
    padding: 15px 10px 10px 10px;
    font-size:14px;
    width:100%;
}
select{
    border: 1px solid var(--border-blocks);
    border-radius: 10px;
    padding: 9px 10px 8px 10px;
    font-size:14px;
    box-shadow: none;
    outline: 0;
    
appearance: none; /* Disable the default arrow */
    -webkit-appearance: none; /* For WebKit-based browsers */
    -moz-appearance: none; /* For Firefox */
    width: 100%;
    background-color: var(--white-color);
    background-image: url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6 9L12 15L18 9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor"/></svg>');
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 20px;
    cursor: pointer;
}

select:focus, select:active, select:focus-visible{
    border:1px solid var(--main-theme-color);
    outline: 0!important;
    box-shadow: none!important;
}
.formInput input:focus{
    border:1px solid var(--main-theme-color);
    outline: 0;
    box-shadow: none;
}
.formInput input:focus~label, .formInput input:not(:placeholder-shown)~label{
    opacity: .65;
    transform: scale(.85) translateY(-.6rem) translateX(.15rem);
}
.formInput textarea:focus{
    border:1px solid var(--main-theme-color);
    outline: 0;
    box-shadow: none;
}
.formInput textarea:focus~label, .formInput textarea:not(:placeholder-shown)~label{
    opacity: .65;
    transform: scale(.85) translateY(-.6rem) translateX(.15rem);
}
.formInput100{
    width: 100%;
}
.formInput50{
        width: 47.9%;
}

.checkoutBreadcrumb{
    padding-bottom: 30px;
}
.checkoutReq{
        text-align: right;
    padding-bottom: 10px;
    font-size: 12px;
}

.checkoutTotal{
    margin:0 10px;
}
.checkoutTAll{
    display: grid;
    grid-gap: 20px;
}
.checkoutTBlock{
    display: grid;
    grid-gap: 30px;
    border: 1px solid var(--border-blocks);
    border-radius: 20px;
    padding: 30px;
}
.checkoutTBlock h4{
    
}
.checkoutTBProduct{
    display: flex;
    grid-gap:20px;
}
.checkoutTBPPhoto{
        padding: 20px;
    border-radius: 20px;
    border: 1px solid var(--border-blocks);
    width: 115px;
    height: 115px;
    position: relative;
}
.checkoutTBPPhoto img{
        width: 100%;
    max-width: 75px;
    border-radius: 20px;
}
.checkoutTBPPhoto span{
        position: absolute;
    top: -5px;
    right: -5px;
    background: var(--main-theme-color);
    color: var(--white-color);
    font-size: 14px;
    border-radius: 50%;
    padding: 1px 8px;
}
.checkoutTBPDes{
        display: grid;
    grid-gap: 5px;
        align-content: center;
}
.checkoutTBPDName{
        color: var(--black-color);
    font-size: 18px;
    display: flex;
}
.checkoutTBPPrice{
        display: flex;
    flex-wrap: wrap;
    grid-gap: 5px;
}
.checkoutContainer{
    max-width: 1140px;
}
.checkoutTotalMain{
        display: flex;
    grid-gap: 10px;
    justify-content: space-between;
}
.checkoutTotalMain span{
    color: var(--black-color);
    font-weight: 600;
    font-size: 20px;
}
.cartCheckoutButton{
    width: 100%;
}

/* others */

.homeNewProductShadow{
    position: relative;
}

.homeNewProductShadow::before, .homeNewProductShadow::after {
    position: absolute;
    content: "";
    width: 200px;
    height: 100%;
    inset-inline-start: 0;
    inset-block-start: 0;
    background: linear-gradient(90deg, var(--white-color)fff, transparent);
    z-index: 3;
    opacity: 0.5;
}
.homeNewProductShadow:after {
    inset-inline-start: auto;
    inset-inline-end: 0;
    background: linear-gradient(-90deg, var(--white-color), transparent);
}

/* account log in*/
.account{
    overflow: initial;
}
.accountSR{
        display: grid;
    grid-template-columns: repeat(2, 50%);
    margin: 0 -10px;
}
.accountSign{
    border-radius: 20px;
    border: 1px solid var(--border-blocks);
    padding: 30px;
    margin: 0 10px;
    display: grid;
    align-content: baseline;
}
.accountSR h4{
    font-size: 24px;
    font-weight: 600;
    margin: 0;
    padding-bottom: 20px;
}
.accountSR .checkoutReq{
    display: flex;
    width: 100%;
    justify-content: end;
}
.accountSR button{
    margin-top: 20px;
    width: max-content;
}
.accountSignLostPassword{
    color: #666;
    font-size: 14px;
    margin-top: 10px;
    display: flex;
    align-items: center;
    grid-gap: 8px;
}
.accountSignLostPassword svg{
    transform: rotate(90deg);
}
.accountSignLostPassword:hover{
    padding-left: 10px;
}
.accountReg{
    border-radius: 20px;
    border: 1px solid var(--border-blocks);
    padding: 30px;
    margin: 0 10px;
    display: grid;
    align-content: baseline;
}

/* account */

.acccountDis{
    display: flex;
    grid-gap: 30px;
}
.accountMenu{
    width: 300px;
    background: #f7f7f7;
    border-radius: 20px;
    padding: 30px;
    height: max-content;
    position: sticky;
    top: 80px;
}
.accountPhotoAEmail{
        display: grid;
    justify-content: center;
    grid-gap: 10px;
}
.accountPhotoAEmail img{
    width: 140px;
    height: 140px;
    object-fit: cover;
    border-radius: 50%;
    margin: auto;
    border: 1px solid var(--border-blocks);
    padding: 5px;
}
.accountPhotoAEmail .accountPEEmail{
        color: #666;
    font-size: 14px;
    word-break: break-word;
    text-align: center;
}
.accountPhotoAEmail .accountPEFullName{
        font-size: 18px;
    font-weight: 600;
    text-align: center;
}
.accountTabs{
    padding-top: 20px;
}
.accountTabs ul{
    display: grid;
    grid-gap: 10px;
        border: 0;
}
.accountTabs ul li{
    
}
.accountTabs ul li button{
    width: 100%;
    text-align: left;
    background-color: transparent !important;
    border-radius: 5px!important;
    border: 0!important;
    outline: 0;
    box-shadow: none;
    color: var(--black-color)!important;
    padding: 16px 20px!important;
    font-size: 18px;
    font-weight: 600;
        display: flex;
    align-items: center;
    grid-gap: 8px;
}
.accountTabs ul li a{
    width: 100%;
    text-align: left;
    background-color: transparent !important;
    border-radius: 5px!important;
    border: 0!important;
    outline: 0;
    box-shadow: none;
    color: var(--black-color)!important;
    padding: 16px 20px!important;
    font-size: 18px;
    font-weight: 600;
        display: flex;
    align-items: center;
    grid-gap: 8px;
}
.accountTabs ul li button.active{
    background: var(--white-color) !important;
    color: var(--black-color)!important;
}
.accountTabs ul li button:hover{
        background: var(--white-color) !important;
    color: var(--black-color)!important;
}
.accountTabs ul li button:focus, .accountTabs ul li button:focus-visible, .accountTabs ul li button:active{
    box-shadow: none!important;
}
.accountTabs ul li a:hover{
        background: var(--white-color) !important;
    color: var(--black-color)!important;
}
.accountContent{
    width: calc(100% - 300px);
}

.accountDash{
        display: grid;
    grid-template-columns: repeat(2, 50%);
    margin: 0 -10px;
    grid-gap: 20px 0;
}
.accountDBlock{
    border-radius: 20px;
    border: 1px solid var(--border-blocks);
    margin: 0 10px;
        display: flex;
    grid-gap: 10px;
    padding: 30px;
    justify-content: space-between;
        align-items: center;
}
.accountDBlockIcon{
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px 50px 0 0;
    width: 80px;
    height: 80px;
}
.accountDBlockIcon svg{
    width: 42px;
    height: 42px;
}
.accountDBlockContent{
    display: grid;
    align-content: center;
    grid-gap: 10px;
}
 .accountDBlockContent span:first-child{
    color: #666;
    font-size: 18px;
}
 .accountDBlockContent span:last-child{
    color: var(--black-color);
    font-size: 40px;
    font-weight: 600;
}

.accountHMS{
        padding: 30px;
    border-radius: 20px;
    border: 1px solid var(--border-blocks);
    display: grid;
}
.accountH4{
        font-size: 24px;
    font-weight: 600;
    margin: 0;
    padding-bottom: 20px;
}
.accountHOrder{
    display: grid;
}
.accountHOTop{
        border-radius: 10px 10px 0 0;
    border: 1px solid var(--border-blocks);
    padding: 20px;
}
.accountHOList{
        padding: 20px;
    border-radius: 0 0 10px 10px;
    border: 1px solid var(--border-blocks);
    border-top: 0;
        grid-gap: 20px;
    display: grid;
}
.accountHOItem{
        display: flex;
    grid-gap: 10px;
    align-items: center;
    justify-content: space-between;
}
.accountHOIPrice{
    font-size: 18px;
    font-weight: 600;
    color: var(--main-theme-color);
}
.accountHOIPrice span{
    font-weight: 400;
    color: var(--black-color);
}
.checkoutTBProduct a{
    padding: 0;
    border: 0;
}
.checkoutTBProduct a img{
    max-width: 100%;
    height: 100%;
}
.accountUpdate{
    width: max-content;
    margin-top: 20px;
}

.modalSearch{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    display: grid;
    align-items: self-start;
    align-content: flex-start;
    overflow: auto;
    padding-top: 0;
    opacity: 0;
    transition: 0.6s cubic-bezier(0.85, 0, 0.15, 1);
    visibility: hidden;
    align-items: center;
    padding: 20px;
}
.modalSearchOpen{
    opacity: 1;
    visibility: visible;
}
.modalSearchOverlay{
    position: fixed;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 999;
    opacity: 0;
    top: 0;
    left: 0;
    visibility: hidden;
    transition: 0.6s cubic-bezier(0.85, 0, 0.15, 1);
}
.modalSearchOpen + .modalSearchOverlay {
    opacity: 0.8;
    visibility: visible;
}
.modalSearch .shopMFTop{
    padding: 10px;
    border-radius: 10px !important;
    background: transparent;
    color: #fff;
    justify-content: end;
    border: 0;
    margin-bottom: 30px;
}
.modalSearch input{
    background: var(--white-color);
}

.policy h1{
        padding-bottom: 40px;
}

/* about us */

.aboutMain{
    margin: 0 -20px;
    display: grid;
    grid-template-columns: repeat(2, 50%);
    align-items: center;
}
.aboutMPhoto{
    margin:0 20px;
    padding: 0 20px 0 20px;
    position: relative;
}
.aboutMPhoto:after{
content: "";
    width: 100%;
    height: calc(100% - 40px);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    border: 2px dashed #d9d9d9;
    border-radius: 20px;
    z-index: 1;
}
.aboutMPhotoIMG{
    width: 100%;
    border-radius: 20px;
    position: relative;
    z-index: 3;
    height: 100%;
    object-fit: cover;
}
.aboutMPhotoS{
    position: absolute;
    bottom: -15px;
    left: 20%;
    width: 70px;
    height: 70px;
    background: #222;
    border-radius: 20px;
    transform: rotate(70deg);
    z-index: 4;
    animation: aboutMPhotoS 7s ease-out 1s infinite;
}
@keyframes aboutMPhotoS{
    0% {
        transform: rotate(70deg);
    }
    50% {
        transform: rotate(-70deg);
    }
    100% {
        transform: rotate(70deg);
    }
}
.aboutMContent{
    margin:0 20px;
}
.aboutMContent h1{
    font-size: 32px;
    padding-bottom: 20px;
    margin: 0;
}
.aboutMContent p{
    font-size: 16px;
    color: #666;
}
/*.aboutOABlocks{
    display: grid;
    grid-template-columns: repeat(3, 33.3%);
    margin: 0 -10px;
    border-radius: 20px;
    padding: 60px 30px;
    border: 1px solid #d9d9d9;
        background: #ededed;
}
.aboutOABlock{
    display: flex;
    grid-gap: 20px;
    margin: 0 10px;
    align-items: baseline;
}
.aboutOABNumber{
    color: #999;
    font-size: 16px;
}
.aboutOABContent{
    display: grid;
    grid-gap: 20px;
}
.aboutOABContent h4{
    margin: 0;
    font-size: 20px;
}
.aboutOABContent p{
    color: #666;
}*/

.aboutTwo{
        display: grid;
    grid-gap: 20px;
}
.aboutTBlock{
        display: flex;
    align-items: center;
    margin: 0 -20px;
}
.aboutTBlockReverse{
        flex-direction: row-reverse;
}
.aboutTBIcon{
    width: 500px;
    margin: 0 20px;
}
.aboutTBIcon img{
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    animation: aboutTBIcon 3s linear infinite;
}
@keyframes aboutTBIcon{
    0% {
        transform: translateY(0%);
    }
    50% {
        transform: translateY(30px);
    }
    100% {
        transform: translateY(0%);
    }
}
.aboutTBlockReverse .aboutTBIcon img{
    animation: aboutTBIcon2 3s linear infinite;
}
@keyframes aboutTBIcon2{
    0% {
        transform: translateY(0%);
    }
    50% {
        transform: translateY(-30px);
    }
    100% {
        transform: translateY(0%);
    }
}
.aboutTBContent{
margin: 0 20px;
    border: 1px dashed #d9d9d9;
    border-radius: 20px;
    padding: 30px;
}
.aboutTBContent h2{
        display: flex;
    grid-gap: 8px;
    align-items: center;
}
.aboutTBContent h2 svg{
    transform: rotate(90deg);
}
.aboutTBContent p{
    color: #666;
}

.aboutLast{
    min-height: 400px;
    align-items: center;
    display: flex;
    position: relative;
    background: url(/assets/img/aboutlast.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
        border-radius: 20px 20px 0 0;
}
.aboutLast:after{
content: "";
    background: var(--main-theme-color);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.5;
}
.aboutLast span{
    width: 100%;
    max-width: 1000px;
    display: flex;
    font-size: 30px;
    text-align: left;
    margin: auto;
    position: relative;
    z-index: 2;
    color: #fff;
}

.faqAll{
        display: grid;
    grid-gap: 20px;
}
.faqBlock{
    display: flex;

}
.faqBlock:nth-child(even){
        flex-direction: row-reverse;
}
.faqIcon{
    width: 200px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.faqIcon:after{
    content: "";
    width: 65%;
    border: 1px dashed #222;
    position: absolute;
    top: 60%;
    right: 0;
    transform: translateY(-50%);
}
.faqIcon span{
    font-size: 32px;
    font-weight: 600;
}
.faqBlock:nth-child(even) .faqIcon:after{
    left: 0;
    right: initial;
}
.faqContent{
    width: calc(100% - 200px);
    border: 1px solid #d9d9d9;
    border-radius: 20px;
    padding: 30px;
    border-left:2px dashed #222;
}
.faqBlock:nth-child(even) .faqContent{
    border-left:1px solid #d9d9d9;
    border-right:2px dashed #222;
}
.faqContent h4{
    padding-bottom: 20px;
}
.faqContent p{
        font-size: 16px;
    color: #666;
}
.faqContent span{
    display: none;
}

/**/

.formContact{
    border-radius: 20px 20px 0 0;
    background-image: url(/assets/img/formContact.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    animation: formContact 15s linear infinite;
    min-height: 400px;
        align-items: center;
    background-attachment: fixed;
}
.formContactImg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.5;
    z-index: 1;
}

.formCBlock{
    padding: 30px;
    display: grid;
    position: relative;
    z-index: 3;
}
.formCBlock h2{
    margin: 0;
    padding-bottom: 20px;
    color: #fff;
        font-size: 48px;
}
.formCBlock p{
    color: #fff;
    margin: 0;
    padding-bottom: 40px;
    font-size: 20px;
}
.formCBlock a svg{
    transform: rotate(180deg);
}

/* retudn */

.return h1{
    margin: 0;
    padding-bottom: 20px;
}

/* contact us */

.contactUs{
    display: flex;
    margin: 0 -10px;
}
.contactUSidebar{
    margin: 0 10px;
    border: 1px solid #d9d9d9;
    border-radius: 20px;
    padding: 30px;
}
.contactUSidebar .footerContact{
    margin: 0;
}


.contactUForm{
    margin: 0 10px;
    border: 1px solid #d9d9d9;
    border-radius: 20px;
    padding: 30px;
}

.contactUForm span{
        justify-content: end;
    width: 100%;
    display: flex;
}
.contactUForm button{
        width: max-content;
    margin-top: 20px;
}

/* 404 */

.pageNotFoundDis{
    min-height: 305px;
    display: flex;
    align-items: center;
}
.pageNotFound{
        display: flex;
    justify-content: center;
    align-items: center;
}
.pageNotFound span:first-child{
    font-size: 100px;
    border-right: 2px dashed #222;
    padding-right: 20px;
    margin-right: 20px;
}
.pageNotFound span:last-child{
    font-size: 16px;
    font-weight: 600;
}

/**/
.windowNot{
    position: fixed;
    width: 300px;
    bottom: 5px;
    right: 5px;
    z-index: 10;
    background: #530404;
    color: #fff;
    border-radius: 10px;
    padding: 15px 10px;
    display: flex;
    opacity: 1;
    align-items: center;
    grid-gap: 5px;
    animation: windowESN 0.6s 1 normal ease-in-out;
    font-size: 14px;
}
.windowNot span svg{
    width: 32px;
    height: 32px;
}
/* error */
.windowError span{
    color: #ff0000;
}

/* success */
.windowSuccess{
    background: #045321;
    color: #fff;
}
.windowSuccess span{
    color: #00ff5e;
}

/* notification */
.windowNotification{
    border: 1px solid #222;
    background: #fff;
    color: #222;
}
.windowNotification span{
    color: #222;
}

@keyframes windowESN{
    0% {
        right: -300px;
        opacity: 0;
    }
    100% {
        right: 5px;
        opacity: 1;
    }
}

/* arc pages */
.shopBottomButtonsNoAjax{
    display: grid;
    grid-gap: 10px;
}
.arcPages{
        display: flex;
    align-items: center;
    flex-wrap: wrap;
    grid-gap: 5px;
}
.arcPages a, .arcPages span{
    border: 1px solid var(--border-blocks);
    border-radius: 10px;
    padding: 10px 15px;
    color: var(--black-color);
    background: var(--white-color);
}
.arcPages a:hover{
    background: #980dfd30!important;
}`
.arcPagesPrev{
    
}
.arcPagesNext{
    
}
.arcPagesNumber{
    
}
.arcPagesActive{
    background: var(--main-theme-color)!important;
    color: var(--white-color)!important;
}

/* all media*/

@media (max-width: 1199px){
    .allProducts{
        grid-template-columns: repeat(4, 25%);
    }
    .allProductsShop{
        grid-template-columns: repeat(3, 33.3%);
    }
}
@media (max-width: 1024px){
    .headerTMNavMobile{
        display: none;
    }
    .headerMenuBar{
        display: flex;
    }
    .headerTTheme{
        margin-left: auto;
    }
}
@media (max-width: 991px){
    .aboutTBlock{
        display: grid;
        position: relative;
    }
    .aboutLast span{
        font-size: 22px;   
    }
    .aboutTBIcon{
                margin: 0;
        width: 100px;
        position: absolute;
        top: -60px;
        right: 0;
    }
    .aboutMain {
        grid-gap:20px 0;
        margin: 0;
        grid-template-columns: repeat(1, 100%);
    }
    .aboutMPhoto{
        margin: 0;
            order: 2;
    }
    .aboutMContent{
        margin: 0;
    }
    .acccountDis{
        flex-wrap: wrap;
    }
    .accountMenu{
        width: 100%;
        position: relative;
        top: initial;
    }
    .accountContent{
        width: 100%;
    }
    .accountMenu, .accountHMS, .accountDBlock{
        padding: 20px;
    }
    
    .checkoutTotal, .accountReg{
        margin-top: 20px;
    }
    .checkoutDis, .accountSR{
        grid-template-columns: repeat(1, 100%);
    }
    .cartDis{
        display: block;
    }
    .checkoutTBlock{
        grid-gap:20px;
    }
    .contactUs{
        display: grid;
        grid-gap: 20px 0;
    }
    .cartTotal{
        margin-top:20px;
        width:100%;
        padding: 20px;
        grid-gap:20px;
        position: relative;
        top: initial;
    }
    .cartTable thead th {
        padding: 0 20px 20px 20px;
        font-size: 16px;
        font-weight: 600;
    }
    .cartTable tbody td {
        padding: 10px 20px;
    }
    .cartTableFirst{
        padding: 20px;
        width: auto;
    }
    .cartTSubtotal{
        padding: 20px;
    }
    
    .productContentH1{
        font-size: 28px;
    }
    .productDescriptionMain{
        font-size: 14px;
    }
    .productFCheck div{
        font-size: 12px;
    }
    .footerCol{
        grid-template-columns: repeat(2, 50%);
    }
    .homeCBRTwo {
        grid-template-columns: repeat(2, 48.2%);
    }
    .homeCBlock{
        height: 250px;
    }
    .headerMShopAll{
        display: none;
    }
    .shopFilterButtonOpen{
        display: flex;
    }
    .shppTPSort{
        margin-left: auto;
    }
    .shopPCFilterDesktop{
        display: none;
    }
    .hSliderSlide h1, .hSliderSlide h2{
            font-size: 48px;
    }
    .hSliderSlide{
        padding: 60px;
    }
    .homeCBlocks h2{
        font-size: 26px;
    }
    .homeCBlock a{
                padding: 20px;
    }
    .formCBlock h2{
        font-size: 32px;
    }
    .formCBlock p{
        font-size: 18px;
    }
    .productSTop, .productSTContent, .productSBlock, .productDTop, .productDContent, .checkoutLBlock, .checkoutTBlock, .aboutTBContent, .faqContent, .formCBlock, .contactUForm, .contactUSidebar{
        padding: 20px;
    }
}
@media (max-width: 767px){
    .faqIcon{
        width: 150px;
        justify-content: start;
    }
    .faqContent {
        width: calc(100% - 150px);
    }
    .faqBlock:nth-child(even) .faqIcon{
        justify-content: end;
    }
    .faqIcon:after{
        width: 100%;
    }
    .productDis{
        grid-template-columns: repeat(1, 100%);
    }
    .homeAContent h2{
        font-size: 32px;
    }
    .homeATwo{
        flex-wrap: wrap;
    }
    .homeALogoName{
        writing-mode: inherit;
        width: 100%;
    }
    .homeALogoName{
        width: 100%;
    }
    .headerMSearch{
        display: none;
    }
    .headerMobileSearch{
        display: flex;
    }
    .homeCBLeft{
        width: 100%;
    }
    .homeCBRight{
        width: 100%;
    }
    .homeCBlocks{
        flex-wrap: wrap;
    }
    
    .homeCBLeftMobile{
        display: flex;
    }
    .homeCBLeftDesktop, .homeCBRightDesktop{
        display: none;
    }
    .homeCBLeftMobile{
                display: grid;
        grid-template-columns: repeat(2, 49.1%);
        grid-gap: 10px;
        margin: 0 -5px;
    }
    .aPProduct{
        margin: 0 5px;
    }

    .homeCBlocks h2{
        font-size: 22px;
    }
    .homeCBlocks .customButtonOne{
            padding: 5px;
    }
    .allProducts{
        grid-template-columns: repeat(2, 50%);
    }
    .allProductsShop{
        grid-template-columns: repeat(2, 50%);
    }
}
.mobileMenuLANDesktop{
    display: none;
}
@media (max-width: 575px){
    .windowNot{
        right: initial;
        left: 50%;
        transform: translateX(-50%);
        width: calc(100% - 20px);
        max-width: 300px;
        bottom: 10px;
    }
    @keyframes windowESN{
        0% {
            bottom: -100%;
            opacity: 0;
        }
        100% {
            bottom: 10px;
            opacity: 1;
        }
    }

    .breadcrumbList li:not(.breadcrumbListMain), .breadcrumbListMain {
        font-size: 14px;
    }
    .pageNotFound{
        display: grid;
    }
    .pageNotFound span:first-child{
                border-bottom: 2px dashed #222;
        border-right: initial;
        padding-right: 0;
        padding-bottom: 20px;
        margin-right: initial;
        margin-bottom: 20px;
        text-align: center;
        font-size: 80px;
        line-height: 80px;
    }
    .formCBlock h2{
        font-size: 24px;
    }
    .formCBlock p{
        font-size: 16px;
    }
    .faqContent h4{
        font-size: 18px;
    }
    .faqContent p{
        font-size: 14px;
    }
    .faqIcon{
        display: none;
    }
    .faqContent{
        width: 100%;
        border: 1px solid #d9d9d9 !important;
        border-bottom: 2px dashed #222 !important;
        display: grid;
    }
    .faqContent span{
        display: block;
        order: -1;
        text-align: right;
        font-weight: 600;
        font-size: 19px;
        padding-bottom: 10px;
    }
    .breadcrumbHeading h4, .breadcrumbHeading h1{
        font-size: 20px;
    }
    .homeNewProductShadow::before, .homeNewProductShadow::after{
        display: none;
    }
    
    .preloaderAngelDis{
                width: 250px;
    }
    .preloadAletter{
                width: 120px;
        max-width: initial;
    }
    
    .accountDBlockContent span:first-child{
        font-size: 14px;
    }
    .accountDBlockContent span:last-child{
        font-size: 32px;
    }
    .accountDBlockIcon svg{
        width: 32px;
        height: 32px;
    }
    .accountDash{
        grid-template-columns: repeat(1, 100%);
    }
    .accountHOItem{
        flex-wrap: wrap;
    }
    .accountHOIPrice{
        font-size:16px;
    }
    .checkoutLBlock h4, .accountSR h4, .accountH4{
        font-size: 20px;
    }
    .cartTableRemove{
        font-size: 0;
    }
    .formInput50{
        width: 100%;
    }
    .cartTPNameName, .checkoutTBPDName{
        font-size: 16px;
    }
    .cartTPNameVar{
        font-size: 12px;
    }
    .cartTPNew, .cartTableTotal{
        font-size: 18px;
    }
    .cartTPOld{
        font-size: 12px;
    }
    .cartTPPhoto, .checkoutTBPPhoto{
        width: 80px;
        height: 80px;
        padding: 10px;
    }
    .cartTable thead th {
        padding: 0 10px 10px 10px;
        font-size: 14px;
        font-weight: 600;
    }
    .cartTable tbody td {
        padding: 5px 10px;
    }

    
    .stylesForDescription h1, .stylesForDescription h2, .stylesForDescription h3, .stylesForDescription h4, .stylesForDescription h5, .stylesForDescription h6{
        font-size: 18px;
    }
    .productDDetails{
        display: none;
    }
    .productAddToCart{
        flex-wrap: wrap;
        grid-gap: 10px 20px;
        justify-content: space-between;
    }
    .breadcrumbAll{
        flex-wrap: wrap;
    }
    .footerCol{
        grid-template-columns: repeat(1, 100%);
    }
    .footerMiddle ul{
        justify-content: start;
    }
    .footerBottom p{
        text-align: left;
    }
    .footerMiddle:before, .footerMiddle:after{
        width: 100%;
        background: linear-gradient(90deg, rgba(63, 63, 63, 1) 0%, rgba(63, 63, 63, 1) 50%, rgba(237, 221, 83, 0) 100%);
    }
    .homeALogoName{
        font-size: 36px;
    }
    .homeBannerSlider{
        border-radius: 0;
    }
    .homeMarquee{
        font-size: 18px;
        padding: 10px 0;
    }
    section{
        padding: 30px 0;
    }
        .swiperCustomBtn span {
        padding: 4px;
    }
    .swiperCustomBtn svg{
        font-size: 26px!important;
    }
    .homeCBRTwo{
        grid-template-columns: repeat(1, 100%);
    }
    .homeCBlock{
        height: 200px;
    }
    .homeCBlock a{
        
    }
    .headerMain{
    height: 60px;
        padding: 5px 0px;
    }
    .hSliderSlide {
        padding: 60px 20px;
        min-height: initial;
        height: 100%;
    }
    .homeBannerLayer{
        max-width: 150px;
    }
    .homeBannerLayer svg{
                width: 20px;
        height: 20px;
    }
    @keyframes homeBannerScroll {
        0% {
            transform: translateY(10px);
        }
        100% {
            transform: translateY(40px);
        }
    }
        .hSliderSlide h1, .hSliderSlide h2 {
        font-size: 32px;
    }
    .hSliderSlide p{
        font-size: 14px;
    }
    .headerMSettingsLink{
        font-size: 0;
        grid-gap: 0;
    }
    .headerTLan, .theme{
        display: none;
    }
    .shopTPVariation{
        display: none;
    }
    .shppTPSort{
        margin-left: initial;
    }
    .shopTopPanel{
        justify-content: start;
    }
    .aPProduct {
        padding: 10px;
    }
    .productSale{
        top: 15px;
        left: 15px;
    }
    
    .mobileMenuLAN{
        display: flex;
        padding: 0 20px;
        margin-top: 20px;
    }
}
@media (max-width: 480px){
    .homeAContent h2{
        font-size: 28px;
    }
    .aPProduct img{
        height: 160px;
    }
}