﻿/* standard.css */

/* Set the main font */
* {
	font-family: Arial, Helvetica, sans-serif;
}

/* Set main blue/wave background */
body {
	background: #D8F2F3 url(images/main_background.gif) center 120px repeat-x;
}

/**********************************/
/* ACCESSIBILITY */
/* Position the box and set borders and background */
#accessibility {
	position: absolute;
	display: block;
	
	top: -22px;
	right: -2px;
	
	height: 18px;
	
	text-align: center;
	
	border: solid #000000 2px;
	background: #FFFFFF;
}

/* Style the link and its rollover */
#accessibility a {
	display: block;
	margin: 0px 2px 2px 2px;
	vertical-align: center;
	
	color: #000000;
	font-size: 10pt;
	text-decoration: none;
}

#accessibility a:hover {
	color: #CC0000;
	text-decoration: underline;
}

/**********************************/
/* PAGE */
/* Position the page and set the borders. Set the blue left ahnd bar background too. */
#page {
	position: absolute;
	display: block;
	
	left: 50%;
	margin: 60px 0px 0px -370px;
	padding: 0px;
	
	background: #FFFFFF url(images/bar_background.gif) top left repeat-y;
	border: solid #000000 2px;
}

/* Set the size etc of the page and set the checkered background */
#innerPage {
	width: 740px;
	
	padding: 0px 0px 30px 0px;
	margin: 0px;
	
	height: 300px;
	min-height: 300px;
	
	background: url(images/checkered_background.gif) bottom left repeat-x;
}

#page>#innerPage {
	heigh\t: auto;
}

/**********************************/
/* LOGO */
/* Position the header */
#header {
	position: absolute;
	
	top: 0px;
	left: 0px;
}

/* Replace the text with the image and remove all extra padding etc */
#header h1 {
	display: block;
	
	padding: 0px;
	margin: 0px;
	
	width: 120px;
	height: 155px;
	
	background: url(images/logo.gif) top left no-repeat;
}

#header h1 span {
	display: none;
}

/**********************************/
/* MENU */
/* Position the menu */
#menu {
	position: absolute;
	display: block;
	
	top: 5px;
	left: 130px;
	
	width: 530px;
	height: 25px;
}

/* Remove extra padding and add margins to the menu */
#menu ul {
	padding: 0px;
	margin: 0px;
}

/* Put the menu itmes into a line and remove bullet styling and padding */
#menu ul li {
	float: left;
	
	list-style: none;
	
	padding: 0px;
	margin: 0px;
}

/* Keep menu items in a line - set height and set font styles - set standard right padding*/
#menu ul li a {
	display: block;
	
	float: left;
	padding: 0px 25px 0px 0px;
	height: 15px;
	
	font-size: 9pt;
	font-weight: bold;
	
	color: #000000;
	text-decoration: none;
}

/* Add specific left padding and background for active and inactive links */
#menu ul li.active a {
	padding-left: 22px;
	background: url(images/menu/active.gif) center left no-repeat;
}

#menu ul li.inactive a {
	padding-left: 12px;
	background: url(images/menu/inactive.gif) top left no-repeat;
}

/* Make the rollover effect for inactive links */
#menu ul li.inactive a:hover {
	background-position: left -15px;
}

/**********************************/
/* CONTENT Layout */
/* Position the header and set standard font size */
#content {
	margin: 40px 0px 0px 125px;
	font-size: 10pt;
}

#content a {
	color: #728CAA;
	text-decoration: underline;
}

#content a:hover {
	color: #000000;
}

/**********************************/
/* GALLERY Layout */
/* Position the main image area */
#imageGallery {
	height: 300px;
	margin: 5px 5px 0px 35px;
}

#imageGallery #galleryMain {
	width: 350px;
	margin: 0px 5px 0px 0px;
}

#imageGallery .extraTop {
	padding-top: 15px;
}

#imageGallery .galleryMenu {
	float: right;
	margin: 2px 2px 2px 0px;
	width: 150px;
	height: 260px;
}

#imageGallery > .galleryMenu {
	min-heigh\t: 260px;
	heigh\t: auto;
}

#imageGallery .galleryMenu a img {
	display: none;
	margin: 2px 0px 0px 0px;
	padding: 0px;
}

#imageGallery .galleryMenu a {
	display: block;
	width: 150px;
	height: 30px;
	margin: 2px 0px 0px 0px;
	padding: 0px;
}

/******************************/
/* GALLERY Menu continued */
/* Individual image replcement */

#imageGallery .galleryMenu a.img001 {
	background: url(images/gallery/thumbs/001.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img002 {
	background: url(images/gallery/thumbs/002.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img003 {
	background: url(images/gallery/thumbs/003.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img004 {
	background: url(images/gallery/thumbs/004.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img005 {
	background: url(images/gallery/thumbs/005.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img006 {
	background: url(images/gallery/thumbs/006.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img007 {
	background: url(images/gallery/thumbs/007.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img008 {
	background: url(images/gallery/thumbs/008.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img009 {
	background: url(images/gallery/thumbs/009.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img010 {
	background: url(images/gallery/thumbs/010.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img011 {
	background: url(images/gallery/thumbs/011.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img012 {
	background: url(images/gallery/thumbs/012.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img013 {
	background: url(images/gallery/thumbs/013.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img014 {
	background: url(images/gallery/thumbs/014.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img015 {
	background: url(images/gallery/thumbs/015.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img016 {
	background: url(images/gallery/thumbs/016.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.img017 {
	background: url(images/gallery/thumbs/017.jpg) top left no-repeat;
}

#imageGallery .galleryMenu a.active,
#imageGallery .galleryMenu a:hover {
	background-position: 0px -30px;
}