@charset "UTF-8";

* {
	padding: 0;
	margin: 0;
}

:focus {
	outline: 0;
}

body {
	background: #0c0a22;
	font: 16px/115%  "Lucida Grande", "Lucida Sans", Lucida, "Trebuchet MS", "Microsoft Sans Serif", Helvetica, Verdana, sans-serif;
}

#wrapper {
	background: url(basisdesign/start-bg.gif) no-repeat 0 0;
	position: relative;
	margin: 0px auto;
	width: 840px;
	height: 580px;
}

/* aus dem head elminiert und ins css eingefuegt von Nick */
#wrapper.anleitung {
	background: url(basisdesign/anleitung-bg.jpg) no-repeat 0 0;
}

#wrapper.frage {
	background: url(basisdesign/frage-bg.jpg) no-repeat 0 0;
}

#wrapper.antwort {
	background: url(basisdesign/antwort-bg.jpg) no-repeat 0 0;
}

#postit {
	position: absolute;
	top: 10px;
	left: -80px;
	width: 160px;
	height: auto;
   	text-align: left;
   	color: black;
	font-size: 10px;
	line-height: 12px;
	background-color: #fff7ac;
	padding: 5px;
	border: 1px solid #000;
	text-transform: lowercase;
}

.nurinternet{
	/*text-decoration: underline;*/
}

#intro {
	position: absolute;
	top: 297px;
	left: 0px;
	width: 840px;
	height: 79px;
   	text-align: center;
   	color: white;
	font-size: 24px;
	line-height: 79px;
	background-color: transparent;
}

#intro .intro {
	text-align: center;
	width: 840px;
	height: 79px;
	background: url(basisdesign/intro-bg.jpg) no-repeat center top;
}

/* @group Frage und Antwort */

#frage {
	position: absolute;
	top: 298px;
	left: 40px;
}

#frage p {
  	display: table;
 	width: 758px;
	height: 78px;
   	text-align: center;
  	background: url(basisdesign/frage-bg.png) no-repeat 0 0;
   	overflow:hidden;
   	color: white;
	/*font-size: 24px;*//*Nick, siehe unten*/
	line-height: 115%;
}

/* Ergaenzungen der class Nick */
#frage p.richtig {
	font-size:36px;
	background: url(basisdesign/frage-bg.png) no-repeat 0 -78px;
}

/* Ergaenzungen der class Nick */
#frage p.falsch {
	font-size:36px;
	background: url(basisdesign/frage-bg.png) no-repeat 0 -156px;
}

/* Ergaenzungen der Font-Size Nick, line-hight durch Hannes*/
#frage p.vig_gross {
	font-size: 32px;
	line-height: 38px;
	color: maroon;
	}
	
#frage p.vig_mittel {
	font-size: 28px;
	line-height: 34px;
	}
	
#frage p.vig_klein {
	font-size: 14px;
	line-height: 20px;
	width: 680px;
	padding-right: 30px;
	padding-left: 30px;
	height: 74px;
	padding-top: 4px;
}

#antwort-a {
	position: absolute;
	top: 385px;
	left: 25px;
	overflow:hidden;
}

#antwort-b {
	position: absolute;
	top: 385px;
	left: 463px;
	overflow:hidden;
}

#antwort-c {
	position: absolute;
	top: 450px;
	left: 57px;
	overflow:hidden;
}

#antwort-d {
	position: absolute;
	top: 450px;
	left: 430px;
	overflow:hidden;
}

#antwort-e {
	/*nur für Sprachwahl English*/
	position: absolute;
	top: 514px;
	left: 243px;
	overflow:hidden;
}

/* Ergaenzungen der Font-Size class im a href, Nick line-hight durch Hannes*/
.gross {
	font-size: 20px;
	line-height: 26px;
	}
	
.mittel {
	font-size: 14px;
	line-height: 19px;
	/*color: yellow;*/
	}

.klein {
	font-size: 12px;
	line-height: 15px;
	/*color: orange;*/
	}
.mini {
	font-size: 10px;
	line-height: 12px;
	/*color: red;*/
	
}
	
/* Ergaenzungen des Hintergrundes im p Nick */
.richtige_antwort{
	background: url(basisdesign/antworten-bg.png) no-repeat 0 -118px;
	}
	
