/* reset styles ----------------*/
/* remember to define focus styles! */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, codedel, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}


:focus {
	/*outline: 0;*/
}


ol, ul {
	list-style: none;
}


/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

code{
	font-size:12px;
}

strong{
font-weight:bold;
}

em{
	font-style: italic;
}

img {
  behavior: url('/js/fx-iepngfix.htc');
  }
  
  .floatLeft{
  	float:left;
  }
  
  .floatRight{
  	float:right;
  }
  
    .storycontent img{
  	background-color:#ffffff;
	padding:5px;
	border: 5px solid #273b5e;
	margin-right:20px;
	margin-bottom:20px;
  }
  
    img.floatLeft{
  	float:left;
	background-color:#ffffff;
	padding:5px;
	border: 5px solid #273b5e;
	margin-right:20px;
	margin-bottom:20px;
  }
  
  img.floatRight{
  	float:right;
background-color:#ffffff;
	padding:5px;
	border: 5px solid #273b5e;
	margin-left:20px;
  }
  
  .border{
  	border:1px solid #000000;
  }
  
  .nomargin{
  	margin:0 !important;
  }
  
  small{
  font-size: smaller;
  }
  
  .clear{
	clear:both;
}

.snug{
	margin-top:0;
}

/* headings */

h1, h2, h3{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	line-height:1.2em;
	color:#FFFFFF;
}

#middle h1{

}

h1{
	font-size:24px;
}

h2{
	font-size:22px;
}

h3{
	font-size:20px;
}

/*-----*/
 

	

	
 p{
		margin-bottom:1.4em;
		margin-top:1.4em;
	}



/* body */

body{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-align:center;
	font-size:14px;
	color:#006c68;
	/*background-color:#273b5e;*/
	 background-color:#202020;
}
  
  
  
  /*---- width ------*/
  
  .widthHolder{
	width: 748px;
	margin:0 auto;
	position:relative;
	text-align:left;

}


/*-------------------------- header ------*/

#header{
	width:100%;
	overflow:visible; /* fixes ie8 issue that clear doesn't seem to fix */
	position:relative;
/*	background-color:#e9ecf3;*/
background-color:#ffffff;
	color:#000000;
	border-top:30px solid #000000;
	border-bottom:10px solid #000000;
}



#logo {
height:80px;
}


#logo h1{
background:transparent url(../images/ocean-energy-2.png) no-repeat scroll 0%;
width:398px;
height:80px;
left:0px;
position:absolute;
text-indent:-9999px;
top:0px;


}




/* top navigation */

.topNavandImage{
border-left:10px solid #000000;
border-right:10px solid #000000;
	
	background-color: #000000;
		/*background: url(../images/backgrounds/topNav-gradient.png) repeat-x;*/


}

.topNavandImage object{
	display:block;
}

.topNavandImage img{
	display:block;
}

.endTopNavandImage{
		/*background: url(../images/backgrounds/end-of-topnav.png) no-repeat bottom;
		height:10px;
		font-size:2px;*/
		display:none;
}

.topImage{
	border-top:10px solid #000000;
	background-color: #000000;
	width:100%;
	background-image: url(../images/backgrounds/waves-sm.jpg);
	background-repeat: no-repeat;
	background-position: bottom;
	width:708px;
	height:100px;
	text-align:right;
	padding:10px;
}

.topImage h1{
	color:#FFFFFF;
	font-size:24px;
	/*font-weight:bold;*/
	
}

.topImageHome{
	border-top:10px solid #000000;
	background-color: #000000;
	width:100%;
	background-image: url(../images/backgrounds/ocean-energy-home.jpg);
	background-repeat: no-repeat;
	background-position: bottom;
	width:708px; 
	min-height:240px;
	text-align:right;
	padding:10px;
}


/* topnav links */


.topNavandImage ul{
text-align:center;
padding: 5px 0px 5px 0px;
/*background-color:#202020;*/
background-color:#273b5e;
}


.topNavandImage ul li {
	
	display: inline;
	list-style: none;
	font-size:14px;
	/*font-weight:bold;*/
	border-right:1px solid #1d2d47;
	font-size:14px;
	/*text-transform: uppercase;*/
	padding-left:10px;
	padding-right:10px;
	}
	
	.topNavandImage  ul li#last{
	border-right:none;
}

