body{
font-family:Poppins;
background:#f6f6f6;
}

/* HERO */

.hero{
height:500px;
background:url('../images/banner.jpg') center/cover;
display:flex;
align-items:center;
color:white;
}

/* HERO SLIDER */

.hero-slider{
width:100%;
height:600px;
}

.hero-slide{
width:100%;
height:600px;
background-size:cover;
background-position:center;
background-repeat:no-repeat;
}

/* ============================= */
/* ===== HERO MOBILE FIX ===== */
/* ============================= */

@media (max-width:768px){

  .hero{
    height:260px;   /* mobile me compact */
    background-position:center;
  }

  .hero-slider{
    height:280px;
  }

  .hero-slide{
    height:280px;
    background-position:center;
  }

}

/* PRODUCT CARD */

.product-card{
    background:white;
    padding:15px;
    border-radius:12px;
    transition:0.3s;
    margin-bottom:20px;
    display:flex;
    flex-direction:column;
    height:100%;
}

.product-card:hover{
    transform:translateY(-5px);
    box-shadow:0 10px 20px rgba(0,0,0,0.1);
}

/* PRODUCT IMAGE */

.product-img{
    position:relative;
    height:380px;   /* 🔥 yahan control karo (400–450 bhi kar sakte ho) */
    overflow:hidden;
    border-radius:10px;
}

.product-img img{
    width:100%;
    height:100%;
    object-fit:cover;   /* ✔️ image crop hogi, stretch nahi hogi */
    transition:0.4s ease;
}

/* HOVER ZOOM */

.product-card:hover .product-img img{
    transform:scale(1.08);
}

/* PRODUCT OVERLAY */

.product-overlay{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.4);
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:10px;
    opacity:0;
    transition:0.3s;
}

.product-card:hover .product-overlay{
    opacity:1;
}

.product-overlay a{
    padding:8px 15px;
    font-size:14px;
    background:white;
    border-radius:6px;
    text-decoration:none;
}

/* PRICE */

.price{
font-weight:600;
color:#e60023;
margin-bottom:10px;
}

/* ===== FOOTER ===== */
.footer{
  background:#8b0000;
  color:#fff;
  padding:60px 0 20px;
}

/* LOGO */
.footer-logo{
  max-width:150px;
}

/* TITLE */
.footer-title{
  font-weight:600;
  margin-bottom:15px;
  position:relative;
}

/* TEXT */
.footer-text{
  font-size:14px;
  line-height:1.7;
  color:#f1f1f1;
}

/* LINKS */
.footer-links{
  list-style:none;
  padding:0;
}

.footer-links li{
  margin-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,0.15);
  padding-bottom:6px;
}

.footer-links a{
  color:#fff;
  text-decoration:none;
  font-size:14px;
  transition:0.3s;
}

.footer-links a:hover{
  padding-left:6px;
  color:#ffd700;
}

/* CONTACT */
.footer-contact{
  list-style:none;
  padding:0;
}

.footer-contact li{
  margin-bottom:12px;
  font-size:14px;
  display:flex;
  gap:10px;
  align-items:flex-start;
}

.footer-contact i{
  margin-top:4px;
}

/* ADMIN DASHBOARD ALIGN WITH CONTACT */
.admin-footer{
  margin-top: 15px;
}

.admin-link{
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  text-decoration: none;
  font-size: 20px;
}

.admin-link i{
  font-size: 25px;
}
.admin-link{
  color: #fff !important;
  text-decoration: none;
}

.admin-link:hover{
  color: #fff !important;
}

/* SOCIAL */
.footer-social a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border-radius:50%;
  background:#ffffff;
  margin-right:8px;
  color:#fff;
  transition:0.3s;
}

.footer-social a:hover{
  background:#ff0000;
  transform:translateY(-3px);
}

/* DIVIDER */
.footer-divider{
  border-color:rgba(255,255,255,0.2);
  margin:30px 0;
}

/* COPYRIGHT */
.footer-copy{
  font-size:16px;
  color:#ddd;
}

