/* CSS Document */
html * {padding:0; margin:0;}
body {
	height:100%;
	padding:0 15px 15px 15px;
	margin:0; 
	font-family: verdana, arial, sans-serif; 
	font-size:10px;
	background: black repeat-x top center url(default/headerbg.gif);
	color:#FFFFFF;
	}
	h1 {font-size:1.6em;}
	h2 {font-size:1.5em;}
	h3 {font-size:1.4em;}
	h4 {font-size:1.3em;}
	h5 {font-size:1.2em;}
	h6 {font-size:1.1em;}
	a {
		font-weight: bold;
		color: rgb(80, 135, 165);
		text-decoration:none;
		}
	a:hover {
			color: rgb(80, 170, 225);
			text-decoration: none;
			}
	a img {
		border:0;
		}
	fieldset {
		display:block; 
		margin: 10px auto; 
		padding:5px; 
		padding-bottom:10px; 
		}
	fieldset.contact_page {
		width:40%;
		font-size:1.4em;
		display:block; 
		margin: 10px auto; 
		padding:5px; 
		padding-bottom:10px;
		}
	legend {
		padding: 0 5px; 
		font-weight:bold; 
		color:#666;
		}
	form, input, textarea {
		padding:0;
		margin:0; 
		border:0;
		}
	form .form_label, form input, form textarea {
		padding:2px;
		margin:5px; 
		}
	form input,
	form textarea {
		text-align:center; 
		color:#999;
		border:1px solid #999999;
		}
	form input.form_radio {
		border:0;
		}
	form .errors {
		width: 95%;
		margin:0 auto;
		text-align:center;
		font-weight:bold;
		border-color:red;
		color:#FFFFFF;
		background-color:red;
		}
	fieldset {
		padding: 5px;
		margin:auto;
		}
	legend {
		padding: 0 5px;
		font-size:1em;
		font-weight:bold;
		}
	ol, ul, li {
		list-style:none;
		}
	.clear {
		clear:both;
		}


#Wrapper {
	text-align:center;
	}
#Container {
	width:800px;
	text-align:center; 
	margin: 0 auto;
	background: transparent;
	}


#HeaderWrapper {
	text-align:center; 
	margin: 0 auto;
	}
	#Header {
		height:131px;
		text-align:center;
		position:relative;
		}
		#FlashNotice {
			font-size:1.2em;;
			font-weight: bold;
			text-align:center;
			float:left;
			position:absolute; 
			right:0; 
			top:155px;
			padding: 2px 4px;
			background:#FFF;
			color:#999;
			-moz-border-radius:5px;
			max-width: 400px;
			z-index:5000;
			}
		#FlashNotice span {
			width:99%;
			position:relative;
			top:0;
			left:0;
			}
		#FlashNotice span.success {
			color: rgb(20, 200, 20);
			}
		#FlashNotice span.failure {
			color: red;
			}
		#Logo {
			display:block;
			height:100px; 
			margin: 0 auto; 
			position:relative; 
			top:10px; 
			background: no-repeat top center url(default/logo.gif);
			}
		#TestDriveBadge {
			display:block;
			width:80px;
			height: 52px; 
			position:absolute; 
			top:78px;
			right: 110px; 
			background: no-repeat top center url(default/testdrive_badge.gif);
			}
		
	#NavMain {
		width: 790px;
		height:19px; 
		text-align:center; 
		position:relative;
		margin: 0 auto; 
		font-size:1.25em;
		overflow:hidden; 
		}
	#NavMain .navLink {
		height:19px; 
		float:left; 
		margin: 0 1px 0 1px;
		}
	#NavMain .navLink a {
		width: 96px; 
		height:19px; 
		display:block; 
		color:rgb(6, 63, 95);
		}
	#NavMain .navLink a:hover {
		color:white; 
		background: repeat-x top center url(default/navbutton.gif);
		text-decoration:none;
		}
	
	#LoginBox {
		width: 470px;
		height:21px; 
		position:absolute; 
		left:0; 
		bottom:-41px;
		-moz-border-radius: 0 0 10px 0;
		}
	#ClientLogin {
		width:105px; 
		height:20px;
		float:left;
		position:relative; 
		background:url(default/clientlogin.gif) no-repeat left top;
		cursor: pointer;
		}
	#ClientLoginForm {
		padding-right: 10px;
		height:20px;
		}
	#ClientLoginForm input {
		width:95%;
		margin:0;
		padding:0;
		}
	#ClientLoginForm input, #ClientLogin form .formbutton {
		height:16px;
		}
	#ClientLoginForm .formbutton {
		height:20px; 
		font-size:1.1em;
		}
	.formbutton {
		color:#FFF; 
		background-color:rgb(52, 87, 108);
		}
	.formbutton:hover {
		font-weight: bold;
		}

