
/*******************************************
* Allgemeine Formatierungen
********************************************/

/* LUKAS: Hintergrund auch für html Element gesetzt, ist das erlaubt? */
html {
    background-color:rgb(230,230,230);
	background-image:url(../images/bg_shadow_v2.gif);
	background-repeat:repeat-y;
	background-position:center top;
}

body {
	background-color:rgb(230,230,230);
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-image:url(../images/bg_shadow_v2.gif);
	background-repeat:repeat-y;
	background-position:center top;
	margin:0;
	padding:0;
}

div#doc {
	width:900px;
	padding:0 0 40px 0;
}

/*
    Link-Farben anpassen.
*/
a:focus     {outline: none;}
a:link      {color: rgb(255,180,0); text-decoration: none;}
a:visited   {color: rgb(255,180,0); text-decoration: none;}
a:hover     {color: rgb(255,180,0); text-decoration: underline;}
a:active    {color: rgb(255,180,0); text-decoration: underline;}


strong { font-weight: bold; }
p.paragraph { margin-top: 1em; }

ul.list, ul.star {
    list-style:square inside;
    padding-bottom: 0.8em; padding-top:0;
	margin:0;
}

ul.list li, ul.star li {
    margin-left: 0;
}

.bold {
	font-weight:bold;
}

#ft {
}


/*
    berschriften anpassen.
*/


h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
}



/* NEU: AGB Hauptberschrift, Impressum Hauptberschrift */
h1 {
	font-size:1.5em;
	font-weight: normal;
	color:rgb(160,160,170);
	border-bottom: 1px solid rgb(255,210,0);
	padding:0 0 0.2em 0;
	margin:0 0 12px 0;
}

/* NEU: berschrift innerhalb von Formularen (z.B. Katalog-Seite/Kontaktseite) */
h2 {
	font-size:16px;
    color:rgb(100,100,100);
	border-bottom:1px solid rgb(255,210,0);
	padding:0 0 0.2em 0;
	margin:3em 0 1em 0;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}

/* NEU: Ueberschrift des Artikel-Namens, Katalog-Name in catalog.ftl */
h3 {
	font-size:1.1em;
	color:rgb(170,170,170);
	font-weight: bold;
	border-bottom: 1px solid rgb(255,200,0);
	border-top: 1px solid rgb(255,200,0);
	margin:0 0 1em 0;
	padding:0;
}

/* NEU: Online Preis-Kalkulation
h4 {
	font-size: 125%;
	margin-bottom: 0.4em;
	letter-spacing: -0.03em;
	font-weight: bold;
	line-height: 1.2em;
} */

h4 {
	font-size:125%;
	margin:0 0 0.4em 0;
	letter-spacing: -0.03em;
	font-weight: bold;
	line-height: 1.2em;
	color:rgb(60,60,60);
	border-left:8px solid rgb(255,210,0);
	padding:0 0 0 6px;
}


/*h5 {
	font-size: 120%;
	margin: 2em 0 1em 0;
	border-bottom: 1px dashed #bbb;
}*/

/* NEU: AGB Unterberschrift, Rechtliche Hinweise Unterberschrift, Hinweise zur Suchfunktion */
h5 {
	font-size:1.1em;
    padding:16px 0 0.6em 0;
	color:rgb(80,80,80);
}



/*******************************************
* Header
********************************************/


/* mini-navi (AGB / Impressum) */

div#logoandmenu {
	position:relative; z-index:200;
	width:900px;
	padding:8px 0 12px 0;
	overflow:visible;
}

* html div#logoandmenu {
	height:141px;
	overflow:visible;
}

div#mini-navi {
	position:absolute; top:16px; left:16px;
	height:15px;
	line-height:15px;
	text-align:left;
	width:120px;
	font-size:11px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:rgb(160,160,170);
	white-space:nowrap;
}

#mini-navi a {
	color:rgb(160,160,170);
}

div#searchbox {
	position:absolute; top:16px; right:18px;
	text-align:right;
	vertical-align:top;
	width:275px;
}

div#searchbox input {
	padding:0;
	margin:0 0 0 -3px;
	border:0;
}

div#searchbox input.text {
	float:left; overflow:hidden;
	width:150px;
	height:18px;
	line-height:14px;
	padding:3px 2px 1px 5px;
	border:0;
	background-color:rgb(235,235,235);
	vertical-align:top;
	margin:1px 0;
	font-size:11px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}

