@charset "utf-8";
/* =============================
This CSS contains the old files;
* airquality2016.css
* c3_aoda.css
* c3_svg.css
* master.css
* new.css

Assembled by Kota.M, Feb 13, 2025
============================= */


/* CSS Document */
/* $Id: airquality.css 65 2009-07-06 21:16:16Z DragKng $ */
sub {
	vertical-align:sub;
}

.aqiBar {
  height: 20px;
  padding: 0;
  margin: 0px;
}
.aqiBarForecast {
  height: 20px;
  width: 120px;
  padding: 4px 4px 4px 4px;
  margin: 4px;
  text-align:center;
}

.aqiBlue {
  background-color: #0000cc;
}

.aqiGreen {
  background-color: #00cc00;
}

.aqiYellow {
  background-color: #ffcc00;
}

.aqiOrange {
  background-color: #ff6600;
}

.aqiRed {
  background-color: #ff0000;
}

.aqiGray {
  background-color: #999999;
}
.aqiTransparent {
  background-color: transparent;
}

.twoColumn .resourceTable {
	width: 420px;
	margin-right: -3px;
	border-spacing:1px;
	border-collapse:separate !important;
	margin-bottom:22px;
	border-bottom: 1px solid #EEEEEE;

}
.graphTable{
    margin-bottom: 20px;
}
.resourceTable td.disclaimerRow {  
	background-color: #e5e5e5;
	border-bottom: 1px solid #C2C2C2;
	padding: 3px 6px;
	
}
.resourceTable td.evenrow {  
	padding: 4px;
	vertical-align:middle;
}

.resourceTable td.oddrow {  
	padding: 4px;
	vertical-align:middle;
}
.resourceTable td.center {  
	text-align:center;
	display: table-cell; 
	vertical-align: top;
}

a.blackLink {  
	font-weight:normal;
	color:black;
}

#breadcrumbs {
	margin-top: 0px;
	padding:5px 0 5px 0;
	border: 0px solid red;
}

#bannerHeader {
	width: 980px;
	height: 32px;
	position: relative;
	border-top: 1px solid #999;
	border-bottom: 1px solid #999;
	background-color: #dce4ef; /* COLOUR CHANGE the background colour to your site's colour scheme */
	background-image: url(/images/arc_right_980x40.png);
	background-repeat: no-repeat; 
	margin-right: 0px;
}

#bannerHeader h1{
	margin: 0px 0 0 20px;
	padding-top: 8px;
	border: 0px solid red;
}

.formTable td { 
	padding: 3px 3px;
}



h1 { 
	/* padding-top: 10px; */
	margin-top:0;
}

td.tablehead {
	font-weight:bold;
	background-color: #e8e8e8;
}

#OntarioMap {
	width:330px;
	 background-color: #E1E1E1;
	
}

#textlinks a.last, #navbar p a.last {
  border: none; 
}

h1.search-form-header {
  float: left;
  margin: 8px 2px 0 10px;
  border-top: none;
  color: #000;
}
h2.top-content {
  font-size: 1.4em;
  margin: 1.2em 1em 1em 0;
}
/*
:focus {
  box-shadow: 0 0 5px rgba(81, 203, 238, 1);
  border: 1px solid rgba(81, 203, 238, 1);
}*/
input:focus {
  outline:none;
  box-shadow: 0 0 5px rgba(81, 203, 238, 1);
  border: 1px solid rgba(81, 203, 238, 1);
  
}
a#skipNav:link, a#skipNav:visited {
  color: #42782F;
  border-right: 1px solid #999;

}
a#skipNav:active, a#skipNav:focus, a#skipNav:hover  { 
	color: #0055BD; 
	
}
table.aqoFormTable {
border-collapse: collapse; 
}
table.aqoFormTable td,
table.aqoFormTable th {
padding: 4px; 
}

table.aqoFormTableTight {
border-collapse: collapse; 
}
table.aqoFormTableTight td,
table.aqoFormTable th {
padding: 0px; 
}
div.floatLeft {
	float:left;
}
div.floatLeftMargin {
	float:left;
	margin-left:8px;
	  text-align: left;
}

hr {
	width: 100%;
}

th.tablehead {
	background-color: #E8E8E8;
}

ul {
	max-width: 90%;
}

.resourceTable td.col-total {
	padding-top: 10px;
	padding-bottom: 8px;
	font-weight:bold;
}
.smogTable th, .smogTable .tablehead {
	border-bottom: 1px solid #C2C2C2;
	color: #444444;
	padding: 3px 6px;
}

.smogTable th a, .smogTable .tablehead th a {
	color: #444444;
}

.smogTable td {
	padding: 3px 6px;
}

.smogTable th, .smogTable .tablehead {
	background-color: #E8E8E8;
}
.smogTable th, .tableTop {
    border-top: 1px solid #222222;
}
.smogTable td.col-total {
	padding-top: 10px;
	padding-bottom: 8px;
	font-weight:bold;
    background-color: #E8E8E8;
    border-bottom: 1px solid #C2C2C2;
    border-top: 1px solid #222222;
}
.smogTable td.borderright, .smogTable th.borderright {
	border-right: 1px solid #999;
}
table.centercols {
border-collapse:separate;
}
table.centercols td, table.centercols th {
	text-align:center;
	background-repeat: no-repeat;
	
}
table.centercols td.alignleft, table.centercols th.alignleft {
	text-align:left;
}

.padded td.oddrow, .padded td.evenrow  {
	padding:12px;
}
.padded th, .padded .tablehead {
	padding:12px;
}
#smog-table{
	width:980px;
	overflow:hidden;
	margin-bottom: 10px;
	table-layout: fixed;
	border-collapse:separate;
}
#smog-table { table-layout:fixed; }
#smog-table td { overflow: hidden; }
	
div.dataTables_length {
	float:left;
	margin-right: 20px;
}
#smog-data_previous{
	margin-right: 10px;
}
.DTFC_LeftBodyWrapper {
	background-color: #E8E8E8;
	
}

#legal-footer{
	text-align:left;
}
#legal-footer p{
	margin: 4px;
	text-align:left;
}
div.dataTables_scroll { clear: both; }

#smog-table select {
    /* -webkit-appearance: none; */
    color: #000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 1.3em;
	font-size:100%;
	background-color: #fafafa;
}
#smog-table option {
	margin:4px;
}
.bold-type {
	font-weight:bold;
}

#smog-data_length, #smog-data_filter {
	margin: 4px 0;
}
.paginate_disabled_next, .paginate_disabled_previous {
	display:none;
}

/* Helpful classes for hiding content */

