/* 
Kai Brach
brizk design (www.brizk.com)
*/

/* Basics ######################################################### */

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td { 
	margin: 0; padding: 0; 
} 

html {
	background: #efe5cc url(../_pix/bg.gif) 0 0 repeat;	
}

body, input, select {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;	
}

body {
	text-align: center;
	border: 0;
	color: #3d392f;
	background: url(../_pix/bg-top.jpg) center 0 repeat-x;
	line-height: 19px;
}	

.wrap {
	margin: 0 auto;
	width: 960px;
	text-align:left;
}

#header {
	padding: 80px 0 10px 0;
	position: relative;
	
}

#header .special {
	width: 960px;
	position: absolute;
	top: 0px;
	left: 0;
	background: url(../_pix/grunge-red.jpg) center center;
}

.typekit, #header ul, h1, h2, .button, .goodies p {
	font-family: "bree-1","bree-2", sans-serif;
}

.line-full {
	background: url(../_pix/line-full.gif) 0 center no-repeat;
	height: 30px;
	clear: both;
}

.half-left {
	width: 460px;
	padding: 20px 20px 20px 0;
	float: left;
}

.half-right {
	width: 460px;
	padding: 20px 0 20px 20px;
	float: right;
}

#intro {
	position: relative;
}

.button-buy {
	width: 418px;
	height: 100px;
	background: url(../_pix/button-buy.jpg) 0 0 no-repeat;
}

#footer {
	padding-top: 15px;
	background: url(../_pix/line-full.gif) 0 15px no-repeat;
	clear: both;
}

#footer div {
	background: url(../_pix/line-full.gif) 0 40px no-repeat;
	padding: 16px 0 35px 0;
	position: relative;
}

.sample-pages {
	position: relative;
	height: 220px;
}

.goodies {
	background: url(../_pix/grunge-grey.jpg) 0 0 repeat;
	height: 100px;
	margin-bottom: 10px;
	clear: both;
}

.e-book-intro {
	height: 510px;
	position: relative;
}

.background {
	background: url(../_pix/grunge-grey.jpg) 0 0 repeat;
}
	 
#bestellen .col-left {
	width: 260px;
	padding: 20px 20px 20px 0;
	float: left;
}	 
	 
#bestellen .col-right {
	width: 660px;
	padding: 20px 0 20px 20px;
	float: right;
}	 

#bestellen .step1 div.price, #bestellen .step4 div.price  {
	width: 230px;
	float: right;
}

div.error {
	padding: 20px;
	border-bottom: 3px solid #e31414;
	color: #e31414;
	margin: 0 0 15px 0;
}

div.werbebox {
	position: relative;
	padding-right: 150px;
}

div.video {
	padding: 20px;
	text-align: center;
}

/* Headlines ######################################################### */		

h1, h2 {
	padding: 0 0 15px 0;
	margin: 0;
	font-weight:normal;	
	color: #1f86ac;
}

h1 {
	font-size: 38px;
	line-height: 42px;
}

h2 {
	font-size: 24px;
	line-height: 28px;
}

h2.grey {
	color: #3d392f;
}

.e-book-intro h2 {
	padding-left: 280px;
}	

.inhalt h2 {
	padding-top: 20px;
}

div.error h2 {
	color: #e31414;
}

/* Links ######################################################### */	

a:link,  a:visited, a:active {color:#ca5101; text-decoration: none; outline: none}
a:hover {color:#1f86ac; text-decoration: underline}

.font-grey a {color:#968f7d; text-decoration:underline}

.goodies a, .goodies a:hover {
	color: #3d392f;
	text-decoration: none;
}


#header .special a {
	color: #fff;
	display: block;
	padding: 4px 10px 5px 10px;
	text-align: center;
	font-weight: bold;
}

#header a.logo {
	width: 245px;
	height: 78px;
	text-indent: -1111em;
	float: left;
	display: block;
	background: url(../_pix/logo.png) 0 0 no-repeat;
}

.button-buy a.price {
	float: left;
	text-align: center;
	display: block;
	padding: 16px 0 0 0;
	width: 103px;
	color: #f9efdf;
}

.button-buy a.price:hover {
	text-decoration: none;
}	

.button-buy a.text {
	float: left;
	display: block;
	padding: 22px 0 0 80px;
	width: 228px;
	color: #f9efdf;
	font-size: 28px;
	line-height: 30px;
}


a.button {
	padding: 7px 15px;
	font-size: 24px;
	line-height: 24px;
	color: #f9efdf;
	display: inline-block;
	background: url(../_pix/grunge-red.jpg) center center;
}

#intro a.button {
	font-size: 28px;
	line-height: 28px;
}

#intro .button {
	position: absolute;
	z-index: 20;
	top: 400px;
	left: 120px;
}

#footer div a {
	padding: 0 10px 0 0;
	display: inline-block;
	color: #3d392f;
	font-weight: bold;
}

/* Fonts ######################################################### */

.font-grey, .inhalt span {color:#968f7d;}

.font-red {	color: #e31414;}

p {
	padding: 0 0 15px 0;
}

.button-buy a.price span {
	font-size: 40px;
	line-height: 40px;
}

#bestellen .step1 div.price p.tag , #bestellen .step4 div.price p.tag {
	width: 101px;
	height: 83px;
	background: url(../_pix/price.jpg) 0 0 no-repeat;
	padding: 20px 0 0 0;
	color: #f9efdf;
	text-align: center;
}	


.background p {
	padding-right: 20px;
}	

#bestellen .step1 div.price p.tag span, #bestellen .step4 div.price p.tag span {
	font-size: 35px;
	line-height: 36px;
}	