#div-logo {
	position:absolute; top:62px; left:16px;
}

div#menu-container {
	position:absolute; top:96px; right:18px;
	width:662px;
}

div#hint {
	position:absolute; top:46px; right:16px;
	width:500px;
    text-align:right;
	line-height:13px;
	font-size:10px;
}

#hint a {
    color:rgb(160,160,170);
}


/*******************************************
* Footer
********************************************/

div#notfound {
    color:rgb(255,255,255);
	background-color:rgb(255,200,0);
	padding:16px 0 16px 0;
	text-align:center;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	line-height:16px;
}

div#notfound a {
	color:rgb(70,70,70);
	font-size:14px;
	text-decoration:underline;
}

div#notfound a:hover {
	color:rgb(255,70,70);
}



/*******************************************
* Formulare
********************************************/

form#quote {
	width:100%;
}

table.wwFormTable, table.wwFormTable table, table.wwFormTable h2 {
    width: 100%;
	text-align:left;
}

table.headline td {
	text-align:left;
}

/* Abstnde zwischen den Zeilen des Formulars vergrern */
table.wwFormTable td, table.kundendaten td {
	padding-bottom:6px;
}

/* Linke Spalte der Formular mit den Beschriftungen */
table.wwFormTable td.tdLabel {
    /* Text mit der Oberkante der Eingabefelder ausrichten */
    vertical-align: top;
    /* Abstand zwischen Beschriftung und Eingabefeldern */
    padding-right: 4px;
}

div#artikelanfrage .wwFormTable .tdLabel {
	white-space:nowrap;
	width:140px;
	text-align:left;
}

div#kontaktformular .wwFormTable .tdLabel {
	text-align:left;
	white-space:nowrap;
	width:70px;
}

/* Fehlermeldungen rot einfrben */
table.wwFormTable span.errorMessage, ul.errorMessage span {
    display: block;
    text-align: left;
    color: #CC4D00;
}

ul.errorMessage span {
    margin-bottom: 2em;
    margin-top: 1em;
}

/*
    Info-Tabellen in Impressum und bei Kontaktdaten anpassen.
*/

table.info {
	width:100%;
}

table.info h3 {
    color:rgb(255,190,0);
 	text-align: left;
	vertical-align: top;
    text-transform: uppercase; /* linke Spalte in Grossbuchstaben */
    font-weight: bold;
	line-height:20px;
	margin:6px 0 4px 0;
	padding:0;
	border:0;
	font-size:12px;
}

table.info td {
	font-family:Verdana, Arial, Helvetica, sans-serif;
}

table.info .label {
    color:rgb(255,190,0);
 	text-align: left;
	vertical-align: top;
    text-transform: uppercase; /* linke Spalte in Grossbuchstaben */
    font-weight: bold;
	line-height:1.3em;
	margin:6px 0 6px 0;
	padding:0 12px 0 0;
	width:70px;
}

table.info td {
	width:100%;
}

table.info .spacer {
	padding-top:8px;
}

table.info p.small {
	padding-bottom:0;
	font-size:10px;
}

div#impressum, div#artikelanfrage {
}

div#impressum p.important {
	padding-top:30px;
	font-size:12px;
	line-height:16px;
}

div#impressum td {
}

#kontaktformular {
	padding-top:0;
}

#kontaktformular input, #quote input, #quote #quote_item_name {
	font-size:12px;
	border:0;
	background-color:rgb(255,252,220);
	width:320px;
	padding:1px 2px 1px 4px;

}

#kontaktformular textarea {
	font-size:12px;
	border:0;
	background-color:rgb(255,252,220);
	width:320px;
	padding:4px 4px 8px 4px;
	overflow:auto;
}

#kontaktformular td.senden input, #quote td.senden input {
	font-size:0;
	line-height:0;
	border:0;
	width:128px;
	margin:0;
	padding:20px 0 0 0;
	background-color:rgb(255,255,255);
}

#quote p {
	padding-bottom:12px;
}

#quote #quote_item_name {
	height:100px;
	overflow:auto;
}

#quote td.senden input {
	width:119px;
}

#quote label, #kontaktformular label {
	text-align:right;
	display:block;
	white-space:nowrap;
	width:140px;
}

#kontaktformular label {
	width:80px;
}