#skip-link {
  left: 50%;
  margin-left: -6.5em;
  margin-top: 0;
  padding: 0 0.5em;
  position: absolute;
  width: 12em;
  z-index: 50;
}
.element-invisible {
  border: 0;
 /* clip: rect(1px 1px 1px 1px);  IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
}

.element-invisible.element-focusable:active,
.element-invisible.element-focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static !important;
  width: auto;
}

.station-button {
  margin: 5px 0 0 15px;
} 
#footer p {
  font-size: 1.0em;
}
.aqhi-scale {
	width:58px;
	height:20px;
	border:1px solid #999;
	padding:0;
	}


.aqhi-bar {
width:100%;
height: 20px;
margin-bottom:4px;
}
.aqhi-bar-80 {
	width:80px;
	height: 20px;
	margin-bottom:4px;
	float: left;
}
.aqhi-forecast-div{
	width:20px;
	height: 20px;
	margin-bottom:4px;
	float: left;
}
.aqhi-sixty {
	width:60px;
	padding: 5px 0 0 0;
}
	.aqhi-scale-text {
	padding: 5px 0 0 0;
	border:0px solid #999;
	}
   .aqhi-0 {
   	 background-color: transparent;
   	 border: 1px #999999 dashed;
   	 height: 18px;
   }
   .aqhi-1 {
   	 background-color: #00ccff;
   }
   .aqhi-2 {
   	 background-color: #0099cc;
   }
   .aqhi-3 {
   	 background-color: #006699;
   }
   .aqhi-4 {
   	 background-color: #ffff00;
   }
   .aqhi-5 {
   	 background-color: #ffcc00;
   }
   .aqhi-6 {
   	 background-color: #ff9933;
   }
   .aqhi-7 {
   	 background-color: #ff6666;
   }
   .aqhi-8 {
   	 background-color: #ff0000;
   }
   .aqhi-9 {
   	 background-color: #cc0000;
   }
   .aqhi-10 {
   	 background-color: #990000;
   }
   .aqhi-11 {
   	 background-color: #660000;
   }
   
  .row{ width: 700px;}
  .row-full-width { width: 720px;}
  .three_cols {width: 720px;}
  
  .chart-frame {
  width: 980px;
  height: 510px;
   overflow: hidden;

  }
  .table-frame {
  width: 980px;
  height: 310px;
  overflow: hidden;

  }
  .aqhi-result {
  width: 46px;
  height: 26px;
  padding: 10px 0 0 0;
  margin: 0 auto;
  border: 1px solid #000;
  }
  .aqhi-result-wrap {
  width: 100%;
  text-align:center;
  }

.js #smenu1 {display:none;}
.js #smenu2 {display:none;}
.js #smenu3 {display:none;}
.js #smenu4 {display:none;}
.js #smenu5 {display:none;}
.js #smenu6 {display:none;}
.js #smenu7 {display:none;}
.js #smenu8 {display:none;}
.js #smenu9 {display:none;}
.js #smenu10 {display:none;}
.js #smenu11 {display:none;}
.js #smenu12 {display:none;}
.js #smenu13 {display:none;}

.photocap, .nav_top, .mycolour, .photolink {
    color: white;
}

.photolink a, .photolink a:link, .photolink a:visited, .photolink a:active {
    color: white;
}
.photocap {
    font-size: 1.0em;
}

.photolink {
    font-size: 1.0em;
}
.toplink {
    font-weight: normal;
    width: 100%;
    text-align: right;
    height: 60px;
}

sup, sub {
    vertical-align: baseline;
    position: relative;
    top: -0.4em;
}
sub { top: 0.4em; }
#right_column {
    line-height: 1.5em;
}


/* ===== From c3_aoda.css ===== */
/*-- Chart --*/
.c3 svg {
	font: 10px sans-serif;
}


.c3 path, .c3 line {
/*fill: none; */
/* stroke: #000;  */
}
.c3 text {
-webkit-user-select: none;
	-moz-user-select: none;
/*  user-select: none; */
}

.c3-legend-item-tile,
.c3-xgrid-focus,
.c3-ygrid,
.c3-event-rect,
.c3-bars path {
/* shape-rendering: crispEdges; */
}

.c3-chart-arc path {
/* stroke: #fff; */

}
.c3-chart-arc text {
/* fill: #fff; */
font-size: 1.3em;
}
  
/*-- Axis --*/

.c3-axis-x .tick {
}
.c3-axis-x-label {
}

.c3-axis-y .tick {
}
.c3-axis-y-label {
}

.c3-axis-y2 .tick {
}
.c3-axis-y2-label {
}

/*-- Grid --*/

.c3-grid line {
/* stroke: #aaa; */
}
.c3-grid text {
/* fill: #aaa; */
}
.c3-xgrid, .c3-ygrid {
/* stroke-dasharray: 3 3; */
}
.c3-xgrid-focus {
}
  
/*-- Text on Chart --*/

.c3-text {
}

.c3-text.c3-empty {
/* fill: #808080; */
font-size: 2em;
}

/*-- Line --*/

.c3-line {
/* stroke-width: 1px; */
}
/*-- Point --*/

.c3-circle._expanded_ {
/* stroke-width: 1px; */
/* stroke: white; */
}
.c3-selected-circle {
/* fill: white; */
/* stroke-width: 2px; */
}
  
/*-- Bar --*/

.c3-bar {
/* stroke-width: 0; */
}
.c3-bar._expanded_ {
/* fill-opacity: 0.75; */
}

/*-- Arc --*/

.c3-chart-arcs-title {
dominant-baseline: middle;
font-size: 1.3em;
}

/*-- Focus --*/

.c3-target.c3-focused {
opacity: 1;
}
.c3-target.c3-focused path.c3-line, .c3-target.c3-focused path.c3-step {
/* stroke-width: 2px; */
}
.c3-target.c3-defocused {
opacity: 0.3 !important;
}


/*-- Region --*/
  
.c3-region {
/* fill: steelblue; */
/* fill-opacity: .1; */
}

/*-- Brush --*/

.c3-brush .extent {
/* fill-opacity: .1; */
}

/*-- Select - Drag --*/

.c3-dragarea {
}

/*-- Legend --*/

.c3-legend-item {
font-size: 1.2em;
}
.c3-legend-item-hidden {
opacity: 0.15;
}

.c3-legend-background {
opacity: 0.75;
/* fill: white; */
/* stroke: lightgray;  */
/* stroke-width: 1  */
}

/*-- Tooltip --*/
  
.c3-tooltip-container {
z-index: 10;
}
.c3-tooltip {
border-collapse:collapse;
border-spacing:0;
background-color:#fff;
empty-cells:show;
-webkit-box-shadow: 7px 7px 12px -9px rgb(119,119,119);
	-moz-box-shadow: 7px 7px 12px -9px rgb(119,119,119);
		box-shadow: 7px 7px 12px -9px rgb(119,119,119);
opacity: 0.9;
}
.c3-tooltip tr {
border:1px solid #CCC;
}
.c3-tooltip th {
background-color: #aaa;
font-size:1.4em;
padding:2px 5px;
text-align:left;
color:#FFF;
}
.c3-tooltip td {
font-size:1.3em;
padding: 3px 6px;
background-color:#fff;
border-left:1px dotted #999;
}
.c3-tooltip td > span {
display: inline-block;
width: 10px;
height: 10px;
margin-right: 6px;
}
.c3-tooltip td.value{
text-align: right;
}

.c3-area {
/* stroke-width: 0; */
opacity: 0.2;
}

.c3-chart-arcs .c3-chart-arcs-background {
/* fill: #e0e0e0; */
/* stroke: none;
}
.c3-chart-arcs .c3-chart-arcs-gauge-unit {
/* fill: #000; */
font-size: 1.6em;
}
.c3-chart-arcs .c3-chart-arcs-gauge-max {
/* fill: #777; */
}
.c3-chart-arcs .c3-chart-arcs-gauge-min {
/* fill: #777; */
}

.c3-chart-arc .c3-gauge-value {
/* fill: #000; */
/*  font-size: 28px !important; */
}

.c3-regions {
background-color: #ff0000;
}


/* ===== From c3_svg.css ===== */
.c3-chart-arc path {
    stroke: white;
}

.c3-chart-arc text {
    fill: white;
}
.c3 path, .c3 line {
    stroke: black;
    fill: none;
}

.c3 text {
    user-select: none; /**/
}

.c3-legend-item-tile,
.c3-xgrid-focus,
.c3-ygrid,
.c3-event-rect,
.c3-bars path {
     shape-rendering: crispEdges; /**/
}


/*-- Grid --*/

.c3-grid line {
    stroke: #aaa;
}
.c3-grid text {
    fill: #aaa;
}
.c3-xgrid, .c3-ygrid {
    stroke-dasharray: 3 3;
}

/*-- Text on Chart --*/

.c3-text {
}

.c3-text.c3-empty {
    fill: #808080;
}

/*-- Line --*/

.c3-line {
    stroke-width: 1px;
}
/*-- Point --*/

.c3-circle._expanded_ {
    stroke-width: 1px;
    stroke: white;
}
.c3-selected-circle {
    fill: white;
    stroke-width: 2px;
}

/*-- Bar --*/

.c3-bar {
    stroke-width: 0;
}
.c3-bar._expanded_ {
    fill-opacity: 0.75;
}

/*-- Focus --*/

.c3-target.c3-focused path.c3-line, .c3-target.c3-focused path.c3-step {
    stroke-width: 2px;
}

/*-- Region --*/

.c3-region {
    fill: steelblue;
    fill-opacity: .1;
}

/*-- Brush --*/

.c3-brush .extent {
    fill-opacity: .1;
}


.c3-legend-background {
    fill: white;
    stroke: lightgray;
    stroke-width: 1
}

.c3-area {
    stroke-width: 0;
    opacity: 0.2;
}

.c3-chart-arcs .c3-chart-arcs-background {
    fill: #e0e0e0;
    stroke: none;
}
.c3-chart-arcs .c3-chart-arcs-gauge-unit {
    fill: #000;
    font-size: 1.6em;
}
.c3-chart-arcs .c3-chart-arcs-gauge-max {
    fill: #777;
}
.c3-chart-arcs .c3-chart-arcs-gauge-min {
    fill: #777;
}

.c3-chart-arc .c3-gauge-value {
    fill: #000;
}


.c3-region.aqhi-2 {
    fill: #61cbff;
}
.c3-region.aqhi-3 {
    fill: #00cbff;
}

.c3-region.aqhi-4 {
    fill: #97cccd;
}

.c3-region.aqhi-5 {
    fill: #999999;
}

.c3-region.aqhi-6 {
    fill: #999a63;
}

.c3-region.aqhi-7 {
    fill: #9a6700;
}

.c3-region.aqhi-8 {
    fill: #9a662e;
}

.c3-region.aqhi-9 {
    fill: #9b3300;
}

.c3-region.aqhi-10 {
    fill: #670000;
}
.c3-region.aqhi-11 {
    fill: #ff0000;
}
.c3-region.region-day-odd {
    fill: #f6fbfd;
}
.c3-region.region-day-even {
    fill: #f2fafd;
}



/* ===== From master.css ===== */
/* $Id: master.css 79 2009-07-09 17:50:23Z DragKng $ */

/*
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, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
html {
	height: 100%;
}
body {
	line-height: 1; height: 100%;
}
blockquote, q {
	quotes: none;
}

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

/* 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
}

.datatable {
	border:1px solid #E0E0E0;
	width: 100%;
	margin-bottom: 1.5em;
	border-collapse:collapse;
}

.datatable td {
	border:1px solid #CCCCCC;
	padding: 5px;
}

.datatable th {
	background:none repeat scroll 0 0 #E0E0E0;
	border:1px solid #CCCCCC;
	padding: 5px;
}

/* -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 */
}

