/*
	Styles CAPTO - 20.03.2007
	
	
	Wichtige Farben:
	blau: #0080c6
	gruen: #96bf0d
	orange: #d0820c
	viola: #9a93c2
	helblau: #a3c9e8
	hellgrau: #999

	
	---------------------------------------------------------------
	1. Allgemeine Definitionen (Body, Linkfarben)
	---------------------------------------------------------------
	2. Container (Spaltendefinitionen fuer Homepage & Content)
	---------------------------------------------------------------
	3. Story u. Module
	---------------------------------------------------------------
	4. absolute Positionierungen (div Logos)
	---------------------------------------------------------------
	
*/


/* 
	**************************************
	***** 1. Allgemeine Definitionen *****
	**************************************
*/



body {
	background:url(../img/bg_header_hhhh.png) repeat-x ;
	margin: 0;
	padding: 0;
	font-family: verdana, arial, helvetica, sans-serif;
	background-color:#EEF5FC;
}

h1 {
	font-size: 16px;
}

h2 {
	font-size: 12px;
	font-weight: bold;
}

p, li {
	font-size: 12px;
}

img {
	border-style: none;
}

a:link, a:visited, a:hover, a:active {
	color: #0080c6;
	font-weight: bold;
	text-decoration: underline;
}

a:hover, a:active {
	color: #000;
}



/*
	************************
	***** 2. Container *****
	************************
*/


#header {
	width: 100%;
	height: 114px;
	background: url(../img/bg_header_h_n2.jpg) repeat-x #fff;
}

#logo {
	margin-left: 0px;
}





#navigation {
	width: 100%;
	height: 26px;
	/*background: #a3c9e8;*/
	background-image: url(../img/bg_navi_n2.jpg);
	background-repeat:repeat-x; 
	
}

#navigation a:link, #navigation a:visited, #navigation a:hover, #navigation a:active {
	font-size: 11px;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	line-height: 17px;
}

.navihome {
	width: 175px;
	height: 18px;
	float: left;
	text-align: center;
	background-color: #0080C6;
	background-image: url(../img/bg_navi_home_n5_o.jpg);
	background-position: right;
	background-repeat: no-repeat;
}

.navihome2 {
	width: 175px;
	height: 26px;
	float: left;
	text-align: center;
	background-color: #a3c9e8;
	background-image: url(../img/bg_navi_home_n4_o.jpg);
	background-position: right;
	background-repeat: no-repeat;
}

.navi {
	width: 122px;
	height: 18px;
	float: left;
	text-align: center;
	background-color: #0080C6;
	background-image: url(../img/bg_navi_n4_o.jpg);
	background-position: right;
	background-repeat: no-repeat;
}

.navi2 {
	width: 122px;
	height: 26px;
	float: left;
	text-align: center;
	background-color: #a3c9e8;
	background-image: url(../img/bg_navi_n5_o.jpg);
	background-position: right;
	background-repeat: no-repeat;
}





#spalte-li {
    background-color: #ebeced;
	width: 175px;
	height: auto;
	float: left;
	padding-top: 20px;
	min-height: 1000px;
}

#navheader-loesungen {
	/*margin: 20px 0 5px 0px;*/
	margin: 0px 0 5px 0px;
	width: 170px;
	height: 17px;
	background-color: transparent;
	background-image: url(../img/bg_nav_loesungen.gif);
	background-position: left center;
	background-repeat: no-repeat;
	border-top: 1px dotted #999;
	border-right: 1px dotted #999;
	border-bottom: 1px dotted #999;
}

#navheader-loesungen span {
	margin-left: 20px;
	font-size: 11px;
	color: #000;
	font-weight: bold;
	text-transform: uppercase;
	line-height: 17px;
	
}

#navheader-hardware {
	margin: 20px 0 5px 0px;
	width: 170px;
	height: 17px;
	background-color: transparent;
	background-image: url(../img/bg_nav_hardware.gif);
	background-position: left center;
	background-repeat: no-repeat;
	border-top: 1px dotted #999;
	border-right: 1px dotted #999;
	border-bottom: 1px dotted #999;
}

#navheader-hardware span {
	margin-left: 20px;
	font-size: 11px;
	color: #000;
	font-weight: bold;
	text-transform: uppercase;
	line-height: 17px;
	
}