.topNavandImage ul li a{

	
	}
	
	.topNavandImage ul li a:link{
	text-decoration:none;
	color:#91c8be;
	}
	
		.topNavandImage ul li a:visited{
	text-decoration:none;
	color:#91c8be;
	}
	
		.topNavandImage ul li a:hover{
	text-decoration:none;
	color:#FFFFFF;
	}
	
			.topNavandImage ul li a:active{
	text-decoration:none;
	}
	
	.topNavandImage ul li.topNavCurrent, .topNavandImage ul li.topNavCurrent a{
	/*display:block;
	padding: 10px 15px 10px 15px;*/
		
		/*color:#efbf00 !important;*/
		color: #FFFFFF !important;
	}
	
	
	

	
	/* subnav ----------*/
	
	.subnav{
		border-top:2px solid #000000;
		background: transparent url(../images/backgrounds/topNav-gradient.png) repeat-x;
		width:100%;
	}
	
	.subnav ul li a{
				font-size:12px;
	}
	
	.subnav ul li a:link{
	text-decoration:none;
	color:#d9e9e8;

	}
	
		.subnav ul li a:visited{
	text-decoration:none;
	color:#d9e9e8;
	}
	
		.subnav ul li a:hover{
	text-decoration:none;
	color:#efbf00;
	}
	
			.subnav ul li a:active{
	text-decoration:none;
	color:#efbf00;
	}
	
	li.subNavCurrent, li.subNavCurrent a:link{
	/*display:block;
	padding: 10px 15px 10px 15px;*/
		color:#efbf00 !important;
			font-size:12px !important;
	}
	
	
	/*------------- text links --------------------*/
	
		a:link{
	text-decoration:none;
	color:#91c8be;
	}
	
		a:visited{
	text-decoration:none;
	color:#91c8be;
	}
	
	 a:hover{
	text-decoration:none;
	color:#FFFFFF;
	}
	
			 a:active{
	text-decoration:none;
	}
	
	
	/* -------------------- midddle ------------*/
	
	#middle{
		width:100%;
	/*	background: url(../images/backgrounds/middle-bg.png) repeat-x;*/
	
	}
	
	
	/* ---- sidebar --------------------*/
	
	 .sideBar{
		width:210px;
		float:right;
		overflow: visible;
	
	}
	

	
		  * html .sideBar{
    \margin-top: 0px; /* for IE5 and IE6 in quirks mode */
    m\argin-top: 0px; /* for IE6 in standards mode */
  }
  
  .sideBar p{
  	margin-bottom:20px;
  }
  
  /*----- sideNav ----*/
  
  .sideNav li{
  width:200px;
  background: url(../images/backgrounds/sideNavTop.png) no-repeat top;
  margin-bottom:5px;
 font-size:12px;
 font-weight:bold;
background-color:#FFFFFF;
  padding-top:3px;
  }
  
  .sideNav li a, .sideNav li .sideNavCurrent{
  	  background: url(../images/backgrounds/sideNavEnd.png) no-repeat bottom;
	   padding: 5px 5px 8px 8px;
	  display:block;
	background-color:none;
  }
  
/* ie 5 & 6 only clickable on text */
  

  
  .sideNav li a:link {
 color:#2b6cbd;
 text-decoration:none;
}


 
.sideNav li a:visited{
	color:#2b6cbd;
	 text-decoration:none;
}

.sideNav li a:hover,   .sideNav li .sideNavCurrent {
color:#FFFFFF;
	background-color:#a8b031;
}
 


.sideNav li a:active {
	color:#ffcd32;
}





/*content no sidebar */

.contentNoSidebar{
	width:748px;
	/*background: url(../images/backgrounds/content-back.png) repeat-x;*/
	background-color:#000000;
	color:#FFFFFF;
}


.textContent{
width:708px;
	padding:20px;
}

.textContent ul, .textContent ol{
	margin-left:2em;
	margin-right:2em;
}

.textContent ul{
	 list-style: disc;
}

.textContent ol{
	list-style: decimal;
}


	
	
		/* ---- content --------------------*/
	
	.content{
		float:left;
		display:inline;
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		margin-top:10px;
		line-height:1.4em;
		width:492px;
		margin-left:10px;
		margin-right:42px;
		font-size:16px;
		margin-bottom:20px;
	}

	
	

	
	.content ul{
	margin: 0 0 1.4em 10px;
	list-style: disc;
	padding-left:10px;
	}
	
		.content ol{
	margin: 0 0 1.4em 10px;
	list-style: decimal;
	padding-left:1.4em;
	}
	
	.content h1{
		font-size:24px;
		font-weight:bold;
		margin: 2em 0 1em 0;
		padding: 0 0 0px 0px;
		line-height:1.2em;
	}
	

	

	
	
	.content a:link, .contentHome a:link {
/* color:#983620;*/

 text-decoration:underline;
}

.content h1 a:link, .content h2 a:link{
	text-decoration:none;
}

.content h1 a:hover, .content h2 a:hover{
	text-decoration:underline;
}


 
.content a:visited, .contentHome a:visited{
	
	text-decoration : none;
}

.content a:hover, .contentHome a:hover {

	text-decoration : none;
}
 


