@charset "UTF-8";
/* CSS Document */
html, body{
	height: 100%;
}

body {
	margin: 0;
	padding: 0;
	background:url(../images/layout/body_bg.png) repeat-x;
}

div#main_container {
	width: 850px;
	position: relative;
    min-height: 100%;
	height: 100%;
    voice-family: "\"}\"";
    voice-family: inherit;
    height: auto;
	margin: 0px auto 0px auto;
	background-color:#FFF;
	
}

div#site_container {
	width: 850px;
	margin: 0 auto 0 auto;
	text-align:left;
	padding-bottom: 53px;
}

/* @group Top */

div#top_container {
	width: 850px;
	margin:0px 0 0 0px;
	padding:28px 0 0 0;
}


div#top_logo {
	width: 374px;
	height: 253px;
	float: left;
}


div#navigation_container{
}

/* @end */

/* @group Content */

div#content_container {
	width: 850px;
	min-height:50%;
	clear:both;
	
}

div#content_top{
	width: 850px;
}


div#content_bottom{
	width: 850px;
	background-color:#FFF;
	height:350px;
	
	
}
div#content_bottom_container{
	width: 850px;
	padding: 0 0 0 9px;
}

div.content_bottom_blocks_container{
	width: 271px;
	margin:0 9px 0 0;
	float: left;
}
div.content_bottom_blocks_hd{
	width: 271px;
	height: 24px;
	
	margin:0 9px 0 0;
	
	background:url(../images/layout/header_bg.jpg) no-repeat;


}

div.content_bottom_blocks_text{
	width: 271px;
	/*height: 255px;*/
	margin:0 8px 0 0;
}


div.content_bottom_blocks_container2{
	width: 600px;
	margin:0 9px 0 0;
	float: left;
}
div.content_bottom_blocks_hd2{
	width: 600px;
	height: 24px;
	
	margin:0 9px 0 0;
	
	background:url(../images/layout/header_bg.jpg) no-repeat;


}

div.content_bottom_blocks_text2{
	width: 600px;
	/*height: 255px;*/
	margin:0 8px 0 0;
}
div.content_bottom_blocks_container3{
	width: 210px;
	margin:0 9px 0 20px;
	float: left;
}
div.content_bottom_blocks_hd3{
	width: 210px;
	height: 24px;
	
	margin:0 9px 0 0;
	
	background:url(../images/layout/header_bg.jpg) no-repeat;


}

div.content_bottom_blocks_text3{
	width: 210px;
	/*height: 255px;*/
	margin:0 8px 0 0;
}

div.content_bottom_blocks_container4{
	width: 550px;
	margin:0 9px 0 9px;
	float: left;
}
div.content_bottom_blocks_hd4{
	width: 550px;
	height: 24px;
	
	margin:0 9px 0 0;
	
	background:url(../images/layout/header_bg.jpg) no-repeat;


}

div.content_bottom_blocks_text4{
	width: 550px;
	/*height: 255px;*/
	margin:0 8px 0 0;
}
div.content_bottom_blocks_container5{
	width: 210px;
	margin:0 9px 0 20px;
	float: left;
}
div.content_bottom_blocks_hd5{
	width: 210px;
	height: 24px;
	
	margin:0 9px 0 0;
	
	background:url(../images/layout/header_bg.jpg) no-repeat;


}

div.content_bottom_blocks_text5{
	width: 210px;
	/*height: 255px;*/
	margin:0 8px 0 0;
}
/* @end */

div.content_bottom_blocks_container6{
	width: 400px;
	margin:0 9px 0 0;
	float: left;
}
div.content_bottom_blocks_hd6{
	width: 400px;
	height: 24px;
	
	margin:0 9px 0 0;
	
	background:url(../images/layout/header_bg.jpg) no-repeat;


}

div.content_bottom_blocks_text6{
	width: 400px;
	/*height: 255px;*/
	margin:0 8px 0 0;
}


div.content_bottom_blocks_container7{
	width: 420px;
	margin:0 9px 0 0;
	float: left;
}
div.content_bottom_blocks_hd7{
	width: 420px;
	height: 24px;
	
	margin:0 9px 0 0;
	
	background:url(../images/layout/header_bg.jpg) no-repeat;


}

div.content_bottom_blocks_text7{
	width: 420px;
	/*height: 255px;*/
	margin:0 8px 0 0;
}




/* @group Footer */
div#footer_container {
	position: absolute;
	bottom: 0;
	width: 850px;
	height: 38px;
	margin: 0 0 0 9px;
	background: url(../images/layout/footer_bg2.png) no-repeat;
	text-align:left;
	

}


/* @end */ 



/* @group NAVIGATION */
#nav_container{
	position: relative;
	left: 190px;
	top:13px;
	width:700px;
	
	
	
	}
