/* ===============================================
    Serenity Shopaccino Theme
    ============================================== */
    @media only screen and (min-width: 1140px) {
      .container-fluid {
        padding-right: 1.3rem;
        padding-left: 1.3rem;
      }
    }

/*  ===============================================
    Global
    =============================================== */
    @media (min-width: 992px) {
        .row-cols-lg-10 > * {
            flex: 0 0 auto;
            width: 10%;
        }
    }
    @media (min-width: 1400px) {
        .row-cols-xxl-12 > * {
          flex: 0 0 auto;
          width: 8.333333%;
        }
    }
    @media only screen and (min-width: 768px) {
        .h-unsticky #header-option3, .header_home #header-option3:hover {
            background-color: white !important;
            background-image: none;
            transition: all 0.2s ease;
        }
    }
    
    @keyframes fade {
        0% { opacity: 0 }
        20% { opacity: 1 } /* 20% of 5 seconds = 1 second */
        80% { opacity: 1 }
        100% { opacity: 0 }
    }
    .megamenu-list {
      opacity:0;
      animation: fade ease-in-out 3s;
      animation-fill-mode: forwards;
    }
    .megamenu-list:nth-child(2) { animation-delay: 0.05s;}
    .megamenu-list:nth-child(3) { animation-delay: 0.10s;}
    .megamenu-list:nth-child(4) { animation-delay: 0.15s;}
    .megamenu-list:nth-child(5) { animation-delay: 0.20s;}

    /*
     .megamenu-list { 
        position: relative;
        transform: translateY(70px);
        opacity: 0;
        transition: 1s all ease;
    }
    
    .megamenu-panel:hover .megamenu-list { 
        transform: translateY(0);
        opacity: 1;
    }
    */
    
    .tab_link_arrow {  
        opacity: 0;
        transform: translateX(-50%);
        transition: opacity 0.3s, transform 0.3s;
    }
    .tab-nav ul li a.current .tab_link_arrow {transform: translateX(0); opacity: 100;}
    .tab-nav ul li a:hover .tab_link_arrow {transform: translateX(0); opacity: 100;}
    
    @media only screen and (min-width: 768px) {
        .header_home #header-option13 .mobile-header {
          background-color: rgba(255, 255, 255, 0.85);
        }
    }
    
    .nav-menu > li > a, .nav-dropdown > li > a {color: #1c1c1c;}

/*  ===============================================
    Transitions
    =============================================== */    
   :root {
        --duration-extra-long: 0.6s;
        --ease-out-slow: cubic-bezier(0, 0, 0.3, 1);
        --animation-slide-in: slideIn var(--duration-extra-long) var(--ease-out-slow) forwards;
        --animation-fade-in: fadeIn var(--duration-extra-long) var(--ease-out-slow);
    }
    @keyframes slideIn {
        0% {
            transform: translateY(1rem);
            opacity: 0.01;
        }
        to {
            transform: translateY(0);
            opacity: 1;
        }
    }
    
    .teaser img,
    .home-category figure img,
    .zoom-bigimg img,
    .text-cl-img-hold figure img,
    .home-gallery-scroll figure img,
    .category-banner figure img,
    .mobile-slide .photo-gallery a img,
    .subcategory figure img,
    .home-slider a img
    {
        opacity: 0.01;
         transform: translateY(2rem);
    }
    .teaser img.lazyloaded,
    .home-category figure img.lazyloaded,
    .zoom-bigimg  img.lazyloaded,
    .zoom-thumb img,
    .text-cl-img-hold figure img.lazyloaded,
    .home-gallery-scroll figure img.lazyloaded,
    .category-banner figure img.lazyloaded,
    .mobile-slide .photo-gallery a img.lazyloaded,
    .subcategory figure img.lazyloaded,
    .home-slider a img.lazyloaded, 
    .subcategory a,
    .imagetext-overlay,
    .product_detail,
    .pf-dkstop-openpanel,
    .review-rate-block,
    .sharebtn-hold,
    .home-category .category-caption
    {
        animation: var(--animation-slide-in);
    }
    
    .teaser figure,
    .home-category figure,
    .text-cl-img-hold figure,
    .home-gallery-scroll figure,
    .home-gallery-scroll figure,
    .category-banner figure
    { overflow:hidden;}
    
    .teaser  img.lazyloaded,
    .home-category figure img.lazyloaded,
    .text-cl-img-hold figure img.lazyloaded,
    .home-gallery-scroll figure img.lazyloaded,
    .category-banner figure img.lazyloaded,
    .mobile-slide .photo-gallery a img.lazyloaded
    {
        transition: transform 1s ease !important;
        animation: none;
        transform: scale(1);
        opacity: 1;
    }
    
    /*---- image hover zoom -----*/
    .teaser img.lazyloaded:hover,
    .home-category figure img.lazyloaded:hover,
    .text-cl-img-hold figure img.lazyloaded:hover,
    .home-gallery-scroll figure img.lazyloaded:hover,
    .category-banner figure img.lazyloaded:hover,
    .mobile-slide .photo-gallery a img.lazyloaded:hover
    {
      transform: scale(1.05);
    }
    .home-category figure img.rounded-circle:hover {transform: scale(1);}
/*  ===============================================
    End Transitions Effects
    =============================================== */

/*  ===============================================
    Theme CSS
    =============================================== */
    .fig-caption-hover  .figcaption {
        opacity: 0;
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -ms-transition: all 0.4s ease;
        -o-transition: all 0.4s ease;
        transition: all 0.4s ease;
        background-color: rgba(24, 24, 24, 0.7);
        color: #ffffff;
        text-transform: uppercase;
    }
    .fig-caption-hover .figcaption:hover {opacity: 1;}
    .fig-caption-hover  .figcaption .span-text {width: 100%;}
     .fig-caption-hover figure {background-color: #efefef !important;} 
    .teaser .teaser-item-div figure img {object-fit: cover;} 

    /*-------------*/
    .home-featuted-category{padding-top: 0rem !important;}
    .home-featuted-category .home-category{position: relative;}
    .home-featuted-category .feature-category-title-hold{display: none;}
    .home-featuted-category .home-category .category-caption{
        position: absolute;
        left: 20px;
        bottom: 20px;
        text-align: left;
        z-index:2;
    }
    .home-featuted-category .home-category .category-caption h3 .homecategory-list-title {
        color: #fff !important;
    }
    .home-featuted-category .home-category .category-caption .btn-primary{
        display: block !important;
        background-color: transparent !important;
        color: #fff !important;
        border: none !important;
        padding: 0px !important;
        border-radius: 0px !important;
        border-bottom: 1px solid #fff !important;
    }
    .home-featuted-category .home-category, .home-featuted-category .home-category figure, .home-featuted-category .mb-3.col-4 {
        margin-bottom: 0px !important;
    }
    .home-category .figure-hold { position:relative; overflow: hidden;}
    .home-category .figure-hold:before {
        content: "";
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
        width: 100%;
        height: 30%;
        opacity: 0;
        position: absolute;
        left: 0;
        z-index: 2;
        transition-property: top, opacity;
        transition-duration: 0.3s;
        top:70%;
    }
    .home-category .figure-hold:hover:before {opacity: 1;}
    
     @media (max-width: 767px) {
        .home-category .figure-hold:before {height:40%;top:60%;opacity:1;}
        .home-featuted-category .home-category .category-caption h3 {margin-bottom: 4px;}
        .column_grid_9x1 .fig-caption-hover .figcaption,
        .column_grid_1x1 .fig-caption-hover .figcaption,
        .column_grid_2x1 .fig-caption-hover .figcaption
        {opacity: 1;}
    }
    
    @media(min-width:768px){
        .customecontent .custome-para h2, .shop-the-look-hold h2{
            font-size: 34px !important;
        }
    }
    
    /* =========text_column_withimages========== */
    .text_column_withimages .mhorizontal-scroll{
        --bs-gutter-y: 0.25rem;
        --bs-gutter-x: 0.25rem;
    }
    .text_column_withimages .mhorizontal-scroll .text-cl-img-hold{
        position: relative;
    }
    .text_column_withimages .mhorizontal-scroll .text-cl-img-hold .text-caption{
        position: absolute;
        left: 25px;
        bottom: 20px;
        text-align: left;
    }
    .text_column_withimages .mhorizontal-scroll .text-cl-img-hold .text-caption h3{
        color: #fff !important;
    }
    .text_column_withimages .mhorizontal-scroll .text-cl-img-hold .text-caption .btn-primary{
        background-color: transparent !important;
        color: #fff !important;
        border: none !important;
        padding: 0px !important;
        border-radius: 0px !important;
        border-bottom: 1px solid #fff !important;
    }

    /* =========text_column_withimages---End===== */
    footer .bg-secondary{
        background-color: transparent !important;
    }
    
    @media (max-width: 767px) {
        .footer-logo { margin-left: auto; margin-right: auto;}
    }