/* 
	Base CSS (base.css)
	Copyright 2009 - Dan Masquelier - 
	www.danmasq.com audio/video/web
	
	Table of Contents:
	------------------
	CSS Reset
	Controller
	Header
		Logo
		Skip To
		Top Navigation
	Main
		Taglines
		Main Left Column
			Content (general content)
		Main Right Column
			Audio/Video Player
			Galleries
			Contact Form
	Footer
	Misc. Classes
		Modal Window
	------------------
*/

/* CSS Reset
--------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,form,fieldset,legend,input,button,textarea,p,blockquote,th,td 
{margin:0;padding:0;}
table {border-collapse:collapse;border-spacing:0;}
fieldset,img {border:0;}
hr {display:none;}


/* Controller
--------------------*/
html, body {
	height:100%;
}
body {
    margin:0 auto;
    width:100%;
	min-height:100%;
	height:auto !important;
	background-color:#fff;
	font-family: "Trebuchet MS", "calibri", "Gill Sans", sans-serif;
	font-size:100%;
	text-align:center;
}
#wrap {
	height:100%;
	margin:30px auto;
	text-align:left;
	width:920px;
}
	/* Clearfix
	--------------------*/
	#wrap:after {
		visibility:hidden;
		font-size:0.1em;
		display:block;
		line-height:0;
		height:0.1px;
		content: " ";
		clear:both;
	}
	* html #wrap {display:inline-block;}
	/* hide from ie mac \*/
	* html #wrap {height:1%;}
	#wrap        {display:block;}
	/* end hide from ie mac */

	

/* Header
--------------------*/	
#header {
	position:relative;
	float:left;
	width:920px;
	height:132px;
}
	

	/* Logo
	--------------------*/
	#logo {
		width:334px;
		height:132px;
		overflow:hidden;
	}
		#logo h1, #logo p{
			display:block;
			font-size:0px;
			line-height:0px;
			text-indent:-9999px;
		}
		#logo a {
			display:block;
			width:334px;
			height:132px;
			background:url(i/logo.png) no-repeat 0 0;
			text-indent:-9999px;	
		}

	/* Loading Graphic (when AJAX is enabled)
	--------------------*/
	#load {
		display:none;
		position:absolute;
		top:22px;
		left:116px;
		width:32px;
		height:32px;
		background:url(i/loading.gif) no-repeat 0 0;
		color:#8D241C;
	}


	/* Skip To Sections
	--------------------*/
	#skip {
		display:none;
	}
	

	/* Top Navigation
	--------------------*/
	#topnav {
		position:absolute;
		right:0;
		top:62px;
		width:520px;
		height:48px;
	}
		#topnav ul {
			list-style:none;
			float:right;
			width:520px;
			background-color:#f00;
			height:48px;
			overflow:hidden;
		}
		#topnav li {
			float:left;
		}
		#topnav li a {
			position:relative;
			display:block;
			float:left;
			height:48px;
			line-height:48px;
			background:url(i/topnav_back.png) no-repeat 0 0;
			text-align:center;
			text-decoration:none;
			font-size:1.25em;
			color:#fff;
		}
			#topnav li a span {
				position: absolute;
				top: 0;
				left: 0;
				display: block;
				height:48px;
				background-image:url(i/topnav_back.png);
				background-repeat:no-repeat;
			}
			
			/* Individual #topnav Buttons
			--------------------*/
			#topnav .resume a {
				width:144px;
				background-color:#7e1b11;
				background-position:0 0;
			}
				#topnav .resume a span {
					width:144px;
					background-position:0 -48px;
				}
					#topnav .resume a:active {
						background-position:0 -96px;
					}
					
			#topnav .audio a {
				width:127px;
				background-color:#517b5c;
				background-position:-144px 0;
			}
				#topnav .audio a span {
					width:127px;
					background-position:-144px -48px;
				}
					#topnav .audio a:active {
						background-position:-144px -96px;
					}
					
			#topnav .video a {
				width:126px;
				background-color:#789550;
				background-position:-271px 0;
			}
				#topnav .video a span {
					width:126px;
					background-position:-271px -48px;
				}
					#topnav .video a:active {
						background-position:-271px -96px;
					}
					
			#topnav .web a {
				width:123px;
				background-color:#b1a548;
				background-position:-397px 0;
			}
				#topnav .web a span {
					width:123px;
					background-position:-397px -48px;
				}
					#topnav .web a:active {
						background-position:-397px -96px;
					}


