/* backslash hack for ie mac \*/
html {height:100%; overflow:hidden;}
html body {	overflow:auto}
/* end hack */

body {
	height:100%;
	margin:0;
	background: #f0f0f0 url(../images/portal/back.gif) fixed;
	font-family: Arial, Helvetica, sans-serif;
}

h1 {font-size: 16px; color: #006; padding:0; margin:0; border-bottom:1px solid #ccc;}
h2 {font-size: 14px; color: #039; }
a,p,td,table,ol,ul,li,div {font-size: 13px;}

/* Standard Linkfarben */
a:link {color: #039;}
a:visited {color: #039;}
a:hover {color: #a00;}
a:active {color: #039;}

.klein {font-size: 10px;}
.fettblau {font-size: 13px; font-weight: bold; color: #039;}
.fettrot {font-weight: bold; color: #A00;
}

.blau {font-size: 13px; color: #039;}
.blaugross {font-size: 16px; color: #039;}
strong,b {color: #333;}

/* ******************** Seitenaufbau ******************* */

/* Kopfbalken mit Logo */

#headerdiv {
	position:absolute;
	width:94%;
	height:auto;
	top:0;
	left:0;
	padding-top:0;
	z-index:98;
}

#header {width:98%;
}

#header img {padding-right:15px;}
.picbalken  {background: #039; width:200px; border-top:2px solid #111111;border-bottom: 1px solid #FFFFFF;}
.leerbalken {background: #fff;}
.selbalken {background: #039; text-align:right; border-top:2px solid #111111;border-bottom: 1px solid #FFFFFF;}
.nsystbalken {background: #fff; text-align:right;}

/* Tabelle oder Ebene fuer Seitengestaltung 100% Hoehe, hier Tabelle, da Mozilla sonst beim Scrollen den Weissraum vergisst */

#layout {
	width:90%;
	height:100%;
	overflow:auto;
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
	margin-left:4%;
	background:#fff url(../images/portal/contentback.gif) no-repeat;
	background-position:30px 220px;
	background-attachment: fixed; /* Position fixed wird fuer IE mittels JS pos_fixed.js realisiert */
}

/*********************** Formatierungen Portalebenen ******************/

#box_suchen {
	background:#fff;
	border-style:solid;
	border-width:1px;
	border-color:#F0F0F0 #ABABAB #ABABAB #F0F0F0;
	width:145px;
	margin: 15px 0 0 20px;
	padding:0 0 5px 0;
	z-index:1;
}
#box_suchen form {
	margin:0 0 5px 0;
}
#box_suchen form input {
	width:100px;
	font-size:11px;
}
#box_suchen a {
	font-size:11px;
}


#box_produktwelt_header, #box_login_header, #box_news_header, #box_termine_header, #box_suchen_header, #box_blog_header, #box_wissen_header, #box_gesetze_header {
	background:#F0F0F0;
	color:#A00;
	font-size:11px;
	padding:2px;
}
/* Container für Portalebenen rechts */
#container_rechts {
	padding:80px 20px 0 0;


}

/* Bereich Produktwelt Hotdeals */
#box_produktwelt {
	border-style:solid;
	border-width:1px;
	border-color:#F0F0F0 #ABABAB #ABABAB #F0F0F0;
	width:145px;
	height:180px;
	margin: 15px 0 0 5px;
}

#box_login {
	border-style:solid;
	border-width:1px;
	border-color:#F0F0F0 #ABABAB #ABABAB #F0F0F0;
	width:145px;
	height:auto;
	margin: 0 0 0 5px;
	padding:0 0 5px 0;
	font-size:11px;
}
#box_login form {
	margin:0 0 5px 0;
}
#box_login form input {
	width:100px;
	font-size:11px;
}
#box_login a {
	font-size:11px;
}

