html, body {height: 
100%;}

body {
	margin: 2em;
	padding: 0;
	font: normal 76% verdana, arial, sans-serif;
	background: #fff url(images/bodybg.jpg); 
}
img {border: 0 none;}

/*HEADER*/

#header {
	height: 130px;
	background: #fff url(images/gradient501.jpg) 100% 20%  repeat-y;
	color: #039;
	margin: 0 0 1em 0;
	border-right: 10px solid #c30;
}

#header img {
	float: left;
	width: 138px;
	height: 130px;
	margin-top: 0;
	vertical-align: middle; 
}

#header h1 {
	font: 3.5em Georgia, "Times New Roman", serif;
	font-weight: bold;
	color: #039;
	margin-top: 0;
	padding-top: 0.25em;
}

#header h2 {
	font: 1.6em Georgia, "Times New Roman", serif;
	color: #039;
	margin:-1em 0 0.25em 0;
}
#header p  {
	font: 0.8em verdana, arial, sans-serif;
	margin:0;
	padding: 0 .25em;
} 

/*WRAPPER*/

#wrapper {
	margin: 0;
	padding: 0;
	min-height: 75%;
	background:#fff url(images/gradient501.jpg) repeat-y right;
	border-right: 10px solid #c30;
}
/*LEFT*/

#left
{
	width: 22em;
	float: left;
}

#left  a {background-color: #dee; color: #000;}
#left  a:hover {background-color: #fff; color: #c30;}

.rcbox {
   background: #dbeded;
   width: 20em;/*ie6 needs 21em - see separate css*/
   margin-top: 2em;
   margin-left: 1em;
 
}

.rctop div {
   background: url(images/rctl.png) no-repeat top left;
}
.rctop {
   background: url(images/rctr.png) no-repeat top right;
}
.rcbottom div {
   background: url(images/rcbl.png) no-repeat bottom left;
}
.rcbottom {
   background: url(images/rcbr.png) no-repeat bottom right;
}
.rctop div, .rctop, 

.rcbottom div, .rcbottom {
   width: 100%;
   height: 30px;
   font-size: 1px;
}
.rccontent { margin: 0 30px; }

/*NAV*/

#nav {
	width: 15em;
	margin-left: -0.5em;
	padding: 0; 
	list-style: none;	
	background: #fff;
}
#nav a, #nav span {
	display: block;
	width: 15em;
	padding:  0.5em;
	text-decoration: none;
	font-weight: bold;	
	border: 0.15em solid #fff;
}
#nav a {background-color: #dee; color: #000;}
#nav span {background-color: #c30;  color: #fff; }
#nav a:hover {background-color: #fff; color: #c30;}


/*CONTENT*/

#content {
	line-height: 1.5em;
	padding: 0.5em 1em 3em 1em;
	margin:0 0 0 21em;
}

#content h1 {
	font-size: 1.4em;
	text-align: left;
	color: #c30;
	padding: 1em  1em 0 0.5em;
	margin-top: 0;
}

#content  h2 {
	font-size: 1.1em;
	text-align: left;
	color: #c30;
	padding: 0 0 0 1em;
}

#content  h3 {
	font-size: 1em;
	text-align: left;
	color: #000;
	padding: 1em 0 0 1em;
}

#content p {padding: 1em 0.5em; text-align: left;}
#content p span {font-weight:bold; color: #c30;}
#content a {font-weight: bold; font-size: 0.9em; color: #039; text-decoration: underline;}
#content a:hover {background-color: #fff; text-decoration: underline; color:  #c30;}
#content ul li {padding-bottom: 0.5em;}

#header:after, #wrapper:after, #content:after {
	display:block;
	content: "";
	height:0;
	clear:both;
}

#cnc #content ul {line-height: 3em;}

/*PICS - main page js*/

#pics
{
	width: 300px;
	height:310px;	
	padding: 0;
	margin: 1em;
	float: right;
}

#pics img
{
	padding: 5px;
	background: transparent;
	width:295px;
	height: 300px;
	top: 0;
	left: 0;
	border-top:1px solid #039;
	border-right:5px solid #039;
	border-bottom:5px solid #039;
	border-left:1px solid #039;
}

/*BOX - machining, cnc*/

#box {
	width: 520px;
	height: 182px;
	background: transparent;
	font-weight: bold;
	text-align: left;
	margin: 0 0 3em 0;
	padding: 0 0 0 1em;
}

#box img {float: left; width: 510px; border: 1px solid #000;}

/*UL.IMG*/

ul.img {

	list-style:none;
	font-size: .76em;
	font-weight: bold;
	margin: 0;
	padding:0 0 1em 0.5em;
	float: right;
	width: 50%;
    }

ul.img li {

	width: 160px;
	height: 250px;
	float: left;
	margin: 0.2em;
	margin-bottom: 1em;
	background-color:#daecec;
	border: 1px solid #242;
    }
