/* .section-p1 {
    padding: 40px 80px;
  } */

.c-item{
    height: 580px;
}

.c-img{
    width: 100%; 
    height: 100%;
    object-fit: cover;
    /* filter: brightness(0.6); */
}

.overview{
    /* height: 180px; */
    background-color: #d3dae1; 
}

.img-card img{
    height: 100%;
    object-fit: cover;
}

#hero-carousel{
    width: 100%;
}

.navbar {
    background-color: white !important; /* Set the background color to white */
}
.navbar-nav .nav-link {
    color: black !important; /* Set the text color to black */
}

.navbar button{
    background-color: black !important;
}

.navbar .navbar-brand{
    color: black !important;
}

.navbar-nav .nav-link:hover {
    border-bottom: 2px solid green;
    color: green !important; /* Set the text color to green on hover */
    transition: 0.3s ease;
}
.navbar-nav .nav-link.active {
    border-bottom: 2px solid green; /* Add a green line under the active link */
    color: green !important;
}

 /* Info bar */
 .info-head {
    background-color: #310303; /* Light gray background */
    padding: 10px 0; /* Padding top and bottom */
}

.info-head .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.info-head .container ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.info-head .container ul li {
    display: inline-block;
    margin-right: 20px; /* Spacing between items */
}

.info-head .container ul li:last-child {
    margin-right: 0; /* Remove margin for last item */
}

.info-head .container ul li  {
    color: #fcf8f8; /* Black text color for links */
}

.info-head .container ul li a {
    color: #fcf8f8; /* Black text color for links */
    text-decoration: none;
}

.info-head .container ul li a:hover {
    text-decoration: underline; /* Underline on hover */
}

.img-card {
    height: 150px; /* Set a fixed height for the image containers */
}

#product1 a{
    text-decoration: none;
    color: black;
}

#product1 .card{
    width: 100%;
    min-width: 250px;
    padding: 10px 12px;
    border: 1px solid #cce7d0;
    border-radius: 25px;
    cursor: pointer;
    box-shadow: 20px 20px 30px rgba(0, 0, 0, 0.02);
    margin: 15px 0;
    transition: 0.2s ease;
    position: relative;
}

#product1 .card img{
    width: 100%;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

#product1 .card:hover{
    box-shadow: 20px 20px 30px rgba(0, 0, 0, 0.2);
}

 /* CSS for card hover effect */
 #product1 .card:hover img {
    transform: scale(1); /* Zoom effect on image */
}

#product1 .card:hover .card-title, 
#product1 .card:hover .card-text {
    color: green; /* Change text color to green on hover */
}

/* CSS to reduce card height to 50% */
.ftowm {
    height: 50%; /* Set the height of the card to 50% */
}

/* Adjust image height to fit within the card */
.ftowm img {
    height: 100%; /* Ensure the image height fills the card height */
    object-fit: cover; /* Scale the image to cover the entire container */
}


header {
    height: 350px;
    background-color: #310303;
}

header img {
    width: 100%; /* Use width to control the width of the image */
    height: 100%;
    object-fit: cover;
}