/* ===== RESPONSIVE ===== */
@media(max-width:992px){
  .footer{
    text-align:center;
  }

  .footer-contact li{
    justify-content:center;
  }
}

@media (max-width: 768px) {
    .admin-link-mobile {
        margin: 20px auto 0 !important;
        display: block !important;
        text-align: center !important;
    }
}

@media(max-width:768px){
  .footer{
    padding:40px 0 20px;
  }

  .footer-title{
    margin-top:10px;
  }
}
/* ===== FOOTER ABOUT SECTION FIX ===== */
.footer-about{
  display:flex;
  flex-direction:column;
}

/* LOGO */
.footer-logo{
  max-width:150px;
  height:auto;
}

/* WRAPPER */
.footer-logo-wrap{
  display:flex;
  justify-content:flex-start; /* desktop default */
}

/* ===== MOBILE (FULL CENTER) ===== */
@media (max-width: 576px){

  .footer-about{
    align-items:center; /* 🔥 sab center */
    text-align:center;
  }

  .footer-logo-wrap{
    justify-content:center; /* 🔥 logo exact center */
    width:100%;
  }

  .footer-text{
    text-align:center;
    max-width:90%;
  }

}

/* ===== TABLET (LOGO CENTER, TEXT CENTER) ===== */
@media (min-width: 577px) and (max-width: 992px){

  .footer-about{
    align-items:center; /* 🔥 center column */
    text-align:center;
  }

  .footer-logo-wrap{
    justify-content:center; /* 🔥 logo center */
    width:100%;
  }

  .footer-text{
    text-align:center;
    max-width:80%;
  }

}

/* ===== MOBILE BOTTOM NAV ===== */

.mobile-bottom-nav{
  display: none;
  background: #8b0000; /* 🔥 tumhara theme color */
  border-top: 1px solid #444;
  z-index: 9999;
}

.mobile-bottom-nav .nav-item{
  color: #fff;
  text-decoration: none;
  font-size: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  transition: 0.3s;
}

.mobile-bottom-nav i{
  font-size: 18px;
}

/* hover */
.mobile-bottom-nav .nav-item:hover{
  color: #ffd700;
  transform: translateY(-2px);
}

/* ACTIVE STATE */
.mobile-bottom-nav .nav-item.active{
  color: #ffd700;
}



/* REVIEW CARD */

.review-card{
background:white;
padding:25px;
border-radius:12px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
text-align:center;
}

.stars{
color:#f5b301;
font-size:18px;
margin-bottom:10px;
}

/* VIDEO */

.video-card,
.image-card{
overflow:hidden;
border-radius:12px;
}

.video-card video{
width:100%;
height:300px;
object-fit:cover;
border-radius:10px;
}

.image-card img{
width:100%;
height:350px;
object-fit:cover;
border-radius:10px;
}

.video-card video:hover,
.image-card img:hover{
transform:scale(1.05);
transition:0.4s;
}

.video-showcase .swiper,
.image-showcase .swiper{
padding-bottom:20px;
}

/* TRENDING */

.trendingSwiper{
width:100%;
overflow:hidden;
}

.trendingSwiper .swiper-slide{
width:auto !important;
}

/* ===== ABOUT BANNER ===== */

.about-banner{
  position:relative;
  background:url('../images/Banarasi_saree_mobile_jpg.webp') center/cover no-repeat;
  height:500px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#fff;
}

.about-banner p{
  position:relative;
  z-index:2;
  color:#fff;
  font-size:18px;
  margin-top:10px;
  letter-spacing:0.5px;
}

/* OVERLAY */

.about-banner::before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.55); /* darkness control */
  z-index:1;
}

/* CONTENT ABOVE OVERLAY */

.about-banner h1{
  position:relative;
  z-index:2;
  font-size:42px;
  font-weight:700;
  letter-spacing:1px;
}

/* ===== ABOUT BANNER MOBILE ===== */
@media (max-width: 768px){

  .about-banner{
    height: 280px;           /* 🔥 reduce height for mobile */
    padding: 20px;
    background-position: center;
  }

  .about-banner p{
    font-size: 14px;         /* readable text */
    padding: 0 10px;
    line-height: 1.5;
  }

}

