/*

	Basis-CSS-Datei der Internetseite

	http://www.tao.info

	Autor:				Stefan Diezinger - http://www.surfAN-GmbH.de
	Start:				18.06.07
	Letzte Aenderung:	17.03.08

*/

@media all {

	/*  Allgemein
	---------------------------------- */

	q {
		quotes: '„' '“' '‚' '‘';
	}

	img, frame, fieldset {
		border: 0;
	}

}


@media screen, projection {

	/*  Allgemein
	---------------------------------- */

	* {
		margin: 0;
		padding: 0;
		background: none;
		background-repeat: no-repeat;
		background-position: top left;
		outline: none;
	}
	
	table {
		margin: inherit !important;
	}

	table, ul, li {
		border:0;
	}

	ul {
		list-style-image:url(lib.design/navigation.listpunkt.png);
	}

	html {
		font: 76%/1.8 "verdana", "arial", "helvetica", "trebuchet ms", sans-serif;
	}

	html, body {
		height: 100%;
		min-height: 100%;
		direction: ltr;
		cursor: default;
		text-align: left;
		background-color: #fff;
		color: #000;
	}

	hr {
		border:none;
		background-color:#777777;
		width:100%;
	}

	.content table {
		margin-top:0;
		padding-top:0;
	}

	body {
		height: 100.01%;
		min-height: 100.01%;
	}

	q {
		quotes: '„' '“' '‚' '‘';
	}

	.versteckt,
	.druck,
	input[type="hidden"] {
		display: none !important;
		visibility: hidden !important;
	}

	.sichtbar {
		display: block;
		visibility: visible;
	}

	.mittig {
		text-align: center;
	}

	.links {
		float: left;
		text-align: left;
	}

	.rechts {
		float: right;
		text-align: right;
	}

	.groesser {
		font-size: larger;
	}

	.kleiner {
		font-size: smaller;
	}

	.clear {
		clear: both;
	}
	
	.fett {
		font-weight: bold;
	}

	.nomargin {
		margin: 0;
	}

	.inline {
		display: inline;
	}

	/*  Elemente
	---------------------------------- */

	h1 { font-size: 2.5em; }

	h2, h3 { line-height: 1.2; }

	h2 { font-size: 1.9em; margin: .6em 0 .6em 0; color: #77787B; font-family: "verdana", "arial", "helvetica", sans-serif; font-weight: normal; }

	h3, h4, h5 { margin: .8em 0; }

	h3 { font-size: 1.3em; color: #000; }

	h4 { font-size: 1em; font-weight: bold; color: #222; }

	h5 { font-size: 1.1em; color: #a0d071; }

	h6 { margin: 0; padding: 0; font-size: 1em; text-transform: uppercase; letter-spacing: 1px; }

	h1, h2, h3, h4, h5, h6 { clear: both; }

	p, address, blockquote, ul, ol, dl, dt, pre { margin: 1.6em 0; }

	address, cite, var, abbr { font-style: normal; }

	blockquote { padding: 0 2.5em; }

	blockquote + blockquote { margin-top: 2em; }

	ul, ol, dd { margin-left: 2.5em; }

	ul { list-style-image: url("listpunkt.png"); }

	ul ul, ol ol { margin: .1em 0 .15em 1.75em; }

	dd pre { margin: 0; }

	/*th, td, form { padding: 5px 3px; vertical-align: baseline; }*/

	th { text-align: left; }

	label, a { cursor: pointer; }

	pre, code, var, kbd { font-family: "lucida console", monaco, "courier new", "courier", monospace; }

	abbr[title] { cursor: help; border-bottom: #000 dotted 1px; }

	dt { padding: 0 1em 0 0; margin: 0; font-size: 1em; font-weight: bold; }

	dt:after { content: ":"; }

	blockquote {
		font-style: oblique;
		font-size: 1.1em;
		font-family: Georgia, "Times New Roman", Times, serif;
		background: url("zitat.png") no-repeat;
		padding-left: 30px;
		margin-bottom: 1.5em;
	}

	blockquote p {
		margin: 0;
		padding: 0;
	}

	blockquote cite {
		float: right;
		font-style: oblique;
		font-weight: bold;
	}

	textarea {
		font: 100%/1.8 "verdana", "arial", "helvetica", "trebuchet ms", sans-serif;
	}


	/*  Layout
	---------------------------------- */

	html {
		background: #333 url("body.hintergrund.jpg") center top repeat-x;
	}

	body {
		background: #333 url("body.hintergrund.jpg") center top repeat-x;
		color: #fff;
	}

	#container {
		background: #525252;
		border: 1px solid #666;
		width: 965px;
		top: 24px;
		left: 50%;
		position: absolute;
		margin-left: -482px;
	}

	#top {
		width: 965px;
		background: #000;
		border-bottom: 1px solid #666;
		width: 100%;
		height: 30px;
		font-size: 0.8em;
	}

	#middle {
		background: url("foto.2.jpg") no-repeat;
		width: 100%;
		height: 480px;
		font-size: 0.8em;
	}

	#bottom {
		padding: 5px 7px 4px 7px;
		border-top: 1px solid #333;
		font-size: 0.8em;
		height: 21px;
		color: #bbb;
		background: #000;
	}

	#content-header {
		position: absolute;
		right: 25px;
		bottom: 381px;
		width: 518px;
		background: #333;
		border: 1px solid #333;
		border-left: 2px solid #333;
		padding: 5px 10px;
		height: 17px;
	}

	#content-header h2,
	#content-header h3 {
		color: #fff !important;
		margin: 0;
		padding: 0;
		font-size: 1.3em;
		line-height: 1.3em;
		font-weight: bold;
	}

	#content-header h3 {
		float: right;
		position: relative;
		top: -17px;
		text-align: right;
		width: auto;
		padding-right: 5px;
	}

	#content-breadcrumb {
		position: absolute;
		right: 25px;
		bottom: 352px;
		width: 520px;
		background: url("transparenz.png") repeat;
		border-top: 1px solid #666;
		border-left: 1px solid #666;
		padding: 5px 10px;
		color: #000;
	}

	#content {
		position: absolute;
		right: 25px;
		bottom: 0%;
		background: url("transparenz.png") repeat;
		color: #000;
		width: 520px;
		height: 311px;
		border-left: 1px solid #666;
		padding: 5px 10px;
		overflow: auto;
		margin-bottom: 31px;
	}

	/*  Links
	---------------------------------- */

	a {
		color: #fff;
		text-decoration: none;
	}

	a:hover,
	a:focus {
		color: #fff;
		#border-bottom: 1px solid #fefefe;

	}

	.system {
		font-weight:bold;
		text-decoration:none;
	}


	#content-breadcrumb a,
	#content-breadcrumb a:visited,
	#content a,
	#content a:visited {
		color: #4B7CA5;
		text-decoration: none;
		border-bottom: 1px dotted #4B7CA5;
	}

	#content-breadcrumb a:hover,
	#content-breadcrumb a:focus,
	#content a:hover,
	#content a:focus {
		color: #4B7CA5;
		border-bottom: 1px solid #4B7CA5;
	}

	#logo a,
	#logo a:hover,
	#logo a:focus,
	#language a,
	#language a:hover,
	#language a:focus {
		border: 0;
	}

	a.aktiv,
	a.aktiv:hover,
	a.aktiv:focus,
	a.aktiv:active,
	a.aktiv:link,
	a.aktiv:visited,
	a.keinlink,
	a.keinlink:hover,
	a.keinlink:focus,
	a.keinlink:active,
	a.keinlink:link,
	a.keinlink:visited {
		font-weight: bold !important;
		color: #000 !important;
		text-decoration: none !important;
		cursor: default !important;
		border: 0 !important;
	}

	/*  Navigation
	---------------------------------- */

	/* Erste Ebene */

	#navigation {
		font-size: 1.2em;
	}

	#navigation ul,
	#navigation ul li {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	#navigation ul li {
		float: left;
		padding-top: 5px;
		padding-left: 0.3em;
		padding-right: 0.5em;
		padding-bottom: 4px;
	}

	#navigation ul li ul,
	#navigation ul li ul li,
	#navigation ul li ul li a ,
	#navigation ul li ul li ul,
	#navigation ul li ul li ul li,
	#navigation ul li ul li ul li a {
		padding: 0;
	}

	#navigation ul li a {
		display: block;
		width: auto;
		border: 0;
		background: url("navigation.listpunkt.png") center left no-repeat;
		padding-left: 15px;
	}

	#navigation ul li a:hover {
		border: 0;
	}

	#navigation ul li:hover,
	#navigation ul li ul li a:hover {
		background: #222;
		color: #fff;
	}

	/* Generelle Unterebenen */

	#navigation ul li ul,
	#navigation ul li ul li ul {
		display: none;
		background: #000;
		border-left: 1px solid #333;
		border-right: 1px solid #333;
	}

	#navigation ul li ul li a,
	#navigation ul li ul li ul a {
		background: none;
		color: #ccc;
		font-size: 95%;
	}

	#navigation ul li ul li,
	#navigation ul li ul li ul li {
		float: none;
		width: 175px;
		height: 23px;
		padding: 0;
		margin: 0;
		border-bottom: 1px solid #333;
	}

	/* Zweite Unterebene */

	#navigation ul li:hover ul,
	#navigation ul li a:hover ul {
		display: block;
		position: absolute;
		top: 29px;
		z-index: 9999;
		margin-left: -4px;
	}

	/* Dritte Unterebene */

	#navigation ul li:hover ul li ul,
	#navigation ul li a:hover ul li ul {
		display: none;
	}

	#navigation ul li:hover ul li:hover ul,
	#navigation ul li a:hover ul li a:hover ul {
		display: block;
		position: relative;
		left: 160px;
		top: -21px;
		border-top: 1px solid #333;
	}

	#navigation ul li:hover ul li:hover ul li,
	#navigation ul li a:hover ul li a:hover ul li {
		width: 175px;
	}

	/* Zusatz */

	#subnavpoint-running,
	#subnavpoint-layersystem,
	#subnavpoint-veranstaltungsplan,
	#subnavpoint-geschichte,
	#subnavpoint-haendlersuche,
	#subnavpoint-faqs,
	#subnavpoint-kundenlogin {
		border-top: 1px solid #333;
	}

	#subnavpoint-running a,
	#subnavpoint-multisports a,
	#subnavpoint-underwear a {
		background: url("listpunkt.png") center right no-repeat !important;
	}

	#subnavpoint-running ul li a,
	#subnavpoint-multisports ul li a,
	#subnavpoint-underwear ul li a {
		background: inherit !important;
	}

	#subnavpoint-running,
	#subnavpoint-multisports,
	#subnavpoint-underwear {
		border-bottom: 1px solid #333 !important;
	}

	#navigation ul li ul li a,
	#navigation ul li ul li ul li a {
		padding-left: 5px;
	}


	/*  Layout Details
	---------------------------------- */

	#logo a {
		position: absolute;
		top: -17px;
		left: 756px;
		display: block;
		width: 184px;
		height: 142px;
		text-indent: -9999em;
		background: url("logo.tao.jpg") no-repeat;
	}

	#logo p {
		display: inline;
	}

	#language {
		position: absolute;
		top: 7px;
		left: 650px;
		width:90px;
		text-align:right;
	}


	#sprachwahl {
		position: absolute;
		top: 7px;
		right: 225px;
		z-index:5;
		border:solid 1px #FFFFFF;
		background-color:#6C6C6C;
	}

	#sprachwahl ul {
		list-style: none;
		list-style-image:none;
		margin: 0;
		padding: 5;
	}

	#sprachwahl ul li {

	}

	#sprachwahl ul li a {
		padding-left: 11px;
		padding-right: 11px;
		padding-top: 5px;
		padding-bottom: 5px;
		text-indent: 30px;
		display: block;
		border:none;
	}

	#sprachwahl ul li a:hover {
		background-color:#333333;
		border:none;
	}

	#sprachwahl ul li#german a {
		background-image:url('language.deutsch.jpg');
		background-position:5px 5px;
		background-repeat:no-repeat;
	}

	#sprachwahl ul li#english a {
		background-image:url('language.english.jpg');
		background-position:5px 5px;
		background-repeat:no-repeat;
	}

	#sprachwahl ul li#french a {
		background-image:url('language.francais.jpg');
		background-position:5px 5px;
		background-repeat:no-repeat;
	}

	#sprachwahl ul li#netherlands a {
		background-image:url('language.nederlands.jpg');
		background-position:5px 5px;
		background-repeat:no-repeat;
	}

	p.copyright {
		margin: 0;
		padding: 0;
	}

	#loginformular {

	}

	#loginformular fieldset legend {
		display: none;
	}

	#loginformular label {
		width: 70px;
		display: block;
		float: left;
	}

	#loginformular ol {
		margin: 0;
		padding: 0;
		margin-left: 30%;
	}

	#loginformular ol li {
		list-style: none;
		height: 40px;
	}

	input, textarea, select, option {
		font-family: Verdana, Arial, sans-serif;
	}

	option {
		background: #ccc;
	}

	input[type="submit"] {
		font-weight: bold;

		font-size: 10px;
	}

	#registrierungsformular fieldset {
		/*border: 1px solid #666;*/
		margin: 10px 0;
		margin-left: 20%;
	}

	#registrierungsformular fieldset legend {
		/*display: none;*/
		font-weight:bold;
	}

	#registrierungsformular label {
		/*width: 120px;*/
		display: block;
		/*float: left;*/
	}

	#registrierungsformular ol {
		margin: 0;
		padding: 0;
	}

	#registrierungsformular ol li {
		list-style: none;
		height: 40px;
	}

	/*select,
	input,
	textarea {
		border: 1px solid #999;
	}*/

	.neuigkeitenmehrlink {
		background: url(navigation.listpunkt.png) no-repeat center left;
		padding-left: 15px;
		font-weight: bold;
	}

	.eventsMehrLink {
		background: url(navigation.listpunkt.png) no-repeat center left;
		padding-left: 15px;
	}

	.newsticker {
		padding:0px;
		margin:0px;
	}

	 .newsticker li {
		margin-left:20px;
	}

	#facebook-button {
		position: absolute;
		left: 8px;
		bottom: 34px;
	}
	
	#facebook-button a {
		margin: 0;
		padding: 0;
		border: 0;
	}
	
	#partnertabelle {
		width: 100%;
	}
	
	/*#partnertabelle tr {
		cursor: pointer !important;
	}*/
	
	#partnertabelle tr.hover td {
		background: #ECECEC;
	}
		
	#partnertabelle .logo a,
	#partnertabelle .logo a img {
		border: 0;
	}
	
	#partnertabelle .mehr {
		display: none;
	}
	
	#partnertabelle .name {
		font-weight: bold;
	}
	
	#partnertabelle .logo {
		text-align: right;
		padding-right: 10px;
	}
	
	#partnertabelle.tabelle td {
		border-right: 0;
	}

	#partnertabelle.tabelle td:first-child {
		border-left: 0;
	}

	/*  Produktübersicht
	---------------------------------- */

	.produktuebersicht ul,
	.produktuebersicht ul li {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.produktuebersicht ul li {
		float: left;
		margin: 2px;
		padding: 10px;
	}

	.produktuebersicht ul li a:hover {
		cursor: pointer !important;
	}

	/*  Produktansicht
	---------------------------------- */

	.produktansicht {
		margin: 10px;
	}

	.produktansicht .rechts p {
		margin-top: 0;
		margin-bottom: 0;
	}

	.produktansicht h4 {
		display: inline;
		margin-top: 2em;
	}

	.produktansicht .preis {
		font-size: 1.2em !important;
		font-weight: bold;
		color: #000;
	}

	.produktansicht .rot {
		color: #CC0000 !important;
	}

	.produktansicht .gruen {
		color: #00CC33 !important;
	}

	.bestellen {
		background: url("../lib.fotos/hintergrund.bestellen.png") no-repeat;
		color: #9BC3E7;
		font-family: "verdana", "arial", "helvetica", "trebuchet ms", sans-serif;
		font-weight: bold;
		width: 105px;
		height: 28px;
	}

	.bestellen:hover {
		color: #fff;
	}

	#tooltip {
		position: absolute;
		z-index: 1000;
		text-align: left;
		background-color: #fff;
		border: 1px solid #4B7CA5;
		padding: 4px;
		font-size: 10px;
		color: #000;
		width: auto !important;
		max-width: 250px;
	}

	#tooltip h3, #tooltip div { margin: 0; }

	#tooltip h3 {
		font-size: 10px;
		font-weight: bold;
	}

	.produktgruppe {
		border: 1px solid #fff;
		padding: 3px;
		text-transform: uppercase;
	}

	.isolation {
		background: #EF512D;
	}

	.dryskin {
		background: #FFD736;
	}

	.protector {
		background: #971F3C;
	}

	.temperaturanzeige {
		width: 245px;
		height: 80px;
		background: url("../lib.fotos/hintergrund.temperatur.png") top no-repeat;
	}

	.temperaturanzeige p {
		position:relative;
		top:15px;
	}

	span.temperaturzeiger {
		background: url("../lib.fotos/temperaturzeiger.png") top center no-repeat;
		width: 30px;
		height: 20px;
		display: block;
		padding-top: 20px;
		margin-left:-10%;
		position:relative;
	}

	.floatKorrektur {
		position:relative;
		top:-20px;
	}

	.form {
		background-color:#FFFFFF;
		font: 9.5px "verdana", "arial", "helvetica", "trebuchet ms", sans-serif;
		border: solid 1px #777777;
		padding:1px;
	}

	.drucklogo {
		display:none;
	}

	ul#farbwahl,
	ul#farbwahl li {
		margin: 0;
		padding: 0;
		list-style: none;
		text-align: left;
	}

	ul#farbwahl {
		margin-left: 0px;
	}

	ul#farbwahl li {
		padding: 2px;
	}

	ul#farbwahl li a,
	ul#farbwahl li a:hover,
	ul#farbwahl li a:active,
	ul#farbwahl li a:visited,
	ul#farbwahl li a:focus {
		border: 0;
	}

	ul#farbwahl li a img {
		position: relative;
		bottom: -4px;
	}



	/*  Tabellen
	---------------------------------- */

	.tabelle {
		margin-bottom: 0.5em;
		font-size: 0.9em;
		margin-top: 0;
		padding-top: 0;
	}

	.tabelle caption {
		padding: 0;
		text-align: right;
		font-style: oblique;
		margin-bottom: 0;
		padding-bottom: 0;
	}

	.tabelle th {
		font-weight: bold;
		color: #666;
		border-right: 1px solid #cbcbcb;
		border-bottom: 1px solid #cbcbcb;
		border-top: 1px solid #cbcbcb;
		letter-spacing: 2px;
		text-align: left;
		padding: 6px;
		font-size: 0.9em;
		background: #d7f4bc url("../lib.grafiken/hintergrund.tabellenkopf.png") repeat-x;
	}

	.tabelle td {
		border-right: 1px solid #cbcbcb;
		border-bottom: 1px solid #cbcbcb;
		padding: 6px;
		color: #444;
		vertical-align: top;
	}


	.tabelle td.alt {
		background: #edffdc;
		color: #797268;
	}

	.tabelle th:first-child,
	.tabelle td:first-child {
		border-left: 1px solid #cbcbcb;
	}

	.tabelle tr:first-child td,
	.tabelle tr:first-child th {
		border-top: 1px solid #cbcbcb;
	}

	.header {
		background-repeat: repeat-x !important;
	}

	.linieOben {
		border-top: solid 1px #777777;
	}

	.layerSystemFloat {
		float: left;
		width: 220px;
	}

	/*  Icons
	---------------------------------- */
	
	.icon {
		background-image: url("piktogramm.jpg.gif");
		background-position: center left;
		background-repeat: no-repeat;
		padding: 3px;
		padding-left: 23px;
		line-height: 20px;
	}
	
	.pdf { list-style-image: url("piktogramm.pdf.gif"); }
	.zip { list-style-image: url("piktogramm.zip.gif"); }
	.rar { list-style-image: url("piktogramm.zip.gif"); }
	.xls { list-style-image: url("piktogramm.xls.gif"); }
	.doc { list-style-image: url("piktogramm.doc.gif"); }
	.jpg { list-style-image: url("piktogramm.jpg.gif"); }
	.gif { list-style-image: url("piktogramm.jpg.gif"); }
	.png { list-style-image: url("piktogramm.jpg.gif"); }
	
	
	/*  Clearfix
	---------------------------------- */

	.clearfix:after {
	    content: ".";
	    display: block;
	    height: 0;
	    clear: both;
	    visibility: hidden;
	}

	.clearfix {display:inline-block;}
	/* Hide from IE Mac \*/
	.clearfix {display:block;}
	/* End hide from IE Mac */


}



