/**
 * Generic elements
 */

body
{
	margin: 0;
	padding: 0;
	background: #eff8f2;
	font: .75em/150% Verdana,Helvetica, Arial, sans-serif;
	color: #494949;
}

h1, h2, h3, h4, h5, h6
{
	margin: 0;
	padding: 5px 0 5px 0;
	font-weight: bold;
	font-family: Verdana,Helvetica, Arial, sans-serif;
}

h1 { font-size: 170%; }

h2
{
	font-size: 160%;
	line-height: 130%;
}

h3 { font-size: 140%; }
h4 { font-size: 130%; }
h5 { font-size: 120%; }
h6 { font-size: 110%; }
ul, quote, code, fieldset { margin: .5em 0 0 0; }

p
{
	margin: 0.6em 0 1.2em;
	padding: 0;
}

a:link, a:visited
{
	color: #063;
	text-decoration: none;
}

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

a.active
{
	color: #FC0;
	font-weight: bold;
}

hr
{
	margin: 0;
	padding: 0;
	border: none;
	height: 1px;
	background: #5294c1;
}

ul
{
	margin: 0.5em 0 0 0;
	padding: 0;
}

ul.circle { margin-left: 30px; }
ul li { margin: 0.4em 0 0 .5em; }

ul.menu, .item-list ul
{
	margin: 0.35em 0 0 -0.5em;
	padding: 0;
}

ul.menu ul, .item-list ul ul { margin-left: 0em; }
ul li, ul.menu li, .item-list ul li, li.leaf { margin: 0.15em 0 0.15em .5em; }

ul li, ul.menu li, .item-list ul li, li.leaf
{
	padding: 0 0 0 1.5em;
	list-style-type: none;
	list-style-image: none;
	background: transparent url(images/menu-leaf.gif) no-repeat 1px .35em;
}

ul li.expanded { background: transparent url(images/menu-expanded.gif) no-repeat 1px .35em; }
ul li.collapsed { background: transparent url(images/menu-collapsed.gif) no-repeat 0px .35em; }
ul li.leaf a, ul li.expanded a, ul li.collapsed a { display: block; }
ul.circlde li { margin-left: 337px; }

ul.inline li
{
	background: none;
	margin: 0;
	padding: 0 1em 0 0;
}

fieldset ul.clear-block li
{
	margin: 0;
	padding: 0;
	background-image: none;
}

dl { margin: 0.5em 0 1em 1.5em; }
dl dt { }
dl dd { margin: 0 0 .5em 1.5em; }
img, a img { border: none; }

table
{
	margin: 0;
	width: 100%;
	border: 0px solid red;
}

table .tab { font-family: Arial, Helvetica; }
td, th { padding: 0; }

/**
 * Layout
 */

#header-region
{
	min-height: 1em;
	background: #d2e6f3 url(images/bg-navigation.png) repeat-x 50% 100%;
}

#header-region .block
{
	display: block;
	margin: 0 1em;
}

#header-region .block-region
{
	display: block;
	margin: 0 0.5em 1em;
	padding: 0.5em;
	position: relative;
	top: 0.5em;
}

#header-region *
{
	display: inline;
	line-height: 1.5em;
	margin-top: 0;
	margin-bottom: 0;
}

#header-region p, #header-region img { margin-top: 0.5em; }
#header-region h2 { margin: 0 1em 0 0; }

#header-region h3, #header-region label, #header-region li
{
	margin: 0 1em;
	padding: 0;
	background: none;
}

#wrapper { background: #eff8f2 url(images/body.png) repeat-x 50% 0; }

#wrapper #container
{
	margin: 0 auto;
	padding: 0 20px 0 20px;
	max-width: 1270px;
	border: 1px solid red;
	background-image: url(images/bg-top.png);
	background-repeat: no-repeat;
	background-position: left top;
}

#wrapper #container #header
{
	height: 89px;
	border: 0px solid red;
}

#wrapper #container #header #logo-floater { position: absolute; }

#wrapper #container #header h1, #wrapper #container #header h1 a:link, #wrapper #container #header h1 a:visited
{
	line-height: 94px;
	position: relative;
	z-index: 2;
	white-space: nowrap;
}

#wrapper #container #header h1 span { font-weight: bold; }

#wrapper #container #header h1 img
{
	position: absolute;
	padding-top: 0;
	padding-right: 0;
	float: left;
	z-index: -3;
	margin-left: -20px;
}

