*{
    margin: 0; padding: 0;
}
form, pre, div{
    margin:0; padding:0;
}
html{
    font-size: 100%;
}
img{
    border: none;
}
a{
    color: #ffff00; text-decoration: none;
}

body{
	background: #fff; color: #333333; padding: 0 0 10px; margin: 0;
	font: normal 12pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
}
.clearit /* clearing div */
{
    height: 0; line-height: 0.0; font-size: 0; padding: 0; margin: 0; clear: both;
}

#container{
    width: 950px; margin: 20px auto 0;
}
#header{
    width: 950px; height: 92px; margin: 0 auto;
    background: url(../images/header.jpg) no-repeat 0 0; position: relative; z-index: 8;
}
#header h1{
    float: left; position: relative; top: 27px; left: 29px;
}
#header h2{
    float: right; position: relative; top: 37px; right: 50px; text-align: right;
    color: #fff; font: bold italic 20px Tahoma, Arial, Verdana, Helvetica, Sans-serif;
}

#main{
    width: 936px; border-left: 2px solid #888; border-right: 2px solid #888; position: relative; top: -2px;
    padding: 23px 0 0 9px; z-index: 9;
}

#nav{
    width: 915px; height: 58px;
}
#nav ul{
    padding: 0; margin: 0 0 0 110px; list-style: none;
}
#nav ul li{
    display: block; float: left;
}
#nav ul li.pre{
    background: url(../images/nav_pre.jpg) no-repeat 0 0; width: 210px; height: 38px; padding: 20px 0 0 17px;
    color: #000; font: bold 13px Tahoma, Arial, Verdana, Helvetica, Sans-serif;
}

#content{
    color: #000;
}

#welcome{
    width: 400px; margin: 30px auto 0; padding-bottom: 10px;
}
#welcome h1{
    text-align: center; font: bold 28pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
}
#welcome h2{
    text-align: center; font: normal 20pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
}
#welcome ul{
    padding: 0; margin: 20px 0 0 0; width: 440px;
}
#welcome ul li{
    padding: 0 0 0 25px; margin: 15px 0 0; background: url(../images/bullet.jpg) no-repeat 0 3px;
}
#welcome .button-area{
    text-align: center; padding: 30px 0 0;
}
#welcome .button-area a{
    background: url(../images/button_big.jpg) no-repeat 0 0; width: 193px; height: 44px; margin: 0 auto; padding-top: 20px;
    border: none; text-align: center; font: bold 13pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
    cursor: pointer; display: block; color: #000;
}

#visibleArea{
    padding-bottom: 10px;
    font: normal 14pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
}
#visibleArea ul{
    width: 685px; margin: 30px 0 0 100px; padding: 0; list-style: none;
}
#visibleArea ul li{
    padding: 0 0 0 25px; margin: 15px 0 0; background: url(../images/bullet.jpg) no-repeat 0 5px;
}
#visibleArea .form{
    float: left; padding: 30px 0 0 10px; width: 500px;
}
#visibleArea .form .row{
    height: 40px;
}
#visibleArea .form .row label{
    float: left; display: block; width: 140px;
}
#visibleArea .form .row input{
    display: block; width: 140px; padding: 3px 2px;
}
#visibleArea .form .row select{
    display: block; width: 148px; padding: 3px 2px;
}
#visibleArea .button-area{
    float: right; padding: 100px 10px 0 0; width: 115px;
}
#visibleArea .button-area input{
    background: url(../images/button_small.jpg) no-repeat 0 0; width: 112px; height: 46px; margin: 0 auto;
    border: none; font: bold 14pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
    cursor: pointer; display: block; color: #000;
}

.page-title{
    width: 920px; padding-top: 15px;
    font-size: 14pt; font-weight: normal;
}
#stageNumber{
    width: 70px; float: left; margin-left: 110px;
}
#helpZone{
    width: 600px; float: left; margin-left: 10px;
}
#stage1question,
#stage2question,
#stage3question,
#stage4question{
    margin-left: 110px; width: 670px; display: block; text-align: center;
    font-size: 18pt; font-weight: normal;
}

#stage1,
#stage2,
#stage3,
#stage4{
    width: 800px;
}
#visibleArea .long-list,
#visibleArea .square-list{
    margin: 20px 0 0 60px; padding: 0; list-style: none;
}

#visibleArea .long-list li{
    padding: 0 0 0 25px; margin: 10px 0 0; background: url(../images/bullet.jpg) no-repeat center left;
    font-size: 12pt; font-weight: normal; width: 775px;
}
#visibleArea .long-list li .top{
    background: url(../images/list_l_inactive_top.gif) no-repeat 0 0;
    width: 734px; height: 13px; font-size: 0;
}
#visibleArea .long-list li .bg{
    background: #f0f0f0; border: 1px solid #000; border-width: 0 1px;
    width: 732px;
}
#visibleArea .long-list li .content{
    background: url(../images/list_l_inactive_bg.gif) repeat-x 0 0;
    width: 712px; padding: 0 10px;
}
#visibleArea .long-list li .bottom{
    background: url(../images/list_l_inactive_bottom.gif) no-repeat 0 0;
    width: 734px; height: 13px; font-size: 0;
}
#visibleArea .long-list li.activeBg .top{
    background: url(../images/list_l_active_top.gif) no-repeat 0 0;
    width: 734px; height: 13px; font-size: 0;
}
#visibleArea .long-list li.activeBg .bg{
    background: #ffffd1; border: 1px solid #000; border-width: 0 1px;
    width: 732px;
}
#visibleArea .long-list li.activeBg .content{
    background: url(../images/list_l_active_bg.gif) repeat-x 0 0;
    width: 712px; padding: 0 10px;
}
#visibleArea .long-list li.activeBg .bottom{
    background: url(../images/list_l_active_bottom.gif) no-repeat 0 0;
    width: 734px; height: 13px; font-size: 0;
}

