@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;
}
body {
	line-height: 1;
}

blockquote, q {
	quotes: none;
}

/* this is the behaviour for form fields when they are selected */
input: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;
}

table.ofaTable
{
width:100%;
border-collapse:collapse;
}

.ofaTable p {
margin:0; padding:0;	
}
.ofaTable td, .ofaTable th 
{
border:1px solid #ccc;
padding:3px 7px 2px 7px;
}
.ofaTable th 
{
text-align:left;
padding-top:5px;
padding-bottom:4px;
border-top: 3px solid #666;
	border-bottom: 1px solid #999;
	background: #e5e5e5 url('../images/arc_right_main.gif') no-repeat;
	color: #174A7D;
}
.ofaTable tr.alt td 
{
color:#000000;
}

/* -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: 10px; /* space after */
}

li a { zoom: 0; } /* 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 1.5em 0; /* sets default margins for all paragraphs */
}

sup {
	vertical-align: baseline;
	font-size: 0.8em;
	position: relative;
	top: -0.4em;
	}

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

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

h1 {
	color: #174A7D; /* COLOUR CHANGE */ /* replace h tags colour with your own */
	font-size: 1.4em;
	margin: 0.5em 0 1em 0; /* default margins for h tags: in this order: top, right, bottom, left */ 
}
h2 {
	color: #3b85b8;/* COLOUR CHANGE */
	font-size: 1.2em;
	padding-bottom: 6px; /* no margins for h2 these are used for menu items - TO OVERRIDE THIS STYLE, add a new class  */
}
h2.header { padding:3px 0;}
h3 {
	color: #174A7D; /* COLOUR CHANGE */
	font-size: 1.1em;
	margin: 0.5em 0; /* default margins for h tags: in this order: top/bottom, right/left */
}
h4 {
	color: #444; /* COLOUR CHANGE */
	font-size: 1em;
}

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: #bfbfbf; background-color: #bfbfbf; 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 */
/* --------------------------------------------------------------- */ 



/* 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:active {
	text-decoration: underline;
	font-weight: bold;
	color: #174a7d; /* COLOUR CHANGE */
}
a:visited, a:hover {
	text-decoration: underline;
	font-weight: bold;
	color: #666; /* COLOUR CHANGE */
}

#left_column a:link, #left_column a:visited, #left_column a:hover, #left_column a:active {
	text-decoration: none;
}
/* default link style */

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

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

#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: 980px;
	padding-top: 20px;
}

/* 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;
	font-weight: normal;
	text-decoration: none;
	color: #174a7d;
}

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: 92px;
	float: left;
	background-image: url('../images/header_arc.jpg');
}

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

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

#arc fieldset label {display:none}


#submit { /* submit (go) button */
	width: 30px;
	padding: 3px 0;
	border: 0;
	background-color: #b7cee3;
	color: #2a2201; /* COLOUR CHANGE */
}

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

#navbar p { /* text in navbar */
	font-size: 1.1em;
	font-weight: bold;
	text-transform: uppercase;
	text-align: center;
	margin-top: 7px;
	
}

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

#banner { /* holds flash banner or static banner */
	width: 980px;
	height: 199px;
	overflow: hidden; /* Necessary for IE6 */
	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%;
	overflow : hidden;
	margin-bottom: 10px;
}

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

.leftnav .header { 
	width: 100%;
	min-height: 1.6em;
	height: auto !important;
	height: 1.6em; 
	border-bottom: 1px solid #bfbfbf;
	float: left;
	position: relative;
	background: #e5e5e5 url('../images/arc_left.gif') no-repeat; /* COLOUR CHANGE header BG image match #colour to bottom half of arc graphic */  
}

.leftnav .header a { 
	color: #333;
	font-weight: bold;
	display: block;
	padding: 3px 5px; 
}

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

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

.leftnav .mycolour .header {
	border-bottom: 1px solid #000000;
	background: #003567 url('../images/arc_left_mycolour.gif') top left no-repeat; /* COLOUR CHANGE header BG image match #colour to bottom half of arc graphic */
}

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

/* -- Standard MY GOVERNMENT colour of Header bar for Menu titles -- */

.leftnav .mygovt .header {

            background-color: #4a1910;

            background-image: url(../images/arc_left_red.gif);

            background-repeat: no-repeat;

}

 

.leftnav .mygovt .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;
	padding-bottom: 2px;
} 


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

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

.menu li {
	display: inline;	
}

.menu 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: #f7f7ef url('../images/triangle_right.gif') no-repeat 12px 13px; /* COLOUR CHANGE  */
}