/* 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-size: 62.5%;
	font-family: Verdana, Helvetica, Arial, sans-serif; 
	text-align: center 
}
*/


/* default sizing for standard elements -------------------------- */   /* SET text attributes here */

p {
	margin: 1em 0 1.5em /* sets default margins for all paragraphs */
}

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

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

h1 {
	color: #000; 
	font-size: 1.4em;
	margin: 1.5em 1em 1em 0  
}
h2 {
	color: #000;
	font-size: 1.2em;
	padding-bottom: 6px 
}
h3 {
	color: #000; /* COLOUR CHANGE */
	font-size: 1.1em;
	margin: 0.5em 0 /* default margins for h tags: in this order: top/bottom, right/left */
}
h4 {
	color: #000; 
	margin: 0.5em 0 0.7em 0
}

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



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

/* positioning */
.right { /* aligns - floats right */
	float: right;
	margin-left: 20px;
	text-align: right;
	margin-right: 0 
}
.left { /* aligns - floats left */
	float: left;
	margin-right: 20px;
	margin-left:0
}
.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: .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
}

/* SEARCH BAR - submit (go) button default */

.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: #bfbfbe; border: none; float: left; clear: both; width: 96%; margin: 1em 0}
hr.thick { height: 3px; color: #666; background-color: #667} /* 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 */

a {
	text-decoration: none;
	color: #06c;
	/*color: #0e6789;*/
	background-color: transparent
}
a:visited {
	color: #551a8b;
	/*color: #666*/
}

#language a,  a:link,  a:visited,  a:active {
	text-decoration: none;
	font-weight: bold;
	color: #06c;
	/*color: #0e6789;*/ /* COLOUR CHANGE */
	background-color: transparent
}
a:hover {
	text-decoration: underline;
	color: #000 /* COLOUR CHANGE */
}
/* default link style */

/* --- SITE HOLDER(wrapper) ---- */

#wrapper {
	margin-left:auto;
	margin-right:auto;
	text-align: left;
	width:1000px;
	margin-top: 10px
}

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

#left_column {
	/*width: 260px;*/
	width: 250px;
	display:inline;
	float:left;
	/*margin-right:20px;*/
	margin-right: 30px;
	margin-left:0;
	font-size: 1.2em; /* STANDARDIZE */
	line-height: 160% /* STANDARDIZE */
}

