/* =====================================================
 * dateipfad:		cms/css/default.css
 * projekt:			website naaimachinetotaal
 * cms:				JAMM CMS OWEN
 * autor:			nils tonigs (http://www.ton-x.de)
 * 
 * erstellt am:		26.01.2007
 * letzte änderung: 26.03.2007
 * 
 * copyright:		© 2007 by nils tonigs medienentwicklung
 * 					alle rechte im universum reserviert
 * ===================================================== */

html { height:100%; }

body { 
	background-color:#ffffff; 
	height: 100%;
    padding:0;
	margin:0;
	/*text-align: center; /* erforderlich, um im IE das erste div horizontal zu zentrieren */
}

/* Angaben nur für den Internet Explorer mittels Star-HTML-Hack */
* html, * html body {
	background-color:#ffffff;
    height:100%;
    padding:0;
    margin:0;
    /* overflow:hidden; */
}

p { font-family:'Arial',sans-serif; color:#000000; font-size:13px; font-weight:normal; line-height:1.4em; }

ul { font-family:'Helvetica','Arial',sans-serif; color:#000000; font-size:13px; font-weight:normal; }
li { font-family:'Helvetica','Arial',sans-serif; color:#000000; font-size:12px; font-weight:normal; line-height:1.4em; }

h1 { font-family:'Arial',sans-serif; color:#d90081;	font-size:17px; font-weight:bold; }
/* h2 { font-family:'Arial',sans-serif; color:#000000; font-size:16px; font-weight:bold; } */
h2 { font-family:'Arial',sans-serif; color:#ffffff; font-size:25px; font-weight:normal; }
h3 { font-family:'Arial',sans-serif; color:#ffffff; font-size:25px; font-weight:normal; font-stretch:ultra-condensed; }
h4 { font-family:'Arial',sans-serif; color:#000000; font-size:14px; font-weight:bold; }
h5 { font-family:'Arial',sans-serif; color:#000000; font-size:12px; font-weight:normal; }

/*  nicht verwendet *
/*.absatz { font-family:'Arial',sans-serif; color:#000000; font-size:14px; font-weight:normal; }
p.cardText { font-family:'Arial',sans-serif; color:#000000; font-size:13px; font-weight:bold; vertical-align:bottom; }
*/

/* toplink wird in main_only.php verwendet */
.toplink:link { font-family:'Arial',sans-serif; font-size:14px; font-weight:bold; color:#ffffff; text-decoration:none; vertical-align: middle; }
.toplink:visited { font-family:'Arial',sans-serif; font-size:14px; font-weight:bold; color:#ffffff; text-decoration:none; vertical-align: middle; }
.toplink:hover { font-family:'Arial',sans-serif; font-size:14px; font-weight:bold; color:#ffffff; text-decoration:none; vertical-align: middle; }
.toplink { font-family:'Arial',sans-serif; font-size:14px; font-weight:bold; color:#ffffff; text-decoration:none; vertical-align: middle; }

/* sublink wird in sub1_only.php verwendet */
.sublink:link { font-family:'Arial',sans-serif; font-size:13px; font-weight:bold; color:#ffffff; text-decoration:none; vertical-align: baseline ; }
.sublink:visited { font-family:'Arial',sans-serif; font-size:13px; font-weight:bold; color:#ffffff; text-decoration:none;  vertical-align: baseline ; }
.sublink:hover { font-family:'Arial',sans-serif; font-size:13px; font-weight:bold; color:#ffffff; text-decoration:none; vertical-align: baseline ; }
.sublink { font-family:'Arial',sans-serif; font-size:13px; font-weight:bold; color:#ffffff; text-decoration:none; vertical-align: baseline ; }

/* resublink wird in sub2_only.php verwendet */
.resublink:link { font-family:'Arial',sans-serif; font-size:13px; font-weight:normal; color:#ffffff; text-decoration:none; }
.resublink:visited { font-family:'Arial',sans-serif; font-size:13px; font-weight:normal; color:#ffffff; text-decoration:none; }
.resublink:hover { font-family:'Arial',sans-serif; font-size:13px; font-weight:normal; color:#354086; text-decoration:none; }
.resublink:active { font-family:'Arial',sans-serif; font-size:13px; font-weight:bold; color:#354086; text-decoration:none; }
.resublink:focus { font-family:'Arial',sans-serif; font-size:13px; font-weight:normal; color:#354086; text-decoration:none; }
.resublink { font-family:'Arial',sans-serif; font-size:13px; font-weight:normal; color:#ffffff; text-decoration:none; }
.resublinkDown { font-family:'Arial',sans-serif; font-size:13px; font-weight:bold; color:#354086; text-decoration:none; }



/********************************************/
/** parameter der layer **/
/********************************************/

/********************************************/
/** linker bereich mit navigation **/

#leftNaviArea {
	position: absolute;
	z-index: 4;
	/* background-color: #99ee11; */
	top: 0px; left: 0px; height: 95%;
	width: 200px;
}

#naviHeadNBlue {
	position: relative;
	z-index: 10;
	top: 0px; left: 0px; height: 120px; width: 200px; /* left: -18px; */
}

#leftNaviBack {
	position: absolute;
	z-index: 5;
	background-color: #bfbcff; /* #354086; */
	top: 120px; left: 18px; /* ACHTUNG TEST -> SONST top:0px */
	width: 164px;
    padding:0;
    margin:0;
}

/************** Trennlinie Schaltflächen **************/
/*
#buttonLine {
	position: relative;
	z-index: 6;
	background-color: #bfbcff; 
	top: 0px; left: 0px; 
	width: 164px; height: 1px;
    padding:0;
    margin:0;
}
*/

/************** Schaltflächen Hauptmenü Normalzustand **************/
/* dunkelblau */
#butBackNbl {
	position: relative;
	z-index: 5;
	background-color: #354086;
	top: 0px; left: 0px; width: 164px; height: 22px;
	margin: 1px 0px 0px 0px;
}

/* pastelgrün */
#butBackPgrn {
	position: relative;
	z-index: 5;
	background-color: #bce673;
	top: 0px; left: 0px; width: 164px; height: 22px;
	margin: 1px 0px 0px 0px;
}

/************** Schaltflächen rechte Subnavigation 3. Ebene Normalzustand ***************/
/* pastellila */
#butBackPli {
	position: relative;
	z-index: 5;
	background-color: #b1589e;
	top: 0px; left: 0px; width: 164px; height: 22px;
	margin: 1px 0px 0px 0px;
}

/************** Ebene für Rolloverzustand **************/
#leftNaviButOverLayer {
	position: absolute;
	z-index: 14;
	top: 120px; left: 18px;
	width: 160px;
}

/************** Schaltflächen Rolloverzustand **************/
.butOver {
	position: relative;
	z-index: 8;
	background-color: #4553AD; /* #5c73b8; */
	width: 164px; height: 22px;
	visibility: hidden; /* visible; */
    padding:0;
	margin: 1px 0px 0px 0px;
}

/************** Schaltflächen Downzustand **************/
.butDown {
	position: relative;
	z-index: 7;
	left: -2px; width: 168px; height: 22px;
	visibility: hidden; /* visible; */
    padding:0;
	margin: 1px 0px 0px 0px;
}

/************** Schaltflächen Geklicktzustand **************/
.butKlick {
	position: relative;
	z-index: 9;
	left: -2px; width: 168px; height: 22px;
	visibility: hidden; /* visible; */
    padding:0;
	margin: 1px 0px 0px 0px;
}

/************** Ebene für Schaltflächen-Beschriftung **************/
#leftNaviButLayer {
	position: absolute;
	z-index: 15;
	top: 123px; left: 25px;
	width: 160px; /* height: 300px; */
}

#butText {
	position: relative;
	z-index: 10;
	width: 164px; height: 22px;
	overflow:hidden;
    padding:0;
	margin: 1px 0px 0px 0px;
}

#leftNaviTopNBlue {
	position: relative;
	z-index: 5;
	top: 0px; left: 0px; width: 164px; height: 22px;
}

#leftNaviBotNBlue {
	position: relative;
	z-index: 5;
	top: 0px; left: 0px; width: 164px; height: 22px;
	margin: 1px 0px 0px 0px;
}

#changeLan {
	position: relative;
	z-index: 10;
	background-color: #ffffff;
	visibility: visible;
	padding: 5px 0px 0px 70px;
}

/************** Weisse Abstandshalter zwischen Menübereichen **************/
#leftNaviWSpacer {
	position: relative;
	z-index: 5;
	background-color: #ffffff;
	width: 164px; 
	height: 5px;
}


#leftNaviButOverTSpacer {
	position: relative;
	z-index: 14;
	left: 18px;
	width: 160px; 
	height: 50px;
    padding:0;
    margin:0;
}


/**************** SUBNAVIGATION ***********************/

.leftSubNaviArea {
	position: absolute;
	z-index: 50;
	/*background-color: #bb2266; /* #bfbcff;  hellblau  #5c73b8;*/
	left: 184px; width: 164px; /* top: 168px; WIRD DURCH PHP MIT ANGEPASSTEN X_WERTEN IM HTML FESTGELEGT */
	visibility: hidden;
}

#leftSubNaviBack {
	position: absolute;
	z-index: 52;
	background-color: #bfbcff;
	top: 0px; left: 0px;
	width: 164px;
    padding:0;
    margin:0;
}

#leftSubNaviButOverLayer {
	position: absolute;
	z-index: 54;
	top: 0px; left: 0px;
	width: 160px;
}

#leftSubNaviButLayer {
	position: absolute;
	z-index: 55;
	top: 3px; left: 7px;
	width: 160px;
}

#subButText {
	position: relative;
	z-index: 59;
	width: 164px; height: 22px;
	overflow:hidden;
    padding:0;
	margin: 1px 0px 0px 0px;
}

/************** Schaltflächen Subnavigation 2. Ebene Normalzustand ***************/
#butBackPbl {
	position: relative;
	z-index: 5;
	background-color: #4553AD; /* #5c73b8; */
	top: 0px; left: 0px; width: 164px; height: 22px;
	margin: 1px 0px 0px 0px;
}

#butBackPbl2 {
	position: relative;
	z-index: 5;
	background-color: #5566D4;
	top: 0px; left: 0px; width: 164px; height: 22px;
	margin: 1px 0px 0px 0px;
}


/************** Schaltflächen Rolloverzustand **************/
.subButOver {
	position: relative;
	z-index: 58;
	background-color: #4553AD;
	width: 164px; height: 22px;
	visibility: hidden;
    padding:0;
	margin: 1px 0px 0px 0px;
}





/** mittlerer bereich mit inhalt **/

#contHeadLineArea {
	position: absolute;
	z-index: 5;
	background-image: url(../graphics/titel_back_garn.png);
	background-repeat: no-repeat;
	top: 23px;
	height: 73px; 
	width: 469px; /* -20px wg. padding */
	left: 506px;
    padding: 0px 10px 10px 10px;
	line-height: 0.8em;
	font-family: 'Arial',sans-serif; 
	color: #ffffff;	
	font-size: 25px; 
	font-weight: normal;
	white-space: nowrap;
}

* html #contHeadLineArea {
    padding: 22px 10px 10px 10px;
	width: 489px;
}

#contHeadLineArea p {
	font-family:'Arial',sans-serif; 
	color:#ffffff;	
	font-size:25px; 
	font-weight:normal;
	white-space:nowrap;
}

