/* Envision website stylesheet */
/* Gez Thulbourn, WebSanity Web Design, www.websanity.co.uk */
/* Remove all browser dependent styling to start with as a basis */
body, h1, h2,h3,h4,h5,h6,p,ol,ul,form,blockquote {
	padding:0;
	margin:0;
}
h1,h2,h3,h4,h5,h6,pre,code {
	font-size:1em;
}
a {
	text-decoration:none;
}
a img,:link img,:visited img {
	border: none;
}

:link,:visited { text-decoration:none }


html {overflow-y: scroll;}	

/* Site specific styles */
body {
	text-align:center;
	background-color: #005081;
	background-image: url("images/graduated-background.jpg");
	background-repeat: repeat-x;
font-family:'Gill Sans','Gill Sans MT', 'Trebuchet MS', Helvetica, sans-serif;
font-weight:normal;	/* GT 05/09/2014 */
/*	NEW***  	font-family:Arial, Helvetica, sans-serif;*/
/* NEW***	font-size:0.8em; */
	font-size:0.9em;
	margin-top:10px;
	margin-bottom:10px;
}


#ActivePageAreaBorder {
/* Centred block giving the border for the site */
	width: 764px;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	border-top:1px solid #7082C0;
	border-left:1px solid #7082C0;
	border-right:1px solid #465994;
	border-bottom:1px solid #465994;
	background-color:#FFF;
	border:1px solid #fff;
}

#ActivePageArea {
/* Block in which the site appears: includes margin for white border around the active area */
	width:760px;
	margin:2px;
}




#HeaderStrip {
/* Heading across top of each page. NB. Includes 2px white border along the bottom*/
	margin-bottom:2px;
	height:64px;
}
#Logo {
/* Envision logo block top right */
	float:right;
	background-color:#FFF; 
	width:198px;
	height:64px;
	text-align:center;
}



#ImageStrip {
/* Image strip across top of each page. NB. Includes 2px white border along the bottom*/
	width:760px;
	margin-bottom:2px;
	height:176px;
}
/* Set below in: <div id="ImageStrip" class="xyz" */
.home-v1 {
	background-image: url("images/imagestrip/calm.jpg");
}
.port {
	background-image: url("images/imagestrip/port.jpg");
}
.world-map {
	background-image: url("images/imagestrip/world-map.jpg");
}
.storm {
	background-image: url("images/imagestrip/storm.jpg");
}
.windfarm {
	background-image: url("images/imagestrip/wind-farm.jpg");
}
.snappers {
	background-image: url("images/imagestrip/snappers.jpg");
}
.jellyfish {
	background-image: url("images/imagestrip/jellyfish.jpg");
}
#ImageMain {
/* Envision logo block top right */
	float:left;
	width:560px;
	height:176px;
	position:relative;
}
#ImageMain h1 {
/* Main logo */
	position:absolute;
	color:#FFF;
	left:15px;
	font-size:2em;
	bottom:7px;
	font-weight:normal;
/* NEW***	text-transform:uppercase;	*/
}
h1, h2 {
/* NEW***	text-transform:uppercase;	*/
}
h2 {
	padding-top:2px;	/* GT - WS */
}
#ImageFaded {
/* Faded image to right */
	float:right;
	width:198px;
	height:176px;
	position:relative;
}
#ImageFaded p {
/* Main logo */
	position:absolute;
	color:#FFF;
	right:15px;
	font-size:1em;
	top:7px;
	text-align:right;
}




#MainStrip {
/* Main content area and sidebar */
	width:760px;
	background: #FFF url(images/main_strip.gif) repeat-y right top;	/* Top right strip to fill in the sidebar */
	padding-bottom:2px;
	margin-bottom:2px;
}
#MainContent {
	float:left;
	left:0px;
	width:530px;
	padding:20px 15px 20px 15px;
	color:#00086B;
	margin-bottom:2px;
}
#MainSidebar {
	float:right;
	width:168px;
	background-color:#EEF6FF;
	padding:20px 15px 0px 15px;
	color:#7AA3AB;
	font-size:80%;
	margin-bottom:2px;
}
/* main content text styles */
#MainContent p {
/* NEW***	line-height:1.4em;	*/
	line-height:1.3em;
	margin-bottom:0.8em;
}
#MainContent a:link, #MainContent a:visited {
	color:#7AA3AB;
}
#MainContent a:hover {
	text-decoration:underline;
}
#MainContent li {
	margin-left:25px;
}

/* Sidebar text styles */
#MainSidebar h3 {
	line-height:1.2em;
	margin-bottom:0.8em;
	text-align:center;
}
#MainSidebar p {
	margin-bottom:0.8em;
}
#MainSidebar img {
	border:1px solid #7AA3AB;
	margin-bottom:0;
}
#MainSidebar a:link, #MainSidebar a:visited {
	color:#22297F;
}
#MainSidebar a:hover {
	text-decoration:underline;
}
#MainSidebar h2 {
/* NEW***	text-transform:uppercase;	*/
	margin-bottom:8px;
}

#MainSidebar .where-we-worked p {
	line-height:1em;
	margin-top:0px;
	margin-bottom:0px;
	padding-bottom:6px;
	padding-top:2px;
	border-bottom:dotted 1px #999;
}
#MainSidebar .imgcaption {
	text-align:center;
	color:#999;
}
.cleaner {	/* A fix for mozilla based browsers to force the whole area to come down to the bottom of the page to allow background tile of image strip */
	clear:both;
	height:1px;
	font-size:1px;
	border:none;
	margin:0; padding:0;
	background:transparent;
}




