/* ############################################################################
   ##
   ##  Global Website Stylesheet
   ##
   ######################################################################### */

/* ####################################
   HTML Element Styles
   ################################## */

a {
}

	a:link {
	    color: #A7D9F1;
	    text-decoration: none;
	}
	
	a:visited {
	    color: #A7D9F1;
	    text-decoration: none;
	}
	
	a:hover {
	    color: #ffffff;
	    text-decoration: underline;
	}
	
	a:active {
	}

body {
	margin: 0;
	padding: 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 75%;
	background: #001A30 url('/images/templates/bg_body.jpg') repeat-x;
    border-top: #252525 15px solid;
    border-bottom: #252525 5px solid;
}

p {
	margin: 0 0 1.35em 0;
}

h1 {
	margin: 0 0 0.5em 0;
	font-size: 300%;
	font-weight: normal;
}

h2 {
	margin: 0 0 0.5em 0;
	font-size: 225%;
}

h3 {
	margin: 0 0 0.5em 0;
	font-size: 125%;
}

h4 {
	margin: 0 0 0.25em 0;
	font-size: 100%;
}

h5 {
	margin: 0 0 0.5em 0;
	font-size: 100%;
	font-weight: normal;
	font-style: italic;
}

h6 {
	margin: 0 0 0.5em 0;
	font-size: 91.7%;
	font-weight: normal;
	text-decoration: underline;
}

h1 a:link, h1 a:visited,
h2 a:link, h2 a:visited,
h3 a:link, h3 a:visited,
h4 a:link, h4 a:visited,
h5 a:link, h5 a:visited,
h6 a:link, h6 a:visited
{
    color: #000000;
    text-decoration: none;
    border-bottom: #000000 1px solid;
}

h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover
{
    /* Note: Not set on h1 & h2 because the Cufon font handling doesn't allow these effects. */
    color: #ffffff;
    border-bottom: #ffffff 1px solid;
}

ul {
}

ul li {
}

ol {
}

ol li {
}

big {
	font-size: 110%;
}

small {
	font-size: 91.6%;
}

hr {
	width: 100%;
	height: 1px;
	color: #cccccc;
}

img {
}

caption {
	margin: 0;
	font-size: 75%;
	font-weight: bold;
	text-align: left;
}

address {
	margin: 0 0 1.35em 0;
	font-size: 75%;
	font-style: italic;
}

/* ####################################
   Form Styles
   ################################## */

form {
	margin: 0;
}

input {
}

input.blank {
	margin: 0;
	padding: 0;
	background-color: transparent;
	background-image: none;
	border: 0;
}

input.submit {
}

select {
}

textarea {
}

.submitButton {
}

/* ####################################
   Table Styles
   ################################## */

table {
	empty-cells: show;
	border-collapse: collapse;
}

tbody {
}

tr {
}

td {
}

th {
	text-align: left;
	font-weight: bold;
}

/* ####################################
   Page Objects
   ################################## */

#Align {
	border-top: #000F28 1px solid;
	/* Coupled with the margin and text-align settings in page-wrapper-outer (below) this is a weird but safe way to center a page in all browsers including IE where the standard doesn't work. */
	text-align: center;
}

#Template {
	position: relative;
	padding: 0 22px;
	width: 830px;
	background: #0A395D url('/images/templates/bg_page.jpg') no-repeat;
	border-right: #252525 2px solid;
	border-left: #252525 2px solid;
	
	/* To re-align text to left in the page div when a parent div is centred. This allows centering of page div using the IE-safe hack. */
	margin: 0 auto;
	text-align: left;
}

	#TemplateInner {
		position: relative;
	}

#Header {
    position: relative;
    z-index: 1000; /* position: relative and high z-index required so that the menu appears above the page */
}

	#HeaderInner {
	}
	
	#Logo {
	    position: relative;
	    float: left;
	    width: 100%;
	    text-align: center;
	    padding: 3px 0 14px 0;
	}

	#AnchorMenu {
	}
	
		#AnchorMenu a {
		}
		
		#AnchorMenu a:link {
		}
		
		#AnchorMenu a:visited {
		}
	
		#AnchorMenu a:hover {
		}
		
		#AnchorMenu a:active {
		}

	#SiteSearch {
	}

