.quiz-container { border: 1px solid #666; background: #FFF url(/images/ui/bg/quiz-bg.jpg) 0 0 repeat-x; position: relative; }
.quiz-title { background: url(/images/headers/home-insulation-comfort-quiz.png) no-repeat; width: 289px; height: 58px; position: absolute; margin: 0; padding: 0; top: 12px; left: 30px; }
.quiz-container h2 { float: right; margin-right: 20px; font-size: 25px; font-family: "Gill Sans W01 Light", Arial, Helvetica, sans-serif; font-weight: 300; }
.quiz-progress-bar { width: 820px; height: 30px; display: inline; background: transparent url(/images/ui/quiz-progress-bar.gif) 0 0 no-repeat; float: left; margin: 30px 0 20px 55px; }

.quiz-previous { background: url(/images/ui/buttons/quiz-previous.png) no-repeat; width: 132px; height: 27px; position: absolute; margin: 0; padding: 0; top: 540px; right: 570px; z-index: 150; }
.quiz-next { background: url(/images/ui/buttons/quiz-next.png) no-repeat; width: 164px; height: 41px; position: absolute; margin: 0; padding: 0; top: 525px; right: 30px; z-index: 150; }

.quiz-question-explanatory { background: transparent url(/images/ui/quiz-divider.png) top right no-repeat; height: 420px;  }
.quiz-question-explanatory h3 { padding: 0 14px 0 16px; font-size: 32px; color: #D61563; font-family: "Gill Sans W01 Light", Arial, Helvetica, sans-serif; font-weight: 300; }
.quiz-question-explanatory h3.quiz-small { font-size: 30px; }
.quiz-container h4 { font-size: 24px; color: #333; font-family: "Gill Sans W01 Light", Arial, Helvetica, sans-serif; font-weight: 300; }

.quiz-question-explanatory p { padding: 0 20px; color: #666; }

.quiz-question { height: 440px; position: relative; }

.quiz-question-1 { background: transparent url(/images/ui/bg/quiz-question-1-bg.png) 93% 0% no-repeat; }
.quiz-question-4 { background: transparent url(/images/ui/bg/quiz-question-4-bg.png) bottom right no-repeat; }

.quiz-progress-1 { background-position: 0 -30px; }
.quiz-progress-2 { background-position: 0 -60px; }
.quiz-progress-3 { background-position: 0 -90px; }
.quiz-progress-4 { background-position: 0 -120px; }
.quiz-progress-5 { background-position: 0 -150px; }
.quiz-progress-6 { background-position: 0 -180px; }
.quiz-progress-7 { background-position: 0 -210px; }
.quiz-progress-8 { background-position: 0 -240px; }
.quiz-progress-9 { background-position: 0 -270px; }
.quiz-progress-10 { background-position: 0 -300px; }
.quiz-progress-11 { background-position: 0 -330px; }
.quiz-progress-12 { background-position: 0 -360px; }
.quiz-progress-13 { background-position: 0 -390px; }
.quiz-progress-14 { background-position: 0 -420px; }
.quiz-progress-15 { background-position: 0 -450px; }
.quiz-progress-16 { background-position: 0 -480px; }

.quiz-question .quiz-multi-question { padding: 5px 0 20px 15px; margin-bottom: 0 !important; background: transparent url(/images/ui/icons/quiz-arrow.png) 0 10px no-repeat; clear: both; position:relative;}

.quiz-question p.txt-input-container { width: 171px; height: 33px; background: transparent url(/images/ui/bg/quiz-input-bg.png) 0 0 no-repeat; padding: 0 !important; }
.quiz-question p.txt-input-container input { font-size: 20px; border: none; background: none; color: #666; overflow: hidden; width: 80%; position: relative; margin: 3px 0 0 5px !important; height: 24px; }
.quiz-question-1 p.txt-input-container input#zip {width:94%;height:26px;}

.radio { height: 40px; width: 40px; clear: left; float: left; margin: 0 0 3px; background: url("/images/ui/quiz-radio-buttons.png"); background-repeat:no-repeat; cursor: default; }
.radio input { display: none; }
.radio input.show { display: inline; }
.block { width: 50%; float: left; }
label.quiz-label { font-size: 20px; line-height: 20px; padding-left: 50px; padding-top: 13px; text-align: left; color: #333; margin-bottom: 0 !important; font-family: "Gill Sans W01 Light", Arial, Helvetica, sans-serif; font-weight: 300; display: block; cursor:pointer;}

.answer-container { width: 250px; height: 55px; padding-left: 20px; float: left; }
.answer-container-long { width: 645px; float: left; height: 80px; }
.answer-container-long label.quiz-label { font-size: 24px; }

.quiz-results-explanatory  { margin-right: 0 !important; }

.quiz-results-explanatory h3 { font-size: 15px; }
.quiz-results-explanatory p { padding: 0; color: #666; }


.quiz-score-0,
.quiz-score-1,
.quiz-score-2,
.quiz-score-3,
.quiz-score-4,
.quiz-score-5,
.quiz-score-6,
.quiz-score-7,
.quiz-score-8,
.quiz-score-9,
.quiz-score-10 { width: 180px; height: 47px; font-size: 10px; line-height: 14px; padding: 0; background: transparent url(/images/ui/bg/quiz-scores-bg.png) 0 0 no-repeat; }

.quiz-score-container h4 { color: #FFF; font-size: 14px; line-height: 14px; margin: 0; padding: 6px 0 0 4px; font-family: "Gill Sans W01 Medium", Arial, Helvetica, sans-serif; font-weight: bold; }
.quiz-score-container h4 a{color: #FFF;}

.quiz-score-0 { background-position: 0 0; }
.quiz-score-1 { background-position: 0 -50px; }
.quiz-score-2 { background-position: 0 -100px; }
.quiz-score-3 { background-position: 0 -150px; }
.quiz-score-4 { background-position: 0 -200px; }
.quiz-score-5 { background-position: 0 -250px; }
.quiz-score-6 { background-position: 0 -300px; }
.quiz-score-7 { background-position: 0 -350px; }
.quiz-score-8 { background-position: 0 -400px; }
.quiz-score-9 { background-position: 0 -450px; }
.quiz-score-10 { background-position: 0 -500px; }

.quiz-score-explanation { width: 180px; height: 10px; margin-bottom: 15px;}


.quiz-results-container { width: 180px; height: 440px; margin-left: 20px; }

#quiz-results div.tab-container { background: none; width:700px; }
#quiz-results div.tab { padding: 0  0 20px; }

#quiz-results ul.tab-nav { list-style: none; padding: 0; height: 48px; margin-left: 0; background: transparent url(/images/ui/bg/quiz-results-tabs-bg.png) 0 0 no-repeat;  }
/*.ie6 #quiz-results ul.tab-nav { background-image:url(/images/ui/bg/quiz-results-tabs-bg.gif);}*/
#quiz-results ul.tab-nav li { position: relative; float: left; display: inline; height: 37px; text-align: center; margin-top: 0; margin: 0 10px; }
#quiz-results ul.tab-nav li:first-child { margin-left: 30px; }

#quiz-results ul.tab-nav li a { display: inline; float:left; padding-left: 0; margin-left: 0; height: 37px; overflow: hidden; background: url(/images/ui/bg/quiz-results-tabs.gif) no-repeat 0 0; }
#quiz-results ul.tab-nav li a span { background: none; display: inline-block; height: auto; position: relative; padding-right: 0; padding-top: 0; }

#quiz-results ul.tab-nav li a.quiz-tab-attics { width: 96px; background-position: 0 0; }
#quiz-results ul.tab-nav li a.quiz-tab-floors-walls { width: 108px; background-position: -96px 0; }
#quiz-results ul.tab-nav li a.quiz-tab-basements-crawlspaces { width: 96px; background-position: -204px 0; }
#quiz-results ul.tab-nav li a.quiz-tab-ducts { width: 96px; background-position: -300px 0; }

#quiz-results ul.tab-nav li a.quiz-tab-attics:hover { width: 96px; background-position: 0 -37px; }
#quiz-results ul.tab-nav li a.quiz-tab-floors-walls:hover { width: 108px; background-position: -96px -37px; }
#quiz-results ul.tab-nav li a.quiz-tab-basements-crawlspaces:hover { width: 96px; background-position: -204px  -37px; }
#quiz-results ul.tab-nav li a.quiz-tab-ducts:hover { width: 96px; background-position: -300px  -37px; }

#quiz-results ul.tab-nav li.selected a.quiz-tab-attics { width: 96px; background-position: 0  -74px; }
#quiz-results ul.tab-nav li.selected a.quiz-tab-floors-walls { width: 108px; background-position: -96px -74px; }
#quiz-results ul.tab-nav li.selected a.quiz-tab-basements-crawlspaces { width: 96px; background-position: -204px -74px; }
#quiz-results ul.tab-nav li.selected a.quiz-tab-ducts { width: 96px; background-position: -300px -74px; }

.quiz-result-area-overview img { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 2px solid #CCC; }
.quiz-result-area-overview p { color: #666; }

ul.quiz-results-projects { width: 365px; list-style: none !important; margin-left: 0 !important; padding-left: 0 !important; overflow: hidden; zoom: 1 }
ul.quiz-results-projects li { padding-bottom: 10px; border-bottom: 2px solid #CCC; margin-bottom: 10px !important; overflow: hidden; zoom: 1 }
ul.quiz-results-projects li:last-child { border-bottom: none; }
ul.quiz-results-projects h6 { font-size: 20px; line-height: 20px; padding-top: 0; margin-top: 0; margin-bottom: 0.5em; }
ul.quiz-results-projects img { width: 85px; float: left; }
ul.quiz-results-projects div.quiz-results-projects-description { margin-left: 95px; color: #666; }
.quiz-results-learn-more { clear: both; float: right; width: 80px; height: 17px; background: transparent url(/images/ui/buttons/btn_quiz_learn_more.png) 0 0 no-repeat; }


/* CSS Styles that are needed by jScrollPane for it to operate correctly. */

.jspContainer { overflow: hidden; position: relative; }
.jspPane { position: absolute; }
.jspVerticalBar { position: absolute; top: 0; right: 0; width: 18px; height: 100%;}
.jspHorizontalBar { position: absolute; bottom: 0; left: 0; width: 100%; height: 18px; }
.jspVerticalBar *, .jspHorizontalBar * { margin: 0; padding: 0; }
.jspCap { display: none; }
.jspHorizontalBar .jspCap { float: left; }
.jspTrack { background: transparent url(/images/ui/quiz-results-scroll-elements.png) 0 -40px no-repeat; position: relative; }
.jspDrag { background: transparent url(/images/ui/quiz-results-scroll-elements.png) 0 -340px no-repeat; position: relative; top: 0; left: 0; cursor: pointer; }
.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag { float: left; height: 100%; }
.jspArrow { background: transparent url(/images/ui/quiz-results-scroll-elements.png) 0 0 no-repeat; text-indent: -20000px; display: block; cursor: pointer; }
.jspArrowDown { background-position:  0 -20px; }
.jspArrow.jspDisabled { cursor: default; }
.jspVerticalBar .jspArrow { height: 18px; }
.jspHorizontalBar .jspArrow { width: 18px; float: left; height: 100%; }
.jspVerticalBar .jspArrow:focus { outline: none; }
.jspCorner { background: #eeeef4; float: left; height: 100%; }
.scroll-pane { width: 100%; height: 310px; overflow: auto; }

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner { margin: 0 -3px 0 0; }

#score-card-print-btn {position:absolute;top:46px;right:20px;}
.ie6 #score-card-print-btn {right:40px;}
#score-card-print-btn a.button {cursor:pointer;font-size:15px;}

h2#final-score {margin-top:14px;margin-bottom:1em;}

#zip-bouncer{position:absolute;top:37px;left:320px;width:200px;z-index:1000;line-height:1.25em;padding:5px 10px;margin-left:-95px;background:#EEEEEE;border:1px solid #999;font-size:1.1em;font-weight:normal;text-align:center;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-moz-box-shadow:#CCC 1px 1px 4px;-webkit-box-shadow:#CCC 1px 1px 4px;box-shadow:#CCC 1px 1px 4px;color:#F06;}
#error-hook{position:absolute;top:465px;left:840px;width:165px;z-index:1000;line-height:1.25em;padding:5px 10px;margin-left:-95px;background:#EEEEEE;border:1px solid #999;font-size:1.1em;font-weight:normal;text-align:center;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-moz-box-shadow:#CCC 1px 1px 4px;-webkit-box-shadow:#CCC 1px 1px 4px;box-shadow:#CCC 1px 1px 4px;color:#F06;}
.ie6 #error-hook {left:830px;}

.error-glow {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-moz-box-shadow: #f06 0 0 10px;
	-webkit-box-shadow: #f06 0 0 10px;
	box-shadow: #f06 0 0 10px;/* for Opera */
	z-index:1;
}
.ie6 .zip-code-wrapper {width:600px;height:70px;display:block;}
.ie6 #zip {position:absolute;top:36px;left:40px;cursor:auto;}
.ie6 .radio {margin:0;}

body.insulation-comfort-quiz #maincontent .quiz-container {}
#quiz-fix.ie-compliance {display:none;}
.ie #quiz-fix.ie-compliance {display:block;float:left;height:40px;width:100%;}
.ie6 div.radio {position:relative;top:5px;}