/******************************************************************
Dave Benson Phillips CSS
******************************************************************/

*{
	border:none;
	margin:0;
	padding:0;
	text-align:left;
	}
html, body{
	width:100%;
	text-align:center;
	}	
body{
	background:#f00;
	color:#000;
	font:62.5% 'Comic Sans MS', 'Comic Sans', 'ComicSans MS', 'ComicSans', Verdana, Arial, Tahoma, sans-serif;
	}
a, a:visited{
	color:#f00;
	text-decoration:none;
	}
	a:hover, a:active{
		color:#000;
		}
h1{
	font-size:2.5em;
	text-transform:uppercase;
	}
h2{
	font-size:1.9em;
	font-weight:normal;
	margin:0 0 1em;
	}
h2.lyrics{
	width:100%;
	text-align:center;
	font-size:1.9em;
	font-weight:normal;
	margin:20px 0 0 0;
	}
h3{
	font-size:1.3em;
	}
p{
	font-size:1.3em;
	}
p, h1, h2, h3, h4, h5, h6, blockquote, small{
	margin-bottom:1em;
	}
small{
	text-transform:uppercase;
	}
	
/* Clear Fix For IE
******************************************************************/
.clearfix:after{
    content:"."; 
    display:block; 
    height:0; 
    clear:both; 
    visibility:hidden;
}
.clearfix{
	display:inline-table;
}
/* Hides from IE-mac \*/
* html .clearfix {height:1%;}
.clearfix {display:block;}
/* End hide from IE-mac */
	

/* 
******************************************************************/

#container{
	background:#ff0 url("../graphics/bg.gif") repeat-y center top;
	color:#000;
	margin:1.5em auto 4em;
	width:757px;
	}
	#freestuff #container{
		margin-top:0;
		}
#header{
	background:url("../graphics/bg-header-top.gif") no-repeat left top;
	height:87px;
	overflow:hidden;
	width:757px;
	}
		#freestuff #header{
			background:#f00 url("../graphics/bg-header-top.gif") no-repeat left 15px;
			height:102px;
			}
	#header h1{
		display:block;
		margin:20px auto 0;
		height:0;
		overflow:hidden;
		padding-top:57px;
		}
	#home #header h1{
		background:url("../graphics/header-davebensonphillips.gif") no-repeat left top;
		width:444px;
		}
	#dnn #header h1{
		background:url("../graphics/header-dnn.gif") no-repeat left top;
		width:466px;
		}
	#haveyou #header h1{
		background:url("../graphics/header-haveyoumetdave.gif") no-repeat left top;
		width:467px;
		padding-top:75px;
		margin-top:5px;
		}
	#faqs #header h1{
		background:url("../graphics/header-faqs.gif") no-repeat left top;
		width:478px;
		padding-top:75px;
		margin-top:5px;
		}
	#twentyfivethings #header h1{
		background:url("../graphics/header-25things.gif") no-repeat left top;
		width:435px;
		padding-top:75px;
		margin-top:5px;
		}
	#important #header h1{
		background:url("../graphics/header-tour.gif") no-repeat left top;
		width:453px;
		padding-top:75px;
		margin-top:5px;
		}
	#bear #header h1{
		background:url("../graphics/cuddly-big-bear.gif") no-repeat left top;
		width:453px;
		padding-top:75px;
		margin-top:5px;
		}
	#presenter #header h1{
		background:url("../graphics/header-presenter.gif") no-repeat left top;
		width:332px;
		padding-top:74px;
		margin-top:5px;
		}
	#favelinks #header h1{
		background:url("../graphics/header-favelinks.gif") no-repeat left top;
		width:464px;
		padding-top:44px;
		margin-top:20px;
		}
	#sponsors #header h1{
		background:url("../graphics/header-sponsors.gif") no-repeat left top;
		width:424px;
		padding-top:55px;
		margin-top:20px;
		}
	#freestuff #header h1{
		background:url("../graphics/header-freestuff.gif") no-repeat left top;
		width:409px;
		padding-top:99px;
		margin-top:3px;
		}
	#detector #header h1{
		background:url("../graphics/header-davebensonphillips.gif") no-repeat left top;
		width:444px;
		}
	#tech #header h1{
		background:url("../graphics/header-tech.gif") no-repeat left top;
		width:452px;
		padding-top:59px;
		}
	#jobs #header h1{
		background:url("../graphics/header-jobs.gif") no-repeat left top;
		width:302px;
		padding-top:43px;
		}