#divNav {
	clear:both;
	 position:absolute;
		background: transparent url(nav_bg.gif) no-repeat 37px 17px;
		margin: 0;
		padding: 0;
		height: 61px;
		width: 673px;
	
	}

	#nav {
		position: relative;
		height: 31px;
		width: 623px;
	}

	#nav li ul, #nav li ul {
		margin: 0;
		padding: 0;
	}

	#nav a {
		text-decoration: none;
	}

	#nav li { /*float the main list items*/
		margin: 0;
		float: left;
		display: block;
		padding-right: 10px;
	}

	#nav li ul {
		display: none;
	}

	#nav li.off ul, #nav li.on ul  { /*put the subnav below*/
		position: absolute;
		top: 31px;
		left: 49px;
		padding-top: 8px;
		background: url(navigation_sub.gif) no-repeat;
		height: 28px;
		width: 620px;
		padding-left: 15px;
	}

	#nav li.on ul {
		/*background: #f90;*/
	}

	#nav li.on:hover ul, #nav li.over ul { /*for ie*/
		background: url(navigation_sub.gif) no-repeat;
	}

	#nav li a.trading {
		display: block;
		width: 152px;
		padding: 0;
	}
	#nav li a.modular {
		color: #224d6f;
		font-weight: bold;
		display: block;
		width: 143px;
		padding: 0;
	}
#nav li a.composite {
		color: #224d6f;
		font-weight: bold;
		display: block;
		width: 145px;
		padding: 0;
	}
#nav li a.diaben {
		color: #224d6f;
		font-weight: bold;
		display: block;
		width: 143px;
		padding: 0;
	}
	
	#nav li.on a {
		color: #f90;
	}

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

	#nav li.on:hover ul a, #nav li.over ul li a { /*for ie - the specificity is necessary*/
		background: none;
	}

	#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: #f90;
	}

	/*do the image replacement*/

	#nav li span {
		position: absolute;
		left: -9384px;
	}

	#liTrading a, #liModular a, #liComposite a, #liDiaben a{
		display: block;
		position: relative;
		height: 31px;
		background: url(navigation.gif) no-repeat; /*contains all hover states*/
	}

/*first, put the initial states in place*/

#liTrading a {
	background-position: 0 0;
}

#liModular a {
	background-position: -162px 0;
}

#liComposite a {
	background-position: -316px 0;
}

#liDiaben a {
	background-position: -472px 0;
}



/*active area - for this demo - the code could be based on a body class, and probably work better.*/

 #liTrading.on a {
 	background-position: -1px -31px;
 }
 #liModular.on a {
 	background-position: -162px -31px;
 }
 #liComposite.on a {
 	background-position: -316px -31px;
 }
 #liDiaben.on a {
 	background-position: -472px -31px; 
 }
 /*add selectors for the other li's and background-positions*/

/*hover states*/

#liTrading a:hover, #liTrading:hover a, #liTrading.over a {
	background-position: -1px -31px;
}

#liModular a:hover, #liModular:hover a, #liModular.over a {
	background-position: -162px -31px;
}

#liComposite a:hover, #liComposite:hover a, #liComposite.over a {
	background-position: -316px -31px;
}
#liDiaben a:hover, #liDiaben:hover a, #liDiaben.over a {
	background-position: -472px -31px;
}

/*subnav formatting*/

#nav li.off ul a, #nav li.on ul a {
	display: block;
	background:none;
	color: #575555;
	font-family: arial, verdana, sans-serif;
	font-size: small;
}		

#nav li.on ul a {
	background: none;
}

#solutions {
 width: 850px;
 height: 253px;
 background: url(../images/solution_menu.gif);
 margin: 10px auto; padding: 0;
 position: relative;
}
#solutions li {margin: 0; padding: 0; list-style: none; position: absolute; top: 0;}

#solutions li, #solutions a {height: 250px; display: block;}
#panel1b {left: 9px; width: 166px;}
#panel2b {left: 174px; width: 167px;}
#panel3b {left: 341px; width: 166px;}
#panel4b {left: 506px; width: 166px;}
#panel5b {left: 672px; width: 167px;}

#panel1b a:hover {background: transparent url(../images/solution_menu.gif) -9px -253px no-repeat;}
#panel2b a:hover {background: transparent url(../images/solution_menu.gif) -174px -253px no-repeat;}
#panel3b a:hover {background: transparent url(../images/solution_menu.gif) -341px -253px no-repeat;}
#panel4b a:hover {background: transparent url(../images/solution_menu.gif) -506px -253px no-repeat;}
#panel5b a:hover {background: transparent url(../images/solution_menu.gif) -672px -253px no-repeat;}

