@charset "utf-8";
/* CSS Document */

/*
TABLE OF CONTENTS

ZERO OUT - Sets most everything to ZERO, so there's a clean slate to start with - set any defaults here (Lists especially)
BODY - sets the base font
POSITIONING - generic tags for positioning
LINKS - default and other link styling
#HEADER - Ontario logo, #arc, #search, #navbar (main menu/navigation), #banner
#right_column - Main content area (Many layouts - see style guide)
#left_column - .left_nav (left hand navigation group), .menu (menu list)  
#FOOTER - #full_footer, Copyright, Site Map, Contact Us, Privacy Notices

*/


/* -ZERO OUT EVERYTHING - * ---------------------------------------------------------------- */
/* -this css sets all padding, margins, defaults to 0 - * ---------------------------------- */
/* tables still need 'cellspacing="0"' in the markup */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

/* Search Results */
/* added from master css ver 1.49  */
.row ul {margin: 10px 0px 0px 31px; padding: 0px 0px 10px 0px;}

ol {margin: 10px 0px 10px 55px}
ol.resultsList {margin: 10px 0px 10px 18px; list-style-type: none !important;}
ol.resultsList li {padding: 15px 0px 25px 0px; clear: both;}
ol span {}
ol li {margin: 8px 0px 8px 0px;}