#subheader{
	background:url("../graphics/bg-header-bot.gif") no-repeat left top;
	clear:left;
	padding:25px 1px 1px 25px;
	}
	#dnn #subheader{
		padding:40px 50px 0;
		}
		#dnn #subheader p{
			margin-bottom:2em;
			}
	#haveyou #subheader,
	#faqs #subheader,
	#twentyfivethings #subheader,
	#presenter #subheader,
	#favelinks #subheader,
	#sponsors #subheader,
	#freestuff #subheader,
	#detector #subheader,
	#tech #subheader,
	#jobs #subheader#{
		padding:20px 50px;
		}
	 #subheader.headerlyrics{
		padding:40px 0 0 0;
		}
		
#dnn #subheader div{
	background:#fc0;
	padding:5px;
	margin:-1.5em 2px 1.5em;
	width:200px;
	float:left;
	}
#dnn #subheader div.bigger{
	width:305px;
	margin-right:4px;
	}
#dnn p{
	clear:left;
	}
		
#important p{
	margin:1em 2em;
	}
#important #subheader h1{
	text-align:center;
	margin:.3em 0 0;
	}
	
#important #subheader img{
	float:right;
	margin:1.5em 1.5em 0 0;
	}

#bear p{
	margin:1em 2em;
	}
#bear #subheader h1{
	text-align:center;
	margin:.3em 0 0;
	}
	
#bear #subheader img{
	float:right;
	margin:1.5em 1.5em 0 0;
	}

#haveyou img{
	background:#fc0;
	padding:5px;
	}
	
#freestuff img{
	background:#fc0;
	border:1px dashed #000;
	padding:5px;
	margin:3px;
	}
	#freestuff a:hover img{
		background:#f00;
		border:1px dashed #ff0;
		}
	
#haveyou p{
	font-size:1.2em;
	}
	
#haveyou div.left, #haveyou div.right{
	clear:both;
	margin-bottom:3em;
	}

#haveyou h3{
	margin:0;
	}
	
#haveyou .left img{
	float:left;
	margin:0 1em 1em 0;
	}

#haveyou .right img{
	float:right;
	margin:0 0 1em 1em;
	}
	
#tech img{
	background:#fc0;
	padding:6px;
	margin:15px;
	}
	#tech a:hover img{
		background:#f00;
		}
	
dl{
	font-size:1.2em;
	}
	dt{
		font-size:1.1em;
		font-weight:bold;
		}
		dd{
			margin-bottom:2em;
			}
	
ol{
	font-size:1.4em;
	padding-left:2em;
	}
	ol li{
		background:#fc0;
		border:1px dashed #000;
		margin:1em;
		padding:1em;
		}
	
address{
	background:#fc0;
	border:1px dashed #000;
	clear:left;
	margin:1em 7em;
	font-size:1.5em;
	font-style:normal;
	padding:1em;
	}
	

#footer{
	background:url("../graphics/bg-footer.gif") no-repeat left top;
	clear:left;
	height:81px;
	position:relative;
	width:757px;
	}
	#detector #footer{
		margin-top:-30px;
		}

ul{
	margin:0 0 15px  30px;
	}
li{
	font-size:1.3em;
	padding:4px;
	}
	
#nav{
	list-style:none;
	margin:20px 50px 0;
	}
	#tech #nav{
		margin:0;
		}
	#nav li{
		clear:left;
		padding:1px;
		font-size:2em;
		}
		#nav li a{
			background-repeat:no-repeat;
			background-position:40px center;
			color:#000;
			display:block;
			padding:1em 2em 1em 95px;
			}
			#tech #nav li a{
				background:url("../graphics/icon-splat.gif") no-repeat left center;
				padding:.2em 0 .2em 30px;
				}
				#tech #nav li a:hover{
					background:url("../graphics/icon-splat-over.gif") no-repeat left center;
					}
			#nav li a:hover{
				color:#f00;
				}
			#nav li a small{
				clear:left;
				display:block;
				font-size:.6em;
				text-transform:lowercase;
				}
				a.faceright{
					background-image:url("../graphics/faceright.gif");
					}
				a.facesmile{
					background-image:url("../graphics/facesmile.gif");
					}
				a.faceup{
					background-image:url("../graphics/faceup.gif");
					}
				a.faceupright{
					background-image:url("../graphics/faceupright.gif");
					}
				a.facedownright{
					background-image:url("../graphics/facedownright.gif");
					}
				a.faceshock{
					background-image:url("../graphics/faceshock.gif");
					}
	
	
