*{
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .nav-tabs .nav-link.active {
        background-color: #198754; 
        color: white;
    }

    .nav-tabs .nav-link {
        background-color: #f8f9fa; 
        color: #343a40; 
    }

    .nav-tabs .nav-link:hover {
        background-color: #198754; 
        color: white;
    }
   
    
   

@media (max-width: 768px) {
    .prod-img img.img-size {
    max-width: 100%;
    height: auto;
    object-fit: cover;
    width: 200px; 
    height: 300px; 
}
.prod-box {
    background-color: #f8f9fa; 
    border-radius: 8px;
    padding: 10px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.prod-txt {
    text-align: center;
}
.product-title {
    font-size: 1.25rem;
    font-weight: 500;
}
.prod-price {
    font-size: 1rem;
    margin-top: 0.5rem;
}
}

/* benifits section */
.benefit-text {
        font-size: 14px;
    }

    /* Increase font size for screens larger than 768px (medium and up) */
    @media (min-width: 768px) {
        .benefit-text {
            font-size: 18px;
            margin-bottom: 1px;
        }
    }

    /* Further increase for larger screens */
    @media (min-width: 1200px) {
        .benefit-text {
            font-size: 20px;
        }
    }
      /* Default for mobile screens (full-width) */
      .benefits-sec-btm {
        width: 100%;
    }

    /* Apply 80% width for screens larger than 576px (mobile and above) */
    @media (min-width: 576px) {
        .benefits-sec-btm {
            width: 80%;
        }
    }

    /* Ingredients   Mobile default */
.ingredients-container {
    width: 90% !important;
}

/* Larger screens (width: 80%) */
@media (min-width: 768px) {
    .ingredients-container {
        width: 90% !important;
    }
}
.image-container {
    position: relative;
    width: 100%;
    max-width: 2560px; 
    margin: 0 auto; 
}

.image-container img {
    width: 100%;
    height: auto; 
}

.button-overlay {
    position: absolute;
    bottom: 25%; 
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    width: 90%; }

.btn-shop-now {
    background-color: #198754; /* Green color */
    color: white;
    padding: 15px 30px;
    font-size: 18px;
    border-radius: 5px;
    font-weight: bold;
    border: none;
    transition: background-color 0.3s ease;
}

.btn-shop-now:hover {
    background-color: #28a745; 
}

@media (max-width: 767px) {
    .btn-shop-now {
        font-size: 10px; 
        padding: 3px 14px; 
    }
    .button-overlay {
        bottom: 15%; 
    }
}
@media (min-width: 768px) and (max-width: 1024px) {
    .btn-shop-now {
        font-size: 1rem; 
        padding: 0.75rem 1.5rem;
    }

    .button-overlay {
        bottom: 12%; 
    }
}
@media (min-width: 2560px) {
    .btn-shop-now {
        font-size: 1.5rem; 
        padding: 1rem 2rem; 
    }

    .button-overlay {
        bottom: 20%; 
    }
}