#Content {
    position: relative;
    float: left;
    width: 100%;
	line-height: 150%;
}

	#ContentInner {
	}

	#Content #Primary {
        position: relative;
        float: left;
        clear: both;
        margin-top: 12px;
        padding: 12px;
        width: 790px; /* Page width (830) - padding (12x2) - margin (0) - border (8x2) */
        background: #0293D6;
        border: #ffffff 8px solid;
	}
	
		#Content #PrimaryInner {
		}
	
	#Content #Secondary {
	}

		#Content #SecondaryInner {
		}

#Intro {
}

#Footer {
}
    #FooterInner {
    }

    #FooterContent {
        position: relative;
        float: left;
        padding: 0;
        margin-top: 1.25em;
        width: 100%;
        text-align: center;
        border-top: #2A577D 1px solid;
        border-bottom: #2A577D 1px solid;
    }
    
        #FooterContent ul {
            padding: 0;
            margin: 0;
            list-style: none;
        }
    
            #FooterContent ul li {
                display: inline-block;
                margin: 0;
                padding: 8px 2em;
                list-style: none;
                color: #ffffff;
                font-size: 100%;
                font-family: Century, Times New Roman, Times, Serif;
                text-transform: uppercase;
            }

                #FooterContent ul li a {
                    color: #ffffff;
                    text-decoration: none;
                }

                #FooterContent ul li a:hover {
                    text-decoration: underline;
                }
                
	#Footer #SiteInfo {
	    width: 100%;
	    text-align: center;
	}

		#Footer #SiteInfo #Credits {
		    display: inline-block;
	        padding: 8px 0;
	        color: #ffffff;
	        font-size: 75%;
		}

		    #Footer #SiteInfo #Credits a {
	            color: #ffffff;
		    }

/* ####################################
   Main Menu
   ################################## */

#MainMenu {
    position: relative;
    float: left;
    padding: 0;
    width: 100%;
    text-align: center;
    border-top: #2A577D 1px solid;
    border-bottom: #2A577D 1px solid;
}

/***
 * GLOBAL - List Layout
 */

#MenuUL {
    /* The nav object. (A <ul> in the standard platform.) */
    display: inline-block;
    position: relative; /* DON'T CHANGE - Assures nav container has proper cascading position. */
    margin: 0; /* DON'T CHANGE - Removes margin around the ul for neat layout. */
    padding: 0; /* DON'T CHANGE - Removes padding within the ul for neat layout. */
    
    list-style: none; /* DON'T CHANGE - Removes bullet points from list items. */
    
    font-family: Century, Times New Roman, Times New Roman, Serif;
    text-transform: uppercase;
    text-align: left;
}

#MenuUL li {
    /* All list items within the nav object */
    float: left; /* DON'T CHANGE - This makes the top level horizontal. */
    margin: 0;
    padding: 0 1em;
}
* html #MenuUL li {
    /* IE6 Only */
    width: 10px; /* IE6 needs a width the menu layout breaks. The white-space and padding options below simulate the variable width seen in other browsers but only of the text in the menu items is short enough. */
    white-space: nowrap;
}

    #MenuUL li:hover, #MenuUL li.sfhover {
        /* All list items within the nav object - Hover */
    }

/***
 * GLOBAL - Anchors (Links)
 */

#MenuUL a {
    /* All anchor tags within the nav object */
    display: block; /* DON'T CHANGE - Fills the width of the li with link rollover. */
    padding: 8px;
    color: #ffffff;
    text-decoration: none;
}
* html #MenuUL a {
    /* IE6 Only */
    /* All anchor tags within the nav object */
    width: 100%; /* DON'T CHANGE - Fills the width of the li with link rollover for IE6 (display:block fix). Be careful if margin/padding/border is added. */
}

    #MenuUL a:hover {
        /* All anchor tags within the nav object - Hover */
        background: #001B32;
    }

/***
 * LEVEL 2+ - List Layout
 */

#MenuUL li ul {
    /* Second level lists (all sub lists within list items) */
    position: absolute; /* DON'T CHANGE - Places second level lists in the right spot. */
    left: -100%; /* DON'T CHANGE - Drop-down hover trick - Hide the menu off the screen. */
    
    margin: 0; /* DON'T CHANGE - Removes margin around the ul for neat layout. */
    padding: 0; /* DON'T CHANGE - Removes padding within the ul for neat layout. */
    
    list-style: none; /* DON'T CHANGE - Removes bullet points from list items. */
}

#MenuUL li:hover ul, #MenuUL li li:hover ul, #MenuUL li.sfhover ul, #MenuUL li li.sfhover ul {
    /* Second level lists (all sub lists within list items) - Hover over the containing li */
    left: auto; /* DON'T CHANGE - Drop-down hover trick - Re-align the menu on the screen on rollover. */
}

