/* Start of CMSMS style sheet 'css-main' */
@charset "utf-8";
/* CSS Document */
/* RESET */

 /* $WEFT -- Created by: chaos () on 1/06/2007 -- */
@font-face {
    font-family: Eras Demi ITC;
    font-style:  normal;
    font-weight: normal;
    src: url(ERASDEM3.eot);
  }



/*
*
*   Set the text area for the contact forms
*
*/
.formbuilderform textarea {width: 350px}


/*
*
*   Hacks
*
*/
/* Remove blue border for links and line under image */
img {
border: none;
vertical-align: bottom;
}
/* Try to get rid of space above first p in div */
div > p:first-child {margin-top:0;}
.div-content-right-text img
{
  border: 1px solid #a9a9a9;
  b/ackground-color: #FFFFFF;
  margin: 5px 10px 5px 0px;
  padding: 5px;
}
img.left {
  float: left;
  clear: left;
  margin: 5px 10px 5px 0px;
}
img.right {
  float: right;
  clear: right;
  margin: 5px 10px 0px 5px;
}

/*
*
*   The shadow effect
*
*/
.img-shadow {
  float:left;
  clear: left;
  background: url(images/shadowAlpha.png) no-repeat bottom right !important;
  background: url(images/shadow.gif) no-repeat bottom right;
  margin: 10px 0 0 5px !important;
  margin: 10px 0 0 5px;
}
.img-shadow-yellow {
  background: url(images/shadowAlpha.png) no-repeat bottom right !important;
  background: url(images/shadow-yellow.gif) no-repeat bottom right;
}
.img-shadow img {
  display: block;
  position: relative;
  background-color: #fff;
  border: 1px solid #a9a9a9;
  margin: -6px 6px 6px -6px;
  padding: 4px;
}


/*
*
*   Global Link Settings
*
*/
a:link {
	color: #FFCC00;
	text-decoration: none;
}
a:visited {
	color: #FFCC00;
	text-decoration: none;
}
a:hover {
	color: #C4C4FF;
	text-decoration: none;
}
a:active {
	color: #FFFFCC;
	text-decoration: none;
}



/*
*
*   Body
*
*/
body {
	margin: 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
             font-size: small;
	color: #FFFFCC;
	background-image: url(background-tile.gif);

	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;

	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
}



/*
*
*   Global Styles for text
*
*/
/* Top and side menu text */
.text-menu {
font-family: Eras Demi ITC, Verdana, Arial, Helvetica, sans-serif;
font-size: medium;
}
/* Page title text */
.text-title {
f/ont-family: Eras Demi ITC, Verdana, Arial, Helvetica, sans-serif;
f/ont-size: xx-large;
f/ont-weight: bold;
}
/* General heading text */
.text-heading {
f/ont-family: Eras Demi ITC, Verdana, Arial, Helvetica, sans-serif;
c/olor: #FFCC00;
f/ont-size: medium;
}

h1 {
margin-top: 0px;
padding-top: 0px;
font-family: Eras Demi ITC, Verdana, Arial, Helvetica, sans-serif;
font-size: xx-large;
font-weight: bold;
}

h2 {
margin-top: 0px;
padding-top: 0px;
font-family: Eras Demi ITC, Verdana, Arial, Helvetica, sans-serif;
color: #FFCC00;
font-size: medium;
font-weight: normal;
}

h3 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: medium;
font-weight: bold;
}




/*
*
*   DIV layouts
*
*/

#div-clear {
clear:both;
}

.clear {
clear: both;
font-size: 1px;
}
.clearboth {
clear: both;
}

/*
*
*   Top level containers
*
*/
/* Overall */
#div-all {
	t/ext-align: center;
	margin: 0px;
	padding: 0px;
}
/* Header and content */
#div-container {
	width: 800px;
	background-color: #017FA5;

	/* Aligns in middle of page */
	margin: auto;
}
/* Footer */
#div-container-bottom {
	background-color: #333333;
	font-size: xx-small;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: dotted;
	border-top-color: #FFFFFF;
	border-right-color: #FFFFFF;
	border-bottom-color: #FFFFFF;
	border-left-color: #FFFFFF;
}



/*
*
*   Header (in div-container)
*
*/
/* Top of turtle */
#div-header-top
{
height: 150px;
background-image: url(images/Header-turtle_r1_c1.jpg);
padding:10px;
}
#div-header-top2
{
height: 20px;
background-image: url(images/Header-turtle_r2_c1.jpg);
}
/* Bottom of Turtle */
#div-header-bottom {
	/* Set the height and the width to the image background */
	height: 150px;
	width: 800px;
	background-attachment: scroll;
	background-image: url(images/Header-turtle_r4_c1.jpg);
	background-repeat: no-repeat;
	background-position: top;
	
	/* Clear so that we are UNDER the menu */
	clear: both;
}
/* Page Title */
#div-header-bottom-title {
	text-align: left;
	position: relative;
	bottom: -130px;
	left: 250px;
}
/* Page subtitle (not used) */
#div-header-bottom-subtitle {
	text-align: center;
	clear: left;
}