#box_news {
	border-style:solid;
	border-width:1px;
	border-color:#F0F0F0 #ABABAB #ABABAB #F0F0F0;
	width:145px;
	height:200px;
	margin: 15px 0 0 5px;
}
#box_termine {
	border-style:solid;
	border-width:1px;
	border-color:#F0F0F0 #ABABAB #ABABAB #F0F0F0;
	width:145px;
	height:170px;
	margin: 15px 0 0 5px;
}
/* Bereich fuer den Inhalt */
#box_blog {
	border-style:solid;
	border-width:1px;
	border-color:#F0F0F0 #ABABAB #ABABAB #F0F0F0;
	width:100%;
	height:auto;
	margin: 0 0 0 5px;
}
#box_wissen {
	border-style:solid;
	border-width:1px;
	border-color:#F0F0F0 #ABABAB #ABABAB #F0F0F0;
	width:100%;
	height:auto;
	margin: 15px 0 0 5px;
}
#box_gesetze {
	border-style:solid;
	border-width:1px;
	border-color:#F0F0F0 #ABABAB #ABABAB #F0F0F0;
	width:100%;
	height:auto;
	margin: 15px 0 0 5px;
}

#content {
	padding:80px 20px 40px 0;
	margin:0 20px 0 205px;
	width:auto;
	z-index:200;
	line-height:140%;
} 

#content .bildlinks, #content .bildrechts
{
	margin-bottom:15px;
	font-size:10px;
	font-weight:bold; 
	color:#999; 
	background:none;
	/* width:auto; */
}
	
#content .bildrechts, #content .bildrechts_or {float:right; margin-left:15px;}
#content .bildlinks, #content .bildlinks_or {float:left; margin-right:15px;}

#content .bildlinks img, #content .bildrechts img {
	display:block;
	border-style:solid groove groove solid;
	border-width:1px 3px 3px 1px;
	border-color:#CCCCCC;
}
#content .bildlinks_or img, #content .bildrechts_or img { /* Fuer Bilder ohne Rahmen/Schattierung */
	display:block;
}

.clear {clear:both;}

/* Fusszeile mit Links */

#footerdiv {position:fixed; /* fuer IE5 */
	left:0;
	bottom:-1px;
	margin-top:-24px;
	width:94%;
	height:auto;
	voice-family: "\"}\""; 
	voice-family:inherit;
	position:absolute; /* fuer IE6 */
	z-index:99;
}
	
	
#footer {
background:#039 url(../images/portal/footer.gif) repeat-x bottom;
text-align:right;
height:24px;
padding:0 10px 4px 0;
width:98%;
border-top:2px solid #111;}

#footer .copy {text-align:left;
color:#fff;
background:none;
padding:0 0 4px 70px;}

#footer a {
color:#fff;
background:transparent url(../images/portal/pfeil_re.gif) 0 5px no-repeat;
text-decoration:none;
padding:0 25px 0 12px;
}
#footer a:hover {
color:#fff;
background:transparent url(../images/portal/pfeil_re.gif) 0 -38px no-repeat;
text-decoration:none;
}
#footer a.aktiv {
color:#fff;
background:transparent url(../images/portal/pfeil_re.gif) 0 -38px no-repeat;
text-decoration:none;
}
/***********************************************************************************/
/******  Formate aus dem Shop. Die kommen nachher in eine separate CSS-Datei *******/
/***********************************************************************************/

caption {padding: 2px 0 3px 7px; /* Ueberschrift der auesseren Tabellen */
color:#333;
background:#ECECEC url(../images/backgrounds/caption_bos.gif);
margin:0;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-align:left;
font-size:13px;
letter-spacing:2px;
}

