/* css version 1 */

/* css version 1 */

html{
    box-sizing: border-box;
}

*,
*:before,
*:after{
    box-sizing: inherit;
}

body{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

ul,
li{
    list-style: none;
    margin: 0;
    padding: 0;
}

a{
    display: block;
    text-decoration: none;
}

a:hover{
    text-decoration: none;
    cursor: pointer !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
p{
    margin: 0px;
    padding: 0px;
}

@media (max-width : 992px){
    h1 br,
    h2 br,
    h3 br,
    h4 br,
    h5 br,
    h6 br,
    p br{
        display: none;
    }
}

button{
    border: none;
}

/*========================================
       Color Variable Start Here
=========================================*/

:root{
    --light: #fff;
    --dark: #000;
    --light-with-opacity: rgba(255, 255, 255, 0.8);
    --dark-with-opacity: rgba(0, 0, 0, 0.8);
    --theme-color1-with-opacity: rgba(0, 142, 251, 0.7);
    --theme-color2-with-opacity: rgba(151, 201, 16, 0.7);
    --gradient-color-1: linear-gradient(0deg, #002f85 0%, #00a7ff 100%);
    --theme-color: #d9b857;
    --theme-bg-color1: #1a191e;
    --theme-bg-color2: #d9b857;
    --theme-bg-color3: #e4cd89;
    --theme-bg-color4: #666666;
    --theme-bg-color5: #666666;
    --theme-bg-color6: #cdcdcd;
    --theme-bg-color7: #b1b1b1;
    --theme-text-color1: #1a191e;
    --theme-text-color2: #d9b857;
    --theme-text-color3: #e4cd89;
    --theme-text-color4: #666666;
    --theme-text-color5: #666666;
    --theme-text-color6: #cdcdcd;
    --theme-text-color7: #b1b1b1;
}

/*========================================
       Color Variable End Here
=========================================*/

/*========================================
    border Radius Variable Start Here
=========================================*/

:root{
    --border-color1: #1a191e;
    --border-color2: #d9b857;
    --border-color3: #e4cd89;
    --border-color4: #d9d9d9;
    --border-color5: #f0f0f0;
    --border-color6: #d0d0d0;
    --border-color7: #cdcdcd;
    --border-color8: #e4e4e4;
}

/*========================================
    border Radius Variable End Here
=========================================*/

/*========================================
       Font Variable Start Here
=========================================*/

:root{
   --font-size-xxlg: 52px;
   --font-size-xlg: 42px;
   --font-size-lg: 36px;
   --font-size-md-1: 30px;
   --font-size-md-2: 28px;
   --font-size-md-3: 26px;
   --font-size-md-4: 24px;
   --font-size-md-5: 20px;
   --font-size-sm: 18px;
   --font-size-xs-1: 16px;
   --font-size-xs-2: 14px;
   --font-size-xs-3: 12px;
}

/*========================================
       Font Variable End Here
=========================================*/

/*========================================
       Line height Variable Start Here
=========================================*/

:root{
    --line-heights-xxlg: 66px;
    --line-heights-xlg: 56px;
    --line-heights-lg: 48px;
    --line-heights-md-1: 40px;
    --line-heights-md-2: 38px;
    --line-heights-md-3: 36px;
    --line-heights-md-4: 34px;
    --line-heights-md-5: 30px;
    --line-heights-sm: 28px;
    --line-heights-xs-1: 26px;
    --line-heights-xs-2: 24px;
    --line-heights-xs-3: 20px;
 }

/*========================================
       Line height Variable End Here
=========================================*/

/*========================================
       Font Icon Variable Start Here
=========================================*/

:root{
    --font-size-icon-xxlg: 64px;
    --font-size-icon-xlg: 52px;
    --font-size-icon-lg-1: 44px;
    --font-size-icon-lg-2: 36px;
    --font-size-icon-lg-3: 30px;
    --font-size-icon-md-1: 28px;
    --font-size-icon-md-2: 24px;
    --font-size-icon-md-3: 20px;
    --font-size-icon-sm: 18px;
    --font-size-icon-xs: 16px;
    --font-size-icon-xxs: 14px;
}

/*========================================
       Font Icon Variable End Here
=========================================*/

/*========================================
       Font Family Variable Start Here
=========================================*/

:root{
    --font-family-light: "Heebo-Light";
    --font-family-black: "Heebo-Black";
    --font-family-medium: "Heebo-Medium";
    --font-family-regular: "Heebo-Regular";
    --font-family-extralight: "Heebo-ExtraLight";
    --font-family-extrabold: "Heebo-ExtraBold";
    --font-family-semibold: "Heebo-SemiBold";
    --font-family-bold: "Heebo-Bold";
    --font-family-thin: "Heebo-Thin";
}

/*========================================
       Font Family Variable End Here
=========================================*/

/*========================================
    border Radius Variable Start Here
=========================================*/

:root{
    --border-radius-full-rounded: 100%;
    --border-radius-xxlg: 40px;
    --border-radius-xlg: 32px;
    --border-radius-lg: 24px;
    --border-radius-md: 20px;
    --border-radius-sm: 16px;
    --border-radius-xs-1: 12px;
    --border-radius-xs-2: 8px;
    --border-radius-xs-3: 4px;
}

/*========================================
    border Radius Variable End Here
=========================================*/

/*========================================
    Box Shadow Variable Start Here
=========================================*/

:root{
    --box-shadow1: -0.927px -0.375px 12px rgba(77,77,77,0.5);
    --box-shadow2: 0 0 19px rgba(182,182,182,0.5);
    --box-shadow3: 1.5px 2.598px 3.5px rgba(147,151,174,0.35);
    --box-shadow-circle-icon: 2px 2px 20px rgba(215,215,215,0.9);
}

/*========================================
    Box Shadow Variable End Here
=========================================*/


h1{
    color: var(--dark);
    font-size: var(--font-size-xxlg);
    line-height: var(--line-heights-xxlg);
    font-family: var(--font-family-semibold);
}

h1 span{
    color: var(--dark);
    font-size: var(--font-size-xxlg);
    line-height: var(--line-heights-xxlg);
    font-family: var(--font-family-semibold);
}

h2{
    color: var(--dark);
    font-size: var(--font-size-xlg);
    line-height: var(--line-height-xlg);
    font-family: var(--font-family-semibold);
}

h2 span{
    color: var(--dark);
    font-size: var(--font-size-xlg);
    line-height: var(--line-height-xlg);
    font-family: var(--font-family-semibold);
}

h3{
    color: var(--dark);
    font-size: var(--font-size-lg);
    line-height: var(--line-height-lg);
    font-family: var(--font-family-medium);
}

h4{
    color: var(--dark);
    font-size: var(--font-size-md-1);
    line-height: var(--line-heights-md-1);
    font-family: var(--font-family-medium);
}

h5{
    color: var(--dark);
    font-size: var(--font-size-md-3);
    line-height: var(--line-heights-md-3);
    font-family: var(--font-family-medium);
}

h6{
    color: var(--dark);
    font-size: var(--font-size-md-4);
    line-height: var(--line-heights-md-4);
    font-family: var(--font-family-medium);
}

p,span,strong,b,ul,li,a{
    color: var(--dark);
    font-size: var(--font-size-sm);
    line-height: var(--line-heights-sm);
    font-family: var(--font-family-regular);
}

a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus,
area:focus,
a:hover:focus{
    outline: 2px solid var(--theme-bg-color1);
}

select:focus-within,
select:focus-visible{
    outline: 2px solid var(--theme-bg-color1);
}

.theme-btn{
    padding: 8px 32px;
    text-align: center;
    font-size: var(--font-size-sm);
    line-height: var(--line-heights-sm);
    font-family: var(--font-family-regular);
    background-color: var(--theme-bg-color2);
    border: none;
    color: var(--dark);
    transition: .3s;
}

.theme-btn:hover{
    background-color: var(--dark);
    color: var(--light);
}

.theme-input,
.input{
    padding: 8px 32px;
    text-align: right;
    font-size: var(--font-size-sm);
    line-height: var(--line-heights-sm);
    font-family: var(--font-family-regular);
    background-color: transparent;
    border: 1px solid var(--border-color5);
    color: var(--dark);
    height: 54px;
    text-align: right !important;
    transition: .3s;
}

.theme-input:focus,
.input:focus{
    border: 1px solid var(--border-color2) !important;
    box-shadow: var(--box-shadow3) !important;
    color: var(--dark) !important;
    outline: none !important;
}

.theme-input:focus::placeholder,
.input:focus::placeholder{
    opacity: 0 !important;
}

.theme-input::placeholder,
.input::placeholder{
    color: var(--dark);
    transition: .3s;
}

.input-otr{
    position: relative;
    flex: 1;
}

.input-otr label{
    display: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

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

@media (max-width: 575px){
    h1{
        font-size: var(--font-size-lg);
        line-height: var(--line-height-lg);
    }
    h2{
        font-size: var(--font-size-md-1);
        line-height: var(--line-heights-md-1);
    }
}

@media (max-width: 575px){
    .col-xs-1{
        flex: 0 0 auto;
        width: 8.33333333%;
    }

    .col-xs-2{
        flex: 0 0 auto;
        width: 16.66666667%;
    }

    .col-xs-3{
        flex: 0 0 auto;
        width: 25%;
    }

    .col-xs-4{
        flex: 0 0 auto;
        width: 33.33333333%;
    }

    .col-xs-5{
        flex: 0 0 auto;
        width: 41.66666667%;
    }

    .col-xs-6{
        flex: 0 0 auto;
        width: 50%;
    }

    .col-xs-7{
        flex: 0 0 auto;
        width: 58.33333333%;
    }

    .col-xs-8{
        flex: 0 0 auto;
        width: 66.66666667%;
    }

    .col-xs-9{
        flex: 0 0 auto;
        width: 75%;
    }

    .col-xs-10{
        flex: 0 0 auto;
        width: 83.33333333%;
    }

    .col-xs-11{
        flex: 0 0 auto;
        width: 91.66666667%;
    }

    .col-xs-12{
        flex: 0 0 auto;
        width: 100%;
    }
}

/* Mobile Menu Start Here */

@media (min-width : 992px){
    .mobile-nav{
        display: none;
    }
}

@media (max-width : 991px){
    .mob-header{
        background-color: #fff;
        border-bottom: 1px solid #e6e6e6;
        height: 74px;
    }
    .mob-header .container .row{
        padding: 0;
        height: 74px;
        align-items: center;
    }
    .mob-header .hamburger-menu{
        width: 30px;
        height: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
    }
    .mob-header .hamburger-menu .bar{
        background-color: #000;
    }
    .mob-header .hamburger-menu .bar::before,
    .mob-header .hamburger-menu .bar::after{
        background-color: #000;
    }
    .mob-header .desk-menu .menu-container{
        top: 74px;
    }
    .mob-header .desk-menu .menu-container .menu li.back a {
        display: flex;
        align-items: center;
        gap: 12px;
        background-color: #e6e6e6;
    }
    .desk-menu .icon-li .icon-a{
        width: auto;
        height: auto;
        background-color: transparent;
    }
    .desk-menu .icon-li .icon-a .social-icon{
        color: #000;
        font-size: 20px;
    }
    .mobile-nav{
        display: block;
    }
    .mob-header .desk-menu .logo-site .logo-img{
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 150px;
        height: 66px;
    }
    .logo-site .logo-img{
        width: 130px;
    }
    .desk-menu .icon-main{
        position: relative;
        top: -26px;
    }
    .desk-menu .icon-ul{
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    .bar-icon-otrr{
        background-color: transparent;
    }
    .desk-menu .icons-li .icons-a .social-icon,
    .bar-icon-otrr .bar-icon-inr{
        font-size: 20px;
        color: #000;
        position: relative;
        transition: .3s; 
    }
    .desk-menu .icons-li .icons-a .items-count{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background-color: #000;
        color: #fff;
        font-size: 12px;
        line-height: 11px;
        font-family: "Heebo-Light";
        position: absolute;
        top: -8px;
        left: -8px;
    }
    .desk-menu .icons-li .icons-a:hover,
    .mob-header .hamburger-menu span:hover{
        background-color: transparent;
    }
    .bar-icon-otr {
        position: absolute !important;
        right: 44px;
        top: 52%;
        transform: translateY(-50%);
        color: #fff;
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .bar-icon-otrr .items-count {
        position: absolute;
        left: -10px;
        top: -6px;
        width: 18px;
        height: 18px;
        border-radius: 100%;
        background-color: #000;
        font-family: var(--font-family-regular);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 12px;
        line-height: 11px;
        transition: .3s;
    }
    .bar-icon-otrr{
        color: #fff;
    }
    .mob-header .desk-menu{
        height: 70px;
    }
    .logo-site {
        position: absolute;
        text-align: center;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
    .desk-menu .icon-main {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
    }
    .desk-menu .icon-ul{
        gap: 12px;
    }
    .desk-menu .icon-ul .icon-li{
        position: relative;
    }
    .mob-basket .icon-ul .icons-li{
        position: relative;
    }
}

/* Mobile Menu End Here */

/* Desktop Header CSS Start Here */

.topNav{
    background-color: #f4f4f4;
}

.topNav .wrapper{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.topNav .menu-main .menu-ul{
    display: flex;
    align-items: center;
}

.topNav .menu-main .menu-li:not(:last-child){
    border-right: 1px solid #e8e8e8;
}

.topNav .menu-main .menu-li:last-child{
    border-right: 1px solid #e8e8e8;
}

.topNav .menu-main .menu-link{
    padding: 2px 14px;
    font-size: var(--font-size-xs-1);
    line-height: var(--line-heights-xs-1);
    color: var(--theme-text-color1);
    font-family: var(--font-family-regular);
}

.topNav .menu-main .menu-link:hover{
    color: var(--theme-text-color2);
}

.topNav .center-text{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    gap: 12px;
}

.topNav .center-text .card-icon{
    color: #434343;
    font-size: 18px;
}

.topNav .center-text .money-back{
    font-size: 18px;
    line-height: 28px;
    color: #222222;
    font-family: var(--font-family-regular);
}

.topNav .icons-main .icons-ul{
    display: flex;
    align-items: center;
    gap: 12px;
}

.topNav .icons-main .icons-li{
    display: flex;
    align-items: center;
    justify-content: center;
}

.topNav .icons-main .icons{
    font-size: 18px;
    color: #434343;
    cursor: pointer;
    transition: .3s;
}

.topNav .icons-main .icons:hover{
    color: var(--theme-text-color2);
}

/* ===================== */

.searchNav{
    position: relative;
    padding: 10px 0;
    border-bottom: 1px solid #e4e4e4;
}

.searchNav::after{
    content: "";
    position: absolute;
    left: 50%;
    bottom: -16px;
    width: 40px;
    height: 30px;
    background-color: #fff;
    background-image: url("/uploads/images/diamond.png");
    transform: translateX(-50%);
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: center;
    z-index: 1;
}

.searchNav .wrapper{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 80px;
}

.searchNav .input-otr{
    max-width: 263px;
    width: 100%;
}

.searchNav .input-otr .theme-input{
    padding: 8px 30px 8px 0px;
    width: 100%;
    height: auto;
    border: none;
    border-radius: 0;
    border-bottom: 1px solid var(--border-color1);
}

.searchNav .input-otr .theme-input:focus{
    border: none !important;
    border-bottom: 1px solid var(--border-color1) !important;
    box-shadow: none !important;
}

.searchNav .input-otr button{
    padding: 0;
    background-color: transparent;
}

.searchNav .input-otr .icon-otr{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
}

.searchNav .input-otr .icon-otr .search-icon{
    font-size: 18px;
    color: var(--theme-text-color1);
}

.searchNav .logo-img{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -56%);
    width: 123px;
    height: auto;
    object-fit: contain;
}

.searchNav .icons-ul{
    display: flex;
    align-items: center;
    gap: 20px;
}

.searchNav .icons-ul .icons-link{
    position: relative;
}

.searchNav .icons-ul .icons-link .icons{
    font-size: var(--font-size-icon-lg-3);
    color: var(--theme-text-color1);
    transition: .3s;
}

.searchNav .icons-ul .icons-link .icons:hover{
    color: var(--theme-text-color3);
}

.searchNav .icons-ul .items-count{
    position: absolute;
    right: 19px;
    top: -10px;
    width: 22px;
    height: 22px;
    border-radius: 100%;
    background-color: var(--theme-text-color2);
    font-family: "Heebo-Medium";
    color: var(--light);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    transition: .3s;
}

/* ===================== */

.mega-main-menu{
    position: relative;
    border-top: 1px solid #fff;
}

.mega-main-menu .menu-ul{
    display: flex;
    align-items: center;
}

.mega-main-menu .menu-link{
    position: relative;
    padding: 12px 32px;
    font-size: 18px;
    line-height: 28px;
    color: #1a191e;
    z-index: 10;
}

.mega-main-menu .menu-link:hover{
    background-color: var(--theme-text-color2);
}

/* ===================== */

.stickyNav{
    position: fixed;
    right: 0;
    top: -300px;
    width: 100%;
    background-color: #fff;
    border: none;
    border-bottom: 1px solid #e6e6e6;
    transition: .3s;
    z-index: 9999999;
}

.stickyNav-active{
    top: 0;
}

.stickyNav .wrapper{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.stickyNav .wrapper .logo-img{
    width: 79px;
    height: auto;
    object-fit: contain;
}

.stickyNav .wrapper .menu-link{
    padding: 12px 20px;
}

.stickyNav .icons-ul{
    display: flex;
    align-items: center;
    gap: 20px;
}

.stickyNav .icons-ul .icons-link{
    position: relative;
}

.stickyNav .icons-ul .icons-link .icons{
    font-size: 20px;
    color: var(--theme-text-color1);
    transition: .3s;
}

.stickyNav .icons-ul .icons-link .icons:hover{
    color: var(--theme-text-color3);
}

.stickyNav .icons-ul .items-count{
    position: absolute;
    right: 11px;
    top: -5px;
    width: 18px;
    height: 18px;
    border-radius: 100%;
    background-color: var(--theme-text-color2);
    font-family: var(--font-family-medium);
    color: var(--light);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    transition: .3s;
}

@media (max-width: 992px){
    .desktop-header{
        display: none;
    }
}

/* Desktop Header CSS End Here */

/* Banner Start Here */

.desktop-banner{
    display: block;
}

.mobile-banner{
    display: none;
}

@media (max-width : 992px){
    .desktop-banner{
        display: none !important;
    }
    .mobile-banner{
        display: none !important;
    }
}

.banner-main{
    position: relative;
}

.banner-main .banner-img{
    width: 100%;
    display: inherit;
}

.banner-main .overlay-banner{
    position: absolute;
    z-index: 1000;
    top: 50%;
    left: -50px;
    max-width: 750px;
    width: 100%;
    height: 750px;
    background-color: #1a191e;
    border-radius: 100%;
    transform: translateY(-50%);
}

.banner-main .overlay-banner .overlay-inr{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    max-width: 550px;
    width: 100%;
    z-index: 10;
}

.banner-main .overlay-banner .sale{
    font-size: 32px;
    letter-spacing: 3px;
    color: var(--theme-text-color3);
    margin-bottom: 10px;
}

.banner-main .overlay-banner h1,
.banner-main .overlay-banner h2{
    font-size: 48px;
    line-height: 74px;
    font-family: "Heebo-Medium";
    color: #fff;
}

.banner-main .overlay-banner h1::after,
.banner-main .overlay-banner h1::before,
.banner-main .overlay-banner h2::after,
.banner-main .overlay-banner h2::before{
    display: none;
}

.banner-main .overlay-banner h1 span,
.banner-main .overlay-banner h2 span{
    display: block;
    color: #fff;
}

.banner-main .overlay-banner p{
    font-size: 18px;
    line-height: 28px;
    color: #fff;
    margin: -4px 0 20px 0;
}

.banner-main .overlay-banner .action{
    display: inline-flex;
}

.banner-main .overlay-banner .theme-btn:hover{
    background-color: #fff;
    color: #000;
}

.banner-main .slick-slider{
    margin: 0 !important;
}

.banner-main .overlay-banner h1,
.banner-main .overlay-banner p,
.banner-main .overlay-banner .action{
    opacity: 0;
    transform: translateY(-20px);
    transition: .3s;
}

.banner-main .slick-active h1,
.banner-main .slick-active p,
.banner-main .slick-active .action{
    opacity: 1;
    transition: .7s;
    transform: translateY(0) scale(1);
}

.banner-main .slick-active h1{
    transition-delay: .3s;
}

.banner-main .slick-active p{
    transition-delay: .6s;
}

.banner-main .slick-active .action{
    transition-delay: .9s;
}

.banner-main .slick-slider .slick-arrow{
    width: 44px;
    height: 44px;
    border-radius: 100%;
    display: none !important;
    align-items: center;
    justify-content: center;
    background-color: var(--light);
    top: 50%;
    transform: translate(-50%, -50%);
    color: var(--dark);
    font-size: var(--font-size-icon-sm);
    box-shadow: var(--box-shadow-circle-icon);
    cursor: pointer;
    z-index: 10;
    transition: .3s;
}

.banner-main .slick-slider .slick-disabled{
    pointer-events: none;
    opacity: .5;
}

.banner-main .slick-slider .slick-disabled:hover{
    background-color: var(--theme-bg-color1) !important;
}

.banner-main .slick-slider .slick-arrow:hover{
    background-color: var(--theme-bg-color1);
    color: var(--light);
}

.banner-main .slick-slider .arrow-right{
    position: absolute;
    right: 40px;
}

.banner-main .slick-slider .arrow-left{
    position: absolute;
    left: 74px;
}

.banner-main .slick-slider{
    margin: 0 !important;
}

.banner-main .slick-dots{
    position: absolute;
    bottom: 10px;
    margin: 0;
    
}

.banner-main .slick-dots li button::before{
    display: none;
}

.banner-main .slick-dots li{
    width: 12px;
    height: 12px;
    border-radius: 100%;
    background-color: #000;
    transition: .3s;
}

.banner-main .slick-dots .slick-active{
    background-color: var(--theme-text-color3);
}

.banner-main .slick-track{
    display: flex;
}

.banner-main .slick-slide{
    float: inherit !important;
}

@media (max-width : 992px){
    .banner-main{
        margin-top: 74px;
    }
    .banner-main .overlay-banner{
        left: 0;
    }
    .banner-main .overlay-banner .sale{
        font-size: 20px;
        line-height: 26px;
    }
    .banner-main .overlay-banner h1{
        font-size: 28px;
        line-height: 36px;
    }
    .banner-main .overlay-banner p{
        font-size: 18px;
        line-height: 26px;
        margin: -4px 0 8px 0;
    }
    .banner-main .overlay-banner .action .theme-btn{
        padding: 4px 20px;
    }
    .banner-main .overlay-banner{
        width: 70%;
        top: 50%;
    }
    .banner-main .overlay-banner .overlay-inr{
        max-width: 700px;
    }
}

@media (max-width : 576px){
    .banner-main .overlay-banner{
        display: none;
    }
}

/* Banner End Here */


/* Clients Logo Start Here */

.clients-logos{
    padding: 20px 0;
    position: relative;
}

.clients-logos .clients_logo{
    margin: 20px 0;
    position: relative;
    z-index: 20;
}

.clients-logos .clients_logo .slick-slide{
    padding: 0 12px;
}

.clients-logos .clients_logo .logo-img-otr{
    position: relative;
    display: flex !important;
    align-items: center;
    justify-content: center;
    transition: .3s;
}

.clients-logos .clients_logo .logo-img-inr{
    object-fit: contain;
    transition: .3s;
}

.clients-logos .slick-arrow{
    width: 57px;
    height: 69px;
    border-radius: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    border: 1px solid #767676;
    color: var(--dark);
    cursor: pointer;
    z-index: 99999;
    transition: .3s;
}

.clients-logos .slick-arrow:hover{
    background-color: #767676;
    color: #fff;
}

.slick-disabled{
    opacity: .3;
    pointer-events: none;
    border: 1px solid #000;
}

.clients-logos .arrow-left{
    left: -80px;
}

.clients-logos .arrow-right{
    right: -80px;
}

.clients-logos .slick-dots{
    bottom: -30px;
}

.clients-logos .slick-dots li,
.clients-logos .slick-dots li button{
    width: 12px;
    height: 12px;
    border-radius: 100%;
    background-color: #000;
    transition: .3s;
}

.clients-logos .slick-dots .slick-active button{
    background-color: var(--theme-text-color3);
}

@media (max-width : 992px){
    .clients-logos .container{
        padding: 0 6px;
    }
}

/* Clients Logo End Here */

/* Slider Category */

.categories{
    position: relative;
    margin: 30px 0;
}

.categories .col-item-otr{
    position: relative;
}

.categories .col-item-otr:focus{
    border: none;
    outline: none;
}

.categories .swiper-button-next,
.categories .swiper-button-prev{
    top: 66% !important;
}

.categories .col-item-inr{
    padding: 32px 10px 24px 10px;
    border-radius: 0;
    border: 1px solid #dfdfdf;
    text-align: center;
    background-color: var(--light);
    transition: .3s;
}

.categories .col-item-inr:hover{
    box-shadow: 2px 2px 10px rgba(215,215,215,0.7);
    background-color: var(--theme-bg-color2);
}

.categories .col-item-inr:hover .categories-icon{
    color: var(--dark);
}

.categories .col-item-inr:hover .category-img{
    mix-blend-mode: plus-lighter;
}

.categories .col-item-inr:hover p{
    color: var(--dark);
}

.categories .col-item-inr .icon-otr{
    width: 80px;
    height: 60px;
    object-fit: contain;
    margin: 0 auto 0 auto;
}

.categories .col-item-inr .icon-otr .category-img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    margin-bottom: 6px;
    font-size: var(--font-size-icon-lg-1);
    color: var(--dark);
    font-weight: 300;
    opacity: 80%;
    transition: .3s;
}

.categories .col-item-inr .categories-icon{
    width: 100%;
    height: 100%;
    object-fit: contain;
    margin-bottom: 6px;
    font-size: var(--font-size-icon-lg-1);
    color: var(--dark);
    font-weight: 300;
    opacity: 80%;
    transition: .3s;
}

.categories .col-item-inr p{
    font-size: var(--font-size-sm);
    line-height: var(--line-heights-sm);
    color: var(--dark);
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: .3s;
}

.categories .slick-arrow{
    width: 57px;
    height: 69px;
    border-radius: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    border: 1px solid #767676;
    color: var(--dark);
    cursor: pointer;
    z-index: 99999;
    transition: .3s;
}

.categories .slick-arrow:hover{
    background-color: #767676;
    color: #fff;
}

.categories .slick-disabled{
    opacity: .3;
    pointer-events: none;
    border: 1px solid #000;
}

.categories .arrow-left{
    left: 20px;
}

.categories .arrow-right{
    right: 20px;
}

.categories .slick-dots{
    bottom: -30px;
}

.categories .slick-dots li,
.categories .slick-dots li button{
    width: 12px;
    height: 12px;
    border-radius: 100%;
    background-color: #000;
    transition: .3s;
}

.categories .slick-dots .slick-active button{
    background-color: var(--theme-text-color3);
}

.swiper-button-next:after,
.swiper-button-prev:after{
    display: none;
}

/* categories End Here */

/* Category Start Here */

.category-main{
    position: relative;
    margin: 30px 0;
}

.category-main .wrapper{
    text-align: center;
    margin-bottom: 24px;
}

.category-main .row{
    gap: 24px 0;
}

@media (max-width : 992px){
    .category-main .col-otr{
        padding: 0 4px;
    } 
    .category-main .row{
        gap: 8px 0;
        margin: 0 -4px;
    }
}

.category-main .col-inr{
    height: 100%;
    position: relative;
    border: 2px solid var(--theme-bg-color2);
    transition: .3s;
}

.category-main .col-inr:hover{
    border: 2px solid transparent;
    box-shadow: 0 0 19px rgba(182,182,182,0.5);
}

.category-main .col-inr .category-img{
    aspect-ratio: 1 / 1;
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: bottom;
}

.category-main .col-inr .categories-icon{
    font-size: 50px;
    color: #000;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.category-main .col-inr .title-otr{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 6px;
    text-align: center;
    background-color: var(--theme-bg-color2);
}

.category-main .col-inr .title{
    font-size: 20px;
    line-height: 28px;
    color: #000;
} 

/* Category End Here */

/* Featured Products Css Start Here */

.products-main{
    position: relative;
    margin: 30px 0 0 0;
}

.products-main .swiper-wrapper{
    position: relative;
    left: 12px;
    padding-bottom: 40px;
}

.products-main .wrapper{
    max-width: 700px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 20px;
}

.products-main .row{
    gap: 24px 0;
    margin: 0 -6px;
}

.products-main .col-otr{
    text-align: center;
}

.products-main .col-inr{
    border: 1px solid #dfdfdf;
    background-color: #fff;
    transition: .3s;
}

.products-main .col-inr:hover{
    box-shadow: 6.47px 24.148px 17.5px rgba(0,0,0,0.13);
}

.products-main .img-otr{
    position: relative;
}

.products-main .img-otr .img-inr .product-img{
    width: 100%;
    height: 301px !important;
    border-radius: 0 !important;
}

@media (max-width : 992px){
    .products-main .img-otr .img-inr .product-img{
        width: 200px;
    }
}

@media (max-width : 600px){
    .products-main .img-otr .img-inr .product-img{
        width: 150px;
    }
}

.products-main .img-otr .heart-icon-otr{
    position: absolute;
    left: 10px;
    top: 10px;
}

.products-main .img-otr .heart-icon{
    font-size: 24px;
    color: #060606;
    cursor: pointer;
    transition: .3s;
}

.products-main .img-otr .heart-icon:hover{
    color: red;
}

.products-main .img-otr .tag-otr{
    position: absolute;
    right: 10px;
    top: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 57px;
    height: 57px;
    border-radius: 100%;
    background-color: #907258;
    font-size: 17px;
    line-height: 24px;
    color: #fff;
    font-family: "Heebo-Medium";
}

.products-main .img-otr .tag-otr p{
    font-size: 17px;
    line-height: 24px;
    color: #fff;
    font-family: "Heebo-Medium";
}

.products-main .content-div{
    padding: 12px;
}

.products-main .content-div .heading-otr{
    display: flex;
    align-items: center;
    justify-content: center;
}

.products-main .content-div .heading{
    font-size: 22px;
    line-height: 34px;
    color: #000;
    font-family: "Heebo-Medium";
    margin-bottom: 10px;
    height: 68px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: .3s;
}

.products-main .content-div .heading:hover{
    color: var(--theme-text-color3);
}

.products-main .content-div .desc,
.products-main .content-div .desc *{
    font-size: 16px;
    line-height: 24px;
    color: #6f6f6f;
    font-family: var(--font-family-regular);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 48px;
    font-style: normal;
    font-weight: 400;
}

.products-main .content-div .price-otr{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin: 14px 0 18px 0;
}

.products-main .content-div .price-otr del{
    font-size: 18px;
    line-height: 26px;
    color: #000;
    font-family: "Heebo-Medium";
    opacity: 0.502;
}

.products-main .content-div .price-otr p{
    font-size: 18px;
    line-height: 26px;
    color: #000;
    font-family: "Heebo-Medium";
}


.products-main .content-div .action{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
} 

.products-main .swiper-wrapper .content-div .action .theme-btn{
    height: auto;
}

.products-main .content-div .action .theme-btn{
    width: 100%;
    height: 36px;
    padding: 3px 20px;
    border: 1px solid #444444;
    background-color: transparent;
}

.products-main .content-div .action .theme-btn:hover{
    background-color: var(--theme-text-color2);
    border: 1px solid var(--theme-text-color3);
    color: #212121;
}

.products-main .swiper-arrow{
    width: 57px;
    height: 69px;
    border-radius: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f2f2f2;
    border: 1px solid #767676;
    color: var(--dark);
    cursor: pointer;
    z-index: 99999;
    transition: .3s;
}

.products-main .swiper-arrow:hover{
    background-color: #767676;
    color: #fff;
}

.products-main .swiper-arrow::after{
    display: none;
}

.products-main .swiper-arrow-right{
    right: 30px;
}

.products-main .swiper-arrow-left{
    left: 32px;
}

@media (max-width : 992px){
    .products-main .row{
        margin: 0 -4px;
        gap: 8px 0;
    }
    .products-main .col-otr{
        padding: 0 4px;
    }
    .products-main .swiper-wrapper .col-otr{
        padding: 0;
    }
    .products-main .content-div .heading{
        margin-bottom: 0;
    }
    .products-main .content-div .price-otr{
        margin: 4px 0 8px 0;
    }
    .products-main .img-otr .tag-otr p{
        font-size: 15px;
        font-family: var(--font-family-regular);
    }
    .products-main .swiper-arrow{
        top: 57%;
        width: 40px;
        height: 40px;
    }
    .products-main .swiper-arrow-right{
        right: 0;
    }
    .products-main .swiper-arrow-left{
        left: 0;
    }
}

/* Featured Products Css End Here */

/* Banner Section Css Start Here */

.banner-sec-main{
    margin: 30px 0;
}

.banner-sec-main .row{
    gap: 24px 0;
}

.banner-sec-main .col-otr{
    position: relative;
}

.banner-sec-main .col-inr{
    position: relative;
    border: 1px solid var(--theme-text-color3);
    transition: .3s;
}

.banner-sec-main .col-inr:hover{
    border: 1px solid transparent;
}

.banner-sec-main .col-inr:hover::after{
    opacity: 1;
    visibility: visible;
}

.banner-sec-main .col-inr::after{
    content: "";
    position: absolute;
    left: -8px;
    top: -8px;
    width: calc(100% + 16px);
    height: calc(100% + 16px);
    border: 1px solid var(--theme-text-color3);
    opacity: 0;
    visibility: hidden;
    z-index: -1;
    transition: .3s;
}

.banner-sec-main .col-inr .banner-img{
    width: 100%;
    object-fit: contain;
}

.banner-sec-main .col-inr .overlay{
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    max-width: 400px;
    width: 100%;
}

.banner-sec-main .col-inr .overlay .tag{
    font-size: 28px;
    line-height: 40px;
    color: #000;
    font-family: "Heebo-Medium";
}

.banner-sec-main .col-inr .overlay .banner-name{
    font-size: 36px;
    line-height: 44px;
    color: #000;
    font-family: "Heebo-SemiBold";
    margin: 12px 0 20px 0;
}

.banner-sec-main .col-inr .overlay .action{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.banner-sec-main .col-inr .overlay .action .theme-btn{
    background-color: transparent;
    color: #000;
    border: 1px solid #000;
}

.banner-sec-main .col-inr .overlay .action .theme-btn:hover{
    background-color: var(--theme-text-color3);
}

@media (max-width : 992px){
    .banner-sec-main .col-inr .overlay .tag{
        font-size: 20px;
        line-height: 26px;
    }
    .banner-sec-main .col-inr .overlay .banner-name{
        font-size: 28px;
        line-height: 38px;
        margin: 4px 0 10px 0;
    }
    .banner-sec-main .col-inr .overlay{
        max-width: 260px;
    }
    .banner-sec-main .col-inr .overlay .action .theme-btn{
        padding: 4px 20px;
    }
}

/* Banner Section Css End Here */


/* About Us Css Start Here */

.about-Sec-main{
    margin: 70px 0 30px 0;
    position: relative;
}

.about-Sec-main .row{
    gap: 40px 0;
}

.about-Sec-main .col-content-inr h2{
    margin-bottom: 30px;
}

.about-Sec-main .col-content-inr h2::before{
    right: 0;
    bottom: -16px;
    left: inherit;
    transform: none;
}

.about-Sec-main .col-content-inr .big-text{
    font-size: 28px;
    line-height: 38px;
    color: #000;
    font-family: "Heebo-Medium";
    margin: 14px 0 10px 0;
}

.about-Sec-main .col-content-inr p{
    font-size: 18px;
    line-height: 28px;
    color: #000;
    font-family: var(--font-family-regular);
}

.about-Sec-main .col-content-inr .action{
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
}

.about-Sec-main .col-img-inr{
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    max-width: 450px;
    width: 100%;
    margin-right: auto;
}

.about-Sec-main .col-img-inr::after{
    content: "";
    position: absolute;
    right: -20px;
    top: -20px;
    width: 100%;
    height: 100%;
    border: 1px solid var(--theme-text-color3);
    z-index: -1;
}

@media (max-width : 992px){
    .about-Sec-main .col-img-inr::after{
        display: none;
    }
    .about-Sec-main .col-img-inr,
    .about-Sec-main .col-img-inr img{
        width: 100%;
        max-width: 100%;
    }
}

/* About Us Css End Here */

/* CTA Section Css Start Here */

.cta-sec-main{
    overflow: hidden;
    position: relative;
    background-color: #f3f3f3;
    padding: 50px 0;
    margin: 40px 0;
}

.cta-sec-main .cta-img-1{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-60%);
    width: 300px;
    height: auto;
}

.cta-sec-main .cta-img-2{
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-37%);
    width: 300px;
    height: auto;
}


.cta-sec-main .row{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    max-width: 800px;
    width: 100%;
    margin: 0 auto;
    position: relative;
    z-index: 10;
}

.cta-sec-main .row .sale-off{
    position: relative;
    font-size: 30px;
    line-height: 42px;
    color: #000;
    font-family: var(--font-family-regular);
    margin-bottom: 20px;
}

.cta-sec-main .row .sale-off span{
    font-size: 30px;
    line-height: 42px;
    color: var(--theme-text-color3);
}

.cta-sec-main .row .sale-off::after{
    content: "";
    position: absolute;
    left: 50%;
    bottom: -8px;
    transform: translateX(-50%);
    width: 50px;
    height: 1px;
    background-color: var(--theme-text-color3);
}

.cta-sec-main .row h2::after,
.cta-sec-main .row h2::before{
    display: none;
}

.cta-sec-main .row p{
    font-size: 18px;
    line-height: 28px;
    color: #000;
    font-family: var(--font-family-regular);
    margin: 8px 0 24px 0;
}

.cta-sec-main .action{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

@media (max-width : 992px){
    .cta-sec-main .cta-img-1,
    .cta-sec-main .cta-img-2{
        display: none;
    }
}

/* CTA Section Css End Here */

/* Blog Section Css Start Here */

.blog-sec-main{
    position: relative;
    margin: 30px 0;
}

.blog-sec-main .wrapper{
    max-width: 700px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 20px;
}

.blog-sec-main .row{
    gap: 24px 0;
}

.blog-sec-main .swiper-wrapper{
    margin-bottom: 30px;
    position: relative;
    left: 12px;
}

.blog-sec-main .col-inr{
    position: relative;
    background-color: #fff;
    border: 1px solid #dfdfdf;  
    padding: 8px;
    height: 100%;
    transition: .3s;
}

.blog-sec-main .col-inr:hover{
    box-shadow: 12.5px 21.651px 17.5px rgba(0,0,0,0.13);
}

.blog-sec-main .col-inr .img-otr{
    position: relative;
}

.blog-sec-main .col-inr .img-otr .blog-img{
    width: 100%;
    height: auto;
    object-fit: contain;
}

.blog-sec-main .col-inr .img-otr .posted-date{
    background-color: #fcfcfc;
    font-size: 16px;
    line-height: 24px;
    color: #000;
    padding: 4px 10px;
    display: inline-block;
    position: absolute;
    right: 0;
    bottom: 4px;
}

.blog-sec-main .col-inr .content-div{
    margin-top: 20px;
}

.blog-sec-main .col-inr .content-div .heading{
    font-size: 22px;
    line-height: 28px;
    color: #000;
    font-family: "Heebo-Medium";
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog-sec-main .col-inr .content-div p{
    font-size: 18px;
    line-height: 28px;
    color: #000;
    font-family: var(--font-family-regular);
    margin: 6px 0 0 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog-sec-main .btn-otr{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 30px;
}

.blog-slider .btn-otr{
    margin-top: 0;
}

.blog-sec-main .swiper-arrow{
    width: 57px;
    height: 69px;
    border-radius: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f2f2f2;
    border: 1px solid #767676;
    color: var(--dark);
    cursor: pointer;
    z-index: 99999;
    transition: .3s;
}

.blog-sec-main .swiper-arrow:hover{
    background-color: #767676;
    color: #fff;
}

.blog-sec-main .swiper-arrow::after{
    display: none;
}

.blog-sec-main .swiper-arrow-right{
    right: 30px;
}

.blog-sec-main .swiper-arrow-left{
    left: 32px;
}

@media (max-width : 992px){
    .blog-sec-main .swiper-arrow{
        top: 57%;
        width: 40px;
        height: 40px;
    }
    .blog-sec-main .swiper-arrow-right{
        right: 0;
    }
    .blog-sec-main .swiper-arrow-left{
        left: 0;
    }
}

/* Blog Section Css End Here */

/* Reviews Section Css Start Here */

.review-sec-main{
    position: relative;
    padding: 50px 0;
    overflow: hidden;
}

.review-sec-main .bg-img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.review-sec-main .wrapper{
    max-width: 700px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 0;
    position: relative;
    z-index: 1;
}

.review-sec-main .wrapper h2{
    color: var(--theme-text-color3);
}

.review-sec-main .wrapper p{
    color: #fff;
}

.review-sec-main .row{
    max-width: 80%;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.review-sec-main .row .swiper-wrapper{
    position: relative;
    left: 12px;
}

.review-sec-main .row .col-otr{
    margin: 0 auto;
}

.review-sec-main .col-inr{
    position: relative;
    padding: 60px 100px 10px 100px;
    text-align: center;
    background-color: #fff;
}

.review-sec-main .col-inr p{
    font-size: 18px;
    line-height: 28px;
    color: #000;
    font-family: var(--font-family-regular);
    margin-bottom: 16px;
}

.review-sec-main .col-inr .user-info{
    position: relative;
}

.review-sec-main .col-inr .user-info .username{
    font-size: 24px;
    line-height: 34px;
    color: #000;
    font-family: "Heebo-Medium";
}

.review-sec-main .col-inr .user-info p{
    font-size: 17px;
    line-height: 24px;
    color: var(--theme-text-color3);
    font-family: var(--font-family-regular);
}

.review-sec-main .col-inr .icon1{
    position: absolute;
    left: 40px;
    top: 50px;
}

.review-sec-main .col-inr .icon2{
    position: absolute;
    right: 80px;
    bottom: 40px;
    transform: rotate(180deg);
}

.review-sec-main .swiper-arrow{
    width: 57px;
    height: 69px;
    border-radius: 0;
    position: absolute;
    top: 65%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f2f2f2;
    border: 1px solid #767676;
    color: #000;
    cursor: pointer;
    z-index: 99999;
    transition: .3s;
}

.review-sec-main .swiper-arrow:hover{
    background-color: #767676;
    color: #fff;
}

.review-sec-main .swiper-arrow::after{
    display: none;
}

.review-sec-main .swiper-arrow-right{
    right: 30px;
}

.review-sec-main .swiper-arrow-left{
    left: 32px;
}

.review-sec-main .swiper-pagination-bullet{
    background-color: #fff;
    width: 12px;
    height: 12px;
}

.review-sec-main .swiper-pagination-bullet-active{
    background-color: var(--theme-text-color3);
}

@media (max-width : 992px){
    .review-sec-main .row{
        max-width: 100%;
    }
    .review-sec-main .swiper-arrow{
        display: none;
    }
    .review-sec-main .col-inr{
        padding: 20px 20px 10px 20px; 
    }
    .review-sec-main .col-inr .icon1,
    .review-sec-main .col-inr .icon2{
        display: none;
    }
}

/* Reviews Section Css End Here */

/* Footer Css Start Here */

.footer-main{
    padding: 40px 0;
}

.footer-main .row{
    gap: 40px 0;
}

.footer-main .col-about-inr{
    position: relative;
    top: 10px;
}

.footer-main .col-about-inr .logo-img{
    width: 240px;
}

.footer-main .col-about-inr p{
    margin: 14px 0 20px 0;
}

.footer-main .col-about-inr .icons-ul{
    display: flex;
    align-items: center;
    gap: 20px;
}

.footer-main .col-about-inr .icons-ul .icon{
    font-size: 24px;
    color: var(--theme-text-color1);
    transition: .3s;
} 

.footer-main .col-about-inr .icons-ul .icon:hover{
    color: var(--theme-text-color3);
}

.footer-main h3{
    font-size: 22px;
    line-height: 30px;
    color: var(--theme-text-color1);
    font-family: var(--font-family-medium);
    margin-bottom: 10px;
}

.footer-main .col-links-inr .menu-ul{
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.footer-main .col-links-inr .menu-link{
    position: relative;
    display: inline-block;
    font-size: 18px;
    line-height: 24px;
    color: var(--theme-text-color1);
    font-family: var(--font-family-regular);
    transition: .3s;
}

.footer-main .col-links-inr .menu-link:hover{
    color: var(--theme-text-color2);
}

.footer-main .col-links-inr .menu-link:hover::after{
    width: 100%;
    opacity: 1;
    visibility: visible;
}

.footer-main .col-links-inr .menu-link::after{
    content: "";
    position: absolute;
    right: 0;
    bottom: -4px;
    width: 0;
    height: 1px;
    background-color: var(--theme-text-color2);
    opacity: 0;
    visibility: hidden;
    transition: .3s;
}

.footer-main .col-products-inr .products-ul{
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: relative;
    top: 8px;
}

.footer-main .col-products-inr .products-link{
    display: flex;
    align-items: center;
    gap: 12px;
}

.footer-main .col-products-inr .img-otr{
    width: 80px;
    height: 80px;
}

.footer-main .col-products-inr .img-otr .product-img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 0;
}

.footer-main .col-products-inr .product-info{
    flex: 1;
}

.footer-main .col-products-inr .name{
    font-size: 16px;
    line-height: 20px;
    color: var(--theme-text-color1);
    font-family: var(--font-family-regular);
    margin-bottom: 4px;
    transition: .3s;
}

.footer-main .col-products-inr .name:hover{
    color: var(--theme-text-color2);
}

.footer-main .col-products-inr .price{
    font-size: 19px;
    line-height: 28px;
    color: var(--theme-text-color3);
    font-family: var(--font-family-regular);
}

.footer-main .col-newsletter-inr p{
    font-size: 16px;
    line-height: 24px;
    color: var(--theme-text-color1);
    font-family: var(--font-family-regular);
}

.footer-main .col-newsletter-inr .input-otr{
    margin: 10px 0 16px 0;
}

.footer-main .col-newsletter-inr .theme-input{
    border-radius: 5px;
    background-color: #fff;
    border: 1px solid var(--border-color5);
    height: 44px;
    font-size: 16px;
    padding-left: 70px;
}

.footer-main .col-newsletter-inr .theme-input:focus{
    box-shadow: none !important;
    border: 1px solid var(--border-color2) !important;
}

.footer-main .col-newsletter-inr .icon-otr{
    width: 52px;
    height: 44px;
    border-radius: 4px;
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--theme-text-color2);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .3s;
}

.footer-main .col-newsletter-inr .icon-otr:hover{
    background-color: #dfdfdf;
}

.footer-main .col-newsletter-inr .icon-otr .envelope-icon{
    font-size: 24px;
    color: var(--theme-text-color1);
}

.footer-main .col-newsletter-inr .contact-ul{
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footer-main .col-newsletter-inr .contact-link{
    display: flex;
    align-items: center;
    gap: 10px;
} 

.footer-main .col-newsletter-inr .contact-link:hover .contact-details{
    color: var(--theme-text-color3);
}

.footer-main .col-newsletter-inr .contact-link .icon{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    font-size: 20px;
    color: var(--theme-text-color2);
}

.footer-main .col-newsletter-inr .contact-link .contact-details{
    transition: .3s;
}

.footer-center{
    padding: 6px 0;
    background-color: #fff0f6;
    border-bottom: 1px solid #dfdfdf;
    border-top: 1px solid #dfdfdf;
}

.footer-center p{
    color: var(--theme-text-color1);
    text-align: center;
}

.footer-center p .link{
    color: var(--theme-text-color1);
    display: inline-block;
    transition: .3s;
}

.footer-center p .link:hover{
    color: var(--theme-text-color3);
}

.copyright-main{
    padding: 9.5px 0;
    background-color: #fff;
}

.copyright-main .wrapper{
    text-align: center;
}

.copyright-main .pay-ul{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.copyright-main .pay-img{
    width: 60px;
    height: 30px;
    object-fit: contain;
    border: 1px solid var(--border-color5);
    padding: 4px 6px;
    transition: .3s;
}

.copyright-main .pay-img:hover{
    border: 1px solid var(--border-color2);
}

.copyright-main .copy .slasi-logo{
    display: inline-block;
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.copyright-main .copy .link{
    display: inline-block;
    color: var(--theme-text-color1);
    transition: .3s;
}

.copyright-main .copy:hover .link{
    color: var(--theme-text-color2);
}


@media (min-width : 992px){
    .footer-main .col-lg-3:nth-child(1),
    .footer-main .col-lg-3:nth-child(4),
    .footer-main .col-lg-3:nth-child(5){
        width: 24%;
    }
    .footer-main .col-lg-3:nth-child(2),
    .footer-main .col-lg-3:nth-child(3){
        width: 14%;
    }
}

@media(max-width : 992px){
    .copyright-main .wrapper{
        flex-wrap: wrap;
        justify-content: center !important;
        gap: 10px !important;
    }
    .footer-main .col-newsletter-inr .theme-input{
        width: 100%;
    }
}

/* Footer Css End Here */

/* Acc Button Styles Start Here */

.accessbility {
    transition: .3s;
    top: 60px !important;
}

.accessbility-active{
    top: 60px !important;
}

.accessbility,
.accessbility-main .accessbility-wrapper{
    left: 0 !important;
}

.accessbility-btn-otr .accessbility-btn .button-text{
    display: none;
}

.accessbility-btn-otr .accessbility-btn{
    padding: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.accessbility-btn-otr .accessbility-btn .fa-wheelchair{
    font-size: 20px;
}

/* Acc Button Styles End Here */

/* Whatsapp Floationg Button Styles */

.whatsapp-circle {
    position: fixed;
    right: 10px;
    bottom: 10px;
    z-index: 99999999;
    background-color: #25d366;
    border-radius: var(--border-radius-xs-2);
    text-decoration: none;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    box-shadow: 0px 0px 25px -6px rgb(0 0 0);
    animation: effect 5s infinite ease-in;
}

.whatsapp-circle .whatsapp-circle-icon{
    font-size: var(--font-size-icon-md-2);
    color: var(--light);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* Whatsapp Floationg Button Styles */

/* Inner Header Start Here */

.opening-section3 {
    border: none;
}

.opening-section3 .wrapper {
    position: relative;
}

.opening-section3 .wrapper::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: var(--theme-bg-color2);
    opacity: 93%;
}

.opening-section3 .breadcrumb-main {
    background-color: #f3f7fd;
    border-bottom: 1px solid #d3d3d3;
}

.opening-section3 .breadcrumb-main .home {
    display: flex;
    align-items: center;
}

.opening-section3 .breadcrumb .breadcrumb-item.active {
    color: var(--dark);
}

.breadcrumb-main .breadcrumb li,
.breadcrumb li{
    display: flex;
}

.breadcrumb-main .breadcrumb .active,
.breadcrumb .active{
    color: var(--theme-bg-color5);
}

.breadcrumb-main .breadcrumb li::before,
.breadcrumb li::before{
    padding: 0 8px;
    color: var(--theme-bg-color5);
}

.breadcrumb-otr{
    padding: 0 !important;
}

.breadcrumb-otr .breadcrumb .home{
    display: flex;
}

/* Inner Header End Here */

/* Wishlist Page Css Start Here */


.my-4 .container .text-center h2{
    margin-top: 90px;
}

.favoutite-products{
    min-height: auto !important;
    margin: 30px auto !important;
}

.favoutite-products div .theme-btn{
    width: auto;
    margin-bottom: 20px;
}

.favoutite-products .shopping-cart{
    margin: 0;
    border: none;
}

.favoutite-products .shopping-cart div:not(:last-child){
    margin-bottom: 12px;
}

.favoutite-products .cart-details{
    display: flex;
    align-items: center;
    padding: 10px;
    border: 1px solid #e4e4e4;
    border-radius: 4px;
    float: none;
}

.favoutite-products .cart-details li{
    padding: 0 12px;
}

.favoutite-products .cart-details .media{
    display: flex;
    align-items: center;
    gap: 10px;
}

.favoutite-products .cart-details .media .media-middle{
    margin: 0;
}

.favoutite-products .cart-details li:first-child .item-img{
    width: 80px;
    height: 80px;
    border-radius: 4px;
}

.favoutite-products .cart-details li:first-child .item-img img{
    width: 80px;
    height: 80px;
    border-radius: 4px;
    object-fit: fill;
}

.favoutite-products .cart-details li:first-child .media-body h6{
    margin: 0;
}

.favoutite-products .cart-details li:first-child .media-body h6 a{
    font-size: 16px;
    line-height: 24px;
    font-family: "Heebo-Regular";
}

.favoutite-products .cart-details li:nth-child(2) div span{
    font-size: 16px;
    line-height: 24px;
    font-family: "Heebo-Regular";
}

.favoutite-products .cart-details li:nth-child(3) .theme-btn{
    padding: 8px 16px;
    font-size: 16px;
    line-height: 24px;
    font-family: "Heebo-Regular";
    width: auto;
    height: auto;
    margin: 0;
}

.favoutite-products .cart-details li:nth-child(4) span{
    font-size: var(--font-size-icon-xs);
    color: var(--theme-text-color2);
    transition: .3s;
}

.favoutite-products .cart-details li:nth-child(4) span:hover{
    color: var(--theme-text-color1);
}

/* Wishlist Page Css End Here */

/* Order Procees Css Start Here */

.order-process{
    margin: 110px 0 20px 0 !important;
}

.order-process .col-inr{
    background-color: transparent !important;
}

.order-process .input{
    padding: 10px 30px;
    background-color: var(--light);
    color: var(--dark);
    width: 100%;
    text-align: right !important;
    border-radius: 0;
    font-size: 18px;
    line-height: 28px;
    font-family: "Heebo-Regular";
    border: 1px solid #e4e4e4;
    border-radius: 4px;
    transition: .3s;
}

.order-process .input:focus{
    border: 1px solid var(--border-color1);
    color: var(--dark);
    outline: none;
}

.order-process .input:focus::placeholder{
    opacity: 0;
}

.order-process .input::placeholder{
    color: var(--theme-text-color1);
    transition: .3s;
}

.order-process label{
    font-size: 18px;
    line-height: 28px;
    font-family: "Heebo-Regular";
    color: var(--dark);
}

.order-process .circle-check,
.checked-otr input:checked ~ .circle-check{
    background-color: var(--light) !important;
}

.order-process .col-otr .procduct-box .box-inr .img-otr .img-inr{
    display: block;
    border: 1px solid #e4e4e4;
}

.order-process .col-inr .procduct-box .content .product-head:hover{
    color: var(--theme-color) !important;
}

.breadcrumb li{
    display: flex;
}

/* Order Process Css End Here */

/* Product Details Css Start Here */

.Product-details-main{
    margin: 30px 0 !important;
}

.product-breadcrumbs{
    margin-top: 90px;
}

.Product-details-main .product-title{
    font-size: 32px;
    line-height: 40px;
}

.Product-details-main .product-title br{
    display: none;
}

.Product-details-main .rating-star,
.Product-details-main .accourdain-main{
    display: none;
}

.Product-details-main .product-desc-main h2{
    font-size: 24px;
    line-height: 36px;
    margin: 10px 0;
}

.Product-details-main .product-desc-main h2::after,
.Product-details-main .product-desc-main h2::before{
    display: none;
}

.Product-details-main .quantity-and-price{
    padding: 12px 0;
    margin: 12px 0;
    border-top: 1px solid #e4e4e4;
    border-bottom: 1px solid #e4e4e4;
}

.Product-details-main .quantity-otr{
    display: flex;
    align-items: center;
}

.Product-details-main .quantity-otr .icon-otr{
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: .3s;
}

.Product-details-main .quantity-otr .icon-otr:hover{
    background-color: var(--theme-bg-color1);
}

.Product-details-main .quantity-otr .icon-otr:hover .qty-icon{
    color: var(--light);
}

.Product-details-main .quantity-otr .icon-right{
    border: 1px solid #e4e4e4;
    border-left: none;
    border-radius: 0 4px 4px 0;
}

.Product-details-main .quantity-otr .icon-left{
    border: 1px solid #e4e4e4;
    border-right: none;
    border-radius: 4px 0 0 4px;
}

.Product-details-main .quantity-otr .qty-icon{
    font-size: 18px;
    color: var(--dark);
    transition: .3s;
}

.Product-details-main .quantity-otr .quantity-input{
    width: 40px;
    height: 40px;
    border: 1px solid #e4e4e4;
    text-align: center;
    font-size: 16px;
    line-height: 24px;
    font-family: "Heebo-Regular";
    color: var(--dark);
}

.Product-details-main .price-otr{
    font-size: 18px;
    line-height: 28px;
    font-family: "Heebo-Regular";
} 

.Product-details-main .action{
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
}

.Product-details-main .action .theme-btn{
    width: auto;
}

.Product-details-main .product-image-gallery #slider,
.Product-details-main .product-image-gallery #thumbnail-slider{
    margin: 0;
}

.Product-details-main .product-image-gallery #slider a{
    border: 1px solid #e4e4e4;
    padding: 20px;
    background-color: var(--light);
}

.Product-details-main .product-image-gallery #slider img{
    object-fit: contain;
    height: 435px;
}

.Product-details-main .product-image-gallery #thumbnail-slider li{
    margin-bottom: 10px;
}

.Product-details-main .product-image-gallery #thumbnail-slider li a{
    display: block;
    transition: .3s;
}

.Product-details-main .product-image-gallery #thumbnail-slider li a:hover{
    box-shadow: 1.5px 2.598px 3.5px rgba(147,151,174,0.35);
}

.Product-details-main .product-image-gallery #thumbnail-slider li a img{
    height: 150px;
    object-fit: contain;
    padding: 10px;
}

.Product-details-main .flex-direction-nav .flex-prev{
    opacity: 0.7 !important;
    left: 50% !important;
    top: 32px !important;
    transform: translate(-50%, 0) !important;
}

.Product-details-main .flex-direction-nav .flex-next{
    opacity: 0.7 !important;
    left: 50% !important;
    bottom: 10px !important;
    transform: translate(-50%, 0) !important;
    right: inherit !important;
    top: inherit !important;
}

.Product-details-main .flexslider.vertical-carousel:hover .flex-direction-nav .flex-prev,
.Product-details-main .flexslider.vertical-carousel:hover .flex-direction-nav .flex-next{
    opacity: 1 !important;
    left: 50%;
    top: 10px;
    transform: translate(-50%, 0);
    transition: unset;
}

.Product-details-main .flex-direction-nav a{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--theme-bg-color1);
    border-radius: 8px;
}

.Product-details-main .flex-direction-nav a.flex-prev:before,
.Product-details-main .flex-direction-nav a.flex-next:before {
    content: '\f106' !important;
    font-family: 'Font Awesome 5 Pro';
    position: relative;
    top: 7px;
    left: -9px;
    font-size: 30px !important;
    color: var(--light) !important;
}

.Product-details-main .flex-direction-nav a.flex-next:before{
    top: 5px;
    left: -9px;
    transform: rotate(180deg);
}

@media (max-width : 576px){
    .Product-details-main .product-image-gallery #slider{
        width: calc(100% - 80px);
    }
    .Product-details-main .product-image-gallery #thumbnail-slider{
        width: 80px;
    }
    .Product-details-main .product-image-gallery #thumbnail-slider li,
    .Product-details-main .product-image-gallery #thumbnail-slider li a img{
        width: 80px;
        height: 80px;
    }
    .Product-details-main .product-image-gallery #slider img{
        height: 240px;
    }
}
 
/* Product Details Css End Here */

/* Accessbility Page Css Start Here */

.gallery-mainn h2,
.gallery-mainn h2:after,
.gallery-mainn h2:before{
    text-align: right;
}
.gallery-mainn h2:after,
.gallery-mainn h2:before{
      display: none;
}
.gallery-mainn p{
    text-align: right;
}

.gallery-block-new .xmark,
.gallery-block-new .x-mark{
    position: absolute;
    top: 12px;
    right: 12px;
    width: 40px;
    height: 40px;
    border-radius: var(--border-radius-full-rounded);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--light);
    color: var(--dark);
    font-size: 18px;
    line-height: 28px;
    cursor: pointer;
    transition: .3s;
}