/*
*
*   Content (in div-container)
*
*/
/* main container - backround is in css-backgrounds */
#div-content {
	width: 800px;
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-position: bottom;
	/* Space for the piccys!!! */
	padding-bottom: 300px;
}
/* Empty div to hold everything else */
#div-content-box {
}




/*
*
*   Left floating menus etc (in div-content-box)
*
*/
/* Box to hold header, text and footer */
.div-content-left {
	float: left;
	width: 200px;
	padding-bottom: 10px;
	margin-bottom: 10px;
	clear: left;
}
/* Heading - note IE6 hacks - because IE6 collapses*/
.div-content-left-heading {	
	width: 190px;
	padding-left: 10px;
	line-height: 30px;

	/* Hacks to get this bit to be 30px high */
	min-height:30px;
	height:auto !important;
	height:30px;
}
.div-content-left-text {
	padding: 10px;
	width: 180px;
	overflow: hidden;
}
.div-content-left-text img
{
  border: 1px solid #FF3300;
  b/ackground-color: #FFFFFF;
  margin: 5px 10px 5px 0px;
  padding: 5px;
}
.div-content-left-footer{	
	width: 190px;
	padding-left: 10px;
	line-height: 30px;

	/* Hacks to get this bit to be 30px high */
	min-height:30px;
	height:auto !important;
	height:30px;
}



/*
*
*   Left menus styles etc (in div-content-box)
*
*/
/* Background images must be 30px high, (else change above) */
.left-blue-header {
	background-image: url(images/left-menu-blue_r1_c1.png) !important;
	background-image: url(images/left-menu-blue_r1_c1.gif);
	background-position: right top;
}
.left-blue {
	background-image: url(images/1x1_000033_40.png) !important;
	background-image: url(images/1x1_004C77.gif);
	background-position: right;
}
.left-blue-footer {
	background-image: url(images/left-menu-blue_r3_c1.png) !important;
	background-image: url(images/left-menu-blue_r3_c1.gif);
	background-position: right bottom;
}


.left-yellow-header {
	background-image: url(images/left-menu-yellow_r1_c1.png) !important;
	background-image: url(images/left-menu-yellow_r1_c1.gif);
	background-position: right top;
	font-family: Eras Demi ITC, Verdana, Arial, Helvetica, sans-serif;
	color: #CC3300;
	font-size: large;
}
.left-yellow {
	background-image: url(images/left-menu-yellow_r2_c1.png) !important;
	background-image: url(images/left-menu-yellow_r2_c1.gif);
	background-position: right;
	color: #333333;
}
.left-yellow-footer {
	background-image: url(images/left-menu-yellow_r3_c1.png) !important;
	background-image: url(images/left-menu-yellow_r3_c1.gif);
	background-position: right bottom;
}
/* Link Settings */
.left-yellow a:link {
	color: #FF3300;
	text-decoration: none;
}
.left-yellow a:visited {
	color: #FF3300;
	text-decoration: none;
}
.left-yellow a:hover {
	color: #000033;
	text-decoration: none;
}
.left-yellow a:active {
	color: #FF3300;
	text-decoration: none;
}



/*
*
*   Right floating stuff etc (in div-content-box)
*
*/
/* Container for it all */
#div-content-right {
	float: right;
	width: 580px;
}
/* Header, text and footer */
.div-content-right-heading {	
	padding-left: 10px;
	line-height: 30px;

	/* Hacks to get this bit to be 30px high */
	min-height:30px;
	height:auto !important;
	height:30px;
}

.div-content-right-text {
	padding: 10px;
	width: 560px;
	overflow: hidden;
}
.div-content-right-text ul.albumlist img, .div-content-right-text ul.picturelist img
{
  border: none;
  b/ackground-color: #FFFFFF;
  margin: 0;
  padding: 0;
}
.div-content-right-footer{
	padding-left: 10px;
	line-height: 30px;
	margin-bottom: 20px;

	/* Hacks to get this bit to be 30px high */
	min-height:30px;
	height:auto !important;
	height:30px;
}