.results {font-weight: bold; margin: 5px 0px 15px 0px; text-align: center;}
.resultsNum {clear: both; margin: 5px 0px 15px 0px;}
.resultsListLeft {float: left; position: relative;}
.resultsListRight {float: left; position: relative; width: 624px; padding: 0px 0px 0px 10px;}
.fileDetails {color: #666666; margin: 3px 0px 0px 0px;}
.description {margin: 3px 0px 0px 0px;}

/* End Search Results */

body {
	line-height: 1;
}

blockquote, q {
	quotes: none;
}

/* this is the behaviour for form fields when they are selected */
:focus {
	outline: 1px solid #000000;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* -ZERO OUT EVERYTHING - END * ---------------------------------------------------------------- */

/* ----------- ZERO OUT LISTS - set your default list styles here ---------------- */
ol, ul { /* this is the default style - change at will - */
	list-style: none; /* no bullets */
	margin-left: 20px; /* indented from side */
	margin-bottom: 20px; /* space after */
}

/* li a { zoom: 1 } fix for IE list bug - which wil sometimes interpret a new li as a line break */

/* BASELINE ** ADDITION ** REMOVES Margins from LISTS - nested lists have no top/bottom margins - remove to use default margins*/ 
/*ul ul, ul ol, ul dir, ul menu, ul dl, ol ul, ol ol, ol dir, ol menu, ol dl, dir ul, dir ol, dir dir, dir menu, dir dl, menu ul, menu ol, menu dir, menu menu, menu dl, dl ul, dl ol, dl dir, dl menu, dl dl {
	margin-top: 0;
	margin-bottom: 0;
}*/
/* --------------------------------------------------------------- */ 



/* sets the base font to approx 10pt */
body { 
	background-color: #FFF; 
	color: #000; 
	font: 62.5% Verdana, Helvetica, Arial, sans-serif; 
	text-align: center; 
	line-height: 1.5em;
}
 

/* default sizing for standard elements -------------------------- */   /* SET text attributes here */
a {
	text-decoration: none;
	color: #000000;
}
a:visited {
	color: #666;
}
p {
	margin: 0.5em 0 0.5em 0; /* sets default margins for all paragraphs */
}

/* -------- HEADERS --------- */

h1, h2, h3 { font-weight: bold; } 	/* must set explicitly, it is zeroed out above */

h1 {
	color: #aa3d12; /* COLOUR CHANGE */
	font-size: 1.5em;
	margin: 0.5em 0; /* default margins for h tags: in this order: top/bottom, right/left */
}
h2 {
	color: #4A5663;/* COLOUR CHANGE */
	font-size: 1.3em;
	margin: 0.5em 0;
	padding-bottom: 0px; /* no margins for h2 these are used for menu items - TO OVERRIDE THIS STYLE, add a new class  */
}
html>/**/body h2{padding-bottom: 6px; /* no margins for h2 these are used for menu items - TO OVERRIDE THIS STYLE, add a new class  */}
h3 {
	color: #768092; /* COLOUR CHANGE */
	font-size: 1.1em;
	margin: 0.5em 0; /* default margins for h tags: in this order: top/bottom, right/left */
}
h4 {
	color: #333333; /* COLOUR CHANGE */
	font-size: 0.9em;
}

img {
	border: 0;
}
/* --------------------------------------------------------------- */ 



/* common/generic styles ------------------------------------------------- */ 

/* positioning */
.right { /* aligns - floats right */
	float: right;
	margin-left: 20px;
	text-align: right;
}
.left { /* aligns - floats left */
	float: left;
	margin-right: 20px;
}
.top { /* removes top margin */
	margin-top: 0;
}
.bottom { /* removes bottom margin */
	margin-bottom: 0;
}

.center { /* centers */
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
.clear { /* to clear floats */
	clear: both;
}

/* other */
.small { /* smaller text */
	font-size: 0.85em;
	line-height: 140%;
}
.large { /* larger text */
	font-size: 1.4em;
	margin-top: 20px;
	display: block;
}
.indent { /* use to indent text in a pragraph */
	margin-left: 2em;
}

.label {
	display: block;
	width: 5em;
	float: left;
}

.submit { /* styles the submit / GO button -- */
	background-color: #aa3d12; /* COLOUR CHANGE */
	color: #fff;
	font-weight: bold;
	border: none;
	float: left;
	width: 100%;
	border: 1px solid #000; /* when BGimages are turned off there is no search box visible - adding a border will make it visible - coloud also add a bgcolor instead */
}

hr { height: 1px; color: #A6A6A6; background-color: #A6A6A6; border: none; float: left; clear: both; width: 100%; margin: 1em 0; }
hr.thick { height: 3px; color: #666; background-color: #666; } /* thicker separator line - change colour if desired for greater emphasis */
hr.thin { height: 1px; color: #A6A6A6; background-color: #A6A6A6; } /* thicker separator line - change colour if desired for greater emphasis */
/* --------------------------------------------------------------- */ 



/* tables still need 'cellspacing="0"' in the markup - CSS2 does not yet have proper table support */





/* ---- LINKS ---------------------------------------------------- */

/* default link style */

 #language a,  a:link,  a:visited,  a:active {
	text-decoration: none;
	font-weight: bold;
	color: #333333; /* COLOUR CHANGE */
}
a:hover {
	text-decoration: underline;
	color: #000000; /* COLOUR CHANGE */
}

/* default link style */

/* PAGE LAYOUT STYLES --------------------------------------------- */

#wrapper { /* wraps the whole page and centers it */
	width: 980px;
	margin: 13px auto 0 auto;
	text-align: left;
}

/* added from master css ver 1.49  */
#wrapperSplash {
	width: 710px;
	margin-left: auto;
	margin-right: auto;
}

#header { /* holds the header area Ontario logo, div>arc, div>search, div>navbar (main menu/navigation), #banner */
	width: 980px;
	position: relative;
}

#left_column { /* holds menu - side nav */
	width: 250px;
	float: left;
	font-size: 1.2em;
	line-height: 160%;
}

#right_column { /* content area */
	width: 710px;
	float: right;
	font-size: 1.3em;
	line-height: 160%;
}

#footer {
	clear: both;
	width: 100%;
	padding-top: 20px;
	text-align:center;
}

/* HEADER LAYOUT STYLES --------------------------------------------- */

#textlinks a.last, #navbar p a.last { border: none; padding-right: 0; }

#textlinks {
	position: absolute;
	right: 0px;
	top: 5px;
	text-align: right;
}

#textlinks a {
	padding: 0 1em 0 0.75em;
	border-right: 1px solid #999;
}

a#skipNav:link, a#skipNav:visited, a#skipNav:hover { color: #FFF; border: none; }
a#skipNav:active, a#skipNav:focus { color: #17397d; border-right: 1px solid #999;  }

