*  {margin:0;padding:0}
ul {list-style:none}
img {border:none;display:block;}
body {
	position:relative;
	color:#000; 
	background:#fcfcfc;
	font-size: 90%; 
	font-family: Arial, Helvetica, sans-serif;
	text-align:center;/* for ie5.+*/
	padding:0 0 15px 0;

}

/* #outer holds all page content */
#outer {
	width:780px;
	margin:0 auto;
	text-align:left;
	position:relative;
	background:#fff url(../images/main-bg.jpg) repeat-y left top;
}
#inner {
	width:746px;
	margin-left:17px;

	}
	
#header {

	height:203px;
	background:#fff url(../images/header1.jpg) no-repeat 0 3px;
	padding-top:3px;
	margin-bottom:3px;

	}

#header p  {
	display:block;

	height:177px;
	position:absolute;
	left:610px;
	top:10px;
	z-index:2;
 	color:#392e73;
	width:300px;
	}
	
	
#header p  {text-indent:-999em}


#header .headerlink p
	{
	color: #3e3180;
	text-indent:0px;
	}
	
	




h1 {
	width:746px;
	position:relative;
	z-index:1;
	margin:3px 0;
	background:#dedede;
	color:#392e73;
	font-size:110%;
 text-align:center;
	padding:12px 0 9px 0;
}

* html #header {height:206px;he\ight:203px;}
/* use this format below for different ../images in the header if required - 
  just add the body class for the relevant image - 
	Just change then to valid names or delete the style if no image is required
	*/
body .a0 #header {background:#fff url(../images/header2.jpg) no-repeat left top;}
/*....body .a1 etc, body .b1 etc - and so on */



#main {
	width:746px;
	background:#fff url(../images/nav-bg2.jpg) repeat-y left top;
	margin:3px 0;
}
#content {
	float:right;
	width:550px;
	background:#fff;
	color:#3e3180;
	padding-bottom:8px;
	font-size:85%;
	line-height:1.4em
}
#content p {
	margin:0 15px 15px;
}
#content p.squash  {margin:0 15px}

#content a  {color:#3e3180}

#content a:hover {color:#cc0000;}

#content h4 {
 	font-weight:bold;
	margin:15px;
	font-size:100%;
}

#content h5 
	{
	color:#cc0000;
 	font-weight:bold;
	margin:0px 15px;
	font-size:110%;
}

#home #content  
	{
	width:551px;
	padding-bottom:0;
	font-size:100%;
	line-height:normal;	
}/* home page is 1px wider for this element*/
#nav 	
	{
	float:left;
	width:193px;
	list-style:none;
}

#nav li  {
	border-bottom:1px solid #fff;
	padding:3px 0;
	background:transparent url(../images/nav-bg.jpg) repeat-y left top;
}
#nav li li {background:transparent;}
#nav li,
#nav li a {
	width:193px;
	display:block;
	text-decoration:none;
	color:#fff;
	line-height:1.03em;
}
@media all and (min-width: 0px) {/*opera bug*/
  #nav li a  {
	line-height:1.09em
  }
}

#nav li a {
	width:173px;
	padding:0px 10px;
}
* html #nav li a  {width:193px;w\idth:173px;}

#nav li a:hover {color:#3e3180}
#nav ul ul  {display:none;margin-bottom:-3px}/* close all menus*/

/* open current menu using body id */
body#home #nav li.home ul  {display:none}/* change to display-block etc */
body#site #nav li.site ul  {display:block}
body#engineer #nav li.engineer ul  {display:block}/* this one turned on */
body#manpower #nav li.manpower ul  {display:none}/* this one turned off */
body#contact #tnav li.contact ul  {display:none}
body#latest #nav li.latest ul  {display:none}
body#about #nav li.about ul  {display:none}
body#recruit #nav li.recruit ul  {display:block}
body#maps #nav li.maps ul  {display:none}
body#links #tnav li.links ul  {display:none}



/* set current nav  depending on class in the body and on the list */
/* just add more items in the same format if needed */
/* compleetly remove the sublist from the html if no sub menu is required */
/* first list*/
body.a0 #nav li.a0 a {color:red;}
body.a0 #nav li.a0 li a {color:#fff;}/* stop sub lists inherriting color*/
body.a1 #nav li.a1 a {color:red;}
body.a2 #nav li.a2 a {color:red;}
body.a3 #nav li.a3 a {color:red;}
body.a4 #nav li.a4 a {color:red;}
body.a5 #nav li.a5 a {color:red;}
/* second list*/
body.b0 #nav li.b0 a {color:red;padding-bottom:4px}
body.b0 #nav li.b0 li a {color:#fff;}