/*
*
*   Right content styles etc (in div-content-right)
*
*/
.right-blue-header {
	background-image: url(images/right-content-blue_r1_c1.png) !important;
	background-image: url(images/right-content-blue_r1_c1.gif);
	background-position: left top;
}
.right-blue {
	background-image: url(images/1x1_000033_40.png) !important;
	background-image: url(images/1x1_004C77.gif);
	background-position: left;
}
.right-blue-footer {
	background-image: url(images/right-content-blue_r3_c1.png) !important;
	background-image: url(images/right-content-blue_r3_c1.gif);
	background-position: left bottom;
}


.NewsSummary {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-bottom-style: dotted;
	border-top-color: #017FA5;
	border-right-color: #017FA5;
	border-bottom-color: #017FA5;
	border-left-color: #017FA5;
	margin-bottom: 5px;
}

/* End of 'css-main' */

/* Start of CMSMS style sheet 'css-horizontal-menu' */
@charset "utf-8";
/* CSS Document */

/* Horizontal menu for the CMS CSS Menu Module */
/* by Alexander Endresen */

#menu_vert {
   m/argin-left: 1px;
   m/argin-right: 1px;
}

/* The wrapper clears the floating elements of the menu */

/* Fix for Opera 8 */
.clearb { clear: both; }
#menuwrapper { 
   /* Fix for Opera 8 */ 
   /*   overflow: hidden;  */ 
   b/ackground-color: #ECECEC;
   b/order-bottom: 1px solid #C0C0C0;
   width: 100%;
}

#menuwrapper
{
	height: 30px;
	background-image: url(images/Header-turtle_r3_c1.jpg);
	background-attachment: scroll;
	background-position: top;
}


/* Unless you know what you do, do not touch this */ 
#primary-nav, #primary-nav ul { 
   list-style: none; 
   margin: 0px; 
   padding: 0px;
}
#primary-nav a:link {
	color: #FFFFCC;
	text-decoration: none;
}
#primary-nav a:visited {
	color: #FFFFCC;
	text-decoration: none;
}
#primary-nav a:hover {
	color: #FFCC00;
	text-decoration: none;
}
#primary-nav a:active {
	color: #FFFFCC;
	text-decoration: none;
}
/* This is the top horizontal thingy */
#primary-nav a { 
   d/isplay: block; 
   m/argin: 0px; 
   p/adding: 5px 10px; 
   t/ext-decoration: none; 
   c/olor: #006699;
	 display: block; 
}
#primary-nav li { 
   m/argin-left: -1px;
	f/loat: left;
   w/idth: auto;
}
.leftalign
{
float: left;
}

.rightalign
{
float: right;
}
#primary-nav li a {
	
   b/order-right: 1px solid #C0C0C0;
   b/order-left: 1px solid #C0C0C0;
	 c/olor: #FFFFFF;
	 padding-left: 10px;
	 padding-right: 10px;
	 line-height: 30px;
}
/* This is the second level menu */
#primary-nav ul {
	position: absolute;
	top: auto;
	display: none;
f/loat: none;
	b/order: 1px groove #FFFFFF;
b/order-bottom: 1px solid #FFFF09;
border-bottom: 1px solid #0F5580;
border-right: 1px solid #0F5580;
border-left: 1px solid #0F5580;
	width: 150px;
w/idth: auto;
	b/ackground-image: url(images/grey-menu_r1_c1.jpg);
             background-image: url(images/1x1_000033_40.png) !important;
             background-image: url(images/1x1_004C77.gif);
	b/ackground-repeat: repeat-y;
	padding-top: 5px;
	padding-bottom: 5px;
}
#primary-nav li li { 

   m/argin-left: 0px;
   m/argin-top: -1px;
   float: none; 
   p/osition: relative;
w/idth: auto;
	 width: 150px;
	w/idth: 100%; 
}
#primary-nav li li a { 

   b/order: 1px solid #C0C0C0;
	
	line-height:normal;
	p/adding-left: 10px;
	c/olor: #FFFFFF;
}
/* Third level !!!! */
#primary-nav ul ul { 
   m/argin-top: 1px;
   m/argin-left: -1px;
   left: 100%; 
   top: 0px; 
}

	

/* Styling the basic apperance of the menu elements NOT USED*/
#primary-nav img
{
	display: block;
	border-style: none;
	t/ext-decoration: none;
	v/ertical-align: bottom;
}

#primary-nav li, #primary-nav li.menuparent { 
   b/ackground-color: #ececec; 
}

/* Styling the basic apperance of the active page elements (shows what page in the menu is being displayed) */

#primary-nav li.menuactive { 
   b/ackground-color: #C7C7C7; 
}


