/*  video.css */
.video-container {
    text-align: center;
    margin: 20px auto;
    padding: 10px;
    max-width: 90%; /* Ensure it doesn't exceed the screen width */
}

.video-title {
    font-size: 1.5em;
    margin-bottom: 10px;
}

video {
    width: 100%;
    max-width: 600px; /* Adjust the max width as necessary */
    height: auto; /* Maintain aspect ratio */
    border: 2px solid #ccc;
    border-radius: 5px;
}

.responsive-video {
    width: 95%; /* Increased video size for larger screens */
    max-width: 1200px; /* Maximum width for large screens */
    height: auto;
    border: 2px solid #ccc;
    border-radius: 10px;
}

/* Ensure it looks good on smaller screens */
@media (max-width: 768px) {
    .responsive-video {
        width: 100%; /* Full width on mobile */
    }
}