#contentArea {
	position: absolute;
	z-index: 1;
	top: 31px;
	left: 200px;
	width: 600px;
	height: 100%;
}

#contentAreaTop {
	position: relative;
	z-index: 2;
	top: 0px;
}

#contentAreaBot {
	position: relative;
	z-index: 2;
	top: 0px;
}

.footer {
	position: relative; 
	font-family:'Arial',sans-serif; 
	color:#000000; 
	font-size:10px; 
	font-weight: normal; 
	margin: 3px 0px 15px 0px;
}

* html .footer {
	position: absolute;
	top: 8px;
}

#contentAreaMid {
	position: relative;
	z-index: 3;
	background-color: #bfcfff; /* hellblau */
    padding: 48px 0px 0px 20px;
	width: 580px;
	float: left;
	height: auto;
}

* html #contentAreaMid {
    padding: 58px 0px 0px 20px;
	width: 600px;
}

#mainText {
	position: relative;
	z-index: 4;
	/* background-color: #33ff11; #bfcfff;  hellblau */
	width: 560px;
	padding: 0px 0px 0px 0px;
}

#mainTextDetail {
	position: relative;
	z-index: 4;
	/* background-color: #ee1155; #bfcfff;  hellblau */
	width: 324px;
	padding: 0px 8px 0px 8px;
}

