/*
/////////////////////////////////

Name des Dokumentes: "screen.css"

Erstellt fuer: "toycase.de"

Erstellungsdatum: "22.12.2009"

Farben:
----------------
hellgrau: #8c8c8c
dunkelgrau: #1d1b1e
dunkelrot: #560000
Rahmen: #434345

/////////////////////////////////
*/



/* Setzt alle vordefinierten Einstellungen des Browsers auf 0
-------------------------*/
* {
margin:				0;
padding:			0;
border:				0;
list-style:			none;
outline:			0
}



/* /////////////////////////////// Allgemeine Informationen /////////////////////////////// */

body {
	background: #0b0b0b url(imgs/bg-seite.png) repeat-x;
	font:  90%/120% Verdana,sans-serif;
	color: #8c8c8c
}

.reader-only { display: none }
.line { border-bottom: 1px solid #333 }

/* /////////////////////////////// Wrapper & Kopf /////////////////////////////// */


#seite {
	width: 900px;
	margin: 0 auto;
	min-height: 100%;
	overflow: hidden;
	position: relative
}

h1 {
	width: 100%;
	height: 89px;
	line-height: 89px;
	position: relative;
	text-align: center;
	border-bottom: 1px solid #727272;
	background: url(imgs/bg-head.jpg) repeat-x
}

	h1 span {
		width: 450px;
		position: absolute;
		left: 48%;
		font-size: 51%;
		line-height: 90px;
		color: #666;
		text-indent: -4000px;
		font-weight: normal
	}


/* /////////////////////////////// Navigation /////////////////////////////// */

#navi {
	width: 100%;
	margin: 15px 0;
	overflow: hidden
}

	#navi li {
		float: left;
		padding-right: 40px
	}

		#navi a {
			display: block;
			height: 20px;
			text-indent: -3000px
		}
		
		.cat-item-1 a { width: 73px; background: url(imgs/h_navi-start.png) 0 0 no-repeat }
		.cat-item-4 a { width: 48px; background: url(imgs/h_navi-inhalt.png) 0 0 no-repeat }
		.cat-item-5 a { width: 63px; background: url(imgs/h_navi-vor.png) 0 0 no-repeat }
		.cat-item-6 a { width: 100px; background: url(imgs/h_navi-os.png) 0 0 no-repeat }
		.cat-item-7 a { width: 65px; background: url(imgs/h_navi-kont.png) 0 0 no-repeat }
		
		
		
		.current-cat a,
		#navi a:hover {
			background-position: -100px 0 !important
		}
		
	#navi .page_item {
		float: right !important;
		padding-right: 10px !important;
		font-size: 80%
	}
	
		#navi .page_item a {
			display: block;
			height: 12px;
			text-indent: -3000px
		}
		
		.page-item-5 a { width: 18px; background: url(imgs/t_navi-faq.png) 0 0 no-repeat }
		.page-item-13 a { width: 46px; background: url(imgs/t_navi-feedb.png) 0 0 no-repeat }
		.page-item-15 a { width: 64px; background: url(imgs/t_navi-hi.png) 0 0 no-repeat }
		#facebook a { width: 64px; background: url(imgs/t_navi-fb.png) 0 0 no-repeat }
		
		.current_page_item a,
		#navi .page_item a:hover {
			background-position: -66px 0 !important
		}
		

/* /////////////////////////////// Content /////////////////////////////// */

#inhalt {
	width: 590px;
	float: left;
	position: relative;
	font-size: 75%;
	overflow: hidden
}

#inhalt .box { overflow: hidden }

#sidebar {
	width: 300px;
	float: right
}


	/*-------------------------------------------------------------------
	Ueberschrift
	------------------------*/
	h2 {
		font-size: 130%;
		text-transform: uppercase;
		font-weight: normal;
		color: #ddd;
		margin: 20px 0 25px
	}
		
	/*-------------------------------------------------------------------
	     Text-Ueberschriften
	-----------------------------*/
	h3 {
		color: #aaa;
		margin: 20px 0 8px;
	}

	/*-------------------------------------------------------------------
	     Verlinkung
	-----------------------------*/
	h1 a,
	#inhalt a {
		color: white;
		text-decoration: underline
	}

	#inhalt a:hover {
		color: #999;
	}
	
	/*-------------------------------------------------------------------
	     Sonstiges
	-----------------------------*/
	#inhalt p b { display: block; margin-top: 15px }

	.page-id-21 #inhalt ul { margin: 10px 0 }
	.page-id-21 #inhalt ul li { margin-left: 20px; list-style: disc inside }