#arc {
	width: 100%;
	height: 75px;
	float: left;
	margin-top:-75px;
	background: url('hhp_sm_header_arc_image.gif') no-repeat bottom right;
}

#arc form { /* search form */
	float: right;
	margin: 40px 0 0 0;
	padding-right: 59px;
}

/*#search {
	width: 300px;
	height: 1.5em;
	padding: 3px;
	border: 0;
	background-color: #fff; 
}

#submit { 
	width: 30px;
	padding: 3px 0;
	border: 0;
	background-color: #999;
	color: #fff; 
}
*/
#search { /* search box */
	width: 265px;
	height: 28px;
	padding: 3px;
	border: 0;
	background:url('hhp_smath_search_bar.png') no-repeat;
	/*background-color: #fff; /* COLOUR CHANGE */
}

#submit { /* submit (go) button */
	width:28px;
	height:28px;
	padding: 3px 0;
	border: 0;
	/*background-color: #999;*/
	background:url('hhp_smath_submit_button.png') no-repeat;
	color: #fff; /* COLOUR CHANGE */
	vertical-align:top;
}

#navbar { /* the main nav bar */
	width: 100%;
	float: left;
	border-bottom: 8px solid #FFF;
	background: #343434 url('hhp_sm_navbar_image.gif') no-repeat left center;  /* replace Background colour with your colour that matches the graphic */
}

#navbar p { /* text in navbar */
	font-size: 1.2em;
	font-weight: bold;
	text-transform: uppercase;
	text-align: center;
	padding: 7px 0px 6px 0px;
	margin: 0;
	overflow: hidden;	
}

#navbar p a { /* links in navbar */
	color: #FFF; /* COLOUR CHANGE - MAKE SURE CONTRAST IS VERY HIGH */
	padding: 0 15px 0 8px;
	/*border-right: 2px solid #FFF;*/
	text-decoration:none;
}

#banner { /* holds flash banner or static banner */
	width: 980px;
	/*height: 380px;*/
	clear: left;
	margin-bottom: 10px;
	/*border-bottom: 4px solid #453617; /* COLOUR CHANGE - this is the colour stripe under the flash banner */
}

/* LEFT NAV STYLES --------------------------------------------- */

#left_column ul { margin: 0; padding: 0; }

.leftnav {
	width: 100%;
	float: left;
	margin-bottom: 10px;
}

/* -- First colour of Header bar for Menu titles -- */

.leftnav .header { 
	width: 100%;
	height: 1.6em;
	border-bottom: 1px solid #A6A6A6;
	float: left;
	position: relative;
	background: #e5e5e5 url('hhp_smath_leftnav_button_inact.gif') no-repeat; /* COLOUR CHANGE header BG image match #colour to bottom half of arc graphic */ 
	color: #aa3d12;
	font-size: 1.1em;
	padding-bottom: 4px;
}

.leftnav .header a { 
	color: #0039a6;
	font-weight: bold;
	display: block;
	padding: 3px 5px; 
	text-decoration:none;
	font-size:0.8em;
}

.leftnav .header img, .downarrow {
	position: absolute;
	left: 230px;
	top: 8px;
}

/* -- Second colour of Header bar for Menu titles -- */

.leftnav .mycolour .header {
	/*border-bottom: 1px solid #000000;*/
	background: #000000 url('hhp_smath_leftnav_button_image.gif') top left no-repeat; /* COLOUR CHANGE header BG image match #colour to bottom half of arc graphic */
	color: #aa3d12;
	font-size: 1.1em;
	padding-bottom: 4px;
}

.leftnav .mycolour .header a { 
	color:#fff; /* COLOUR CHANGE update font to contrast w BG color (above in .leftnav .mycolour .header) */ 
	font-weight: bold;
	display: block;
	padding: 3px 5px; 
}

.leftnav h2 { font-size: 1.1em; }

/* EXPANDING MENU STYLES --------------------------------------------- */

.menu {
	width: 100%;
	float: left;
}

.menu li {
	display: inline;	
}


