/* Container for image and text */
.image-container {
    position: relative; /* Needed for absolute positioning of text */
    display: inline-block;
    max-width: 920px;
}

/* Background image */
.image-container img {
        display: block;
        width: 920px;
        height: auto;
    }

/* Overlay event */
.overlay-event {
    position: absolute;
    top: 85%; /* Center vertically */
    left: 85%; /* Center horizontally */
    transform: translate(-50%, -50%);
    color: white;
    font-size: 1.5rem;
    font-weight: bold;
    text-align: center;
    padding: 10px 20px;
    background: rgba(0, 0, 0, 0.5); /* Semi-transparent background for readability */
    border-radius: 5px;
    white-space: nowrap;
}

/* Overlay name */
.overlay-name {
    position: absolute;
    top: 50%; /* Center vertically */
    left: 50%; /* Center horizontally */
    transform: translate(-50%, -200%);
    color: white;
    font-size: 4rem;
    font-weight: bold;
    text-align: center;
    padding: 10px 20px;
    background: rgba(0, 0, 0, 0.5); /* Semi-transparent background for readability */
    border-radius: 6px;
    white-space: nowrap;
}

/* Overlay place */
.overlay-place {
    position: absolute;
    top: 85%; /* Center vertically */
    left: 15%; /* Center horizontally */
    transform: translate(-50%, -50%);
    color: white;
    font-size: 1.5rem;
    font-weight: bold;
    text-align: center;
    padding: 10px 20px;
    background: rgba(0, 0, 0, 0.5); /* Semi-transparent background for readability */
    border-radius: 5px;
    white-space: nowrap;
}

/* Overlay time */
.overlay-time {
    position: absolute;
    top: 48%; /* Center vertically */
    left: 50%; /* Center horizontally */
    transform: translate(-50%, -50%);
    color: black;
    font-size: 8rem;
    font-weight: bold;
    text-align: center;
}

/* Overlay sponsor */
.overlay-sponsor {
    position: absolute;
    top: 95%; /* Center vertically */
    left: 50%; /* Center horizontally */
    transform: translate(-50%, -50%);
    color: #1f445c;
    font-size: 1.5rem;
    font-weight: bold;
    text-align: center;
    padding: 10px 20px;
    background: rgba(244, 91, 56, 1); /* Semi-transparent background for readability */
    border-radius: 5px;
    white-space: nowrap;
}

.event-distance {
    font-size: 5rem;
}

@media print {
    .overlay-name {color: #000000 !important;}
    .overlay-place {color: #000000 !important;}
    .overlay-event {color: #000000 !important;}
    .overlay-sponsor {background-color: #F45B38 !important;
        -webkit-print-color-adjust: exact !important; /* Chrome, Safari */
        print-color-adjust: exact !important; /* Modern browsers */
        color-adjust: exact !important; /* Firefox */}
}