body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}

.footer {
    margin-top: auto;
    background-color: #f8f9fa; /* Your custom light grey */
}

/* For content that doesn't fill the page */
.container, .content-wrapper {
    flex: 1;
}
.custom-bg {
    background-color: #87CEEB;
}
.navbar {
    padding-top: 0.25rem !important; /* Reduced padding */
    padding-bottom: 0.5rem !important; /* Reduced padding */
    min-height: 2.5rem !important; /* Reduced from default 56px (3.5rem) */
}

.navbar-brand {
    padding-top: 0 !important; /* Remove default padding */
    padding-bottomv: 0; /* Remove default padding */
}

.navbar-nav .nav-link {
    padding-top: 0.25rem !important; /* Reduced padding */
    padding-bottom: 0.25rem !important; /* Reduced padding */
}

.photo-item {
    position: relative;
}

.select-box {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 20px;
    height: 20px;
    background-color: white; /* Solid white background */
    border: 2px solid #000;
    cursor: pointer;
    display: none;
}

.photo-item.selected .select-box::after {
    content: '\2713'; /* Checkmark unicode */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: black; /* Black checkmark */
    font-size: 16px; /* Size of the checkmark */
    line-height: 1; /* To center the checkmark vertically */
}

.photo-item:hover .select-box {
    display: block;
}

.rounded-image {
    border-radius: 10px;
}

.custom-bg-blue {
    background-color: #87CEEB; /* Sky Blue */
}

.custom-bg-red {
    background-color: #FF6347; /* Tomato */
}

.custom-bg-green {
    background-color: #98FB98; /* Pale Green */
}

.custom-bg-yellow {
    background-color: #FFD700; /* Gold */
}