#katalogauswahl label {
	text-align:left;
	display:inline;
}

#kontaktformular td.senden input.kataloge_anfordern {
	width:140px;
}

#katalogauswahl input {
	width:20px;
	background-color:rgb(255,255,255);
}




/*******************************************
* Suchseite
********************************************/

form#search {
	padding:20px 0 20px 0;
	margin:0;
	vertical-align:middle;
	}
	
form#search input {
	padding:0;
	margin:0;
	vertical-align:bottom;
	}

form#search input#query {
	padding:2px 2px 2px 4px;
	margin:0;
	line-height:18px;
	height:14px;
	vertical-align:bottom;
	}

form#search div {
	width:350px;
	height:50px;
	padding:0;
	margin:0 auto;
	vertical-align:top;
	text-align:center;
	}



/*
    Sonstiges
*/

/* Nachricht fr die Besttigung einer versandten E-Mail. */
div.mailSent {
    font-size: 110%;
    background: #eee;
    border: 1px dashed #bbb;
    padding: 2em;
}

/* Liste der bestellten Kataloge */
div.mailSent ul {
    list-style-type: disc;
    margin: 1.2em 0;
}

div.mailSent ul li {
    margin-left: 2em;
}

/* Thumbnails der Kataloge */
div#kataloge div.yui-u img {
}

div#kataloge div.first {
	width:70px;
}

div#kataloge div.katalog {
	margin-bottom:16px;
}

div#kataloge div.descr {
	margin-left:70px;
	padding-right:16px;
}

div#kataloge div.descr h3 {
	font-size:1em;
	line-height:1.1em;
	display:inline;
	border:none;
	padding:0;
	margin-top:0;
}

div#kataloge div.descr p {
}




/*
    RADEOX
*/


h3.heading-1, h3.heading-1-1, h3.heading-1-1-1, h3.heading-1-1-1-1 {
	font-size: 100%;
	font-weight: bold;
	color: black;
}

hr.line {

}

/* AGB */
/*
#agb, #hinweise {
	padding:0 60px 30px 60px;
}
*/

#agb {

}

#agb, #hinweise span.paragraph {
	color:rgb(255,190,0);
}

/*******************************************
* Shop  Listen-Ansicht
********************************************/

table#itemList {
	vertical-align:top;
	margin:0;
}

table#itemList td.artikel {
	padding:0;
	margin:0;
	vertical-align:top;
}

table#itemList td.artikel div.artikel {
	margin-bottom:10px;
    border-bottom:1px solid rgb(220,220,220);
	padding:8px 8px 8px 0;
    background-color:rgb(250,250,250);
}

table#itemList td.thumbnail {
	width:202px;
	margin:0;
	padding:0;
}

table#itemList div.thumbnail {
	width:180px;
	margin:8px 0 8px 8px;
	padding:0;
	border:1px solid rgb(220,220,220);
	background-color:rgb(255,255,255);
}

div.thumbnail, div.thumbnail img {
    text-align: center;
	vertical-align:middle;
	border:none;
}

table#itemList div.produktname, #detail .produktname {
	padding:0;
	margin:4px 0 0 0;
	border-bottom:1px solid rgb(255,210,0);
}

table#itemList div.produktname h3, #detail h3 {
	font-size:0.9em;
	font-weight: bold;
	padding:0;
    margin:0;
    color:rgb(70,70,70);
	height:20px;
	line-height:20px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	border:none;
}

table#itemList div.price {
	margin:0 0 0 0;
	white-space:nowrap;
	font-size:0.9em;
	font-weight:bold;
	padding:4px 3px 0 0;
	color:rgb(70,70,70);
	text-align:right;
	width:68px;
	float:right;
	line-height:20px;
	height:20px;
}

table#itemList div.kurzbeschreibung, #detail td.description {
	padding:8px 0 0 0;
}

table#itemList .data {
	vertical-align:top;
	margin:0;
	padding:0;
}

table#itemList .kurzbeschreibung p, .description p, .comment p {
	color:rgb(100,100,100);
	padding:0 0 1em 0;
	line-height:1.2em;
}

table#itemList td.info-button {
	text-align:right;
	height:23px;
	line-height:23px;
	margin:0;
	padding:0;
	vertical-align:bottom;
}

table#itemList div.info-button {
	margin:0;
	padding:0;
	height:23px;
	line-height:23px;
	font-size:0.1em;
}

