html, body {
            margin: 0;
            padding: 0;
            height: 100%;
            overflow: hidden;
            background-color: black; /* Black background for borders */
        }
        #contentContainer {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            height: 100%;
            position: relative; /* Needed for absolute positioning of time/date */
        }
        img, video {
            max-width: 100%;
            max-height: 100%;
            width: auto; /* Maintain aspect ratio */
            height: auto; /* Maintain aspect ratio */
            object-fit: contain; /* Ensures the image fits within the screen without cropping */
        }

        /* Hide controls permanently */
        video::-webkit-media-controls {
            display: none !important;
        }
        video::-webkit-media-controls-enclosure {
            display: none !important;
        }
        video::-webkit-media-controls-panel {
            display: none !important;
        }
        
        /* Time and date display */
        #time-date {
            position: absolute;
            top: -5px;
            /* Center horizontally */
            /*left: 50%;*/
            /* Adjust for exact centering */
            /*transform: translateX(-50%); */
            right: -5px;
            color: black;
            font-size: 24px;
            font-family: Arial, sans-serif;
            display: block;
        }
        /* White or #57a832  box for time and date */
        #time-date-box {
            background-color: #c0d06a ;
            /*padding: 8px 8px;*/
            padding-top:9px;
            padding-right:11px;
            padding-bottom:8px;
            padding-left:8px;
            border-radius: 8px;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.8); /* Optional: Add a subtle shadow */
            text-align: start;
        }
        /* Time styling */
        #time {
            font-size: 40px; /* Larger font for time */
            font-weight: bold; /* Make time bold */
        }
        /* Date styling */
        #date {
            font-size: 20px; /* Smaller font for date */
            margin-top: 0px; /* Add space between time and date */
        }
        
        /* Event styling */
        .event-container {
            background: linear-gradient(135deg, #57a832, #93b24b, #c0d06a); /* Green gradient */
            padding: 40px;
            border-radius: 16px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
            text-align: center;
            max-width: 80%;
            max-height: 80%;
            width: 70%;
            height: 70%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            position: relative;
            margin-top: 60px; /* Add space at the top to avoid overlapping */
            animation: float 3s ease-in-out infinite; /* Floating animation */
            
            word-wrap: break-word; /* Break long words if necessary 
            overflow-wrap: break-word; /* Modern alternative to word-wrap */
        }
        @keyframes float {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-10px); }
        }
        .event-title {
            font-size: 46px; /* Larger font for title */
            font-weight: bold; /* Bold title */
            margin-bottom: 20px; /* Space below title */
            color: #ffffff; /* White text for contrast */
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* Dark shadow for depth */
            font-family: 'Georgia', serif; /* Stylish serif font */
            letter-spacing: 2px; /* Add spacing between letters */
            text-transform: uppercase; /* Uppercase text for emphasis */
            
            width: 100%;
        }
        .event-date-time {
            font-size: 32px; /* Larger font for date and time */
            font-weight: 600; /* Semi-bold */
            margin-bottom: 20px; /* Space below date and time */
            color: #ffffff; /* White text for contrast */
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* Dark shadow for depth */
        }
        .event-description {
            font-size: 24px; /* Larger font for description */
            line-height: 1.5; /* Better line spacing */
            color: #ffffff; /* White text for contrast */
            max-width: 80%; /* Limit width for better readability */
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* Dark shadow for depth */
        }