/*-----------------------------------------------------------------------------------------|
|  Styles to cascade from http://www.deh.gov.au/includes/default/css/default.css           |
|-----------------------------------------------------------------------------------------*/

body {
  background-image: none;color:black
}
h1 {
  color: #008;
  padding-top: 0;
}
h1.main {
  color: #008;
  padding-top: 0;
  border-bottom:1px solid #008;
  font-weight:500
  }
h2 {
  color: #000;
}
h2.main {
  color: #088;
  padding-top:0
}
h3 {
  color: #0ca4bc;
}
h4 {
  color: #008;
}
h5 {
  color: #066;padding-bottom:0 
}
th {
  background-color: #29b487;
  background-color: #004680;
  border-bottom: 1px solid #d0d1c2;
  color:white;
}
strong {color:#007}
td {
  background-color: #fff;
  border-bottom: 1px solid #c9cac0;
}
td.highlight {
  background-color: #f2f4cd; 
}
th.subhead {
  background-color:#f2f4cd;
  color: black;
}
caption {
  background-color:#29b487 !important;
  color: white;
}
table.mpa {border-top:1px solid #009}
table.mpa td {background:white;border-bottom:1px solid #0a5c5c}
table.mpa th {background:white;border-bottom:1px solid #178080;color:#0a5c5c}
table.mpa th.multiple {background:#bfffff;color:#000}
table.mpa th.special {background:#73d0ff;color:#000}
table.mpa th.sanctuary {background:#71f230;color:#000}
table.mpa th.recreational {background:#ffb319;color:#000}
table.mpa th.benthic {background:#ccff66;color:#000}
#global {
  background: #004680 url(/includes/coasts/images/bg-global.gif) repeat-x 180px 2px;
}
#global a,
#global a:link,
#global a:visited {
  background-color: transparent;
  color: #252514;
  text-decoration: none;
}
#global li {
  background: #2d615d url(/includes/coasts/images/bg-button.gif) no-repeat 0 50%;
}
#header {
  background: #003d7c url(/includes/coasts/images/bg-header.gif) repeat-x 0 0;
}
#header img {
  padding-left: 12px;
  padding-top: 5px;
}
#header ul li {
  background: transparent url(/includes/coasts/images/bg-access-repeat.gif) repeat-x 0 0; 
}
#header ul li.left-link {
  background: transparent url(/includes/coasts/images/bg-access-left.gif) no-repeat 0 0;
} 



/* Controls different header feature images
----------------------------------------------------------------------------------------- */

.header-whales {
  background: transparent url("/includes/coasts/images/bg-feature-whales.gif") no-repeat right 0 !important;
}
.header-mbp {
  background: transparent url("/includes/coasts/images/bg-feature-mbp.gif") no-repeat right 0 !important;
}
.header-fisheries {
  background: transparent url("/includes/coasts/images/bg-feature-fisheries.gif") no-repeat right 0 !important;
}


/* Controls navigation for anchor links and related page links 
----------------------------------------------------------------------------------------- */
#pagenav, 
#sectionnav {
  background-image: none;
}
#pagenav h2, #sectionnav h2 {
  color: #800;
  font-weight:600;
  padding-bottom:0px;
  font-weight:bold
} 
/* Left navigation

Requires 4 colour variations of a chosen hue:
1 darkest (hover on flyouts, same as bg-nav right border)
1 darker (border-bottom colour for 3D effect)
1 medium (for level 1 and 2 backgrounds - ensure sufficient text contrast)
1 light  (for level 3 to 7 backgrounds - slightly lighter than medium)

--------------------------------------------------------- */
#navigation {
  font: 90%/1.4em Arial, Geneva, sans-serif;
  left: 0;
  position: absolute;
  top: 101px;
  width: 169px;
}