/* We must define 100% width to avoid the body being too narrow for near-empty pages */
#wrapper #container #center
{
	float: left;
	width: 100%;
}

/* Now we add the backgrounds for the main content shading */
#wrapper #container #center #squeeze
{
	position: relative;
	background-color: white;
	background-image: url(images/bg-content.png);
	background-repeat: repeat-x;
	background-position: 50% top;
}

#wrapper #container #center .right-corner
{
	position: relative;
	left: 10px;
	background-image: url(images/bg-content-right.png);
	background-repeat: no-repeat;
	background-position: 100% top;
}

#wrapper #container #center .right-corner .left-corner
{
	padding: 60px 25px 0 35px;
	margin-left: -10px;
	position: relative;
	left: -10px;
	min-height: 400px;
	border: 0px solid blue;
	background-image: url(images/bg-content-left.png);
	background-repeat: no-repeat;
	background-position: 0 top;
	width: 850px;
}

#wrapper #container #footer
{
	float: none;
	margin: 10px 0 0 0;
	clear: both;
	text-align: right;
	padding: 5px 2px 5px 0;
	color: #9c9;
	border-color: #9c9;
	border-width: 1px 0 0 0;
	border-style: solid;
}

#wrapper #container .breadcrumb
{
	position: absolute;
	top: 0px;
	left: 35px;
	z-index: 3;
	border: 0px solid red;
	padding-bottom: 0;
	margin-bottom: 0;
	width: 860px;
}

/**
 * Header
 */

#wrapper #container #header h1, #wrapper #container #header h1 a:link, #wrapper #container #header h1 a:visited
{
	color: #fff;
	font-weight: bold;
	font-family: "Times New Roman";
	font-style: italic;
	text-shadow: #063 0px 1px 3px;
	padding-top: 0;
	margin-top: 0;
	font-size: 1.75em;
}

/*#wrapper {border:1px solid red}
#container {border:1px solid blue}
#squeeze {border:1px solid green}
.left-corner {border:1px solid green}
.right-corner {border:1px solid green}
#main {border:1px solid green}
*/

#wrapper #container #header h1 a:hover { text-decoration: none; }
#wrapper #container .breadcrumb { font-size: 1em; }
#wrapper #container .breadcrumb, #wrapper #container .breadcrumb a { color: #063; }
#wrapper #container .breadcrumb a:hover, #wrapper #container .breadcrumb a.active { color: #909; }

/**
 * Primary navigation
 */

ul.primary-links
{
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 4;
}

ul.primary-links li
{
	margin: 0;
	padding: 0;
	float: left;
	background-image: none;
	border: 0px solid red;
	text-align: center;
}

ul.primary-links li a, ul.primary-links li a:link, ul.primary-links li a:visited
{
	display: block;
	margin: 0 5px 0 5px;
	padding: 10px 0 0 0;
	color: #fff;
	background: transparent url(images/bg-navigation-item.png) no-repeat 50% 0;
}

ul.primary-links li a:hover, ul.primary-links li a.active
{
	color: #909;
	background: transparent url(images/bg-navigation-item-hover.png) no-repeat 50% 0;
}

/**
 * Local tasks
 */

ul.primary, ul.primary li
{
	border: 0;
	background: none;
	margin: 0;
	padding: 0;
}

ul.primary { padding: 0.5em 0 10px; }

ul.primary li a, ul.primary li.active a, ul.primary li a:hover, ul.primary li a:visited
{
	border: 0;
	background: transparent;
	padding: 4px 5px 4px 5px;
	margin: 0 0 0 1px;
	height: auto;
	text-decoration: none;
	position: relative;
	top: -1px;
}

ul.primary li.active a, ul.primary li.active a:link, ul.primary li.active a:visited, ul.primary li a:hover
{
	background: url(images/bg-tab.png) repeat-x 0 50%;
	color: #fff;
}

ul.primary li.active a { font-weight: bold; }

ul.links li, ul.inline li
{
	margin-left: 0;
	margin-right: 0;
	background-image: none;
	padding: 0 5px 0 0;
}

.node .links, .comment .links { text-align: left; }
.node .links ul.links li, .comment .links ul.links li { }

.terms ul.links li
{
	margin-left: 0;
	margin-right: 0;
	padding-right: 0;
	padding-left: 1em;
}

.picture, .comment .submitted
{
	float: right;
	clear: right;
	padding-left: 1em;
}