/* Main
--------------------*/
#main {
	clear:both;
	float:left;
	width:100%;
	padding:0 0 50px;
	background:url(i/main_back.png) no-repeat left bottom;
}

	/* Taglines below #topnav
	--------------------*/
	#taglines {
		float:right;
		width:500px;
		margin:0 0 26px;
		padding:0 12px 4px 0;
		line-height:24px;
		font-size:1.06em;
		text-align:right;
	}
		#taglines .audio, #taglines .audio a {
			color:#5c8968;
		}
			#taglines .audio a:hover {
				color:#83AF8E;
			}
		
		#taglines .video, #taglines .video a {
			color:#84a25a;
		}
			#taglines .video a:hover {
				color:#A7BF83;
			}
		
		#taglines .web, #taglines .web a {
			color:#bdb157;
		}
			#taglines .web a:hover {
				color:#DFD47D;
			}
		
		#taglines .contact {
			color:#a64d46;
		}
			#taglines .contact a {
				color:#a64d46;
				padding:0 0 0 22px;
				background:url(i/contact.png) no-repeat left center;
			}
				#taglines .contact a:hover {
					color:#BF716B;
				}
	
				
	/* Main Left and/or Main Right Column Common Values
	--------------------*/			
	#mainleft {
		float:left;
		width:390px;
		padding-right:10px;
	}
		#mainleft h2 {
			display:block;
			width:148px;
			height:36px;
			margin:46px 0 15px;
			text-indent:-9999px;
			background:url(i/h2_back.png) no-repeat 0 0;
		}
			#mainleft .h2resume {
				background-position:0 0;
			}
			#mainleft .h2audio {
				background-position:0 -36px;
			}
			#mainleft .h2video {
				background-position:0 -72px;
			}
			#mainleft .h2web {
				background-position:0 -108px;
			}
			#mainleft .h2contact {
				background-position:0 -145px;
			}

		#mainleft h3, #mainright h3 {
			display:block;
			width:100%;
			height:32px;
			margin:0 0 10px;
			line-height:30px;
			background:url(i/h3_back.png) no-repeat right top;
			font-size:1.13em;
			text-indent:8px;
			color:#8d241c;
			text-shadow:1px 1px 1px #DFC5C3;
		}
			#mainleft h3 span, #mainright h3 span {
				float:right;
				display:block;
				padding:0 5px 0 0;
				font-size:0.444em;
				color:#E2C8C6;
				text-shadow:none;
			}
			#mainleft h4, #mainright h4 {
				float:left;
				margin:0 0 5px;
				text-indent:20px;
				font-size:0.88em;
				color:#bc655e;
			}
				#mainleft .date {
					float:left;
					padding:3px 0 0 6px;
					font-size:0.63em;
					color:#e2c8c6;
				}
					#mainleft li .date {
						float:none;
					}
		
		/* Content  
		--------------------*/
		.content {
			clear:both;
			padding:0 20px;
			line-height:20px;
			font-size:0.75em;
			color:#705c5a;
		}
			.content ul, .content ol {
				padding:0 30px 11px;
			}
			.content ul ul, .content ol ol {
				padding:0 14px 0px;
			}
			.content ul {
				list-style-image:url(i/bullet.gif);
			}
				.content ul li {
					padding:0 0 0 5px;
				}
					
			.content a, h4 a {
				color:#a64d46;
			}
				.content a:hover, h4 a:hover{
					color:#BF716B;
				}
					.content a:active, h4 a:active{
						text-decoration:none;
					}
		
	/* Main Right Column Specific
	--------------------*/
	#mainright {
		float:right;
		width:520px;
	}
		#mainright .note {
			padding:3px 0 0 4px;
			font-size:0.63em;
			color:#8F8786;
		}
		
		#mainright .audio {
			font-style:italic;
			color:#598564;
		}
		#mainright .video {
			color:#7b9752;
			font-style:italic;
		}
		#mainright .web {
			color:#b2a549;
			font-style:italic;
		}
		#mainright .graphic {
			color:#bc655e;
			font-style:italic;
		}
		
		/* Video Player
		--------------------*/
		#mainright #player_wrapper {
			width:520px;
			font-size:.50em;
			color:#bc655e;
		}	
		#mainright #video_player {
			/* BG Image is 518x259px */
			width:100%;
			height:295px;
			margin:0 0 20px;
			padding:2px 0;
			background:url(i/video_back.png) no-repeat center top;
			outline:0;
		}
			* html #mainright #video_player {
				/* IE6 moving background-image out of position */
				background-image:none; 
			}
			#mainright #video_player span {
				display:block;
				color:#a64d46;
			}
		
		/* Audio Player
		--------------------*/
		#mainright #audio_player {
			width:100%;
			height:30px;
			margin:0 0 20px;
			outline:0;
		}
		
		/* Gallery 
		--------------------*/
		#mainright .gallery {
			clear:both;
			width:100%;	
			margin:0 0 15px;
		}
			#mainright .gallery ul {
				list-style:none;
				
			}
				#mainright .gallery li {
					position:relative;
					float:left;
					width:246px;
					margin:2px 0 0;
					padding:0 7px 10px;
				}
					* html #mainright .gallery li {
						padding:0 6px 10px 6px;
					}
					#mainright .gallery li a {
						position:relative;
						display:block;
						width:100%;
						height:108px;
						border:1px solid #EBD9D8;
						background:#fff url(i/gallery_placeholder.png) no-repeat 0 0;
						font-size:0.75em;
						text-decoration:none;
						color:#fff;
						-moz-border-radius:2px;
						-webkit-border-radius:2px;
					}
						#mainright .gallery img {
							display:block;
							float:left;
							-moz-border-radius:5px;
						}
						#mainright .audio li a:hover {
							border-color:#5E8C6A;
							-moz-box-shadow:1px 1px 5px #5E8C6A;
							-webkit-box-shadow:1px 1px 5px #5E8C6A;
							box-shadow:1px 1px 5px #5E8C6A;
						}
							#mainright .audio li a:active {
								border-color:#8EAF96;
							}
						
						#mainright .video li a:hover {
							border-color:#86A45C;
							-moz-box-shadow:1px 1px 5px #86A45C;
							-webkit-box-shadow:1px 1px 5px #86A45C;
							box-shadow:1px 1px 5px #86A45C;
						}
							#mainright .video li a:active {
								border-color:#A7BF83;
							}
						#mainright .web li a:hover {
							border-color:#B1A549;
							-moz-box-shadow:1px 1px 5px #B1A549;
							-webkit-box-shadow:1px 1px 5px #B1A549;
							box-shadow:1px 1px 5px #B1A549;
						}
							#mainright  .web li a:active {
								border-color:#CFC574;
							}
						#mainright .gallery li a span {
							position:absolute;
							top:0;
							right:3px;
							font-size:1.00em;
							z-index:5;
							text-shadow:1px 1px 1px #555;
						}
						
		/* Contact Form
		--------------------*/				
		#contact_form {
			display:block;
			width:100%;
		}
			#contact_form legend {
				display:none;
			}
			#contact_form div {
				margin:0 0 9px;
			}
				#contact_form label {
					display:block;
				}
				form#contactform input {
					clear:both;
					margin:0 0 1px;
				}	
				form#contactform textarea {
					padding:6px;
					border-width:1px;
					border-style:solid;
					border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;	
				}
				#contact_form input.submit_buttom {
					padding:3px 5px;
				}
				
			/* Contact Form Classes
			--------------------*/
			.text_input_short, .text_input_long {
				clear:both;
				border-width:1px;
				border-style:solid;
				border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
				padding:5px;
				color:#333;
			}
				.text_input_short {
					width:250px;
				}
				.text_input_long {
					width:465px;
				}
			#contact_form label.error {
				
				margin:0 0 0 1px;
				padding:2px 5px 2px 18px;
				width:160px;
				border:1px solid #D8000C;
				background:#FFBABA url(i/error_back.png) no-repeat left center;
				color:#D8000C;
				font-size:.5em;
				overflow:hidden;
			}
			#contact_form input.error {
				border-color:#BF928F #E3CAC8 #E3CAC8 #BF928F;	
				background-color:#FFEFEF;
			}
			#contact_form .success{
				padding:4px 5px 3px;
			}
				#contact_form .success strong {
					font-size:1.25em;
				}
			



