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

	Title: Hull Digital Question Time

	Author: Branded07
	
	Author url: http://www.branded07.com

	Date: 2010 
	
	Version: 1.0

***********************************************************************************************
==============================================================================================*/

/* Global Reset ------------------------------------------------------------------------------*/

* {
margin: 			0;
padding: 			0;
border: 			0;
outline: 			0;
font-weight: 		inherit;
font-style: 		inherit;
font-size: 			100%;
font-family: 		inherit;
vertical-align: 	baseline;
}
body {
line-height: 		1;
min-width:			1000px;
background:			#313a47 url('../images/BG-main.jpg');
font-family:		Georgia, "Times New Roman", Times, serif;
color:				#fff;
letter-spacing:		0;
}
:focus {
outline: 			0;
}
ol, ul {
list-style: 		none;
}
table {
border-collapse: 	separate;
border-spacing: 	0;
}
caption, th, td {
text-align: 		left;
font-weight: 		normal;
}
blockquote:before, blockquote:after {
content: 			"";
}
p{
font-size:			14px;
line-height:		16px;
padding:			6px 0 3px 0;
text-align:			left;
}
address{
font-size:			14px;	
line-height:		16px;
padding:			6px 0 3px 0;
}
hr {
display: 			none;
}
b, strong{
font-weight:		bold;
}
a, a:visited{
text-decoration:	none;
color:				#00a5e3;
text-shadow:		0 0 5px #323b47;
}
a:hover{		
border:				none;
text-decoration:	none;
color:				#fff;
}
.none{
border:				none !important;
background:			none !important;
}
.no-margin{
margin:				0 !important;
}
.clear { 
clear:				both;
}
.clear:after {
content: 			".";
display: 			block;
height: 			0;
clear: 				both;
visibility: 		hidden;
}
.clear {
display: 			inline-block;
}

/* Will not validate in CSS 2.1 */

.round-sml{
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 		3px;
}
.round-med{
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
-khtml-border-radius: 8px;
border-radius: 		8px;
}
.round-lrg {
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
-khtml-border-radius: 12px;
border-radius: 		12px;
}

/* Headers -------------------------------------------------------------------------------------*/

h1{
display:			block;
width:				129px;
height:				135px;
padding:			14px 0 0 10px;
text-indent:		-999em;
background:			transparent url('../images/LOGO-main.png');
overflow:			hidden;
}
h1 strong{
font-weight:		bold;
}
h2{
position:			absolute;
font-size:			42px;
line-height:		38px;
letter-spacing:		-2px;
color:				#69707b;
}
h2 strong{
display:			block;
font-size:			72px;
margin-top:			-5px;
letter-spacing:		-3px;
color:				#222a35;
text-transform:		uppercase;
}
h3{
font-size:			26px;
letter-spacing:		-1px;
color:				#69707b;	
}

/* Global Structure ----------------------------------------------------------------------------*/

#header-wrap,#panel-wrap,#concept-wrap,#detail-wrap,#question-wrap,#footer-wrap,#thanks-wrap{
width:				100%;
height:				auto;
}
#header,#panel,#concept,#detail,#question,#footer,#thanks{
margin:				0 auto;
width:				960px;
display:			block;
height:				1000px;
position:			relative;
}
.left{
float:				left;
margin:				0 20px 0 0;
}
.right{
float:				right;
margin:				0 0 0 20px;
}
.center {
text-align:			center;
}

/* Images --------------------------------------------------------------------------------------*/

.alignleft{
float:				left;
margin:				5px 15px 5px 0;
}
.alignright{
float:				right;
margin:				5px 0 5px 15px;
}
.aligncenter{
float:				none;
text-align:			center;
}

/* Lists ---------------------------------------------------------------------------------------*/


/* Forms ---------------------------------------------------------------------------------------*/


/* Navigation ----------------------------------------------------------------------------------*/

#global-nav{
position:			fixed;
z-index:			100000;
top:				40px;
margin-left:		330px;
}
#global-nav li{
float:				left;	
}
#global-nav a{
color:				#fff;
font-size:			20px;
line-height:		20px;
float:				left;
padding:			7px 13px 6px 12px;
letter-spacing:		-1px;
background:			none;
}
#global-nav li a:hover{
color:				#00a5e3;	
}
#global-nav li.active a{
background:			url('../images/BG-nav-semi.png') repeat top left;	
}

/* Sections ------------------------------------------------------------------------------------*/

/*=== Intro and Header ===*/