#ContentWrapper {
	position:relative; 
	top: 25px;
	}


.panel {
	width: 100%;
	background: white;
	color:black;
	border: 1px white solid;
	margin-top: 15px;	
	margin-bottom: 15px;
	position: relative;
	overflow: hidden;
	 -moz-border-radius: 8px 8px 0 0;
	}
	.panel.sidenav {
		width:28%;
		}
	.panel.sidenav ul {
		font-size:1.1em;
		text-align:center;
		padding:5px;
		margin:0;
		background:white;
		color:#000000;
		}
	.panel.sidecontent {
		width:70%;
		}
	.panel .title {
		font-size: 1.8em;
		font-weight: bold;
		text-align: center;
		padding: 3px 0 3px 0;
		border-bottom: 1px rgb(65, 100, 115) solid;
		background: rgb(55, 90, 115);
		color: #FFFFFF;
		 -moz-border-radius: 8px 8px 0 0;
		}
		.panel .title a {
			color: #FFF;
			}
		.panel .title a:hover {
			color: rgb(145, 180, 200);
			text-decoration: none;
			}
		.panel .title .create,
		.panel .title .controls {
			font-size: .75em;
			margin: 5px 5px 3px 5px;
			}
		.panel .title .create {
			width: 7em;
			float: right;
			position: absolute;
			top: -4px;
			left: 0;
			background: rgb(20, 200, 20);
			-moz-border-radius: 0 0 10px 10px;
			border: 1px white solid;
			border-top:0;
			}
		.panel .title .create a:hover {
			color: darkgreen;
			}
		.panel .title .controls {
			width: 2em;
			position: absolute;
			top: 0;
			right: 0;
			}
		.panel .title .controls a {
			display:block;
			}
	.panel_content {
		border-top: 1px black solid;
		border-bottom: 1px black solid;
		overflow: hidden;
		}
		.panel .data_wrapper .title_row {
			font-size: 1.2em;
			padding: 3px;
			height: 1.2em;
			border-top: 2px black solid;
			background: #555;
			color: #FFFFFF;
			clear: both;
			}
		.panel .data_wrapper .data_row {
			font-size: 1.1em;
			height: 1.5em;
			padding: 3px;
			border-bottom: 1px #CCC solid;
			background: #fff;
			color: black;
			clear: both;
			overflow:hidden;
			}
		.panel .data_wrapper .pagination {
			font-size: 1em;
			height: 1.2em;
			padding: 1px;
			color: #444;
			}
			.panel .data_wrapper .title_row div,
			.panel .data_wrapper .data_row div {
				width: 20%;
				float: left;
				overflow:hidden;
				}
			.panel .data_wrapper .title_row .name,
			.panel .data_wrapper .data_row .name {
				font-size: 1em;
				width: 8%;
				}
			.panel .data_wrapper .title_row .username,
			.panel .data_wrapper .data_row .username {
				font-size: 1em;
				width: 30%;
				}
			.panel .data_wrapper .title_row .email,
			.panel .data_wrapper .data_row .email {
				font-size: .9em;
				width: 7%;
				}
			.panel .data_wrapper .title_row .actions,
			.panel .data_wrapper .data_row .actions {
				font-size: .9em;
				width: 15%;
				float:right;
				}
			.panel .data_wrapper .title_row .clear,
			.panel .data_wrapper .data_row .clear {
				width:0;
				height:0;
				}
	.panel .footer {
		font-size: 1.1em;
		height:100%;
		clear:both;
		position:relative;
		bottom:0;
		padding: 3px 0 3px 0;
		background: #222;
		color: #CCCCCC;
		border-top: 3px rgb(65, 100, 115) solid;
		}

.mp3player_wrapper {
	padding:5px; 
	clear:both;
	}
.mp3player_wrapper .mp3player_title {
	width:30%; 
	padding:0 5px; 
	float:left; 
	position:relative; 
	text-align:right;
	}