/* EXTRA SMALL MOBILE */
@media (max-width: 480px){

  .about-banner{
    height: 240px;
  }

  .about-banner p{
    font-size: 13px;
  }

}


/* WHY CARD */

.why-card{
background:white;
color:#b30000;
padding:30px;
border-radius:12px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
transition:0.3s;
}

.why-card i{
font-size:50px;
}

.why-card:hover{
transform:translateY(-5px);
background:#b30000;
color:white;
}

/* VIDEO GRID */

.video-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
}

/* TOP BAR */

/*.top-bar{*/
/*background:#8b0000;*/
/*color:white;*/
/*padding:6px 0;*/
/*font-size:17px;*/
/*}*/

/*.top-flex{*/
/*display:flex;*/
/*justify-content:space-between;*/
/*align-items:center;*/
/*}*/

/*.social-icons a{*/
/*color:white;*/
/*margin-left:10px;*/
/*}*/



/* ===== HEADER ===== */
.header{
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(12px);
    border-bottom:1px solid rgba(0,0,0,0.06);
    padding:18px 0;
    position:sticky;
    top:0;
    z-index:999;
    transition: all 0.3s ease;
}

/* subtle shadow on scroll */
.header.scrolled{
    box-shadow:0 8px 25px rgba(0,0,0,0.08);
}


/* ===== LOGO ===== */
.logo{
    height:80px;
    width:auto;
    transition: all 0.3s ease;
}

.logo:hover{
    transform:scale(1.06) rotate(-1deg);
}




/* ===== MENU ===== */
.menu{
    list-style:none;
    display:flex;
    gap:32px;
    justify-content:center;
    align-items:center;
    margin:0;
    padding:0;
}

/* MENU LINKS */
.menu li a{
    text-decoration:none;
    color:#222;
    font-weight:600;
    font-size:17px;
    position:relative;
    letter-spacing:0.3px;
    transition: all 0.3s ease;
}