#header-wrap{
background:			url('../images/BG-venue.jpg') no-repeat top center;	
}
#header-lead{
background:			url('../images/BG-header-wire.png') no-repeat bottom center;			
}
#header{
padding-top:		25px;
z-index:			10000;
}
#header p#intro{
font-size:			28px;
line-height:		32px;
letter-spacing:		-1px;
font-style:			italic;
display:			block;
width:				680px;
margin:				25px 0 0 0;
padding:			5px 10px;
float:				left;
border-right:		#5c5f64 1px dotted;
}
#header p#date{
float:				right;
margin:				25px 20px 0 0;
padding:			22px 18px 18px 18px;
border:				#5c5f64 1px solid;
color:				#fff;
width:				180px;
}
#header p#date em,#header p#date strong,#header p#date small{
display:			block;	
text-align:			center;
}
#header p#date em{
font-size:			29px;		
}
#header p#date strong{
font-size:			42px;
letter-spacing:		-1px;
color:				#fff;
line-height:		42px;
}
#header p#date small{
font-size:			19px;	
}

/*=== Panel ===*/

#panel-wrap{
background:			url('../images/BG-panel-wire.png') no-repeat bottom center;		
}
#panel{
height:				1180px;
}
#panel h2{
top:				135px;	
}
#panel-fader{
position: 			relative;
width: 				960px;
height:				310px;
padding:			0;
margin: 			110px auto 0 auto;
}
#panel-fader ul{
padding: 			0;
margin: 			0;
list-style:		 	none;
}
#panel-content{
display:			block;
padding-top:		180px;
}

/** hero content **/

#panel-fader .fader-content{
display:			block;
background: 		transparent url('../images/BG-blue-semi.png');
width:				960px;
height: 			310px;
overflow: 			hidden;
}
#panel-fader .fader-content li{
width:				890px;
height: 			230px;
padding:			40px 35px;
float: 				left;
}
* html #panel-fader .fader-content li{
margin-top:			1px;	
}
.fader-content p{
float:				left;
line-height:		18px;
width:				200px;
padding-right:		22px;
}

/** hero nav **/

#panel-fader .fader-nav{
position:			absolute;
right:				0;
top:				-175px;
}
#panel-fader .fader-nav li{
position:			relative;
float: 				left;
width:				135px;
height:				135px;
padding:			5px;
margin:				0 0 0 15px;
background: 		transparent url('../images/BG-blue-semi.png');
}
#panel-fader .fader-nav li.active{
background: 		transparent url('../images/BG-white-semi.png');	
}
#panel-fader .fader-nav li span{
position:			absolute;
display:			none;	
}
#panel-fader .fader-nav li.active span{
display:			block;
background: 		transparent url('../images/BG-panel-speach.png') no-repeat top center;
width:				28px;
height:				14px;
bottom:				-14px;
left:				58px;
}
#panel-fader .fader-nav li a, #panel-fader .fader-nav li a:visited, #panel-fader .fader-nav li span.hover{
position:			absolute;	
display: 			block;
width: 				135px;
height: 			135px;
border:				none;
text-indent:		-999em;
overflow:			hidden;
}
#panel-fader .fader-nav li span.hover{
background: 		transparent url('../images/BG-blue-semi.png');
top:				0;
}
#panel-fader .fader-nav li.active a, #panel-fader .fader-nav li.active span.hover{
background:			transparent;
}

/*=== Concept ===*/

#concept-wrap{
background:			url('../images/BG-concept-wire.png') no-repeat bottom center;		
}
#concept{
padding-top:		170px;
height:				870px;
}
#concept h2{
top:				40px;	
}
#concept-content{
display:			block;
background: 		transparent url('../images/BG-white-semi.png');
width:				960px;
height: 			415px;
overflow: 			hidden;	
}
#concept-text{
float:				left;
width:				580px;
padding:			40px 0 0 50px;
}
#concept-text p{
line-height:		17px;	
}
#concept-text em{
font-size:			34px;
letter-spacing:		-1px;
color:				#232a35;
font-style:			italic;
}
div#bulb{
width:				220px;
height:				310px;
float:				right;
margin:				0 60px 0 0;
background: 		transparent url('../images/BG-bulb-off.png');
}
div#bulb .light{
display:			block;
width:				220px;
height:				310px;
background: 		transparent url('../images/BG-bulb-on.png');	
}
#bulb a, #bulb a:visited{
display:			block;
font-size:			22px;
text-align:			center;
background:			#59616b;
color:				#fff;
letter-spacing:		-1px;
padding:			14px 18px;
}
#bulb a:hover{
background:			#00a5e3;	
}

/*=== Detail ===*/

#detail-wrap{
background:			url('../images/BG-detail-wire.png') no-repeat bottom center;			
}
#detail{
padding-top:		170px;
height:				870px;
}
#detail h2{
top:				40px;	
}
#detail-content{
display:			block;
background: 		transparent url('../images/BG-blue-semi.png');
width:				960px;
height: 			415px;
overflow: 			hidden;	
}
#detail-text{
float:				left;
width:				350px;
padding:			20px 0 0 40px;
}
#detail-text p, #detail-text address{
line-height:		18px;
padding-top:		0;
}
#detail-text h3{
padding:			12px 0 3px 0;
margin:				0;
line-height:		20px;
}
#detail-content img{
float:				right;
padding:			5px;
background: 		transparent url('../images/BG-white-semi.png');
margin:				20px 20px 0 0;
}