/*ul.menu li a {	
	color: #000; 
	font-weight: bold;
	display: block;
	padding: 8px 4px 10px 24px; this creates the size of the menu item box - last value is the distance of the text from the side 
	border-bottom: 1px dotted #666;
	background-image: url('HHP_triangle_right_image.gif');
	background-repeat: no-repeat;
	background-position: 12px 13px;
	background-color: #f7f7ef
}*/
html>/**/body ul.menu li a {	

	padding:8px 5px 12px 5px;
}
ul.menu li a{
	color: #000; 
	font-weight: bold;
	display: block;
	/*padding: 8px 10px 10px 5px;  this creates the size of the menu item box - last value is the distance of the text from the side */
	border-bottom: 1px dotted #666;
	background-image: url('hhp_dh_leftnav_image_compass.png');
	background-repeat: no-repeat;
	background-position: 12px 13px;
	background-color: #f7f7ef;
	padding:13px 5px 12px 5px;
}

.leftNavImage{
	height:20px;
	margin:-5px 0;
	padding-top:13px;
	padding-right:5px;
	width:20px;
}

#current { background-color: #f8f6d7; } 

.menu li li a {/* sub menu styling - positions the arrow graphic in a bit more */
	font-size: 0.9em;
	padding: 8px 4px 8px 36px;
	background-color: #FFF;
	background-image: url('hhp_sm_arrow_right.gif');
	background-repeat: no-repeat;
	background-position: 23px 13px; 
}

.selected a {
	background-color: #f8f6d7; /* COLOUR CHANGE  */
}

.has_child a {
	background-image: url('hhp_sm_arrow_down.gif');
}	

#contacts { display: none; } /* closes the menu by default */

#explore { 	display: none; } /* closes the menu by default */

.bar { /* a style to contain other elements on the page - gives a dotted border at the bottom of the area */
	width: 100%;
	float: left;
	display: inline;
	margin-top:10px;
	margin-right: -3px; /* IE 6 duplicate text fix */
	/*margin-bottom: 10px;
	
	border-bottom: 1px dotted #666; */
}

html>/**/body .bar{
	margin-top:6px;
}


#noLine {border-bottom: none;}

/* SPLASH STYLES */

#splash {
	width: 710px;
	float: left;
	margin: 2.6em 0px 0 0px;
	padding-bottom: 80px;
	font-size: 1.3em;
	text-align: left;
	background: url('HHP_header_arc_image.jpg') no-repeat bottom left; /* re-uses HEADER ARC image no need to change */
	border: 1px solid #606060; /* COLOUR CHANGE this is a colour that matches your site *** make sure to make a header ARC image to match if changing it */
	border-bottom: 2em solid #000000; /* COLOUR CHANGE this is a colour that matches the MAIN NAVIGATION BAR  */
}

#splash .two_cols { 
	background: url('HHP_splash_line_image.gif') no-repeat top center;  /* this line matches the outline of the border above - Graphic in file: Splash_Master.psd */
	float: left;
	width: 100%;
	text-align: center;
	padding-top: 3em;
}

#splash .splash_services {background: none; padding-top: 0;}

/* added from master css ver 1.49  */
#splash .two_cols .column {
	width: 354px;
	float: left;
	position: relative;
	padding: 75px 0px 0px 0px;
}

#splash .two_cols .column_services {
	width: 354px;
	float: left;
	position: relative;
	padding: 11px 0px 0px 0px;
}

#splash .two_cols .column .button { margin: 20px auto; width: 210px; }
#splash .two_cols .column .arrow  { vertical-align: middle; }

#splash h2 a { font-size: 110%; font-weight: bold; color: #000000; /* COLOUR CHANGE - match if you like */} 



/* FOOTER STYLES */

#full_footer { /* changed from orginal to make the footer span the whole bottom area */

	margin:0 auto;
	padding-bottom: 1em;
	width: 900px;
}

#footer p { 
	font-weight: bold;
	text-transform: uppercase;
	color: #666;
	font-size: 0.9em;
}

#footer a { color: #666; }




/* generic LAYOUT styles --------------------------------------------- */

/* .two_cols { background: url('HHP_two_cols_image.gif') repeat-y; } */
/* .three_cols { background: url('HHP_three_cols_image.gif') repeat-y; } */


