.thumbnail img {
    max-width: 100%;
    max-height: 100%;
    object-fit: cover; /* Crop images while maintaining their aspect ratio */
}

.thumbnail div {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

#uploadArea {
    border: 2px dashed #ccc;
    border-radius: 5px;
    padding: 30px;
    cursor: pointer;
    text-align: center;
    background-color: #f8f9fa;
}
#uploadArea.dragging {
    background-color: #e9ecef;
}
.thumbnail img {
    width: 100%;
    height: auto;
}
.carousel-item img,
.carousel-item embed {
    max-height: 400px;
    object-fit: contain;
    margin: 0 auto;
}

.carousel-indicators li {
    background-color: #007bff;
}

.carousel-caption {
    background: rgba(0, 0, 0, 0.5);
    padding: 10px;
    border-radius: 5px;
    margin-top: 50px;
}

.carousel-item img {
    width: 100%; /* Ensures the image fits the width of its container */
    max-height: 400px; /* Sets a consistent height for all images */
    object-fit: cover; /* Ensures images are cropped proportionally without distorting */
    display: block;
}
.carousel-item embed {
    width: 100%; /* Ensures PDFs are responsive */
    max-height: 400px; /* Keeps height consistent */
    object-fit: contain;
}
.carousel-inner {
    height: 400px; /* Ensures all carousel items are the same height */
}

.carousel {
    margin-bottom: 20px;
}

/* Set equal size for thumbnails */
.equal-thumbnail {
    width: 100%;
    height: 150px; /* Adjust the height to your preference */
    object-fit: cover; /* Ensures images scale to fit within the defined dimensions */
    display: block;
}

/* Ensure thumbnail container consistency */
.thumbnail {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 150px; /* Match the height of the image */
    overflow: hidden;
    border: 1px solid #ddd;
    border-radius: 5px;
}


#imageModal img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}