.taba {border-collapse: collapse;
	border: 1px solid #ccc;}
.taba table {border-collapse: collapse;
	border: none;}

.taba td {border: 1px solid #ccc;}
.taba td td {border: none; }
.taba td td td {border: none;}
.taba a {text-decoration:none;}
.taba .tabi {border-collapse: collapse;
	border: none;}
.taba .tabi td {border: 1px solid #ccc;}
.taba .tabi td td {border: none;}

.ausgabezelle {  background-color: #F0F0F0} /* Hinterlegung von Tabellenzeilen */

/* Grafische Buttons Hovereffekt */
a img {
	border: 1px solid #FFF;
}
a:hover img {
	border: 1px solid #A00;
}

/* Grafische Buttons Hovereffekt im Header ausschalten */
#headerdiv a img {
	border: none;
}
#headerdiv a:hover img {
	border: none;
}

.preis /* Standardpreis eines Produktes */
{
font-size:8pt;
text-align:right;
}
.vorpreis /* ehemaliger Preis eines Produktes, durchgestrichen */
{
text-decoration: line-through;
font-size:8pt;
text-align:right;
}
.sonderpreis /* Sonderpreis eines Produktes, rot */
{
color:#990000;
font-size:8pt;
text-align:right;
}

fieldset {
	padding: 10px;
	/* Transparenz 
	-moz-opacity: 0.7;
	filter: alpha(opacity=70);*/ 
	background: #F6F6F6;
}

legend {
	font-weight:bold;
	color:#666;
	padding: 0 3px;
}

.buttshop, .formbutton { color:#000; background: url(../images/backgrounds/buttshop.gif) repeat-x; border: 1px solid #888 !important;} /* important, da sonst in inneren Tabellen die Rahmen der Buttons durch taba td td ausgeblendet werden */
input, textarea { background: #FDFDEC;  /*url(../images/backgrounds/input.gif) no-repeat top left;*/
border: 1px solid #888;
padding:1px 2px;
}
input:focus, textarea:focus {background:#E5F3F3;} /* Highlight der aktiven Formularfelder CSS2 */  


/* Links in den Kategorien */
#katlinks /* Navigationsebene und Links in den Produktkatalogen */
{  
	width:60%;
	margin: 10px 0;
	line-height:130%;
}

#katlinks a {font-size:11px;}

#katlinks a:link, #katlinks a:visited
{  	
	background: #EEE url(../images/backgrounds/bos_kat_an.gif) right center no-repeat;			
	display:block;
	padding:2px 0 2px 5px;
	border-style:solid;
	border-width:1px 1px 1px 3px;
	border-color:#FFF #BBB #BBB #FFF;
	text-decoration:none;
	width:100%;
}

#katlinks a:hover 
{  
	color:#A00;
	background:#EEE url(../images/backgrounds/bos_kat_ah.gif) right center no-repeat;
	padding:3px 0 1px 6px;
	border-style:solid;
	border-width:1px 1px 1px 3px;
	border-color:#BBB #FFF #FFF #A00;
	text-decoration:none;

}
#katlinks a:active 
{ 	
	color:#A00;
	display:block;
	padding:3px 0 1px 6px;
	border-style:solid;
	border-width:1px 1px 1px 3px;
	border-color:#BBB #FFF #FFF #A00;
	text-decoration:none;
}
/* Container fuer die Hotdeals */
#hotdeals_vertikal /* Hotdeals vertikal rechts neben den Kategorie-Links*/
{
	border: 1px dotted #A00;
	float:right;
	margin:8px 0 0 0;
	padding: 5px;
	width:30%;
	height:auto;
	line-height:120%;
}

#hotdeals_horizontal /* Hotdeals horizontal unter den Kategorie-Links*/
{
	border: 1px dotted #A00;
	margin:25px 0 0 0;
	padding: 5px;
	width:60%;
	height:auto;
}

#hotdeals_vertikal h1, #hotdeals_horizontal h1
{
	font-size:12px;
	color:#FFF;
	background:#A00;
	margin:0;
	padding:0 4px;
}

#hotdeals_vertikal .text
{
	font-size:10px; padding:2px 2px 8px 2px;
}

#hotdeals_horizontal .text
{
	font-size:10px; padding:2px;
	vertical-align:top;
}

#hotdeals_vertikal .bild
{
	padding:2px;
	text-align:center; /* richtet Bilder zentriert aus */
}

#hotdeals_horizontal .bild
{
	padding:2px;
}


.breadcrumb, .breadcrumb a /* Brotkruemel-Navigation in den Preisbuechern und Artikellisten */
{font: 10px Arial, Helvetica, sans-serif;
text-decoration:none;
margin:10px 0 5px 0;} 

.forminfo /* Anweisung oder zweite Ueberschrift in Formularen */
{
font-family: Verdana, Arial, Helvetica, sans-serif;
background:#888888;
color:#F0F0F0;
font-weight:bold;
padding:2px;
letter-spacing:2px;}

.info {color:#A00;} /* Style zum Hervorheben von wichtigen Textstellen, Sternchen in Formularen etc */

.trenner /* Linien zwischen Absaetzen */
{
background: url("../images/backgrounds/trenner.gif") repeat-x;
}