#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%;
	height: 100%;
	border-bottom: 1px solid #000; /* ncs may 29/09 - added top border call */
	border-top: 1px solid #000;
	float: left;
	position: relative;
	background: #4a1910 url(../images/arc_left.gif) no-repeat; /* COLOUR CHANGE header BG image match #colour to bottom half of arc graphic */
	display: block;
	font-size: 100%; /* ncs jun2/09 added font-sizing - for backwards compatibility */
	font-size: 1.1em /* ncs jun2/09 added font-sizing - for backwards compatibility */
}
.leftnav .header a { 
	color: #333;
	font-weight: bold;
	/* display: block; */
	padding: 4px 5px 6px 5px; /* ncs jun2/09 moved all padding to this selector for backwards compatibility */
}


.leftnav .header img, .downarrow {
	position: absolute;
	left: 235px;
	top: 7px
}
/* -- Second colour of Header bar for Menu titles -- */
.leftnav .mycolour .header {
	background: #1d2d43 url(../images/arc_left.gif) top left no-repeat /* COLOUR CHANGE header BG image match #colour to bottom half of arc graphic */
	/* may 29 - removed bottom border call */
}
.leftnav .mycolour .header a { 
	color:#333; /* COLOUR CHANGE update font to contrast w BG color (above in .leftnav .mycolour .header) */ 
	font-weight: 700
} 
.leftnav .mycolour .header a.navlink { 
	display:inline-block; 
	float:left;
	padding: 4px 12px 6px 5px;
	
}

.leftnav .mycolour .header a.navarrow {
	display: block; 
	height:23px;
	padding:0;
}
/* -- Standard MY GOVERNMENT colour of Header bar for Menu titles -- */

.leftnav .mygovt .header {
	background-color: #4a1910; /* STANDARD COLOUR - DO NOT EDIT */
	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: 700
} 

.leftnav h2 { /* ncs jun2/09 removed font-size, moved to to .leftnav .header for backwards compatibility */ padding-bottom: 0}

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

.menu a:link,.menu a:visited,.menu a:active, .menu a:hover { 
	color: #000000;
	/*color: #333  optional COLOUR CHANGE */
}


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

.menu li {
	display: inline	
}

.menu a, menu a:link, .menu a:visited, .menu a:active {	
	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: #F4F4F4 url('/on_template/triangle_right.gif') no-repeat 12px 13px

}

.menu li a.highlighted, .menu li a.highlighted:link, .menu li a.highlighted:visited, .menu li a.highlighted:active {	
	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-color: #E7E7E7;

}

.menu li li a, .menu li li a:link, .menu li li a:visited, .menu li li a:active {/* sub menu styling - positions the arrow graphic in a bit more - EDIT ncs jun2/09 added pseudo selectors for specificity*/
	font-size: .9em;
	padding: 8px 4px 8px 36px;
	background: #F4F4F4 url(../images/triangle_right.gif) no-repeat 23px 13px 
}

.menu li li a.highlighted, .menu li li a.highlighted:link, .menu li li a.highlighted:visited, .menu li li a.highlighted:active {
	font-size: .9em;
	padding: 8px 4px 8px 36px;
	background: #E7E7E7 url(../images/triangle_right.gif) no-repeat 23px 13px 
}

.menu li li li a, .menu li li li a:link, .menu li li li a:visited, .menu li li li a:active {/* sub sub menu styling - positions the arrow graphic in a bit more - July 27/10*/
	font-size: .9em;
	padding: 8px 4px 8px 50px;
	background: #F4F4F4 url(../images/triangle_right.gif) no-repeat 36px 13px 
}

.menu li li li a.highlighted, .menu li li li a.highlighted:link, .menu li li li a.highlighted:visited, .menu li li li a.highlighted:active {
	font-size: .9em;
	padding: 8px 4px 8px 50px;
	background: #E7E7E7 url(../images/triangle_right.gif) no-repeat 36px 13px 
}

.menu li li li li a, .menu li li li li a:link, .menu li li li li a:visited, .menu li li li li a:active {/* sub sub menu styling - positions the arrow graphic in a bit more - July 27/10*/
	font-size: .9em;
	padding: 8px 4px 8px 63px;
	background: #F4F4F4 url(../images/triangle_right.gif) no-repeat 48px 13px 
}

.menu li li li li a.highlighted, .menu li li li li a.highlighted:link, .menu li li li li a.highlighted:visited, .menu li li li li a.highlighted:active {
	font-size: .9em;
	padding: 8px 4px 8px 63px;
	background: #E7E7E7 url(../images/triangle_right.gif) no-repeat 48px 13px 
}

.menu li li li li li a, .menu li li li li li a:link, .menu li li li li li a:visited, .menu li li li li li a:active {/* sub sub menu styling - positions the arrow graphic in a bit more - November 29/10*/
	font-size: .9em;
	padding: 8px 4px 8px 77px;
	background: #F4F4F4 url(../images/triangle_right.gif) no-repeat 63px 13px 
}

.menu li li li li li a.highlighted, .menu li li li li li a.highlighted:link, .menu li li li li li a.highlighted:visited, .menu li li li li li a.highlighted:active {
	font-size: .9em;
	padding: 8px 4px 8px 77px;
	background: #E7E7E7 url(../images/triangle_right.gif) no-repeat 63px 13px 
}

/* MENU - Current item colour - USE to DESIGNATE THE CURRENT PAGE - add this id to the appropriate li in the menu */

#current { background-color: #fff}

/* ------------ END LEFT NAV ------------------------ */



/* ------------ HEADER - ONTARIO LOGO / BANNER FLASH / SEARCH / NAV -------------------- */
#header { 
	width: 980px;
	position: relative}

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

#arc {
	width: 100%;
	height: 92px;
	float: left;
	background: #dff0f7 url(../images/header_arc.gif) no-repeat}

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

#searchBox { /* search box */
	height: 1.5em;
	padding: 3px;
	border: 0;
	background-color: #fff; 
	border: 1px solid #dff0f7}
	
#submit { /* submit (go) button */
	border: 0;
	color: #fff
}

#submit:hover {
	border: 1px solid #fff;
	margin: -1px;
}
/* -- top nav -- */

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

#textlinks {
	position: absolute;
	right: 0;
	top: 5px;
	text-align: right;
	margin-right: 0 /* added jun2/09 */
}

#textlinks a {
	padding: 0 1em 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}


#navbar { /* the main nav bar */
	width: 100%;
	height: 2.75em;
	float: left;
	/*border-bottom: 8px solid #FFF; */
	background-color: #1d2d43  /* COLOUR CHANGE - replace Background colour with your colour that matches the graphic */
}


#home #toptab_menu {
	border-bottom: 4px solid #FFF
}

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

#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 #FFFFFF; ncs removed border call to leave only in changeme - for older layouts (so they can remove it) */
}
/* -- END topnav --*/

#breadcrumbs {
clear:left;
padding:5px 0;
}

#breadcrumbs ul {
list-style:none outside none;
margin:0;
}

#breadcrumbs ul li {
float:left;
list-style:none outside none;
margin:0;
padding:0;
}

#breadcrumbs ul li a {
color: #666;
}


