/* MCSR CSS */

body {
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	font-size: 14px;
	line-height: 16px;
	margin: 0; border: 0; padding: 0;
	background-color: #FFFFFF;
	background-image: url(../images-design/body-bg.jpg);
	background-position: left top;
	background-repeat: repeat-x;
}

/*  The main wrapper div, position relative. All other div's are absolute within this div.  */
#wpr {
	position: relative;
	width: 970px;
	margin: 0 auto;
	border: 0; padding: 0;
	background-image: url(../images-design/wpr-bg.jpg);
	background-position: left top;
	background-repeat: repeat-y;
}

/* Header divs */
#hd {
	position: relative;
	margin: 0; border: 0; padding: 0;
	width: 970px;
	height: 148px;
	background: left top url(../images-design/hd-bg.jpg) no-repeat #FFFFFF;
}

#hd-mcsr-lg { /* MCSR logo */
	position: absolute;
	margin: 0; border: 0; padding: 0;
	/* Old logo: top: 13px;left: 15px;width: 136px;height: 128px;*/
	top: 13px;
	left: 16px;
	width: 134px;
	height: 129px;
	background: left bottom url(../images-design/hd-mcsr-lg.jpg) no-repeat;
}

#hd-mcsr-txt { /* MCSR text */
	position: absolute;
	margin: 0; border: 0; padding: 0;
	top: 101px;
	left: 158px;
	width: 520px;
	height: 40px;
	font-size: 34px;
	line-height: 34px;
	font-weight: normal;
	color: #000000;
}

/* Tabs */
#tabs-top, #tabs {
	position: relative;
	margin: 0; border: 0; padding: 0;
	width: 968px;
	height: 17px;
	background-image: url(../images-design/tabs-top.jpg);
	background-position: left top;
	background-repeat: no-repeat;
	background-color: #FFFFFF;
}
#tabs {
	height: 33px;
	background-image: url(../images-design/tabs.jpg);
}
#tab1, #tab2, #tab3, #tab4, #tab5, #tab6 {
	margin: 0; border: 0; padding: 0;
	width: 153px;
	height: 33px;
    float: left;
	background-image: none;
	background-position: left top;
	background-repeat: no-repeat;
}
#tab1:hover {background-image: url(../images-design/tab1-hvr.jpg);}
#tab2:hover {background-image: url(../images-design/tab2-hvr.jpg);}
#tab3:hover {background-image: url(../images-design/tab3-hvr.jpg);}
#tab4:hover {background-image: url(../images-design/tab4-hvr.jpg);}
#tab5:hover {background-image: url(../images-design/tab5-hvr.jpg);}
#tab6:hover {background-image: url(../images-design/tab6-hvr.jpg);}

/* Breadcrumb trail */
#bc {
	position: relative;
	margin: 0; border: 0; padding: 0;
	width: 967px;
	height: 17px;
	font-size: 10px; line-height: 10px; /* Required to stop IE enlarging height to font size */
	color: #A988A5;
	text-align: left;
	background-color: #6B4866;
}

#bc li a, #bc li a:hover, #bc li a:visited, #bc li a:active {font-weight: normal; color: #A988A5; text-decoration: none;} /* Additional specificity of '#bc li a' required over simply '#bc a' as Websiter adds an id in each li */
#bc li a:hover {color: #FFFFFF;}

#bc ul {
	list-style-type: none;
	margin: 0;
	padding: 3px 0 0 57px;
}

#bc ul li {
	display: inline;
	white-space: nowrap;
}

#bc a {
	text-decoration: underline;
	margin: 0 5px 0 0;	
	padding: 0;
}
	