.gallery-block-new .xmark:hover,
.gallery-block-new .x-mark:hover{
    background-color: var(--theme-bg-color1);
}

/* Accessbility Page Css End Here */

/* Page Details Css Start Here */

.loading-spiner{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    z-index: 99999999999;
}

.loading-spiner img{
    width: 70px;
    height: 70px;
    position: inherit;
}

.about-us-sec{
    padding: 110px 0 30px 0 !important;
}

/* Page Details Css End Here */

/* Inner Header Start Here */

.opening-section1 .container,
.opening-section2 .container,
.opening-section3 .container{
    
}

.opening-section1 .wrapper{
    height: 230px;
}

.opening-img{
    height: 230px;
}

.opening-section3 {
    border: none;
}

.opening-section3 .wrapper {
    position: relative;
}

.opening-section3 .content-block img{
    width: 96%;
}

.opening-section3 .wrapper::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: var(--theme-bg-color2);
    opacity: 93%;
    display: none;
}

.breadcrumb-main {
    background-color: #fff !important;
}

.breadcrumb {
    padding: 6px 0 !important;
    font-size: 18px;
    background-color: #F6F6F6;
}

.breadcrumb-main .home {
    display: flex;
    align-items: center;
    text-transform: capitalize;
}

.breadcrumb .breadcrumb-item.active,
.breadcrumb-main .breadcrumb-item.active {
    color: var(--dark);
}