/* Hover underline (premium smooth) */
.menu li a::after{
    content:"";
    position:absolute;
    width:0%;
    height:2px;
    background:linear-gradient(135deg,#ff0000,#b30000);
    left:0;
    bottom:-6px;
    border-radius:2px;
    transition: width 0.3s ease;
}

/* hover */
.menu li a:hover{
    color:#b30000;
}

.menu li a:hover::after{
    width:100%;
}


/* ===== HEADER ICONS ===== */
.header-icons{
    display:flex;
    align-items:center;
    justify-content:flex-end;
}

.header-icons a{
    margin-left:18px;
    font-size:22px;
    color:#333;
    transition: all 0.25s ease;
}

/* hover animation */
.header-icons a:hover{
    color:#b30000;
    transform:translateY(-3px) scale(1.1);
}


/* ===== CART ICON ===== */
.cart-icon{
    position:relative;
}

/* Badge */
#cart-count{
    position:absolute;
    top:-8px;
    right:-10px;
    background:linear-gradient(135deg,#ff0000,#b30000);
    color:white;
    font-size:11px;
    padding:3px 7px;
    border-radius:50%;
    font-weight:600;
    box-shadow:0 2px 6px rgba(0,0,0,0.2);
}


/* ===== CART MESSAGE ===== */
.cart-msg{
    position:fixed;
    top:20px;
    left:50%;
    transform:translateX(-50%);
    background:linear-gradient(135deg,#16a34a,#15803d);
    color:white;
    padding:12px 25px;
    border-radius:30px;
    font-weight:600;
    z-index:9999;
    box-shadow:0 8px 25px rgba(0,0,0,0.25);
    animation:fadeSlide 0.4s ease;
}


/* ===== ANIMATION ===== */
@keyframes fadeSlide{
    from{
        opacity:0;
        transform:translate(-50%, -25px);
    }
    to{
        opacity:1;
        transform:translate(-50%, 0);
    }
}


/* ===== RESPONSIVE ===== */
/* ===== MOBILE + TABLET HEADER FIX (SAME ROW) ===== */
@media (max-width: 992px){

    .header .row{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    /* LOGO LEFT */
    .header .col-8{
        order: 1;
        text-align: left !important;
    }

    /* ICONS CENTER */
    .header .col-lg-2.col-2.text-end{
        order: 2;
        text-align: center !important;
    }

    .header-icons{
        justify-content: center !important;
    }

    .header-icons a{
        margin: 0 10px;
        font-size: 20px;
    }

    /* HAMBURGER RIGHT */
    .header .col-2.d-lg-none{
        order: 3;
        text-align: right;
    }

    /* Logo size adjust */
    .logo{
        height: 55px;
    }
}
.about-section p,
.heritage p{
font-size:17px;
line-height:1.8;
color:#444;
}

.about-img{
width:100%;
height:420px;
object-fit:cover;
border-radius:10px;
}

.founder-card{
padding:20px;
}

.founder-img{
width:180px;
height:220px;
object-fit:cover;
border-radius:50% / 60%;
border:5px solid #f1f1f1;
box-shadow:0 10px 25px rgba(0,0,0,0.15);
transition:0.4s;
}

.founder-img:hover{
transform:scale(1.05);
}

.collections ul{
padding-left:18px;
}

.collections li{
margin-bottom:6px;
font-size:16px;
}

.founder-card{
padding:20px;
text-align:center;
}

.founder-img{
width:170px;
height:210px;
object-fit:cover;
border-radius:50% / 60%;
border:5px solid #f2f2f2;
box-shadow:0 10px 25px rgba(0,0,0,0.15);
transition:0.4s;
}

.founder-img:hover{
transform:scale(1.05);
}

.founder-social a{
display:inline-block;
margin:6px;
font-size:20px;
color:#333333;
transition:0.3s;
}

.founder-social a:hover{
color:#8b0000;
transform:scale(1.2);
}

/* ===== SECTION TITLE ===== */
.section-title{
  font-size:34px;
  font-weight:700;
  letter-spacing:1px;
  position:relative;
}

.section-title a{
  color:#111;
  transition:.3s;
}

.section-title a:hover{
  color:#b30000;
}

/* ===== PRODUCT CARD ===== */
.product-box{
  background:#fff;
  border-radius:16px;
  overflow:hidden;
  position:relative;
  box-shadow:0 8px 25px rgba(0,0,0,0.08);
  transition:all .35s ease;
  height:100%;
}

.product-box:hover{
  transform:translateY(-10px) scale(1.01);
  box-shadow:0 20px 45px rgba(0,0,0,0.18);
}

/* ===== IMAGE ===== */
.product-img{
  height:280px;
  overflow:hidden;
  position:relative;
}

.product-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:0.5s ease;
}

.product-box:hover img{
  transform:scale(1.12);
}

/* ===== OVERLAY EFFECT ===== */
.product-img::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(0,0,0,0.3), transparent);
  opacity:0;
  transition:.3s;
}

.product-box:hover .product-img::after{
  opacity:1;
}

/* ===== CONTENT ===== */
.product-content{
  padding:18px;
  text-align:center;
}

.product-content h5{
  font-size:17px;
  font-weight:600;
  color:#222;
  margin-bottom:6px;
}

/* ===== PRICE ===== */
.product-price{
  font-size:18px;
  font-weight:700;
  color:#b30000;
  margin-bottom:6px;
}

/* ===== DESCRIPTION ===== */
.product-desc{
  font-size:13px;
  color:#777;
  margin-bottom:12px;
  min-height:35px;
}

/* ===== BUTTON GROUP ===== */
.product-buttons{
  display:flex;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
}

/* ===== ADD TO CART BUTTON ===== */
.cart-btn{
  background:#111;
  color:#fff;
  border:none;
  border-radius:30px;
  padding:6px 16px;
  font-size:12px;
  transition:all .3s;
}

.cart-btn:hover{
  background:#000;
  transform:scale(1.05);
}