.menu #activearrow a { background: #f7f7ef url('../images/triangle_down.gif') no-repeat 12px 10px; }

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

}

#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: #FFF url('../images/triangle_right.gif') no-repeat 23px 13px; 
}

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

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

.row { /* 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-right: -3px; /* IE 6 duplicate text fix */
	margin-bottom: 10px;
	border-bottom: 1px dotted #666; 
}

.button { margin: 20px auto; width: 210px; }

/* FOOTER STYLES ------------ */

#full_footer { /* changed in V2.3 to make the footer span the whole bottom area */
	border-top: 1px solid #7f7f7f;
	padding-bottom: 1em;
	width: 100%}

#footer p { 
	font-weight: bold;
	text-transform: uppercase;
	color: #666;
	margin-top: 0.7em;
	font-size: .9em
}
#footer a, #footer a:link, #footer a:visited, #footer a:active { color: #666; text-decoration: underline}

/* --- list of links footer - new nov2009 ---- */
#footer ul.right { width: 490px; margin-top: 0.7em; }
#footer ul.left { width: 470px; margin-left: 0; }

#footer ul {
	font-weight: bold;
	text-transform: uppercase;
	color: #666;
	font-size: .9em;
	margin-left: 0;
	padding-left: 0;
	display: inline;
	margin: 0 0 1.0em
	} 

#footer ul li {
	margin-left: 0;
	margin-top: 0.7em;
	padding: 0 10px;
	border-left: 1px solid #000;
	list-style: none;
	display: inline;
	}
#footer ul li.noborder { border: 0 none}
#footer ul.left li { float: left}
#footer p.last-mod { text-transform: none; clear: right; float: right; width: 490px; text-align: right; margin: 0 10px 0 0}
/* --- list of links footer - new nov2009 ---- */


/* --- ACCESSIBILITY ---- ncs EDITED nov4/09 (bug fix, add h2) use to hide h1s or h2s you don't want visible to the sighted, but would like to have read by screen readers */
h1.accessible,h2.accessible{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}



/* SPLASH STYLES ---------- */

#splash {
	width: 710px;
	float: left;
	margin: 2em 135px 0 135px;
	padding-bottom: 80px;
	font-size: 1.3em;
	text-align: left;
	background: url('../images/header_arc.gif') no-repeat bottom left; /* re-uses HEADER ARC image no need to change */
	border: 1px solid #033768; /* 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 #033768; /* COLOUR CHANGE this is a colour that matches the MAIN NAVIGATION BAR  */
}

#splash .two_cols { 
	background: url('../images/splash_line.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 .two_cols .column .button { margin: 20px auto; width: 210px; }
#splash .two_cols .column .arrow  { vertical-align: middle; }

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


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

.two_cols { background: url('../images/two_cols.gif') repeat-y; }
.three_cols { background: url('../images/three_cols.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;
}

.three_cols .column, .box .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;
}

.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;
}

.content {
	padding: 10px 13px;
	float: left;
}	

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

#right_column p { font-weight: normal; }
#right_column p a, #right_column a p, #right_column li a, #right_column a li   { text-decoration: underline; font-weight: normal; }

#right_column ul li {
	list-style-type:disc;
	color:#333;
	margin-left: 10px;
	padding-left: 5px;
	line-height: 200%;
}

#right_column .content .large p a { text-decoration:none; }

.date  { color: #666; } /* CHANGE COLOUR OF NEWS DATES here */
.promo { margin-bottom: 10px; float: left; }

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


.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('../images/arc_right_half.gif') no-repeat; /* COLOUR CHANGE the background colour to your site's colour scheme */
	float: none;
	position: relative;
	margin: 0 2px;
}

.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: 2.5em;
	border-top: 3px solid #666;
	border-bottom: 1px solid #999;
	background: #e5e5e5 url('../images/arc_right_third.gif') no-repeat; /* COLOUR CHANGE the background colour to your site's colour scheme */
	float: none;
	position: relative;
	margin: 0 3px;
}

.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;
}

.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;
	
}

.two_cols .split_lrg .content {
	padding: 25px 0 0 2px;
}

.two_cols .split_lrg .content img {
	float: left;
}

.two_cols .split_lrg h3, .two_cols .split_lrg .content ul, .two_cols .split_lrg .content p {
	float: left;
	padding: 0 5px 0 5px;
	width: 176px;
} 

.two_cols .split_lrg h3 a {
	font-weight: bold;
	text-decoration: underline;
	color: #174a7d;
}

.two_cols .split_lrg .content p { padding-top: 0.5em; } /* overwrites prev statement to set the spacing back to default at the top */