/* Styling the basic apperance of the menuparents - here styled the same on hover (fixes IE bug) */
#primary-nav ul li.menuparent, 
#primary-nav ul li.menuparent:hover, 
#primary-nav ul li.menuparenth { 
/* arrow for menuparents */
   b/ackground-image: url(images/cms/arrow.gif); 
   b/ackground-position: center right; 
   b/ackground-repeat: no-repeat; 
}


/* Styling the apperance of menu items on hover */

#primary-nav li:hover, 
#primary-nav li.menuh, 
#primary-nav li.menuparenth, 
#primary-nav li.menuactiveh { 
   b/ackground-color: #E7AB0B; 
}

#primary-nav li.menuh { 
   b/ackground-color: #E7AB0B; 
}

/* The magic - set to work for up to a 3 level menu, but can be increased unlimited */

/* 
just add 
#primary-nav li:hover ul ul, 
#primary-nav li.menuparenth ul ul ul,
for fourth level 
*/
#primary-nav ul, 
#primary-nav li:hover ul, 
#primary-nav li:hover ul ul, 
#primary-nav li.menuparenth ul, 
#primary-nav li.menuparenth ul ul {
	display: none;
}
/* add 
#primary-nav ul ul ul li:hover ul, 
#primary-nav ul ul ul li.menuparenth ul,
for fourth level
*/
#primary-nav li:hover ul, 
#primary-nav ul li:hover ul, 
#primary-nav ul ul li:hover ul, 
#primary-nav li.menuparenth ul, 
#primary-nav ul li.menuparenth ul, 
#primary-nav ul ul li.menuparenth ul { 
   display: block; 
}
#primary-nav ul li:hover { 
	b/ackground-color: #E7AB0B;
}

#primary-nav ul li.menuh { 
	b/ackground-color: #E7AB0B;
}
/* IE Hacks */
#primary-nav li li { 
   float: left; 
   clear: both; 
}
#primary-nav li li a { 
   height: 1%; 
}
/* End of 'css-horizontal-menu' */

/* Start of CMSMS style sheet 'css-content-menu' */
@charset "utf-8";
/* CSS Document */

/* Horizontal menu for the CMS CSS Menu Module */
/* by Alexander Endresen */

#menu_vert-c {
   m/argin-left: 1px;
   m/argin-right: 1px;
}

/* The wrapper clears the floating elements of the menu */

/* Fix for Opera 8 */
.clearb { clear: both; }
#menuwrapper-c { 
   /* Fix for Opera 8 */ 
   /*   overflow: hidden;  */ 
   b/ackground-color: #ECECEC;
   b/order-bottom: 1px solid #C0C0C0;
   w/idth: 100%;
}

#menuwrapper-c
{
	h/eight: 30px;
	b/ackground-image: url(images/Header-turtle_r3_c1.jpg);
	b/ackground-attachment: scroll;
	b/ackground-position: top;
}


/* Unless you know what you do, do not touch this */ 
#primary-nav-c, #primary-nav-c ul { 
   list-style: none; 
   margin: 0px; 
   padding:0px; 	 
}

#primary-nav-c li { 
width: 150px;
}
/* End of 'css-content-menu' */

/* Start of CMSMS style sheet 'css-backgrounds' */
/* Background styles */
/* We set a min-height so that all the image is shown, but the div can expand as well */
.content-background- {
	background-image: url(coralfish-bottom.jpg);
	min-height: 668px;
	height:auto !important;
	height:668px;
}
.content-background-00001 {
	background-image: url(fish-bottom.jpg);
	min-height: 600px;
	height:auto !important;
	height:600px;
}

.content-background-00002 {
	background-image: url(coralfish-bottom.jpg);
	min-height: 668px;
	height:auto !important;
	height:668px;
}

.content-background-00003 {
	background-image: url(shark-bottom.jpg);
	min-height: 473px;
	height:auto !important;
	height:473px;
}

.content-background-00004 {
	background-image: url(nudibrank-bottom.jpg);
	min-height: 456px;
	height:auto !important;
	height:456px;
}

.content-background-00005 {
	background-image: url(guysunderwater-bottom.jpg);
	min-height: 600px;
	height:auto !important;
	height:600px;
}
.content-background-00006 {
	background-image: url(ribboneel-bottom.jpg);
	min-height: 485px;
	height:auto !important;
	height:485px;
}

.content-background-00007 {
	background-image: url(flatworm-bottom.jpg);
	min-height: 509px;
	height:auto !important;
	height:509px;
}

.content-background-00008 {
	background-image: url(fish-bottom.jpg);
	min-height: 600px;
	height:auto !important;
	height:600px;
}

.content-background-00009 {
	background-image: url(nudibrank-bottom.jpg);
	min-height: 456px;
	height:auto !important;
	height:456px;
}
/* End of 'css-backgrounds' */