.breadcrumb-main .breadcrumb li,
.breadcrumb li{
    display: flex;
}

.breadcrumb-main .breadcrumb li a,
.breadcrumb li a,
.breadcrumb li a span{
    color: var(--dark) !important;
    cursor: pointer !important;
}

.breadcrumb .active span,
.breadcrumb-otr .breadcrumb .active span,
.breadcrumb-main .breadcrumb .active,
.breadcrumb-main .breadcrumb .active span,
.breadcrumb .active,
.breadcrumb .active span
.breadcrumb .home span a{
    color: var(--theme-bg-color5);
}

.breadcrumb .active,
.breadcrumb .active a,
.breadcrumb .home a{
    color: var(--theme-text-color6) !important;
    cursor: auto !important;
}

.breadcrumb-main .breadcrumb li::before,
.breadcrumb li::before{
    padding: 0 8px 0 8px;
    color: var(--theme-text-color5);
}

.breadcrumb .breadcrumb-item{
    color: var(--theme-text-color1);
}

.breadcrumb>li+li:before {
    padding: 0px 4px 0px 8px;
    color: var(--theme-text-color5);
    content: "/\00a0";
}

.opening-section1 .text-main{
    padding: 4px 0 !important;
    background-color: #df0d0d;
}

.opening-section1 .text-main .theme-btn{
    width: auto;
    background-color: var(--theme-bg-color);
    border: 1px solid var(--border-color1);
    height: auto;
    padding: 4px 14px;
}