.line_separator {
	overflow: hidden;
	width: 349px;
	height: 1px;
	border-bottom: 1px dotted #666;
	padding-top: 10px;
	padding-bottom: 10px;
}

.header h1 {
	color: #333;
	margin: 5px 10px 0px 10px;
	padding: 0px 0px 5px 0px;
	font-size: 1.2em;
	float: none;
}

.header h2 {
	color: #333;
	margin: 5px 10px 0px 10px;
	padding: 0px 0px 5px 0px;
	font-size: 1.1em;
	float: none;
}

.header .mycolour {
	
} /* in case you need it - not currently used */


.more { /* style for the more> links pulls the more out 30px from the right side of the block */
	right: 26px;
	float: right;
	position: relative;
	top: 5px;
	padding: 0px 0px 0px 30px;
	font-size: 0.8em;
	font-weight: bold;
	text-transform: uppercase;
}


.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 h3, .box p, .box ul, .box table { margin-left: 20px; margin-right: 20px; }
.box table td { border-top: 1px dotted #666; }



/* 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; } /* used for the left floated series of images - you can put a caption below - this style that caption */

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; }

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

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

.photolink       { width: 100%; float: left; }
.photolink a     { font-weight: bold; }
.photolink .text {
	float: left;
	padding: 5px 0 0 5px;
	color: #FFFFFF; /* set colour of link text under photos here */
}
.row three_cols .column .content .large a {	text-decoration: none;}

.nav_top      { background-image: url('../images/corner_nav_top.gif'); background-position: top left; }
.nav_bottom   { background-image: url('../images/corner_nav_bottom.gif'); background-position: bottom left; }
.main_top     { background-image: url('../images/corner_main_top.gif'); background-position: top left; }
.photo_top    { width: 210px; background-image: url('../images/corner_photo_top.gif'); background-position: top left; }
.photo_bottom { width: 210px; background-image: url('../images/corner_photo_bottom.gif'); background-position: bottom left; }

.highlight_top    { width: 130px; background-image: url('../images/corner_photo_top.gif'), url('../images/corner_photo_top.gif'); background-position: top left, top right; }
.highlight_bottom { width: 130px; background-image: url('../images/corner_photo_bottom.gif'), url('../images/corner_photo_bottom.gif'); background-position: bottom left, bottom right; }

.icon_top     { background-image: url('../images/corner_icon_top.gif'); background-position: top left; }
.icon_bottom  { background-image: url('../images/corner_icon_bottom.gif'); background-position: bottom left; }
.noborder	  { border: 0; }
.nomargin     { margin: 0; }

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

.red  { background-color: #660000; }
.grey { background-color: #868686; }
.mycolour { background-color: #003567; } /* COLOUR CHANGE this is a colour that matches your site *** make sure to make a header ARC image to match if changing it */

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

/*(NOELLE - note to self) from TCU - is this standard? */.two_thirds .photo { height: 100px; /* specify image height here */ width: 210px; float: left; padding: 12px 20px 20px 20px; /* pulls image down same amount as the paragraph 16px and adds a pad under the image */}

.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;
}

#newsFeed .photo-contents {display:inline-block; width:100%; text-align:center;}
#newsFeed img.photo {width:auto; max-width:100%; float:none;}

#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;
}

/* ------ overide styles ---- */

.nomargin { margin: 0; } /* removes all margins */
.noborder { border: 0; } /* removes all borders */
.content: after {
	clear: both;
}

/* NOELLE - note to self may not need - check */
h2 a.large {
margin-top: 20px;
display:block;
}

/* secondary page banners */
#titlebanner { margin: 1px 0 15px 0; }

/* breadcrumbs */
#path {
	margin: 0 0 10px 0;
}

#path a {
	text-decoration: underline;
	color: #174a7d;
}

/* financial tables */
.financial td, .financial th {
	border: 1px solid black; 
	padding: 5px;
}

/* styles for designated areas maps */

#totlaBin {
	position:relative;
	width:auto;
	height:auto;
}

#capsule {
	position:relative;
	width:598px;
	padding: auto;
	margin: auto;
}

#map1 {
	width:598px;
	height:230px;
	background:url(../graphics/ontarioareas_a.jpg);
}

#map2 {
	width:598px;
	height:200px;
}

#map3 {
	width:598px;
	height:181px;
}

#legends {
	position:relative;
	width:190px;
	height:181px;
	float:left;
}

#map3a {
	position:relative;
	width:408px;
	height:181px;
	float:left;
}

#desc {
	position:relative;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#289600;
	left:420px;
	top:150px;
	width:250px;
}

map a:link {
	color:#000;
	text-decoration:underline;
	}

