/*
Site:			www.humanelektronik.de.
Author:			Torsten Schrade
Created:		18.02.2006
Modified:		18.02.2006
Editor:			Torsten Schrade
Usage:			Main stylesheet

property order:
################
** display
** visibility
** list-style-type
** position
** top/right/bottom/left
** z-index
** float
** clear
** width
** height
** overflow
** margin
** border
** padding
** color
** background
** font
**	- font-family
**	- font-size
**	- font-style
**	- font-variant
** line-height
** letter-spacing
** text-align
** vertical-align
** text-decoration
** white-space
** other text styles (e.g. text-indent)
** cursor
** content

table of contents
#################
- basic elements
	- html / body
	- container
	- header
	- main
	- columns
	- footer
- menus
	- naviMain
	- naviSub
	- naviMeta
	- naviRootline
	- naviLang
*/

/*####################### BASICS ############################*/

body {
	padding: 0;
	background: url(../images/body_bg.jpg) left top repeat-x;
}

#page {
	background: transparent;
}

#container {
	width: 790px;
	overflow: hidden;
	margin: 0;
}

/* HEADER */

#header {
	height: 150px;
	background: #B2D3EF url(../images/header_bg.jpg) left top no-repeat;
}

#logo {
	position: absolute;
	z-index: 5;
	width: 397px;
	height: 150px;
	background: url(../images/logo2.jpg) left top no-repeat;
}

#logo a {
	position: absolute;
	z-index: 10;
	display: block;
	width: 180px;
	height: 150px;
}

/* MAIN */

#main {
	margin-top: 10px;
	padding: 0;
	color: #000;
	background: #fff url(../images/main_bg.jpg) left top no-repeat;
}

/* LEFT COLUMN */

#content-01-wrap {
	width: 210px;
	margin-top: 8px;
	background: url(../images/c01w_bg.jpg) no-repeat;
	background-color: transparent;
}

#content-01 {
	margin: 0;
	padding: 0;
}

#content-01 .hmenu {
	width: 200px;
	padding-bottom: 28px;
	background: url(../images/navimain_bg.png) left bottom no-repeat;
}

/* let's serve Mr. IE6 the .gif version */

* html #content-01 .hmenu {
	background: url(../images/navimain_bg.gif) left bottom no-repeat;
}

#content-01 .hmenu .tmenu {
	background: transparent;
	background: #fff;
}

#services {
	width: 200px;
	height: 400px;
	background: #fff;
}

/* RIGHT COLUMN */

#content-02-wrap {
	overflow: hidden;
}

#content-02 {
	margin-right: 1.8em;
	padding-top: 2.13em;
}

* html #content-02 {
	padding-top: 2.1em;
}

/* CENTER COLUMN */

#content-03-wrap {
	top: 1.5em;
  	margin-left: 210px;
  	padding-left: 0.3em;
  	background: url(../images/content-03_bg.gif) 99% 0% repeat-y;
}

#content-03 {
	padding-top: 0;
	border: 1px solid white; /* stupid IE6 shows no borders otherwise */
}

#bottomnav {
	position: relative;
	clear: both;
	height: 2em;
	margin: 3em 0;
	padding: 0.5em 0;
	background: url(../images/h1_bg.gif) left top repeat-x;
	font-size: 0.8em;
	line-height: 1em;
}

a#totop {
	position: absolute;
	right: 0;
	height: 1.3em;
	padding: 0.2em 1.5em 0 1.5em;
	background: url(../images/totop_bg.gif) 100% 35% no-repeat;
}

a#backlink {
	position: absolute;
	left: 0;
	height: 1.5em;
	padding: 0 1.2em;
	background: url(../images/back_bg.gif) 0% 0% no-repeat;
}

#footer {
	position: relative;
	z-index: 100;
	padding-top: 1.3em;
	text-align: center;
	background: url(../images/footer_bg.gif) 0% 0% repeat-y;
	/*background-color: green;*/
}

#products {
	margin-top: 8em;
}

/*####################### MENUS ############################*/

/* NAVIMAIN */

/* basics */
#content-01 .hmenu ul {
	list-style-type: none;
	width: 200px;
	overflow: hidden;
	margin: 0;
	padding: 0;
}

#content-01 .hmenu ul li {
	display: inline;
}

#content-01 .hmenu ul li a {
	display: block;
	margin: 0 1.5em;
	padding: 4px 0 4px 3.2em;
	color: #000;
	background: url(../images/navimain_no.gif) 15% 50% no-repeat;
}

#content-01 .hmenu ul ul li a {
	padding-left: 5em;
}

/* level 2 basics */
#content-01 .hmenu ul.tmenu ul.tmenu {
	font-size: 0.9em;
	/* margin-left: 2em; */
}

#content-01 .hmenu ul.tmenu ul.tmenu .last a {
	border-bottom: 2px solid #587FA6;
}

/* flaw: there's an empty <ul> bec. of allWrap either hide this way
or simply set he ifsub & all states correctly for the different levels
#content-01 .hmenu ul li.ifsub ul {
	display: none;
}

#content-01 .hmenu ul ul li.curifsub ul {
	display: none;
}
 */

/* current state */
#content-01 .hmenu ul li.actifsub a,
#content-01 .hmenu ul li.cur a,
#content-01 .hmenu ul li.curifsub a {
	border-bottom: 2px solid #587FA6;
	padding-bottom: 2px;
	background: url(../images/navimain_cur.gif) 15% 50% no-repeat;
	color: #587FA6;
}

