.container {
	margin: 4% auto;
	margin-top: 0px;
	font-family: sans-serif;
	padding-bottom: 250px;
}

.container h1{
	font-size: 1.4em;
}

.container h2{
	font-family: sans-serif;
	font-size: 1.2em;
}

.header .jumbotron {
    background-image: url("MythsPosterFull.png");
    background-size: contain; /* Ensures the image covers the entire screen */
    background-position: center top; /* Keeps the image centered at the top */
    background-repeat: no-repeat;
    width: 100%;
    height: 100vh; /* Ensures the container always fills the full viewport height */
    position: relative;
    z-index: -1;
}

.section-banner {
    background-image: url("MythsPoster.jpg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    aspect-ratio: 4 / 5; /* Or whatever your image ratio is */
    margin-bottom: 30px;
}

.section-banner-eras {
    background-image: url("ErasPoster.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    aspect-ratio: 4 / 5; /* Or whatever your image ratio is */
    margin-bottom: 30px;
}

.section-banner-tchaikovsky {
    background-image: url("TchaikovskysFifthPoster.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    aspect-ratio: 4 / 5; /* Or whatever your image ratio is */
    margin-bottom: 30px;
}