/* Top left, bottom left, top right and bottom right curved corners positioned from breadcrumb trail */
#bclf, #bctl, #bcbl, #bctr, #bcbr {
	position: absolute;
	margin: 0; border: 0; padding: 0;
	background-position: left top;
	background-repeat: no-repeat;
}
#bclf {/* MCSR leaf logo */
	width: 231px;
	height: 71px;
	top: 17px;
	left: 8px;
	background-image: url(../images-design/bclf.jpg);
}
#bctl {
	width: 16px;
	height: 16px;
	top: 0;
	left: 0;
	background-image: none;
}
#bctr {
	width: 16px;
	height: 16px;
	top: 0;
	left: 951px;
	background-image: none;
}
#bcbl {
	width: 16px;
	height: 12px;
	top: 17px;
	left: 8px;
	background-image: none;
}
#bcbr {
	width: 16px;
	height: 12px;
	top: 17px;
	left: 943px;
	background-image: url(../images-design/bcbr.jpg);
}

/* Footers */
#ft1, #ft2, #ft3, #ft4 {
	position: relative;
	border: 0; padding: 0;
	width: 968px;
	z-index: 1;
}
#ft1 {
	height: 99px;
	margin: 0 0 0 8px;
	background-image: url(../images-design/ft1.jpg);
	background-position: left top;
	background-repeat: no-repeat;
}
#ft2 {
	margin: 0 0 0 8px;
	width: 951px;
	height: 33px;
	background-color: #443B2A;
}
/* Privacy, Terms, etc, see below for styling of #f2 links */
#ft2 p {
	margin: 0; border: 0;
	padding: 7px 0 0 0;
	font-size: 12px;
	text-align: center;
	color: #EFE8B2;
}

#ft3 {
	height: 63px; /* 63px */
	margin: 0 0 0 8px;
	background-image: url(../images-design/ft3.jpg);
	background-position: left top;
	background-repeat: repeat-y;
}
#ft4 {
	height: 8px;
	font-size: 8px; line-height: 8px;
	background-color: #6B4866;
}
#ft4l, #ft4r { /* Left and right corners at bottom of footer */
	position: absolute;
	margin: 0; border: 0; padding: 0;
	width: 22px;
	height: 18px;
	top: -10px;
	left: 0;
	background-image: url(../images-design/ft4l.jpg);
	background-position: left top;
	background-repeat: no-repeat;
}
#ft4r {
	left: 946px;
	background-image: url(../images-design/ft4r.jpg);
}
/* MCSR and SCRC logos in footer */
#ft-mcsr, #ft-scrc {
	position: absolute;
	margin: 0; border: 0; padding: 0;
}
#ft-mcsr { /* MCSR logo within #ft1 */
	width: 80px;
	height: 80px;
	top: 12px;
	left: 35px;
}

#ft-scrc { /* SCRC logo within #ft3 */
	top: 11px;
	left: 750px;
	width: 190px;
	height: 44px;
	background: 0 0 url(../images-design/scrc-logo.gif);
}

/* Key phrase list in footer */
#ft-menu {
	position: absolute;
	top: 7px;
	left: 65px; /* Original 155px */
	width: 660px;
	margin: 0; padding: 0;
	text-align: center;
	font-size: 12px;
}

/* Popup menu in footer */
#navfooter	/* This is the ID of the top level list i.e. the horizontal one */
{
	padding: 0; margin: 0;
	text-align: center;
}

#navfooter li
{
	float: left;			/* Make list horizontal */	
	position: relative;
	list-style: none;		/* Remove bullets */
	width: 120px;			/* Define column widths */
	padding: 8px 4px;	/* Space around list items in vertical column */
}

#navfooter ul 
{
	padding: 0;
	margin: 0;
	display: none;
	position: absolute; 
	bottom: 32px;	/* Space between bottom of vert col and horizontal col. Cannot be > 32px */
	left: 0;
	background-color: #FDFDCB;
	background-image: url(../images-design/navfooter.jpg);
	background-position: left top;
	background-repeat: repeat-y;
	border: 1px solid #443B2A;
}

/* Adjustment for IE - Cannot be > 3.2em to work in IE
* html #navfooter ul  {	bottom: 3.2em;}  */

#navfooter li > ul {top: auto;}

#navfooter li:hover ul {display: block;}
#navfooter a {
	text-decoration: none;
	color: #8F722C;
	font-weight: normal;
}
#navfooter a:hover {color: #DFA10D;}

