@charset "utf-8";
html {
	overflow-y: scroll;
	font-family: Arial, Helvetica, sans-serif;	
	color: #999;
}
body {
	margin: 0px;
	padding: 0px;
	min-width: 400px;
	background-image: 
		url(/images/background-left.png),
		url(/images/background-right.png),
		url(/images/background.jpg);
	background-repeat: 
		repeat-y,
		repeat-y,
		no-repeat;
	background-position: 
		left top,
		right top,
		center top;
	background-size: 
		15% auto,
		15% auto,
		cover;
	background-attachment: 
		fixed,
		fixed,
		fixed;	
}
h1, h2, h3, h4, h5, h6 {
	font-family: October Crow, Arial, sans-serif;
	color: #b08135;
}
@font-face { font-family: October Crow; src: url('/October Crow.ttf'); } 
a {
	color: #999;
}
img {
	display: block;
}
img.center {
	display: block;
	margin-left: auto;
	margin-right: auto;
}




#frame {
	max-width: 1440px;
	width: 75%;
	margin-left: auto;
	margin-right: auto;
}
#header-frame {
	display: -webkit-flex;
	display: flex;
	padding-bottom: 0px;
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 10px;
	margin-bottom: 10px;
}
.header {
	width: 100px;
	background-color: #000;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 0px;
}
#logo {
	flex: 1.75;
}
#contact {
	flex: 1;
}
#calendar {
	flex: 1;
}
#slider-frame {
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 5px;
	margin-bottom: 1px;
	padding-bottom: 40%;
	position: relative;
	overflow: hidden;
}
#slider {
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
}
#attraction-frame {
	display: -webkit-flex;
	display: flex;
}
.attraction {
	flex: 1;
	background-color: rgba(0, 0, 0, 0.7);
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
	padding: 10px;
}
#cast, #connect, #comments {
	background-color: rgba(0, 0, 0, 0.7);
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 5px;
	margin-bottom: 10px;
	padding: 10px;
}

	
@media (max-width: 1000px) and (min-width: 0px){
	html {
	font-size: xx-large;
	}
	#header-frame {
        -webkit-flex-direction: column;
		flex-direction: column;
    }
	.header {
		width: auto;
	}
	#attraction-frame {
        -webkit-flex-direction: column;
		flex-direction: column;
    }
}
#joincast {
	margin-left: 10%;
	background: #666;
	padding: 25px;
	margin-right: 10%;
}
#joincast label {
	margin-bottom: 10px;
}
#joincast input {
	margin-bottom: 15px;
}