#panel1b.on {background: transparent url(../images/solution_menu.gif) -9px -253px no-repeat; cursor:default}
#panel2b.on {background: transparent url(../images/solution_menu.gif) -174px -253px no-repeat;}
#panel3b.on {background: transparent url(../images/solution_menu.gif) -341px -253px no-repeat;}
#panel4b.on {background: transparent url(../images/solution_menu.gif) -506px -253px no-repeat;}
#panel5b.on {background: transparent url(../images/solution_menu.gif) -672px -253px no-repeat;}


/* @group Images */

img.logo {
	margin: 10px 0 0 9px;
	float: left;
	text-decoration:none;
	border:0px;
}

img.druppels {
	margin-bottom: 0px;
	margin-top:249px;
}


img.menutop {
	bottom: 0;
	margin: 0px;
}

img.portfolio_icoon {
	bottom: 0;
	margin-top:5px;
	padding:4px;
	border:1px solid #ddd;
}
img.solutions {
	margin-top:35px;
	margin-left:35px;
	padding:4px;
	border:1px solid #ddd;
}
img.product {
	
	margin-left:35px;
	padding:4px;
	border:1px solid #ddd;
	float:right;
}
img.gallery {
	height: 50px;
	width: 50px;
	margin-right:10px;
	padding:4px;
	border:1px solid #ddd;
	float:left;
}


/* @end */
a.contact_button{font-family:Arial, Helvetica, sans-serif; color:#58595a; font-weight:bold; font-size:14px; text-decoration:none; margin: 0 9px 0 0; padding:0; float:right;}

h1{ 
}
p{font-family:Arial, Helvetica, sans-serif; color:#757575; font-weight:bold; font-size:12px; text-decoration:none; padding:0; }
p.block_text{font-family:Arial, Helvetica, sans-serif; color:757575; font-weight:bold; font-size:12px; text-decoration:none; margin:19px 0 19px 0; padding:0; 
}
p.block_text_front{height:78px;font-family:Arial, Helvetica, sans-serif; color:#757575; font-weight:bold; font-size:12px; text-decoration:none; margin:19px 0 19px 0; padding:0; 
} 
ul.block_list{ list-style-image:url(../images/pijl_list.gif); font-family:Arial, Helvetica, sans-serif; color:#757575; font-weight:bold; font-size:12px; text-decoration:none; margin:45px 0 19px 0; padding:0 0 0 20px;
}
ul.block_list li{ margin:5px 0 0 0; 
}
ul.block_list2{ list-style-image:url(../images/pijl_list.gif); font-family:Arial, Helvetica, sans-serif; color:#757575; font-weight:bold; font-size:12px; text-decoration:none; margin:19px 0 19px 0; padding:0 0 0 20px;
}
ul.block_list2 li{ margin:5px 0 0 0; 
}
ul.block_list2 a{text-decoration: none;color:#757575}

ul.block_list3{ list-style-image:url(../images/pijl_list.gif); font-family:Arial, Helvetica, sans-serif; color:#757575; font-weight: normal; font-size:12px; text-decoration:none; margin:5px 0 0 0; padding:0 0 0 10px;
}
ul.block_list3 li{ margin:0 0 0 0; 
}
ul.block_list3 a{text-decoration: none;color:#757575}

ul.block_list a{text-decoration: none;color:#757575}

p.header{
	font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#FFF;
	margin:0;
	padding:4px 0 0 5px;
}
p.footer{font-family:Arial, Helvetica, sans-serif; color:#58595a; font-weight:bold; font-size:12px; text-decoration:none; margin: 13px 0 0 20px; padding:0; ;
	
	}
p.footer a{font-family:Arial, Helvetica, sans-serif; color:#58595a; font-weight:bold; font-size:12px; text-decoration:none; ;
	
	}
p.footer2{font-family:Arial, Helvetica, sans-serif; color:#58595a; font-weight:bold; font-size:12px; text-decoration:none; margin: 13px 40px 0 20px; padding:0; float:right ;
	
	}
table.contact2{font-family:Arial, Helvetica, sans-serif; color:#757575; font-weight:bold; font-size:12px; text-decoration:none;} 
p.gallery_block	{ font-family:Arial, Helvetica, sans-serif; color:#757575; font-weight:bold; font-size:12px; text-decoration:none; margin:19px 0 0 0; padding:0;
}
p.gallery_block2	{font-family:Arial, Helvetica, sans-serif; color:#757575; font-weight:bold; font-size:12px; text-decoration:none; margin:0 0 0 0; padding:0; float:left;
}
div.gallery__content_block	{ font-family:Arial, Helvetica, sans-serif; color:#757575; font-weight:bold; font-size:12px; text-decoration:none; margin:19px 20px 0 0; padding:0;  float:left;
}
div.gallery__content_block2	{font-family:Arial, Helvetica, sans-serif; color:#757575; font-weight:bold; font-size:12px; text-decoration:none; margin:19px 0 0 0; padding:0; float:left; clear:right;
}