#visibleArea .square-list{
    width: 390px; margin-left: 250px;
}
#visibleArea .square-list li{
    padding: 0 0 0 25px; margin: 10px 0 0; background: url(../images/bullet.jpg) no-repeat center left;
    font-size: 12pt; font-weight: normal; width: 170px; float: left; display: block;
}
#visibleArea .square-list li#stage3list2,
#visibleArea .square-list li#stage3list4{
    padding: 0 15px 0 0; margin: 10px 0 0; background: url(../images/bullet.jpg) no-repeat center right;
}
#visibleArea .square-list li .top{
    background: url(../images/list_sq_inactive_top.gif) no-repeat 0 0;
    width: 160px; height: 13px; font-size: 0;
}
#visibleArea .square-list li .bg{
    background: #f0f0f0; border: 1px solid #000; border-width: 0 1px;
    width: 158px;
}
#visibleArea .square-list li .content{
    background: url(../images/list_l_inactive_bg.gif) repeat-x 0 0;
    width: 138px; padding: 0 10px;
}
#visibleArea .square-list li .bottom{
    background: url(../images/list_sq_inactive_bottom.gif) no-repeat 0 0;
    width: 160px; height: 13px; font-size: 0;
}
#visibleArea .square-list li.activeBg .top{
    background: url(../images/list_sq_active_top.gif) no-repeat 0 0;
    width: 160px; height: 13px; font-size: 0;
}
#visibleArea .square-list li.activeBg .bg{
    background: #ffffd1; border: 1px solid #000; border-width: 0 1px;
    width: 158px;
}
#visibleArea .square-list li.activeBg .content{
    background: url(../images/list_l_active_bg.gif) repeat-x 0 0;
    width: 138px; padding: 0 10px;
}
#visibleArea .square-list li.activeBg .bottom{
    background: url(../images/list_sq_active_bottom.gif) no-repeat 0 0;
    width: 160px; height: 13px; font-size: 0;
}

#visibleArea .big-list{
    margin: 20px 0 0 20px; padding: 0; list-style: none;
}
#visibleArea .big-list li{
    margin: 10px 0 0; background: none;
    font-size: 12pt; font-weight: normal; width: 734px;
}
#visibleArea .big-list li .top{
    background: url(../images/list_l_inactive_top.gif) no-repeat 0 0;
    width: 734px; height: 13px; font-size: 0;
}
#visibleArea .big-list li .bg{
    background: #f0f0f0; border: 1px solid #000; border-width: 0 1px;
    width: 732px;
}
#visibleArea .big-list li .content{
    background: url(../images/list_l_inactive_bg.gif) repeat-x 0 0;
    width: 712px; padding: 0 10px;
}
#visibleArea .big-list li .content ul{
    padding: 0 0 10px; margin: -20px 0 0;
}
#visibleArea .big-list li .content ul li{
    padding: 0 0 0 25px; margin: 10px 0 0; background: url(../images/bullet.gif) no-repeat 0 3px;
    font-size: 12pt; font-weight: normal; width: 669px;
}
#visibleArea .big-list li .bottom{
    background: url(../images/list_l_inactive_bottom.gif) no-repeat 0 0;
    width: 734px; height: 13px; font-size: 0;
}
#visibleArea .big-list li.activeBg .top{
    background: url(../images/list_l_active_top.gif) no-repeat 0 0;
    width: 734px; height: 13px; font-size: 0;
}
#visibleArea .big-list li.activeBg .bg{
    background: #ffffd1; border: 1px solid #000; border-width: 0 1px;
    width: 732px;
}
#visibleArea .big-list li.activeBg .content{
    background: url(../images/list_l_active_bg.gif) repeat-x 0 0;
    width: 712px; padding: 0 10px;
}
#visibleArea .big-list li.activeBg .bottom{
    background: url(../images/list_l_active_bottom.gif) no-repeat 0 0;
    width: 734px; height: 13px; font-size: 0;
}

#visibleArea .button-area2{
    float: right; padding: 20px 10px 5px 0; width: 115px;
}
#visibleArea .button-area4{
    float: right; padding: 0 10px 5px 0; width: 115px; margin-top: -50px;
}
#visibleArea .button-area2 input,
#visibleArea .button-area4 input{
    background: url(../images/button_small.jpg) no-repeat 0 0; width: 112px; height: 46px; margin: 0 auto;
    border: none; font: bold 14pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
    cursor: pointer; display: block; color: #000;
}