#MenuUL li ul li {
    /* Second level list items */
    float: none; /* DON'T CHANGE - Makes second level list items vertical. */
    padding: 0;
    margin: 0;
    width: auto;
}
* html #MenuUL li ul li {
    width: 140px; /* Otherwise each li is a different width. */
    white-space: normal; /* Allows menu items to span multiple rows, overridden from first level. */
}

    #MenuUL li ul li:hover, #MenuUL li ul li.sfhover {
        /* Second level list items - Hover */
    }

/***
 * LEVEL 2+ - Anchors (Links)
 */

#MenuUL li ul li a {
    /* Second level list items - Anchor tags */
    padding: 8px;
    background: #003663;
}

    #MenuUL li ul li a:hover {
        /* Second level list items - Anchor tags - Hover */
    }

/***
 * Individual Menu Items
 */

#Menu_Item_58 {
    /* Always "home" in Acuity CMS 3.x */
}

/* ####################################
   MP3 Player
   ################################## */

object#mp3player {
    display: block;
    padding: 6px;
    margin-bottom: 1.25em;
    background-color: #999999;
    border: #787878 1px solid;
}

embed#mp3player {
    padding: 0;
    background-color: transparent;
    border: 0;
}

/* ####################################
   Custom Element Styles
   ################################## */

.big {
	font-size: 116.7%;
}

.small {
	font-size: 75%;
}

.hidden {
	display: none;
}

.date {
	font-size: 91.7%;
	color: #005bb5;
}

.author {
	font-size: 91.7%;
	color: #999999;
}

.paging {
	margin: 0;
}

.pdf {
	display: inline-block;
	height: 16px;
	padding-top: 1px;
	padding-left: 20px;
	text-decoration: none;
	font-weight: bold;
	background-image: url('/images/icons/16x16_pdf.gif');
	background-repeat: no-repeat;
}

	.pdf a {
	}

	.pdf a:visited {
		text-decoration: none;
	}

	.pdf a:hover {
		text-decoration: underline;
	}

	.pdf a small {
		font-weight: normal;
	}

.underlined {
	border-bottom: 1px solid;
}

.galleryLink {
	/* Placeholder for a class name used to help with image galleries. */
}

.validationFailed {
    background: #ecdede;
    border: #cc0000 2px solid;
}

.trailNav {
}

	.trailNav a:link {
	}
	
	.trailNav a:visited {
	}
	
	.trailNav a:hover {
	}
	
	.trailNav a:active {
	}

/* ####################################
   Message Boxes
   ################################## */

ul.warnings {
	margin-top: 0.5em;
	margin-bottom: 1.35em;
	list-style: url('/images/templates/icons/16x16_warning.gif') square;
}

	ul.warnings li {
		margin-bottom: 0.7em;
	}

div.messageError, p.messageError {
	margin: 15px 0; 
	padding: 15px;
	border: 1px solid #EC5F35;
}

	div.messageError h1, div.messageError h2, div.messageError h3, div.messageError h4 {
		font-family: arial, helvetica, sans-serif;
		font-size: 125%;
		font-weight: bold;
		margin-top: 0;
		margin-bottom: 0; 
		padding-bottom: 0; 
		color: #EC5F35;
		border: none;
		background: none;
	}

	div.messageError .code {
		margin-top: 2px; 
		padding-top: 0; 
		font-size: 91.7%; 
		font-weight: bold; 
		color: #EC5F35;
	}

div.messageConfirm, p.messageConfirm {
	margin: 15px 0; 
	padding: 15px;
	border: 1px solid #939f38;
}

	div.messageConfirm h1, div.messageConfirm h2, div.messageConfirm h3, div.messageConfirm h4 {
		font-family: arial, helvetica, sans-serif;
		font-size: 125%;
		font-weight: bold;
		margin-top: 0;
		margin-bottom: 0; 
		padding-bottom: 0; 
		color: #939f38;
		border: none;
		background: none;
	}

div.messageInfo, p.messageInfo {
	margin: 15px 0; 
	padding: 15px;
	border: 1px solid #EC5F35;
}

	div.messageInfo h1, div.messageInfo h2, div.messageInfo h3, div.messageInfo h4 {
		font-family: arial, helvetica, sans-serif;
		font-size: 125%;
		font-weight: bold;
		margin-top: 0;
		margin-bottom: 0; 
		padding-bottom: 0; 
		color: #EC5F35;
		border: none;
		background: none;
	}