body.b1 #nav li.b1 a {color:red;}
body.b2 #nav li.b2 a {color:red;}
body.b3 #nav li.b3 a {color:red;}
body.b4 #nav li.b4 a {color:red;}
body.b5 #nav li.b5 a {color:red;}
/* third list*/
body.c0 #nav li.c0 a {color:red;padding-bottom:4px}
body.c0 #nav li.c0 li a {color:#fff;}

body.c1 #nav li.c1 a {color:red;}
body.c2 #nav li.c2 a {color:red;}
body.c3 #nav li.c3 a {color:red;}
body.c4 #nav li.c4 a {color:red;}
body.c5 #nav li.c5 a {color:red;}
/* fourth list*/
body.d0 #nav li.d0 a {color:red;padding-bottom:4px}
body.d0 #nav li.d0 li a {color:#fff;}

body.d1 #nav li.d1 a {color:red;}
body.d2 #nav li.d2 a {color:red;}
body.d3 #nav li.d3 a {color:red;}
body.d4 #nav li.d4 a {color:red;}
body.d5 #nav li.d5 a {color:red;}
/* fifth list*/
body.e0 #nav li.e0 a {color:red;padding-bottom:4px}
body.e0 #nav li.e0 li a {color:#fff;}

body.e1 #nav li.e1 a {color:red;}
body.e2 #nav li.e2 a {color:red;}
body.e3 #nav li.e3 a {color:red;}
body.e4 #nav li.e4 a {color:red;}
body.e5 #nav li.e5 a {color:red;}
/* sixth list*/
body.f0 #nav li.f0 a {color:red;padding-bottom:4px}
body.f0 #nav li.f0 li a {color:#fff;}

body.f1 #nav li.f1 a {color:red;}
body.f2 #nav li.f2 a {color:red;}
body.f3 #nav li.f3 a {color:red;}
body.f4 #nav li.f4 a {color:red;}
body.f5 #nav li.f5 a {color:red;}
/* seventh list*/
body.g0 #nav li.g0 a {color:red;padding-bottom:4px}
body.g0 #nav li.g0 li a {color:#fff;}

body.g1 #nav li.g1 a {color:red;}
body.g2 #nav li.g2 a {color:red;}
body.g3 #nav li.g3 a {color:red;}
body.g4 #nav li.g4 a {color:red;}
body.g5 #nav li.g5 a {color:red;}
/* eighth list*/
body.h0 #nav li.h0 a {color:red;padding-bottom:4px}
body.h0 #nav li.h0 li a {color:#fff;}

body.h1 #nav li.h1 a {color:red;}
body.h2 #nav li.h2 a {color:red;}
body.h3 #nav li.h3 a {color:red;}
body.h4 #nav li.h4 a {color:red;}
body.h5 #nav li.h5 a {color:red;}
/* ninth list*/
body.i0 #nav li.i0 a {color:red;padding-bottom:4px}
body.i0 #nav li.i0 li a {color:#fff;}

body.i1 #nav li.i1 a {color:red;}
body.i2 #nav li.i2 a {color:red;}
body.i3 #nav li.i3 a {color:red;}
body.i4 #nav li.i4 a {color:red;}
body.i5 #nav li.i5 a {color:red;}
/* tenth list*/
body.j0 #nav li.j0 a {color:red;padding-bottom:4px}
body.j0 #nav li.j0 li a {color:#fff;}

body.j1 #nav li.j1 a {color:red;}
body.j2 #nav li.j2 a {color:red;}
body.j3 #nav li.j3 a {color:red;}
body.j4 #nav li.j4 a {color:red;}
body.j5 #nav li.j5 a {color:red;}

/*...................finish ..............*/

/* .... style sub lists.....*/
#nav ul ul  {
		background:#7b9bb9;
	 border-top:1px solid #fff;
}
#nav ul ul li.last {border-bottom:none}
#nav li li a {
	width:168px;
	padding:0 10px 0 15px;
}
#nav li li a:hover {color:#3e3180 !important}
* html #nav li a  {width:193px;w\idth:168px;}

/*........... home page block image navgation .......*/
#home-nav {
	list-style:none;
	width:551px;
}
#home-nav li,
#home-nav li a {
	width:184px;
	float:left;
	height:109px;
	text-decoration:none;
	color:#fff;
	position:relative;
}
#home-nav li a {
	font-size:120%;
	font-weight:bold;
	line-height:1.0;
}
#home-nav li.end,#home-nav li.end a {width:183px;}
#home-nav li a span {
	position:absolute;
	left:10px;
	bottom:10px;
}
#home-nav li#industry a span {bottom:1px;}
#home-nav li#rail  {background:#fff url(../images/rail-over.jpg) no-repeat left top;}
#home-nav li#rail a {background:#fff url(../images/rail.jpg) no-repeat left top;}

