/***********************************************************/
/* 														   */
/*   style.css - Stylesheet für 5 Elemente Test			   */
/* 														   */
/*   (c) web-looks 2009 - http://www.web-looks.de		   */
/*   Author: Jens Justen ; jensjusten@web-looks.de         */
/* 														   */
/***********************************************************/

/* WRAP */
div#elemente_test { margin: 0 auto; margin-bottom: 30px; width: 90%; }
/* BILD AUF STARTSEITE */
div#elemente_test #start_pic {background: url(GV-5-Elemente-Test-1.jpg) center no-repeat; width: 600px; height: 238px; margin: 0 auto; margin-top: 10px; margin-bottom: 10px;}
/* BESCHREIBUNG DER EINZELNEN TESTS AUF STARTSEITE */
div#elemente_test .start_item_container p { font-size: 13px; }
/* TEXTE OBEN UND UNTEN AUF STARTSEITE */
div#elemente_test .start_text_top {  }
div#elemente_test .start_text_bottom {  }

/* CONTAINER EINER FRAGE */
div#elemente_test .frage { width: 100%; font-size:13px; border: 1px dashed #000; margin: 0px 0px 15px 0px; padding: 20px; }
/* TEXT DER FRAGE */
div#elemente_test .frage .frage_text { font-weight: bold; width: 700px; float: left; }
div#elemente_test .frage .frage_text p { margin: 0px 0px 0px 0px; }
div#elemente_test .frage .frage_text_long { font-weight: bold; width: 550px; float: left; }
div#elemente_test .frage .frage_text_long p { margin: 0px 0px 0px 0px; }

/* ANTWORTMÖGLICHKEITEN */
div#elemente_test .frage span.input { float: left; width: auto; }
div#elemente_test .frage .antworten { font-size: 13px; float: left; width: 150px; }
div#elemente_test .frage .antwort_long { font-size: 13px; float: left; width: 300px; }
div#elemente_test .frage input[type=radio] { margin: 0px 5px 0px 15px; }
/* BUTTON WEITER */
div#elemente_test input#button_submit_answer { display: block; float: right; width: 130px; height: 30px; background: #FFF url(button_continue.gif); margin: 10px 0px 10px 0px; border: none; padding: 0px; cursor: pointer; }
/* BUTTON ZUR AUSWERTUNG */
div#elemente_test input#button_to_result { display: block; float: right; width: 208px; height: 30px; background: #FFF url(button_zur_auswertung.gif); margin: 10px 0px 10px 0px; border: none; padding: 0px; cursor: pointer; }
/* BUTTON SENDEN */
div#elemente_test input#button_send_test { float: none; display: inline; width: 130px; height: 30px; background: #FFF url(button_email_senden.gif); margin: 10px 0px 10px 0px; border: none; padding: 0px; cursor: pointer; }
/* BUTTON ZURÜCK ZUM SHOP */
div#elemente_test a#button_back_to_shop { text-decoration: none; border: none; display: block; margin: 10px 0px 10px 0px; width: 208px; height: 30px; background: #FFF url(button_back_to_shop.gif); border: none; padding: 0px; cursor: pointer; }

/* ALLGEMEIN */
div#elemente_test .clear { clear: both; width: 100%; height: 0px; }
/* CONTAINER HINWEISE ZUM TEST */
div#elemente_test .test_info { font-size:13px; float: left; width: 420px; padding: 15px; }
/* ÜBERSCHRIFT */
div#elemente_test h2 {font-size:23px;}
/* INFO TEST STARTSEITE */
div#elemente_test p1 {font-size:13px;}
/* UNTERTITEL */
div#elemente_test h3 {font-size:18px;}
/* TEXT HINWEISE ZUM TEST */
div#elemente_test .test_info_text p { white-space: normal; width: auto; }
/* MARKIERUNGEN DER FRAGEN BEI FORMULAR ÜBERPRÜFUNG */
div#elemente_test div.hide { width: 20px; height: 20px; border: 0px; background: none; float: right; }
div#elemente_test div.error { width: 20px; height: 20px; border: 0px; background: #FFF url(fehler.png) top left; float: right; }
div#elemente_test div.done { width: 20px; height: 20px; border: 0px; background: #FFF url(haken.png) top left; float: right; }
/* FEHLERMELDUNG WENN NICHT ALLES BEANTWORTET */
div#elemente_test span#error.hide { display: none; float: left; }
div#elemente_test span#error.show{ width: auto; padding: 10px; border: 0px solid #FF0000; float: left; display: block; color: #FF0000; }
/* PUNKTE BOX */
div#elemente_test #punkte_box { width: auto; border: 1px solid #000; float: right; padding: 10px; margin: 0px -40px 15px 0px; }
div#elemente_test #punkte_box .element_punkte { width: 70px; float: left; padding: 5px; }
div#elemente_test #punkte_box .element_punkte p { margin: 5px 0px 0px 0px; text-align: center; }
div#elemente_test #punkte_box .element_punkte .element_bild { display: block; margin: 0 auto; }
div#elemente_test #punkte_box tr.total_points { font-size:13px; font-weight: bold; }
div#elemente_test #punkte_box table { border: 0px; }
div#elemente_test #punkte_box table td { padding: 5px; text-align: center; }
div#elemente_test #punkte_box table td.header { font-size:13px; font-weight: bold; text-transform: capitalize; }
div#elemente_test #punkte_box table td.title { font-size:13px; text-align: left; font-weight: bold; }
/* FORMULAR FÜR EMAIL VERSAND */
div#elemente_test #email_text { font-size:13px; width: 55%; float: left; }
div#elemente_test #email_form { font-size:13px; width: 40%; float: right; margin: 0px 0px 0px 0px; }
div#elemente_test #email_form .form { width: 100%; margin: 5px 0px 5px 0px; }
div#elemente_test #email_form .form span { display: block; width: 150px; float: left; margin: 0px; }
div#elemente_test #email_form .form input[type="text"] { outline: 1px solid #FFF; float: left; width: auto; margin: 0px;}
div#elemente_test #email_form .form input[type="text"].fehler { outline: 1px solid #FF0000; }
/* AUSWERTUNG */
div#elemente_test .element { font-size:13px; width: 100%; border: 1px dashed #000; margin: 15px 0px 15px 0px; padding: 20px; }
div#elemente_test .element h3 { display: inline; margin: 0px 0px 0px 10px; vertical-align: top; }
div#elemente_test .element p.element_points { display: inline; float: right; margin: 0px 0px 0px 10px; font-weight: bold; width: auto; font-size: 1.1em; }
div#elemente_test .element p.element_points span { width: 170px; float: left; }