#designservice ul.img li {height: 320px;}
#remote ul.img li {height: 300px;} 
#project ul.img li {height: 300px;}
#companyfacilities ul.img li {height: 300px;}

ul.img li div {

	height: 150px;
	position:relative;
	background-color: #daecec;
    }
#companyprofile ul.img li div {
	height: 275px;
	position:relative;
	background-color: #daecec;
    }
#companyfacilities ul.img li div {

	height: 220px;
	position:relative;
	background-color: #daecec;
    }
ul.img li img { 
	display:block;
	position:absolute;
	bottom:0;
	left: 3px;
	width: 150px;
    }

ul.img li p {
	margin: 0.25em;
	color: #000;
	font-size: 1.2em;
	line-height:1.5em;
    }    

ul.img li p span {

	font-weight:bold;
	font-size: 1em;
	color: #c30;
	width: 1em;
    }

ul.img:after {

  display:block;
  content: " ";
  clear:left;
  height:0;
}

*html ul.img {height: 1%;}


#designservice ul.img li img { 
	display:block;
	position:absolute;
	top:3px;
	left: 3px;
	width: 150px;	
    }
    
#designservice ul.img li p {
	margin: 4em 0.25em 0.25em  0.25em;
	color: #000;
	font-size: 1.2em;
    }      
#designservice ul.img li span {height: 200px;}

#companyprofile ul.img {width: 30%; margin-top: 3em;}
#companyprofile ul.img li {height: 400px;}
#companyprofile ul.img li img { 
	display:block;
	position:absolute;
	bottom:0;
	left: 5px;
	width: 150px;
	height: 270px;	
    }
  

#companyfacilities ul.img li img { 
	display:block;
	position:absolute;
	bottom:0;
	left: 3px;
	width: 150px;	
    } 
    
#companyfacilities  ul.img li p {
	margin: 0.25em  0.25em 0.25em  0.25em;
	color: #000;
	font-size: 1.2em;
    }        
/*UL.LEFTIMG*/

ul.leftimg {

	list-style:none;
	font-size: .76em;
	font-weight: bold;
	margin: 0;
	padding: 0 0 1em 1em;
	float: left;
	width: 100%;
    }

ul.leftimg li {

	width: 160px;
	height: 250px;
	float: left;
	margin: 0.5em 0.2em 0.5em 0;
	background-color:#daecec;
	border: 1px solid #242;
    }

ul.leftimg li div {

	height: 150px;
	position:relative;
	background-color: #daecec;
    }

ul.leftimg li img { 
	display:block;
	position:absolute;
	bottom:0;
	left: 3px;
    }

ul.leftimg li p {
	margin: 0.25em;
	color: #000;
	font-size: 1.2em;
	line-height:1.5em;
    }    

ul.leftimg li p span {

	font-weight:bold;
	font-size: 1em;
	color: #c30;
	width: 1em;
    }

ul.leftimg li p img {

	display:block;
	margin-top:1em;
	width: 48px;
	height: 24px;
    }

ul.leftimg:after {

  display:block;
  content: " ";
  clear:left;
  height:0;
}

*html ul.leftimg {height: 1%;}

/*FORM*/
	
form {
	color:#000;
	font-size:1em;
	font-weight:bold;
	margin-left:0px;
	width:100%;
}

fieldset {
	border: 0 none;
	margin-bottom:1em;
	line-height:1em;
	padding:.5em;
}

fieldset legend {
	color:#000;
	font-weight:bold;
	padding:0.5em 0 1em 0;
	line-height: 1.5em;
}

fieldset p {
	margin:.25em 0;
	min-height:1.5em;
}

fieldset p label {
	display:block;
	width:13em;
	min-width:13em;
	float:left;
}

input,select,textarea{vertical-align:bottom; }

input.button {
	font-size:.9em;
	padding:.3em;
	background-color:#fff;
	color:#000;
	border:0.2em outset #2a2a7e;
}

/*FOOTER*/

#footer {
	clear: both;
	height: 3.2em;
	margin-top: 0.5em;
	background: #fff url(images/gradient501.jpg) 100% 20%  repeat-y;
	font-size: 0.8em;
	color: #039;
	text-align: right;
	padding: 0.5em 0 0 0;
	border-right: 10px solid #c30;
}
#footer p  {padding: 0.5em 1em 0 0; text-align: right;font-size: 8px; font-weight: bold;}
#footer a { color: #039;}
#footer a:hover {color: #c30; background: #dbeded;}


* html#NAV {width: 18em;}

* html#NAV a,* html#NAV span,* html#NAV ul a,* html#NAV ul span {width: 17em;}

 /* Mac ie \*//*/
* html #wrapper { display: inline-block;}
/* end Mac ie */