/* /////////////////////////////// Sidebar /////////////////////////////// */

#sidebar {
	font-size: 75%;
	color: #777
}
	
	.box {
		background: #1d1b1e url(imgs/bg-sidebar.jpg) center repeat-y;
		position: relative;
		border: 1px solid #434345 !important;
		margin: 0 0 10px 0;
		padding: 10px;
		z-index: 1;
		box-shadow: 5px 2px 10px #0c0c0c;
		-moz-box-shadow: 5px 2px 10px #0c0c0c;
		-webkit-box-shadow: 5px 2px 10px #0c0c0c
	}
	
dl.box {z-index: 96}

	#sidebar a {
		text-decoration:underline;
		color:#555
	}
	
	#sidebar a:hover  {text-decoration: none }

	#sidebar h3 {
		height: 25px;
		margin: 0 0 0 0;
		text-indent: -3000px
	}
	
	.minibasket h3 { width: 138px; background: url(imgs/h2-warenkorb.png) 0 0 no-repeat }
	#konto { width: 214px; background: url(imgs/h2-konto.png) 0 0 no-repeat }
	#fs h3 { width: 214px; background: url(imgs/h2-fs.png) 0 0 no-repeat }
	#nl h3 { width: 104px; background: url(imgs/h2-newsl.png) 0 0 no-repeat }
	#za h3 { width: 155px; background: url(imgs/h2-zahlung.png) 0 0 no-repeat }
	

/*-------------------------------------------------------------------
	Tell A Friend & Newsletter
--------------------------------------*/
input,
textarea,
select {
	width: 170px;
	background: #1a181b url(imgs/bg-input.jpg) center top repeat-y;
	font: 100%/110% Arial,sans-serif;
	color: #555;
	margin: 5px 0 0;
	padding: 3px 5px;
	text-shadow: 1px 1px 1px black;
	border: 1px solid #555
}

textarea { background: #1a181b }

	input:hover {
		background: #181818;
		border: 1px solid #888
	}
	
	input:focus,
	textarea:focus {
		color: #999;
		background: #181818;
		border: 1px solid #888
	}

#sidebar label,
form li label,	
form p label {
	display: none
}

button {
	height: 18px;
	line-height: 18px;
	margin-left: 10px;
/*	padding-right: 15px; */
	font-size: 90%;
	font-size: 110%;
	background: transparent;
/*	background: transparent url(imgs/button.png) right 6px no-repeat; */
	color: #888
}

button:hover {
	cursor: pointer;
	color: #BBB
}

#nl-senden,
#sidebar .cf-sb { position: absolute; right: 10px; bottom: 12px }

#sidebar .cf-sb {bottom:  8px }

	#sidebar span {
		padding-left: 8px;
		font-size: 80% !important
	}
	
	.failure {
		text-indent: 7px;
		line-height: 25px;
		background: #560000;
		color: white;
		text-shadow: 1px 1px 1px black
	}
	
	.success {
		text-indent: 7px;
		line-height: 25px;
		color: green;
		text-shadow: 1px 1px 1px black
	}
	
		.cf_li_err input {
			width: 150px !important;
			background:#560000 url(imgs/icon_error.png) 3px 3px no-repeat !important;
			padding-left: 25px !important;
			color: white !important
		}
		
	#captcha {padding-top:10px}
	#captcha label {
		display: block;
		float: left
	}
	
	#captcha input {margin-left: 10px; display: inline; float: left; width: 60px}
	
	#sidebar form p { clear: left}
	#nl-senden { margin-top: 20px }
	
	fieldset {display: none }
	
	

/*-------------------------------------------------------------------
	Zahlungsarten
----------------------------*/
#z-arten {
	height: 80px;
	margin: 10px 0;
	padding: 20px 0 0 150px;
	background: url(imgs/logo-paypal.gif) left center no-repeat
}

	#z-arten  li {
		background: url(imgs/icon_list.png) left center no-repeat;
		padding-left: 13px
	}
	
#hermes {
	padding-left: 50px;
	font-size: 80%;
	line-height: 1.2;
	background: url(imgs/logo-dhl.png) left center no-repeat
}
	
	
/* /////////////////////////////// Startseite /////////////////////////////// */

