/* --------------usefull common css start--------------- */
*:focus {outline: none !important;box-shadow: none !important;}
body, html{ font-family: "DM Sans", sans-serif !important;font-size:17px;overflow-x: hidden; cursor: none;}
html{scroll-behavior: smooth;}
ul,ol {list-style: none;padding: 0 !important; }
a, button, img, input, span, div {transition: all 0.3s ease 0s;}
strong, b {
    font-weight: 600 !important;
}
table{
    width: auto !important;
}
a{text-decoration: none !important;}
h1, h2, h3, h4, h5, h6{
    font-family: "Raleway", sans-serif !important;
    letter-spacing: 1.3px !important;
    margin: 0 !important;
    font-weight: 700 !important;
    transition: all 0.3s ease 0s;
}
img{
    width: 100%;
    height: fit-content;
}
@font-face {
    font-family: 'Brusher';
    src: url('../fonts/Brusher.ttf') format('truetype'); 
    font-weight: normal;
    font-style: normal;
}
p{margin: 0 !important;}
/* selection Code */
::-moz-selection {
    color:#fff;
    background: #E5203B;
}
::selection {
    color:#fff;
    background: #E5203B;
}
/*custom scrollbar css*/
::-webkit-scrollbar{
    width:10px;
}
::-webkit-scrollbar-track{
   background:#fff;
}
::-webkit-scrollbar-thumb{
    background:#E5203B;
    border-radius:0px;
}
.cursor-dot{
    width: 10px;
    height: 10px;
    background-color: #E5203B;
}
.cursor-outline{
    height: 35px;
    width: 35px;
    border: 2px solid #E5203B;
    transition: width 0.2s ease, height 0.2s ease, border 0.2s ease;
}
.cursor-dot, .cursor-outline{
    position: fixed;
    top: 0;
    left: 0;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    z-index: 9999;
    pointer-events: none;
}
.cursor-outline.hovering {
  width: 60px;
  height: 60px;
  border: 3px solid #2B2A28;
  transition: width 0.2s ease, height 0.2s ease, border 0.2s ease;
}
.btn {
    background-color: #E5203B !important;
    position: relative;
    border: none !important;
    padding: 10px 20px !important;
    border-radius: 0 !important;
    transition: all 0.3s linear;
    overflow: hidden;
    color: #fff; 
    display: inline-block;
    text-decoration: none; 
}
.btn:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: -5%;
    content: "";
    height: 150px;
    width: 115%;
    z-index: 1; /* lower than text */
    background-color: #F7C35F;
    transition: all 0.25s ease-in-out;
    transform: translateY(-45%) skew(25deg) scale(0);
}
.btn:hover:after {
    transform: translateY(-45%) skew(25deg) scale(1.2);
}
.btn span{
    color: #fff;
    font-size: 15px;
    position: relative;
    z-index: 2;
}
.btn:hover span{
    color:#2B2A28;
}
.main-wrap{
    position: relative;
}
/* scroll on top css */
/* Scroll to Top Button Styling */
#scrollTopBtn {
    display: none; 
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 99;
    border: none;
    outline: none;
    background-color: #E5203B;
    color: white;
    cursor: pointer;
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 18px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    transition: opacity 0.3s ease;
}
#scrollTopBtn:hover {
    background-color: #E5203B;
}
/* --------------usefull common css end----------------- */
/* all pages banner css */
.main-section .page-banner{
    position: relative;
}
.main-section .page-banner:before{
    position: absolute;
    bottom: -1px;
    content: "";
    left: 0;
    width: 101%;
    height: 20px;
    background-repeat:no-repeat;
    background-size: cover;
    mask-image: url(../img/bg-overlay.webp);
    background-color: #fff; 
    z-index: 1;
}
.main-section .page-banner .img-text{
    position: relative;
    background-color: #322203;
}
.main-section .page-banner .img-text img{
    opacity: 0.6;
}
.main-section .page-banner .banner-text{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.main-section .page-banner .banner-text .text-content h1{
    color: #fff;
    font-size: 40px;
    text-transform: uppercase;
    position: relative;
}
.main-section .page-banner .banner-text .text-content h1:before{
    content: "";
    width: 200px;
    height: 9px;
    position: absolute;
    left: 0;
    bottom: -12px;
    background-image: url(../icons/shape-line.svg);
    background-position: left bottom;
    background-repeat: no-repeat;
    background-size: contain;
    clip-path: inset(0 0 0 0);
    transition: 1.2s cubic-bezier(0.63, 0.25, 0.25, 1);
}
.main-section .page-banner .banner-text .text-content p{
   color: #F7C35F;
    font-family: "Handlee", cursive;
    font-weight: 500;
    font-size: 18px;
    padding-bottom: 10px;
    letter-spacing: 1px;
}
.main-section .page-banner .banner-text .text-content .breadcrumb{
    margin-top: 70px;
}
.main-section .page-banner .banner-text .text-content .breadcrumb .breadcrumb-item{
    color: #fff;
}
.main-section .page-banner .banner-text .text-content .breadcrumb .breadcrumb-item a{   
    color: #F7C35F;
    position: relative;
}
.main-section .page-banner .banner-text .text-content .breadcrumb .breadcrumb-item a:before{
    content: "";
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    border-bottom: 1px solid;
    transition: all 350ms;
}
.main-section .page-banner .banner-text .text-content .breadcrumb .breadcrumb-item a:hover:before{
    width: 100%;
}
.main-section .page-banner .banner-text .text-content .breadcrumb .breadcrumb-item::before{
    color: #F7C35F;
}
/*---------------- header css start-------------------*/
.header-section{
    position: relative;
}
.header-section .header-logo-section{
    background-color: #F7C35F;
}
.header-section .header-logo-section .logo-sec{
    border-left: 1px solid #f29f00;
    border-right: 1px solid #f29f00;
}
.header-section .header-logo-section .logo-sec img{
    width:65%;
}
.header-section .header-logo-section .logo-sec a{
    display: flex;
    justify-content: center;
    align-items: center;
}
.header-section .header-logo-section .icon-sec .contact-item{
    display: flex;
    gap: 20px;
    align-items: center;
}
.header-logo-section .icon-sec{
    display: flex;
    align-items: center;
}
.header-logo-section .icon-sec .svg-icon{
    width: 50px;
    height: 50px;
    padding: 12px;
    border-radius: 50px;
    background-color: #f29f0069;
    display: flex;
    align-items: center;
    justify-content: center;
}
.header-logo-section .icon-heading h4{
    font-size: 22px;
}
.header-logo-section .email-icon-sec{
    justify-content: right;
}
.menu-section {
    position: relative;
    width: 100%;
    z-index: 99;
    transition: all 0.5s ease;
}
.menu-section.sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: #F7C35F; 
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.header-section .menu-section .header-menu{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;   
}
.header-section .menu-section .header-menu .navbar{
    padding: 0;
}
.header-section .menu-section .header-menu .navbar .nav-item .nav-link{
    color:#2B2A28; 
    font-weight: 600;
    padding: 12px 0px;
}
.header-section .menu-section .header-menu .navbar .nav-item .nav-link.active{
    color:#E5203B;
}
.header-section .menu-section .header-menu .navbar .nav-item .nav-link svg{
    width:30px;
    transform: scaleY(0) translateY(-0%);
    opacity: 0;
    transition: 0.3s;
}
.header-section .menu-section .header-menu .navbar .nav-item .nav-link svg path{
    fill:#E5203B;
}
.header-section .menu-section .header-menu .navbar .nav-item .nav-link.active svg, .header-section .menu-section .header-menu .navbar .nav-item .nav-link:hover svg{
    opacity: 1;
    transform: scaleY(1) translateY(-0%);     
}
.header-section .menu-section .header-menu .navbar .navbar-nav{
    width: 100%;
    display: flex;
    gap: 20px;
    justify-content: space-around;
}
.header-section .menu-section  .navigation-menu{
    padding: 0;
}
.header-section .menu-section .header-menu .navbar .navbar-nav .nav-item{
    text-align: center;
}
.header-section .menu-section .header-menu .navbar .navbar-nav .nav-item:hover .nav-link{
    color: #E5203B;
}
.header-section .inquiry-popup-btn-sec{
    text-align: right;
}

/* ---------- Preloader ---------- */
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  overflow: hidden;
}