.new
{
	color: #ffae00;
	font-size: 0.92em;
	font-weight: bold;
	float: right;
}

.terms { float: right; }
.indented { margin-left: 25px; }
.node .content, .comment .content { margin: 0.6em 0; }

/**
 * CSS support
 */

span.clear
{
	display: block;
	clear: both;
	height: 1px;
	line-height: 0px;
	font-size: 0px;
	margin-bottom: -1px;
}

body #wrapper #container
{
	width: 900px;
	border: 0px solid blue;
	background-image: url(images/logo.png);
	background-repeat: no-repeat;
	background-position: center top;
}

tr.tab td.left
{
	background-image: url(images/dot.gif);
	background-repeat: repeat-x;
	background-position: right bottom;
}

td { vertical-align: top; }

td.left
{
	text-align: left;
	vertical-align: bottom;
	padding: 0;
}

td.right
{
	text-align: right;
	padding: 0;
	margin: 1px;
	width: 107px;
	vertical-align: bottom;
	height: 26px;
}

.button
{
	width: 50px;
	height: 22px;
	padding: 0px;
	margin-bottom: -5px;
	line-height: 10px;
	background-color: #FFF;
	border: 0;
}

.fill { background-color: #FFFFFF; }
.padright { padding: 0 5px 0 0; }
.padleft { padding: 0 0 0 5px; }

/* colours */
.darkblue, .submenu .darkblue { color: #246; }
.green , .submenu .green { color: #063; }
.white { color: white; }
.magenta { color: #909; }
.cyan { color: #007CCC; }
.orange , .submenu .orange, a.orange { color: #e82; }
.red, .submenu .red, a.red { color: #900; }
.blue , .submenu .blue { color: #009; }
.gray { color: gray; }

h4
{
	font-size: 1.5em;
	font-weight: bold;
}

.top { vertical-align: top; }
.btm { vertical-align: bottom; }
.centertext { text-align: center; }
.overlap { margin-right: -40px; }

.clear-block:after
{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clear-block { display: inline-block; }

/* Hides from IE-mac \*/
* html .clear-block { height: 1%; }
.clear-block { display: block; }

/* End hide from IE-mac */
.link
{
	background-image: url(images/links/dropshadow.gif);
	background-repeat: no-repeat;
	background-position: left top;
	text-align: left;
	padding: 0 10px 10px 0;
}

.fr { float: right; }
.fl { float: left; }
.padleft20 { padding-left: 20px; }
.absmiddle { vertical-align: middle; }
.padright20 { padding-right: 20px; }

#wrapper #container .submenu
{
	clear: both;
	font-size: 1em;
	text-align: center;
	width: 850px;
	color: #999;
	border-color: #FFF #FFF #9c9 #FFF;
	border-width: 0 0 1px 0;
	border-style: solid;
	margin: 0 auto 0 auto;
	padding: 7px 0 3px 0;
}

/* set default sizes for primary links */
li.home a { width: 50px; }
li.whatsnew a { width: 105px; }
li.footprint a { width: 120px; }
li.NCN a { width: 190px; }
li.orienteer a { width: 130px; }
li.samples a { width: 105px; }
li.weblinks a { width: 50px; }

td.fixed
{
	width: 150px;
	border: 0px solid red;
	padding: 5px 10px 5px 10px;
	text-align: center;
}

.clr { clear: both; }

.divider
{
	width: 411px;
	height: 8px;
}

.textright { text-align: right; }
.textleft { text-align: left; }
.smaller { font-size: smaller; }

td.third
{
	width: 33%;
	border: 0px solid red;
}

.textcenter { text-align: center; }

.cover
{
	vertical-align: top;
	border: 0px solid red;
	padding: 0 10px 0 10px;
}

.route
{
	vertical-align: top;
	border: 0px solid green;
}

.center
{
	float: right;
	margin-top: -5px;
	border: 0px solid red;
}

.short
{
	border: 0px solid blue;
	margin-top: 30px;
	color: black;
	clear: both;
}

.posrel
{
	position: absolute;
	top: 300px;
	right: 30px;
}

.frontleft
{
	width: 500px;
	border: 0px solid red;
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 4;
	overflow: visible;
	visibility: visible;
}

.frontright
{
	width: 300px;
	float: right;
	border: 0px solid red;
	margin: 0;
	padding: 0 0 0 40px;
	position: relative;
	z-index: 5;
	overflow: visible;
	visibility: visible;
}