@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800);
@import url(http://fonts.googleapis.com/css?family=Francois+One);
/* font-family: 'Open Sans', sans-serif; font-family: 'Francois One', sans-serif; 
*/
body {font-family: 'Open Sans', sans-serif; font-size: 14px; background: #fff url("../images/background.jpg") top center repeat-x;}

body, select, input, textarea {color: #333;}

a {color: #03f;}
a:hover {color: #69f;}

::-moz-selection{background: #F96100; color: #fff; text-shadow: none;}
::selection {background: #F96100; color: #fff; text-shadow: none;} 

a:link {-webkit-tap-highlight-color: #fcd700;} 

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}

input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }

.wrapper
{
	width: 980px;
	margin: 0 auto;
}

header #logo {}
#main
{
	min-height: 840px;
	position: relative;	
}

#titleheader { width: 100%; height: 85px; background: url("../images/title_bg.jpg") top right no-repeat; position: relative; top: 55px; text-align: right; z-index: 999; }
#titleheader h1 {margin-top: 8px; margin-right: 5px; width: 670px; font-family: 'Open Sans', sans-serif; font-size: 30px; line-height: 33px; letter-spacing: 2px; font-weight: 900; color: #fff; display: inline-block; max-height: 85px;text-align: center;}
#cutout{ background: url("../images/cutout.jpg") top left; width: 324px; height: 775px;  position: absolute; top: 20px; left: 30px; z-index: 998; }

#main h2.maintitles
{
	width: 600px;
	height: 40px;
	font-size: 16px;
	text-transform: uppercase;
	font-weight: normal;
	position: absolute;
	right: 30px;
	top: 150px;
	z-index: 999;
	text-align: center;
	line-height: 18px;
	letter-spacing: 1px;
	
}

#main h3.maintitles
{
	width: 600px;
	height: 40px;
	font-size: 15px;
	text-transform: uppercase;
	font-weight: normal;
	position: absolute;
	right: 30px;
	top: 230px;
	z-index: 999;
	text-align: center;
	line-height: 18px;
	letter-spacing: 1px;
	
}

 #Q02,#Q03,#Q04,#Q05, #QRES {display: none;}
.question
{
	width: 600px;
	height: 300px;
	background: url("../images/questions_bg.png") top center no-repeat;
	position: absolute;
	top: 270px;
	right: 0;

}

.question h2 { width: 100%; height: 60px; line-height: 60px; font-size: 25px; font-weight: 900; padding-left: 20px; color: #F96100; text-transform: uppercase; margin-top: 9px;}
.question h3 { font-family: 'Francois One', sans-serif;  font-size: 33px; color: #000;  width: 100%; padding: 0 20px; line-height: 33px; margin-top: 10px; } 
.question h4 { font-family: 'Francois One', sans-serif;  font-size: 33px; color: #000;  width: 100%; padding: 0 20px; line-height: 33px; margin-top: 40px; }
.question h2.QRtitle { text-align: center; font-size: 19px; padding:0 8px;}

.qbuttons
{
	width: 430px;
	height: 90px;
	position: absolute;
	bottom: 10px;
	left: 85px;
}

.qbutyes,.qbutno
{
	width: 210px;
	height: 90px;
	display: inline-block;
	background: url("../images/button_bg.png") no-repeat;
	position: relative;
	
}

.qbutyes:hover,.qbutno:hover {cursor:pointer;}

.qbutyes
{
	background-position: center left;
}

.qbutno
{
	background-position: center right;
}

.qbutyes span.qbtext,
.qbutno span.qbtext
{
	font-family: 'Francois One', sans-serif;  font-size: 33px; color: #fff; letter-spacing: 1px;	
	display: inline-block;
	height:36px; 
	width: 120px;
	text-align: center;
	line-height: 33px;
	position: absolute;
	
}

.qbutyes span.qbtext
{
	top: 30px;
	left: 10px;
}

.qbutno span.qbtext
{
	top: 30px;
	right: 10px;
}

.qbutyes span.thumbs,
.qbutno span.thumbs
{
	display: inline-block;
	visibility: hidden;
	width: 70px;
	height: 60px;
	background: url("../images/thumbs.png") no-repeat;
	position: absolute;
}

.qbutyes span.thumbs
{
	background-position: top left;
	right: 2px;
	top: 2px;
}

.qbutno span.thumbs
{
	background-position: bottom right;
	left: 2px;
	top: 28px;
}

.qbutyes:hover span.thumbs {visibility: visible;}
.qbutno:hover span.thumbs {visibility: visible;}


#QRES
{
	width: 600px;
	height: 420px;
	background: url("../images/questionsRES_bg.png") top center no-repeat;
	position: absolute;
	top: 150px;
	right: 0;

}

#QRES .QRstepOne { display: none; height: 380px;}
/*#QRES .QRstepOne { display: none; background: url("../images/searching.gif") center 200px no-repeat; height: 380px;}*/
#QRES .QRstepOne h2.QRtitle {  margin-top: 40px }
#QRES .QRstepOne h3.QRtitle { font-size: 37px; text-align: center; margin-top: 0px; line-height: 37px; display: none; }
#QRES .QRstepOne h4.QRtitle { font-size: 33px; text-align: center; line-height: 33px; display: none; color: #00a9da;}
#QRES .QRstepOne h3.QRtitle span.QRNumber { color: #00a9da;}

#QRES .QRstepOne .progressbar 
{ 
	height: 25px;  /* Can be anything */
	position: relative;
	background: #555;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
	border-radius: 12px;
	padding: 2px;
	-webkit-box-shadow: inset 0 -1px 1px rgba(255,255,255,0.3);
	-moz-box-shadow   : inset 0 -1px 1px rgba(255,255,255,0.3);
	box-shadow        : inset 0 -1px 1px rgba(255,255,255,0.3);
	max-width: 90%;
	margin-left: 5%;
}

#QRES .QRstepOne .progressbar > span {
	line-height: 21px; color: #fff;
	display: block;
	text-align: center;
	height: 100%;
	   -webkit-border-top-right-radius: 12px;
	-webkit-border-bottom-right-radius: 12px;
	       -moz-border-radius-topright: 12px;
	    -moz-border-radius-bottomright: 12px;
	           border-top-right-radius: 12px;
	        border-bottom-right-radius: 12px;
	    -webkit-border-top-left-radius: 12px;
	 -webkit-border-bottom-left-radius: 12px;
	        -moz-border-radius-topleft: 12px;
	     -moz-border-radius-bottomleft: 12px;
	            border-top-left-radius: 12px;
	         border-bottom-left-radius: 12px;
	background-color: rgb(43,194,83);
	background-image: -webkit-gradient(
	  linear,
	  left bottom,
	  left top,
	  color-stop(0, rgb(43,194,83)),
	  color-stop(1, rgb(84,240,84))
	 );
	background-image: -webkit-linear-gradient(
	  center bottom,
	  rgb(43,194,83) 37%,
	  rgb(84,240,84) 69%
	 );
	background-image: -moz-linear-gradient(
	  center bottom,
	  rgb(43,194,83) 37%,
	  rgb(84,240,84) 69%
	 );
	background-image: -ms-linear-gradient(
	  center bottom,
	  rgb(43,194,83) 37%,
	  rgb(84,240,84) 69%
	 );
	background-image: -o-linear-gradient(
	  center bottom,
	  rgb(43,194,83) 37%,
	  rgb(84,240,84) 69%
	 );
	-webkit-box-shadow: 
	  inset 0 2px 9px  rgba(255,255,255,0.3),
	  inset 0 -2px 6px rgba(0,0,0,0.4);
	-moz-box-shadow: 
	  inset 0 2px 9px  rgba(255,255,255,0.3),
	  inset 0 -2px 6px rgba(0,0,0,0.4);
	position: relative;
	overflow: hidden;
}

#QRES .QRstepTwo { display: none; padding-top: 10px; height: 410px;}

#QRES .QRstepTwo img
{
	margin-left: 91px; margin-top: 10px; width: 400px; height: 232px; 
	-webkit-box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
	-moz-box-shadow:    2px 2px 2px 0px rgba(0, 0, 0, 0.5);
	box-shadow:         2px 2px 2px 0px rgba(0, 0, 0, 0.5); 
}

#QRES .QRstepTwo h3.QRtitle { font-size: 25px; text-align: center; letter-spacing: 2px; }

#QRES .QRstepTwo .QRESClock { width: 100%; text-align: center; font-size: 30px; font-weight: 900; text-transform: uppercase; }
#QRES .QRstepTwo .QRESClock span {font-weight: 900; text-transform: uppercase; color: #970000;}
#QRES .QRstepTwo a.claim { width: 100%; text-align: center; display: inline-block; font-size: 20px; margin-top: 10px; outline: 0; }

#carousell
{
	position: absolute;
	bottom: 44px;
	width: 100%;
	height: 186px;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	text-align: right;	
	left: 30px;
	z-index: 998;
	padding-right: 20px;
	padding-left: 310px;
	background: #ededed url("../images/carouselbg.jpg") top left no-repeat;
}

#carousell .item
{
	width: 200px; 
	max-width: 200px; 
	margin: 0 5px;
	z-index: 998;
}

#carousell .item img{ padding: 3px; max-width: 194px; max-height: 194px; background: #F96100;}

#carousell .item span.itemTxt{ width: 100%; text-align: center; display: inline-block; line-height: 1;}
.outercarousel{ width: 630px; z-index: 999; position: relative; top: -5px; background: transparent !important;}

#asseen{ text-align: center;}
footer { margin-top: 20px; padding: 0 20px;}
footer #footerlogo{ width: 83px; height: 52px; display: inline-block; margin-bottom: 30px;}
footer p { width: 820px; max-width: 860px; display: inline-block; font-size: 12px;}