/***********************************************************
/****** Basic Layout
/***********************************************************/

body{
	background-color:#ffffff;
	margin: 0px;
	text-align:center;
	font-size:12px;
	overflow:hidden;
}
#site-bg {
	z-index:1; 
	position:absolute; 
	width:100%; 
	height:100%; 
	margin:0px; 
	padding:0px; 
	left:0px; 
	right:0px;
}
#site{
	z-index:2; 
	position:absolute; 
	left:0px; 
	top:0px; 
	margin:0px; 
	padding:0px; 
	height:100%; 
	width:100%; 
	overflow-y: auto; 
	overflow-x: auto; 
	text-align:center;
	}	
	#site #wrapper				{
	position:relative;
	top: 207px;
	left: 30px;
	width:930px;
	margin: 0px auto;
}
	#site #wrapper #header		{ z-index:11; position:absolute; width:930px; height:220px; text-align: left; border: 0px solid red; }
	#site #wrapper #content 	{ z-index:10; position:absolute; width:880px; text-align: left;	 }
	#site #wrapper #footer 		{ position:absolute; width:860px; height: 170px; top:570px; padding-top:15px; margin: 0px; border-top:1px solid #dddddd; text-align: left;}
	#site #popuplayer			{ z-index:101; position:relative; width: 860px; margin: 0px auto; border: 0px solid blue; }

#site-cover	{ 
	z-index:100;
	position:absolute; 
	width: 100%; 
	height:100%; 
	top:0px; 
	left:0px; 
	background: url(../gfx/bg_layer_cover.png); 
	margin: 0px auto;  
	display:none;
	border: 0px solid red; 
}


	

/***********************************************************
/****** Header 
/***********************************************************/
#header #logo 				{ display:block; width:124px; height:52px; background: url(../gfx/logo_pcs.png);}
#header .gridTop			{ position:absolute; left: 150px; top:48px; border-bottom: 1px solid #dddddd; width: 705px;}
#header #logo span			{ display:none;}
#header h1 					{ position:absolute; left: 0px; top:55px;}
#header p 					{ position:absolute; left: 0px; top:115px;}
	