/* ===== BUY NOW BUTTON ===== */
.buy-btn{
  background:linear-gradient(135deg,#b30000,#ff1a1a);
  color:#fff;
  border:none;
  border-radius:30px;
  padding:6px 16px;
  font-size:12px;
  transition:all .3s;
  box-shadow:0 4px 15px rgba(179,0,0,0.4);
}

.buy-btn:hover{
  transform:scale(1.07);
  box-shadow:0 8px 20px rgba(179,0,0,0.6);
}

/* ===== PREMIUM BADGE (OPTIONAL) ===== */
.product-box::before{
  content:"New";
  position:absolute;
  top:10px;
  left:10px;
  background:#b30000;
  color:#fff;
  font-size:11px;
  padding:4px 10px;
  border-radius:20px;
  z-index:2;
  opacity:0.9;
}

/* ===== RESPONSIVE ===== */
@media(max-width:768px){
  .product-img{
    height:220px;
  }

  .section-title{
    font-size:26px;
  }
}

/* ============================= */
/* ===== CATEGORY SECTION ===== */
/* ============================= */

.category-card{
  background:#fff;
  border-radius:14px;
  padding:25px 10px;
  font-weight:600;
  color:#222;
  box-shadow:0 5px 20px rgba(0,0,0,0.08);
  transition:all .3s ease;
  position:relative;
  overflow:hidden;
}



.category-card:hover{
  transform:translateY(-8px);
  box-shadow:0 15px 35px rgba(0,0,0,0.15);
  color:#b30000;
}

/* subtle glow effect */
.category-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,0.4), transparent);
  opacity:0;
  transition:.4s;
}

.category-card:hover::after{
  opacity:1;
}

/* 5 COLUMN GRID FIX */
@media (min-width:768px){
  .col-md-2-4{
    width:20%;
  }
}

/* ============================= */
/* ===== PROMO BANNER ===== */
/* ============================= */

.promo-banner{
  position:relative;
 background:url('../images/Banarasi_saree_mobile_jpg.webp') center/cover no-repeat;
  padding:100px 0;
  color:#fff;
}

.promo-overlay{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.55);
}

.promo-box{
  position:relative;
  z-index:2;
  height:300px;
}

.promo-box h2{
  font-size:38px;
  font-weight:700;
  letter-spacing:1px;
  color:#ffffff;
 
}

.promo-box p{
  font-size:18px;
  margin-bottom:20px;
}

.promo-box .btn{
  padding:10px 28px;
  border-radius:30px;
  font-weight:600;
  transition:.3s;
}

.promo-box .btn:hover{
  background:#b30000;
  color:#fff;
}

/* ============================= */
/* ===== INSTAGRAM ===== */
/* ============================= */

.instagram img{
  border-radius:12px;
  transition:.4s;
  box-shadow:0 5px 15px rgba(0,0,0,0.08);
}

.instagram img:hover{
  transform:scale(1.05);
  box-shadow:0 15px 30px rgba(0,0,0,0.2);
}

.insta-link{
  color:#111;
  text-decoration:none;
  position:relative;
}

.insta-link:hover{
  color:#b30000;
}

/* ============================= */
/* ===== NEWSLETTER ===== */
/* ============================= */