.two_cols .column { /* when a .column is placed inside a two_cols row you get 2 equal columns of 354px that fill the right_column */
	width: 354px;
	float: left;
	position: relative;
}
.two_cols .column .content {font-size:12px;line-height:1.5em;padding-bottom:20px;}
.two_cols .column .content img  {float:left; margin:0px 8px 0px 0px;}
#innerOverlay {width:180px;height:20px;background:#03F; margin: 0; position:relative; z-index:2; top:120px;}
#innerOverlay h2{color:#FFF; font-size:.9em; padding-left:7px;}

.three_cols .column { /* when a .column is placed inside a three_cols row you get 3 equal columns of 236px that fill the right_column */
	width: 236px; 
	float: left;
	position: relative;
}
.three_cols .column .content {
	background-color:#F7F7EF;
	border-bottom:1px solid #A3A3A3;
	border-left:1px solid #A3A3A3;
	border-right:1px solid #A3A3A3;
	margin:-1px 0px 0px 3px;
	text-align:center;
	width:228px;
}
.three_cols .column .content img{
float:none;
padding:10px 0;
}

.three_cols .column .content p{
text-align:left;
}


.five_cols .column {
    background : url(hhp_smath_secondary_menu_bg.gif) no-repeat;
    float : left;
    text-align : center;
    width : 138px;
    height : 120px;
    margin-right : 5px;
}

.five_cols .alpha {
    background : url(hhp_smath_secondary_menu_bg_ho.gif) no-repeat;
}

.five_cols .omega {
    margin-right : 0;
}

.five_cols h2 { 
    margin : 0; 
    padding: 0; 
    line-height : 23px; 
    height : 23px;
    overflow : hidden;
    color : white; 
    font-size : 80%;
}

.five_cols .alpha h2 {
    color : #333; 
}


.five_cols .column div { 
    padding-top : 10px;
}

/*
.five_cols .column:hover {
    cursor : pointer;
    background : url(hhp_smath_secondary_menu_bg_ho.gif) no-repeat;    
}

.five_cols .column:hover h2 {
    color : black;    
}
*/


.two_thirds .column { /* use in combination with a photo, or to create a layout that splits the screen into 2 sections one twice as big as the second */
	width: 450px;
	float: left;
	position: relative;
}

.two_thirds .other { /* used to hold content other than text */
	width: 236px; 
	float: left;
	position: relative;
}

html>/**/body .content {float: left; padding:0;}
.content {float: left; padding-top:10px;}
.content img{float:left;padding: 10px 10px 0px 0px;}

.column li a { font-weight: bold; }
.column ul   { margin: 0; padding: 0; }