#koffer-preis {
	width: 590px;
	height: 355px;
	margin-bottom: 10px;
	position: relative;
	background: url(imgs/koffer-start.jpg) left top no-repeat
}

	#koffer-preis h2 {
		width: 80px;
		height: 20px;
		position: absolute;
		right: 22px;
		bottom: 30px
	}
	
		#koffer-preis h2 a { 
			background: url(imgs/h2-toycase.png) left center no-repeat; 
			display: block; 
			width: 80px; 
			height: 20px; 
			text-indent: -3000px
		}
		
		.mehr {
			display: block;
			position: absolute;
			left: 80px;
			width: 340px;
			text-indent: -3000px !important;
			height: 300px
		}
	
	#koffer-preis .text {
		position: absolute;
		right: 22px;
		bottom: 16px;
		text-align: right;
		font-size: 90%
	}
	
	#start-inhalt,
	#start-vorteil {
		height: 146px;
		float: left;
		padding: 15px 0 0 100px;
		font-size: 90%;
		box-shadow: 5px 2px 10px #0c0c0c;
		-moz-box-shadow: 5px 2px 10px #0c0c0c;
		-webkit-box-shadow: 5px 2px 10px #0c0c0c
	}
	
	#start-inhalt { position: relative; width: 194px; margin-right: 12px; background: url(imgs/bg-inhalt-box.jpg) 0 0 no-repeat }
	#start-vorteil { position: relative; width: 184px; background: url(imgs/bg-vorteil-box.jpg) 0 0 no-repeat }
	
		#start-inhalt h2 a { text-indent: -3000px; display: block; width: 80px; height: 20px; background: url(imgs/h2-inh.png) 0 0 no-repeat }
		#start-vorteil h2 a { text-indent: -3000px; display: block; width: 80px; height: 20px; background: url(imgs/h2-vor.png) 0 0 no-repeat }
		
		#start-inhalt p a,
		#start-vorteil p a {
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 85px;
			text-indent: -3000px !important;
			height: 160px
		}


/* /////////////////////////////// Inhalt /////////////////////////////// */

#koffer {
	width: 588px;
	height:255px;
	position: relative;
	margin-bottom: 20px;
	border: 1px solid #434345;
	background: url(imgs/koffer.jpg) no-repeat
}

	#koffer a {
		display: block;
		height: 20px;
		color: #333;
		position: absolute;
		text-indent: -2000px
	}
	
	#easyTooltip{
		padding:2px 4px;
		font-size: 80%;
		border:1px solid #ccc;
		background:#fff;
	}
	
	#mini-vib a { top: 95px; left: 170px; width: 80px }
	
	#vib a { top: 125px; left: 160px; width: 120px }
	
	#l-kugeln a { top: 65px; left: 170px; width: 60px }
	
	#p-ring a { top: 90px; left: 310px; width: 40px }
	
	#h-schellen a { top: 115px; right: 60px; width: 70px; height: 30px }
	
	#f-stab a { top: 30px; left: 160px; width: 65px; height: 30px }
	
	#a-maske a { top: 95px; left: 360px; width: 60px; height: 60px }
	
	#l-wuerfel a { top: 75px; left: 250px; width: 50px }
	
	#g-mittel a { top: 75px; left: 110px; width: 40px; height: 40px}
	
	#t-lichter a { top: 165px; left: 330px; width: 90px; height: 30px }
	
	#d-mittel a { top: 55px; left: 70px; width: 40px; height: 50px }
	
	#kondom a { bottom: 40px; right: 80px; width: 60px; height: 40px }
	
.produkt {
	margin: 20px 0;
	padding: 20px 0 20px 100px;
	font-size: 90%;
	height: 160px;
	background-color: #1c1a1d;
	position: relative;
	border: 1px solid #434345;
	overflow: hidden
}

#liebeswuerfel { height: 260px }

	.category-inhalt #inhalt h2 { width: 350px; height: 17px; background:url(imgs/h2-inhalt.png) 0 0 no-repeat; text-indent: -3000px }

	.produkt a {
		position: absolute;
		left: 0;
		top: 0
	}
	
	.produkt h3 {
		font-size: 150%;
		font-weight: normal;
		margin: 0 0 10px 0
	}
	
	.produkt p {
		width: 320px;
		float: left
	}
	
	.produkt dl { width: 155px ; float: right; line-height: 1.4}
	.produkt dt { clear:left; background: url(imgs/icon_list.png) left center no-repeat; padding-left: 12px }
	.produkt dt, .produkt dd { float: left; margin: 0 0 0 4px }
	
/*-------------------------------------------------------------------
	Lightbox
----------------------------*/
.MultiBoxContainer {
	position: absolute;
	border: 10px solid #fff;
	background: #000;
	display: none;
	z-index: 20
}

.MultiBoxLoading {

	background: url(imgs/loader.gif) no-repeat center;
}