#home-nav li#power {background:#fff url(../images/power-over.jpg) no-repeat left top;}
#home-nav li#power a {background:#fff url(../images/power.jpg) no-repeat left top;}

#home-nav li#water {background:#fff url(../images/water-over.jpg) no-repeat left top;}
#home-nav li#water a {background:#fff url(../images/water.jpg) no-repeat left top;}

#home-nav li#industry  {background:#fff url(../images/industry-over.jpg) no-repeat left top;}
#home-nav li#industry a {background:#fff url(../images/industry.jpg) no-repeat left top;}

#home-nav li#nuclear {background:#fff url(../images/nuclear-over.jpg) no-repeat left top;}
#home-nav li#nuclear a {background:#fff url(../images/nuclear.jpg) no-repeat left top;}

#home-nav li#petro {background:#fff url(../images/petro-over.jpg) no-repeat left top;}
#home-nav li#petro a {background:#fff url(../images/petro.jpg) no-repeat left top;}

#content #home-nav li a:hover {background:transparent; color: #fff;}

#latest-news {
	width:726px;
	height: 16px;
	position:relative;
	margin: -4px 0 0 0;
	background:#dedede;
	padding: 0px 10px 9px;
	color:#392e73;
	border-top:3px solid #fff;
}
* html #latest-news  {width:746px;w\idth:726px;margin-top:-8px;ma\rgin-top:-4px;}
#latest-news h3 {
	color:#392e73;
	font-size:90%;
}

#footer {
	width:746px;
	background:#fff url(../images/logos.jpg) no-repeat left top;
	height:123px;
	position:relative;
}
#footer-base {
	width:780px;
	background:#fff url(../images/footer-base.jpg) no-repeat left top;
	height:50px;
	margin:auto;
}

#footer ul {
	list-style:none;
	width:746px;
	height:72px;
	position:absolute;
	top:27px;
	left:0;
}
#footer li {text-indent:-999em}
#footer li,
#footer li a {
	position:absolute;
	width:91px;
	height:72px;
	display:block;
}
#footer li a {
	left:0;
	top:0;
	text-decoration:none;
	z-index:99;
}
#footer li#logo1  {left:34px;}
#footer li#logo2  {left:145px;}
#footer li#logo3  {left:238px;}
#footer li#logo4  {left:345px;}
#footer li#logo5  {left:472px;}
#footer li#logo6  {left:611px;}
.clearer {
	height:1px;
	overflow:hidden;
	margin-top:-1px;
	clear:both;
}
/* h2 is  blue bar under header on right */
h2 {
	color:#fff;
	background:#7c9bb8;
	text-transform:uppercase;
	padding:10px;
	font-size:120%;
	margin-bottom:20px;
}

/*......................... recruitment page specific styles .....................................*/
#recruit #content, #about #content, #latest #content, #maps #content, #links #content  {
	color:#3e3180;
	background:#dedede url(../images/emi-bg.jpg) no-repeat 110px center;
}
#content p.download  {margin-top:-15px;margin-bottom:20px}
#content p.download a {
	color: #3e3180;
	font-size:105%;
	font-weight:bold;
}

/* ............... end recruit (h4 and h5 styles are in main block above ).......................*/
/* .........generic list.................... */
ul.generic {
	list-style:disc;
	margin:10px 10px 10px 35px;
}
img.image-left  {float:left;margin:10px 15px 10px 0;display:inline;}
img.image-right  {float:right;margin:10px 15px;display:inline;}

/*............................. nuclear pages specific code ...............................*/
#nuclear #main {background:#3b6396 url(../images/nuclear-panel-bg.jpg) repeat-y left top;}

#nuclear #content {
	color:#fff;
	background:transparent url(../images/nuclear-panel.jpg) no-repeat right bottom;
}
#rail #main {background:#3b6396 url(../images/rail-panel-bg.jpg) repeat-y left top;}

#rail #content {
	color:#3e3180;
	background:transparent url(../images/rail-panel.jpg) no-repeat right bottom;
}
#distribution #main {background:#3b6396 url(../images/distribution-panel-bg.jpg) repeat-y left top;}

#distribution #content {
	color:#fff;
	background:transparent url(../images/distribution-panel.jpg) no-repeat right bottom;
}
#water #main {background:#3b6396 url(../images/distribution-panel-bg.jpg) repeat-y left top;}

#water #content {
	color:#fff;
	background:transparent url(../images/water-panel.jpg) no-repeat right bottom;
}
#industry #main {background:#3b6396 url(../images/industry-panel-bg.jpg) repeat-y left top;}