.mp3player_wrapper .mp3player {
	width:310px; 
	height:15px; 
	text-align:center; 
	background: white;
	}
.commercial_player .mp3player_wrapper {
	position:relative; top:-25px;
	}
.commercial_player .mp3player_wrapper .mp3player_title {
	display:none;
	}



.download {
	font-size:.9em;
	}

#Footer {
	width:100%;
	height: 1.5em; 
	color: white; 
	text-align:center;
	font-weight: bold; 
	margin-top: 45px;
	padding:2px 0;
	background-color: rgb(55, 90, 115);
	border: 3px rgb(45, 75, 95) solid;
	border-top: 1px rgb(145, 180, 200) solid;
	-moz-border-radius: 0 0 10px 10px;
	}


.box_header {
	background:#222; 
	color:#FFFFFF; 
	padding:5px; 
	margin-top:10px; 
	-moz-border-radius:10px 10px 0 0;
	border: 1px solid;
	}
.box_outline {
	padding:10px; 
	margin: 0 auto 10px auto; 
	border:1px solid #DDD;
	border-top:0;
	background:#FFFFFF;
	color:#000000;
	}


.avatar_sean,
.avatar_drew {
	width: 250px;
	height: 300px;
	padding-top: 10px;
	margin:auto;
	}
.avatar_sean {
	background: no-repeat center center url(default/sean_ace.jpg);
	}
.avatar_drew {
	background: no-repeat center center url(default/drew_king.jpg);
	}
.avatar_sean_small,
.avatar_drew_small {
	width:200px;
	height:237px;
	padding-top: 10px;
	margin:auto;
	}
.avatar_sean_small {
	background: no-repeat center center url(default/avatar_small_sean.jpg);
	}
.avatar_drew_small {
	background: no-repeat center center url(default/avatar_small_drew.jpg);
	}


/* Page Specific Styles */

	/* Administration - Needs to be in seperate file */
	#AdminListPage .title_row div,
	#AdminListPage .data_row div  {
		width: 35%;
		}
	#AdminListPage .title_row  .id,
	#AdminListPage .data_row  .id,
	#AdminListPage .title_row .actions,
	#AdminListPage .data_row .actions  {
		width: 15%;
		}
	#AdminListPage .title_row .clear,
	#AdminListPage .data_row .clear  {
		width: 0;
		height:0;
		}
	#AdminNav {
		width: 400px;
		height:21px; 
		position:absolute; 
		left:0; 
		bottom:-46px;
		text-align:left;
	}
	#AdminNav a {
		background:rgb(90, 145, 175);
		color:#000;
		padding:3px;
		-moz-border-radius: 0 0 5px 5px;
	}
	#AdminNav a:hover {
		background:rgb(100, 145, 170);
		color:#FFF;
	}
	
	#ClientListPage .title_row div,
	#ClientListPage .data_row div  {
		width: 16.2%;
		}
	#ClientListPage div div.id  {
		width: 5%;
		}
	#ClientListPage div div.email,
	#ClientListPage div div.website  {
		width: 7%;
		}
	#ClientListPage div div.address  {
		}
	#ClientListPage .data_row  {
		}
	
	/* Home */
	#About {
		height: 175px;
		background: bottom center no-repeat url(default/about.gif);
		}
	#TheDeal {
		height: 365px;
		background: bottom center no-repeat url(default/the_deal.jpg);
		}
	#FreeStuff {
		position:relative;
		height: 175px;
		background: center center no-repeat url(default/freestuff.jpg);
		}
	#FreeStuffContent {
		width: 560px;
		height: 110px;
		position:relative;
		left:60px;
		top: 40px;
		margin: auto;
		font-family:Arial, Helvetica, sans-serif;
		font-size: 2em;
		font-weight:bold;
		color:rgb(10, 130, 20);
		text-align:justify;
		}
	#ForClients {
		width:445px;
		height:325px;
		position:relative;
		float:left;
		background: no-repeat center center url(default/clients.jpg);
		}
	#ForClientsContent {
		width:370px;
		position:absolute;
		top:155px;
		left:35px;
		font-size:1.2em;
		font-weight:bold;
		text-align:justify;
		word-spacing:.25em;
		line-height:1.25em;
		}
	#VisitFriends {
		width:350px;
		height:325px;
		position:relative;
		float:right;
		background: no-repeat top right url(default/visit_friends.jpg);
		}
	#VisitFriendsContent {
		width:260px;
		position:absolute;
		left:65px;
		top:100px;
		font-size:1.4em;
		font-weight:bold;
		}
	
	/* Voices */
	.bio_wrapper {
		padding-top:10px 0;
		}
	.bio_wrapper .bio {
		width:350px;
		font-size:1.5em;
		float: right;
		text-align:justify;
		padding:5px;
		color:#444;
		}
	.bio_wrapper .avatar_sean,
	.bio_wrapper .avatar_drew {
		width: 250px;
		height: 300px;
		padding:0;
		float: left;
		}

	/* Serices */
	#OurServices .cardback_red,
	#OurServices .cardback_blue {
		width:25%; height:160px; float:left; 
		}
	#OurServices .cardback_red {
		background: url(default/cardback_red.gif) center center no-repeat;
		}
	#OurServices .cardback_blue {
		background: url(default/cardback_blue.gif) center center no-repeat;
		}
	#ServicesNav ul,
	#ServicesNav ul li,
	#ServicesNav .panel_content {
		margin:0;
		padding:0;
		}
	#ServicesNav ul li {
		height:20px;
		}
	#ServicesNav li a {
		display:block;
		width:100%;
		padding:3px;
		}
	#ServicesNav li a:hover {
		background: rgb(75, 120, 150);
		color:#FFFFFF;
		}

	.portfolio_links a {
		clear:both;
		display:block;
		font-size:1.4em;
		padding:10px;
		}
	.portfolio_links a:hover {
		border:1px solid #DDD;
		}