/* Generic list behaviour
--------------------------------------------------------- */
#navigation ul {
  list-style-type: none;
  font-family: Arial, Helvetica, sans-serif;
}
html #navigation ul li { /* needed for ie */
  display: inline;
}
#navigation ul li a,
#navigation ul li a:link,
#navigation ul li a:visited {
  background-color: #e9f3f5;
  color: #336;
  text-decoration: none;
}
#navigation ul li a:hover {
  text-decoration: underline;
}
#navigation ul li.selected a {
  background-color: white !important;
  border-top: 1px solid #ddd !important;
  color: black !important;
}
#navigation ul li.selected li a {
  background-color: #e9f3f5 !important;
  border-top: 1px solid white  !important;
  color: #336 !important;
}

/* Controls left nav lists
--------------------------------------------------------- */
#navigation li.level1 a,
#navigation li.level1 a:link,
#navigation li.level1 a:visited {
  background: transparent url(/includes/coasts/images/bg-nav-heading.gif) no-repeat 0 0;
  border-top: 0;
  color: white;
  display: block;
  padding: 0.75em 0 0.75em 7px;
  text-decoration: none;
  width: 163px;
}
#navigation li.level1 a:hover {
  background-color: inherit;
  color: white;
  text-decoration: underline;
}
#navigation li.level1 li a,
#navigation li.level1 li a:link,
#navigation li.level1 li a:visited {
  color: #336;
}
#navigation li.level1 li a:hover {
  background-color: inherit;
  color: black;
}
#navigation li.level2 a,
#navigation li.level2 a:link,
#navigation li.level2 a:visited {
  background-color: #d6e9ef;
  background-color: #e2f5ef;

  background-image: none;
  border-bottom: 1px solid #a7bdc8;
  border-top: 1px solid white;
  display: block;
  padding: 0.6em 0 0.6em 14px;
  width: 155px;
}
#navigation li.level3 a,
#navigation li.level3 a:link,
#navigation li.level3 a:visited {
  border-bottom: 1px solid #a7bdc8;
  border-top: 1px solid white;
  display: block;
  padding: 0.6em 0 0.6em 14px;
  width: 155px;
}
#navigation li.level4 a,
#navigation li.level4 a:link,
#navigation li.level4 a:visited {
  background-color: #e0eef2;
  border-bottom: 1px solid #a7bdc8;
  border-top: 1px solid white;
  display: block;
  padding: 0.5em 0 0.5em 28px;
  width: 141px;
}
#navigation li.level5 a,
#navigation li.level5 a:link,
#navigation li.level5 a:visited {
  background-color: #e0eef2;
  border-bottom: 1px solid #a7bdc8;
  border-top: 1px solid white;
  display: block;
  padding: 0.35em 0 0.35em 35px;
  text-decoration: none;
  width: 134px;
}
#navigation li.level5 a:hover {
  text-decoration: underline;
}
#navigation li.level6 a,
#navigation li.level6 a:link,
#navigation li.level6 a:visited {
  background-color: #e9eff5;
  border-bottom: 1px solid #a7bdc8;
  border-top: 1px solid white;
  display: block;
  padding: 0.35em 0 0.35em 42px;
  text-decoration: none;
  width: 127px;
}
#navigation li.level6 a:hover {
  text-decoration: underline;
}
#navigation li.level7 a,
#navigation li.level7 a:link,
#navigation li.level7 a:visited {
  background-color: #e9eff5;
  border-bottom: 1px solid #a7bdc8;
  border-top: 1px solid white;
  display: block;
  padding: 0.35em 0 0.35em 49px;
  text-decoration: none;
  width: 120px;
}
#navigation li.level7 a:hover {
  text-decoration: underline;
}

