body {
font-family: verdana, arial, helvetica, sans-serif;
}

tr.calendar { background-color: #003366; }
td { text-align: left; }
td.calendarColumnHead { width: 14%; height: 25px; font-weight: bold; font-size: 85%; text-align: center; color: #FFFFFF; }
td.calendarColumn { width: 12%; height: 100px; vertical-align: top; }
div.calendarColumn { font-size: 90%; font-weight: normal; overflow: hidden; font-family: arial narrow, arial, helvetica; }
.disclaimer {font-size: 75%; }
.small {font-size: 85%; }
tr.even, div.even {
	background-color: #99ccff;
} 
tr.odd, div.odd {
	background-color: White;
} 

ol.none {
font-weight: normal;
}

ol.none li.none {
font-weight: normal;
}

div.maintext {
clear: both;
text-align: left;
}

div.maintext a {
color: #0066CC;
font-weight: bold;
}

div.maintext a:visited {
color: #003366;
}

div.maintext a:hover {
color: #CC6600;
}

div.image-top {
clear:both;
margin: 0px 0px 10px 0px;
padding: 5px;
/*background-color: #CCCCCC;*/
}

div.image-left {
float:left;
margin: 0px 10px 10px 0px;
padding: 5px;
/*background-color: #CCCCCC;*/
}

div.image-right {
float:right;
margin: 0px 0px 10px 10px;
padding: 5px;
/*background-color: #CCCCCC;*/
}

span.imageCaption {
	font-size: 90%;
	font-style : italic;
	position: relative;
	color: #003366;
}

span.module-head {
padding: 10px 0 0 0;
font-size: 80%;
color: #999999;
letter-spacing: 12px;
font-weight: bold;
clear:both;
width:100%;
}

span.module-notes {
font-size: 75%;
color: #999999;
clear:both;
}

ul.module {
text-align: left;
}

ul.module li.category {
 clear: both;
 width:100%;
  margin: 0;
  padding: 0;
  font-weight: bold;
  list-style: none;
  text-align: left;
} 

ul.module li.description {
  padding: 0 0 10px 0;
  list-style: none;
  text-align: left;
} 


div.tiers {
	width: 100%;
	color: #FFFFFF;
	/*border-bottom: 2px white solid;
	border-top: 2px solid #CC6600;*/
}

div.tiers div.nav {
	color: #FFFFFF;
	border-bottom: 1px white dotted;
	padding-right:0px;
}

div.tiers div.nav-active {
	border-bottom: 1px white solid;
	color: #006699;
	font-weight: bold;
	background-color : White;
	padding-right:0px;
}

div.tiers div.cat {
	color: #ffffFF;
	border-bottom: 1px white solid;
	font-weight: bold;
	padding-top:5px;
	padding-right:0px;
}

div.tiers div.nav a,
div.tiers div.cat a {
	color: #FFFFFF;
	text-decoration: none;
	display: block;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 5px;
}

div.tiers div.nav-active a.active,
div.tiers div.cat-active a.active {
	color: #CC6600;
	font-weight: bold;
	background-color : White;
	text-decoration: none;
	display: block;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 5px;
}

div.tiers div.nav a:hover,
div.tiers div.cat a:hover {
	background-color: #0066CC;
}

div.row {
  clear: both;
  padding-top: 10px;
  width: 95%;
  text-align: center;
  }

div.row span.label {
  float: left;
  width: 15%;
  text-align: right;
  }
  div.row span.label-required {
  float: left;
  width: 15%;
  text-align: right;
  color: #FF0000;
  }

div.row span.labelWide {
  float: left;
  width: 50%;
  text-align: right;
  }
  
div.row span.left {
  float: left;
  width: 45%;
  text-align: center;
  }

div.row span.formw {
  float: right;
  width: 80%;
  text-align: left;
  } 
  div.row span.form80 {
  float: right;
  width: 80%;
  text-align: left;
  } 
  div.row span.form45 {
  float: left;
  width: 45%;
  text-align: left;
  } 
  div.row span.form30 {
  float: left;
  width: 30%;
  text-align: left;
  } 
  div.row span.form15 {
  float: left;
  width: 15%;
  text-align: left;
  } 
  div.row span.form20 {
  float: left;
  width: 20%;
  text-align: left;
  } 
div.row span.right {
  float: right;
  width: 45%;
  text-align: center;
  }
  
  div.categories {
  clear: both;
  padding-top: 2px;
  width: 100%;
  text-align: center;
  } 
  div.categories span.half {
  float: left;
  width: 45%;
  text-align: left;
  padding: 0;
  margin: 0;
  }
  
   div.categories div.half {
  float: left;
  width: 45%;
  text-align: left;
  padding: 0;
  margin: 0;
  }
  
div.form { 
width: 90%; 
/*background-color: #cc9; 
border: 1px dotted #333; */ 
padding: 5px; 
margin: 0px auto;
}
div.form table { table-layout: fixed; }
input, textarea, select { width: 100%; position: relative; }
input.submit { width: 50%; background-color: #003366; color: #FFFFFF; font-weight: bold; }
input.multi_submit { width: 90%; background-color: #003366; color: #FFFFFF; font-weight: bold; }
input.full_submit { width: 100%; background-color: #003366; color: #FFFFFF; font-weight: bold; }
input.checkbox, input.radio { width:20px; height: 20px; }

h1 { font-size: 175%; color: #003366; padding: 10px 0px 0px 0px; margin: 0; text-align: left; }
.subhead { font-size: 145%; color: #0066CC; padding: 0px 0px 10px 0px; margin: 0; font-weight: normal; text-align: left; }
h2 { font-size: 135%; color: #999933; padding: 10px 0px 4px 0px; margin: 0; text-align: left; }
h3 { font-size: 120%; }
h4 { font-size: 110%; }
h5 { font-size: 90%; }
h6 { font-size: 75%; }

/* header styles */
    div#header {
		clear:left;
		float:left;
		width:100%;
		overflow:hidden;
		text-align: center;
		color: #99ccff;
		position: relative;
    }
	div#header p,
	div#header h1,
	div#header h2 {
		clear:left;
		float:left;
		width:96%;
		margin:0;
		padding:.4em 2% .1em 2%;
	}
	div#header a.inactive {
	color: #FFFFFF;
	font-weight: bold;
	font-size: 85%;
	font-family: arial, helvetica;
	text-decoration: none;
	padding: 10px 10px 15px 10px;
	height: 30px;
	position: relative;
	}
	div#header a.active {
	font-weight: bold;
	font-size: 85%;
	font-family: arial, helvetica;
	text-decoration: none;
	background: #999933;
	color: #FFFFFF;
	padding: 10px 10px 15px 10px;
	height: 30px;
	position: relative;
	}
	div#header a:hover {
	color: #66CCFF;
	}
	div#header a.active:hover {
	color: #FFFFFF;
	}
	div#header ul {
	margin: 15px 0 0 0;
	padding: 0;
	position: relative;
	}
	div#header li {
	 display: inline;
	 position: relative;
	}
	    div#footer {
		clear:left;
		float:left;
		width:100%;
		overflow:hidden;
		text-align: center;
		color: #CC6600;
		position: relative;
		font-size: 80%;
		line-height: 150%;
    }
	div#footer a {
	color: #333333;
	font-family: arial, helvetica;
	text-decoration: none;
	}
	div#footer a.orange {
	color: #CC6600;
	font-family: arial, helvetica;
	text-decoration: none;
	}

	