#banner { /* holds flash banner or static banner */
	width: 980px;
	height: 185px;
	overflow: hidden; /* Necessary for IE6 */
	clear: left;
	margin-bottom: 10px;
	border-bottom: 4px solid #453617
}
/* END flash banner or static banner */

/* SPLASH STYLES */
#container, #splash_page #container {
	width: 720px;
	text-align: center;
	margin: 0 auto
}
#splash { 
	margin-top: 50px;
	float: left;
	padding-bottom: 80px;
	font-size: 1.3em;
	text-align: left;
	background: url(../images/header_arc.gif) no-repeat bottom left;
	border: 1px solid #8d2f0e;
	border-bottom: 2em solid #8d2f0e
}

#splash .two_cols { 
	background: url(../images/splash_line.gif) no-repeat top center; 
	float: left;
	width: 100%;
	text-align: center;
	padding-top: 3em
}

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

#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: #000; text-transform: uppercase;/* COLOUR CHANGE - match if you like */} 

/* -- FULL COLUMN / CONTENT --*/
#full_column { /* content area */
	width: 980px;
	font-size: 1.3em; /* STANDARDIZE */
	line-height: 1.3em; /* STANDARDIZE */
	display: inline;
	overflow: hidden;
}

/* -- RIGHT COLUMN / CONTENT --*/
#right_column { /* content area */
	width: 700px;
	float: right;
	margin-right: 20px;
	font-size: 1.3em; /* STANDARDIZE */
	line-height: 1.3em; /* STANDARDIZE */
	display: inline;
	overflow: hidden;
}
body#onecol div#right_column { /* content area for one column layouts */
	width: 980px;
	float: right;
	margin-right: 20px;
	font-size: 1.3em; /* STANDARDIZE */
	line-height: 1.3em; /* STANDARDIZE */
	overflow: hidden
}
/* -- AD BANNER --*/
#ad_banner{/*padding-bottom:1em;*/
clear:both;border:1px solid #ccc;background-color:#30F;margin-bottom:20px;width:698px;overflow:hidden;height:87px}
#ad_banner div{margin:-1px 0 0 -4px}

#footer {
	clear: both;
	width: 980px;
	padding-top: 10px
}
.row { /* a style to contain other elements on the page - gives a dotted border at the bottom of the area */
	width: 720px;
	display: inline;
	margin-right: -3px; /* IE 6 duplicate text fix */
	margin-bottom: 20px;
	border-bottom: 1px dotted #ccc;
	overflow: hidden
}

.row_admin { /* a style to contain other elements on the page - gives a dotted border at the bottom of the area */
	width: 720px;
	float: left;
	display: none;
	margin-right: -3px; /* IE 6 duplicate text fix */
	margin-bottom: 20px;
	margin-top:5px;
	border-bottom: 1px dotted #ccc;
	border-top: 1px dotted #ccc;
	padding:5px 0 5px 0;
	overflow: hidden;
}

body#onecol .row { /* a style to contain other elements on the page - gives a dotted border at the bottom of the area */
	width: 1000px
}
.row p { margin-right: 20px}

.two_cols {
	background: url(../images/two_cols.gif) repeat-y;	background-position: -5px 0
}
.three_cols {
	background-image: url(../images/three_cols.gif);
	background-repeat:repeat-y;
	background-position: -4px -50px
}


.two_cols .column { /* when a .column is placed inside a two_cols row you get 2 equal columns of 340px that fill the right_column */
	width: 340px}

.three_cols .column, .box .column, .two_thirds .other { /* when a .column is placed inside a three_cols row you get 3 equal columns of 220px that fill the right_column */
	width: 220px}

.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: 460px}

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

#full_footer { /* changed from orginal 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;
	font-size: .9em
}
#footer p.right { margin-right: 0}
#footer a { color: #666}

/* --- TITLE BARS --- */

.row .header { /* a full length header that spans all columns -USE: wrap .header in a .row */
	width: 700px;
	height: 100%;
	position: relative;
	border-top: 3px solid #666;
	border-bottom: 1px solid #999;
	background-color: #e0e0b7; /* COLOUR CHANGE the background colour to your site's colour scheme */
	background-image: url(../images/arc_right_main.gif);
	background-repeat: no-repeat; 
	margin-right: 20px
}

/* ---- V1.2 code for early adopters --- */
.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}
.two_cols .column .header { /* 2 seperate headers - USE: class="row two_cols" nest .content div inside, then nest .header div inside that */
	width: 340px}
.three_cols .column .header, .two_thirds .other .header { /* 3 seperate headers - USE: class="row three_cols" nest .content div inside, then nest .header div inside that */
	width: 220px}
.two_cols .split_lrg .content {
	padding: 0 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;
	width: 160px; 
	padding: .8em 0 0 10px
} 

.row .splt_lrg .header { margin-bottom: 0}

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

.column, .two_cols .column, three_cols .column, .two_thirds .column, .box, .two_thirds .other  {
	display:inline;
	float:left;
	overflow: hidden;
	margin-left:0;
	margin-right:19px
}
/* ---- END V1.2 code for early adopters --- */
/* ------ HEADERS MORE ------ */
.header h1 {
	color: #494627;
	margin: 5px 10px 0 10px;
	padding: 0 0 5px 0;
	font-size: 1.2em;
	float: none
}

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

.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: 0 0 0 30px;
	font-size: .8em;
	font-weight: bold;
	text-transform: uppercase
}

.blogmore { /* style for the more> links pulls the more out 30px from the right side of the block */
	position: relative;
	font-size: .8em;
	font-weight: bold;
	text-transform: uppercase
}

.blogtitle {
	color: #123207 !important;
	text-decoration: none;
}

.blogmore img { /* positions the chevron/arrow after the MORE link */
	margin-left: 5px;
}

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