#navheader-dleistungen {
	margin: 20px 0 5px 0px;
	width: 170px;
	height: 17px;
	background-color: transparent;
	background-image: url(../img/bg_nav_dleistungen.gif);
	background-position: left center;
	background-repeat: no-repeat;
	border-top: 1px dotted #999;
	border-right: 1px dotted #999;
	border-bottom: 1px dotted #999;
}

#navheader-dleistungen span {
	margin-left: 20px;
	font-size: 11px;
	color: #000;
	font-weight: bold;
	text-transform: uppercase;
	line-height: 17px;
	
}

#spalte-li ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#spalte-li li {
	margin-left: 20px;
	list-style: none;
	font-size: 11px;
	color: #000;
	line-height: 17px;
	
}

#spalte-li a:link, #spalte-li a:visited, #spalte-li a:hover, #spalte-li a:active {
	color: #000;
	font-weight: normal;
	text-decoration: none;
}

#spalte-li a:hover, #spalte-li a:active {
	color: #0080c6;
}



#spalte-mi {
	width: 490px;
	height: auto;
	float: left;
	/*margin: 20px 0 10px 25px;*/
	margin: 0px 0 0px 0px;
	padding-top: 20px;
	padding-left: 25px;
	border-right: 1px dotted #999;
	background-color: #ffffff;
}



.teaser {
	width: 465px;
	overflow: hidden;
	/*padding-left: 10px;*/
	padding-right: 20px;
	padding-top: 10px;
}

.linie {
	width: 465px;
	margin: 20px 0 20px 0px;
	border-bottom: 1px dotted #999;
}

.teaser h2 {
	font-size: 16px;
}

.teaser p {
	font-size: 12px;
	margin: 0;
}

.blau {
	background-image: url(../img/q_blau.gif);
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 10px;
}

.gruen {
	background-image: url(../img/q_gruen.gif);
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 10px;
}

.orange {
	background-image: url(../img/q_orange.gif);
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 10px;
}

.viola {
	background-image: url(../img/q_viola.gif);
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 10px;
}








#spalte-re {
	width: 220px;
	height: auto;
	float: left;
	/*margin: 20px 0 10px -1px;*/
	margin: 0px 0 10px -1px;
	padding-top: 20px;
	border-left: 1px dotted #999;
	/*border-right: 1px #999 dotted;*/
	background-color: #ffffff;
	/*background-image: url(../img/bg_spalte_r.gif);*/
   	/*border-right-style:solid; border-right-width:3px; border-right-color: #ebeced;*/

	
}

#navheader-news {
	margin: 0px 0 5px 8px;
	width: 200px;
	height: 17px;
	background-color: transparent;
	background-image: url(../img/bg_nav_news.gif);
	background-position: left center;
	background-repeat: no-repeat;
	border-top: 1px dotted #999;
	border-right: 1px dotted #999;
	border-bottom: 1px dotted #999;
}

#navheader-news span {
	margin-left: 20px;
	font-size: 11px;
	color: #000;
	font-weight: bold;
	text-transform: uppercase;
	line-height: 17px;
	
}

.datum {
	font-size: 11px;
	margin-bottom: 10px;
	margin-top: -12px;
	letter-spacing: 1px;
}

.datum-blau, .datum-gruen, .datum-orange, .datum-viola {
	margin: 15px 0 0 8px;
	width: 200px;
	height: 17px;
	background-color: transparent;
	border-top: 1px dotted #999;
	border-right: 1px dotted #999;
	border-bottom: 1px dotted #999;
}

.datum-blau {
	background-image: url(../img/bg_datum_blau.gif);
	background-position: left center;
	background-repeat: no-repeat;
}

.datum-gruen {
	background-image: url(../img/bg_datum_gruen.gif);
	background-position: left center;
	background-repeat: no-repeat;
}

.datum-orange {
	background-image: url(../img/bg_datum_orange.gif);
	background-position: left center;
	background-repeat: no-repeat;
}

.datum-viola {
	background-image: url(../img/bg_datum_viola.gif);
	background-position: left center;
	background-repeat: no-repeat;
}

.datum-blau span, .datum-gruen span, .datum-orange span, .datum-viola span {
	margin-left: 10px;
	font-size: 11px;
	color: #999;
	font-weight: bold;
	line-height: 17px;
	
}