table#itemList div.rabatt {
	font-weight:bold;
	font-size:13px;
	color:rgb(255,180,0);
}

div.paginator {
    text-align: center;
    margin-top: 1em;
    margin-bottom: 1em;
}



/*### Shop  Detail-Ansicht ###
#############################*/

div#detail {
	border-bottom:8px solid rgb(240,240,240);
	margin-bottom:12px;
	background-color:rgb(250,250,250);
	padding:8px 0 6px 0;
	width:100%;
}

table.detail {
	width:620px;
}

table.detail td {
}

div#first-thumbnail div.more {
	padding:6px 0 8px 0;
	font-size:10px;
	width:200px;
	text-align:center;
}

div#first-thumbnail {
	width:202px;
	border:1px solid rgb(220,220,220);
	background-color:rgb(255,255,255);
	margin:4px 0 0 8px;
	padding:0;
	text-align:center;
	vertical-align:middle;
}


/* Info-Bild mit Tooltip */
img.info {
    margin-left: 0.4em;
    margin-right: 0em;
}

/* Tooltip mit Hilfe-Text */
.tooltip {
    padding: 1em;
    background-color: #FAFBCF;
    border: 2px solid #EFF371;
    width: 350px;
    text-align: left;
}



/* Button zum Bestellen */
.gwt-Button {
    padding: 2px;
    margin: 5px;
}


/* Dialogfenster Bestellbesttigung */
.gwt-DialogBox {
    border: 2px outset;
    background-color: white;
}

.gwt-DialogBox .Caption {
    background-color: #C3D9FF;
    padding: 4px;
    margin: 2px;
    font-weight: bold;
    cursor: default;
}

.gwt-DialogBox .Body {
    padding: 5px;
}

.gwt-DialogBox .Hint {
    color: #666;
    font-size: 90%;
    text-align: center;
}


 /* Preistabelle */
.pricing {
    clear: both;
	margin-left:0;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	width:100%;
}

.pricing caption {
    /*letter-spacing: -0.05em;*/
	text-align:right;
	padding-bottom:8px;
	margin-left:0;
	font-weight:bold;
	font-size:13px;
	color:rgb(70,70,70);
}

.pricing th, .pricing td {
    font-size:12px;
	border:1px solid rgb(230,230,235);
	padding:4px;
	vertical-align:middle;
	text-align:center;
	color:rgb(70,70,70);
}

.pricing th {
    color:rgb(255,180,0);
	font-size:12px;
	font-weight:bold;
}

.pricing .odd {
}

.pricing .even {
}

.pricing .choice {
    font-weight: bold;
}

div#calculator {
	width:860px;
}

div.rabattText {
	color:rgb(255,180,0);
}

div.rabattPreis {
	color:rgb(255,180,0);
}


/* Fehlermeldungen bei Falscheingabe */
#calculatorError {
    border: 1px solid #eeefec;
    background-color: #FF8000;
    padding: 0.5em;
    font-size: 110%;
    text-align: center;
}


/* Bestellformular */

#calculatorHead {
    margin-top: 2em;
    margin-bottom: 1em;
	padding:0;
	color:rgb(100,100,100);
}

#calculatorHead p {
	color:rgb(100,100,100);
}

.wizard {
    margin: 0;
    padding: 0;
    background-color: #F5F5F5;
    border: 1px dotted #ccc;
    width: 100%;
}

.wizardHeading {
    background: #e7e7e7;
    padding: 0.4em;
    text-align: left;
    font-weight: bold;
}

.wizardBody {
    padding: 0.4em;
}

.priceTable {
    width: 100%;
    border-collapse: separate;
    border-spacing: 7px;
}

.wizardPriceHeading {
    font-weight: bold;
}

.wizardLabel, .formLabel {
    padding-left: 0.2em;
    width: 155px;
    vertical-align: top;
}

.wizardChoice {
    width: auto;
    vertical-align: top;
}

.wizardCharge {
    width: 115px;
    text-align: right;
    vertical-align: top;
}

.wizardTotal {
    width: 120px;
    text-align: right;
    font-style: italic;
    vertical-align: top;
}

.sumCharge {
    font-style: italic;
}

.sumTotal {
    font-weight: bold;
}

.errorLabel {
    color: #D9262E;
}