.more a { color:#000; line-height: 1.9em}

/* coloured box */

.box {
	float: left;
	width: 720px;
	background-color: #f8f6d7;
	border-bottom: 1px solid #666;
	margin: 10px 0 20px 0;
	overflow: hidden
}

.box h3, .box p, .box ul, .box table { margin-left: 20px; margin-right: 20px}
.box table td { border-top: 1px dotted #666}

.box .more { right: 46px; padding-left: 40px}

/* ---- PAGE ACTIONS (email,print,accessibility ) ----*/
#pageActions{margin:0 !important;padding:0;float:right;text-transform:uppercase}
#pageActions a:hover{text-decoration:underline}
ul#pageActions, #pageActions ul {list-style-image:none;list-style-position:outside;list-style-type:none;padding: 2px 0 0}
#right_column  #pageActions li{list-style-type:none;float:left;font-weight:bold}
#pageActions li.email{background:url(../images/icon_email.gif) no-repeat 1px 1px !important;font-size:.8em;font-family:arial;margin:0 !important}
#pageActions .email a{margin:0;padding:0 10px}
#pageActions li.print{background:url(../images/icon_print.gif) no-repeat 1px 1px !important;font-size:.8em;font-family:arial;margin:0 !important}
#pageActions .print a{margin:0;padding:0 5px 0 10px}
#pageActions li.accessibility{background:url(../images/icon_accessible.gif) no-repeat 5px 1px !important;padding:0;margin:0 !important;font-size:.8em;font-family:arial}
#pageActions .accessibility a{margin:0;padding:0 0 0 26px}
#pageActions li.share{background:url(../images/icon_share.gif) no-repeat 5px 1px !important;padding:0;margin:0 !important;font-size:.8em;font-family:arial}
#pageActions .share a{margin:0;padding:0 0 0 18px}
#pageActions li.rss{background:url(../images/icon_rss.gif) no-repeat 2px 1px !important;font-size:.8em;font-family:arial;margin:0 !important}
#pageActions .rss a{margin:0;padding:0 10px 0 12px}
/* --- Photo/Nav Tops and Bottoms (decoration) -- */

img.photo, #spotlight img  {	border-top: 1px solid #fff;	border-bottom: 1px solid #fff;	width: inherit;	float: left}
.column img.photo, .content img.photo, #spotlight img { width: 210px; margin-left:5px}
.photocap  { background-repeat: no-repeat; height: 6px; line-height: 1px; font-size: .1em; clear: left; margin-left:5px} /* used for the left floated series of images - you can put a caption below - this styles that caption */
#left_column .photocap { margin-left:0}
.photo_top    { width: 210px; background-image: url(../images/corner_photo_top.gif); background-position: top left;  margin-left:5px; margin-top: 10px}
.photo_bottom { width: 210px; background-image: url(../images/corner_photo_bottom.gif); background-position: bottom left; margin-left:5px}
.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}
#left_column .photolink { /*width: 260px;*/ width: 250px}
.photolink       { width: 125px; float: left}
.photolink a     { font-weight: bold}
.photolink .text { float: left; padding: 5px 0 0 5px; color: #FFF /* set colour of link text under photos/ministers photo here */}

.icon_top     { width:125px; background-image: url(../images/corner_icon_top.gif); background-position: top left}
.icon_bottom  { width:125px; background-image: url(../images/corner_icon_bottom.gif); background-position: bottom left}
.icon { 	width: 125px; 	float: left; padding-bottom: 20px}
.icon .photolink, .icon .photocap { padding-right:0; margin-left:0}

.spacer { float: left; width: 40px}
.half_spacer { float: left; width: 19px}

.mini_spacer { float: left; width: 5px}

/* -- COLOURS --*/
.grey { background-color: #aaa}
.mycolour { background-color: #000}
.red { background-color:#F30}

/* --- CONTENT AREA LISTS --- */

#right_column ul li {
	list-style-type:disc;
	color:#000;
	margin-left: 20px;
	padding-left: 5px;
	line-height: 150%
}
#right_column ol li {
	list-style-type: decimal;
	color:#000;
	margin-left: 20px;
	padding-left: 5px;
	line-height: 150%
}

#right_column ol li ul li {
	list-style-type: disc;
	color:#000;
	margin-left: 20px;
	padding-left: 5px;
	line-height: 150%
}


#right_column ul li {
	color: #566d1b /* text color for lists in content area */
}

.column li a, .content li a { font-size: 90%}
.column ul, .content ul   { margin: 0; padding: 0; margin-bottom: 20px; margin-top: 10px}

/* ------ GRID - ------------ */



.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_8plus, .grid_9, .grid_10, .grid_11, .grid_12, .grid_13, .grid_14, .grid_15, .grid_16  {
	display:inline;
	float:left;
	border-right: 1px dotted #ccc;
	overflow: hidden;
	margin-left:0;
	padding-right: 9px;
	margin-right:10px
}

.grid_other {
width: 220px;
	display:inline;
	float:left;
	overflow: hidden;
	margin-left:0;

}

/*.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12, .grid_13, .grid_14, .grid_15, .grid_16 {
	background-color: #CCFFFF;
	border: 1px dotted green;
}*/ /* For planning, testing debugging */
/* widths WIDER THAN THE #right_column NAV GRID BOXES */
#wrapper .grid_16, .grid_16 .header { /* whole page minus 20px (nav extra space) */	width:960px}
#wrapper .grid_15, .grid_15 .header {	width:880px}
#wrapper .grid_14, .grid_14 .header {	width:820px}
#wrapper .grid_13, .grid_13 .header {	width:760px}

/* END widths WIDER THAN THE #right_column NAV GRID BOXES */

#wrapper .grid_12, .grid_12 .header { /* whole right_column */	width:700px}
#wrapper .grid_11, .grid_11 .header {	width:640px}
#wrapper .grid_10, .grid_10 .header {	width:580px}
#wrapper .grid_9, .grid_9 .header {	width:520px}

#wrapper .grid_8plus, .grid_8plus .header {  /* for layouts w no left nav - transitional */	width:500px}
#wrapper .grid_8, .grid_8 .header { /* two thirds of right_column */	width:460px}
#wrapper .grid_7, .grid_7 .header {	width:400px}
#wrapper .grid_6, .grid_6 .header { /* half of right_column */	width:340px}
#wrapper .grid_5, .grid_5 .header {	width:280px}
#wrapper .grid_4, .grid_4 .header { /* one third of right_column */	width:220px}
#wrapper .grid_3, .grid_3 .header { /* a quarter of right_column */	width:160px}
#wrapper .grid_2, .grid_2 .header {	width:100px}
#wrapper .grid_1, .grid_1 .header {	width:40px}

/* ------ GRID - ------------ */
.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_8plus,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16
{display:inline;float:left;border-right:1px dotted #ccc;overflow:hidden;margin-left:0;padding-right:9px;margin-right:10px}
.grid_6plus,.grid_7plus,.grid_9plus,.grid_10plus,.grid_11plus,.grid_12plus,.grid_13plus,.grid_14plus,.grid_15plus,.grid_16plus
{display:inline;float:left;/*border-right:1px dotted #ccc;*/overflow:hidden;margin-left:0;padding-right:9px;margin-right:10px}

/* *******-- grid_#plus<--- ******* whole page FOR CURRENT 980px width - adapted grid adds 20px to accomodate the first round of templates */
#wrapper .grid_16plus,.grid_16plus .header {width:980px}
#wrapper .grid_16,.grid_16 .header{/* whole page minus 20px (nav extra space) */width:960px}
#wrapper .grid_15plus,.grid_15plus .header {width:900px}
#wrapper .grid_15,.grid_15 .header {width:880px}
#wrapper .grid_14plus,.grid_14plus .header{width:840px}
#wrapper .grid_14,.grid_14 .header {width:820px}
#wrapper .grid_13plus,.grid_13plus .header{width:780px}
#wrapper .grid_13,.grid_13 .header {width:760px}
/* END widths WIDER THAN THE #right_column NAV GRID BOXES */
#wrapper .grid_12plus,.grid_12plus .header{width:720px}
#wrapper .grid_12,.grid_12 .header {width:700px}/* width of whole right_column WITH NAV */
#wrapper .grid_11plus,.grid_11plus .header{width:660px}
#wrapper .grid_11,.grid_11 .header {width:640px}
#wrapper .grid_10plus,.grid_10plus .header {width:600px}
#wrapper .grid_10,.grid_10 .header {width:580px}
#wrapper .grid_9plus,.grid_9plus .header{width:540px}
#wrapper .grid_9,.grid_9 .header {width:520px}
/* for layouts w no left nav - transitional */
#wrapper .grid_8plus,.grid_8plus .header{width:500px}
#wrapper .grid_8,.grid_8 .header {width:460px}/* two thirds of right_column WITH NAV */
#wrapper .grid_7plus,.grid_7plus .header{width:420px}
#wrapper .grid_7,.grid_7 .header {width:400px}
#wrapper .grid_6plus,.grid_6plus .header{width:360px}
#wrapper .grid_6,.grid_6 .header {width:340px/* half of right_column WITH NAV */}
#wrapper .grid_5,.grid_5 .header {width:280px}
#wrapper .grid_4,.grid_4 .header {width:220px}/* one third of right_column WITH NAV */
#wrapper .grid_3,.grid_3 .header {width:160px}/* a quarter of right_column WITH NAV */
#wrapper .grid_2,.grid_2 .header {width:100px}
#wrapper .grid_1,.grid_1 .header {width:40px}
/* -- USEFUL for NESTING grid items -- remove last margin in set */

.nomargin { margin: 0} /* removes all margins */
.noborder { border: 0} /* removes all borders */
.borderboth { padding-left:9px;border-right: 1px dotted #ccc;border-left: 1px dotted #ccc}
/* --------- CLEARING ------------*/
html body div.clear, html body span.clear {
	background:none;
	border:0;
	clear:both;
	display:block;
	float:none;
	font-size:0;
	margin:0;
	padding:0;
	overflow:hidden;
	visibility:hidden;
	width:0;
	height:0
}
* html .clearfix {
	height:1%
}
.clearfix {
	display:block
}
/* clearfix */
.clearfix:after, .row:after {content:".";display:block;height:0;clear:both;visibility:hidden}
.clearfix, .row {display:inline-block} /*Those two .clearfix have to be separate!)*/
.clearfix, .row {display:block}

/* CHANGE-ABLE */

#right_column .content .nobulletlist li {
	margin: 0;
	padding: 0;
	list-style-type: none
}

#home .initiatives p {
	background:transparent url(../images/arrowblue_right.gif) no-repeat scroll 203px 12px;
	border-bottom:1px dotted #999999;
	margin:0;
	padding:9px 9px 9px 9px;
	width:200px;
	font-size:90%;
}
#home .initiatives p.last {
	border:0 none;
}



