/* CSS layout designed by Josiah Cochran */

body {
	font-family: arial, sans-serif;
	font-size: 12pt;
	margin: auto;
	margin-top: 0;
	text-align: center;
	background-color: #000000;
	color: #ffffff; }

/* container uses percentage to adjust for both widescreen and standard displays */ 
#container {
	width: 100%;
	min-height: 900px;
	margin: auto;
	margin-top: 0;
	background-image: url(pics/wide_bg.jpg);
	background-repeat:no-repeat; 
	background-attachment: fixed;
	background-position: center top;}

/* bodymax sets maximum size of main page for non-widescreen displays */	
#bodymax {
	max-width: 1024px;
	min-width: 320px;
	margin: auto; }

/* header displays page title */
#header {
	width: 98%;
	height: 77px;
	font-family: arial, sans-serif;
	text-align: center;
	background-image: url(pics/josiahheader.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	background-color: #000000;
	color: #ffffff; }

/* ***************************************** nav contains navigation bar */
#nav {
	width: 96%;
	font-family: arial, sans-serif;
	text-align: center;
	background-color: #0000cc;
	color: #ffffff;
	border-style: ridge;
	border-color: #ff3300;
	border-width:5px;
	padding: 2px; }

/* ****************************************** home sets background image for homepage */
#home {
	height: 1022px;
	background-image: url(pics/josiahspin1.jpg);
	background-repeat: no-repeat;
	background-position: right top; }

/* hometxt sets spacing for introduction and font information */
#hometxt {
	width: 50%;
	font-family: arial, sans-serif;
	font-size: 14pt;
	text-align: left; 
	text-shadow: 2px 2px #000000}
	
#page_options {
	max-width: 400px;
	min-width: 320px;
	height: 50px;
	text-align: left;
	float: right; 
	margin-top: 5px;}


.fb-stuff {
	background-color: #ffffff;
	max-width: 480px;
	min-width: 320px;
	margin: auto }

/* --------------- Table Styles ---------------------- */

/* track sets table data width for track name */
th.track {
	width: 85%; }

/* num sets table data width for track time information */
th.num {
	width: 12% }

th.infohead {
	width: 100px }

/* oldmixname sets table data width for old mix name */
th.oldmixname {
	width: 200px }

#oldmixes {
	width: 98%;
	text-align: left }

/* ------------------ Misc Element Styles ---------------- */

strong.blue {
	color: #6495ED; }

h1 {
	text-align: center;
	position: relative;
	display: inline;
	border-style: ridge;
	border-color: red;
	border-width: 1px 0 1px; }

h2.center {
	text-align: center; }

/* ----------------This code formats links */

a:link {color:#00B200;}
a:visited {color:#00FF00;}  
a:hover {color:#7FFF00;} 
a:active {color:#00FF00;}

a.nav:link {color:#00B200;}
a.nav:visited {color:#00FF00;} 
a.nav:hover {color:blue; background-color:#00FF00;} 
a.nav:active {color:#00FF00;} 

a.bloglink:link {color:#00FF00;}
a.bloglink:visited {color:#00FF00;}  
a.bloglink:hover {color:#00FF00;} 
a.bloglink:active {color:#00FF00;}

/* This code formats all images */

img {
	border-color: transparent;
	max-width: 100%; }
	
object {
	max-width: 100%; }

img.blogPic {
	max-width: 95%;
	border-style: ridge;
	border-color: #ff3300;
	border-width: 5px; }

.text_line {
	clear:both; }
	
/* ********************* Adjust screen resolutions ****************************
Target resolutions:
	320px
	480px
	600px
	768px
	900px
	1200px
******************************************************************************* */

@media screen and (max-width: 800px) {
	#page_options {
		float: none; }
}

@media screen and (max-width: 600px) {
	#home {
		background-image: none; }
	
	#hometxt {
		width: 98%; }
	
	#phometxt {
		text-align: justify; }
}