/* Flyout lists
--------------------------------------------------------- */
#navigation ul.nav-items {
  background-color: #e9eff5;
  border-bottom: 1px solid #2d615d;
  border-right: 1px solid #2d615d;
  border-top: 1px solid #2d615d;
  display: none;
  left: 0;
  list-style-type: none;
  overflow: hidden;
  position: absolute;
  top: 0;
  visibility: hidden;
  width: 190px !important;
  z-index: 1;
} 
#navigation ul.nav-items li a {
  background-image: none !important; 
  color: #336 !important;
  display: block;
  font-size: 95%;
  padding: 0.3em 0.25em 0.3em 0.3em !important;
  width: 188px !important;
  text-decoration: none !important;
}
#navigation ul.nav-items a:hover {
  background-color: #2d615d !important;
  background-image: none; 
  color: white !important;
  display: block;
  text-decoration: none;
}

/* Image under nav
--------------------------------------------------------- */
#navigation-image {
  background: url(/includes/coasts/images/bg-navigation-image.jpg) no-repeat 0 0;
  height: 200px;
  margin-top: 0;
}

/* Side navigation links down the right
----------------------------------------------------------------------------------------- */

#sidepanel div.sidebox 
{
background-color: #fff;
border: none;
}
#sidepanel h2 
{
background-image: url(/includes/coasts/images/bg-panel-heading.gif);
border:none;
color:black;
font-size:1.2em;
font-weight:bold;
padding:0.4em 0.5em
}
#sidepanel h2.sidebox 
{
background-color: #fff;
background-image:none;
border-bottom:2px solid #0ca4bc;
font-size:1.3em;
color: #0ca4bc;
}
#sidepanel h3 
{
border-bottom:2px dotted #0ca4bc;
color: #0ca4bc; 
}
.header-cci {
  background: transparent url("/includes/coasts/images/bg-feature-mbp.gif") no-repeat right 0 !important;
}  
/* Tab colour
----------------------------------------------------------------------------------------- */
ul#tabnav li a { /* all tabs */
  background-color: #5091a4;
  color: #fff;
}
ul#tabnav li a:hover {
  
  text-decoration:underline;
   background-color: #fff;
  color: #000;
}
.tab-on a { /* selected tab */
  background-color: white !important;
  border-bottom: 2px solid white !important;
  border-left: 1px solid #666 !important;
  border-right: 1px solid #666 !important;
  border-top: 1px solid #666 !important;
  color: black !important;
  padding-top: 6px !important;
}
/* Controls layout of map interface
----------------------------------------------------------------------------------------- */
#map-container {
  background: #60abd2 url(/includes/coasts/images/bg-map.gif) no-repeat 0 0;
  float: left;
  border-bottom: 2px solid #60abd2;
  margin: 0;
  padding: 0;
  width: 100%;
}
#map-container ul.tabs {
  font-size: 100%;
  list-style-type: none;
  padding: 0;
  height: 26px;
}
#map-container ul.tabs li {
  background: white url(/includes/coasts/images/bg-taboff.gif) repeat-x 0 0;
  color: #182d48;
  float: left;
  list-style-type: none;
  margin: 4px 2px 0 2px;
  padding: 0.1em 0.75em 0.5em 0.75em;
  text-align: center;
}
#map-container ul.tabs li a:link,
#map-container ul.tabs li a:visited {
  background-color: transparent;
  color: white;
  text-decoration: none;
}
#map-container ul.tabs li a:hover {
  color: white;
  text-decoration: underline;
}
#map-container ul.tabs li.activepage {
  background: white url(/includes/coasts/images/bg-tabon.gif) repeat-x 0 0;
}
#map-container ul.tabs li.all-map-list {
  background: none; 
  border: none;
  float: right;
}
#map-image img {
  float: left; 
  padding: 5px 0 0 0;
  margin: 0;
}
#map-thumbs {
  clear: both;
  float: left;
  margin: 1em 2px 0 2px;
  padding: 0.5em 0 0.5em 3px;
  width: 60px;
}
#map-thumbs img {
  padding: 0 0 0.5em 2px;
}