#preloader video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Fade-out when loaded */
body.loaded #preloader {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.8s ease, visibility 0.8s ease;
}


/* megamenu css */
.megamenu-link:hover .megamenu-section{
    display: flex;
    opacity: 1;
}
.megamenu-section{
    display: none;
    transition:all 0.3s linear;
    animation-duration:1s;
    animation-name:av_fadeInDown;
    opacity: 0;
    z-index: 1;
}
.megamenu-section .tab-section{
    background-color: #E5203B;
    width: 30%;
    border-radius: 20px 0 0 20px;
}
.megamenu-section .tab-section .tab-item{
    padding: 10px 0;
} 
.megamenu-section .tab-section .tab-item a{
    color: #fff !important;
} 
.megamenu-section .product-groups {
    padding: 0 20px;
}
.megamenu-section .tab-section .tab-item:hover a{
    color: #F7C35F !important;
} 
@keyframes av_fadeInDown{
    0% {
        opacity: 0;
        transform: translate3d(0, -15px, 0);
    }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}
.megamenu-section .category--content{
    float: left;
    width: 70%;
    height: 100%;
    background-color: #ffffffc9;
    display: flex;
    border-radius: 0 20px 20px 0;
    backdrop-filter: blur(4px);
}
.megamenu-section .category--content .category-name{
    padding: 10px;
}
.megamenu-section .tabcontent {
    padding: 0px 12px;
    width: 100%;
    display: none;
}
.megamenu-section .clearfix::after {
    content: "";
    clear: both;
    display: table;
}
.megamenu-css .megamenu-link{
    position: relative;
}
.megamenu-css .megamenu-link i{
    font-weight: 600;
    padding: 0 0 0 10px;
    font-size: 15px;
}
.megamenu-css .megamenu-link .megamenu-section{
    position: absolute;
    top: 70px;
    left: -290px;
    width: 1320px;
    height: 380px;
    border-top: 5px solid #F7C35F ;
    border-radius: 24px;
    padding: 0;
}
.megamenu-section .product-list-wrapper{
    display: flex;
    width: 100%;
}
.megamenu-section .product-list-wrapper .category-img{
   margin:auto;
    display: flex;
    
}
.megamenu-section .product-list-wrapper .category-img img{
    border-radius:15px;
}
.megamenu-section .product-list-wrapper .product-list-sec{
    
    gap: 20px;
    display: flex;
    flex-direction: column;
    margin:auto;
}
.megamenu-section .product-list-wrapper .product-list-sec .category-title{
    color: #E5203B;
    font-size: 30px;
}
.megamenu-section .product-list-wrapper .product-list-sec .product-list{
    text-align: left;
}
.megamenu-section .product-list-wrapper .product-list-sec .product-list li{
    padding: 5px 0 ;
}
.megamenu-section .product-list-wrapper .product-list-sec .product-list li a{
    color:#2B2A28;
    text-transform: capitalize;
}
.megamenu-section .product-list-wrapper .product-list-sec .product-list li a:hover{
     color: #E5203B;
     font-weight: 700;
     transform: scale(1.1);
}
.megamenu-section .product-list-wrapper .product-list-sec .product-list li a strong{
    color: #E5203B;
    font-weight: 500;
    text-decoration: underline;
}
.megamenu-section .product-groups{
    display: flex;
    gap: 30px;
}
/* ----------------header css end-----------------*/
/*------------login register page css start----------------- */
.login-register{
    display: flex;
    justify-content: center;
    align-items: center;
}
.login-register .login-card {
    max-width: 600px;
    width: 100%;
    padding: 20px;
    border-radius: 12px;
    background: #2B2A28;
    box-shadow: 0px 4px 12px rgba(0,0,0,0.1);
    margin: 50px 0;
}
.login-register .mb-4{
    display: flex;
    gap: 10px;
}
.login-register .login-card h2 {
    color: #F7C35F;
    font-size: 35px;
    padding: 0 0 30px;
    text-shadow: 2px 2px 3px #9d6905d9;
    text-align: center;
}
.login-register .form-label{
    color: #fff;
    width: 20%;
    display: flex;
    align-items: center;
    margin-bottom: 0;
}
.login-register .form-control{
    width: 80%;
}
.login-register .btn-custom{
    width: 100%;
}
.login-register .error {
    color: #dc3545;
    margin-bottom: 15px;
    font-size: 0.9rem;
    text-align: center;
}
/*------------login register page css end----------------- */   
/*--------------- banner section css start ------------*/
.banner-slider-wrap .slick-arrow{
    position: absolute;
    top: 85%;
    z-index: 1;
    background-color: #f7c25f7e;
    border-radius: 0%;
    padding: 10px;
    width: 50px;
    height: 50px;
}
.banner-slider-wrap .slick-arrow:before{
    color: #2B2A28 !important;
}
.banner-slider-wrap .slick-arrow:hover:before{
    color: #2B2A28 !important;
}
.banner-slider-wrap .slick-arrow:hover{
    background-color: #E5203B;
}
.banner-slider-wrap .slick-arrow i{
    color: #87C541;
}
.banner-slider-wrap .slick-arrow:hover i{
    color: #19562D;
}
.slick-prev{
    left: unset !important;
    right:90px !important;
} 
.slick-next{
    left: unset !important;
    right:20px !important;
}
.banner-slider .banenr-img{
    background-color: #322203;
}
.banner-slider .banenr-img img{
    opacity: 0.5;
}
.banner-slider .img-text{
    position: relative;
}
.banner-slider .img-text .banner-texts{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 70%;
    text-align: center;
}
.banner-slider .img-text .banner-texts h2{
    color:#fff;
    font-size: 50px;
    padding: 0 0 20px;
    text-shadow: 3px 3px 4px #921527cc;
}
.banner-slider .img-text .banner-texts p{
    color: #F7C35F;
    margin-bottom: 0 !important;
    padding: 10px 30px;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 1px;
    width: fit-content;
    background-color: #635729;
    font-family: "Handlee", cursive;
}
.banner-slider .img-text .banner-texts .text-with-img{
    display: flex;
    justify-content: center;
    align-items: center;
}
.banner-slider .img-text .banner-texts .text-content{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.banner-slider .img-text .banner-texts .text-with-img img{
    width: 100px;
}
.slick-next:before{
    font-family: "Font Awesome 6 Free" !important; 
    content: "\f101" !important;                  
    font-weight: 900 !important;                
}
.slick-prev:before{
    font-family: "Font Awesome 6 Free" !important; 
    content: "\f100" !important;                  
    font-weight: 900 !important;                
}
/* --------banner section css end---------------- */
/*------------ home page css start ----------------*/
/* all categories display section start */
.main-section .all-categories-icon-section .all-categories-title-sec{
    margin: auto;
}
.main-section .all-categories-icon-section{
    background-color: #F7C35F;
    position: relative;
}
.all-categories-icon-section:after{
    position: absolute;
    bottom: -19px;
    content: "";
    left: 0;
    width: 101%;
    height: 20px;
    background-repeat:no-repeat;
    background-size: cover;
    transform : rotate(180deg); 
    mask-image: url(../img/bg-overlay.webp);
    background-color: #F7C35F; 
}
.home-page-section .blog-section{
    margin-top: 20px;
}
.all-categories-icon-section .btn:after{
    background-color: #635729 !important;
}
.all-categories-icon-section .btn:hover span{
    color: #fff !important;
}
.main-section .all-categories-icon-section .title-section svg path{
    fill:#2B2A28;
}
.main-section .all-categories-icon-section .all-categories-content-sec .category-icon-sec {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 15px;
    padding: 20px 0;
    position: relative;
}
.main-section .all-categories-icon-section .all-categories-content-sec .category-icon-sec:before{
    content: "";
    position: absolute;
    left: 50%;
    top: 0px;
    bottom: -15px;
    height: 100%;
    border: 5px solid transparent;
    margin-left: -25px;
    padding: 0 20px;
    transition: border-color .3s ease-in-out;
}
.main-section .all-categories-icon-section .all-categories-content-sec .category-icon-sec .cat-img, .main-section .all-categories-icon-section .all-categories-content-sec .category-icon-sec .cat-name{
    z-index: 2;
}
.main-section .all-categories-icon-section .all-categories-content-sec .category-icon-sec:hover:before{
    border-color:#e7395069;
}
.main-section .all-categories-icon-section .all-categories-content-sec .category-icon-sec .cat-img{
    width: 80px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #2B2A28;
    border-radius: 50px;
}
.main-section .all-categories-icon-section .all-categories-content-sec .category-icon-sec img{
    width: 60px;
}
.main-section .all-categories-icon-section .all-categories-content-sec .category-icon-sec h4{
    font-size: 15px;
    text-align: center;
}
/* all categories display section end */
/* tagline css start */
.tagline-section .tagline-text{
    text-align: center;
    font-size: 130px;
    font-family: 'Brusher', cursive !important;
    padding: 70px 0 40px;
    font-weight: 500 !important;
}
/* tagline css end */
/* all section title css start */
.main-section .title-section{
    text-align: left;
}
.main-section .title-section .heading-title{
    font-size: 40px;
    color: #E5203B;
    text-transform: capitalize;
    font-weight: 600 !important;
}
.page-section .title-section .heading-title{
    font-size: 30px;
}
.main-section .title-section .heading-title span{
    font-weight: 400;
    font-size: 35px;
}
.main-section .title-section svg{
    transform: rotate(90deg);
}
.main-section .title-section svg path{
    fill:#F7C35F;
}
.home-page-sec{
    padding:30px 0 ;
}
.home-page-sec .title-section{
    padding: 0 0 25px;
}
/* all section title css end */
/* about us section css start */
.about-us-section .about-img{
    position: relative;
}
.about-us-section .about-img img{
    width: 100%;
}
.about-us-section .about-img .second-img{
    width: 85%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.about-us-section .about-img .first-img{
    animation-name: rotateme;
    animation-duration: 15s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes rotateme{
    0% {
    transform: rotate(0deg);
    opacity: 1;
    }
    50% {
        transform: rotate(180deg);
    }
    100% {
        transform: rotate(360deg);
        opacity: 1;
    }
}
.about-us-section .about-point-sec{
    padding: 20px 0;
}
.about-us-section .about-point-sec .icon-text{
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 10px 0;
}
.about-us-section .about-point-sec .icon-text .icon-sec, .about-us-section .about-point-sec .icon-text .icon-sec path{
    transition: all 300ms ease;
}
.about-us-section .about-point-sec .icon-text:hover .icon-sec{
    transform: rotateY(180deg);
}
.about-us-section .about-point-sec .icon-text:hover .icon-sec svg path{
    fill:#E5203B;
}
.about-us-section .about-point-sec .text-sec h4{
    font-size: 20px;
    padding-bottom: 10px;
}
.about-us-section .about-round-img{
    align-items: center;
    display: flex;
}
/* about us section css end */
/* category css */
.category-section .cat-content, .cat-banner-content {
    position: relative;
}
.category-section .category-content .category-display .img-overlay{
    position: relative;
}
.category-section .category-content .category-display .img-overlay .img-sec img{
    width: 100%;
}
.category-section .category-content .category-display .img-overlay:before{
    position: absolute;
    content: "";
    transition: all 0.3s linear;
    left: 0; 
    top: 0;
    width: 0;
    height: 100%;
    opacity: 0;
    background-color: #000;
}
.category-section .category-content .category-display .cat-banner-content:hover .img-overlay:before, .category-section .category-content .category-display .cat-content:hover .img-overlay:before{
    opacity: 0.7;
    width: 100%;
}
.category-section .cat-banner-content, .cat-banner-content .img-overlay, .cat-banner-content .img-overlay .img-sec, .cat-banner-content .img-overlay .img-sec img{
    height:100%;
}
.category-section .cat-banner-content .img-overlay .img-sec img{
    object-fit: cover;
}
/* category display sec css */
.category-sec-display .categories-content {
    display: flex;
    gap: 26px;
    width: 65%;
}
.category-sec-display .categories-content .two-cat-display .cat-sec-two{
    gap: 26px;
    display: flex;
    flex-direction: column;
    height:100%;
}
.category-sec-display .cat-section{
    width: 100%;
    margin:0 !important;
}
.category-sec-display .cat-section .cat-banner-content .img-sec img{
    width: 100%;
}
.category-sec-display .cat-section .cat-banner-content .img-sec{
    position: relative;
}
.category-sec-display .cat-section .cat-banner-content .img-sec:before{
    left: 0;
    right: 0;
    z-index: 1;
    content: "";
    margin: auto;
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0.4;
    transition: all 0.3s linear;
    position: absolute;
    background: #32220363;
}
.category-sec-display .cat-section .cat-banner-content:hover .img-sec:before{
    opacity: 0.8;
    width:100%;
}
.category-sec-display .common-content{
    height: 300px;
    padding: 5px;
}
.category-sec-display .text-content{
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 50px;
}
.category-sec-display .common-content .cat-banner-content .content-sec{
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    opacity: 1;
    transition: all 0.3s linear;
    position: absolute;
    z-index: 2;
}
.category-sec-display .common-content .cat-banner-content .content-sec h4{
    color: #fff;
    font-size: 32px;
    font-family: "Raleway", sans-serif !important;
    font-weight: 700 !important;
    text-shadow: 2px 2px 3px #921527cc;
    letter-spacing: 1px;
    text-align: center;
}
/* why choose us section css start */
.whychoose-us-section .whychoose-us-points .points{
    display: flex;
    gap: 20px;
    justify-content: center;
    align-items: center;
    padding: 30px 20px 20px; 
    border-bottom: 4px solid transparent;
    transition: all 0.3s linear;
    border-radius: 20px;
}
.whychoose-us-section .whychoose-us-points .points:hover{
    border-color: #F7C35F;
    transform: translateY(-15px);
}
.whychoose-us-section .whychoose-us-points .points .icon-sec{
    background: #F7C35F;
    border-radius: 50px;
    padding: 15px;
}
.whychoose-us-section .whychoose-us-points .points .icon-sec img{
    transition: all 300ms ease;
    width: 50px;
}
.whychoose-us-section .whychoose-us-points .points:hover .icon-sec img{
    transform: rotateY(180deg);
}
.whychoose-us-section .whychoose-us-points .points .content-sec h5{
    color:#2B2A28;
    padding-bottom: 10px;
}
/* why choose us section css end */
/* faqs section css start */
.faqs-page-section .faqs-section{
    padding-bottom: 0;
}
.faqs-section {
    padding-bottom: 60px;
}
.faqs-section .accordion {
    background-color: #F7C35F;
    color: #444;
    cursor: pointer;
    padding: 18px 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    transition: 0.4s;
    font-family: "Raleway", sans-serif !important;
    font-weight: 600;
    font-size: 18px;
    position: relative;
    border-radius: 20px;
}
.faqs-section .faqs{
    margin-bottom: 20px;
}
.faqs-section .active{
    border-radius: 20px 20px 0 0;
}
.faqs-section .accordion:after {
    content: '\002B';
    color: #2B2A28;
    margin-left: 5px;
    font-size: 29px;
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    background-image: none !important;
    font-weight: 400 !important;
}
.faqs-section .active:after {
    content: "\2212" ;
}
.faqs-section .panel {
    padding: 0 18px;
    background-color: #f29f0069;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    border-radius: 0 0 20px 20px;
}
.faqs-section .panel p{
    padding: 10px 0;
}
.faqs-section .faq-img-button .faq-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.faqs-section .faq-img-button .faq-img{
    height: 50%;
}
.faqs-section .faq-img-button{
    border-radius: 20px;
    overflow: hidden;
    height: 100%;
}
.faqs-section .fqas-text{
    padding-right: 50px;
}
.faqs-section .faq-img-button .faq-text-btn{
    padding: 40px 20px;
    background-color: #2B2A28;
    flex-direction: column;
    gap: 30px;
    height: 50%;
    display: flex;
    justify-content: top;
    position: relative;
}
.faqs-section .faq-img-button .faq-text-btn h5{
    font-family: "Handlee", cursive !important;
    color:#F7C35F;
    letter-spacing: 1px;
    font-weight: 400 !important;
    font-size: 25px;
}
.faqs-section .faq-img-button .faq-text-btn img{
    position: absolute;
    bottom: 10px;
    right: 20px;
    opacity: 0.6;
    animation-name: elementor-animation-bob-float, elementor-animation-bob;
    animation-duration: 0.3s, 1.75s;
    animation-delay: 0s, 0.3s;
    animation-timing-function: ease-out, ease-in-out;
    animation-iteration-count: 1, infinite;
    animation-fill-mode: forwards;
    animation-direction: normal, alternate;
    width: 35%;
}
/* faqs section css end */
/* contact sec css start */
.contact-section .contact-text-btn{
    padding: 50px 30px;
    background-color: #E5203B;
    border-radius: 20px;
    position: relative;
}
.contact-section .contact-text-btn img{
    position: absolute;
    bottom: 10px;
    right: 20px;
    opacity: 0.3;
    animation-name: elementor-animation-bob-float, elementor-animation-bob;
    animation-duration: 0.3s, 1.75s;
    animation-delay: 0s, 0.3s;
    animation-timing-function: ease-out, ease-in-out;
    animation-iteration-count: 1, infinite;
    animation-fill-mode: forwards;
    animation-direction: normal, alternate;
    width: 20%;
}
@keyframes elementor-animation-bob{
    0% {
        transform: translateY(-8px);
    }
    50% {
        transform: translateY(-4px);
    }
    100% {
        transform: translateY(-8px);
    }
}
@keyframes elementor-animation-bob-float{
    100% {
    transform: translateY(-8px);
    }
}
.contact-section .contact-text-btn .contact-content h3{
    color: #F7C35F;
    padding-bottom: 20px;
}
.contact-section .contact-text-btn .contact-content p{
    color: #fff;
    padding-bottom: 20px;
}
.contact-section .contact-text-btn .btn{
    background-color: #635729 !important;
}
/* contact sec css end */
/* blog sec css */
.home-page-section .blog-section{
    background-color: #635729;
    padding-bottom: 60px;
    position: relative;
}
.blog-section:before{
    mask-image: url(../img/bg-overlay.webp);
    background-color: #635729 !important; 
}
.blog-section .blog-post-sec {
    padding: 10px 10px 10px;
}
.blog-section .blog-title-sec{
    position: relative;
}
.main-section .blog-section .title-section svg path{
    fill: #E5203B;
}
.blog-section .blog-title-sec .bg-img img{
    position: absolute;
    bottom: -55px;
    right:0;
    width: 70%;
    animation-name: float_left_right_two;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    opacity: 0.5;
}
@keyframes float_left_right_two{
    0% {
    transform: translateX(-30px);
    }
    50% {
        transform: translateX(0px);
    }
    100% {
        transform: translateX(-30px);
    }
}
.blog-section .blog-post-sec .blog-img{
    position: relative;
    overflow: hidden;
}
.blog-section .blog-post-sec .blog-img:before{
    position: absolute;
    content: "";
    top: 0;
    left:0;
    width: 100%;
    height: 105%;
    border-radius: 50px;
    background-color: #322203;
    opacity: 0;
    transition: all 0.3s linear;
}
.blog-section .blog-post-sec:hover .blog-img:before{
    opacity: 0.4;
    border-radius: 0;
}
.blog-section .blog-post-sec .blog-text-content{  
    padding: 20px 0 0;
}
.blog-section .blog-post-sec .blog-text-content .home-page-btn{
    padding-top: 25px;
}
.blog-section .blog-post-sec .blog-text-content .home-page-btn .btn-css{
    color: #000;
}
.blog-section .blog-post-sec .blog-text-content h4{
    padding-bottom: 10px;
    font-size: 16px;
    color: #fff;
    font-weight: 400 !important;
}
.blog-section  .title-section .heading-title, .blog-section .blog-details li i{
    color: #F7C35F !important;
}
.blog-section .blog-details li{
    color: #fff;
    font-weight: 300 !important;
}
.carousel-wrap .slick-arrow{
    position: absolute;
    bottom: -50px !important;
    top: unset !important;
    z-index: 1;
    background-color: #ffa6008a;
    padding: 10px;
    width: 50px;
    height: 50px;
} 
.carousel-wrap .slick-next:before, .carousel-wrap .slick-prev:before {
    color:#2B2A28;
} 
.carousel-wrap .slick-arrow:hover{
    background-color: #E5203B;
}
.carousel-wrap .slick-arrow i{
    color: #2B2A28;
}
.carousel-wrap .slick-next{
   right: 0px !important;
}
.carousel-wrap .slick-prev{
    right: 70px !important;
}
/* ------popup css start---------- */
.popup .overlay {
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5);
    position: fixed; 
    top: 0;
    left: 0;
    z-index: 999;
    display: none;
}
.popup .form-popup {
    position: fixed; 
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0); 
    background-color: #fff;
    padding: 20px;
    width: 600px;
    z-index: 1000;
    border-radius: 8px;
}
.no-scroll {
    overflow: hidden;
}
.popup.active .overlay {
    display: block;
    cursor: pointer;
}
.popup.active .form-popup {
    transition: all 300ms ease-in-out;
    transform: translate(-50%, -50%) scale(1); 
}
.popup .close-btn p {
    text-align: right;
    font-size: 30px;
    padding: 5px;
    display: flex;
    background: #E5203B;
    margin: 0;
    width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    color: #fff;
    position: absolute;
    top: -15px;
    right: -15px;
}
.popup .close-btn {
    display: flex;
    justify-content: right;
}
.popup .form-group {
    position: relative !important;
    margin-bottom: 25px;
}
.popup .form-group .form-control {
    padding: 4px 4px 4px 30px;
    border: 2px solid #F7C35F ;
    color: #2A2927;
}
.popup .form-group .form-control:focus{
    border: 2px solid #E5203B ;
}
.popup .contact-form{
    padding: 20px 0;
}
.popup .form-group i {
    position: absolute;
    top: 10px;
    left: 10px;
    color: #E5203B;
}
/* -----popup css end -----*/
.whatsappbar{
    position: fixed;
    top:77%;
    right: 18px;
    width: 50px;
    height: 50px;
    border-radius: 50px;
    background: #4dc247;
    line-height: 50px;
    text-align: center;
    z-index: 10000;
    box-shadow: rgb(50 50 93 / 25%) 0 30px 60px -12px, rgb(0 0 0 / 30%) 0 18px 36px -18px;
  }
.whatsappbar ul li a {
    font-size: 30px;
    color: #fff !important;
}
/* before after css */
.footer-section::before, .all-categories-icon-section:before, .blog-section:before{
    position: absolute;
    top: -19px;
    content: "";
    left: 0;
    width: 101%;
    height: 20px;
    background-repeat:no-repeat;
    background-size: cover;
    mask-image: url(../img/bg-overlay.webp);
    background-color: #F7C35F; 
}
/* footer sec css start*/
.footer-section{
    background-color: #F7C35F;
    padding: 20px 10px 0;
    position: relative;
}
.footer-section .footer-contents{
    padding: 20px 0 40px;
}
.footer-section .footer-contents .cont-sec h3{
    color:#2B2A28;
    padding-bottom: 25px;
    text-shadow: 1px 1px 2px #2b2a286b;
}
.footer-section .footer-contents .page-links ul li a{
    color:#2B2A28;
    position: relative;
}
.footer-section .footer-contents .page-links ul li a:before{
    content: "";
    height: 1px;
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    border-bottom: 2px solid #E5203B;
    transition: all 350ms;
}
.footer-section .footer-contents .page-links ul li a:hover:before{
 width: 100%;
}
.footer-section .footer-contents .page-links ul li{
    padding: 0 0 6px;
}
.footer-section .footer-contents .about-content p{
    color: #333333;
    padding: 0 0 20px;
}
.footer-section .footer-contents .about-content a{
    color:#E5203B;
    font-weight: 500;
}
.footer-section .footer-contents .about-content a:hover{
    color:#2B2A28;
}   
.footer-section .footer-contents .social-icons{
    padding: 20px 0 0px;
}
.footer-section .footer-contents .social-icons a i{ 
    color:#F4B323;
    padding: 0 6px;
}
.footer-section .footer-contents .cont-sec .contact-item p{
    color: #333333;
}
.footer-section .footer-contents .cont-sec .contact-item{
    display: flex;
    gap: 10px;
    align-items: start;
    padding-bottom: 10px;
}
.footer-section .footer-contents .cont-sec .contact-item i{
    color:#E5203B;
    margin-top: 7px;
}
.footer-section .copyright-section p{
    color: #333333;
}
.footer-section .copyright-section p a{
    color:#E5203B;
    font-weight: 500;
}
.footer-section .right-content p{
    text-align: right;
}
.footer-section .copyright-section {
    padding: 20px 0;
    border-top: 2.5px dashed #E5203B;
}
.footer-section .logo-social-icon-section{
    border-bottom: 2.5px dashed #E5203B;
    padding-bottom: 20px;
    margin-bottom: 30px;
}
.footer-section .logo-social-icon-section .content-section h5{
    font-size: 35px;
    color:#E5203B;
    text-shadow: 1px 1px 2px #921527cc;
    text-align: center;
}
.footer-section .logo-social-icon-section .footer-top-section{
    display: flex;
    justify-content: center;
    align-items: center;
}
.footer-section .logo-social-icon-section .footer-top-section .social-icons{
    display: flex;
    gap:15px;
}
.footer-section .logo-social-icon-section .footer-top-section .social-icons i{
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    background-color: #E5203B;
    box-shadow: 0 0 5px 0 #911123;
}
.footer-section .logo-social-icon-section .footer-top-section .social-icons i:before{
    color:#fff;
}
/* footer section css end*/
/* mobile header css start*/
.mobile-container {
    margin: auto;
    background-color: #F7C35F;
    color: white;
    display: none;
}
.mobile-container .topnav{
    overflow: hidden;
    position: relative;
    padding: 0px;
}
.mobile-container .topnav .mobile-logo{
    width: 100%;
    padding: 0px;
    text-align: center;
}
.mobile-container .mobile-menu span{
    color: #E5203B;
}
.mobile-container .sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 9;
    top: 0;
    left: 0;
    background-color: #111;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}
.mobile-container .overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.6);
    z-index: 8; 
}
.mobile-container .sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #fff;
    display: block;
    transition: 0.3s;
}
.mobile-container .sidenav a:hover {
    color: #ccc;
}
.mobile-container .sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}
.mobile-container .sidenav ul {
    list-style: none;
    padding: 0;
}
.mobile-container .sidenav ul li {
    position: relative;
}
.mobile-container .sidenav .submenu {
    display: none;
}
.mobile-container .sidenav .submenu-toggle.active + .submenu {
    display: block;
    padding-left: 20px !important;
}
.mobile-container .mobile-content-sec{
    display: flex;
    align-items: center;
}
.mobile-container .logo-section img{
    width: 60%;
}
.mobile-container .logo-section{
    justify-content: center;
}
.mobile-container .menu-section{
    justify-content: left;
}
.mobile-container .btn-section{
    justify-content: right;
}
/* mobile header css end*/

