
#mega-video {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    padding: 20px;
    box-sizing: border-box;
}

.iframe-container {
    position: relative;
    width: 100%;
    max-width: 800px;
    padding-bottom: 56.25%;
    height: 0;
}

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

#episode-title {
    font-family: 'Arial Black', sans-serif;
    font-size: 2rem;
    font-weight: 900;
    color: #ff6b35;
    text-transform: uppercase;
    letter-spacing: 4px;
    text-shadow: 
        1px 1px 0px #d63447,
        2px 2px 0px #d63447,
        3px 3px 0px #d63447,
        4px 4px 0px #d63447,
        5px 5px 0px #d63447,
        6px 6px 0px #d63447,
        7px 7px 10px rgba(0,0,0,0.4);
    transform: perspective(500px) rotateX(15deg);
}

#away-messages-back {
  text-decoration: underline dotted var(--col-accent);
}

.video-details {
  color: #777;
}

body {
	/*
	--sizing: 24px; general distance between elements
	--page-timing: 0.15s; transition of most elements' animations on hover, etc

	--col-background: #fab; background color
	--col-body: #fff; main container color
	--col-dim: #eee; color for dim borders, etc - "body color but a bit different"
	--col-text: #222; main text color
	--col-accent: #fab; accents color, like borders, etc
	--col-counterpick: #1fc; secondary accetns
	--col-shadow: rgba(0,0,0,0.1); color for box-shadows, etc

	--font-big: 'arial'; buttons, headings, etc
	--font-big-size: 32px;
	--font-main: 'verdana'; main text
	--font-main-size: 18px;

	--shadow: -4px 4px 0 var(--col-shadow); set master box-shadow distance/blur here

	--buttons-height: 64px; height of group buttons and other buttons
	--buttons-per-row: 4; how many buttons per row to display. change artworks in settings.js
	--viewer-overlay-opacity: 0.5; when you press on an artwork, a viewer pops up. this is
	--viewer-overlay-rgb: 0,0,0; to set up its backdrop opacity and colour (rgb value triplet)

	--border-width: 4px; borders of group buttons
	*/
}