/*
 * Responsive 16:9 wrapper for embedded video iframes (Google Drive, YouTube, etc.).
 * Uses the padding-bottom hack — supported by every browser since the early 2010s.
 *
 * The container fills its parent's available width (works in table cells,
 * full-width divs, anywhere). padding-bottom: 56.25% creates a height equal to
 * 56.25% of the parent width, which is exactly 9/16 — i.e. 16:9 aspect ratio.
 * The iframe is absolutely positioned to fill the container.
 */
.video-container {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    overflow: hidden;
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}