body {
	display: inline-block;
	padding: 0;
	min-width: 100%;
	height: 100%;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 16px;
	line-height: 1.4;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

<?php
header('Content-type: text/css');
?>
* {
	margin: 0;
}
html, body {
	height: 100%;
}
.wrapper {
	min-height: 100%;
	height: auto !important; /* This line and the next line are not necessary unless you need IE6 support */
	height: 100%;
	margin: 0 auto -15px; /* the bottom margin is the negative value of the footer's height */
}
.footer, .push {
	background-color:#302133;
	text-align:center;
	color:white;
	height: 15px; /* .push must be the same height as .footer */
}

.socialmediaboxes {
	text-align:center;
	width:auto;
	float:left;	
	margin-right:15px;
	
}
.socialmediaclear {
	width: auto;
	clear: both;
	
}
li {
    float: left;
}
.menu {
	margin-left:15px;
	display:flex;
	justify-content:space-around;
}
	
li a, .dropbtn {
    display: inline-block;
    color: black;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

li a:hover, .dropdown:hover .dropbtn {
	color:white;
	background-color:#302133;

}

li a:link {
	color:white;
}
li a:hover {
	color:white;
	text-decoration:underline;
}

li.dropdown {
    color: black;
	display: inline-block;
	background-color:#302133; /*sets a background color for the dropdown button*/
}

.dropdown-content {
	display: none;
	position: absolute;
	min-width: 160px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	color: black;
}

.dropdown-content a {
    padding: 12px 16px;
    text-decoration: underline;
    display: block;
    text-align: left;
	background-color:#302133; /* this is the background of the menu*/
}

.dropdown-content a:hover {
	color:black;
	background-color:white; /*menu item background color on hover*/
}

.dropdown:hover .dropdown-content {
    display: block;
	color:black;
}
a.textlink:link {
	color:black;
	text-decoration: underline; 
}
a.textlink:visited {
	color:black;
	text-decoration: underline;
}
a.textlink:hover, a.textlink:active, a.textlink:focus {
	color:#302133;
	text-decoration: none;
}

a.purple:link {
	color:white;
	text-decoration: underline; 
}
a.purple:visited {
	color:white;
	text-decoration: underline;
}
a.purple:hover, a.textlink:active, a.textlink:focus {
	color:#39F;
	text-decoration: none;
}

/* ~~ Element/tag selectors ~~ */
ul, ol, dl {
    list-style-type: none;
	color:black;
    padding: 0;
    overflow: hidden;
    background-color: #302133;
	padding: 0;
}

h1 {
	margin-top: 0;
	margin-bottom:-25px;	
	color: #302133;
	padding-right: 15px;
	padding-left: 15px;
}
h2 {

	font-size: 26px ;
	color: white;
	padding-right: 15px;
	padding-left: 15px;
}

.subimage {
	width:300px;
	height:215px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}
.wtfimage {
	width:400px;
	height:155px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}

img { 
	margin-right:15px;
	border:solid;
	/*float:left;*/
}

/* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
a:link {
	color:black;
	text-decoration: none; 
}
a:visited {
	color:white;
	text-decoration: none;
}
a:hover, a:active, a:focus {
	color:#302133;
	text-decoration: none;
}

.container {
	width:860px;
	height:auto;
	overflow:visible;
	padding-top:25px;
	margin-left:auto;
	margin-right:auto;
}

/* ~~the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo~~ */
#header {
	width:100%;
	height:255px;
	padding-top:50px;
	background-color:white;

}
.headerimagecontainer {
	width:340px;
	height:auto;
	text-align:center;
	margin-left:auto;
	margin-right:auto;
}

.headerimg {
	border:none;
}
.podimage {
	margin-top:20px;
	outline:none;
	float:left;
}
.podimagediv {
	height:295px;
	width:250px;
	padding-top:5px;
	margin-right:25px;
	float:left;
}
.menuBar {
	width: auto;
	height: 75px;
	max-width:860px;
	min-width:360px;
	margin-left:auto;
	margin-right:auto;
}
.content {
	width: auto;
	max-width:860px;
	min-width:360px;
	padding:10px;
	margin-right: auto;
	margin-left: auto;
}

.spacer {
	height:50px;
	padding: 0 0 10px 40px;
	background-color: #fff;
}
.aboutdiv {
	width:740px;
	height:auto;
	padding: 10px;
	margin-right:auto;
	margin-left:auto;
	min-width:360px;
	min-height:200px;
}
.thanksdiv {
	width:740px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}	
.contactdiv {
	width:740px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
}
.episodecontent {
	height:auto;
	padding:10px;
	margin-right:auto;
	margin-left:auto;
	margin-bottom:20px;
	min-height:300px;
	max-width:740px;
	overflow:visible;
	background-color:#302133;
	color:white;	
}
.aboutphotos {
	text-align:center;
	width:200px;
	height:168px;
	border:solid;
	border-color:#302133;
	margin-right:20px;
	margin-bottom:20px;
	float:left;
}
.aboutphotos2 {
	text-align:center;
	width:200px;
	height:242px;
	border:solid;
	border-color:#302133;
	margin-right:20px;
	float:left;
}
img.about {
	border:none;
}
.aboutsubtitle {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: x-large;
	color: #636;
	font-weight: bold;
}
.aboutblobs {
	width:auto;
	height:auto;
	margin-bottom:50px;
	clear:both;
}
.seasonbox {
	width: 600px;
	border: none;
	margin-right: auto;
	margin-left: auto;	
	padding-bottom:15px;
}
.smallseasonbox {
	width: 300px;
	border: none;;
		margin-left: auto;
		margin-right:auto;	
	padding-bottom:15px;	
}