.MultiBoxContent {
	position: relative;
	overflow: hidden
}

.MultiBoxClose {
	position: absolute;
	top: -26px;
	right: -26px;
	background: url(imgs/close.png) no-repeat;
	width: 24px;
	height: 24px;
	cursor: pointer
}

.MultiBoxPrevious {
	position: absolute;
	background: url(imgs/left.png) no-repeat;
	width: 24px;
	height: 24px;
	left: 5px;
	margin-top: 5px;
	cursor: pointer;
}

.MultiBoxNext {
	position: absolute;
	background: url(imgs/right.png) no-repeat;
	width: 24px;
	height: 24px;
	right: 5px;
	margin-top: 5px;
	cursor: pointer;
}

.MultiBoxNextDisabled {
	cursor: default;
	background: url(imgs/rightDisabled.png) no-repeat;
}

.MultiBoxPreviousDisabled {
	cursor: default;
	background: url(imgs/leftDisabled.png) no-repeat;
}

.MultiBoxNumber {
	position: relative;
	width: 150px;
	font-size: 90%;
	margin: 10px 35px 0 0;
	float: right;
	color: #FFF;
	text-align: right;
}

.MultiBoxControls {
	width: 95%;
	height: auto;
	position: relative;
	margin: 10px auto;
	padding: 5px 10px 10px 0;
	background-color: #000000;
}


/* /////////////////////////////// Reine Textseiten /////////////////////////////// */

.page #inhalt,
.category-vorteile #inhalt { width: 560px }

.alignleft { float: left; margin: 10px 15px 2px 0 }

.page #inhalt p,
.category-vorteile #inhalt p { margin: 4px 0 }

.category-vorteile #inhalt h2 { width: 300px; height: 17px; background:url(imgs/h2-vorteil.png) 0 0 no-repeat; text-indent: -3000px }

.page-id-13 #inhalt h2 { width: 300px; height: 17px; background:url(imgs/h2-feedback.png) 0 0 no-repeat; text-indent: -3000px }
.page-id-15 #inhalt h2 { width: 300px; height: 17px; background:url(imgs/h2-handel.png) 0 0 no-repeat; text-indent: -3000px }
.page-id-17 #inhalt h2 { width: 200px; height: 17px; background:url(imgs/h2-impr.png) 0 0 no-repeat; text-indent: -3000px }
.page-id-19 #inhalt h2 { width: 550px; height: 17px; background:url(imgs/h2-agb.png) 0 0 no-repeat; text-indent: -3000px }
.page-id-21 #inhalt h2 { width: 300px; height: 17px; background:url(imgs/h2-daten.png) 0 0 no-repeat; text-indent: -3000px }
.page-id-23 #inhalt h2 { width: 300px; height: 17px; background:url(imgs/h2-wider.png) 0 0 no-repeat; text-indent: -3000px }

#neues-konto { width: 550px; height: 17px; background:url(imgs/h2-neu-konto.png) 0 0 no-repeat; text-indent: -3000px }
#forgotpw { width: 550px; height: 17px; background:url(imgs/h2-forgotpw.png) 0 0 no-repeat; text-indent: -3000px }

/* /////////////////////////////// Kontakt /////////////////////////////// */

.category-kontakt #inhalt h2 { width: 350px; height: 17px; background:url(imgs/h2-kontakt.png) 0 0 no-repeat; text-indent: -3000px }

#cformsform ol { width: 440px; overflow: hidden }

	#cformsform li {
		width: 220px;
		float: left
	}
	
	#cformsform .emailreqtxt,
	#cformsform .reqtxt { display: block; font-size: 90%; color: #666 }

	#inhalt input,
	#inhalt textarea {
		color: #888;
		width: 190px;
	}
	
	#li--5 {
		clear: left;
		margin-top: 10px
	}
	
	#inhalt textarea { width: 410px }

		address {
			font-style: normal;
			padding: 20px 0 0px
		}
		
		p label { font-weight: bold }
		
		
		
/* /////////////////////////////// Shop /////////////////////////////// */

.welcome h2 { width: 400px; height: 17px; background:url(imgs/h2-shop.png) 0 0 no-repeat; text-indent: -3000px }


	.produktbox dt { padding: 10px 0 0 105px; font-size: 130% }
	.produktbox dd { padding: 10px 130px 0 105px; font-size: 90% }

		.mb {
			position: absolute;
			left:0;
			top: 0;
			width: 85px;
			height: 160px;
			z-index:9
		}

		.produktbox a {
			text-transform: uppercase;
			color: #282828;
			font-size: 80%;
			text-decoration: none !important
		}
		
		.additional_description_span { margin-top: 15px; line-height: 1.4 }

		.warenkorb input {
			width: 140px !important;
			hight: 28px !important;
			position: absolute;
			bottom: 10px;
			right: 10px;
			text-indent: -3000px;
			border: none !important;
			padding: 0 !important
		}