/* Quick links in right hand menu */
#ql-wpr { /* Quick links wrapper */
	position: absolute;
	margin: 0; border: 0; padding: 0;
	top: 229px;
	left: 789px;
	width: 170px;
}

.ql-box {/* Quick link box */
	position: relative;
	margin: 0; border: 0; padding: 0;
	width: 170px;
	background-image: url(../images-design/ql-hd-wt.jpg);
	background-position: left top;
	background-repeat: no-repeat;
}

.ql-hd-wt {/* Quick links Wildlife trail heading */
	height: 40px;
	background-image: url(../images-design/ql-hd-wt.jpg);
}

.ql-rbbs {/* Quick links Red bellied black snake */
	margin-top: 7px;
	height: 148px;
	background-image: url(../images-design/ql-rbbs.jpg);
}

.ql-tl {/* Quick link titles */
	position: absolute;
	margin: 0; border: 0; padding: 0;
}

.ql-rbbs-tl {/* title position */
	left: 31px; top: 15px;
	width: 83px; height: 28px;
}

p.ql-txt {/* Quick link text */
	position: absolute;
	margin: 0; border: 0; padding: 0;
	font-size: 12px;
	line-height: 12px;
	color: #000000;
}
p.ql-txt a {text-decoration: none;}
p.ql-txt a:hover {color: #986806}

p.ql-rbbs-txt {/* text */
	left: 31px; top: 48px;
}

/* Imperial fruit moth */
.ql-ifm {
	margin-top: 7px;
	height: 163px;
	background-image: url(../images-design/ql-ifm.jpg);
}
.ql-ifm-tl {
	left: 28px; top: 15px;
	width: 98px; height: 26px;
}
p.ql-ifm-txt {left: 29px; top: 45px;}

/* Pademelon */
.ql-p {
	margin-top: 10px;
	height: 157px;
	background-image: url(../images-design/ql-p.jpg);
}
.ql-p-tl {
	left: 28px; top: 16px;
	width: 70px; height: 13px;
}
p.ql-p-txt {
	left: 59px; top: 33px;
}

/* Mountain Crayfish */
.ql-mc {
	margin-top: 7px;
	height: 153px;
	background-image: url(../images-design/ql-mc.jpg);
}
.ql-mc-tl {
	left: 24px; top: 18px;
	width: 125px; height: 13px;
	/*background-color: yellow;*/
}
p.ql-mc-txt {left: 59px; top: 37px;}

/* Gaint Barred Frog */
.ql-gbf {
	margin-top: 0;
	height: 175px;
	background-image: url(../images-design/ql-gbf.jpg);
}
.ql-gbf-tl {
	left: 28px; top: 14px;
	width: 89px; height: 27px;
}
p.ql-gbf-txt {left: 28px; top: 45px;}

/* Brush Turkey */
.ql-bt {
	margin-top: 0;
	height: 171px;
	background-image: url(../images-design/ql-bt.jpg);
}
.ql-bt-tl {
	left: 28px; top: 14px;
	width: 92px; height: 15px;
	/*background-color: yellow;*/
}
p.ql-bt-txt {left: 58px; top: 33px;}

/* Angle Header Dragon */
.ql-ahd {
	margin-top: 7px;
	height: 155px;
	background-image: url(../images-design/ql-ahd.jpg);
}
.ql-ahd-tl {
	left: 26px; top: 14px;
	width: 94px; height: 28px;
	/*background-color: yellow;*/
}
p.ql-ahd-txt {left: 71px; top: 41px;}

/* Rufous Fantail */
.ql-rf {
	margin-top: 7px;
	height: 158px;
	background-image: url(../images-design/ql-rf.jpg);
}
.ql-rf-tl {
	left: 28px; top: 19px;
	width: 97px; height: 14px;
	/*background-color: yellow;*/
}
p.ql-rf-txt {left: 28px; top: 38px;}

/* Marbled Frogmouth */
.ql-mf {
	margin-top: 10px;
	height: 150px;
	background-image: url(../images-design/ql-mf.jpg);
}
.ql-mf-tl {
	left: 75px; top: 13px;
	width: 72px; height: 28px;
}
p.ql-mf-txt {left: 92px; top: 46px;}


#content {
	position: relative;	
	width: 610px; /* 789 - 179 */
	height: 570px;	/* IE takes this as the height and then incorrectly re-sizes if required */
	text-align: left;
	margin: 15px 0 10px 179px; /* margin at bottom is distance between end of content and footer */
	border: 0; padding: 0;
}
/* Standards compliant browsers recognise this height setting */
html>body div#content {
  height: auto; 
  min-height: 570px; /* 500 = height of #ql */
}