.content a:active, .contentHome a:active {
	
	text-decoration : none;
}
	
	/* -  highlight -----------*/
	
	
	.highlightTop, .highlightEnd{
		width:748px;
		height:10px;
		font-size:2px;
	}
	
	.highlightTop{
	background: url(../images/backgrounds/highlight/top.png) no-repeat;
}

	.highlightEnd{
	background: url(../images/backgrounds/highlight/end.png) no-repeat;
}
	
	.highlight{
		width:746px;
		/*background-color: #273b5e;*/
		background-color:#000000;
		border-top:1px solid #434343;
		border-bottom:1px solid #434343;
		border-left:1px solid #000000;
		border-right:1px solid #000000;
		padding-top:10px;
		padding-bottom:10px;
	}
	
			  * html .highlight{
    \width: 748px; /* for IE5 and IE6 in quirks mode */
   w\idth: 746px; /* for IE6 in standards mode */
  }
	
	.highlight img.border{
		border:1px solid #FFFFFF;
	}
	
	.hltHome{
	/* background: url(../images/backgrounds/highlight.png) repeat-y;*/
}


.hltCol1{
	float:left;
	width:230px;
	padding-left:8px;
	padding-right:10px;
	
}

			  * html .hltCol1{
    \width: 248px; /* for IE5 and IE6 in quirks mode */
   w\idth: 230px; /* for IE6 in standards mode */
  }

.hltCol2{
	float:left;
	width:230px;
	padding-left:10px;
	padding-right:10px;
	
}

			  * html .hltCol2{
    \width: 250px; /* for IE5 and IE6 in quirks mode */
   w\idth: 230px; /* for IE6 in standards mode */
  }

.hltCol3{
	float:left;
	width:230px;
		padding-left:10px;
	padding-right:8px;

}

		  * html .hltCol3{
    \width: 248px; /* for IE5 and IE6 in quirks mode */
   w\idth: 230px; /* for IE6 in standards mode */
  }




.highlight h2{
	font-size:18px;
	margin-top:10px;
}

.highlight p{
	font-size:12px;
	margin-top:10px;
 text-align: justify;
}
	
	
	/* gallery */
	
	.gallery{
		width:708px;
		text-align:center;
		/*background-image: url(../images/backgrounds/gallery-back.png);
		background-position: top left;
		background-repeat: no-repeat;*/
	}

	
	/*-- video -----*/
	
	.videoHolder{
		width:708px;
margin-bottom:20px;
float:left;
	}
	
	.video{
		float:left;
		width:425px;
		height:344px;
		/*background-image: url(../images/backgrounds/video-bg.png);*/
	/*	padding:15px; */
		margin-right:20px;
	}
	
		.videoTextHolder{
		width:232px;
		float:right;
	}
	
	.videoTextTop, .videoTextBottom{
		height:4px;
		width:232px;
		font-size:1px;
		background-position: top;
		background-repeat: no-repeat;
		float:right;
	}
	

	
	.videoTextTop{
		background-image: url(../images/backgrounds/videoText-top.png);
	}
	

	.videoTextBottom{
		background-image: url(../images/backgrounds/videoText-bottom.png);
	}
	
	.videoText{
		min-height:326px;
		  height:auto !important;
		  height:326px;
		/* height should be 366px */
		width:190px;
		padding: 16px 20px 16px 20px;
		border-left:1px solid #3b3b3b;
		border-right:1px solid #3b3b3b;
		float:right;
		/*background-color:#ecf4f4;*/
		background-color:#000000;
	}
	
			  * html .videoText{
    \width: 232px; /* for IE5 and IE6 in quirks mode */
   w\idth: 190px; /* for IE6 in standards mode */
  }
  
  .videoText h2{
  	font-size:18px;
	
  }

	
	
	/*------- content Footer -------*/
	
	#contentFooter{
		width:754px;
		float:left;
		margin-top:20px;
		margin-bottom:10px;
		text-align:center;
	}
	
		#contentFooter img{
		
			margin: 0 25px 0 25px;
		}
	


	
	/* ---- footer --------------------*/	
	
	#footer{
		width:748px;
		text-align:center;
		/*background: url(../images/backgrounds/footer.png) no-repeat center top;*/
		border-top:1px solid #FFFFFF;
		padding-top:10px;
		margin-top:20px;
		font-size:12px;
		padding-bottom:20px;
		}
		
		.footerHeight{
			height:86px;
		}
		





#footer a:link {
 text-decoration:none;
 color:#006c68;
}


 
#footer a:visited{
 text-decoration:none;
 color:#006c68;
}

#footer a:hover {
	text-decoration : underline;
}
 


#footer a:active {

}

 /* Latest News Homepage */
 
 #latest-news {
  background-color:#273B5E;
  color:white;
  padding:5px 20px}
  
  #latest-news h3 {
    color:#91C8BE}

  
  #latest-news a:hover {
     color:white
  }
  
  #latest-news p  {
    margin-top:5px;
    margin-bottom:10px}