/* ===== From new.css ===== */
.landingDescription {margin:0 0 2px 15px; padding:0; font-size:0.9em; line-height:1.1em;}

#taxonomy {margin:0 0 5px 0; padding:0; font-size:0.8em;}
#filedunder {margin:0 0 5px 0; padding:0; font-size:0.8em;}

.indexTitle {margin:0 0 2px 0; padding:0; font-size:1.0em;}
.indexDescription {margin:0 0 5px 0; padding:0; font-size:1.0em;}
.indexTags {margin:0; padding:0; line-height:1.0em; font-size:0.8em;}
.indexDate {margin:0; padding:0; font-size:0.8em;}

#sortable { list-style-type:none; margin:0; padding:0; width:100%; }
#sortable li { margin:0 0 5px 0; padding:5px 5px 10px 5px; font-size:1.0em; height:1.0em; }

.updateInvisible {CLEAR:both;VISIBILITY:hidden;HEIGHT:0px;position:relative; }

.formTitle { font-family:Verdana,Arial,Helvetica,sans-serif;font-size:100%;width:315px; }
.formText { font-family:Verdana,Arial,Helvetica,sans-serif;font-size:100%;width:211px; }
.formInput { font-family:Verdana,Arial,Helvetica,sans-serif;font-size:100%;width:215px; }
.formDropdown { font-family:Verdana,Arial,Helvetica,sans-serif;font-size:100%;width:319px; }
.formTextarea { font-family:Verdana,Arial,Helvetica,sans-serif;font-size:100%;width:315px; }
.formInvisible {CLEAR:both;VISIBILITY:hidden;HEIGHT:0px;position:absolute; }

.row-related { 
	width: 720px;
	float: left;
	display: inline;
	margin-right: -3px; 
	margin-bottom: 20px;
	overflow: hidden;
	display:block;
}

.row-related .column { 
	width: 340px;
}

.row-related .column .content h3 { 
	border-bottom: 1px dotted #ccc;
	background-image: url(../images/arrowblue_right.gif);
	background-position: 0px 5px; 
	background-repeat:no-repeat;
	padding-left: 15px;
	height: 1%;
}

.row-related .column .content h3 a{ 
	color:#494627;
}

#rightbox {
   float: right; 
   width: 260px; 
   margin-left: 20px;
   margin-bottom: 5px;
   padding-bottom: 5px;
}


#rightbox #tabs ul li { font-size:0.9em; list-style-type:none; margin-left:0; padding-left:0; line-height:150%; }
#rightbox #tabs ul li a { text-decoration:none; }
#rightbox #tabs p { font-size:0.9em;}
#rightbox #tabs h2 { font-size:1em}
#rightbox #tabs-1 ul li { list-style-type:disc;}

#categories { margin:-10px 0 10px 0; font-size:0.8em; }
#tags { margin:10px 0 10px 0; font-size:0.8em; line-height:0.9em; }
#sort { margin:-10px 0 10px 0; font-size:0.8em; }

.pageFindWrapper {
  float: right;
  margin: 0 20px 0 0;
  width: 700px;
  display: inline;
}

.pageFind {
  color:#5A5A5A;
  float:right;
  font-size:1.1em;
  font-weight:bold;
  margin:0 !important;
  position:relative;
}

.pageFindText {
  float:left;
  margin:1px 0 0;
  position:relative;
}

#pagenumber {
  border:1px solid #DADBD5;
  height:15px;
  width:49px;
  margin-right:2px;
}

.pageShareText {
  float:left;
  margin:1px 10px 5px 0;
  position:relative;
}

.pageShareEmailShare {
  float:left;
  margin:0;
  position:relative;
}

.pageShareFBShare {
  float:left;
  margin-left:5px;
  position:relative;
}

.pageShareTWITShare {
  float:left;
  margin-left:5px;
  position:relative;
}

.pageShareLinkedShare {
  float:left;
  margin-left:5px;
  position:relative;
}

#index { font-size:0.8em; margin-bottom:10px; }

#indexResults ul ul {margin-bottom: 0px;}

.emptyNavigation {background-color:#F4F4F4;border-bottom:1px dotted #666666;padding:5px;}
.emptyNavigation select {width:100%;margin-top:5px;}

#resources {
  display:inline;
  float:left;
  margin-bottom:20px;
  margin-right:-3px;
  overflow:hidden;
  width:720px;
}