/* Add right padding and a bit of space between points in lists within the content area */
#content ol, #content ul {padding-right: 10px;}
#content li {margin-bottom: 0.5em;}

p {
	text-align: left;
	font-size: 14px; 
	line-height: 18px;
	margin: 0;
	border: 0;
	padding: 14px 10px 0 25px;
}

/* Standard headings */

h1, h2, h3, .h1, .h2, .h3 {
	font-weight: bold;
	margin: 0;
	border: 0;
	padding: 14px 2px 0 20px;
}


h1, .h1 {
	color: #336600;
	font-size: 24px;
	line-height: 26px;
}

h2, .h2 {
	color: #333333;
	font-size: 20px;
	line-height: 22px;
}

h3, .h3 {
	color: #333333;
	font-size: 16px;
	line-height: 18px;
}

/* Remove bold font weight - used for dates within headings for the dynamically generated list of news items */
.nobold {font-weight: normal;}

/* h2 heading that is a link - used for list of news items */
h2 a {color: #360F2E;}
h2 a, h2 a:hover {text-decoration: none;}


table {margin: 10px 0 0 25px;}

hr {
	color: #CCCCCC;
	/*background-color: #CCCCCC; This is set in templatestyle.css so it does not appear as a 1 char high solid line in the webeditor */
	height: 1px;
	margin: 10px;
}

/* Additional styles available from Websiter editor */
.underline {text-decoration: underline;}
.centrealign {text-align: center;}
.rightalign {text-align: right;}

/* Purple box with white text - can be applied to p tags */
.purplebox {
	padding: 10px;
	margin: 10px;
	font-size: 14px; 
	line-height: 20px;
	color: #FFFFFF;
	background-color: #6B4866;
}


/* Image styles */
img.right {
	background: #FFFFFF;
	margin-left: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
	float: right;
	border: 1px solid #000000;
}

img.left {
	background: #FFFFFF;
	margin-right: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
	float: left;
	border: 1px solid #000000;
}

/* Class to hide images so they can be pre-loaded. Can be used to hide any object */
.hdn {display: none;}

img {
	background-position: center;
	vertical-align: middle;
}

/* Basic links */
a {
	color: #532E4D;
	text-decoration: underline;
    font-weight: bold;
}
a:hover {
	color: #6B4866;
	text-decoration: underline;
}
/*a:visited {color: #532E4D;}*/

/* Footer links */
#ft2 a {color: #EFE8B2; font-weight: normal;}
#ft2 a:hover {color: #FFFFCD; font-weight: normal;}

#ft2 a.txt, #ft2 a.txt:hover { /* Normal text credit link */
	color: #EFE8B2;
	text-decoration: none;
    font-weight: normal;
}

/* The following code sets menu position, basic display and sub menu pop ups */

/* Remove menu indents */
#navpanel {
	position: absolute;
	left: 8px;
	top: 284px;
	width: 171px;
	height: 260px; /* IE5/6 takes this as the height and then incorrectly re-sizes if required */
	margin: 0; border: 0; padding: 0;
	z-index: 500; /* Required in IE to make pop-out appear over footer, in Mozilla the z-index set on '#navpanel ul' is sufficient */

}

/* Standards compliant browsers recognise this height setting */
html>body div#navpanel {
  height: auto; 
  min-height: 260px;
}

/* Remove list bullets */
#navpanel li {
	list-style-type: none;
	background-image: url(../images-design/nav-top-bg.gif);	/* Line for bottom border */
	background-repeat: no-repeat;
	background-position: bottom left;
}