/*=== Question ===*/

#question-wrap{
background:			url('../images/BG-question-wire.png') no-repeat top center;				
}
#question{
padding-top:		170px;	
height:				870px;
}
#question h2{
top:				40px;	
}
#question-content{
display:			block;
background: 		transparent url('../images/BG-white-semi.png');
width:				960px;
height: 			415px;
overflow: 			hidden;		
}
#question-content p{
font-size:			20px;
color:				#242b36;
font-style:			italic;
line-height:		36px;
float:				left;
width:				445px;
padding:			40px 0 0 40px;
}
#question-content p small{
display:			block;
font-style:			normal;
font-weight:		bold;
font-size:			15px;
padding:			6px 0 0 0;
text-align:			center;
}
#question-content p#q{
width:				400px;	
}
#question-content p input{
background:			transparent url('../images/BG-input-back.png') repeat-x bottom left;
color:				#fff;
padding:			0 6px 6px 6px;
margin:				0 4px;
width:				132px;
font-family:		Georgia, "Times New Roman", Times, serif;
font-style:			italic;
}
#question-content p input.error{
background:			transparent url('../images/BG-input-error.png') repeat-x bottom left;
}
#question-content p input.first{
width:				102px;	
}
#question-content p input.last{
width:				163px;	
}
#question-content p input.email{
width:				403px;	
}
#question-content textarea{
color:				#fff;
background:			transparent url('../images/BG-input-back.png') repeat;	
width:				390px;
max-width:			390px;
height:				222px;
max-height:			222px;
padding:			0 5px;
line-height:		36px;
overflow:			scroll-y;
background-attachment: scroll;
font-family:		Georgia, "Times New Roman", Times, serif;
font-style:			italic;
}
#question-content textarea.error{
background:			transparent url('../images/BG-input-error.png') repeat;		
}
.radio input{
display:			none;	
}
.radio{
cursor:				pointer;
text-decoration:	line-through;	
}
.radio.active{
cursor:				text;
color:				#fff;
text-decoration:	none;
}
#question-content p#submit-wrap{
position:			relative;
width:				400px;
padding:			0 35px 0 0;
float:				right;	
}
p#submit-wrap small{
float:				left;
font-style:			normal;
font-weight:		bold;
font-size:			14px;
color:				#a8abb1;
padding:			0;
}
p#submit-wrap button{
float:				right;
margin:				30px 0 0 0;
font-size:			22px;
text-align:			center;
background:			#59616b;
color:				#fff;
letter-spacing:		-1px;
padding:			11px 15px;
cursor:				pointer;
width:				232px;
height:				51px;
}
p#submit-wrap button:hover{
background:			#00a5e3;	
}
#question-wrap input, #question-wrap textarea{
position:			relative;	
}
#question-content input.error{
color:				#e6c9c9;	
}
#question-content label.error{
display:			none;
visibility:			hidden;
position:			absolute;
}

/* 404 -----------------------------------------------------------------------------------------*/

/* Thanks --------------------------------------------------------------------------------------*/

#thanks-wrap{
background:			url('../images/BG-question-wire.png') no-repeat top center;		
}
#thanks{
height:				460px;
padding-top:		40px;
}
#thanks h2{
display:			block;
width:				960px;
overflow:			hidden;
position:			relative;
}
#thanks h2 strong{
font-size:			300px;
line-height:		300px;
text-align:			center;
}
#thanks p{
font-size:			30px;
line-height:		34px;
float:				left;
width:				500px;
padding:			0 20px 0 65px;
border-right:		#222a35 1px solid;
}
#thanks a.button, #thanks a.button:visited{
float:				right;
width:				230px;
margin:				0 50px 20px 0;
font-size:			30px;
text-align:			center;
background:			#59616b;
color:				#fff;
letter-spacing:		-1px;
padding:			12px 20px;
cursor:				pointer;	
}
#thanks a.button:hover{
background:			#00a5e3;		
}

/* Footer --------------------------------------------------------------------------------------*/

#footer-wrap{
	
}
#footer{
padding-top:		120px;	
height:				200px !important;
}
#footer span#amp{
position:			absolute;
display:			block;
height:				174px;
width:				332px;
background:			url('../images/IMG-amp.png') no-repeat center;
left:				-60px;
}
#footer ul{
float:				right;
line-height:		20px;
font-size:			13px;
padding:			0 10px 0 0;
}
#footer ul{
clear:				both;	
padding:			15px 0 0 0;
width:				705px;
display:			block;
}
#footer ul li{
float:				left;
}
#footer p{
text-align:			center;
margin-top:			210px;
clear:				both;
font-size:			12px;
color:				#636f7d;
}
#footer p a, #footer p a:visited{
color:				#828e9c;
}
#footer p a:hover{
color:				#fff;	
}