/* level 2 current state without border */
#content-01 .hmenu ul li.actifsub ul li a,
#content-01 .hmenu ul li.cur ul li a,
#content-01 .hmenu ul li.curifsub ul li a {
	border-bottom: none;
	padding-bottom: 4px;
	color: #000;
	background: url(../images/navimain_no.gif) 25% 50% no-repeat;
}

/* bringing back current state to level 2 */
#content-01 .hmenu ul.tmenu li ul.tmenu li.cur a {
	background: url(../images/navimain_cur.gif) 25% 50% no-repeat;
	color: #587FA6;
}

/* hover state */
#content-01 .hmenu ul a:hover {
	border-bottom: 2px solid #587FA6;
	padding-bottom: 2px;
	color: #587FA6;
}

/* level 2 hover state without border */
#content-01 .hmenu ul ul a:hover {
	border-bottom: none;
	padding-bottom: 4px;
}

/* bringing back color to level 2 hover state*/
#content-01 .hmenu ul li.actifsub ul li a:hover,
#content-01 .hmenu ul li.curifsub ul li a:hover {
	color: #587FA6;
	background: url(../images/navimain_cur.gif) 25% 50% no-repeat;
}

#content-01 .hmenu ul li.actifsub ul li.curifsub a,
#content-01 .hmenu ul li.curifsub ul li.curifsub a {
	background: url(../images/navimain_cur.gif) 25% 50% no-repeat;
	color: #587FA6;
}

#content-01 .hmenu ul li a:hover {
	background: url(../images/navimain_cur.gif) 15% 50% no-repeat;
}

/* serving specific positioning style to Geckoes */
#content-01 div[class=hmenu] ul li a:hover {
	background-position: 15% 55%;
}

#content-01 div[class=hmenu] ul.tmenu li.cur a:hover,
#content-01 div[class=hmenu] ul.tmenu li.curifsub a:hover,
#content-01 div[class=hmenu] ul.tmenu li.actifsub a:hover {
	background-position: 15% 50%;
}

/* level 2 specific hover positions for Geckoes */
#content-01 div[class=hmenu] ul.tmenu li.cur ul a:hover,
#content-01 div[class=hmenu] ul.tmenu li.curifsub ul a:hover,
#content-01 div[class=hmenu] ul.tmenu li.actifsub ul a:hover {
	background-position: 25% 50%;
}

/* NAVISUB */

/*
#content-02 .hmenu h2 {
	border-bottom: 2px solid #587FA6;
	background: none;
}
*/

#content-02 .hmenu ul {
	list-style-type: none;
	width: 160px;
	overflow: hidden;
	margin: 0;
	padding: 0;
	font-size: 0.9em;
}

#content-02 .hmenu ul li {
	display: inline;
	background: none;
	padding: 0;
}

#content-02 .hmenu ul li a {
	display: block;
	margin: 0 0 0 0.5em;
	padding: 4px 0 4px 2em;
	color: #000;
}

/* LEVEL 1 */

#content-02 .hmenu ul li.no a,
#content-02 .hmenu ul li.ifsub a  {
	background: url(../images/navimain_no.gif) 5% 50% no-repeat;
}

#content-02 .hmenu .tmenu li.cur a,
#content-02 .hmenu .tmenu li.curifsub a  {
	background: url(../images/navimain_cur.gif) 5% 50% no-repeat;
	color: #587FA6;
}

#content-02 .hmenu ul li a:hover {
	color: #587FA6;
	background: url(../images/navimain_cur.gif) 5% 50% no-repeat;
}

/* NAVIROOTLINE */

.rootline {
	position: relative;
	top: -0.8em;
	margin-bottom: -0.8em;
}

/** html .rootline {
	margin-top: -1em;
}  */

#content-03 .rootline ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	color: #587FA6;
	font-size: 0.9em;
}

#content-03 .rootline ul li {
	display: inline;
	background: none;
	padding: 0;
}

.rootline ul li span {
	padding: 0 0 0 0.3em;
}

.rootline ul li a {
	color: #587FA6;
}

/* NAVISERVICE */

.directory ul {
	list-style-type: none;
	width: 180px;
	margin-left: 12px;
	padding: 0.8em 0;
	font-size: 0.9em;
}

.directory ul li {
	float: left;
	padding: 0 0.3em;
}

/*####################### STYLESWITCHER ############################*/

#styleswitcher {
	padding: 1.3em 0;
}

#styleswitcher ul {
	list-style-type: none;
	height: 60px;
	margin: 0 0 0 11px;
	padding: 0;
	background: url(../images/styleswitcher_bg.gif) top left no-repeat;
}

#styleswitcher ul li {
	z-index: 1;
	float: left;
	height: 60px;
}

#styleswitcher ul li a {
	display: block;
	overflow: hidden;
	width: 100%;
	height: 60px;
}

#styleswitcher ul li a span {
	position: absolute;
	left: -1000px;
}

#styleswitcher li#normalsize {
	width: 47px;
}
#styleswitcher li#mediumsize {
	width: 55px;
}
#styleswitcher li#largesize {
	width: 65px;
}

/* Sitemap Fix */

.csc-frame-indent {
	margin-top: -12px;
}