.falsche_antwort{
	background: url(basisdesign/antworten-bg.png) no-repeat 0 -177px;}
p {
  	display: table;
 	width: 353px;
 	height: 59px;
   	text-align: center;
   	background: url(basisdesign/antworten-bg.png) no-repeat 0 0;
   	overflow:hidden;
  }
  
p a {
	text-decoration: none;
	color: white;
	display: block;
   	overflow:hidden;
   	padding-bottom: 1px;
	padding-top: 6px;
	padding-left: 30px;
	padding-right: 30px;
}

p a:hover {
	color: black;	
	}  

span {
  display: table-cell;
  vertical-align: middle;
  
  }



/* @end */

/* @group Logo Volkswirtschaft */

#logo-dt a{
	background: url(basisdesign/volkswirtschaft.png) no-repeat 0 0;
	width: 159px;
	height: 25px;
	position: absolute;
	top: 532px;
	left: 60px;
	text-indent: -10000px;
}

#logo-dt a:hover{
	background: url(basisdesign/volkswirtschaft-over.png) no-repeat 0 0;
}



#logo-fr a{
	background: url(basisdesign/volkswirtschaft-fr.png) no-repeat 0 0;
	width: 159px;
	height: 25px;
	position: absolute;
	top: 532px;
	left: 630px;
	text-indent: -10000px;
}

#logo-fr a:hover{
	background: url(basisdesign/volkswirtschaft-fr-over.png) no-repeat 0 0;
}

/* @end */

#start {
	/*nur für Sprachwahl English*/
	position: absolute;
	top: 450px;
	left: 243px;
	overflow:hidden;
}

#links {
	width: 300px;
	position: absolute;
	top: 533px;
	left: 270px;
	text-align: center;
}

#links a {
	color: #000;
	text-decoration: none;
}

#links a:hover {
	color: #0067b5;
;
}

#anleitung {
	position: absolute;
	top: 160px;
	left: 80px;
	width: 680px;
	height: 280px;
	text-align: center;
}

#fehlerbeschrieb {
	position: absolute;
	top: 160px;
	left: 80px;
	width: 680px;
	height: 280px;
	text-align: center;
	color: red;
}

#fehlerbeschrieb h1 {
	color: #F30;
	font-size: 24px;
	text-align: center;
	margin-bottom: 15px;
	font-weight: normal;
}
	
#fehlerbeschrieb h2 {
	color: #F30;
		background-image: none;
		padding: 0;
		margin: 0 0 14px;
	font-size: 14px;
	font-weight: normal;
	font-style: normal;
}



#anleitung h1, #text h1{
	color: #fff;
	font-size: 24px;
	text-align: center;
	margin-bottom: 15px;
	font-weight: normal;
}
	
#anleitung h2, #text h2 {
	color: white;
		background-image: none;
		padding: 0;
		margin: 0 0 14px;
	font-size: 14px;
	font-weight: normal;
	font-style: normal;
}
  
#impressum {
	position: absolute;
	top: 525px;
	left: 20px;
	width: 800px;
	height: 40px;
	text-align: center;
}

#impressum p, #impressum h2, #impressum h2 a  {
	color: #0067b5;
		background-image: none;
		padding: 0;
		margin: 0;
	font-size: 10px;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
}

#impressum h2 a:hover {
	color: #00a8f9;
	}

  
  #bombe {
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(basisdesign/bombe-bg.png) no-repeat;
	width: 500px;
	height: 240px;
}

 #bombe1 {
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(basisdesign/bombe-1.png) no-repeat;
	width: 500px;
	height: 240px;
}

#bombe2 {
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(basisdesign/bombe-2.png) no-repeat;
	width: 500px;
	height: 240px;
}

#bombe3 {
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(basisdesign/bombe-3.png) no-repeat;
	width: 500px;
	height: 240px;
}



#frage-nr {
	width: 840px;
	height: 500px;
}