.pricedisplay,	
.oldprice { display: none }
.product .price {
	width: 99px;
	height: 66px;
	position: absolute;
	right: 5px;
	top: 5px;
	text-indent: -3000px
}

#price_gleit { background: url(imgs/shop-preis-9.png) 0 0 no-repeat }
#price_dmittel { background: url(imgs/shop-preis-7.png) 0 0 no-repeat }
#price_koffer-blank { background: url(imgs/shop-preis-39.png) 0 0 no-repeat }
#price_koffer-normal { background: url(imgs/shop-preis-99.png) 0 0 no-repeat }


/*-------------------------------------------------------------------
	Warenkorb
----------------------------*/
.visitshop { margin: 0px 0 5px 195px }
.visitshop a { display: block; width: 81px; height: 28px; background: url(imgs/button-zum_shop.png) 0 0 no-repeat; text-indent: -3000px }

.gocheckout:hover,
.gocheckout { display: block; width: 121px; height: 25px; border: none; background: transparent }

/*-------------------------------------------------------------------
	Kasse
----------------------------*/
#kasse-title { width: 300px; height: 17px; background:url(imgs/h2-kasse.png) 0 0 no-repeat; text-indent: -3000px }

	.productcart {
		width: 550px;
		background: #1d1b1e url(imgs/bg-sidebar.jpg) center repeat-y;
		position: relative;
		border: 1px solid #434345;
		margin: 0 0 10px 0;
		box-shadow: 5px 2px 10px #0c0c0c;
		-moz-box-shadow: 5px 2px 10px #0c0c0c;
		-webkit-box-shadow: 5px 2px 10px #0c0c0c
	}
		
		.productcart th { text-align: center; padding: 3px 6px; background: #232323; border-bottom: 1px solid #0F0F0F }
		.productcart td { text-align: left; height: 30px; padding: 0 0 0 5px; vertical-align:middle }
		
		#bild,
		#pr-bild {
			width: 48px
		}
	
		#pr-produkt { width: 200px; padding-left: 10px; text-align: left }
		
		#menge,
		.pr-preis,
		#price,
		#delete { text-align: right; padding-right: 5px }
		
		#checkout_shipping,
		.page-id-227 .pricedisplay,
		#endpreis { display: block; text-align: right; padding-right: 5px }
	
		#zahl { width: 25px !important}
		#button-zahl { width: 60px !important}
		
		#endpreis {
			color: white;
			font-size: 120%;
			text-decoration: underline
		}
		
		h4 { 
			padding: 23px 0 15px;
			color: #666;
			clear: left;
			text-decoration: underline
		}
	
	input[type="checkbox"] {width: 15px !important; background: transparent !important}
		
		
/* /////////////////////////////// FAQ /////////////////////////////// */

.page-id-5 #inhalt h2 { width: 400px; height: 17px; background:url(imgs/h2-faq.png) 0 0 no-repeat; text-indent: -3000px }

.page-id-5 #inhalt .title {
	width: 90%;
	line-height: 27px;
	text-indent: 7px;
	margin-top: 2px;
	border-top: 1px solid #333;
	background: #1b1a1c url(imgs/pfeil.png) 3px center no-repeat;
	padding-left: 14px;
	cursor: pointer
}

	.title:hover {
		background: #111 url(imgs/pfeil.png) 3px center no-repeat !important
	}

.antwort {
	margin: 10px 0 20px 15px
}


/* /////////////////////////////// Site-Info /////////////////////////////// */

#site-info {
	width: 100%;
	height: 30px;
	margin-top: 20px;
	background: #131114;
	border-top: 1px solid #333;
	font-size: 70%;
	clear: both
}

	#site-info ul {
		width: 900px;
background: url(imgs/foter-linie.png) 0 0 no-repeat;
padding: 5px 0 0;
		margin: -5px auto 0;
		overflow: hidden
	}

 	#site-info li {
 		float: right;
 		line-height: 30px;
 		padding-right: 10px
 	}
 	
 		#site-info a {
 			color: #555;
 			text-decoration: underline
 		}
 		
 		#site-info a:hover {
 			color: #666;
 			text-decoration: none
 		}