.results{
  font-size: 18pt; width: 300px; margin: 0 auto; text-align: center; margin-top: 50px;
}
.results #saveLink{
    background: url(../images/button_big.jpg) no-repeat 0 0; width: 193px; height: 44px; margin: 30px auto 80px;
    padding-top: 20px; border: none; text-align: center; font: bold 13pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
    cursor: pointer; display: block; color: #000;
}
.results .hiddenFinalResult{
    visibility: hidden;
}


#answer{
    text-align: center; font: normal 18pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
    margin: 30px auto 0;
}
#answer .descriptionText{
    font: normal 24pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
}
#answer .descriptionText .copy{
    font: normal 12pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
}
#answer .result-image{
    margin: 5px 0;
}
#answer .result-image img{
    border: 4px double #111;
}
#answer .button-area{
    margin: 20px auto 0; padding: 0;
}
#answer .button-area ul{
    margin: 0; padding: 0; list-style: none;
}
#answer .button-area ul li{
    background: url(../images/button_bigger.jpg) no-repeat 0 0; width: 211px; height: 66px;
    margin: 0 50px; padding-top: 30px; cursor: pointer; display: block; float: left;
    border: none; text-align: center; font: bold 13pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
}
#answer .button-area ul li.last-list{
    padding-top: 20px;
}
#answer .button-area ul li a{
    color: #000; width: 211px; height: 66px; display: block;
}

.feedback{
    padding: 50px 0 20px; margin: 0 auto; background: url(../images/bullet.jpg) no-repeat 50px 120px; width: 900px;
}
.feedback h3{
    text-align: center; font: normal 18pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
}
.feedback .top{
    background: url(../images/list_l_inactive_top.gif) no-repeat 0 0;
    width: 734px; height: 13px; font-size: 0;
}
.feedback .bg{
    background: #f0f0f0; border: 1px solid #000; border-width: 0 1px;
    width: 732px;
}
.feedback .content{
    background: url(../images/list_l_inactive_bg.gif) repeat-x 0 0;
    width: 712px; padding: 0 10px;
}
.feedback .bottom{
    background: url(../images/list_l_inactive_bottom.gif) no-repeat 0 0;
    width: 734px; height: 13px; font-size: 0;
}
.feedback form{
    padding: 30px 0 0 80px;
}
.feedback .content textarea{
    border: none; background: transparent; margin: 5px 0 5px 10px;
    width: 690px; font: normal 12pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
}
.feedback .button-area{
    margin-top: 10px;
}
.feedback .button-area input{
    background: url(../images/button_bigger.jpg) no-repeat 0 0; width: 211px; height: 86px; margin: 30px auto 0;
    padding-top: 5px; border: none; text-align: center; font: bold 14pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
    cursor: pointer; display: block; color: #000; float: right;
}

.thankyou{
padding: 80px 0 100px;
}
.thankyou h3{
    text-align: center; font: normal 18pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
}
.thankyou a.button{
    background: url(../images/button_bigger.jpg) no-repeat 0 0; width: 211px; height: 70px; margin: 20px auto 0;
    padding-top: 18px; border: none; text-align: center; font: bold 14pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
    cursor: pointer; display: block; color: #000;
}


#footer{
    width: 950px; height: 100px; margin: 0 auto; background: url(../images/footer.jpg) no-repeat 0 0;
    position: relative; top: -2px; z-index: 10;
}
.footer-welcome p{
    color: #fff; font: normal 10pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
    position: relative; top: 75px; right: 20px; float: right;
}
.footer-test h1{
    color: #fff; font: bold 16pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
    width: 250px; text-align: center; padding: 30px 0 0;
}
.footer-test h2{
    color: #fff; font: normal 12pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
    width: 250px; text-align: center;
}
.footer-test p{
    color: #fff; font: normal 10pt Tahoma, Arial, Verdana, Helvetica, Sans-serif;
    text-align: right; padding: 0 20px 0 0;
}

.xsnazzy {background: transparent; display: block; width: 734px; }

.xtop, .xbottom {display:block; background:transparent; font-size:1px;}
.xb1, .xb2, .xb3, .xb4 {display:block; overflow:hidden;}
.xb1, .xb2, .xb3 {height:1px;}
.xb2, .xb3, .xb4 {background:#ccc; border-left:1px solid #333; border-right:1px solid #333;}
.activeBg .xb2, .activeBg .xb3, .activeBg .xb4 {background:#eee; border-left:1px solid #333; border-right:1px solid #333;}
.xb1 {margin:0 5px; background:#333;}
.activeBg .xb1 {margin:0 5px; background:#333;}
.xb2 {margin:0 3px; border-width:0 2px;}
.xb3 {margin:0 2px;}
.xb4 {height:2px; margin:0 1px;}

.xboxcontent {display:block; background:#ccc; padding: 10px; border:0 solid #333; border-width:0 1px;}
.activeBg .xboxcontent {display:block; background:#eee; padding: 10px; border:0 solid #333; border-width:0 1px;}