#resources .categories { font-size:0.7em; }
#resources .tags { font-size:0.7em; }

.search_greySmall {
	color:#999999;
	font-size:0.9em;
}

.resultsList  {
	clear: both;
	line-height:1.3em;
	margin:10px 0 10px 18px;
}


.resultsList li {
	padding-bottom: 10px;
}

.searchNews {
	background-color: #9ad367;
	padding: 20px;
	border: solid 3px #88c254;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
	width: 400px;
}

.searchNews .searchNewsButton {
	width: 120px;
}

.searchNews .searchNewsBox {
	width: 260px;
}

.resourceBox { margin:20px 10px 20px 10px; }
.resourceText { font-family:Verdana,Arial,Helvetica,sans-serif;font-size:100%;width:346px; }
.resourceDropdown { font-family:Verdana,Arial,Helvetica,sans-serif;font-size:100%;width:350px; display:block; }
.resourceInvisible {CLEAR:both;VISIBILITY:hidden;HEIGHT:0px;position:absolute; display:none; }
/*
.resourceTable {
	width: 700px;
	margin-right: -3px;
	border-spacing:1px;
	border-collapse:separate !important;
}

.resourceTable th, .resourceTable .tablehead {
	background-image: url(../images/resource_subheader_gradient.gif);
	background-repeat: repeat-x;
	border-bottom: 1px solid #C2C2C2;
	color: #444444;
	padding: 3px 6px;
}

.resourceTable th a, .resourceTable .tablehead th a {
	color: #444444;
}

.resourceTable td {
	padding: 3px 6px;
}
*/
.resourceTable td.evenrow {  
	background-color: #F1F1F1;
}

.resourceTable td.oddrow {  
	background-color: #FFFFFF;
}

.resourceDropdownListItem {
	background-color:#F4F4F4;
	border-bottom:1px dotted #666666;
	color:#000000;
	display:block;
	font-weight:bold;
	padding:8px 4px 10px 24px;
	background:url("../images/triangle_right.gif") no-repeat scroll 12px 13px #F4F4F4;
} 
.resourceDropdownNav { 
	font-family:Verdana,Arial,Helvetica,sans-serif;
	font-size:100%;
	width:175px; 
}

.headline_date {
	color:#000;
	font-weight:bold;
}

.dykhome {
	padding-bottom: 1px;
}
.dykhome .dykimg {
	float: left; 
	margin-right: 10px; 
	width: 150px;
}

.sidebar_4 {
	border-bottom: 1px dotted #CCCCCC;
	width: 220px;
	float: right;
	margin: 5px -3px 10px 10px;
	overflow: hidden;
	
}

.sidebar_4 .header {
	background-color:#DCE4EF;
	background-image:url("../images/arc_right_main.gif");
	border-bottom-color:#AAAAAA;
	color:#2E5B1E;
	border-bottom:1px solid #999999;
	border-top:3px solid #B9C6CE;;
	height:100%;
	width:100%;
	margin-right:20px;
	position:relative;
}

.downloadTable {
	width: 700px;
	border-collapse:separate !important;
	margin-bottom:10px;
}

.downloadTable th, .downloadTable .tablehead {
	background-image: url(../images/resource_subheader_gradient.gif);
	background-repeat: repeat-x;
	border:#000000 1px solid;
	color: #444444;
	padding:2px;
}

.downloadTable th a, .downloadTable .tablehead th a {
	color: #444444;
}

.downloadTable td {border:#000000 1px solid; padding:2px;}

.downloadTable td.hide {border:#FFFFFF 1px solid;}

.downloadTable td.evenrow {  
	background-color: #F1F1F1;
}

.downloadTable td.oddrow {  
	background-color: #FFFFFF;
}

#top-tabs {
	list-style-type: none;
	padding: 0;
	margin: 0px;
}

#top-tabs li {
background:url("../images/tab-bottom.gif") no-repeat scroll left bottom transparent;
border-right:2px solid #FFFFFF;
display:block;
float:left;
height:3em;
margin:0;
padding:0;
width:160px;
}
 
#top-tabs li.notab {
background:url("../images/tab-bottom2.gif") no-repeat scroll left bottom transparent;
border-right:0 none;
width:332px;
}


#top-tabs li.notab_short {
	width: 254px;
	border-right: 0px;
}

#top-tabs li a {
	display: block;
	font-weight: bold;
	color: #FFF;
	text-decoration: none;
	margin-top: 8px;
	margin-left: 10px;
	font-size: 1.2em;
}

#toptab_menu {border-top: 4px solid #f4f4f4; float:left;}

#top-tabs li {
	background-color: #42782f;
}

#top-tabs li.active {
	background-color: #88c254;
}

#top-tabs li:hover {
	background-color: #88c254;
}

#top-tabs li.notab, #top-tabs li.notab_short {
	background-color: #e2e6d5;
}

.blankTab {margin-top: 3px;}

#right_column #residentsmenu ul li {
	padding-left:0px;
	margin-left:0px;

}
#residentsmenu ul {
	padding:0px;
	margin:0px;
}

#residentsmenu ul li {
	padding:0px;
	margin:0px;
	display:inline;
}


#residentsmenu a {
	background:url("../images/home_tab_unselected.png") no-repeat;
	display:block;
	font-weight:bold;
	padding:15px 4px 15px 24px;
}

#residentsmenu a:hover {
	background:url("../images/home_tab_rollover.png") no-repeat;
	display:block;
	font-weight:bold;
	padding:15px 4px 15px 24px;
}

#residentsmenu a.active {
	background:url("../images/home_tab_selected.png") no-repeat;
	display:block;
	font-weight:bold;
	padding:15px 4px 15px 24px;
}

.res_spacer {
	float:left;
	width:15px;
}

.res_icon {
	float:left;
	padding-bottom:20px;
	text-align:center;
	width:120px;
}

.res_icon a img {
	border: 3px solid #fff;
	margin-bottom: 5px;
}

.res_icon a:hover img {
	border: 3px solid #9ad367;
	margin-bottom: 5px;
}

#right_column .res_icon a {
	color: #fff;
}

#right_column .res_icon a:hover {
	text-decoration:none;
	color: #9ad367;
}

.res2column {
	background-image: url(../images/res2_cols.gif);
	background-repeat:repeat-y;
	background-position: -8px -50px
}
/*
.resourceTable {
	width: 700px;
	margin-right: -3px;
	border-spacing:1px;
	border-collapse:separate !important;
}
*/
.smallTable th, .smallTable .tablehead {
	background-image: url(../images/resource_subheader_gradient.gif);
	background-repeat: repeat-x;
	border-bottom: 1px solid #C2C2C2;
	color: #444444;
	padding: 3px 6px;
	font-size: 9px;
	line-height: 10px;
}

.smallTable th a, .smallTable .tablehead th a {
	color: #444444;
}

.smallTable td {
	padding: 3px 6px;
}

.smallTable td.evenrow {  
	background-color: #F1F1F1;
}

.smallTable td.oddrow {  
	background-color: #FFFFFF;
}