#bestellen .step1 div.price p.text {
	padding: 10px 0 0 10px;
	width: 100px;
}

#bestellen .step1 p {
	width: 410px;
	float: left;
	padding: 0;
}	


p.download {
	padding: 0 0 20px 42px;
	background: url(../_pix/arrow-download.png) 0 4px no-repeat;
}

#footer p.payment {
	text-align: center;
	padding-bottom: 55px;
	background: url(../_pix/creditcards.gif) center 27px no-repeat;
}

.goodies p {
	padding: 10px;
	font-size: 24px;
	line-height: 28px;
	float: left;
	display: inline-block;
}

.goodies p.first {
	width: 120px;
}

.goodies p.second {
	width: 205px;
	padding-left: 30px;
	background: url(../_pix/plus.png) 0 28px no-repeat;
}

.goodies p.third {
	width: 225px;
	padding-left: 30px;
	background: url(../_pix/plus.png) 0 28px no-repeat;
}

.goodies p.fourth {
	width: 255px;
	padding-left: 30px;
	background: url(../_pix/plus.png) 0 28px no-repeat;
}	

.e-book-intro p {
	padding-left: 280px;
	height: 200px;
}	

.step1 span.price {
	font-weight: bold;
	color: #1f86ac;
}

.step2 p {
	clear: both;
	padding: 0 0 10px 30px;
}

#bestellen p.last {
	padding-bottom: 0;
}

.step3 p.lastschrift {
	width: auto;
	padding: 0 0 15px 30px;
}

.step2 p.land {
	padding-bottom: 25px;
}

.step3 p.lastschrift span {
	width: 140px;
	float: left;
	display: inline-block;
	padding: 5px 0 ;
}

.step4 p {
	width: 410px;
	float: left;
}

/* Navigation ######################################################### */

#header ul {
	padding: 35px 0 0 0;
	margin: 0;
	list-style-type: none;
	width: 660px;
	float: right;
}

#header ul li {
	padding: 0;
	margin: 0;
	display: inline;
}

#header ul li a {
	float: right;	
	padding: 7px 20px;
	font-size: 28px;
	line-height: 28px;
	color: #968f7d;
}

#header ul li.current a {
	color: #3d392f;
}	

#header ul li a.red {
	background: url(../_pix/grunge-red.jpg) center center;
	color: #f9efdf;
}

	
/* Images ######################################################### */	

img {
	border: none;
}

#intro img.covers {
	position: absolute;
	top: 0;
	left: -50px;
}

.sample-pages img {
	position: absolute;
	top: 0;
	left: -30px;
}

#footer div img {
	position: absolute;
	top: 14px;
	right: 0;
}

.e-book-intro img {
	position: absolute;
	top: 110px;
	left: -20px;
}	

img.ueber {
	position: relative;
	top: 0;
	left: -40px;
}

img.twx {
	float: right;
	margin: 0 20px 10px 20px;
}

div.werbebox img {
	position: absolute;
	top: 10px;
	left: 300px;
}

img.iphone {
	position: absolute;
	top: 40px;
	left: 910px;
}
	
/* Tables ######################################################### */

	

/* Lists ######################################################### */

ul.check, ul.question {
	padding: 0 0 20px 0;
	margin: 0;
	list-style-type: none;
}

ul.question {
	padding: 0;
}

ul.check li {
	padding: 4px 0 4px 20px;
	margin: 0;
	background: url(../_pix/bullet-check.png) 0 7px no-repeat;
}

ul.question li {
	padding: 4px 0 4px 26px;
	margin: 0;
	background: url(../_pix/bullet-question.png) 0 5px no-repeat;
}		

.inhalt ul {
	text-align: left;
}

.inhalt ul, .inhalt ul li ul {
	margin: 10px;
	padding: 0;
	list-style-type: none;
}
	
.inhalt ul li {
	padding: 5px 3px 3px 3px;
	border-top: 2px solid #ebebeb;
	font-weight:bold;
}
	
.inhalt ul li ul li {
	padding: 5px 3px 3px 3px;
	margin: 0 0 0 15px;
	border-top: 1px solid #ebebeb;
	font-weight:normal;
}

.inhalt ul li ul li ul li {
	font-size: 12px;
}

div.error ul {
	padding: 0;
	margin: 0 20px 0 40px;
}

/* Forms ######################################################### */

form {
	padding: 0;
	margin: 0;
}
	
.step1 label {
	width: 380px;
	float: right;
	padding: 0 0 15px 0;	
}	

.step3 label {
	float: left;
	width: 600px;
	padding: 0 0 0 10px;
}

.step1 label.last {
	padding-bottom: 0;	
}

.step2 label {
	width: 140px;
	float: left;
	padding: 3px 0 0 0;
}

.step2 input {
	width: 250px;
	float: left;
}

.step2 input#PLZ {
	width: 50px;
	margin-right: 5px;
	float: left;
}

.step2 input#Ort {
	width: 190px;
	float: left;
}

.step3 input {
	float: left;
}

.step3 p.lastschrift input {
	float: none;
	width: 250px;
}

button {
	padding: 7px 15px;
	font-size: 24px;
	line-height: 24px;
	border: none;
	cursor: pointer;
	color: #f9efdf;
	display: inline-block;
	background: url(../_pix/grunge-red.jpg) center center;
	float: left;
}

button:hover {
	text-decoration: underline;
}	


/* Misc ######################################################### */		

.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

.float-left {
	float:left;
}

.float-right {
	float:right;
}	

.clear {
	clear:both;
}	

.center {
	text-align:center;
}