/* Controls UL list for map interface
----------------------------------------------------------------------------------------- */
#map-list {
  background-color: white;
  border: 2px solid #b3d3e0;
  margin: 6px 4px 4px 511px;
  padding: 0 0 1em 0;
}
#map-list h2 {
  background: #b3d3e0 url(/includes/coasts/images/bg-tabhead.gif) repeat-x 0 50%;
  font: 100%/1.4em Arial, Verdana, Geneva, sans-serif;
  font-weight: bold;
  padding: 0.25em 0.25em 0.5em 0.5em;
  margin: 0;
}
#map-list h3 {
  font: 90%/1.4em Arial, Verdana, Geneva, sans-serif;
  font-weight: bold;
  padding: 0.5em 0.25em 0 0.5em;
  margin: 0;
}
#map-list ol {
  padding: 0.5em 0.5em 0 2em;
  margin: 0 0 0 0.5em;
}
#map-list ol li {
  background: none;
  list-style-type: decimal;
  padding: 0.2em 0 0.2em 0;
}
#map-list ul {
  background: none; 
  font-size: 100%;
  height: 100%;
  list-style-type: none;
  padding: 0.5em 0.5em 0.5em 0;
}
#map-list ul li {
  background: transparent url(/includes/coasts/images/bullet.gif) no-repeat 0 0.7em; 
  border: none;
  color: #182d48;
  float: none;
  list-style-type: none;
  margin: 0.5em 0.25em 0.5em 1em;
  padding: 0 0.75em 0 1em;
  text-align: left;
}

/* Controls layout of underwater page
----------------------------------------------------------------------------------------- */
#map-container.underwater {
  background: #022136 url(/includes/coasts/images/bg-ocean.jpg) repeat-x 0 0;
  border-right: 1px solid #4d7ca4;
}
#map-container.underwater ul.tabs {
  background: #123052 url(/includes/coasts/images/bg-tabbg.gif) repeat-x 0 0;
  padding-bottom: 4px;
  padding-right: 4px;
}
#map-container.underwater h2 {
  color: white;
  border-bottom: 1px dashed #d6e9ef;
}
#map-container.underwater h2 span {
  font-size: 60%;
  font-style: italic;
}
.underwater-container {
  padding: 15px 10px 15px 5px;
}
.underwater-container-div {
  clear: both;
}
.underwater-leftcol {
  float: left;
  width: 20%; 
}
.underwater-rightcol {
  float: right;
}
.underwater-photo {
  background-color: #d6e9ef;
  color: black;
  font-size: 100%;
  font-weight: normal;
  margin: 0 0 10px 0; 
  padding: 1px;
  width: 500px; 
}
.underwater-photo p {
  margin: 0;
  padding: 5px 2px;
}
#map-container.underwater-container ul {
  margin-top: 5px;
}
.underwater-container ul li {
  border: none !important;
  text-align: left !important;
  float: none !important;
}
#map-container.underwater .pdf a,
#map-container.underwater .pdf a:link,
#map-container.underwater .pdf a:visited,
#map-container.underwater .img a,
#map-container.underwater .img a:link, 
#map-container.underwater .img a:visited,
#map-container.underwater .video a,
#map-container.underwater .video a:link, 
#map-container.underwater .video a:visited {
  background-color: transparent;
  font-size: 100%;
  color: white;
}
#map-container.underwater .pdf a:hover,
#map-container.underwater .img a:hover,
#map-container.underwater .video a:hover {
  color: yellow;
}
.distbox {
  background: #d6e9ef url(/includes/coasts/images/bg-dist-box.jpg) repeat-x 0 0;
  border-left: 1px solid #4d7ca4;
  border-right: 1px solid #4d7ca4;
  border-bottom: 1px solid #4d7ca4;
  margin: 0;
  padding: 0 10px 10px 10px;
}
.creature-container {
  clear: both;
}
.creature-left {
  float: left;
  margin: 30px 5px 5px 30px;
  width: 240px;
  background-color: white;
  border: 1px solid #4d7ca4;
}
.creature-right {
  float: right;
  margin: 30px 5px 5px 30px;
  width: 240px;
  background-color: white;
  border: 1px solid #4d7ca4;
}
.creature-left p,
.creature-right p {
  padding: 0 5px;
}
.imageborder2 {border:#088 1px solid;background:#d4eae6;text-align:left;margin:0;}
.imageborder2 a:visited {color:#800063;}

.imageborder2 p {text-align:left;font-size:0.8em;padding:2px;margin:0}

#image-container {
  background: white;
  border-bottom: 1px solid #efefe1;
  float: right;
  margin: 0;
  padding: 0;
  }
#highlight-coasts {
 
	background-color: #d4eae6;
	margin:10px 380px 10px 5px;
	padding: 0 0.5em 1em 0.5em;
	background-image: url(../../../coasts/images/new-curve.jpg);
	background-repeat: no-repeat;
	background-position: right bottom;
}
#highlight-mpa {border:2px solid #c8caca;padding:0px 10px 6px 10px;margin:2px 10px}
#maincontent .photo {
  background-color: #ebfbfa;
  color: black;
  font-weight: normal;
  font-size: 90%;
  text-align: left;
  padding: 3px;
  margin: 0.75em 0.5em 0.5em 0;
  border:1px solid #ddd
}
span.heading {font-weight:600;font-size:1.4em;color:#088}

/* Styles for Marine Protected Areas
----------------------------------------------------------------------------------------- */
body.mpa div#sidepanel {padding-left:0px;padding-bottom:0px}
body.mpa div#sidepanel a:hover {background-color: #d1f8f8;color: #066;font-weight:520;text-decoration:underline}
body.mpa div#sidepanel h2 {background: #fff url(/includes/coasts/images/bg-panel-heading2.gif) no-repeat ;border:none;
color:black;
font-size:1.2em;
font-weight:bold;
padding:0.4em 0.5em
}
body.mpa div#sidepanel h3 {padding-bottom:5px;padding-left:5px;border-top:1px solid #ccc;color:#008}
body.mpa div#sidepanel h3 a {color:#008;text-decoration:none}
body.mpa div#sidepanel h3 a:hover {text-decoration:underline}
body.mpa div#sidepanel ul li a {text-decoration:none}
body.mpa div#sidepanel ul li.selected {color:#00c}

