@charset "UTF-8";
/* CSS Document */

.body {
	color: #000;
	background: #fff;
	
	background-image:url(../graphics/otolith.gif);
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position:center; 
	margin-top: 15px;
	margin-left: 0px;
	margin-right: 0px;
}

ul, li { 	
	margin-left: 0px; 
	padding-left: 0px;
	list-style-type: none;
	}

.images { 	
	padding-left: 0px;
	margin-left: 0px;
}

.container {
	width: 100%;
}

.media-p {
	margin-bottom: 26px;
}

.bodytext {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 21px;
	letter-spacing: 1px;
	font-weight: normal;
	color: #000000;
	padding-right:10px;
}

.heading1 {
	font-family: Helvetica, Arial, sans-serif;
	color: #000;
	font-size: 16px;
	line-height: 21px;
	letter-spacing: 1px;
	border-bottom: 1px;
	border-bottom-style: solid;
	border-bottom-color: #000;
}

.heading2 {
	font-family: Helvetica;
	font-size: 16px;
	line-height: 21px;
	letter-spacing: 1px;
	font-weight: normal;
	border-bottom: solid;
	border-bottom-color: #000;
	border-bottom-width: 1px;
	color: #000000;
}

.credit {
	font-family: Helvetica, Arial, sans-serif;
	color: #000;
	font-size: 11px;
	font-style: normal;
	letter-spacing: 1px;
	line-height: 12px;
}

a img {border: none; } 


a:link {
	text-decoration: underline;
	color: #0000ff;
}

a:visited {
	text-decoration: underline;
	color: #0000ff;
}

a:hover {
	text-decoration: underline;
	color: #000;
}

a:active {
	text-decoration: underline;
	color: #0000ff;
}

.header {
	width: 100%;
	font-family: Helvetica, Arial, sans-serif;
	font-style: normal;
	font-size: 16px;
	letter-spacing: 1px;
	color: #000;
	position:fixed;
}

.header a:link {
	text-decoration: none;
	color: #000;
	border-bottom: solid;
	border-bottom-color: #000;
	border-bottom-width: 1px;
}

.header a:visited {
	text-decoration: none;
	color: #000;
	border-bottom: solid;
	border-bottom-color: #000;
	border-bottom-width: 1px;
}

.header a:hover {
	text-decoration: none;
	color: #0000ff;
	border-bottom: solid;
	border-bottom-color: #000;
	border-bottom-width: 1px;
}

.header a:active {
	text-decoration: none;
	color: #0000ff;
	border-bottom: solid;
	border-bottom-color: #000;
	border-bottom-width: 1px;
}

.project-container {
	width: 100%;
	clear: both;
	border-top: solid;
	border-top-color: #0000ff;
	border-top-width: 1px;
	padding-top: 5px;
	padding-left: 0px;
	margin-bottom: 5px;
	font-family: Helvetica, Arial, sans-serif;
	letter-spacing: 1px;
	font-size: 16px;
	line-height: 21px;
	font-weight: normal;
	color: #000000;
}

.project-container2 {
	width: 100%;
	clear: both;
	border-top: solid;
	border-top-color: #0000ff;
	border-top-width: 1px;
	padding-top: 5px;
	padding-left: 0px;
	padding-bottom: 5px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 21px;
	font-weight: normal;
	color: #000000;
}

.project-container3 {
	width: 100%;
	clear: both;
	padding-top: 2px;
	padding-left: 0px;
	padding-bottom: 50px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 21px;
	font-weight: normal;
	color: #0000ff;
}

.project-container4 {
	width: 100%;
	clear: both;
	padding-top: 5px;
	padding-left: 0px;
	margin-bottom: 5px;
	font-family: Helvetica, Arial, sans-serif;
	letter-spacing: 1px;
	font-size: 16px;
	line-height: 21px;
	font-weight: normal;
	color: #000000;
}

.menu-item {
	width: 47%;
	float: left;
	padding-left: 10px;
}

.menu-item2 {
	width: 33%;
	float: left;
}

.class1 A:link {text-decoration: underline}
.class1 A:visited {text-decoration: underline}
.class1 A:active {text-decoration: underline}
.class1 A:hover {text-decoration: underline; color: red;}

.main {
	float: left;
	width: 100%;
	padding-top: 50px;
	padding-bottom: 10px;
}

.imgrow {
	clear: both;
	float: left;
	width: 940px;
}

.footer {
	clear: both;
	width: 700px;
	padding-top: 20px;
	padding-left: 10px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	line-height: 14px;
	letter-spacing: 1px;
	color: #000; 
	line-height: 12px;
}

#wrap{
	margin: 0px auto;
	padding: 10px;
	width: 100%;
	background: #FFFFFF;
}

.text-pad {
	float: left;
	width: 90%
	margin-left: 10px;
}

