.card-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.card {
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
    width: 300px;
    margin-bottom:20px;
}
.card img {
    
    flex: 0 0 auto; /* Do not grow or shrink, but allow basis auto */
    margin-right: 0px; /* Space between images */
    /*width: 322px !important;*/ /* Set the width of the image */
    /*height: 200px !important;*/ /* Set the height of the image */
    object-fit: cover !important; /* Cover the container, crop the image if necessary */
    display: block !important; /* Removes bottom space/margin of inline elements */
    overflow: hidden !important; /* Hide the overflowed part of the image */
}

.card-content {
    padding: 10px;
}

.card-content h3 {
    margin-top: 0;
}

.card-content p {
    color: #333;
    font-size: 14px;
}
.team-name {
    text-align:center;
    font-size:small;
}

/* Apply to the main title or headers */
h1, .main-title {
    font-family: 'Arial', sans-serif; /* Use a font that suits your site's design */
    color: #333; /* A darker color for the header text */
    text-align: left; /* Center the text */
    margin-bottom: 5px; /* Add some space below the title */
    font-size: 1.2em; /* Make the title larger */
    font-weight: bold; /* Make the font bold */
    font-style: italic; /* Make the text italic */
    margin-top : 30px;
}

/* Apply to subheaders like 'Vision Statement', 'The Team' */
h2, .sub-header {
    font-family: 'Arial', sans-serif;
    color: #555; /* Slightly lighter than the main title for contrast */
    margin-bottom: 15px; /* Space below subheaders */
    font-size: 2em; /* Size of subheaders */
    border-bottom: 2px solid #DDD; /* Add a bottom border for emphasis */
    padding-bottom: 5px; /* Space above the border */
}

/* Apply to the main body text */
p, .main-content {
    font-family: 'Verdana', sans-serif;
    color: black; /* A lighter color for the body text */
    line-height: 1.2; /* Space between lines */
    font-size: 0.9em; /* Default size for body text */
    text-align: justify; /* Justify the text for cleaner margins */

}

.card-text {
    display: block; /* Ensures the element behaves like a block-level element */
    /*height: 4.5em;*/ /* Example fixed height - adjust as needed */
    overflow: hidden; /* Hides text that overflows the fixed height */
    margin-bottom: 0.5rem; /* Adjust as needed for spacing */
    line-height: 1.5em; /* Adjust line height as needed for text spacing */

}

.card p {
    text-align: left;
    margin: 0; /* Reset default margins */
    line-height: 1.6; /* Space between lines */
    font-size:small;
}