#spalte-re h2 {
	font-size: 11px;
	margin: 5px 0 0 18px;
}

#spalte-re p {
	font-size: 11px;
	margin-top: 5px;
	margin-left: 18px;
}

.teaserpic {
	margin: 5px 0 0 18px;
}



/*
	******************************
	***** 3. Story u. Module *****
	******************************
*/

#story {
	width: 465px;
	overflow: hidden;
}

#story h1 {
	margin-top: 0;
}


.infobox {
	padding-left: 10px;
	border-left: 10px solid #0080c6;
	margin: 1.5em 0 1.5em 0;
}

.linkbox {
	padding: 10px;
	border: 1px dotted #999;
	background-color: #ebeced;
	margin: 1.5em 0 1.5em 0;
}

.link {
	padding: 0px 0px 0px 25px;
	background: transparent url(../img/link.gif) no-repeat 0px 50%;
	display: block;
}

.download {
	padding: 0px 0px 0px 25px;
	background: transparent url(../img/download.gif) no-repeat 0px 50%;
	display: block;
}

.bildbox {
	
}

.pic-left-float {padding:3px 8px 2px 0px; float: left;}
.pic-right-float {float:right; padding:3px 20px 2px 8px;}
.pic-left {text-align: left; clear: both;}
.pic-right {text-align: right; clear: both;}
.pic-center {text-align: center; clear: both; padding-bottom:10px;}

#story ol {padding:0px 70px 20px 30px;}
#story ul {padding:0px 70px 20px 30px;}
#story ul li, #content ol li {padding:3px 0px 0px 0px; line-height:130%;}

.produktbox {
	margin: 20px 0 40px 0;
  	clear: both;
}

.produktbox h3 {
	font-size: 12px;
	margin: 5px 0 5px 0;
	padding: 2px;
	padding-left: 4px;
	border-top: 1px dotted #999;
	border-bottom: 1px dotted #999;
	background-color: #ebeced;
}

.produktbox img {
	float: left;
	margin-top:15px;
}

.produktbox p {
	margin-left: 180px;
	font-size: 12px;
	color: #000;
}

.vcard {
	margin: 20px 0 0px 0;
  clear: both;
}

div.vcard-spacer {
  height: 1px;
  margin: 0;
  clear: both;
}

.vcard img {
	float: left;
}

.vcard p {
	margin-left: 180px;
	font-size: 12px;
	color: #000;
}

.datenblatt {
	border-top: 1px dotted #999;
	clear: both;
	font-size: 11px;
	font-weight: bold;
	color: #000;
	padding: 7px 0 0 180px;
}

/*
	************************
	***** 4. abs. Pos. *****
	************************
*/


#logo2 {
	position: absolute;
	z-index: 2;
	left: 260px;
	top: 0px;
}

#logo3 {
	position: absolute;
	z-index: 2;
	left: 770px;
	top: 0px;
}


.top-link {
	padding: 0px 0px 0px 15px;
	background: transparent url(../img/top.gif) no-repeat 0px 50%;
	display: block;
}
.clsLayoutMain {
	position: relative;  margin: 0px auto; width:914px; background-color: White;
	border-bottom-style:solid; border-bottom-width:1px; border-bottom-color: #aeaeaf;
	border-right-style:solid; border-right-width:1px; border-right-color: #aeaeaf;
	min-height: 1000px;

}
.clsLayoutTable  {
    width: 800px;
    padding: 0px:    
}
#linktable {
	border-style: solid; border-color: #b3b3b3; border-width: 1px; text-align: justify; 
	/*border-left: none; border-right:none; border-top:none; border-bottom: none;*/
	margin: 20px 0px 0px 0px; padding-bottom: 15px; padding-left: 12px; padding-right: 10px; 
	padding-top: 15px; background-color: #ffffff; width: 150px;
	/*background-color: #ebeced;*/
}
#linktable a.klein {
	/*line-height: 85%;*/ color: #8098ae; font-size: 70%
}
#linktable a.mittel {
	/*line-height: 110%;*/ color: #406486; font-size: 80%
}
#linktable a.gross {
	color: #0080c6; font-size: 100%
}
#linktable a:hover {
	color: #00305d
}