@charset "utf-8";

/* Reset */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	color: #575757;
	font-size: 100%;
	margin: 0;
	outline: 0;
	padding: 0;
	text-align: left;
	vertical-align: baseline;
}

ol, ul {
	list-style: none;
}

/* end Reset */

p {
	font-size: 15px;
}

a {
	text-decoration: none;
	color: #e0e0e0;
	font-size: 15px;
}

a:hover {
	text-decoration: underline;
}

/* Main */

body {
	color: #575757;
	background-color: #ffffff;
	background-image: url(../images/body_bg.png);
	background-repeat: repeat-x;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1.4;
}

#container {
	width: 940px;
	margin: 0 auto;
}

#top {
	height: 20px;
	overflow: hidden;
	padding-top: 8px;
}

#top p.topLeft {
	float: left;
	padding-left: 10px;
	color: #e0e0e0;
}

#top p.topRight {
	float: right;
	padding-right: 10px;
}

#top p.topRight a {
	text-decoration: underline;
	padding-left: 30px;
}

#top p.topRight a:hover {
	color: #e0e0e0;
	text-decoration: none;
}

#header {
	background: url(../images/header_bg.jpg) no-repeat;
	width: 940px;
	height: 399px;
	margin-top: 10px;
	overflow: hidden;
}

#header h2#logo {
	float: left;
	text-indent: -9999px;
	padding-left: 50px;
	margin-top: 40px;
}

#header h2#logo a {
	background: url(../images/logo.jpg) no-repeat;
	display:block;
	width: 188px;
	height: 170px;
}

#header h3#slogan {
	float: right;
	width: 469px;
	height: 42px;
	text-indent: -9999px;
	background: url(../images/slogan.jpg) no-repeat;
	display: block;
	padding-right: 187px;
	margin-top: 102px;
}

/* Navigation */

#header ul#nav {
	position: relative;
	width: 940px;
	margin-top: 243px;
}

#nav li { /*main list items*/
	float: left;
	display: block;
	height: 55px;
}

#nav li ul {
	display: none;
}

#nav li.off ul, #nav li.on ul  { /*subnav below*/
	position: absolute;
	top: 55px;
	left: 0;
	background: #49a8dc;
	height: 86px;
	width: 900px;
	margin: 0 20px;
	overflow: hidden;
	padding: 5px 0;
}

#nav li.on ul {
	background: #49a8dc;
}

#nav .centered {
	width: 900px;
	float: right;
	padding-top: 29px;
	text-align: center;
	font-size: 17px;
	color: #282828;
}

#nav li.on:hover ul, #nav li.over ul { /*for ie*/
	background: #49a8dc;
}

#nav li#home a.button {
	text-indent: -9999px;
	background: url(../images/home_btn.jpg) no-repeat;
	background-position: 0 -110px;
	display: block;
	width: 107px;
	height: 55px;
}

#nav li#sicherheit a.button {
	text-indent: -9999px;
	background: url(../images/sicherheit_btn.jpg) no-repeat;
	background-position: 0 0;
	display: block;
	width: 141px;
	height: 55px;
}

#nav li#sicherheit a.button:hover {
	text-indent: -9999px;
	background: url(../images/sicherheit_btn.jpg) no-repeat;
	background-position: 0 -55px;
	display: block;
	width: 141px;
	height: 55px;
}

#nav li#gebaeudesysteme a.button {
	text-indent: -9999px;
	background: url(../images/gebaeudesysteme_btn.jpg) no-repeat;
	background-position: 0 0;
	display: block;
	width: 216px;
	height: 55px;
}

#nav li#gebaeudesysteme a.button:hover {
	text-indent: -9999px;
	background: url(../images/gebaeudesysteme_btn.jpg) no-repeat;
	background-position: 0 -55px;
	display: block;
	width: 216px;
	height: 55px;
}

#nav li#firmenphilosophie a.button {
	text-indent: -9999px;
	background: url(../images/firmenphilosophie_btn.jpg) no-repeat;
	background-position: 0 0;
	display: block;
	width: 216px;
	height: 55px;
}

#nav li#firmenphilosophie a.button:hover {
	text-indent: -9999px;
	background: url(../images/firmenphilosophie_btn.jpg) no-repeat;
	background-position: 0 -55px;
	display: block;
	width: 216px;
	height: 55px;
}

#nav li#aktuell a.button {
	text-indent: -9999px;
	background: url(../images/aktuell_btn.jpg) no-repeat;
	background-position: 0 0;
	display: block;
	width: 117px;
	height: 55px;
}

#nav li#aktuell a.button:hover {
	text-indent: -9999px;
	background: url(../images/aktuell_btn.jpg) no-repeat;
	background-position: 0 -55px;
	display: block;
	width: 117px;
	height: 55px;
}

#nav li#kontakte a.button {
	text-indent: -9999px;
	background: url(../images/kontakte_btn.jpg) no-repeat;
	background-position: 0 0;
	display: block;
	width: 143px;
	height: 55px;
}

#nav li#kontakte a.button:hover {
	text-indent: -9999px;
	background: url(../images/kontakte_btn.jpg) no-repeat;
	background-position: 0 -55px;
	display: block;
	width: 143px;
	height: 55px;
}

#nav li.on ul a, #nav li.off ul a {
	float: left; /*ie doesn't inherit the float*/
	color: #ffffff;
	width: auto;
	margin-right: 30px;
}

#nav li.on:hover ul a, #nav li.over ul li a { /*for ie*/
	background: #49a8dc;
}

#nav li.on ul {
	display: block;
}

#nav li.off:hover ul, #nav li.over ul {
	display: block;
	z-index: 6000;
}

#nav li.off a:hover, #nav li.on a:hover { 
	color: #ffffff;
}

/* end Navigation */

#mainContent {
	padding-top: 30px;
	width: 940px;
}

#mainContent h1 {
	padding-left: 30px;
	color: #49a8dc;
}

#mainContent p {
	padding: 15px 10px 0 10px;
}

#mainContent #boxes {
	width: 940px;
	margin-top: 30px;
	overflow: hidden;
}

#mainContent #boxes p.boxHeadline {
	color: #9fddff;
	font-size: 18px;
	padding: 9px 0;
	text-align: center;
}

#mainContent #boxes p.productName {
	padding: 15px 10px;
	text-align: center;
}

#mainContent #boxes img {
	margin: 0 3px 0 3px;
}

#mainContent #boxes #box1 {
	float: left;
	width: 300px;
	margin-right: 20px;
	background: url(../images/box_bg.jpg) no-repeat top;
}

#mainContent #boxes #box2 {
	float: left;
	width: 300px;
	background: url(../images/box_bg.jpg) no-repeat top;
}

#mainContent #boxes #box3 {
	float: right;
	width: 300px;
	background: url(../images/box_bg.jpg) no-repeat top;
}

#footer {
	background: #808080;
	height: 95px;
	border-top: 3px solid #575757;
	margin-top: 15px;
}

#footer #footerText {
	width: 940px;
	padding-top: 3px;
	margin: 0 auto;
	overflow: hidden;
}

#footer #footerText p {
	color: #282828;
	font-size: 13px;
	text-align: center;
	padding-top: 10px;
}

#footer a#design {
	float: right;
	color: #8ad6ff;
	text-decoration: underline;
}

#footer a#design:hover {
	color: #e0e0e0;
	text-decoration: none;
}

.clearfloat {
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}