#frage-nr.nr1 {background: url(basisdesign/frage_1.gif) no-repeat;}
#frage-nr.nr2 {background: url(basisdesign/frage_2.gif) no-repeat;}
#frage-nr.nr3 {background: url(basisdesign/frage_3.gif) no-repeat;}
#frage-nr.nr4 {background: url(basisdesign/frage_4.gif) no-repeat;}
#frage-nr.nr5 {background: url(basisdesign/frage_5.gif) no-repeat;}
#frage-nr.nr6 {background: url(basisdesign/frage_6.gif) no-repeat;}
#frage-nr.nr7 {background: url(basisdesign/frage_7.gif) no-repeat;}
#frage-nr.nr8 {background: url(basisdesign/frage_8.gif) no-repeat;}
#frage-nr.nr9 {background: url(basisdesign/frage_9.gif) no-repeat;}
#frage-nr.nr10 {background: url(basisdesign/frage_10.gif) no-repeat;}
#frage-nr.nr11 {background: url(basisdesign/frage_11.gif) no-repeat;}
#frage-nr.nr12 {background: url(basisdesign/frage_12.gif) no-repeat;}
#frage-nr.nr13 {background: url(basisdesign/frage_13.gif) no-repeat;}
#frage-nr.nr14 {background: url(basisdesign/frage_14.gif) no-repeat;}
#frage-nr.nr15 {background: url(basisdesign/frage_15.gif) no-repeat;}
#frage-nr.nr16 {background: url(basisdesign/frage_16.gif) no-repeat;}
#frage-nr.nr17 {background: url(basisdesign/frage_17.gif) no-repeat;}
#frage-nr.nr18 {background: url(basisdesign/frage_18.gif) no-repeat;}


#zeit {
	position: absolute;
	top: 242px;
	left: 350px;
color: white;
	width: 140px;
	height: 40px;
	text-align: center;
	font-size: 36px;
	font-weight: normal;
	line-height: 40px;
}

#next a{
	position: absolute;
	top: 375px;
	left: 375px;
	background: url(basisdesign/next-bg.gif) no-repeat;
	width: 91px;
	height: 91px;
	text-indent: -10000px;
}
#next a:hover{
	position: absolute;
	top: 376px;
	left: 375px;
	background: url(basisdesign/next-over-bg.png) no-repeat;
	width: 91px;
	height: 91px;
	text-indent: -10000px;
}

#text {
	position: absolute;
	top: 375px;
	left: 40px;
	width: 760px;
	height: 70px;
	overflow: visible;
	text-align: center;
}
#text p {
	color: white;
	text-align: center;
	background-image: none;
		width: 760px;
			overflow: visible;

	}

/* @group Formular */

#formular {
	position: absolute;
	top: 55px;
	left: 250px;
	width: 340px;
	font-size:10px;
	line-height: 12px;
	color: #fff;
	padding: 0;
	margin: 0;
}
#formular h3 {
	font-size: 14px;
	padding: 0;
	margin: 0 0 10px;
}
span {
	margin: 0;
	padding: 0 0 8px;
}
span label {
		line-height: 8px;
}

input {
	padding: 2px;
	}

input:focus {
	background-color: #e5ffff;
}
.preis{
	text-align: left;
	font: 10px "Lucida Grande", Tahoma, Arial, sans-serif;
	padding: 0;
	margin: 0;
}

.full input{
	
	width: 100%;
	margin-bottom: 3px;
}

.full label{
line-height: 16px;
}

.language label{
	font-size: 10px;
	line-height: 17px;
}

.language {
	padding-bottom: 5px;
	padding-top: 10px;
}


/* @end */

/* @group Fehlerseite (Startseite) */

#fehler{
color: red;
position: absolute; top: 325px;
font-size: 140%;
width: 840px;
text-align: center;
}

#js_detect{
color: white;
position: absolute; top: 405px;
width: 840px;
text-align: center;
}

#cookies_detect{
color: white;
position: absolute; top: 470px;
width: 840px;
text-align: center;
}
/* @end */

#ta, #tb, #tc, #td {
	/*color:red;*/
	padding-top: 6px;
	line-height: 115%;
}

sup, sub {
	font-size: 50%;
}

/* im Formular Daten werden nicht weitergegeben an 3personen (ist ein div)*/
#drittpersonen {
	padding-top: 6px;
	text-align: center;
}
/* Nach erfolgreichem Abschicken des Formulars: Text der auf dem Bildschirm erscheint (ist ein div)*/
#gewonnen {
	padding-top: 60px;
	text-align: center;
	font-size: 16px;
	line-height: 20px;
	color: white;
}

