.evaluation-background { width:100%; height:100%; position:fixed; top:0; left:0; background:transparent url("../images/evaluation/background.png") top left repeat; } #evaluationLightbox { z-index:998; } #evaluationLightboxInner { width:726px; height:612px; position:fixed; z-index:100; top:0; left:0; overflow:hidden; } #evaluationLightboxBackground { width:726px; height:612px; background:transparent url("../images/evaluation/evaluation-elements.png") left top no-repeat; position:relative; z-index:200; } #evaluationTab { display:block; width:314px; height:56px; background:transparent url("../images/evaluation/evaluation-elements.png") left -625px no-repeat; position:absolute; z-index:100; left:355px; top:50px; } #evaluationHeader { height:70px; position:relative; } a#evaluationCloseButton { display:block; width:42px; height:42px; position:absolute; top:22px; left:71px; } a#evaluationCloseButton:link, a#evaluationCloseButton:visited { background:none; } a#evaluationCloseButton:hover, a#evaluationCloseButton:active { background:transparent url("../images/evaluation/evaluation-elements.png") left -680px no-repeat; } ul#evaluationContent { display:block; height:440px; margin-left:25px; overflow:hidden; position:relative; } ul#evaluationContent li { position:absolute; top:0; left:0; display:block; width:677px; height:440px; } ul#evaluationContent li .inner { position:absolute; z-index:10; top:0; left:0; width:677px; height:220px; } #question-0 { background:transparent url("../images/evaluation/question-0-bottom.png") left 220px no-repeat; } #question-0 .inner { background:transparent url("../images/evaluation/question-0-top.png") left top no-repeat; } #question-1 { background:transparent url("../images/evaluation/question-1-bottom.png") left 220px no-repeat; } #question-1 .inner { background:transparent url("../images/evaluation/question-1-top.png") left top no-repeat; } #question-2 { background:transparent url("../images/evaluation/question-2-bottom.png") left 220px no-repeat; } #question-2 .inner { background:transparent url("../images/evaluation/question-2-top.png") left top no-repeat; } #question-2 .options { margin-top:134px; } #question-3 { background:transparent url("../images/evaluation/question-3-bottom.png") left 220px no-repeat; } #question-3 .inner { background:transparent url("../images/evaluation/question-3-top.png") left top no-repeat; } #question-3 .options { margin-top:147px; } #question-3 .answer { background:transparent url("../images/evaluation/question-3-answer.png") left top no-repeat; } #question-4 { background:transparent url("../images/evaluation/question-4-a-bottom.png") left 220px no-repeat; } #question-4 .inner { background:transparent url("../images/evaluation/question-4-a-top.png") left top no-repeat; } #question-4 .options { margin-top:105px; } #question-4.alternate { background:transparent url("../images/evaluation/question-4-b-bottom.png") left 220px no-repeat; } #question-4.alternate .inner { background:transparent url("../images/evaluation/question-4-b-top.png") left top no-repeat; } #question-4.alternate .multiple-options { margin-top:140px; } #question-4.alternate .text-area-options { margin:0; position:absolute; left:158px; top:213px; } #question-4.alternate .text-area-options textarea { height:20px; width:430px; margin:0; } #question-5 { background:transparent url("../images/evaluation/question-5-a-bottom.png") left 220px no-repeat; } #question-5 .inner { background:transparent url("../images/evaluation/question-5-a-top.png") left top no-repeat; } #question-5 .text-area-options { margin-top:210px; } #question-5 .answer { background:transparent url("../images/evaluation/question-5-a-answer.png") left top no-repeat; } #question-5.alternate { background:transparent url("../images/evaluation/question-5-b-bottom.png") left 220px no-repeat; } #question-5.alternate .inner { background:transparent url("../images/evaluation/question-5-b-top.png") left top no-repeat; } #question-5.alternate .multiple-options { margin-top:135px; } #question-5.alternate .text-area-options { margin:0; position:absolute; left:130px; top:251px; } #question-5.alternate .text-area-options textarea { height:20px; width:350px; margin:0; } #question-6 { background:transparent url("../images/evaluation/question-6-bottom.png") left 220px no-repeat; } #question-6 .inner { background:transparent url("../images/evaluation/question-6-top.png") left top no-repeat; } #question-6 .options { margin-top:187px; } #question-6 .answer { background:transparent url("../images/evaluation/question-6-answer.png") left top no-repeat; } #question-7 { background:transparent url("../images/evaluation/question-7-bottom.png") left 220px no-repeat; } #question-7 .inner { background:transparent url("../images/evaluation/question-7-top.png") left top no-repeat; } #question-7 .options { margin-top:187px; } #question-7 .answer { background:transparent url("../images/evaluation/question-7-answer.png") left top no-repeat; } #question-8 { background:transparent url("../images/evaluation/question-8-bottom.png") left 220px no-repeat; } #question-8 .inner { background:transparent url("../images/evaluation/question-8-top.png") left top no-repeat; } #question-8 .options { margin-top:147px; } #question-8 .answer { background:transparent url("../images/evaluation/question-8-answer.png") left top no-repeat; } #question-9 { background:transparent url("../images/evaluation/question-9-bottom.png") left 220px no-repeat; } #question-9 .inner { background:transparent url("../images/evaluation/question-9-top.png") left top no-repeat; } #question-9 .options { margin-top:147px; } #question-9 .answer { background:transparent url("../images/evaluation/question-9-answer.png") left top no-repeat; } #question-10 { background:transparent url("../images/evaluation/question-10-bottom.png") left 220px no-repeat; } #question-10 .inner { background:transparent url("../images/evaluation/question-10-top.png") left top no-repeat; } #question-10 .options { margin-top:187px; } #question-10 .answer { background:transparent url("../images/evaluation/question-10-answer.png") left top no-repeat; } #question-11 { background:transparent url("../images/evaluation/question-11-bottom.png") left 220px no-repeat; } #question-11 .inner { background:transparent url("../images/evaluation/question-11-top.png") left top no-repeat; } #question-11 .options { margin-top:237px; } #question-11 .answer { background:transparent url("../images/evaluation/question-11-answer.png") left top no-repeat; } #question-12 { background:transparent url("../images/evaluation/question-12-bottom.png") left 220px no-repeat; } #question-12 .inner { background:transparent url("../images/evaluation/question-12-top.png") left top no-repeat; } #question-12 .options { margin-top:147px; } #question-13 { background:transparent url("../images/evaluation/question-13-bottom.png") left 220px no-repeat; } #question-13 .inner { background:transparent url("../images/evaluation/question-13-top.png") left top no-repeat; } #question-13 .multiple-options { margin-top:178px; } #question-14 { background:transparent url("../images/evaluation/question-final-bottom.png") left 220px no-repeat; } #question-14 .inner { background:transparent url("../images/evaluation/question-final-top.png") left top no-repeat; } /* Options */ .options, .multiple-options { margin:134px 0 0 35px; position:absolute; z-index:300; } .options .option, .multiple-options .option { display:block; width:250px; height:40px; text-align:left; text-indent:-2000px; overflow:hidden; cursor:pointer; } .options .option.selected, .multiple-options .option.selected { background:transparent url("../images/evaluation/evaluation-elements.png") -75px -690px no-repeat; } .options .option-small, .multiple-options .option-small { width:120px !important; } /* Text Area */ .text-area-options { margin:134px 0 0 45px; position:absolute; z-index:300; } .text-area-options textarea { display:block; background:transparent; overflow:hidden; width:213px; height:209px; float:left; margin-right:25px; font-size:14px; text-align:left; } /* Answer */ ul#evaluationContent li .answer { position:absolute; z-index:250; top:0; left:0; display:block; width:677px; height:440px; } #evaluationButtons { height:70px; margin-right:50px; position:absolute; right:0; top:440px; z-index:500; } #evaluationButtons a { float:right; margin-top:5px; } #evaluationButtons a, #evaluationButtons a span { display:block; width:110px; height:52px; background:transparent url("../images/evaluation/evaluation-elements.png") left top no-repeat; } a#evaluationStartButton { background-position:-331px -628px; } a#evaluationStartButton span { background-position:-331px -688px; } a#evaluationNextButton { background-position:-451px -628px; } a#evaluationNextButton span { background-position:-451px -688px; } a#evaluationDownloadButton, a#evaluationDownloadButton span { background:transparent url("../images/evaluation/download-button.png") left top no-repeat; } a#evaluationDownloadButton { width:255px; height:130px; position:relative; top:-70px; } a#evaluationDownloadButton span { width:255px; height:130px; background-position:0 -126px; } #evaluationProgressBar { position:relative; left:56px; width:616px; height:8px; } #evaluationProgressBar div { background-color:#3f669d; width:0%; height:8px; } #evaluationStages { display:block; height:30px; overflow:hidden; position:relative; top:12px; left:57px; } #evaluationStages li { display:block; float:left; width:40px; height:30px; margin:0 3px; background:transparent url("../images/evaluation/evaluation-elements.png") left top no-repeat; } /* Back */ #evaluationStages li.stage-1 { background-position:0 -755px; } #evaluationStages li.stage-2 { background-position:-45px -755px; } #evaluationStages li.stage-3 { background-position:-86px -755px; } #evaluationStages li.stage-4 { background-position:-126px -755px; } #evaluationStages li.stage-5 { background-position:-166px -755px; } #evaluationStages li.stage-6 { background-position:-206px -755px; } #evaluationStages li.stage-7 { background-position:-246px -755px; } #evaluationStages li.stage-8 { background-position:-287px -755px; } #evaluationStages li.stage-9 { background-position:-328px -755px; } #evaluationStages li.stage-10 { background-position:-378px -755px; } #evaluationStages li.stage-11 { background-position:-430px -755px; } #evaluationStages li.stage-12 { background-position:-484px -755px; } #evaluationStages li.stage-13 { background-position:-537px -755px; } #evaluationStages li.stage-14 { background-position:-592px -755px; } /* Current */ #evaluationStages li.stage-1.current { background-position:0 -785px; } #evaluationStages li.stage-2.current { background-position:-45px -785px; } #evaluationStages li.stage-3.current { background-position:-86px -785px; } #evaluationStages li.stage-4.current { background-position:-126px -785px; } #evaluationStages li.stage-5.current { background-position:-166px -785px; } #evaluationStages li.stage-6.current { background-position:-206px -785px; } #evaluationStages li.stage-7.current { background-position:-246px -785px; } #evaluationStages li.stage-8.current { background-position:-287px -785px; } #evaluationStages li.stage-9.current { background-position:-328px -785px; } #evaluationStages li.stage-10.current { background-position:-378px -785px; } #evaluationStages li.stage-11.current { background-position:-430px -785px; } #evaluationStages li.stage-12.current { background-position:-484px -785px; } #evaluationStages li.stage-13.current { background-position:-537px -785px; } #evaluationStages li.stage-14.current { background-position:-592px -785px; } /* Next */ #evaluationStages li.stage-1.next { background-position:0 -815px; } #evaluationStages li.stage-2.next { background-position:-45px -815px; } #evaluationStages li.stage-3.next { background-position:-86px -815px; } #evaluationStages li.stage-4.next { background-position:-126px -815px; } #evaluationStages li.stage-5.next { background-position:-166px -815px; } #evaluationStages li.stage-6.next { background-position:-206px -815px; } #evaluationStages li.stage-7.next { background-position:-246px -815px; } #evaluationStages li.stage-8.next { background-position:-287px -815px; } #evaluationStages li.stage-9.next { background-position:-328px -815px; } #evaluationStages li.stage-10.next { background-position:-378px -815px; } #evaluationStages li.stage-11.next { background-position:-430px -815px; } #evaluationStages li.stage-12.next { background-position:-484px -815px; } #evaluationStages li.stage-13.next { background-position:-537px -815px; } #evaluationStages li.stage-14.next { background-position:-592px -815px; } /* Contact Form */ .contact-form { margin:155px 0 0 135px; position:absolute; z-index:300; text-align:left; } .contact-form div.item { position:relative; } .contact-form input { display:block; width:475px; height:24px; margin-bottom:11px; font-size:14px; text-align:left; cursor:pointer; background:transparent; } .contact-form select { width:175px; height:24px; font-size:14px; text-align:left; } .contact-form div.error { display:block; position:absolute; top:0; left:480px; width:200px; height:24px; margin-bottom:11px; line-height:22px; font-size:12px; } /* Slider */ .slider-container { position:absolute; top:214px; left:90px; z-index:1100; width:487px; } /* Interaction states ----------------------------------*/ .ui-state-default { outline: none; } .slider-container .slider .ui-slider .ui-state-hover, .ui-state-focus { outline: none; } .ui-state-active { background:transparent url("../images/evaluation/evaluation-slider-button.png") -20px top no-repeat; outline: none; } /* Icons ----------------------------------*/ .ui-slider { position: relative; text-align: left; } .ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 20px; height: 40px; cursor: default; background:transparent url("../images/evaluation/evaluation-slider-button.png") left top no-repeat; } .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; } .ui-slider-horizontal { height:40px; } .ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left:-10px; } .ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } .ui-slider-horizontal .ui-slider-range-min { left: 0; } .ui-slider-horizontal .ui-slider-range-max { right: 0; }