/* ############################################################################
   ##
   ##  Global Website Stylesheet
   ##
   ######################################################################### */

/* ####################################
   HTML Element Styles
   ################################## */

a {
}

	a:link {
	    color: #840056;
	    text-decoration: none;
	}
	
	a:visited {
	    color: #840056;
	    text-decoration: none;
	}
	
	a:hover {
	    color: #b37698;
	    text-decoration: underline;
	}
	
	a:active {
	}

body {
	margin: 0;
	padding: 0;
	color: #63584d;
	font-family: arial, helvetica, sans-serif;
	font-size: 75%;
	background: #564F48 url('/images/templates/bg_page_gradient.jpg') repeat-x;
}

p {
}

h1 {
    position: relative;
    float: left;
    width: 100%;
	margin: 0 0 1em -230px; /* Content padding + ContentInner padding + ContentInner dotted border */
	padding: 18px 0 2px 230px;
	color: #840056;
	font-size: 175%;
	font-weight: normal;
	text-transform: uppercase;
	/* 
	border-bottom: #aaa198 2px dotted;
    */
    background: url('/images/templates/line_dotted_h.gif') left 1.95em repeat-x;
}

h2 {
	margin: 1.5em 0 0.5em 0;
	font-size: 135%;
	font-weight: normal;
	text-transform: uppercase;
}

h3 {
	margin: 1.5em 0 0.5em 0;
	font-size: 115%;
	text-transform: uppercase;
}

h4 {
	margin: 2em 0 0.25em 0;
	font-size: 100%;
}

h5 {
	margin: 2em 0 0.25em 0;
	font-size: 100%;
	font-weight: normal;
	font-style: italic;
}

h6 {
	margin: 2em 0 0.25em 0;
	font-size: 91.7%;
	font-weight: normal;
	text-decoration: underline;
}

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-style: italic;
}

/* ####################################
   Form Styles
   ################################## */

form {
	margin: 0;
}

input {
}

input.blank {
	margin: 0;
	padding: 0;
	background-color: transparent;
	background-image: none;
	border: 0;
}

select {
}

textarea {
}

/* ####################################
   Table Styles
   ################################## */

table {
	empty-cells: show;
	border-collapse: collapse;
}

tbody {
}

tr {
}

td {
}

th {
	text-align: left;
	font-weight: bold;
}

/* ####################################
   Page Objects
   ################################## */

#Align {
	/* 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;
	display: inline-block;
	width: 980px;
	background: #F2F1ED url('/images/templates/bg_page_shape.gif') no-repeat;
	
	/* 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;
		padding-left: 74px;
	}

#Header {
    position: relative;
    z-index: 1000; /* position: relative and high z-index required so that the menu appears above the page */
    margin-top: 1em;
}

	#HeaderInner {
	}
	
	#Logo {
	    position: relative;
	    float: left;
	    margin-top: 115px;
	    margin-left: 2px;
	}
	
	#MainMenu {
	    position: relative;
	    float: left;
	    margin: 183px 0 0 78px;
	}

	#AnchorMenu {
	}
	
		#AnchorMenu a {
		}
		
		#AnchorMenu a:link {
		}
		
		#AnchorMenu a:visited {
		}
	
		#AnchorMenu a:hover {
		}
		
		#AnchorMenu a:active {
		}

	#SiteSearch {
	}

#Content {
    position: relative;
    float: left;
    clear: left;
    margin-top: -11px;
    margin-bottom: 0;
    padding-left: 204px; 
    padding-bottom: 48px;
}

	#ContentInner {
	    position: relative;
	    float: left;
	    padding-left: 24px;
        border-left: #AAA198 2px dotted;
	}

	#Content #Primary {
	    position: relative;
	    float: left;
	    width: 500px;
	}
	
		#Content #PrimaryInner {
		}
	
	#Content #Secondary {
	    position: relative;
	    float: left;
	    margin-left: 64px;
	}

		#Content #SecondaryInner {
		}

    #SectionMenu {
        position: relative;
        float: left;
        color: #877c6f;
        margin-top: 5.875em;
        margin-left: -100%;
        padding-left: 20px;
    }
        * html #SectionMenu {
            /* IE6 Only */
            left: 0;
        }

#AcuityTrailNavigation {
}

#Footer {
    position: relative;
	width: 980px;
	padding-top: 80px;
    padding-bottom: 2em;
    background: #564F48 url('/images/templates/bg_footer.gif') no-repeat;
	
	/* 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;
	margin-top: -3px;
}
    #FooterInner {
    }

    #FooterContent {
        width: 100%;
        color: #9c8d72;
        font-size: 91.7%;
        text-align: center;
    }

	    #Footer a:link {
	        color: #9c8d72;
	        text-decoration: none;
	    }	
	    #Footer a:visited {
	        color: #9c8d72;
	        text-decoration: none;
	    }	
	    #Footer a:hover {
	        color: #877c6f;
	        text-decoration: underline;
	    }	
	    #Footer a:active {
	    }

	#FooterPageFunctions {
	}

	#FooterMenu {
	}
		#FooterMenu a:link {
		}
		#FooterMenu a:visited {
		}
		#FooterMenu a:hover {
		}
		#FooterMenu a:active {
		}

	#Footer #SiteInfo {
	    width: 100%;
	    color: #706a65;
	    text-align: center;
	    font-size: 75%;
	}
	
	    #Footer #SiteInfo a {
	        color: #706a65;
	    }

		#Footer #SiteInfo #Rights {
		}

		#Footer #SiteInfo #Credits {
		}

/* ####################################
   Main Menu
   ################################## */