.opening-section1 .text-main .theme-btn:hover{
    border: 1px solid var(--light);
}

.opening-section1 .text-main .theme-btn img{
    display: none;
}

.opening-section1 .container{
    position: relative;
}

.opening-section1 h1 {
    position: absolute !important;
    top: -150px !important;
    transform: none !important;
    right: 24px;
    padding: 0 !important;
    color: var(--light);
    max-width: 800px;
    width: 100%;
    margin: 0 auto;
    text-align: right;
}

.opening-section1 h1::after,
.opening-section1 h1::before{
    display: none;
}

.breadcrumb .breadcrumb-item.active {
    color: #b6b4b4 !important;
}

/* Inner Header End Here */

/* Gallery Start Here */

.gallery-main {
    margin: 30px 0;
}

.gallery-main .wrapper {
    max-width: 700px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.gallery-main .row{
    display: flex;
    text-align: center;
    margin-top: 30px;
    gap: 24px 0;
}

.gallery-main .row p{
    text-align: right;
}

.gallery-main .row .d-block,
.gallery-main .row .d-block h2,
.gallery-main .row .d-block p{
    text-align: right;
}

.gallery-main .col-inr {
    position: relative;
}

.gallery-main .popup-image-gallery img {
    cursor: pointer;
    width: 100%;
    height: 400px;
    object-fit: cover;
    border-radius: 8px;
    transition: .3s;
}

.gallery-main .popup-image-gallery img:hover {
    box-shadow: var(--box-shadow1);
}

.gallery-main .show-popup {
    z-index: 999;
    display: none;
}

.gallery-main .show-popup .overlay-img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.gallery-main .show-popup .img-show {
    width: 100%;
    height: 100%;
    background-color: var(--dark-with-opacity);
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    overflow: hidden;
    z-index: 9999;
    transition: .3s;
}

.gallery-main .img-show img {
    width: 70%;
    height: 90%;
    position: absolute;
    top: 50%;
    left: 50%;
    object-fit: contain;
    background-color: var(--dark-with-opacity);
    transform: translate(-50%, -50%);
}

.gallery-main .show-popup .close-icon{
    position: absolute;
    top: 10px;
    right: 10px;
    width: 36px;
    height: 36px;
    border-radius: var(--border-radius-full-rounded);
    background-color: transparent;
    border: 2px solid var(--border-color8);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--light);
    transition: .3s;
}