/* Footer
--------------------*/
#footer {
	clear:both;
	float:left;
	width:100%;
	margin:10px 0 50px;
}
	#footnav {
		float:right;
		width:415px;
	}
		#footnav ul {
			float:right;
			padding:0 10px 0;
			list-style:none; 	
		}
		#footnav li {
			float:left;
			padding:0 0 0 20px;
		}
			#footnav li a {
				display:block;
				float:left;
				border-bottom-width:1px;
				border-bottom-style:dotted;
				text-decoration:none;
				font-size:0.69em;
			}
				#footnav li a:hover {
					border-bottom-color:#fff;
				}
			#footnav .resume  {color:#8d241c;border-color:#e2aaa7;}
			#footnav .audio   {color:#5c8968;border-color:#a7e2b6;}
			#footnav .video   {color:#84a25a;border-color:#cbe2a7;}
			#footnav .web     {color:#bdb157;border-color:#e2daa7;}
			#footnav .contact {color:#a64d46;border-color:#da9591;}
	#footnav #back_to_top {
		padding:0 50px 0 16px;
		background:url(i/arrow_up.gif) no-repeat center left;
		color:#A2A2A2;
		border-color:#fff;
	}
	#validation {
		float:left;
		padding:0 0 0 20px;
		font-size:0.69em;
		color:#b7adac;
	}
		#validation a {
			margin:0 5px 0;
			padding:0 0 0 20px;
			background:url(i/valid.png) no-repeat 0 0;
			color:#b7adac;
		}
			#validation a:hover {
				text-decoration:none;
			}
			
	#copyright {
		float:left;
		padding:0 0 0 10px;
		font-size:0.69em;
		color:#b7adac;
	}
	

/* Misc. Classes 
--------------------*/

/* Modal Windows              
--------------------*/
.jqmWindow {
    display: none;
    
    position: fixed;
    top: 17%;
    left: 50%;
    
    margin-left: -300px;
    width: 600px;
    
    background-color: #EEE;
    color: #333;
    border: 1px solid black;
    padding: 12px;
}
.jqmOverlay {background-color:#000;}


/* Visibility Classes
--------------------*/
.hide {display:none;}
.show {display:block;}

/* Info Classes
--------------------*/
.info {
	border:1px solid #00529B;
	background-color:#BDE5F8;
	color:#00529B;
}
.success {
	border:1px solid #4F8A10;
	background-color:#DFF2BF;
	color:#4F8A10;
}
.warning {
	border:1px solid #9F6000;
	background-color:#DFF2BF;
	color:#9F6000;
}
.error {
	
}

/* Text Classes
--------------------*/
.center {text-align:center;}
.right  {text-align:right;}
.left   {text-align:left;}
.bold   {font-weight:bold;}
.italic {font-style:italic;}
.bold   {font-weight:bold;}