div.highlight {background:white url(/coasts/mpa/images/highlight-background.jpg);padding:10px;border:1px solid #088}

/* Wide sidepanel
----------------------------------------------------------------------------------------- */
#maincontent {
    margin: 0 0 0 210px;
}

/* Two columns with photos
----------------------------------------------------------------------------------------- */
.videos {color:#800;border-bottom:1px solid #800}
div.boxcontainer {margin:0.5em;width:100%;clear: both;}
div.box {float:left;border:1px solid #ddd;width:49.5%;padding-top:6px}
div.clear {border:none;float:none;clear:both;}
div.box img {clear: both;float: left;padding-bottom: 0.75em;}
div.box h2 {font-size: 1.1em;margin-left: 180px;padding: 0}
div.box h2 a {text-decoration:none;color:#088}
div.box h2 a:hover {text-decoration:underline;color:#800}
div.box p {margin-left:180px;padding:0}
div.box p.firstline {margin-top: 0.25em;padding-top:5px;}

/* Style for new header
------------------------------------------------------- */
#title {background-image:none;top:30px;}
#title h1 {color:#c0f4ef;font-size: 1.5em;padding: 12px 0 0 0;margin-right: 30px;margin-bottom:0px;font-weight:normal;border:none;line-height:0.5em}
#title label  {background:transparent;color:black;font-size:1.0em;padding:2px;border:none} 
#title .searchbox {background:#f9eee4;color:black;font-size:1.2em;padding-top:0px;border-right:2px solid #999;border-bottom:2px solid #999}
#title .button {background:#fc6;color:black;font-size:1.1em;padding:2px 4px}
div#title form {padding-top:0px;float:right;}
#title h2 {padding-top: 10px; line-height:1.3em;margin-right: 15px;}

/* Wide footer
----------------------------------------------------------------------------------------- */
#footer2 p { border:none;color:#333;text-align:center;font-size:0.8em}
#footer2 a { border:none;color:#333;text-align:center;font-size:0.9em;text-decoration:none}

#footer-wide {
background:#004680;
border-top:3px solid #00af9d;
clear:both;
color:#fff;
overflow:hidden;
padding:3px 0px;
width:100%;
height:25em;
}
#footer-wide p {font-size:0.9em}
#footer2 a:hover { text-decoration:underline}
#footer-wide .cols5 h2 {font-size:1.0em;color:#0cc;}
#footer-wide .cols5 h2 a {font-size:1.0em;color:#0cc}
#footer-wide .cols6 h2 {font-size:1.0em;color:#00af9d;}
#footer-wide .cols6 h2 a {font-size:1.0em;color:#00af9d;}
#footer-wide a {text-decoration:none;color:#fff;font-size:0.8em}
#footer-wide a:hover {text-decoration:underline;color:#0cc;}
#footer-wide ul {list-style-type: none;}
#footer-wide ul li {background: url(/includes/default/images/bullet.gif) no-repeat 0 0.6em; 
  font-size: 0.9em;line-height: 1.5em;padding: 0 0 0.5em 15px;}
.cols5 {float:left;margin-top:0px;width:18%;}
.cols6 {float:left;margin-top:0px;width:14%;}

/* MPA Maps downloads
----------------------------------------------------------------------------------------- */

div.imagegroup {
float:left;
margin:1em 0 0 0; 
padding:0 0 0.5em 0;  
border-top:1px solid #6f84d4; 
border-bottom:1px solid #6f84d4;
width:100%;background:#fff;
}
div.imagegroup p {
margin:0 0 0 0; 
color:#000;
font-size: 0.8em; 
font-family: sans-serif;
font-weight:normal;
width:auto;
text-align:left;
}

div.imagecaption {
float:left; width:162px; 
margin: 10px 5px 10px 5px; 
padding: 15px 15px 30px 15px; 
display:inline; 
text-align:center; 
border-color:#CCC #aebbeb #aebbeb #CCC; 
border-width:1px; 
border-style:solid; 
background: white;}

div.imagecaption img {
border-color:#aebbeb; 
border-width:1px; 
border-style:solid;}

div.imagecaption a {
font-size:1.3em;
font-weight:bold;
text-decoration:none;
color:#088
}


/* Two columns without images
----------------------------------------------------------------------------------------- */
div.clear
{
border:none;float:none;clear:both;height:0.5em
}
div.boxcontainer {
margin:0.9em 0.5em;
width:100%;
clear: both;
}

div.boxcontainer h2 {
background:#024683;color:white;font-size:1.0em;font-weight:bold;padding:0.2em 0.5em;margin-top:0.8em}

div.boxtwocols h2
{
color:#000; 
background: url(/sustainability/includes/images/background1.gif) repeat-x ;
border-top:1px solid #ccc;
font-size:1.0em;
font-weight:bold;
padding:0.5em ;
margin-top:0
}
div.boxcontainer h3 {font-size:1.1em}

div.boxtwocols {
float:left;
border:1px solid #fff;
width:48.0%;
padding-right:6px
}
div.boxtwocols h2 a {
text-decoration:none;
padding-bottom:0px;
color:#088
}
div.boxtwocols h2 a:hover {
text-decoration:underline;
color:#800
}
div.boxonecol {
  clear: both;
  margin: 0.5em 10px 0 0;
}
div.boxonecol img {
  clear: both;
  float: left;
  padding: 0px;
}
div.boxonecol h2 {
font-size: 1.3em; padding: 0.2em; border-bottom:1px dotted #696; color:#1077ae;font-weight:540; 
}
div.boxonecol p {
  margin-left: 150px;
}