/* -------------------all pages css start------------- */
.page-section{
    padding: 50px 0;
}
/* --------category page css start */
.category-page-sec .cat-img-title-sec .category-image-title .cat-name h4{
    font-size: 20px;
    color:#2B2A28;
    text-align: center;
    text-transform: capitalize;
    padding-top:20px;
}
.category-page-sec .cat-page .cat-img-title-sec .category-image-title{
    transform: scale(0.9);
    padding:20px 0;
}
.category-page-sec .cat-page .cat-img-title-sec .category-image-title:hover{
    
    transform: scale(1);
}
.category-page-sec .cat-page .cat-img-title-sec .category-image-title:hover .cat-name h4{
    color: #E5203B;
}
.category-page-sec .cat-page .cat-img-title-sec .cat-image{
    border-radius:10px;
    overflow:hidden;
}
/*---------- category page css end */
/* ------------category wise product page css start */
.category-product-page-sec .row{
    padding-bottom: 40px;
}
.category-product-page-sec .product-sec{
    padding: 30px 10px;
    transform: scale(0.9);
     background: #ffeacd;
}
.category-product-page-sec .product-sec:hover{
    box-shadow: 0 0 15px 0 #39020a57;
    transform: scale(1);
   
}
.category-product-page-sec .product-sec .product-title-link h4{
    font-size: 20px;
    text-align: center;
    text-transform: capitalize;
}
.category-product-page-sec .product-sec .product-title-link h4 a{
    color:#2B2A28;
}
.category-product-page-sec .product-sec:hover .product-title-link h4 a{
    color:#E5203B;
}
.products-section .section-title .title-section, .blog-detail-page-section .section-title .title-section{
    display: flex;
    gap: 20px;
    align-items: center;
    padding-bottom: 20px;
}
.products-section .section-title .title-section h4, .blog-detail-page-section .section-title .title-section h4{
    font-size: 25px;
}
.products-section .faq-section .accordion-item, .blog-detail-page-section .faq-section .accordion-item{
    border: none !important;
    padding-bottom: 20px;
}
.products-section .faq-section .accordion-item .accordion-header .accordion-button.collapsed, .blog-detail-page-section .faq-section .accordion-item .accordion-header .accordion-button.collapsed{
    background-color: #F7C35F;
    color: #444;
    cursor: pointer;
    padding: 18px 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    transition: 0.4s;
    font-family: "Raleway", sans-serif !important;
    font-weight: 600;
    font-size: 18px;
    position: relative;
    border-radius: 20px;
}
.products-section .faq-section .accordion-item .accordion-header .accordion-button, .blog-detail-page-section .faq-section .accordion-item .accordion-header .accordion-button{
    background-color: #F7C35F;
    color: #444;
    cursor: pointer;
    padding: 18px 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    transition: 0.4s;
    font-family: "Raleway", sans-serif !important;
    font-weight: 600;
    font-size: 18px;
    position: relative;
    border-radius: 20px 20px 0 0 ;
}
.products-section .faq-section .accordion-item .accordion-body, .blog-detail-page-section .faq-section .accordion-item .accordion-body{
    padding: 18px 18px;
    background-color: #f29f0069;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    border-radius: 0 0 20px 20px;
}
/* ------category wise product page css end */