#footer ul{
	display:block;
	left:80px;
	list-style-type:none;
	position:absolute;
	top:44px;
	width:600px;
	margin:0;
	}
	#footer li{
		display:block;
		float:left;
		padding:0;
		}
		#footer li a{
			display:block;
			height:65px;
			text-indent:-100em;
			overflow:hidden;
			margin:0 40px;
			width:108px;
			}
		#dnn #footer li a{
			margin:0 6px;
			}
		#important #footer li a,
		#bear #footer li a,
		#sponsors #footer li a,
		#tech #footer.fourlinks li a{
			margin:0 20px;
			}
		#haveyou #footer li a,
		#faqs #footer li a,
		#detector #footer li a,
		#twentyfivethings #footer li a{
			margin:0 90px;
			}
			#footer li.contact a{
				background:url("../graphics/button-contact.gif") no-repeat;
				}
			#footer li.free a{
				background:url("../graphics/button-free.gif") no-repeat;
				}
			#footer li.back a{
				background:url("../graphics/button-back.gif") no-repeat;
				}
			#footer li.email a{
				background:url("../graphics/button-email.gif") no-repeat;
				}
			#footer li.print a{
				background:url("../graphics/button-print.gif") no-repeat;
				}
			#footer li.save a{
				background:url("../graphics/button-save.gif") no-repeat;
				}
			#footer li.join a{
				background:url("../graphics/button-join.gif") no-repeat;
				}
			#footer li.main a{
				background:url("../graphics/button-main.gif") no-repeat;
				}
			#footer li.view a{
				background:url("../graphics/button-view.gif") no-repeat;
				}
			#footer li.logout a{
				background:url("../graphics/button-logout.gif") no-repeat;
				}
			#footer li.mystery a{
				background:url("../graphics/button-mystery.gif") no-repeat;
				}
			#footer li.lyrics a{
				background:url(../graphics/button-lyrics.gif) no-repeat;
				}
			#footer li.top a{
				background:url(../graphics/button-top.gif) no-repeat;
				}		

table{
	border-top:10px solid #fc0;
	border-bottom:10px solid #fc0;
	font-size:1.1em;
	margin:0 auto;
	width:736px;
	}
	th{
		font-weight:bold;
		padding:3px;
		}
	td{
		padding:3px 0;
		}
	tr.alt td{
		background:#fc0;
		}
	tr.soldout td{
		color:#f0;
		text-decoration:line-through;
		}

#tech img.bodyimg{
	float:right;
	padding:0;
	}

#popup{
	background:#ff0;
	height:600px;
	padding:15px 20px;
	}
	#popup form{
		position:relative;
		}
		#popup input{
			border:1px solid #fc0;
			display:block;
			margin-bottom:10px;
			padding:2px;
			width:250px;
			}
			input#sendButton{
				border:none;
				padding:0;
				width:auto;
				}
			input#signUp{
				position:absolute;
				top:95px;
				left:0;
				width:auto;
				padding:0;
				border:none;
				}
			#join input#sendButton{
				margin-top:40px;
				}
	#checklabel{
		position:absolute;
		left:21px;
		top:97px;
		}
	
				
#tech form{
	margin:0 150px;
	}
	#tech label{
		font-size:1.3em;
		line-height:3em;
		}
	#tech input{
		border:1px solid #fc0;
		display:block;
		margin-bottom:10px;
		padding:2px;
		width:95%;
		}
		input#submit{
			border:none;
			padding:0;
			width:auto;
			}
	
label.warning{
	color:#f00;
	}
	label.warning:after{
		content:" (required field)";
		}
		
#flashcontainer{
	position:absolute;
	top:50%;
	left:0;
	width:100%;
	margin-top:-275px;
	text-align:center;
	min-width:750px;
	}
#flashcontent{
	position:relative;
	width:750px;
	height:550px;
	margin:0px auto;
	}
	