/* Remove sub-list indents */
#navpanel ul {
	margin: 0; border: 0; padding: 0;
	width: 171px;	/* Set width of all menu levels. To specifiy a different width at lower levels define for ul ul, ul ul ul, etc */
	z-index: 500;
}

/* Fix position of menu list */
#navpanel li {position: relative;}

/* Fix position of sub-menus */
#navpanel ul ul {
	position: absolute;
	top: 0;
	left: 100%;
}

/* Hide sub menus by default */
#navpanel ul ul {display: none;}
#navpanel ul ul ul {display: none;}
#navpanel ul li:hover ul ul {display: none;}
#navpanel ul li:hover ul ul ul {display: none;}

/* Show submenus on rollover */
#navpanel ul li:hover ul {display: block;}
#navpanel ul ul li:hover ul {display: block;}
#navpanel ul ul ul li:hover ul {display: block;}

/* The following code controls the colour of menu options and
sets menu link display default and
sets menu link font colour on hover */
#navpanel ul a:hover, #navpanel ul a:active {
	display: block;
	color: #FFFFFF;
}
	
#navpanel ul a { /* Note ul a:visited is not styled here to be the same as 'ul a' because a Firefox bug then prevents a:hover from working */
	display: block;
	color: #A988A5;
	font-size: 12px;
	text-decoration: none;
	font-weight: normal;
	margin: 0; border: 0;
	padding: 8px 1px 8px 24px;
	background-image: url(../images-design/nav-blt.jpg);
	background-repeat: no-repeat;
	background-position: 4px center;
}
#navpanel ul a:hover {background-image: url(../images-design/nav-blt-hvr.jpg);}

/* Add bottom border to top level menu options */
/* #navpanel ul li {border-bottom: 1px solid #42BDF6;} */

/* Remove border from sub level menu options */
#navpanel ul ul li, #navpanel ul ul ul li {border: 0;}


/* Set sub-menu display properties default */
#navpanel ul ul a {
	display: block;
	color: #2F0C2A;
    background-color: #BDADBA;
	/* border: 1px solid #CCCCCC; */
	margin: 0; border: 0;
	padding: 8px 1px 8px 14px;
	background-image: url(../images-design/nav-sub-bg.gif);	/* Line for bottom border */
	background-repeat: repeat-x;
	background-position: bottom left;
}
	
/* Set sub-menu 1 font colour on hover */
#navpanel ul ul a:hover, #navpanel ul ul a:active {
	color: #FFFFFF;
	background-color: #6B4866;
	background-image: none;
}

/* Set sub-menu 2 font colour default */
#navpanel ul ul ul a {
	color: #2F0C2A;
	background-color: #8EB9A5;
	/* border: 1px solid #CCCCCC; */
}

/* Set sub-menu 2 font colour on hover */
#navpanel ul ul ul a:hover, #navpanel ul ul ul a:active {
	color: #FFFFFF;
	background-color: #006634;
}

/* Set sub-menu 3 */
#navpanel ul ul ul ul a {
	color: #054F4F;
	background-color: #95B7B9;
}

/* Set sub-menu 3 on hover */
#navpanel ul ul ul ul a:hover, #navpanel ul ul ul ul a:active {
	color: #FFFFFF;
	background-color: #086A6B;
}

#nav div.spacer { /* IE8 fix to force p to clear #nav ul, Not required for IE6,7, Opera, Mozilla, Chrome or Opera */
	clear: both; height: 1px; font-size: 1px; line-height: 1px;
}

#navpanel p {
	text-align: left;
	font-size: 13px; 
	line-height: 16px;
	color: #FFEFFD;
	margin: 0;
	border: 0;
	padding: 20px 0 0 14px;
}

#navpanel p.tel {
	font-size: 18px; 
	line-height: 20px;
	margin: 20px 0 0 14px;
	border: 0;
	padding: 0 0 0 26px;
	background-image: url(../images-design/nav-tel.jpg);
	background-repeat: no-repeat;
	background-position: 0 center;
}

#navpanel p.map {padding: 10px 0 0 14px;}
#navpanel p a {color: #FFEFFD; font-weight: normal;}
#navpanel p a:hover {color: #FFFEDF;}