/* ----------single-product page css start */
.single-product-page-section .tab-buttons {
    display: flex;
    border-bottom: 2px solid #F7C35F;
    padding: 0;
}
.single-product-page-section .tab-buttons button {
    background: none;
    border: none;
    padding: 10px 20px;
    cursor: pointer;
    font-family: "Raleway", sans-serif !important;
    font-weight: 600;
    font-size: 18px;
}
.single-product-page-section .tab-buttons button.active {
    color: #F7C35F;
    background-color: #E5203B;
}
.single-product-page-section .tab-content {
    display: none;
    margin-top: 20px;
}
.single-product-page-section .tab-content h5{
    font-weight:600 !important;
    color:#E5203B;
}
.single-product-page-section .tab-content ul li{
    position: relative;
}
.single-product-page-section .tab-content ul li p{
    padding-left: 35px;
}
.single-product-page-section .tab-content ul li:before{
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 25px;
    height: 25px;
    background: url("../icons/list-icon.svg") no-repeat center center;
    background-size: contain;
}
.single-product-page-section .product-title h2{
    font-size: 30px;
    text-transform: capitalize;
    color: #E5203B;
}
.single-product-page-section .pro-img-sec .product-image{
    box-shadow: 0 0 15px 0 #39020a57;
    background: #ffeacd;
}
.single-product-page-section .tab-content.active {
    display: block;
}
.single-product-page-section .common-section, .single-product-page-section .product-image-title-desc-section{
    padding: 30px 0;
}
.single-product-page-section .related-products .product-card h5{
    font-size: 20px;
    text-align: center;
    text-transform: capitalize;
}
.single-product-page-section .related-products{
    padding-bottom: 50px !important;
}
.single-product-page-section .related-products .product-card h5 a{
    color: #2B2A28;
}
.single-product-page-section .related-products .product-card:hover h5 a{
    color: #E5203B;
}
.single-product-page-section .related-products .product-card{
    padding: 15px;
    transform: scale(0.9);
    display: flex;
    flex-direction: column;
    gap: 20px;
    background: #ffeacd;
}
.single-product-page-section .related-products .product-card:hover{
    transform: scale(1);
    box-shadow: 0 0 15px 0 #39020a57;
}
.single-product-page-section .related-products .slick-arrow{
    background-color: #E5203B;
    padding: 10px;
    width: 50px;
    height: 50px;
}
.single-product-page-section .related-products .slick-arrow:hover{
    background-color: #F7C35F;
}
.single-product-page-section .related-products .slick-list{
    padding: 15px;
}
.single-product-page-section .related-products .slick-arrow:hover:before{
    color: #E5203B !important;
}
.single-product-page-section .related-products .slick-next, .single-product-page-section .related-products .slick-prev{
    top: 100% !important;
    margin-top: 20px;
}
.single-product-page-section .product-desc{
    padding: 30px 0;
}
.single-product-page-section .additional-info-content p{
    padding: 5px;
}
.single-product-page-section .tab-content ul li{
    padding: 5px 0;
}
.single-product-page-section table tr:nth-child(even) {
    background-color: #fff1d8;
}
.single-product-page-section table{
    border: none;
}
.single-product-page-section table tr td{
    padding: 10px 15px;
}
.single-product-page-section table tr{
    height: auto !important;
}
.single-product-page-section table tr:nth-child(odd) {
    background-color: #FAD796;
}
.single-product-page-section .contact-text-btn{
    display: flex;
}
.single-product-page-section .contact-text-btn .contact-content{
    width: 85%;
}
.single-product-page-section .contact-text-btn .btn-sec{
    width: 25%;
    text-align: right;
    margin: auto;
    z-index: 2;
}
.single-product-page-section .contact-text-btn{
    padding: 40px 20px !important;
}
.single-product-page-section .contact-text-btn .contact-content h3{
    padding: 0 !important;
    font-size: 26px !important;
    text-transform: capitalize;
    line-height: 40px;
    font-weight: 500 !important;
}
.single-product-page-section .contact-text-btn .contact-content h3 span{
   font-weight: 700;
   color: #fff;
    text-transform: uppercase;
}
.single-product-page-section .contact-text-btn img{
    width: 13%;
}