/***
 * GLOBAL - List Layout
 */

#MenuUL {
    /* The nav object. (A <ul> in the standard platform.) */
    position: relative; /* DON'T CHANGE - Assures nav container has proper cascading position. */
    float: left; /* DON'T CHANGE - Makes IE and FF behave the same regarding ul dimensions. */
    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-weight: bold;
}

#MenuUL li {
    /* All list items within the nav object */
    float: left; /* DON'T CHANGE - This makes the top level horizontal. */
}
* 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 */
    position: relative;
    float: left;
    width: 97px; /* 107px */
    height: 27px; /* 43px */
    padding: 16px 5px 0;
    color: #840056;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    background: url('/images/templates/tab_off.gif') no-repeat;
}
* 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 */
        color: #ffffff;
        background: url('/images/templates/tab_on.gif') no-repeat;
    }

/***
 * 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: -10000em; /* DON'T CHANGE - Drop-down hover trick - Hide the menu off the screen. */
    top: 43px;
    
    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. */
    margin-left: 5px;
}

#MenuUL li ul li {
    /* Second level list items */
    float: none; /* DON'T CHANGE - Makes second level list items vertical. */
    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 */
    position: relative;
    float: left;
    clear: left;
    width: 89px;
    height: auto;
    padding: 10px 4px 8px;
    background: #E5E1DC;
}

    #MenuUL li ul li a:hover {
        /* Second level list items - Anchor tags - Hover */
        color: #840056;
        background: #EDEBE8;
    }

/***
 * Individual Menu Items
 */

#Menu_Item_58 {
    /* Always "home" in Acuity CMS 3.x */
}

/* ####################################
   Section Menu 
   ################################## */
   
#SectionMenuUL {
    width: 150px;
    margin: 0;
    padding: 0;
    line-height: 125%;
    list-style: none;
    text-transform: uppercase;
}

    #SectionMenuUL li {
        margin-bottom: 0.5em;
    }
    
    #SectionMenuUL ul {
        margin: 0.5em 0;
        padding-left: 0.25em;
        font-size: 91.7%;
    }
    
        #SectionMenuUL ul li {
            margin-bottom: 0;
            padding-left: 10px;
            list-style-type: none;
            background: url('/images/templates/dot.gif') 0px 3px no-repeat;
        }

#SectionMenuUL a {
}

    #SectionMenuUL a:link {
        color: #877c6f;
    }

    #SectionMenuUL a:visited {
        color: #877c6f;
    }

/* ####################################
   Custom Element Styles
   ################################## */

.big {
	font-size: 116.7%;
}

.small {
	font-size: 75%;
}

.hidden {
	display: none;
}

.date {
    margin-top: 0;
	color: #877c6f;
	text-transform: uppercase;
}

.author {
    margin-top: 0;
	color: #877c6f;
	text-transform: uppercase;
}

.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;
}

.marginTop0 {
    margin-top: 0px;
}

.circleButton,
.circleButton_1line, 
.circleButton_2lines,
.circleButton_3lines,
.circleButton_4lines {
    display: inline-block;
    width: 66px;
    height: 52px;
    padding-top: 38px; /* Same as one line by default */
    padding-left: 12px;
    padding-right: 12px;
    color: #ffffff !important;
    font-weight: bold;
    font-size: 91.7%;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    background: url('/images/templates/circle_off.gif') no-repeat;
}

.circleButton_1line {
    height: 52px;
    padding-top: 38px; /* Places text at standard font size vertically in the middle. Multi line text needs extra styling to adjust. */
}

.circleButton_2lines {
    height: 59px;
    padding-top: 31px;
}

.circleButton_3lines {
    height: 66px;
    padding-top: 24px;
}

.circleButton_4lines {
    height: 73px;
    padding-top: 17px;
}

    .circleButton:hover, 
    .circleButton_1line:hover, 
    .circleButton_2lines:hover, 
    .circleButton_3lines:hover, 
    .circleButton_4lines:hover {
        text-decoration: underline;
        background: url('/images/templates/circle_on.gif') no-repeat;
    }

.galleryLink {
	/* Placeholder for a class name used to help with image galleries. */
}

.validationFailed {
    background: #ecdede;
    border: #cc0000 2px solid;
}

.trailNav {
    color: #877c6f;
    font-size: 91.7%;
    text-transform: uppercase;
}

	.trailNav a:link {
	    color: #877c6f;
	    text-decoration: none;
	}
	
	.trailNav a:visited {
	    color: #877c6f;
	    text-decoration: none;
	}
	
	.trailNav a:hover {
	    color: #840056;
	    text-decoration: underline;
	}
	
	.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;
	}

.messageError {
	margin: 15px 0; 
	padding: 15px;
	border: 1px solid #EC5F35;
}

	.messageError h1, .messageError h2, .messageError h3, .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;
	}

	.messageError .code {
		margin-top: 2px; 
		padding-top: 0; 
		font-size: 91.7%; 
		font-weight: bold; 
		color: #EC5F35;
	}

.messageConfirm {
	margin: 15px 0; 
	padding: 15px;
	border: 1px solid #939f38;
}

	.messageConfirm h1, .messageConfirm h2, .messageConfirm h3, .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;
	}

.messageInfo {
	margin: 15px 0; 
	padding: 15px;
	border: 1px solid #EC5F35;
}

	.messageInfo h1, .messageInfo h2, .messageInfo h3, .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;
	}