@media print {

	.versteckt,
	p.img,
	#navigation,
	#brotkrume,
	#language,
	#bottom,
	#produktlogo,
	#auswahlform,
	.skip,
	#header-picture,
	.tooltip,
	.screen {
		display: none;
	}

	.temperaturzeiger {
		background: none;
		width: auto;
		height: auto;
		display: inline;
		position: static;
		float: none;
	}

	img {
		background: transparent !important;
	}

	body {
		font: 78%/150% "verdana", "arial", "helvetica", "trebuchet ms", sans-serif;
	}

	h1 a, h2 a, h3 a {
		color: #000 !important;
		text-decoration: none !important;
	}

	.mittig {
		text-align: center;
	}

	.links {
		float: left;
		text-align: left;
	}

	.rechts {
		float: right;
		text-align: right;
	}

	.groesser {
		font-size: larger;
	}

	.kleiner {
		font-size: smaller;
	}

	a,
	a:link,
	a:visited,
	a:hover,
	a:active {
		color: #4B7CA5;
		text-decoration: none;
	}

	.linieOben {
		border-top: 0;
	}

	h1 {
		margin-bottom: 70px;
	}

	.brotkrume {
		margin-bottom: 20px;
	}

	#drucklogo {
		position: relative;
		top: -105px;
	}

	.layerSystemFloat {
		width: 100%;
		display: block;
		clear: both;
	}

}