.gallery-main .show-popup .close-icon:hover{
    color: var(--dark);
    background-color: var(--light);
}

.gallery-main button#prev span{
    position: fixed;
    z-index: 9999;
    top: 50%;
    left: 20px;
    background: no-repeat;
    color: var(--light);
    border: 1px solid;
    padding: 10px;
    transition: .3s;
}

.gallery-main button#next span{
    position: fixed;
    z-index: 9999;
    top: 50%;
    right: 20px;
    background: no-repeat;
    color: var(--light);
    border: 1px solid;
    padding: 10px;
    transition: .3s;
}

.gallery-main button#prev:hover span,
.gallery-main button#next:hover span {
    background-color: var(--light);
    color: var(--dark);
    border: 1px solid var(--border-color8);
}


.gallery-block-new .img-show .icon-otr{
    width: 40px;
    height: 40px;
    background-color: var(--light);
    color: var(--dark);
    border-radius: var(--border-radius-full-rounded);
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 20px;
    right: 20px;
    cursor: pointer;
    z-index: 999999;
}

.popup-image-gallery img{
    object-fit: contain;
}

/* blogSec Section Start Here */

.blogSec {
    position: relative;
    margin: 30px 0;
}

.blogSec .wrapper {
    max-width: 700px;
    width: 100%;
    margin: 0 auto 30px auto;
    text-align: center;
}