#industry #content {
	color:#fff;
	background:transparent url(../images/industry-panel.jpg) no-repeat right bottom;
}
#petro #main {background:#3b6396 url(../images/petro-panel-bg.jpg) repeat-y left top;}

#petro #content {
	color:#fff;
	background:transparent url(../images/petro-panel.jpg) no-repeat right bottom;
}

#content #left-content {
	float:left;
	width:150px;
	margin-left:10px;
	margin-top:-10px;
	display:inline;
	color:#3e3180;
	font-size:90%;
	
}
#left-content ul.links li {
	list-style:none;
}

#left-content ul.links li {
	color:#3e3180;
	margin:0 0 10px 0;
}
#left-content li a {
	color:#3e3180;
	text-decoration:none;
}
#left-content li a:hover {color:red;}

#right-content {
	float:right;
	width:356px;
	margin-right:15px;
	display:inline;
	margin-top:-10px;
}

/* ................ not sure if this the correctly named page but the procedure is the same ...........*/
/* just change the body id to match if its not the correct one .............*/
#manpower #main, #site #main, #engineer #main {background:#3b6396 url(../images/nav-bg3.jpg) repeat-y left top;}

#manpower #content, #site #content, #engineer #content {
	color:#fff;
	background:transparent;
}

#manpower #content #left-content, #site #content #left-content, #engineer #content #left-content, #contact #content #left-content {
	float:left;
 	width:375px;
	margin-left:0;
	margin-top:-10px;
	display:inline;
	color:#3e3180;
	font-size:100%;
}
#manpower #left-content li a, #site #left-content li a, #engineer #left-content li a, #contact #left-content li a {
	color:red;
	text-decoration:underline;
}
#manpower #left-content li a:hover, #site #left-content li a:hover, #engineer #left-content li a:hover, #contact #left-content li a:hover {color:#3e3180;}

#manpower #right-content, #site #right-content, #engineer #right-content, #contact #right-content {
	float:right;
	width:161px;
	display:inline;
	margin:-10px 0 0 0;
	color:#3e3180;
}
#manpower #right-content img, #site #right-content img, #engineer #right-content img, #contact #right-content img {
	margin-bottom:5px;
}
#manpower #right-content ul, #site #right-content , #engineer #right-content ul, #contact #right-content ul {list-style:none;}



body#site #content p a, body#manpower #content p a,  body#engineer #content p a, #contact #content p a {

	/* color: #f00000; */
	color:#3e3180;
	font-size:105%;
	font-weight:bold;
	margin-left:0;
	margin-right:0;
}



#site #content p a:hover, #manpower #content p a:hover,  #engineer #content p a:hover, #contact #content p a:hover {

	color: #f00000;

}





#manpower #content h4,#manpower #content p, #site #content h4,#site #content p, #engineer #content h4,#engineer #content p, #contact #content h4,#contact #content p {margin-left:5px;margin-right:0}
#manpower #content h4, #site #content h4, #engineer #content h4, #contact #content h4 {margin-bottom:0}
/* ................... end manpower code ...........................*/

/*Form*/
/*<group=HTML elements>*/

#thankyou p {
	font-size: 80%;
	margin-top: 20px;

}

/*</group>*/


/*<group=Forms>*/
form#mailing {
	width: 350px;
	background: #A0A0A0;
	margin-top: 0;
	padding: 5px 15px 10px;
	position: relative;
}
form#mailing h5 {
	margin: 0;
	color: #fff;
	font-size: 85%;
	line-height: 130%;
	width: 200px;
	font-weight: normal;
	padding: 0;
}
form#mailing p {
	margin: 5px 0 0;
}

#enquiry p {
	margin: 25px 0 -10px 0;
}

#enquiry span {
	color: #C91B18;
}

fieldset {
	margin: 0 0 1em 0;
	padding: 10px 10px 30px 40px;
	border: 1px solid #ccc;
	background: #fff;
}
fieldset:hover {
	background: #f5f5f5;
}
#submit {
	position: relative;
	top: 6px;
}

input#go {
	position: relative;
	top: 18px;
	display: block;
}

legend {
	font-weight: bold;
	color: #C60001;
	margin: 0 0 0 -10px;
	padding: 0.5em;
}
label {
	display: block;
	margin: 1em 0 .3em 0;
}
input.input {
	width: 300px;
	border: 1px solid #666;
	padding: 1px;
	height: 15px;
	color: #555;
	font-size: 95%;
}
input.input:focus {
	border: 1px solid #FF0000;
}

#marqueecontainer {
   width: 720px;
 	height: 12px;
	padding: 1px;
	margin: 6px 0 0 0;
	position: absolute;
	overflow:hidden;
}