/* CSS to replace tables - used for web enquiry forms */

/* The div with class tbl-out centres correctly in standards compliant browsers (as left and right margin set to auto). IE doesn't recognise auto. Div (centrefix) fixes this as IE incorrectly centres an element with text-align:center; */
.centrefix {text-align: center;} 

/* Width and margin set on a containing table wrapper (tbl-out) and not inner table div (tbl-in) to fix the IE width bug */
.tbl-out {
	width: 550px; 
	margin: 0 auto;
	border: 0;
	padding: 0;
	text-align: left;
}

.tbl-in {
	margin: 0;
	border: 1px solid #FFEFFE;
	padding: 5px;
	background-color: #EFE0EE;
}

div.row {
  clear: both;
  margin: 0; border: 0; padding: 0;
}
/* Standards compliant browsers don't add their own spacing so need top padding */
html>body div.row {padding: 2px 0 0 0;}

div.half-space, div.space {
  clear: both;
  height: 6px;
  line-height: 6px;
  margin: 0; border: 0; padding: 0;
}
div.space {height: 12px; line-height: 12px;}

div.row label {
	float: left;
	width: 207px;
	text-align: right;
	font-size: 14px; 
	line-height: 18px;
	margin: 2px 0 0 0;
	padding: 0;
}
span.fld label {width: 80px;} /* Email & Phone radio labels */

/* Class fld (field) defines data input fields */
div.row span.fld {
  float: right;
  width: 300px;
  text-align: left;
  margin-right: 2px;	/* Required to stop right side touching the fieldset border in IE */
}

div.row span.fld-full-width {
  float: left;
  width: 520px;
  text-align: left;
  margin: 0;
}

/* The spacer is used to ensure the table-div clears the last field. Note not required if fields are enclosed in a fieldset tag */
div.spacer {
  clear: both;
}

/* Class full (full width) ensures fields fill their containing element */
.full {width: 100%;}

.bld {font-weight: bold;}  /* Set bold text in selects */

fieldset {
	border: 1px solid #FFEFFE;
	padding: 0 8px 10px 5px;	/* Can't add padding to top as IE incorrectly puts this outside the fieldset so have added a bottom margin on the legend */
}

legend {
	border: 1px solid #340C2E;
	padding: 2px 5px;
	margin: 0 0 10px 0;
	font-weight: bold;
	color: #340C2E;
	background-color: #FFEFFE;
}

form {border: 0; margin: 0; padding: 0;}	/* Stops IE adding space around a form */

/* Style for the input boxes */
/* applied only to inputs within div class inputs so does not have to apply to inputs that are buttons (as cannot be undone with a specific input.btn class). */
div.inputs input, div.inputs select, div.inputs textarea {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 18px;
	color: #222222;
	margin: 2px 0 0 0; padding: 0; border: 1px solid #7F9DB9; /* Remove border style to stick with sunken default */
	background-color: #FFFFFF !important;   /* Removes yellow background added by Google toolbar and other browser style sheets */
}

/* Buttons */
input.btn {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 16px; /* Required to vertically centre text in button in IE */
	color: #222222;
	width: 100px;
	margin: 0; padding: 0;
}

#content ul ul, #content ul ul ul, #content ul ul ul ul {margin-top: 8px;} /* Add space before lists for each sub-menu level */

/* News/Event items */
p.news-event-info {
	/* Currently left unstyled, .h2 applied instead */
}

p.news-event-info span.label {
  float: left;
  width: 80px;
  text-align: left;
  margin-right: 10px;
  padding: 0;
}

div.news-event-info-spacer {clear: both; height: 18px;}

/* Remove bold font weight - used for dates within headings for the dynamically generated list of news items */
/*.nobold {font-weight: normal;} - already defined */
h3.news-event a {
	color: #076010;
	font-weight: bold;
	 text-decoration: none;
}
h3.news-event a:hover {color: #9A6600;}

h3.news-event .nobold {
	font-weight: normal;
	font-size: 12px; /* Smaller than h3 */
}
p.news-event-hidden {
	color: red;
	font-weight: bold;
}