/***********************************************************
/****** Header popup layer
/***********************************************************/
.popup							{ display:none;}
.popup .runout					{ position:absolute; width:720px; top:160px; left:40px; background: url(../gfx/bg_layer_border.png); margin: 0px auto; padding:20px; z-index:102;}
.popup .box						{ background: url(../gfx/bg_layer.png); border:1px solid #babdc2; text-align:left;}
.popup .close					{ position:absolute; top:35px; right:35px; width: 16px; height:16px; background: url(../gfx/ico_cross.png); display:block; cursor:pointer;}
.popup .textArea				{ padding: 25px 30px 30px 30px; }
.popup .textArea h1				{ padding: 0px 0px 15px 0px; margin: 0px; border:0px solid red; }

		
/***********************************************************
/****** content
/***********************************************************/
#menu 						{ position:absolute; top: 200px; z-index:12; }
#menu #menuButton-01		{ position:absolute; top: 65px; }
#menu #menuButton-02		{ position:absolute; top: 107px; }
#menu #menuButton-01 .bg	{ width:283px; height:120px;}
#menu #menuButton-02 .bg	{ width:283px; height:82px;}
#menu #menuButton-01 .mout	{ background: url(../gfx/menu_mac100.png) 0px 0px;}
#menu #menuButton-02 .mout	{ background: url(../gfx/menu_mac200.png) 0px 0px;}	
#menu #menuButton-01 .mover	{ background: url(../gfx/menu_mac100.png) 0px 123px;}
#menu #menuButton-02 .mover	{ background: url(../gfx/menu_mac200.png) 0px -126px;}

#content .hint 				{ position:absolute; top: 360px; right:22px; text-align: right; display:none;}
#content .hint .download	{ position:relative; top: -7px; right:0px; padding: 0px 10px 0px 4px; float:right; }
#menuHint-01 .download		{ background: #e8ded7; width: 165px;}
#menuHint-02 .download		{ background: #c8d5e3; width: 165px;}
#menuHint-01 .download:hover{ background: #f2eae5; width: 165px;}
#menuHint-02 .download:hover{ background: #e0eaf5; width: 165px;}
.hint .download	.ico		{ display:inline-block; background: url(../gfx/ico_pdf.png); width:21px; height:21px; margin: 2px 5px 2px 0px; float:left;}

#content #illustration-00 	{ position:absolute; left: 50px; top:120px; background: url(../gfx/pipe.png) 0px 0px; width:880px; height:500px;}
#content #illustration-01 	{ position:absolute; left: 50px; top:120px; background: url(../gfx/pipe.png) 0px -500px; width:880px; height:500px; display:none;}
#content #illustration-02 	{ position:absolute; left: 50px; top:120px; background: url(../gfx/pipe.png) 0px -1000px; width:880px; height:500px; display:none;}

#content .submenu 			{ position:absolute; top: 00px; left:50px; border:0px solid red; display:none;}	

#submenu-01-a				{ position:absolute; top: 286px; left:294px;}
#submenu-01-b				{ position:absolute; top: 270px; left:367px;}
#submenu-01-c				{ position:absolute; top: 252px; left:424px;}
#submenu-01-d				{ position:absolute; top: 236px; left:475px;}
#submenu-01-a .bg			{ width:81px; height:82px; overflow:visible;}
#submenu-01-b .bg			{ width:68px; height:69px; overflow:visible;}
#submenu-01-c .bg			{ width:62px; height:63px; overflow:visible;}
#submenu-01-d .bg			{ width:57px; height:57px; overflow:visible;}
#submenu-01-a .mout			{ background: url(../gfx/submenu_mac100_01.png) 0px 0px;}
#submenu-01-b .mout			{ background: url(../gfx/submenu_mac100_02.png) 0px 0px;}	
#submenu-01-c .mout			{ background: url(../gfx/submenu_mac100_03.png) 0px 0px;}	
#submenu-01-d .mout			{ background: url(../gfx/submenu_mac100_04.png) 0px 0px;}	
#submenu-01-a .mover		{ background: url(../gfx/submenu_mac100_01.png) 0px 82px;}
#submenu-01-b .mover		{ background: url(../gfx/submenu_mac100_02.png) 0px 69px;}	
#submenu-01-c .mover		{ background: url(../gfx/submenu_mac100_03.png) 0px 63px;}	
#submenu-01-d .mover		{ background: url(../gfx/submenu_mac100_04.png) 0px 57px;}	

#submenu-01-a .ico			{ position:absolute; top: 22px; left:22px; width:46px; height:46px; border:0px solid red;}
#submenu-01-b .ico			{ position:absolute; top: 20px; left:20px; width:37px; height:37px; border:0px solid red;}
#submenu-01-c .ico			{ position:absolute; top: 20px; left:20px; width:30px; height:30px; border:0px solid red;}
#submenu-01-d .ico			{ position:absolute; top: 20px; left:20px; width:30px; height:30px; border:0px solid red;}

#submenu-01-a .tooltipHolder				{ position:absolute; top: 0px; left:40px; border:0px solid red;}
#submenu-01-b .tooltipHolder				{ position:absolute; top: -4px; left:33px; border:0px solid red;}
#submenu-01-c .tooltipHolder				{ position:absolute; top: -7px; left:30px; border:0px solid red;}
#submenu-01-d .tooltipHolder				{ position:absolute; top: -7px; left:28px; border:0px solid red;}
#submenu-01-a .tooltipHolder	.tooltip 	{ position:absolute; bottom:-10px; left:-40px; background: url(../gfx/bg_tooltip_submenu_01.png) center; width:80px; height: 27px; line-height:27px; border-left:1px solid #e17c29; border-right:1px solid #e17c29;}
#submenu-01-b .tooltipHolder	.tooltip 	{ position:absolute; bottom:-10px; left:-75px; background: url(../gfx/bg_tooltip_submenu_01.png) center; width:150px; height: 27px; line-height:27px; border-left:1px solid #e17c29; border-right:1px solid #e17c29;}
#submenu-01-c .tooltipHolder	.tooltip 	{ position:absolute; bottom:-10px; left:-60px; background: url(../gfx/bg_tooltip_submenu_01.png) center; width:120px; height: 27px; line-height:27px; border-left:1px solid #e17c29; border-right:1px solid #e17c29;}
#submenu-01-d .tooltipHolder	.tooltip 	{ position:absolute; bottom:-10px; left:-75px; background: url(../gfx/bg_tooltip_submenu_01.png) center; width:150px; height: 27px; line-height:27px; border-left:1px solid #e17c29; border-right:1px solid #e17c29;}
#submenu-01	  .tooltipHolder	span 	 	{ position:absolute; bottom:-30px; left:-2px; background: url(../gfx/bg_tooltip_arrow_01.png); display:block; width:5px; height:21px; }
#submenu-01	 a 			.tooltipHolder		{ display:none;}
#submenu-01	 a:hover 	.tooltipHolder		{ display:block;}

#submenu-02-a				{ position:absolute; top: 282px; left:290px;}
#submenu-02-b				{ position:absolute; top: 264px; left:363px;}
#submenu-02-c				{ position:absolute; top: 248px; left:420px;}
#submenu-02-a .bg			{ width:91px; height:90px; overflow:visible;}
#submenu-02-b .bg			{ width:78px; height:78px; overflow:visible;}
#submenu-02-c .bg			{ width:71px; height:71px; overflow:visible;}
#submenu-02-a .mout			{ background: url(../gfx/submenu_mac200_01.png) 0px 0px;}
#submenu-02-b .mout			{ background: url(../gfx/submenu_mac200_02.png) 0px 0px;}	
#submenu-02-c .mout			{ background: url(../gfx/submenu_mac200_03.png) 0px 0px;}	
#submenu-02-a .mover		{ background: url(../gfx/submenu_mac200_01.png) 0px 90px;}
#submenu-02-b .mover		{ background: url(../gfx/submenu_mac200_02.png) 0px 78px;}	
#submenu-02-c .mover		{ background: url(../gfx/submenu_mac200_03.png) 0px 71px;}	

#submenu-02-a .ico			{ position:absolute; top: 22px; left:22px; width:46px; height:46px; border:0px solid red;}
#submenu-02-b .ico			{ position:absolute; top: 20px; left:20px; width:37px; height:37px; border:0px solid red;}
#submenu-02-c .ico			{ position:absolute; top: 20px; left:20px; width:30px; height:30px; border:0px solid red;}

#submenu-02-a .tooltipHolder				{ position:absolute; top: 0px; left:45px; border:0px solid red;}
#submenu-02-b .tooltipHolder				{ position:absolute; top: -4px; left:39px; border:0px solid red;}
#submenu-02-c .tooltipHolder				{ position:absolute; top: -7px; left:35px; border:0px solid red;}
#submenu-02-a .tooltipHolder	.tooltip 	{ position:absolute; bottom:-10px; left:-40px; background: url(../gfx/bg_tooltip_submenu_02.png) center; width:80px; height: 27px; line-height:27px; border-left:1px solid #25599d; border-right:1px solid #25599d;}
#submenu-02-b .tooltipHolder	.tooltip 	{ position:absolute; bottom:-10px; left:-75px; background: url(../gfx/bg_tooltip_submenu_02.png) center; width:150px; height: 27px; line-height:27px; border-left:1px solid #25599d; border-right:1px solid #25599d;}
#submenu-02-c .tooltipHolder	.tooltip 	{ position:absolute; bottom:-10px; left:-60px; background: url(../gfx/bg_tooltip_submenu_02.png) center; width:120px; height: 27px; line-height:27px; border-left:1px solid #25599d; border-right:1px solid #25599d;}
#submenu-02	  .tooltipHolder	span 	 	{ position:absolute; bottom:-30px; left:-2px; background: url(../gfx/bg_tooltip_arrow_02.png); display:block; width:5px; height:21px; }
#submenu-02	 a 			.tooltipHolder		{ display:none;}
#submenu-02	 a:hover 	.tooltipHolder		{ display:block;}
	
/***********************************************************
/****** footer
/***********************************************************/
#footer #contactInfo-01 {	position:absolute; left: 0px; top: 60px; }
#footer #contactInfo-02 {	position:absolute; left: 350px; top: 60px; }
#footer #contactInfo-03 {	position:absolute; left: 650px; top: 60px; }
#sitetop {
	z-index:2;
	position:absolute;
	left:0px;
	top:0px;
	margin:0px;
	padding:0px;
	width:100%;
	overflow-y: auto;
	overflow-x: auto;
	text-align:center;
	background-color: #37383A;
	height: 167px;
}
#logoholder {
	text-align: center;
	width: 930px;
	margin-right: auto;
	margin-left: auto;
}
.logoplace {
	text-align: left;
	width: 930px;
	float: left;
	height: 167px;
}