.product-image-effect{
    position: sticky;
    top: 150px;
}




/* ----------single-product page css end */
/*---------blog page css start */
.blog-page-section .blog-sec .single-blog-sec .blog-title h5{
    font-size: 18px;
    color: #2B2A28;
    text-align: center;
    text-transform: capitalize;
    padding-top: 20px;
}
.blog-page-section .blog-sec .single-blog-sec:hover .blog-title h5{
    color: #E5203B ;
}
.blog-page-section .blog-sec .single-blog-sec .blog-img{
    overflow: hidden;
    background-color: #322203;
}
.blog-page-section .blog-sec .single-blog-sec:hover .blog-img img{
    transform: scale(1.4) rotate(20deg);
    opacity: 0.7;
}

.blog-detail-page-section .recent-posts{
    padding: 20px;
    border-radius: 20px;
    background-color: #F7C35F;
    box-shadow: 0 0 15px 0 #39020a57;
}
.blog-detail-page-sec .title-section svg path{
    fill: #2B2A28;
}
.blog-detail-page-section .recent-posts .recent-post{
    display: flex;
    padding: 0 0 10px 0;
    align-items: center;
}
.blog-detail-page-section .recent-posts .recent-post a{
    font-size: 16px;
    color: #2B2A28;
}
.blog-detail-page-section .recent-posts .title-section h4 {
    font-size: 20px;
}
.blog-detail-page-section .recent-posts .recent-post:hover a{
    font-size: 16px;
    color: #E5203B ;
}
.blog-detail-page-section .blog-sec h3{
    color: #E5203B ;
    text-transform: capitalize;
    line-height: 40px;
}
.blog-detail-page-section .blog-sec .published-date{
    padding: 15px 0;
    font-size: 16px;
    color: #2B2A28;
}
.blog-detail-page-section .blog-sec .blog-desciption{
    padding: 30px 0;
}
.blog-detail-page-section .blog-sec .blog-desciption p, .blog-detail-page-section .blog-sec .blog-desciption ul{
    padding-bottom: 15px;
}
.blog-detail-page-section .blog-sec .blog-desciption h5{
    padding-bottom: 10px;
}
.blog-detail-page-section .blog-sec .blog-desciption ul li p{
    padding-bottom: 5px;
}
/*---------blog page css end */
/* ------------about us page css start  */
.about-page-section .about-page-sec .background-heading h3{
    color: transparent;
    background-clip: text;
    background-size: cover;
    background-repeat: repeat-x;
    background-position: left center;
    background-image: url(../img/bg-heading.webp);
    font-size: 90px;
    font-family: "Handlee", cursive !important;
    text-align: center;
    font-weight: 800;
}
.about-page-section .about-page-sec .background-heading p{
    text-align: center;
    font-size: 20px;
    font-family: "Handlee", cursive !important;
    font-weight: 600;
    letter-spacing: 1px;
    color: #E5203B ;
}
.about-page-section .common-section-css{
    padding: 40px 0;
}
.about-page-section .why-choose-content{
    display: flex;
    padding: 60px 0 0;
    justify-content:space-between;
}
.about-page-section .mission-vision-sec{
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 0 15px 0 #39020a57;
}
.about-page-section .mission-vision-sec .sec-content{
    padding: 30px;
    background-color: #F7C35F; 
}
.about-page-section .mission-vision-sec .sec-content h4{
    color: #E5203B;
    padding-bottom: 20px;
}
.about-page-section .why-choose-content .icon-title-content{
    text-align: center;
}
.about-page-section .why-choose-content .icon-title-content .content-title{
    padding-top: 20px;
}
.about-page-section .why-choose-content .icon-title-content .content-title h5{
    font-size: 18px;
    font-weight: 500 !important;
}
.about-page-section .about-extra-content{
    margin: auto;
}
.about-page-section .about-extra-content h5{
    font-family: "Handlee", cursive !important;
    font-size: 26px; 
    line-height: 40px;
}
.about-page-section .about-points{
    margin: auto;
}
.about-page-section .about-points .icon-title-content{
    display: flex;
    gap: 30px;
}
.about-page-section .about-points .icon-title-content .icon-content{
    display: flex;
    gap: 15px;
}
.about-page-section .about-points .icon-title-content .icon-content h5{
    font-size: 18px;
    font-weight: 500 !important;
}
.about-page-section .section-border-css{
    border-bottom: 2PX dashed #f7c35fa6;
}
.about-page-section .about-points .icon-title-content .icon-content p{
    font-size: 35px;
    color: #E5203B;
    font-weight: 600;
    font-family: "Handlee", cursive !important;
    padding-top: 15px;
}
.about-page-section .about-text p{
    padding-bottom: 10px;
}
.about-page-section .about-title-sec{
    margin: auto;
}
.about-page-section .about-title-sec h5{
    font-family: "Handlee", cursive !important;
    font-weight: 600 !important;
    font-size: 20px;
    padding-bottom: 15px;
}
/* ------------about us page css end  */
/* ----------contact page css start  */
.contact-page-section .contact-form .form-group{
    position: relative;
    margin: 0 0 30px;
}
.contact-page-sec .title-section{
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.contact-page-section .contact-details{
    background: #F7C35F;
    padding: 15px;
    border-radius: 20px;
}
.contact-page-section .store-details .icon-details{
    display: flex;
    gap: 15px;
    padding: 10px 0;
} 
.contact-page-section .store-details .icon-details i{
    color: #E5203B;
}
.contact-page-section .store-details{
    padding: 15px;
    border: 1px dashed #fff;
    border-radius: 20px;
}
.contact-page-sec .title-section h5{
    font-family: "Handlee", cursive !important;
    font-weight: 600 !important;
    font-size: 20px;
}
.contact-page-section .contact-form .form-group .form-control{
    padding: 8px 8px 8px 40px;
    border: 2px solid #F7C35F;
}
.contact-page-section .contact-form .form-group .form-control:focus{
    border: 2px solid #E5203B;
}
.contact-page-section .contact-form .form-group i{
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    color:#E5203B;
}
.contact-page-section .contact-form .text-area-sec i{
    position: absolute;
    top: 15px;
    left: 10px;
    transform: translateY(0);
}
.contact-form .btn .contact-btn-deta{
    background: none;
    border: none;
    z-index: 3;
    position: relative;
    color: #fff;
}
.contact-form .btn:hover .contact-btn-deta{
    color: #2B2A28;
}
.contact-page-section .contact-image-detail{
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.contact-page-section .contact-image{
    border-radius: 20px ;
    overflow: hidden;
}
/* ----------contact page css end  */
/* -------------------all pages css end ----------------*/
@media (min-width: 1199px) and (max-width: 1399px) {
    .megamenu-css .megamenu-link .megamenu-section{
        width: 1140px;
        left:-280px;
    }
}
@media (min-width: 991px) and (max-width: 1199px){
    .megamenu-css .megamenu-link .megamenu-section{
        width: 960px ;
        left:-318px;
    }
}
@media (max-width: 991px) {
    .main-section .title-section .heading-title {
        font-size: 30px;
    }
    .main-section .title-section .heading-title span{
        font-size: 30px;
    }
    .tagline-section .tagline-text{
        font-size: 95px;
        padding:50px 0 30px;
    }
    .banner-slider .img-text .banner-texts h2 {
        font-size: 40px;
    }
    .banner-slider .img-text .banner-texts p{
        font-size: 18px;
    }
    .footer-section .copyright-section p, .footer-section .footer-contents .about-content p, .footer-section .footer-contents .page-links ul li a, .footer-section .footer-contents .cont-sec .contact-item p, .footer-section .footer-contents .about-content a{
        font-size: 14px;
    }
    .footer-section .footer-contents .cont-sec h3{
        font-size: 20px;
    }
    .carousel-wrap .slick-prev{
        left: 54%;
    }
    .carousel-wrap .slick-next{
        left: 42%;
    }
    .footer-section .logo-social-icon-section .footer-top-section .social-icons i{
        width: 35px;
        height: 35px;
    }
    .footer-section .logo-social-icon-section .content-section h5{
        font-size: 22px;
    }
    .category-sec-display .common-content .cat-banner-content .content-sec .content-btn h3, .category-section .category-content .cat-content .content-btn h3{
        font-size:22px;
    }
    .mobile-container{
        display: block;
    }
    .header-section{
        display: none;
    }
    .category-sec-display .text-content{
        padding: 0 20px;
    }
    .category-section .title-section{
        padding: 0 0 15px;
    }
    .category-section .category-desc p{
        font-size: 16px;
    }
    .category-sec-display .common-content .cat-banner-content .content-sec h4{
        font-size: 28px;
    }
    .whychoose-us-section .whychoose-us-points .points{
        padding: 10px;
    }
    .whychoose-us-section .whychoose-us-points .points .content-sec h5{
        font-size: 18px;
    }
    .whychoose-us-section .whychoose-us-points .points .content-sec p{
        font-size: 16px;
    }
    .contact-section .contact-text-btn .contact-content h3{
        font-size: 25px;
    }
    .contact-section .contact-text-btn{
        padding: 20px !important;
    }
    .faqs-section .panel p{
        padding: 0;
    }
    .contact-page-section .contact-form-content .contact-form .contact-btn .contact-btn-deta{
        padding: 8px 40px;
        font-size: 16px;
    }
    .contact-page-section .contact-form-content .contact-form{
        padding: 20px;
    }
    .contact-page-section .contact-form-content .contact-form .form-group{
        margin-bottom: 20px;
    }
    .single-product-section .product-details .pro-details .heading-title{
        padding-bottom:10px ;
    }
    .single-product-section .product-details .pro-details .product-descriptions h4{
        padding-bottom: 6px;
        font-size: 22px;
    }
    .single-product-section .product-details .pro-details .product-btn{
        padding: 20px 0 0;
        gap: 10px;
    }
    .single-product-section .product-details .pro-details .product-btn .btn-css{
        font-size: 15px;
        padding: 8px 16px;
    }
    .single-product-section .product-details .pro-details .specification-point{
        margin-bottom: 0 !important;
    }
    .single-product-section .product-details .pro-details .product-descriptions .specification-point .specification-text{
        padding: 5px 0;
        font-size: 15px;
    }
    .single-product-section .pro-specification-sec .table-responsive table th.hdg1{
        font-size: 16px;
    }
   .single-product-section .pro-specification-sec .table-responsive table td{
    font-size: 15px;
    }
    .single-product-section .product-details{
        padding: 0 0 0 20px;
    }
    .single-product-section .pro-specification-sec{
        padding: 40px 0 0;
    }
    .category-sec-display .common-content{
        height: auto !important;
    }
    .faqs-section .fqas-text{
        padding-right: 20px;
    }
    .main-section .page-banner .banner-text .text-content .breadcrumb{
        margin-top:50px;
    }
    .main-section .page-banner .banner-text .text-content h1{
        font-size: 30px;
    }
    .blog-page-section .blog-sec .single-blog-sec .blog-title h5{
        font-size: 16px;
    }
    .about-page-section .common-section-css{
        padding: 25px 0;
    }
    .about-page-section .about-extra-content h5{
        font-size: 22px;
        line-height: 32px;
    }
    .about-page-section .about-points .icon-title-content .icon-content h5{
        font-size: 15px;
    }
    .about-page-section .about-points .icon-title-content .icon-content p{
        font-size: 30px;
    }
    .about-page-section .about-page-sec .background-heading h3{
        font-size: 65px;
    }
    .about-page-section .why-choose-content .icon-title-content .content-title h5{
        font-size: 16px;
    }
}
@media (max-width: 767px){
    .footer-section .footer-contents .cont-sec{
        padding-bottom: 10px;
    }
    .footer-section .footer-contents .cont-sec h3{
        padding-bottom:10px;
    }
    .footer-section{
        padding-top: 20px;
    }
    .footer-section .copyright-section .copyright-sec p{
        text-align: center;
    }
    .banner-slider .img-text .banner-texts h2 {
        font-size: 30px;
    }
    .banner-slider .img-text .banner-texts .text-with-img img{
        width: 80px;
    }
    .banner-slider .img-text .banner-texts p{
        font-size: 16px;
    }
    .category-section .category-content .category-display{
        padding: 10px;
    }
    .category-section .category-content{
        padding: 0;
    }
    .blog-section .blog-title-sec .bg-img img{
        display: none;
    }
    .footer-section .logo-social-icon-section .content-section h5{
        font-size: 20px;
    }
     .category-sec-display .not-display{
        display: none;
     }
    .category-sec-display .categories-content .cat-display{
        padding: 10px;
    }
    .blog-page-section .blog-recent-sec{
        display: flex;
        flex-direction: column-reverse;
    }
    .blog-page-section .blog-recent-sec .recent-post{
        padding: 20px;
    }
    .contact-page-section .contact-details-icon-content .contact-details{
        padding: 10px;
    }
    .contact-page-section .contact-details-icon-content{
        padding: 0 0 30px;
    }
    .about-page-section .about-img-content .about-content .about-text-content{
        padding: 0 0 20px;
    }
    .about-page-section .about-product-section .product-related-content{
        padding: 0 0 40px;
    }
    .about-page-section .about-product-section .about-content-second{
        display: flex;
        flex-direction: column-reverse;
    }
    .about-page-section .product-related-content .page-title-section .heading-title, .about-page-section .about-us-sec .page-title-section .heading-title{
        text-align: center;
    }
    .about-page-section .why-choose-sec{
        margin: 30px 0 0;
    }
    .about-page-section .why-choose-sec .why-choose-points .why-choose-cont .whychoose-text h4{
        font-size: 20px;
    }
    .blog-section .blog-post-sec .blog-text-content{
        text-align: center;
    }
    .faqs-section .faq-img-button .faq-text-btn img{
        width: 25%;
    }
    .faqs-section .faq-img-button .faq-text-btn{
        padding: 20px;
    }
    .faqs-section .fqas-text{
        padding: 0;
    }
    .category-sec-display .text-content{
        padding: 20px 10px;
    }
    .main-section .page-banner{
        height: 190px;
    }
    .main-section .page-banner .img-text{
        height: 100%;
    }
    .main-section .page-banner .img-text img{
        height: 100%;
        object-fit: cover;
    }
    .main-section .page-banner .banner-text .text-content .breadcrumb{
        margin-top:30px;
    }
    .main-section .page-banner .banner-text .text-content h1{
        font-size: 25px;
    }
    .main-section .page-banner .banner-text .text-content p{
        font-size: 15px;
        padding-bottom: 5px;
    }
    .contact-page-sec .contact-form-content{
        padding: 20px;
    }
    .popup.active .form-popup{
        width: 80%;
    }
    .main-section .page-banner .banner-text .text-content .breadcrumb .breadcrumb-item{
        font-size: 15px;
    }
    .blog-page-sec .blog-sec{
        gap: 25px;
    }
    .about-page-section .about-points{
        padding-top: 20px;
    }
    .about-page-section .mission-vision-text-content{
        gap: 30px;
    }
    .single-product-page-section .contact-text-btn .contact-content h3{
        font-size: 20px !important;
        line-height:30px ;
    }
    .single-product-page-section .contact-text-btn{
        flex-direction: column;
        padding: 20px;
        align-items:center;
    }
    .single-product-page-section .contact-section .contact-text-btn .btn{
        padding: 10px !important;
    }
    .single-product-page-section .contact-text-btn .contact-content, .single-product-page-section .contact-text-btn .btn-sec{
        width: 100%;
        text-align: center;
        padding: 5px 0;
    }
    .single-product-page-section .pro-title-desc-sec{
        padding-top: 25px;
    }
    
}
@media (max-width: 575px)
{
    .banner-slider .img-text .banner-texts h2 {
        font-size: 30px;
    }
    .banner-slider .img-text .banner-texts p{
        font-size: 13px;
    }
    .main-section .title-section .heading-title{
        font-size:20px;
    }
    .main-section .title-section .heading-title span{
        font-size:20px;
    }
    .footer-section .logo-image img{
        width: 60%;
    }
    .btn{
        padding: 5px 15px;
    }
    .main-section .all-categories-icon-section .all-categories-content-sec .category-icon-sec img{
        width: 35px;
    }
    .main-section .all-categories-icon-section .all-categories-content-sec .category-icon-sec .cat-img{
        width: 50px;
    height: 50px;
    }
    .banner-slider .img-text .banner-texts .text-with-img img{
        display: none;
    }
    .category-sec-display .text-content{
        height: auto;
    }
    .category-sec-display .cat-img-cont{
        height: 200px;
    }
    .footer-section .logo-social-icon-section .footer-top-section{
        justify-content: left;
    }
    .home-page .faqs-section{
        padding: 10px;
    }
    .footer-section .logo-social-icon-section{
        gap: 10px;
    }
    .category-sec-display .common-content .cat-banner-content .content-sec h4{
        font-size: 22px;
    }
     .tagline-section .tagline-text{
        font-size: 50px;
     }
    .carousel-wrap .slick-prev{
        left: 56%;
    }
    .carousel-wrap .slick-next{
        left: 40%;
    }
    .contact-page-section .contact-form-content .contact-form{
        padding: 10px;
    }
    .contact-page-section .contact-form-content .contact-form .form-group .form-control{
        padding: 5px 5px 5px 35px;
        font-size: 15px;
    }
    .home-page-sec .title-section{
        padding: 0 0 15px;
    }
    .main-section .all-categories-icon-section .all-categories-content-sec .category-icon-sec h4{
        font-display: 14px;
    }
    .main-section .all-categories-icon-section .all-categories-content-sec .category-icon-sec{
        padding: 10px 0;
    }
    .contact-page-section .contact-form-content .contact-form .form-group i{
        top: 17px;
    }
    .about-page-section .product-related-content .page-title-section .heading-title, .about-page-section .about-us-sec .page-title-section .heading-title{
        font-size: 25px;
    }
    .mobile-container .topnav a.icon{
        top: 25px;
    }
    .banner-slider-wrap .slick-arrow{
        padding: 2px;
        width: 30px;
        height: 30px;
    }
    .home-page-sec{
        padding: 20px 0 0;
    }
    .about-us-section .home-page-btn{
        padding: 20px 0 0;
    }
    .mobile-container .logo-section img {
        width: 90%;
    }
    .mobile-container .btn {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 7px 15px !important;
    }
    .about-page-section .why-choose-content{
        flex-direction:column;
        gap: 20px;
    }
    .about-page-section .about-page-sec .background-heading h3 {  
        font-size: 50px;
    }
    .category-page-sec .cat-img-title-sec .category-image-title .cat-name h4, .category-product-page-sec .product-sec .product-title-link h4{
        font-size: 17px;
    }
    .single-product-page-section .related-products .product-card h5{
        font-size: 16px;
    }
    .single-product-page-section .contact-text-btn .contact-content h3{
        font-size: 16px !important;
        line-height:26px ;
    }
    .home-page-section .banner-slider{
        height: 260px;
    }
    .home-page-section .banner-slider .slick-list,.home-page-section .banner-slider .slick-list .slick-track, .home-page-section .banner-slider .slick-list .banenr-img{
        height: 100%;
    }
    .home-page-section .banner-slider .slick-list .banenr-img img{
        height: 100%;
        object-fit: cover;
    }
}
@media (max-width: 450px)
{
    .carousel-wrap .slick-prev{
        left: 55%;
    }
    .carousel-wrap .slick-next{
        left: 35%;
    }
    .mobile-container .topnav a.icon{
        top: 15px;
    }
    .banner-slider .img-text .banner-texts h2{
        font-size: 22px;
        padding: 0 0 5px;
    }
    .banner-slider .img-text .banner-texts p{
        font-size:13px;
        padding: 0;
        line-height: 15px;
    }
    .mobile-container .sidenav {padding-top: 15px;}
    .mobile-container .sidenav a {font-size: 18px;}
}