/* Rate Quote */
	#Packages .packages_wrapper {
		margin:15px auto;
		}
	#Packages .package {
		width:25%; 
		float:left;
		}
	#Packages .package .package_icon {
		height:163px;
		}
	#Packages .package #RoyalFlushIcon {
		background: top center no-repeat url(default/rf_club.gif);
		}
	#Packages .package #FullHouseIcon {
		background: top center no-repeat url(default/fullhouse.gif);
		}
	#Packages .package #AceIcon {
		background: top center no-repeat url(default/ace.gif);
		}
	#Packages .package #JokerIcon {
		background: top center no-repeat url(default/joker.gif);
		}
	#Packages .package h1 {
		margin-top:-20px;
		text-align:center;
		}
	#Packages .package .package_desc {
		padding:-10px;
		}
		
		/* Rate Quote & Test Drive Forms */
		
		.freeroll_banner {
			width: 600px;
			height: 125px;
			padding-top:0px;
			margin:0 auto;
			background: no-repeat center center url(default/freeroll_banner.jpg);
			}
		
		#RateQuoteForm, 
		#FreeRollForm {
			width:600px; margin:auto; font-size:1.5em;}
		#RateQuoteForm label, 
		#FreeRollForm label {
			display:block; text-align:right; font-weight:bold; clear:both;}
		#RateQuoteForm label span, 
		#FreeRollForm label span {
			width:15%; text-align:right; font-weight:bold; float:left; padding:5px 0;}
		#RateQuoteForm label input, 
		#FreeRollForm label input {
			width:80%; text-align:center; padding:5px 0; position:relative; right:0; float:right;}
		#RateQuoteForm div.category   {
			margin:auto;}
		#RateQuoteForm div.category label, 
		#FreeRollForm div.category label {
			width:auto; height:auto; padding:5px 10px; float:left; clear:none;}
		#RateQuoteForm div.category label span,
		#FreeRollForm div.category label span {
			width:auto; height:auto; font-size:.75em; position:relative; top:-10px; text-align:right; font-weight:bold; padding:0; float:none;}
		#RateQuoteForm div.category label input,
		#FreeRollForm div.category label input {
			width:auto; height:auto; height:1.5em; text-align:left; padding:20px 0; float:none;}
		#RateQuoteForm textarea,
		#FreeRollForm textarea {width:95%; text-align:left;}
		#RateQuoteForm div.package_radio label {width:auto; display:inline; float:none; padding-right:10px;}
		#RateQuoteForm div.package_radio label input{width:auto; display:inline; float:none; padding-left:10px;}
		

.left {
	float:left;
	}
.right {
	float:right;
	}
.half {
	width: 50%;
	margin:auto;
	}
.twothirds {
	width: 65%;
	margin:auto;
	}