* html #mainTextDetail {
	width: 340px;
}

#buttotop {
	position: relative;
	z-index: 10;
	left: 0px;
	top: 0px;
	width: 340px;
	height: 40px;
	margin: 15px 0px 10px 20px;
	float: left;
}

* html #buttotop {
	margin: 15px 0px 10px 10px;
}

/************* technische daten ******************/
#specsArea {
	position: relative;
	z-index: 3;
	width: 340px;
    padding:0;
    margin: 0px 0px 0px 0px; 
}


#specsAreaTop {
	position: relative;
	z-index: 3;
    margin: 0px 0px 0px 0px; 
}

#specsAreaMid {
	position: relative;
	z-index: 3;
	background-color: #ffe6bf; /* hellorange */
    padding: 1px 8px 1px 8px;
    margin: 0px 0px 0px 0px; 
}

#specsAreaBot {
	position: relative;
	z-index: 3;
    margin: 0px 0px 0px 0px; 
}


/************* produkt bild und status ******************/
#prodCardArea {
	position: absolute;
	z-index: 10;
	/* background-color: #11ffaa; */
	right: 15px;
	width: 210px;
	top: 98px; 
}

#prodCardFrame {
	position: absolute;
	z-index: 12;
	top: 0px;
    margin: 0px 0px 0px 0px;
}

