/* (c)2008. All rights reserved. */

/* definitions for general look and layout */
html
{	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
}

body
{	position: relative;
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	font-family: Verdana, Arial, sans-serif;
	font-size: 11px;
	line-height: 16px;
	text-align: left;
	color: #6D6E70;
}
body.colour1 {background-color: #00AEEF;}
body.colour2 {background-color: #6DB33F;}
body.colour3 {background-color: #EC008C;}
body.colour4 {background-color: #7581BF;}
body.colour5 {background-color: #F78F1E;}

a {text-decoration: none;}
a:hover {text-decoration: underline;}

h1 {font-size: 18px; line-height: 20px; font-weight: normal; color: #00AEEF; margin: 0px 0px 6px 0px;}
h1 a {color: #00AEEF;}
h3, h4 {font-size: 13px; line-height: 15px; font-weight: bold; color: #6D6E70; margin: 0px 0px 6px 0px;}
h3 em {font-weight: normal;}
h3 a, h4 a {color: #00AEEF;}
h4 {font-weight: normal;}
p {margin: 0px 0px 16px 0px;}
p a {font-weight: bold; color: #00AEEF;}

img {display: block; border: 0px;}
table {width: 100%; border: 0px; padding: 0px;}

strong {font-weight: bold;}
small {font-size: 80%;}
em {font-style: italic;}

.floatLeft {float: left;}
.floatRight {float: right;}
.floatLeftMargin {float: left; margin-right: 10px;}
.floatRightMargin {float: right; margin-left: 10px;}

#introMovie {width: 100%; height: 100%;}
#introText {text-align: center;}

#page {position: relative; width: 100%; height: 100%; vertical-align: middle;}

.columnLeft {float: left;}
.columnRight {float: right;}
.fullColumn {width: 100%; clear: both;}
.splitColumn {}
.splitColumn.columnLeft {width: 50%;}
.splitColumn.columnRight {width: 47%;}

.content
{	position: relative;
	width: 680px;
	height: 810px;
	padding: 0px 65px 0px 215px;
	margin: auto;
	background-color: #FFFFFF;
}
#spdLogo {position: absolute; top: 160px; left: 53px;}

.header
{	position: relative;
	height: 310px;
}
#homepage .header {height: 240px;}

.main
{	position: relative;
	height: 390px;
	padding: 0px 0px 0px 137px;
}
#homepage .main {height: 460px;}

.footer
{	position: relative;
	height: 90px;
	padding: 10px 0px 0px 137px;
}
.footer img {float: left;}
.footer p {font-size: 10px;}

.menu
{	position: absolute; top: 0px; left: 0px;
	z-index: 2;
	width: 128px;
	margin: 0px;
	padding: 5px 0px 10px 0px;
	font-size: 12px;
}
.menu li {margin: -1px 0px 16px 20px;}
.menu li.colour1 {list-style-image: url(resources/navDotBlue.gif);}
.menu li.colour2 {list-style-image: url(resources/navDotGreen.gif);}
.menu li.colour3 {list-style-image: url(resources/navDotPink.gif);}
.menu li.colour4 {list-style-image: url(resources/navDotPurple.gif);}
.menu li.colour5 {list-style-image: url(resources/navDotOrange.gif);}

.menu li a
{	display: block;
	margin: 0px;
	padding: 0px 0px 0px 0px;
	color: #6D6E70;
	text-transform: capitalize;
	text-decoration: none;
	white-space: nowrap;
	height:17px; /* overflow:hidden; */
	line-height: 1.2em;
	/* text-align: absmiddle; */
}
.menu li a.selected, .menu li a:hover {font-weight: bold; text-decoration: none;}

.subMenu
{	list-style-type: none;
	list-style-image: none;
	margin: 12px 0px 0px 0px;
	padding: 0px;
}
.subMenu li {position: relative; margin: 0px 0px 16px 0px;}
.subMenu li a {white-space: normal; text-transform: none;}

.scrollBox {position: relative; width: 520px; height: 100%; padding: 0px 20px 0px 0px;}
#homepage .scrollBox {height: 240px;}

.imagePanel
{	position: absolute; top: 160px; left: 0px;
	width: 680px;
}
#homepage .imagePanel {top: 260px;}

.imagePanel img
{	position: relative;
	float: left;
	width: 128px;
	height: 74px;
	margin: 0px 10px 0px 0px;
	background-color: #EEEEEE;
	border-top-width: 16px;
	border-top-style: solid;
	border-top-color: #FFFFFF;
}
.imagePanel img.last {margin-right: 0px;}
.imagePanel img.colour1 {border-top-color: #00AEEF;}
.imagePanel img.colour2 {border-top-color: #6DB33F;}
.imagePanel img.colour3 {border-top-color: #EC008C;}
.imagePanel img.colour4 {border-top-color: #7581BF;}
.imagePanel img.colour5 {border-top-color: #F78F1E;}

.pageImage {position: absolute; bottom: 150px; right: -27px; width: 400px; /* height: 160px; */}
#homepage .pageImage {bottom: 80px;}

.pageTitle {position: absolute; top: 265px; left: 137px;}
#homepage .pageTitle {top: 160px; left: 0px;}

.contentList li a {font-weight: bold; color: #6D6E70;}
.contentList li a:hover {text-decoration: underline;}

.staticMap
{	margin: 20px 0px 0px 0px;
	border: 1px solid #000000;
}

/* debug code */
/*
.content {border: 1px solid red;}
.header {border: 1px solid green;}
.main {border: 1px solid blue;}
.footer {border: 1px solid #FF9900;}
.scrollBox {border: 1px solid pink;}
*/