.one-col {
	float: left;
	padding-left: 10px;
	width: 8%;
}

.one-col2 {
	float: left;
	width: 5%;
}

.three-col {
	float: left;
	width: 25%;
}

.four-col {
	float: left;
	width: 33%;
	padding-top: 20px;
	padding-bottom: 20px;
	margin-bottom: 20px;
	padding-left: 10px;
}

.four-col2 {
	float: left;
	width: 25%;
	padding-top: 20px;
}

.four-col3 {
	float: left;
	width: 33%;
	padding-left: 10px;
}

.eight-col {
	float: left;
	padding-left: 10px;
	width: 80%;
}

.eight-col-h {
	float: left;
	padding-left: 10px;
	width: 90%;
}

.centre {
width: 940px;
margin-left:auto;
margin-right:auto;
}

.left-col {
	float: left;
	padding-left: 10px;
	width: 450px;
	padding-top: 20px;
	clear: both;
}

.left-col2 {
	float: left;
	padding-left: 10px;
	width: 640px;
	padding-top: 20px;
}

.right-col {
	float: left;
	padding-left: 10px;
	width: 450px;
	padding-top: 20px;
}

.right-col2 {
	float: left;
	padding-left: 10px;
	width: 250px;
	padding-top: 20px;
}

.margin-col {
	float: left;
	width: 5%;
}

.expArrow{
	padding-left: 20px;
	background: url(graphics/arrow-down.png) no-repeat 0px 4px;
}
.collArrow{
	padding-left: 20px;
	background: url(graphics/arrow-up.png) no-repeat 0px 4px;
}
.expIco{
	padding-left: 20px;
	background: url(graphics/plus.gif) no-repeat 0px 4px;
}
.collIco{
	padding-left: 20px;
	background: url(graphics/minus.gif) no-repeat 0px 4px;
}
.demo6{
	background: none;
	padding-left: 0px;
	color: #FFFFFF;
	cursor: pointer;
}
.panel{
	width: 100%;	
	padding-left: 0px;
	padding-bottom: 10px;
	clear:both;
}

.form{
	font: 16px;
}

/*preload classes*/
.svw {width: 50px; height: 20px; background: #fff;}
.svw ul {position: relative; left: -999em;}

/*core classes*/
.stripViewer { 
position: relative;
overflow: hidden;   
margin: 0 0 1px 0;
}
.stripViewer ul { /* this is your UL of images */
margin: 0;
padding: 0;
position: relative;
left: 0;
top: 0;
width: 1%;
list-style-type: none;
}
.stripViewer ul li { 
float:left;
}
.stripTransmitter {
overflow: auto;
width: 1%;
}
.stripTransmitter ul {
margin: 0;
padding: 0;
position: relative;
list-style-type: none;
}
.stripTransmitter ul li{
width: 20px;
float:left;
margin: 0 1px 1px 0;
}
.stripTransmitter a{
font: normal 11px "Courier New", Courier, monospace;
text-align: center;
line-height: 22px;
background: #fff;
color: #0000aa;
text-decoration: underline;
display: block;
}
.stripTransmitter a:hover, a.current{
background: #fff;
color: #0000aa;
}

/*tooltips formatting*/
.tooltip
{
padding: 0.5em;
background: #fff;
color: #000;
border: 5px solid #dedede;
}


/* c2 customised - new homepage */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
.homepage_img_wrap { width: 1020px; margin: 0; }
.home-left-col, .home-right-col { width: 485px; text-align: center; font-size: 30px; }
.homepage_img_wrap img { max-width: 100%; height: auto; opacity: 1; transition: all 200ms ease-out; }
.homepage_img_wrap a { display: block; position: relative; }
.home-left-col { float: left; }
.home-right-col { float: right; }
.homepage_img_wrap .homepage_text { width: 100%; box-sizing: border-box; -moz-box-sizing: border-box; text-align: center; padding: 40px 40px 30px 40px; display: block; position: absolute; /*opacity: 0;*/ transition: all 200ms ease-out; line-height: 1.45em; top: 50%; margin-top: -67px }
/*.homepage_img_wrap a:hover .homepage_text { opacity: 1; }
.homepage_img_wrap a:hover img { opacity: 0; }*/
.homepage_img_wrap .heading1 { display: block; border-bottom: none; line-height: 0.9em; font-size: 30px; }
.blue_txt a, .blue_txt a .heading1  { color: #0000ff !important; }
.white_txt a, .white_txt a .heading1 { color: #ffffff !important; }
.homepage_page .project-container2 { border-top: none; padding: 0; }
.homepage_page { float: none; width: 1020px; padding: 0; position: absolute; left: 50%; top: 50%; margin-left: -510px; opacity: 0; }

@charset "UTF-8";
/* CSS Document */