.newsletter{
  background:linear-gradient(135deg,#111,#2b2b2b);
}

.newsletter h2{
  font-size:30px;
  font-weight:700;
}

.newsletter p{
  color:#ccc;
}

.newsletter-form{
  margin-top:20px;
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}

.newsletter-form input{
  padding:10px 15px;
  border:none;
  border-radius:30px;
  width:280px;
  outline:none;
}

.newsletter-form button{
  padding:10px 20px;
  border-radius:30px;
  font-weight:600;
  transition:.3s;
}

.newsletter-form button:hover{
  background:#b30000;
  color:#fff;
}

/* ============================= */
/* ===== GLOBAL TITLE ===== */
/* ============================= */

.section-title{
  font-size:34px;
  font-weight:700;
  letter-spacing:1px;
  color:#111;
}

.section-title a{
  color:#111;
  text-decoration:none;
}

.section-title a:hover{
  color:#b30000;
}

/* ============================= */
/* ===== RESPONSIVE ===== */
/* ============================= */

@media(max-width:768px){

  .promo-box h2{
    font-size:26px;
  }

  .section-title{
    font-size:24px;
  }

  .newsletter-form{
    flex-direction:column;
  }

  .newsletter-form input{
    width:100%;
  }
}

/* ===== BLOG DETAIL PAGE ===== */

.blog-container{
  max-width: 900px;
  margin: auto;
}

/* TITLE */
.blog-title{
  font-size: 38px;
  font-weight: 700;
  color: #111;
  line-height: 1.3;
}

/* DATE */
.blog-date{
  font-size: 14px;
  color: #888;
  margin-bottom: 20px;
}

/* IMAGE FIX (NO CROP) */
.blog-image{
  width: 100%;
  height: auto; /* 👈 IMPORTANT */
  border-radius: 12px;
  margin-bottom: 30px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* CONTENT */
.blog-content{
  font-size: 18px; /* 👈 bigger text */
  line-height: 1.9;
  color: #444;
}

/* PARAGRAPH SPACING */
.blog-content p{
  margin-bottom: 18px;
}

/* HEADINGS INSIDE CONTENT */
.blog-content h1,
.blog-content h2,
.blog-content h3,
.blog-content h4{
  margin-top: 30px;
  margin-bottom: 10px;
  font-weight: 700;
  color: #b30000;
  position: relative;
}

/* HEADING UNDERLINE EFFECT */
.blog-content h2::after,
.blog-content h3::after{
  content: "";
  width: 50px;
  height: 3px;
  background: #b30000;
  position: absolute;
  left: 0;
  bottom: -5px;
  border-radius: 10px;
}

/* RELATED BLOGS CARD */
.blog-card{
  border-radius: 12px;
  overflow: hidden;
  transition: 0.3s;
  border: none;
}

.blog-card:hover{
  transform: translateY(-8px);
  box-shadow: 0 15px 35px rgba(0,0,0,0.15);
}

.blog-card img{
  width: 100%;
  height: auto; /* 👈 no crop */
}

/* BUTTON */
.blog-btn{
  background: linear-gradient(135deg, #b30000, #ff4d4d);
  color: white;
  border-radius: 25px;
  padding: 8px 18px;
  font-size: 14px;
  transition: 0.3s;
  border: none;
}

.blog-btn:hover{
  background: black;
  color: #fff;
}

.whatsapp-float {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: #25D366;
    color: white;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    text-align: center;
    font-size: 28px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
}

.whatsapp-float:hover {
    transform: scale(1.1);
    background: #1ebe5d;
}

/* ===== GLOBAL FIX ===== */
img {
  max-width: 100%;
  height: auto;
}

body {
  overflow-x: hidden;
}

/* ===== MOBILE ===== */
@media (max-width: 768px) {

  .product-img {
    height: 200px !important;
  }

  .product-content h5 {
    font-size: 14px;
  }

  .product-price {
    font-size: 14px;
  }

  .product-desc {
    font-size: 12px;
  }

  .product-buttons button,
  .product-buttons a {
    font-size: 12px;
    padding: 5px 10px;
  }

}

/* ===== EXTRA SMALL ===== */
@media (max-width: 576px) {

  .product-buttons button,
  .product-buttons a {
    width: 100%;
    display: block;
    margin-bottom: 5px;
  }

}

.refer-header{
    background:#8b0000;
    color:#fff;
}

.btn-maroon{
    background-color:#8b0000;
    color:#fff;
    border:none;
}

.btn-maroon:hover{
    background-color:#5a0000;
}

.search-overlay{
    position: fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: rgba(0,0,0,0.7);
    display:none;
    z-index:9999;
}

.search-box{
    background:#fff;
    width:90%;
    max-width:500px;
    margin:100px auto;
    padding:20px;
    border-radius:10px;
    position:relative;
}

.search-box input{
    width:100%;
    padding:10px;
    border:1px solid #ccc;
    border-radius:5px;
}

.search-box span{
    position:absolute;
    top:10px;
    right:15px;
    cursor:pointer;
    font-size:20px;
}

#searchResults{
    margin-top:15px;
    max-height:300px;
    overflow-y:auto;
}