.blogSec .row_custom {
    gap: 24px 0;
}

.blogSec .row_custom .col_card_inr {
    position: relative;
    background-color: var(--light);
    border: 1px solid var(--border-color5);
    padding: 0;
    height: 100%;
    transition: .3s;
}

.blogSec .row_custom .col_card_inr:hover {
    border: 1px solid var(--border-color2);
}

.blogSec .row_custom .col_card_inr:hover .box-link::after{
    opacity: 1;
    visibility: visible;
}

.blogSec .row_custom .col_card_inr:hover .label_otr{
    background-color: var(--theme-bg-color2);
}

.blogSec .row_custom .col_card_inr:hover .content .action_otr a{
    color: var(--theme-text-color2);
}

.blogSec .row_custom .col_card_inr .box-link {
    position: relative;
    transition: .3s;
}

.blogSec .row_custom .col_card_inr .box-link::after{
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 30px;
    background-image: url("/uploads/images/pages/shape-hover.webp");
    background-size: cover;
    background-repeat: no-repeat;
    opacity: 0;
    visibility: hidden;
    transition: .3s;
    z-index: 10;
}

.blogSec .row_custom .col_card_inr .box-link .img-inr{
    border-radius: 0;
}

.blogSec .row_custom .col_card_inr .card_img {
    width: 100%;
    object-fit: contain;
}

