body 
{
    font-family: 'Roboto', sans-serif;
    background-color: #F5F5F5; /* Light neutral background */
    color: #333; /* Dark gray for text */
}

/******************************* NAVIGATION BAR *******************************/
.navbar 
{
    background-color: #00796B;
    position: relative;
}

.navbar-nav .nav-link 
{
    color: #000000;
    font-size: medium;
    font-family: 'Oswald', sans-serif;
    font-weight: 700; /* Bold */
    text-transform: uppercase;
}

.navbar-nav .nav-link:hover 
{
    color: #4CAF50; /* Green hover for links */
}

.navbar-brand 
{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 50%;
  transform: translate(-50%, -50%);
  font-weight: bold;
}

.image-container-logo
{
    display: flex;
    justify-content: center; /* Centers the image horizontally */
    position: relative;
    top: 5px; /* Pixels from top */
}

.nav-logo-name 
{
    width: auto; /* Set the width of the logo */
    height: 30px; /* Maintain the aspect ratio */
    margin-right: 10px;
}

.nav-logo-img
{
    width: auto; /* Set the width of the logo */
    height: 80px; /* Maintain the aspect ratio */
}

/* Carousel */
.carousel 
{
    margin: 40px auto;
    max-width: 90%;
    border: 4px solid #010e02; /* Green border for branding */
    border-radius: 10px; /* Rounded corners */
    overflow: hidden;
}

/* Carousel Section Styling */
.carousel-section 
{
    margin: 20px auto;
    max-width: 1200px; /* Limit carousel width */
}

/* Ensure all images are the same size */
.carousel-item img 
{
    width: 100%; /* Fill the carousel width */
    height: 500px; /* Set a fixed height */
    object-fit: cover; /* Crop images to fit without distortion */
}

.footer 
{
    background-color: #2b2b2b;
    color: #fff;
    padding: 20px 0;
    text-align: center;
}

.footer a 
{
    color: #77c593;
    text-decoration: none;
}

.footer a:hover 
{
    text-decoration: underline;
}

body 
{
    font-family: 'Roboto', sans-serif;
    background-color: #f5f5f5;
    color: #333;
}

    /* Section Styling */
section 
{
    padding: 60px 0;
}

/* Section Headers */
section h2 
{
    text-align: center;
    color: #00796B; /* Teal for headers */
    font-weight: bold;
}


/* Cards */
.card 
{
    border-radius: 10px;
    border: none;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* Subtle shadow */
    background-color: #FFFFFF;
}

.card-title 
{
    color: #4CAF50; /* Green for titles */
}


.card-text 
{
    color: #555;
}

/* Buttons */
.btn-primary 
{
    background-color: #00796B; /* Teal button color */
    color: #FFFFFF;
    border: none;
}

.btn-primary:hover 
{
    background-color: #004D40; /* Darker teal for hover */
}

/* Footer */
.footer 
{
    background-color: #333333; /* Dark gray */
    color: #ffffff; /* White text */
    text-align: center;
    font-size: 14px; /* Optional: Make text smaller */
}

.footer a 
{
    color: #4CAF50; /* Green links */
    text-decoration: none;
}

.footer a:hover 
{
    color: #00796B; /* Teal hover effect */
}

.footer p 
{
    margin: 0; /* Remove margin around the text */
    padding: 0; /* Remove padding around the text */
}

/* Learn More Button */
.btn-learn-more {
    background-color: #00796B; /* Teal */
    color: #FFFFFF; /* White text */
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    font-weight: 500;
    transition: all 0.3s ease; /* Smooth transition */
}

.btn-learn-more:hover {
    background-color: #004D40; /* Darker teal on hover */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow */
    transform: translateY(-2px); /* Slight lift effect */
    color: #FFFFFF; /* Keep text white */
}

/* Change Hamburger Icon Color */
.navbar-toggler-icon 
{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='white' stroke-width='2' d='M4 7h22M4 15h22M4 23h22' /%3E%3C/svg%3E");
}

.navbar-toggler:hover
{
    background-color: #004D40; /* Darker teal on hover */
}