/* subheader styles */
    div#subheader {
		clear:left;
		float:left;
		width:100%;
		overflow:hidden;
		color: #ffffcc;
		border-bottom: 3px solid #FFFFFF;
    }
	div#subheader p,
	div#subheader h1,
	div#subheader h2 {
		clear:left;
		float:left;
		width:96%;
		margin:0;
		padding:.4em 2% .1em 2%;
	}

	
	/* subheadernav styles */
    div#subheadernav {
		width:100%;
		color: #ffffcc;
		border-top: 3px solid #FFFFFF;
		border-bottom: 3px solid #FFFFFF;
		background-color: #999933;
		text-align: center;
		clear:both;
    }
	div#subheadernav ul {
	margin: 0;
	padding: 0;
	list-style: none;
	}
div#subheadernav li {
	display: inline;
	list-style-type: none;
	line-height: 2;
}
div#subheadernav li.active {
	background: #FFFFFF;
	padding-bottom: 6px;
}
div#subheadernav a {
	padding: 6px 12px;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 85%;
	font-family: arial, helvetica;
	text-decoration: none;
	}
div#subheadernav a.active {
	border-top: 2px #999933 solid;
	color: #999933;
	}
	div#subheadernav a:hover {
	color: #CCFF66;
	}
	div#subheadernav a.active:hover {
	color: #999933;
	}
	
	
		/* Footer styles */
	div#footer {
        clear:both;
        /*padding:1em 2%;*/
		/*border-top:1px solid #ccc;*/
		width:100%;
    }
	div#topbar {
	clear:both;
	padding: 0;
	margin: 0;
	text-align: right;
	background-color: #999933;
	/*background-image: url("http://www.township.scugog.on.ca/images/top-gradient.jpg");*/
	height: 5px;
}div#midbar {
	clear:both;
	padding: 0;
	margin: 0;
	text-align: right;
	background-color: #FFFFFF;
	/*background-image: url("http://www.township.scugog.on.ca/images/top-gradient.jpg");*/
	height: 10px;
	border-top: 3px solid white;
	border-bottom: 3px solid white;
}
	div#bottombar {
	clear:both;
	padding: 2px;
	margin: 0;
	text-align: center;
	background-color: #003366;
	color: #99ccff;
	/*background-image: url("http://www.township.scugog.on.ca/images/top-gradient.jpg");*/
}

	div#bottombar ul {
	margin: 5px;
	}
	div#bottombar li {
	 display: inline;
	}
	div#bottombar a {
	 color: #FFFFFF;
	 margin: 5px;
	}
	div#bottombar a:hover {
	 color: #66CCFF;
	}
	
	HR {
display: none;
}