.blogSec .row_custom .col_card_inr .label_otr {
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: var(--theme-bg-color2);
    padding: 5px 16px;
    transition: .3s;
}

.blogSec .row_custom .col_card_inr .label_otr p {
    font-size: var(--font-size-xs-3);
    line-height: var(--line-heights-xs-3);
    color: var(--light);
}

.blogSec .row_custom .col_card_inr .label_otr p span {
    line-height: var(--line-heights-xs-3);
    font-size: var(--font-size-sm);
    color: var(--light);
}

.blogSec .row_custom .col_card_inr .content{
    padding: 14px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.blogSec .row_custom .col_card_inr .content .heading {
    font-size: var(--font-size-icon-md-2);
    line-height: var(--line-heights-md-4);
    font-family: var(--font-family-medium);
    color: var(--dark);
    transition: .3s;
}

.blogSec .row_custom .col_card_inr .content .heading:hover {
    color: var(--theme-bg-color2);
}

.blogSec .row_custom .col_card_inr .content .summary{
    margin: 6px 0;
}

.blogSec .row_custom .col_card_inr .content .action_otr {
    display: flex;
    align-items: center;
    justify-content: center;
}

.blogSec .row_custom .col_card_inr .content .action_otr a {
    text-align: center;
    font-size: var(--font-size-icon-md-3);
    line-height: var(--line-heights-md-3);
    color: var(--theme-bg-color1);
    text-decoration: underline;
    transition: .3s;
}

.blogSec .row_custom .col_card_inr .content .action_otr a:hover {
    color: var(--theme-bg-color2);
}

.blogSec .btn_otr {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 40px;
    z-index: 10;
}

.blogSec .btn_otr .more_btn {
    width: auto;
    background-color: var(--theme-bg-color1);
}

.blogSec .btn_otr .more_btn:hover {
    color: var(--theme-bg-color2);
    background-color: var(--light);
}

/* blogSec Section End Here */

/* Blog Details Css Start Here */

.blog-details{
    margin: 30px 0;
}

.blog-details .container{
    max-width: 1000px;
}

.blog-details .wrapper{
    max-width: 700px;
    width: 100%;
    text-align: center;
    margin: 0 auto;
}

.blog-details .row{
    gap: 20px 0;
    margin-top: 20px;
}

.blog-details .col-inr{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.blog-details .col-inr .img-otr{
    position: relative;
    margin: 10px 0 20px 0;
}

.blog-details .col-inr .img-inr{
    width: 100%;
    height: 376px;
    object-fit: cover;
    border: 4px solid var(--border-color3);
    border-radius: var(--border-radius-xs-1);
}

.blog-details .col-inr .label_otr {
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: var(--theme-bg-color1);
    padding: 5px 16px;
    transition: .3s;
}

.blog-details .col-inr .label_otr p {
    font-size: var(--font-size-xs-3);
    line-height: var(--line-heights-xs-3);
    color: var(--light);
}

.blog-details .col-inr .label_otr p span {
    line-height: var(--line-heights-xs-3);
    font-size: var(--font-size-sm);
    color: var(--light);
}

.blog-details .col-inr .content{
    position: relative;
}

.blog-details .col-inr .content p{
    margin: 0;
}

.blog-details .col-inr .content p:not(:last-child){
    margin-bottom: 14px;
}

.blog-details .col-inr .content p .link{
    display: inline;
    color: var(--theme-text-color1);
    font-family: var(--font-family-medium);
    transition: .3s;
}

.blog-details .col-inr .content p .link:hover{
    color: var(--theme-text-color2);
}

.blog-details .col-inr .content ul li{
    list-style: disc;
    list-style-position: inside;
}

/* Blog Details Css End Here */

/* Contact Section Start Here */

.contactInfoSec {
    position: relative;
    margin: 0 0 30px 0 !important;
}

.contactInfoSec .container{
    max-width: 1320px;
}

.contactInfoSec .row {
    margin: 0;
}

.contactInfoSec .row-info .box-link {
    margin-top: 50px;
}

.contactInfoSec .row-info .box-link .link-box{
    position: relative;
    border: 1px solid var(--border-color5);
    border-bottom: 8px solid var(--border-color5);
    display: block;
    padding: 70px 0 30px 0;
    background-color: var(--light);
    text-align: center;
    transition: .3s;
}

.contactInfoSec .row-info .box-link:hover .link-box {
    border: 1px solid var(--border-color2);
    border-bottom: 8px solid var(--border-color2);
    box-shadow: none;
}

.contactInfoSec .row-info .box-link:hover .icon-otr {
    border: none;
    background-color: var(--theme-bg-color2);
}

.contactInfoSec .row-info .box-link:hover .icon-inr {
    color: var(--dark);
}

.contactInfoSec .row-info .box-link:hover .link-box h3{
    color: var(--theme-text-color2);
}

.contactInfoSec .row-info .icon-otr {
    width: 80px;
    height: 80px;
    border: none;
    outline: none;
    box-shadow: none;
    position: absolute;
    background-color: var(--theme-bg-color2);
}

.contactInfoSec .row-info .icon-inr {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 36px;
    color: var(--dark);
}

.contactInfoSec .row-info .box-link .link-box h3 {
    font-size: var(--font-size-md-4);
    line-height: var(--line-heights-md-5);
    color: var(--dark);
    transition: .3s;
}

@media (max-width : 992px) {
    .contactInfoSec .row-info {
        gap: 24px 0;
    }
}

@media (max-width : 575px) {
    .contactInfoSec .row-info {
        gap: 16px 0;
    }
}

/* Contact Section End Here */

/* Contact Section Start Here */

.contactSec{
    position: relative;
    margin: 30px 0;
}

.contactSec .container{
    max-width: 1320px;
}

.contactSec .wrapper{
    max-width: 700px;
    width: 100%;
    text-align: center;
    margin: 0 auto;
}

.contactSec .row{
    gap: 30px 0;
    margin-top: 20px;
}

.contactSec .col-otr{
    display: flex;
    flex-direction: column;
    gap: 24px 0;
}

.contactSec .input-otr{
    position: relative;
}

.contactSec .input-otr label{
    display: none;
}

.contactSec .theme-input{
    width: 100%;
    resize: none;
}

.contactSec .textarea{
    height: 210px;
}

.contactSec .action{
    display: flex;
    align-items: center;
    justify-content: center;
}

.contactSec .action .theme-btn{
    max-width: 300px;
    width: 100%;
}

.contact-main .row .input-otr{
    flex: none;
}

.contact-main .row .input-otr .theme-input{
    width: 100%;
}

.contact-main .wrapper h2,
.contact-main .wrapper p,
.gallery-block-new .wrapper h2,
.gallery-block-new .wrapper p{
    text-align: center !important;
}

.gallery-block-new .img-show .icon-otr{
    width: 40px;
    height: 40px;
    background-color: var(--light);
    color: var(--dark);
    border-radius: var(--border-radius-full-rounded);
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 20px;
    right: 20px;
    cursor: pointer;
    z-index: 999999;
}

.popup-image-gallery img{
    object-fit: contain;
}

.product-img {
    height: 300px;
    width: 100%;
    object-fit: cover;
    border-radius: 13px 13px 0px 0px;
}

@media (max-width : 1200px){
    .gallery-main .popup-image-gallery img{
        height: 250px;
    }
}

@media (max-width : 992px){
    .inner-page-wrapper, 
    #content, .favourite-products-main {
        margin-top: 72px;
    }
}

@media (max-width : 450px){
    .gallery-main .popup-image-gallery img{
        height: 200px;
    }
}

/* Gallery End Here */

/* Monile nav input seaarch  */

.mobile-search .theme-input{
    border: none !important;
    padding: 10px 20px 10px 74px !important;
    border-radius: 0px !important;
    width: 100% !important;
}

.mobile-search .theme-input:focus{
    border: 1px solid #cfcfcf !important;
}

.mobile-search .dropdown-item button{
    width: 54px;
    height: 54px;
    position: absolute !important;
    left: 0;
    top: 0;
    padding: 0 !important;
}

.mobile-search .dropdown-menu{
    border: none !important;
}

.mobile-search .input-otr{
    width: 300px;
    top: 24px;
    left: -80px !important;
    position: absolute;
}

.mobile-search .dropdown-menu {
    padding: 0px;
    transform: translate(0) !important;
    border: none !important;
}

.desktop-banner{
    display: none;
}
#htmlContent .banner-main .overlay-banner {
    position: absolute !important;
    z-index: 1000;
    top: 50%;
    left: -50px;
    max-width: 750px !important;
    width: 100% !important;
    height: 750px !important;
    background-color: #1a191e;
    border-radius: 100%;
    transform: translateY(-50%);
}
#htmlContent .banner-main .overlay-banner .overlay-inr {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    text-align: center;
    max-width: 550px;
    width: 100%;
    z-index: 10;
    border: 2px solid #cfcfcf;
}
#htmlContent .banner-main .overlay-banner .overlay-inr h1,
#htmlContent .banner-main .overlay-banner .overlay-inr h2{
    margin: 30px 0;
}
#htmlContent .review-sec-main .row .col-otr::before{
    width: 30px !important;
}

.product-breadcrumbs .breadcrumb li:first-child *{
    color: var(--dark) !important;
    cursor: pointer !important;
}

.product-breadcrumbs .breadcrumb li:nth-child(2) *{
    color: var(--dark) !important;
    cursor: pointer !important;
}

.product-breadcrumbs .breadcrumb li:last-child *{
    color: var(--theme-text-color6) !important;
}

.product-breadcrumbs{
    margin-top: 0;
}

@media (max-width : 992px){
    .product-breadcrumbs{
        margin-top: 80px !important;
    }
}

@media (max-width : 992px){
    h1{
        font-size: 36px;
        line-height: 44px;
    }
    h1 span{
        font-size: 36px;
        line-height: 44px;
    }
    h2{
        font-size: 30px;
        line-height: 40px;
    }
    h2 span{
        font-size: 30px;
        line-height: 40px;
    }
}