/*Footer text*/
#copy {
	width:100%;
	text-align:center;
	color:#FFFFFF;
	float:left;
}
#copy a {
	text-decoration:none;
	color:#FFFFFF;
}
#copy a:hover {
	text-decoration:underline;
	color:#FFFFFF;
}
div.lyrics{
	width:450px;
	float:left;
	margin:40px 0;
}
div.lyrics p{
	width:100%;
	text-align:center;
}
div.lyrics a{
	margin:0 0 0 45px;
}
#printMe{
	width:80px;
	margin:40px 0 0 80px;
	float:left;

}

/*get up & go movie clips*/
#video{
	width:500px;
	height:500px;
	background:url(../graphics/video-back.gif) no-repeat;
	padding:40px 0 38px 0;
}
.video{
	padding:0 0 0 38px;	
}

/* Photo Gallery
***************************************************************/
ul.gallery{
list-style:none !important;
margin:0;
padding:0;
}
ul.gallery li{
float:left;
margin:0;
padding:2px;
}
ul.gallery a img{
background:#FFCC00 !important;
padding:5px !important;
}
ul.gallery a:hover img{
background:#000 !important;
padding:5px !important;
}	
	/* ------------------------------------------------------------------------
	This you can edit.
------------------------------------------------------------------------- */

	div.pictureHolder .top .left { background: url(../images/prettyPhoto/tl.gif) top left no-repeat; } /* Top left corner */
	div.pictureHolder .top .middle { background: #fff; } /* Top pattern/color */
	div.pictureHolder .top .right { background: url(../images/prettyPhoto/tr.gif) top left no-repeat; } /* Top right corner */
	
	div.pictureHolder .content { background-color: #fff; } /* Content background */
	div.pictureHolder .content a.next:hover { background: url(../images/prettyPhoto/btnNext.gif) center right no-repeat; cursor: pointer; } /* Next button */
	div.pictureHolder .content a.previous:hover { background: url(../images/prettyPhoto/btnPrevious.gif) center left no-repeat; cursor: pointer; } /* Previous button */
	div.pictureHolder .content a.expand { background: url(../images/prettyPhoto/btnExpand.gif) top left no-repeat; cursor: pointer; } /* Expand button */
	div.pictureHolder .content a.expand:hover { background: url(../images/prettyPhoto/btnExpand.gif) bottom left no-repeat; cursor: pointer; } /* Expand button hover */
	div.pictureHolder .content a.contract { background: url(../images/prettyPhoto/btnContract.gif) top left no-repeat; cursor: pointer; } /* Contract button */
	div.pictureHolder .content a.contract:hover { background: url(../images/prettyPhoto/btnContract.gif) bottom left no-repeat; cursor: pointer; } /* Contract button hover */
	div.pictureHolder .content a.close { width: 61px; height: 22px; background: url(../images/prettyPhoto/btnClose.gif) center left no-repeat; cursor: pointer; } /* Close button */

	div.pictureHolder .content .details .nav a.arrow_previous { background: url(../images/prettyPhoto/arrow_previous.gif) top left no-repeat; } /* The previous arrow in the bottom nav */
	div.pictureHolder .content .details .nav a.arrow_next { background: url(../images/prettyPhoto/arrow_next.gif) top left no-repeat; } /* The next arrow in the bottom nav */

	div.pictureHolder .bottom .left { background: url(../images/prettyPhoto/bl.gif) top left no-repeat; } /* Bottom left corner */
	div.pictureHolder .bottom .middle { background: #fff; } /* Bottom pattern/color */
	div.pictureHolder .bottom .right { background: url(../images/prettyPhoto/br.gif) top left no-repeat; } /* Bottom right corner */

	div.pictureHolder .loaderIcon { background: url(../images/prettyPhoto/loader.gif) center center no-repeat; } /* Loader icon */

	div.prettyPhotoTitle div.prettyPhotoTitleLeft { background: url(../images/prettyPhoto/ttl.gif) top left no-repeat; }
	div.prettyPhotoTitle div.prettyPhotoTitleRight { background: url(../images/prettyPhoto/ttr.gif) top left no-repeat; }
	div.prettyPhotoTitle div.prettyPhotoTitleContent { background: url(../images/prettyPhoto/ttp.gif) top left repeat-x; }

/* ------------------------------------------------------------------------
	DO NOT CHANGE
------------------------------------------------------------------------- */

	div.prettyPhotoOverlay {
		background: #000;
		position: absolute; top: 0; left: 0;
		z-index: 9500;
		width: 100%;
	}
	
	div.pictureHolder {
		position: absolute; z-index: 10000;
		width: 100px;
	}
		
		div.pictureHolder .top {
			position: relative;
			height: 20px;
		}
			* html div.pictureHolder .top { padding: 0 20px; }
		
			div.pictureHolder .top .left {
				position: absolute;
				left: 0;
				width: 20px; height: 20px;
			}
			div.pictureHolder .top .middle {
				position: absolute;
				left: 20px; right: 20px;
				height: 20px;
			}
				* html div.pictureHolder .top .middle { position: static; }
			
			div.pictureHolder .top .right {
				position: absolute;
				top: 0; left: auto; right: 0;
				width: 20px; height: 20px;
			}
		
		div.pictureHolder .content {
			position: relative;
			text-align: left;
			width: 100%; height: 40px;
		}
		
			div.pictureHolder .content .details {
				display: none;
				margin: 10px 15px 10px 20px;
			}
				div.pictureHolder .content .details p.description { display: none; float: left; margin: 0; }
				
				div.pictureHolder .content .details .nav {
					float: left;
					margin: 4px 0 0 0;
				}
				
					div.pictureHolder .content .details .nav p { float: left; margin: 0 4px; }
				
					div.pictureHolder .content .details .nav a.arrow_previous,
					div.pictureHolder .content .details .nav a.arrow_next {
						float: left;
						display: block;
						width: 8px; height: 9px;
						text-indent: -10000px;
						margin-top: 4px;
					}
					
					div.pictureHolder .content .details .nav a.disabled { background-position: 0 -10px; cursor: default; }
		
		div.pictureHolder .content div.hoverContainer {
			position: absolute; z-index: 10000;
			top: 0; left: 0;
			width: 100%;
		}
		
		div.pictureHolder .content a.next {
			position: relative; z-index: 2000;
			display: block; float: right;
			text-indent: -10000px;
			width: 49%; height: 100%;
			background: url(../images/prettyPhoto/btnNext.gif) 10000px 50% no-repeat; /* Need to be defined that way to fix an IE bug */
		}
			
		div.pictureHolder .content a.previous {
			cursor: pointer;
			display: block;
			text-indent: -10000px;
			width: 49%; height: 100%;
			background: url(../images/prettyPhoto/btnNext.gif) 10000px 50% no-repeat; /* Need to be defined that way to fix an IE bug */
			
		}
		
		div.pictureHolder .content a.expand,
		div.pictureHolder .content a.contract {
			position: absolute; z-index: 20000;
			top: 10px; right: 30px;
			cursor: pointer;
			display: none;
			text-indent: -10000px;
			width: 20px; height: 20px;	
		}
			
		div.pictureHolder .content a.close {
			float: right;
			display: block;
			text-indent: -10000px;
		}
		
		div.pictureHolder .bottom {
			position: relative;
			height: 20px;
		}
			* html div.pictureHolder .bottom { padding: 0 20px; }
			
			div.pictureHolder .bottom .left {
				position: absolute;
				left: 0;
				width: 20px; height: 20px;
			}
			div.pictureHolder .bottom .middle {
				position: absolute;
				left: 20px; right: 20px;
				height: 20px;
			}
				* html div.pictureHolder .bottom .middle { position: static; }
				
			div.pictureHolder .bottom .right {
				position: absolute;
				top: 0; left: auto; right: 0;
				width: 20px; height: 20px;
			}
		
		div.pictureHolder .loaderIcon {
			display: none;
			position: absolute;
			top: 50%; left: 50%;
			margin: -12px 0 0 -12px;
			width: 24px; height: 24px;
		}
		
		div.pictureHolder #fullResImageContainer { width: 100%; text-align: center; }
	
		div.prettyPhotoTitle {
			display: none;
			position: absolute;
			top: 0; left: 0;
			z-index: 9999;
			color: #fff; font-size: 13px;
		}
		
			div.prettyPhotoTitle div.prettyPhotoTitleLeft,
			div.prettyPhotoTitle div.prettyPhotoTitleRight { float: left; width: 19px; height: 23px; overflow: hidden; }
			
			div.prettyPhotoTitle div.prettyPhotoTitleContent { float: left; line-height: 23px; }