map a:visited {
	color:#000;
	text-decoration:underline;
}

map a:hover {
	color:#000;
	text-decoration:none;
}

#capsule {
	font-family:Verdana, Arial, Helvetica, sans-serif; 
	font-size: .8em; 
	color:#152534;
}
/* end designated areas map styles */

/* FAQ styles */

#right_column #faq li {

	margin: 0 0 5px 0;
	padding: 0;
	line-height: 1.4em;
	font-size: .9em;
	font-weight: bold;
}

.drawer ul li, .drawer ul ul li {
	padding: 0 0 5px 0;
	font-size: 1em;
}
.drawer ul ul {list-style-type: disc; }
/* end FAQ accordion styles */

.haut {	
	font-size: .7em;
	text-align: center;
	margin-bottom: 15px;
}

/* Infostats table styles */
.statstable {
	border: 2px solid #fff;
	margin: 20px auto;
}
.statstable th {
	background: #333;
	color: #fff;
	text-align: center;
	font-size: .9em;
	padding: 5px;
	border: 1px solid #fff;
}
.statstable td {
	background: #ddd;
	color: #000;
	text-align: center;
	font-size: .8em;
	padding: 5px;
	border: 1px solid #fff;
}
.statstable a {
	color: #174a7d;
	text-decoration: underline;
}

/* Other table styles (align left) */
.infotable {
	border: 2px solid #fff;
	margin: 20px;
}
.infotable th {
	background: #333;
	color: #fff;
	text-align: left;
	font-size: .9em;
	padding: 5px;
	border: 1px solid #fff;
}
.infotable td {
	background: #ddd;
	color: #000;
	text-align: left;
	font-size: .8em;
	padding: 5px;
	border: 1px solid #fff;
}
.infotable a {
	color: #174a7d;
	text-decoration: underline;
}
.lightrow td {
	background: #eee;
}

/* grant application tables */
.apptable {
	width: 100%;
	border: 1px solid #000;
	margin: 0;
	background: #fff;
}
.apptable th {
	text-align: left;
	border: 1px solid #000;
	font-size: .9em;
	padding: 5px;
}
.apptable td {
	text-align: left;
	border: 1px solid #000;
	font-size: .8em;
	padding: 5px;
}

.apptable td p {
	font-size: 1.25em;
	margin: .5em 0;
}


/* stats footnotes */
.footnote {
	font-style: italic;
	font-size: .8em;
	margin: 0;
	padding: 0;
}
.clear {
	clear: both;
}
/* franco stakeholders lists */
dt {
	font-weight: bold;
	margin: 6px 0 0 10px;
}
.arrowbullet dd {
	margin: 0 0 15px 25px;
	padding: 0 0 0 10px;
	background-image: url(../graphics/arrow.gif);
	background-repeat: no-repeat;
	background-position: 0 .6em;
}
	
/* for centering images or text  */
.centered {
	margin: 0 auto;
	display: block;
	text-align: center;
}


/* maps for regional maps and stats pages */
img#regionmap { 
	float: left;
	margin-right: 60px;
}
h1 a, h2 a, h3 a {
	text-decoration: underline;
}

/* lists of municipalities */
.cities {
	float: left;
	font-size: .9em;
	width: 22%;
}
/* Photos captions for 450px photos */
.photos {
	width: 450px;
	text-align: center;
}

/* Photos captions for 500px photos */
.photos500 {
	width: 500px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

.photos500 img {
	width: 500px;	
}

/* Photos float right with 10px margin */
.right {
	float: right;
	margin: 0 0 10px 10px;
}
/* float left half */
.half {
	width: 50%;
	float: left;
}

/* A juste titre yellow boxes */
.yellowbox { background: #ffc; padding: 3px; }

.titretable { width: 100%; padding: 0; margin: 0; }

.titretable td { border-bottom: 1px solid #000; }

.cell1 { width: 50%; background: #eee; }

.cell1 p, .cell2 p { padding: 5px; }

.nobullets ul, .nobullets ul li, .nobullets ul li ul { list-style: none; }
/*
#studieslist h2, #studieslist h3 { margin-top: 1.6em; }
#studieslist dt { margin-top: 1em; }*/


/* MISC OL LIST STYLES */

ol { margin-left: 25px; }

/* ADDED STYLES FOR 2011 STATISTICAL PROFILES */
/* Radii Added Styles */
.chart-footer{
	text-align:right;
}

.chart-title{
	text-align:center !important;
}

.bold{
	font-weight:bold;
}

.chart-label{
	text-align:left !important;
}
.footer-nav, .footer-nav a{
	font-size: 0.9em;
	color: #FFF;
}

.image-left{
	float:left;
	margin-right:20px;
	margin-top:5px;
	margin-bottom:20px;
	border:0;	
}

.image-right{
	float:right;
	margin-left:20px;
	margin-top:5px;
	margin-bottom:20px;
	border:0;
}

.image-right .photo, .image-left .photo {
	width:210px;
}

#stats h2, #stats h3{
	clear:both;
} 
#right_column ul li ul li {
	list-style-type: circle;
}
#stat-profiles ul{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	width: 100%;
}
#stat-profiles ul li{
	list-style-type: none;
	float: left;
	width: 167px;
	margin: 0;
	padding: 0;
	padding-right: 10px;
}