#prodCardPhoto {
	position: relative;
	z-index: 9;
	top: 0px;
	background-color: #ffffff; 
	text-align: center;
}

* html #prodCardPhoto {
	top: 0px;
}

#cardTextArea {
	position: relative;
	z-index: 11;
	background-color: #bce673; /* hellgrün */
	left: 10px;
	top: 13px;
	width: 153px;
    padding: 2px 25px 2px 8px;
}

* html #cardTextArea {
	position: relative;
	width: 186px;
	left: 10px;
	top: 10px;
	height: 50px;
    padding: 5px 25px 3px 8px;
}

#prodCardBot {
	position: relative;
	z-index: 11;
	left: 10px;
	top: 13px;
}

* html #prodCardBot {
	left: 10px;
	top: 10px;
}

#statusArea {
	position: absolute;
	z-index: 13;
	top: 125px; right: 18px; height: 67px; width: 18px;
	min-height: 100px;
}


/** rechter bereich mit navigation **/

#rightNaviArea {
	position: absolute;
	z-index: 6;
	/* background-color: #99ee11; */
	top: 22px; left: 800px; width: 200px; height: 95%; 
}

#rightNaviBack {
	position: relative;
	z-index: 10;
	background-color: #bfcfff;
	left: 18px; width: 164px;
	top: 111px; /* alternative ohne obere schräge*/
    padding:0;
    margin:0;
}

/************** Ebene für Rolloverzustand **************/
#rightNaviButOverLayer {
	position: absolute;
	z-index: 14;
	top: 133px; left: 18px;
	width: 160px;
}

.rightButOver {
	position: relative;
	z-index: 8;
	background-color: #bfcfff;
	width: 164px; height: 22px;
	visibility: hidden;
    padding:0;
	margin: 1px 0px 0px 0px;
}

/************** Ebene für Schaltflächen-Beschriftung **************/
#rightNaviButLayer {
	position: absolute;
	z-index: 15;
	top: 135px; left: 25px;
	width: 160px;
}

/************** Schaltflächen Downzustand **************/
.rightButDown {
	position: relative;
	z-index: 15;
	background-color: #bfcfff; /* hellblau */
	width: 164px; height: 22px;
	visibility: hidden;
    padding: 0px 0px 0px 0px;
	margin: 1px 0px 0px 0px;
}

#rightButDownCon {
	position: relative;
	z-index: 16;
	background-image: url(../graphics/but_right_down.png);
	background-repeat: no-repeat;
	background-position: left;
	top: -28px; left: -18px; width: 18px; height: 34px;
}

.rightButText {
	position: relative;
	z-index: 9;
	width: 164px; height: 22px;
	overflow:hidden;
    padding:0;
	margin: 1px 0px 0px 0px;
}






/*
/************** Schaltflächen TESTWEISE Normalzustand **************/
/*
#butBackNli {
	position: relative;
	z-index: 5;
	background-color: #d90081;
	top: 0px; left: 0px; width: 164px; height: 22px;
}

#butBackNgrn {
	position: relative;
	z-index: 5;
	background-color: #69ff00;
	top: 0px; left: 0px; width: 164px; height: 22px;
}

#butBackNor {
	position: relative;
	z-index: 5;
	background-color: #ffa500;
	top: 0px; left: 0px; width: 164px; height: 22px;
}

#butBackPor {
	position: relative;
	z-index: 5;
	background-color: #e6b873;
	top: 0px; left: 0px; width: 164px; height: 22px;
}
*/

/* NICHT MEHR VERWENDET
#ntLogo {
	position: absolute;
	z-index: 8;
	top: 0px; left: 0px; height: 100px; width: 200px;
}
*/