DIV.hr {
margin: 0;
padding:0;
height: 3px;
background-color: #fff;
width:100%;
}

DIV.hrOrange {
margin: 0;
padding:0;
height: 3px;
background: #CC6600;
width:100%;
}

div.divider {
border-top: 1px dotted white;
width:100%;
margin: 5px;
padding: 5px;
}

div.filter {
border-top: 1px solid black;
border-bottom: 1px solid black;
width:100%;
margin: 5px;
padding: 5px;
}

div.home {
float: left;
width: 192px;
height: 100%; 
}

div.home ul {
list-style-type: none;
padding: 0;
margin: 0;
}

div.home li {
border-top: 1px solid white;
padding: 2px 0px 8px 0px;
margin: auto;
width: 80%;
}

div.home a {
color: #FFFFFF;
text-decoration: none;
}

div.home a:hover {
color: #ffffcc;
}

div.home-bottom {
float: left; width: 192px; height: 82px; 
}

div.catDisplay {
position: absolute; color: #CC6600; font-size: 200%; font-family: times new roman, times, serif; font-style: italic; font-weight: bold; padding: 0 10px 10px 20px; bottom: 0; right:0; z-index: 100;
}

div.catDisplayShadow {
position: absolute; color: #FFFFFF; font-size: 200%; font-family: times new roman, times, serif; font-style: italic; font-weight: bold; padding: 0 10px 10px 20px; bottom: -1px; right:-1px; z-index: 50;
}

div.catBackoffice {
position: absolute; color: #CC6600; font-size: 200%; font-family: times new roman, times, serif; font-style: italic; font-weight: bold; padding: 0 10px 10px 20px; bottom: 0; left:0; z-index: 100;
}

div.catBackground {
background-image: url('http://www.township.scugog.on.ca/images/section-head.png'); padding: 0; margin: 0; position:relative; width:100%; height: 80px;
}

div.catBackground2 {
height: 80px; text-align: right; padding: 0; margin: 0; position:relative;
}

ul.tiers {
	width: 100%;
	color: #FFFFFF;
	/*border-bottom: 2px white solid;
	border-top: 2px solid #CC6600;*/
	padding: 0;
	margin: 0;
	background-color: #CC6600;
}

ul.tiers li.nav {
	color: #FFFFFF;
	border-bottom: 1px white dotted;
	padding-right:0px;
}

ul.tiers li.nav-active {
	border-bottom: 1px white solid;
	color: #006699;
	font-weight: bold;
	background-color : White;
	padding-right:0px;
}

ul.tiers li.cat {
	color: #ffffFF;
	border-bottom: 1px white solid;
	font-weight: bold;
	padding-top:5px;
	padding-right:0px;
}

ul.tiers li.nav a,
ul.tiers li.cat a {
	color: #FFFFFF;
	text-decoration: none;
	display: block;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 5px;
}

ul.tiers li.nav-active a.active,
ul.tiers li.cat-active a.active {
	color: #CC6600;
	font-weight: bold;
	background-color : White;
	text-decoration: none;
	display: block;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 5px;
}

ul.tiers li.nav a:hover,
ul.tiers li.cat a:hover {
	background-color: #0066CC;
}

.hiddenRight {
color: #0066CC;
display: none;
}

div.right-plug {
/*background-color: #99CCFF;*/
color: #FFFFFF;
width: 144px;
padding: 4px;
}

div.right-plug a {
color: #FFFFFF;
}

div.right-plug a:hover {
color: #ccffff;
}



    /* --> */