ul.footer-nav {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	width: 25%;
	float: left;
	padding-top: 5px;
}
ul.footer-nav li, #right_column ul.footer-nav li {
	list-style-type: none;
	margin: 0;
	text-align: left;
	line-height: 120%;
}
#stat-profiles .photo_top {
	width: 167px;
	background-image: url(../images/corner_photo_top_167.gif);
}
#stat-profiles .photo_bottom {
	width: 167px;
	background-image: url(../images/corner_photo_bottom_167.gif);
}
#stats_footer {
	background-color: #153961;
	padding: 5px;
	color: #FFF;
}

.row .footer-nav {
	color: #666;
	text-align: center;
}
.row .footer-nav a {
	color: #284974;
}

.row p.footer-nav, #right_column p.footer-nav {
	margin: 0;
}

ul.no-bullet, ul.no-bullet li, #right_column ul.no-bullet, #right_column ul.no-bullet li {
	list-style:none;	
}
p.quote {
	width:80%;
	margin-left: auto;
	margin-right:auto;
}

.btn {
	display: inline-block;
	text-align:left;
	padding: 4px 12px;
	margin-bottom: 0px;
	font-size: 14px;
	line-height: 20px;
	color: rgb(51, 51, 51);
	text-align: left;
	text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.75);
	vertical-align: middle;
	cursor: pointer;
	background-color: rgb(245, 245, 245);
	background-image: linear-gradient(to bottom, rgb(255, 255, 255), rgb(230, 230, 230));
	background-repeat: repeat-x;
	border-width: 1px;
	border-style: solid;
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-image: none;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgb(179, 179, 179);
	border-radius: 4px 4px 4px 4px;
	box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px rgba(0, 0, 0, 0.05);
}

.btn:hover, .btn:focus, .btn:active, .btn.active, .btn.disabled, .btn[disabled] {
    color: rgb(51, 51, 51);
    background-color: rgb(230, 230, 230);
}

.btn a { display:block;}


.btn-light {display: block;
	color: rgb(255, 255, 255);
text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.25);
background-color: rgb(59, 133, 184);
background-image: linear-gradient(to bottom, rgb(91, 192, 222), rgb(59, 133, 184));
background-repeat: repeat-x;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);	
}

.btn-light:hover, .btn-light:focus, .btn-light:active, .btn-light.active, .btn-light.disabled, .btn-light[disabled] {
    color: rgb(255, 255, 255);
    background-color: #174A7D;
	background-image: linear-gradient(to bottom, rgb(0, 136, 204), rgb(23, 74, 125));
	background-repeat: repeat-x;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
}

.btn-light a {
	color: #fff;
	text-decoration:none;
}

a.btn-light, a.btn-dark {
	color: #fff;
	text-decoration:none;
}

.btn-dark {
	display: block;
	color: rgb(255, 255, 255);
	text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.25);
	background-color: #174A7D;
	background-image: linear-gradient(to bottom, rgb(0, 136, 204), rgb(23, 74, 125));
	background-repeat: repeat-x;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
}

.btn-dark:hover, .btn-dark:focus, .btn-dark:active, .btn-dark.active, .btn-dark.disabled, .btn-dark[disabled] {
    color: rgb(255, 255, 255);
    background-color: rgb(59, 133, 184);
background-image: linear-gradient(to bottom, rgb(91, 192, 222), rgb(59, 133, 184));
background-repeat: repeat-x;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);	
}


.btn-dark a { color: #fff; text-decoration:none; }


#QandA .question h2, #QandA .question h3 {
		background:url(../images/nav_level2_closed.gif) no-repeat -20px -1px;
		padding-left : 25px;
}

#QandA .question h2.open, #QandA .question h3.open{
		background-image:url(../images/nav_level2_open.gif)
	}
	
#QandA .question .answer {
		padding-left : 30px;
	}

cite a, a cite {font-style:normal}