/* 
CSS Stylesheet for HMS Karton
created by Sebastian Klein, Christian Albrecht
(c) www.weit-blick.com, Gummersbach, 2007
*/

/* BODY */
*{margin:0;padding:0;}
body	{
		background-color:#FFF;
		background-image:url(bg.gif);
		background-attachment:fixed;
		background-repeat: repeat-x;
		color:#222;
		font-family: Arial, Helvetica, sans-serif;
		font-size:12px;
		text-align:center;
		}
		
:lang(de)    {quotes:"\201E" "\201C" "\201A" "\2018";}
:lang(de-DE) {quotes:"\00BB" "\00AB" "\203A" "\2039";}
:lang(de-CH) {quotes:"\00AB" "\00BB" "\2039" "\203A";}
:lang(en)    {quotes:"\201C" "\201D" "\2018" "\2019";}
:lang(fr)    {quotes:"\00AB\00A0" "\00A0\00BB" "\2039\00A0" "\00A0\203A";}
		
q:before {content:open-quote; color:#222}
q:after {content:close-quote; color:#222;}
q q:before {content:open-quote; color:#222;}
q q:after {content:close-quote; color:#222;}
			
/* Container Area*/				
/*border, background-color is in nested elements, cause IE does not like children with absolute positioning*/	
#container{
		margin: 0 auto;		/* to get IE to center it*/
		position:relative;
		width:810px;
		min-height:600px;
		background-color:#A5BAD7;
		}

/* Left Area*/
#leftbox{
		position:absolute;
		width:210px;
		height:600px;
		left:0px;
		top:0px;
		background-color:#7D93C4;
		text-align:left; /*to get IE to center it !?*/
		border-left:2px solid #305fA4; /*border explicitely here*/
		}

/*content area*/
#content{
		position:absolute; /*absolute positioning fills out complete content area*/
		text-align:justify;
		left:210px;
		top:188px;
		width:583px;
		height: 412px;
		overflow: auto; /*overflow expliciteley here, cause IE does not like it in parent container*/
		word-wrap: break-word;
		border-right:2px solid #305fA4;/*border explicitely here*/
		padding-left: 15px; /*padding to display navigation right*/
}

/* IE hack to work-around box-bug. margins are calculated different*/
/* background-color expliciteley here, IE does not like it in parent container*/
* html #content{
		width:600px;	
		background-color:#A5BAD7;/*background-color explicitely here*/
}

/* ie work-around to introduce a new area with just a right border.*/
/* fills out right side above content*/
#borderright{
	position:absolute;
	right:0px;
	top:0px;
	border-right:2px solid #305fA4;	/*border explicitely here*/
	width:600px; height:196px;
}

/*hack for IE workaround !!??*/
* html #borderright{
	background-color:#A5BAD7;/*background-color explicitely here*/
}

/* Headline, Logo */		
h1		{
		display:block;
		position:absolute;
		right:0px;
		top:20px;
		background:url(logo.gif) no-repeat;
		width:600px; height:96px;
		text-indent:-20000px;
		border-right:2px solid #305fA4;/*border explicitely here*/
		}
		
/* Second headline, displays text from navigation*/	
h2		{
		display:block;
		position:absolute;
		left:0px;
		top:140px;
		background:#EFE41E;
		width:525px; 
		height:21px;
		text-indent:225px;
		color:#203B96;
		font-size:18px;
		padding-top:4px;
		text-transform:uppercase;
		}

/* image on right upper side*/
#deko	{
		position:absolute;
		display:block;
		width:210px;
		height:140px;
		left:0px;
		top:0px;
		overflow:hidden;
		}	

/* IE hack to work-around box-bug. margins are calculated different*/
* html #deko{
		width:208px;	
}

/* Navigation area, inside leftbox */
#navi	{
		display:block;
		position:absolute;
		width:210px;
		left:0px;
		top:180px;
		font-size:12px;
		color:#203B96;
		}

/* navigation bullets */
ul		{
		position:relative;
		left:20px;
		line-height:18px;
		list-style-type:disc; /*type explicitely here, because IE default is none, FF is disc*/
		}

/*IE hack to get the discs displayed*/
* html ul{
		margin-left: 15px;
		left: 10px;
}

ul a	{
		text-decoration:none;
		color:#203B96;
		}
ul a:hover	{font-weight:bold;}

ul a:active	{font-weight:bold;}

ul.subnav		{
		text-indent:0px;
		list-style-type: circle; /*type explicitely here, because IE default is none, FF is circle*/
		}

ol		{
		list-style-type:none;
		margin:0;
		padding:0;
		}
li		{
		margin:0px;
		}
		
/* text colors for table, tiny, formular modules*/	
#content p    	{
		line-height:15px;
		margin-bottom:8px;
		color:#203B96;
		}
table 	{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: normal;
		line-height:15px;
		color: #000;
		}
legend 	{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 14px;
		font-weight: normal;
		line-height:15px;
		color:#203B96;
		}
fieldset {
	    width: 580px;
}

#form-module-thanks{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	line-height:15px;
	color:#203B96;
}

.section{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: normal;
		line-height:15px;
		color:#203B96;
		}

div.element{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		font-weight: normal;
		line-height:15px;
		color:#203B96;
		display:table-row;
		}
div.formular { 
		display:table; 
		border-collapse:collapse;
		text-align: left;
		color:#203B96;
}
div.cell { 
		display: table-cell;
	   	width: 120px;
	   	padding: 1px;
	   	padding: 0px 5px;
		vertical-align: top;
		color:#203B96;
 }
div.team{
	color:#203B96;
}
.daten{
	color:#203B96;
}

/* Images are displayed with border and different positions */
#content img	{
		display:block;
		position:relative;
		width:140px;
		height:90px;
		border:2px solid #305fA4;
		float:left; 
		}
#img1	{
		top:15px;
		margin-right:15px;
		}
#img2	{
		top:30px;
		margin-right:15px;
		}
#img3	{
		top:45px;
		}


#img11	{
		top:15px;
		margin-right:15px;
		}
#img12	{
		top:15px;
		margin-right:15px;
		}
#img13	{
		top:15px;
		}

#img14	{
		top:30px;
		margin-right:15px;
		}
#img15	{
		top:30px;
		margin-right:15px;
		}
#img16	{
		top:30px;
		}

/*---- FOOTER START ----*/
#footer{
		margin:0 auto;
		position:relative;
		left:0;
		width:810px;
		height:17px;
		border-top:2px solid #305fA4;
		background-color:#305fA4;
		}
		
/*IE hack to position it right*/
* html #footer { 
		bottom:0px;
		top:600px;
		overflow:hidden;
} 

.foot1,.foot2,.foot3,.foot4,.copyright {
		display:block;
		position:absolute;
		text-decoration:none;
		font-size:10px;
		color:#FFF;
		}
.foot1{	left:30px;top:1px;}
.foot2{	left:90px;top:1px;}
.foot3{	left:170px;top:1px;}
.foot4{	left:250px;top:1px;}

.foot1:hover,.foot2:hover,.foot3:hover,.foot4:hover {
		color:#FFF;
		font-weight:700;
		}
.copyright{
		right:30px;top:2px;
		font-size:9px;
		text-align:right;
		color:#A5BAD7;
		}

/*---- FOOTER ENDE ----*/