.content a:link, .content a:visited, .content a:active { text-decoration: underline; color:#0039a6;text-decoration:none;}
.content a:hover {color:#000;}

.content ul li {
	list-style-type:disc;
	color:#000000;
	margin-left: 20px;
	padding-left: 5px;
	line-height: 200%;
	
}

.date  { color: #aa3d12; }
.promo { margin-bottom: 10px; float: left; }

.bar .header { /* a full length header that spans all columns -USE: wrap .header in a .row */
	width: 100%;
	height: 34px;
	position: relative;
	/*border-top: 3px solid #666;
	border-bottom: 1px solid #999;*/
	background: url('hhp_smath_main_sect_image.jpg') no-repeat;
}

.bar .two_cols .column .header { /* 2 seperate headers - USE: class="row two_cols" nest .content div inside, then nest .header div inside that */
	width: 350px;
	height: 100%;
	border-top: 3px solid #666;
	border-bottom: 1px solid #999;
	background: #e5e5e5 url('HHP_arc_right_half_image.gif') no-repeat;
	float: none;
	position: relative;
	margin: 0 2px;
}

.bar .three_cols .column .header { /* 2 seperate headers - USE: class="row three_cols" nest .content div inside, then nest .header div inside that */
	width: 230px;
	height: 34px;
	/*border-top: 3px solid #666;
	border-bottom: 1px solid #c4ab66;*/
	background: transparent url('hhp_sm_sub_sect_image.gif') no-repeat;
	float: none;
	position: relative;
	margin: 0 3px;
}

.bar .two_thirds .column .header { /* use in combination with a photo, or to create a layout that splits the screen into 2 sections one twice as big as the second */
	width: 460px;
	height: 2.5em;
	border-top: 3px solid #666;
	border-bottom: 1px solid #999;
	float: none;
	position: relative;
	margin: 0;
}

.bar .two_thirds .other .header {
	width: 236px; 
	height: 2.5em;
	border-top: 3px solid #666;
	border-bottom: 1px solid #999;
	float: none;
	position: relative;
	margin: 0 0 0 3px;
	
}


.bar .header h1, .box .header h1 {
	color: #aa3d12;
	margin: 5px 10px 0px 10px;
	padding: 7px 0px 5px 0px;
	font-size: 1.2em;
	float: none;
}


.header p{
	color: #4A5663;
	margin: 0px 10px 0px 10px;
	padding: 0px 0px 5px 0px;
	font-size: 1.5em;
	float: none;
}

html>/**/body .header p{
	color: #4A5663;
	margin: 5px 10px 0px 10px;
	padding: 7px 0px 5px 0px;
	font-size: 1.5em;
	float: none;
}

.bar .three_cols .column .header p{
	color: #4A5663;
	margin: 0px 10px 0px 10px;
	padding: 0px 0px 5px 0px;
	font-size: 0.8em;
	float: none;
}

html>/**/body  .bar .three_cols .column .header p{
	color: #4A5663;
	margin: 5px 10px 0px 10px;
	padding: 7px 0px 5px 0px;
	font-size: 0.8em;
	float: none;
}


.header .red {
	
}

.more { /* style for the more> links pulls the more out 30px from the right side of the block */
	background: url('hhp_smath_readmore.png') no-repeat 0 0;
	width:89px;
	height:24px;
	/*right: 26px;*/
	float: right;
	position: relative;
	top: 5px;
	padding: 1px 0px 0px 8px;
	font-size: 0.7em;
	font-weight: bold;
	color:#FFF;
	text-transform: capitalize;
}
.more a{
color:#FFF;
}
.more a:hover{
color:#000;
text-decoration:none;
}

.more img { /* positions the chevron/arrow after the MORE link */
	position: absolute;
	top: 5px;
	right: -15px;
}

/*.box {
	float: left;
	width: 100%;
	background-color: #f8f6d7;
	border-bottom: 1px solid #666;
	margin: 10px 0 20px 0;
}*/

.box {
	float: left;
	width: 100%;
	background-color: #fdedaa;
	border-bottom: 1px solid #a6a6a6;
	border-top: 1px solid #a6a6a6;
	margin: 20px 0 20px 0;
}
.box div div h3{color:#231f20;}
.box h3, .box h4, .box p, .box ul, .box table { margin-left: 20px; margin-right: 20px; }
.box table td { border-top: 1px dotted #666; }

.box .content p a{
color:#ed1c24;
}
.box .content p a:hover{
color:#0039A6;
text-decoration: none;
cursor:pointer;
}
.box .content h2{
color:#4A5663;
font-size:1.3em;
margin:0.5em 0;
padding:0px 0px 0px 10px;
}


/* PHOTO STYLES --------------------------------------------- */

.frame  { border: 1px solid #ccc; padding: 8px; }
.inline { vertical-align: middle; }

.photocap  { background-repeat: no-repeat; height: 6px; line-height: 1px; font-size: 0.1em; clear: left; }

div.photo  { width: 210px; height: 190px; float: left; margin: 0 13px; } /* this is for the gallery ONLY - note that it will make the div that holds the photo 190px tall! */

img.photo  { border-top: 1px solid #fff; border-bottom: 1px solid #fff; width: 100%; float: left; }

.photolink       { width: 100%; float: left;}
.photolink a     { font-weight: bold; color: #0039A6; text-decoration:none;font-size:0.8em;}
.photolink .text {float: left;padding: 5px 0 0 5px;color:#0039A6;/* set colour of link text under photos here */}

/*.nav_top      { background-image: url('HHP_corner_nav_top_image.gif'); background-position: top left; }
.nav_bottom   { background-image: url('HHP_corner_nav_bottom_image.gif'); background-position: bottom left; }*/
.main_top     { background-image: url('HHP_corner_main_top_image.gif'); background-position: top left; }
.photo_top    { width: 210px; background-image: url('HHP_corner_photo_top_image.gif'); background-position: top left; }
.photo_bottom { width: 210px; background-image: url('HHP_corner_photo_bottom_image.gif'); background-position: bottom left; }
.icon_top     { background-image: url('HHP_corner_icon_top_image.gif'); background-position: top left; }
.icon_bottom  { background-image: url('HHP_corner_icon_bottom_image.gif'); background-position: bottom left; }
.noborder	  { border: 0; }
.nomargin     { margin: 0; }

.photo_long { width: 426px; background-image: url('HHP_corner_photo_long_image.gif'); background-position: top left; border-bottom: 1px solid #fff;}

.red  { background-color: #660000; }
/*.grey { background-color: #ebce7b; }*/
.grey {}
/*.grey { background: url('hhp_smath_leftnav_top.gif') no-repeat; width:250px; height:8px; }*/
.grey-active { background: url('hhp_smath_leftnav_top.gif') no-repeat; width:250px; height:8px; }
.inactive { background: url('hhp_smath_navbar_top_inactive.png') no-repeat;height:8px; }
.mycolour { background-color: #ebce7b; } /*this is a colour that matches your site *** make sure to make a header ARC image to match if changing it */
.mycolour-top { background-color: #ebce7b;width:250px; height:10px; display:block; margin:0; } /* this is a colour that matches your site *** make sure to make a header ARC image to match if changing it */
.mycolour-image {height:180px;background-color: #ebce7b;position:relative;display:block;}

.mycolour-bottom{ background-color: #ebce7b; width:250px; }
html>body .mycolour-bottom{height:30px;}



.icon { 	width: 125px; 	float: left; 	padding: 10px 0;}
.spacer { float: left; width: 40px; }
.half_spacer { float: left; width: 20px; }


.two_thirds .photo {
	height: 85px; /* specify image height here */
	width: 210px;
	float: left;
	padding: 0; /* puts padding all around the image */
}

/* NEWS STYLES - MAA specific - can be re-used --------------------------------------------- */

.news p { 
	clear: left; 
	float: left; 
	width: 20%; 
	height: 2em; 
	margin: 0; 
	padding: 2px 0 0 0; 
	border-top: 1px dotted #ccc;
}

#right_column .news ul { margin: 0; padding: 0 0 1em 0; }

#right_column .news ul li { 
	display: block;
	list-style-type: none; 
	background: none; 
	margin: 0; 
	padding: 0; 
	border-top: 1px dotted #ccc;
}

/* Page Actions Styles */
.pageActions {margin: 0px 0px 10px 0px !important; padding: 0; float: right; text-transform: uppercase;}
.pageActions {list-style-image: none; list-style-position: outside; list-style-type: none;}
.pageActions li {float: left; font-weight: bold; list-style-type: none;}
.pageActions li.print {background: url('hhp_sm_print_friendly_icon.gif') no-repeat 5px 6px !important; font-size: 0.8em; font-family: arial; margin: 0px 0px 0px 20px; padding: 0px 0px 0px 20px; !important; line-height: 200%;}
.pageActions .print a {text-decoration: none;}	
/* ------ overide styles ---- */

.nomargin { margin: 0; } /* removes all margins */
.noborder { border: 0; } /* removes all borders */
.content: after {
	clear: both;
}
#ad_banner{text-align:center;padding-top:1em;}

/*wahiche*/

.row .column .content p{
	padding:0 5px;
	text-align:justify;
}
.alertTextOuter{width:100%;text-align:center;}
.alertTextInner{width:980px;margin:auto;background-color:#FF0000;font-size:1.5em;color:#FFFFFF;padding:10px 5px;text-align:left;vertical-align:middle;}
html>/**/body .alertTextInner{width:970px;min-height:31px;}
.alertTextInner img{float:left; padding:0px 10px 0px 10px;}