#FooterStrip {
/* Footer strip across bottom of each page. NO border along bottom*/
	width:760px;
	height:30px;
	clear:both;
	line-height:30px;	/* Centre text vertically */
}
#FooterStrip  a:link, #FooterStrip a:visited {
	color:#7AA3AB;
}
#FooterStrip a:hover {
	text-decoration:underline;
}
/* 560 divided between the following (less 2px border) PLUS 1px extra each for middle two */
#Footer1 {
	float:left;
	width:110px;
	height:30px;
	background-color:#DDECFF;
	margin-right:2px;
}
#Footer2 {
	float:left;
	width:111px;
	height:30px;
	background-color:#D3E1F4;
	margin-right:2px;
}
#Footer3 {
	float:left;
	width:110px;
	height:30px;
	background-color:#DDECFF;
	margin-right:2px;
}
#Footer4 {
	float:left;
	width:111px;
	height:30px;
	background-color:#D3E1F4;
	margin-right:2px;
}
#Footer5 {
	float:left;
	width:110px;
	height:30px;
	background-color:#DDECFF;
	margin-right:2px;
}
#FooterRight {
	float:right;
	width:198px;
	height:30px;
	line-height:30px;	/* Centre vertically */
	background-color:#D3E1F4;
}
#FooterStrip p {
	color: #7AA3AB;
	text-align:center;
	font-size:0.75em;
}




/* Generic styles */
.centre {
	text-align:center;
}


.menu {
	width:562px;
	height:64px;
	float:left;
	font-size:0.9em;
}
.menu {margin:0; list-style:none; color:#fff;background:#D7CEC0 url(images/menu-backgrounds.jpg) 0px 0px; position:relative; z-index:100;}

.menu ul {padding:0;margin:0;list-style-type:none;}	/* Strip default list attribute from list */ 
.menu table {position:absolute; top:0; left:0; border-collapse:collapse;} /* Strip default table attributes from table */
.menu li {float:left;position:relative;padding-right:2px;}	/* Float gives horizontal menu; relative allows drop down position to be set*/

/* Top level menu widths */
.menu1 a,.menu1 .top-level { width:110px; }
.menu2 a,.menu2 .top-level { width:111px; }
.menu3 a,.menu3 .top-level { width:110px; }
.menu4 a,.menu4 .top-level {	width:111px; }
.menu5 a,.menu5 .top-level {	width:110px; }
/* Drop down menu widths */
ul.submenu2 li a { width:111px; }
ul.submenu3 li a { width:110px; }
ul.submenu5 li a { width:110px; }

/* Top level style */
.menu a, .menu .top-level b {display:block; 
padding:42px 0 0 0px; 
height: 22px;	/* 64px - padding in line above - IE6 hack */
color:#FFF;
text-decoration:none;
text-align:center; cursor:pointer;
font-weight:bold;
}


/* Top level current style for currently selected option */
/*#current {background:#DDECFF;} */
#menu1 .menu1 {background: url(images/menu-backgrounds.jpg) 0px 64px;}
#menu2 .menu2 {background: url(images/menu-backgrounds.jpg) -112px 64px;}
#menu3 .menu3 {background: url(images/menu-backgrounds.jpg) -225px 64px;}
#menu4 .menu4 {background: url(images/menu-backgrounds.jpg) -337px 64px;}
#menu5 .menu5 {background: url(images/menu-backgrounds.jpg) -450px 64px;}

.menu li a.current:hover {background:#000}

/* Hover - applies to ALL menus, override in lower level menus to change this behaviour */
li.menu1 a:hover, li.menu1 .top-level:hover b {background: url(images/menu-backgrounds.jpg) 0px 128px;}
li.menu2 a:hover, li.menu2 .top-level:hover b {background: url(images/menu-backgrounds.jpg) -112px 128px;}
li.menu3 a:hover, li.menu3 .top-level:hover b {background: url(images/menu-backgrounds.jpg) -225px 128px;}
li.menu4 a:hover, li.menu4 .top-level:hover b {background: url(images/menu-backgrounds.jpg) -337px 128px;}
li.menu5 a:hover, li.menu5 .top-level:hover b {background: url(images/menu-backgrounds.jpg) -450px 128px;}

/* DROP DOWN MENU STYLE */
.menu ul ul  {padding-top:2px;}	/* Step the menu over the white border */
.menu ul ul a {background: url(images/menu_back.png); color:#FFF; height:12px; line-height:1em; padding:5px 0px 5px 0px; text-align:center;	/* height was auto but Firefox 4 isn't reliable */
font-size:0.8em; font-weight:normal; 
text-decoration:none; border-left:2px solid #FFF; border-right:2px solid #FFF;	}
.last_in_submenu { border-bottom:2px solid #FFF; }
.solidmenu {	/* Hack for IE 6 to stop it flickering when drawing its drop down menus */
	background-color:#BCCFCC ;
}
/* DROP DOWN HOVER */
.menu ul ul a:hover {background:#D3E1F4; color:#00086B}	/* Explicitly override the background image */

	

/* Menu dynamics */
.menu ul ul {visibility:hidden;position:absolute;height:0;top:64px;left:-2px;} /* hide the sub levels and give them an absolute positon so that they take up no room */
.menu ul li:hover ul, .menu ul a:hover ul{visibility:visible;}	/* make the second level visible when hover on first level list OR link */



h2 a:link, h2 a:visited { color:#00086B !important; }


/* END */