/*******************************************
* Startseite
********************************************/

table.home1 {
	width:100%;
	height:200px;
	border:1px solid rgb(220,220,224);
	vertical-align:top;
	text-align:left;
	margin-bottom:4px;
	background-image:url(../../static/images/titel.jpg);
	background-repeat:no-repeat;
}

table.home1 tr td {
	vertical-align:top;
}

table.home1 tr td div.text {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:rgb(150,150,160);
	width:340px;
	position:absolute;
	margin:86px 0 0 383px;
	line-height:16px;
}

table.home2 {
	width:100%;
	height:200px;
	vertical-align:top;
	text-align:left;
	margin-bottom:4px;
}

table.home2 td.links {
	height:200px;
	border:1px solid rgb(220,220,224);
	vertical-align:top;
	text-align:left;
	width:373px;
	background-image:url(../../static/images/kataloge.jpg);
	background-repeat:no-repeat;
	background-position:top left;
}

table.home2 td.links div.text {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:rgb(150,150,160);
	margin:114px 0 0 13px;
	line-height:16px;
	position:absolute;
	width:130px;
}

table.home2 td.mitte {
	width:4px;
}

table.home2 td.rechts {
	height:200px;
	border:1px solid rgb(220,220,224);
	vertical-align:middle;
	text-align:center;
	width:373px;
}

table.home2 td.rechts div.oben {
	height:76px;
	width:284px;
	margin:0 auto 2px auto;
}

table.home2 td.rechts div.oben a {
	height:76px;
	width:284px;
	background-image:url(../../static/images/neuheiten.jpg);
	background-position:left top;
	background-repeat:no-repeat;
	display:block;
}

table.home2 td.rechts div.oben a:hover {
	background-position:left -76px;
}

table.home2 td.rechts div.unten {
	height:76px;
	width:284px;
	margin:0 auto;
}

table.home2 td.rechts div.unten a {
	height:76px;
	width:284px;
	background-image:url(../../static/images/sonderangebote.jpg);
	background-position:left top;
	background-repeat:no-repeat;
	display:block
}

table.home2 td.rechts div.unten a:hover {
	background-position:left -76px;
}

/*******************************************
* content-main
********************************************/

div#content-main {
	margin:180px 0 0 18px;
	vertical-align:top;
	width:864px;
}

div#content-main p, div#content-main ol {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:rgb(150,150,160);
	line-height:1.6em;
	/* GERHARD: größere Abstände zwischen Paragraphen hier eintragen, z.B.: */
	/* margin-bottom: 2em; */
}

div#content-main ol {
	margin:0.5em; margin-left:2em;
}

div#content-main ol li { 
    list-style: decimal outside;     
}

div#content-main h3 {
	font-size: 14px;
	line-height:14px;
	height:14px;
	margin:16px 0 10px 0;
	padding:0 0 0 4px;
	font-weight:bold;
	color:rgb(60,60,60);
	border-left:8px solid rgb(255,210,0);
	border-top:none;
	border-bottom:none;
}

div#impressum h2 {
	margin-bottom:6px;
	margin-top:0;
}

div#impressum h3 {
	font-size:11px;
	line-height:12px;
	height:12px;
	margin-top:16px;
}

div#agb h2 {
	font-size:1.1em;
	line-height:1.4em;
}



/*******************************************
* Galerie
********************************************/

td.thumb, td.gap {
    padding: 4px;
    border-right: 3px solid rgb( 160, 160, 170 );
    border-bottom: 3px solid rgb( 160, 160, 170 );
    background-color: white;
}

td.gap {
    background-color: rgb( 160, 160, 170 );
    width: 0;
}

table.galerie-thumbs {
}









/* steht nur hier, weil die Farbe irgendwo vorher überschrieben wird !!! JPS */

.kurzbeschreibung ul, .description ul, .comment ul, td.description p, td.comment p  {
	color:rgb(160,160,170);
}

.kurzbeschreibung ul li, .description ul li, .comment ul li {
	line-height:1.4em;
}

div.detail ol, div.detail ul {
	/* Bringing lists on to the page with breathing room. */
	margin-left: 2em;
}

div.detail ol li {
	/* Giving OL's LIs generated numbers. */
	list-style: decimal outside;
}

div.detail ul li {
	/* Giving UL's LIs generated disc markers. */
	list-style: disc outside;
}
