/* ------------------------------------------------------------------
	MAIN STYLESHEET
	
	Project: The Township of Wellington North
	
	COLOURS:	
	Blue: #201e5d
	Yellow: #e6b521

------------------------------------------------------------------- */


/* TABLE OF CONTENTS */
/* ---------------------------------------- HTML, BODY, RESETS */
/* ---------------------------------------- GLOBAL STYLES */
/* ---------------------------------------- STRUCTURE */
/* -------------------------------------------- Header */
/* ----------------------------------------------- Top Nav */
/* -------------------------------------------- Wrapper */
/* -------------------------------------------- Side Nav */
/* -------------------------------------------- Content Area */
/* ----------------------------------------------- HomePage Specific Content */
/* -------------------------------------------- Footer */
/* -------------------------------------------- Form */

@import url("reset.css");

 
/* ----------------------------------------------
	HTML, BODY, RESETS
---------------------------------------------- */

html { 
	overflow-y: scroll; /* keeps vertical scroll bar in firefox at all times so page doesn't jump around */
	height: 100%;
	}

body {
	background: #fff; /* background colour should be same as content area background colour to ensure WYSIWYG looks same as website */
	padding:0;
	margin:0;
	top:0;
	left: 0;
	font: 14px/20px Arial, Helvetica, sans-serif;
	color:#000;
	}
	.BodyStyle { /* use this class to set body background colour so that it does not interfere with the WYSIWYG editor */
		background: #fff;		
		}

img, form { /* removes all default formatting on images and forms */
	padding:0;
	margin:0;
	line-height:0;
	}
	img {
	border:1px solid #201e5d;
	}
	img.NoBorder {
	border:none;
	}
	img.Content {
	margin-top:5px;
	}
	img.BTT {
	margin:0 20px;
	}

:focus { outline: none; } /* removes dotted outline from links */

.Clear { clear: both; } /* clears all floats; apply to empty divs */

.ClearRight { clear: right; }

/* ----------------------------------------------
	GLOBAL STYLES - style as necessary
---------------------------------------------- */

a:link, a:visited {
	color: #201e5d;
	text-decoration: underline;
	}

a:hover, a:active {
	color: #e6b521;
	text-decoration: underline;
	}
	a.ExternalLink {	
		display: inline-block;	
		padding-right: 20px;	
		background: transparent url(../../images/external-link-icon.png) no-repeat center right;
		}
		#Content a[href $='.pdf'] { /* icons for document downloads */
		display: inline-block;
	  	padding-right: 40px;
	   	background: transparent url(../../images/pdf-external-icon.png) no-repeat center right;
		}		
		
p.Back {
	margin-top:20px;
	}
				
p, td, div { 
	font: 14px/20px Arial, Helvetica, sans-serif;
	}
	p {
		padding:0 0 12px 0;
		}

strong, b {
	font-weight: bold;
	}

em, i {
	font-style: italic;
	}

h1 {
	color: #201e5d;
	font: 30px/34px Arial, Helvetica, sans-serif;
	margin:20px 0 14px 0;
	text-transform:uppercase;
	}
	h1 img { border:0; }
	
h2 {
	color: #201e5d;
	font: 18px/20px Arial, Helvetica, sans-serif;
	margin:10px 0 6px 0;
	text-transform:uppercase;
	}
	
h3 {
	color: #201e5d;
	font: bold 14px/16px Arial, Helvetica, sans-serif;
	margin:10px 0 6px 0;
	}
	h3.AnchorLinks {
		padding:10px 0 20px 0;
		line-height:24px;
		}
		
ul {
	margin-bottom:24px;
	padding:0;
	}
	li {
		list-style: disc outside;
		margin: 0 0 8px 24px;
		}

ol { 
	margin-bottom:24px;
	padding:0;
	}
	

/* styles used by WYSIWYG - style as necessary */
pre { }
address { }



/* ----------------------------------------------
	STRUCTURE
---------------------------------------------- */
	
/* ---------------------------------------- Header */

#PrintHeader { display: none; }

#Header { 
	width: 940px;
	height:215px;
	margin: 0 auto;
 	}
	
.Logo { 
	float:left; 
	margin:0;
	}
	
.TextSize {
	float:left;
	margin:20px 0 0 10px;
	}
	.TextSize .Small {
		font-size:12px;
		}
	.TextSize .Med {
		font-size:14px;
		}
	.TextSize .Large {
		font-size:16px;
		}
	
	
.Search {
	width:228px;
	height:25px;
	float:right;
	margin:10px 0;
	}
				
	.Search	.Input { 
		float:left;
		background: #fff url(../../images/input-bg.gif) repeat;
		border: 1px solid #201e5d;
		width:151px;
		height:20px; 
		margin:0;
		padding:3px 0 0 3px;
		font: 12px Arial, Helvetica, sans-serif;
		}
	
	.Search	.SearchButton {
		float:left;
		width:70px;
		height:25px;
		color:#fff;
		border:none;
		background-color:#201e5d;
		font: 14px Arial, Helvetica, sans-serif;	
		cursor:pointer;
		margin:0;
		padding:0;
		}
	
.MainImage img {
	float:right;
	border:2px solid #201e5d;
	width:698px;
	height:156px;
	}



/* ---------------------------------------- Top Nav */
	
#TopNav {
	width:940px;
	height:40px;
	background-color:#201e5d;
	margin: 0 auto;
	}
	
#TopNav ul {
	list-style: none;
	padding:0;
	margin:0;
	line-height:0;	
	}
	#TopNav li {
		list-style: none;
		padding:0;
		margin:0;
		line-height:0;
		}
	
#TopNav a {
	float:left;
	font: 13px Arial, Helvetica, sans-serif;
	color:#fff;
	text-transform:uppercase;
	padding: 0 6px 0 6px;
	margin:12px 0 0 0;
	border-right:1px solid #e6b521;
	text-decoration:none;	
	}
	#TopNav a.LastItem {
		border-right:none;
		}
		
#TopNav a:hover {
	color:#e6b521;
	text-decoration:none;	
	}
		
	
/* ---------------------------------------- Wrapper */

#Wrapper {
	width: 940px;
	margin: 1px auto;
	background: url(../../images/wrapper-bg.png) repeat-y;
	}	
	

/* ---------------------------------------- Side Bar */
	
#SideNav {
	float:left;
	width: 228px;		
	margin:0 0 0 0;
	padding:0;
	}
	
#SideNav ul.NavList {
	list-style: none;
	margin:17px 10px 0 10px;	
	}
	#SideNav li {
		list-style: none;
		margin: 0 0 14px 0;
		}
	
#SideNav ul li a {
	font: 16px/18px Arial, Helvetica, sans-serif;
	color:#fff;
	text-transform:uppercase;
	text-decoration:none;
	}
	#SideNav ul li ul a {
		font: 13px/18px Arial, Helvetica, sans-serif;
		color:#fff;
		text-transform:capitalize;
		text-decoration:none;
		}
		#SideNav ul li ul li {		
			color:#fff;
			margin: 0 0 0 20px;
			list-style: disc outside;
			}
			
#SideNav ul li a:hover, #SideNav ul li a.Selected {
	color:#e6b521;
	text-decoration:none;
	}

		

/* ---------------------------------------- Content Area */
	
#Content {
	width:692px;
	float:left;
	margin:0 10px 20px 10px;
	}
	
.BreadCrumbs {
	display:block;
	padding:3px 0 6px 0;
	border-bottom:1px solid #ECC653;
	font-size:12px;
	}
	.BreadCrumbs a:link, .BreadCrumbs a:visited, .BreadCrumbs a:hover, .BreadCrumbs a:active{
		font-size:12px;
		text-decoration:none;
		}

.ImageFloatLeft {
	float:left;
	margin:5px 15px 10px 0;
	}
	
.ImageFloatRight {
	float:right;
	margin:5px 0 10px 15px;
	}
	
	.ExtraBottomMargin150px {
		margin-bottom:170px;
		}

.MayorsSignature {
	border:none;
	padding:5px 0 15px 0;
	}
	
table.StandardContent {
	margin-bottom:15px;
	}
	table.StandardContent td {
	padding:2px 15px 2px 0;
	vertical-align:top;
	}
	table.StandardContent td.Labels {
		text-align:right;
		font-weight:bold;	
		}
	
table.StandardContentBTT {
	margin-bottom:15px;
	}
	table.StandardContentBTT td {
	padding:2px 15px 2px 0;
	vertical-align:middle;
	}
	
table.Docs {
	width:100%;
	margin:10px 0 20px 0;
	}
	table.Docs th{
		padding:5px 10px;	
		vertical-align:middle;
		background-color:#201e5d;
		color:#fff;
		border: 1px solid #aaa;
		}
		table.Docs td{
			padding:5px 10px;
			vertical-align:middle;
			border: 1px solid #aaa;
			}

table.ContactTable {
	width:690px;
	}
	table.ContactTable td {
		padding:5px 10px 5px 10px;
		vertical-align:top;
		border:1px solid #666;
		}
		table.ContactTable tr.Header {
			background-color:#201e5d;
			height:28px;
			font-weight:bold;
			color:#fff;	
			}
			table.ContactTable tr.SubHeader {
				background-color:#666;
				font-weight:bold;
				color:#fff;	
				}
		
.MinutesColumn {
	width:310px;
	float:left;
	margin-right:15px;
	}
	
	ul.PublicNoticesSummary {
		margin-bottom:0;
		}
		
.TextHighlight {
	border: 1px solid #aaa;
	background: #eee;
	width: 550px;
	margin: 5px 0 15px 0;
	padding: 10px 10px 10px 15px;
	}
	.TextHighlight p { margin-top: 0; }
	
	.TextHighlight td {
		padding:3px 2px ;
		}
		.TextHighlight td.Labels {
			text-align:right;
			}
			.TextHighlight input, .TextHighlight select {
				border: 1px solid #7f9db9;
				}
				
.AgendaArchives {
	text-align: right;
	margin: 20px 0 8px 0;
	}
	
.AgendaTable {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 1px;
	border: 1px solid #999;
	background: #FFF;
	}
	
	.AgendaTable tr.GreyRow {
		background: #eee;
		}
		
	.AgendaTable th, .AgendaTable td { 
		padding: 2px 4px;
		text-align:center;
		}
		.AgendaTable th {
			background: #201e5d;
			color: #FFF;
			}
			
.AgendaTable a.MinutesIcon {
	background:url(../../images/icon_minutes.gif) no-repeat right 1px;
	padding-right:20px;
	}
	
.AgendaTable a.AgendaIcon {
	background:url(../../images/icon_agenda.gif) no-repeat right 1px;
	padding-right:20px;
	}

.LooksLikeH3 {
	color: #201e5d;
	font: bold 14px/16px Arial, Helvetica, sans-serif;
	margin:10px 0 6px 0;
	}
	
.MonthPager { overflow:hidden; margin-bottom:15px;}
.MonthPager h2 {float:left}
.MonthPager table {float:right; margin-top:9px;}

.MonthPager a{ display:block;background-color:#000;}
	
.MonthPager a:hover img{ 
	filter:alpha(opacity=60);
	-moz-opacity:0.6;
	-khtml-opacity: 0.6;
	opacity: 0.6;
	}
	
	
	
	
/* ---------------------------------------- HomePage Specific Content */

#ContentHome {
	width:712px;
	float:left;
	margin: 0;
	background: url(../../images/home-content-bg.png) repeat-y top right;
	}	
	#ContentHomeBottom {
		min-height:1120px;
		background: url(../../images/home-content-bottom-bg.png) no-repeat left bottom;
		}	
	
.HomeText {
	width:462px;
	margin:0 10px;	
	}
		
.Announcements {
	display:block;
	background-color:#e6b521;
	width:482px;
	margin:30px 1px 0 1px;	
	padding-top:10px;
	}
	
.Announcements h2 {
	display:block;
	width:442px;
	height:26px;
	background-color:#201e5d;
	color:#fff;
	padding:6px 10px 0 10px;
	margin:0 10px;
	}
	
.Announcements table {
	margin:10px;
	}
	.Announcements table td {
		padding:5px 5px 5px 0;
		}
		.Announcements a img {
			border:1px solid #201e5d;
			margin:0 8px 0 0;
			}
			.Announcements a:link, .Announcements a:visited {
				font: 14px/16px Arial, Helvetica, sans-serif;
				color:#201e5d;
				text-decoration:none;
				}
				.Announcements a:hover, .Announcements a:active {
					color:#fff;
					text-decoration:none;
					}
	
#HomeLinksNoticesCol {
	float:right;
	width:218px;
	padding-bottom:20px;
	}
	
#HomeLinksNoticesCol h2 {
	display:block;
	width:188px;
	height:26px;
	background-color:#201e5d;
	color:#fff;
	padding:6px 10px 0 10px;
	margin:0 0 0 0;
	}
	#HomeLinksNoticesCol h2.NewsH2 {
		margin:15px 0 0 0;
		}
	
#HomeLinksNoticesCol table{
	margin-top:5px;
	width:198px;
	}
	#HomeLinksNoticesCol td{
		padding:7px 0;
		}

#HomeLinksNoticesCol a img {
	border:1px solid #201e5d;
	margin:0 8px 0 0;
	}
	#HomeLinksNoticesCol a {
			font: 16px/18px Arial, Helvetica, sans-serif;
			color:#201e5d;
			text-decoration:none;
			}
			#HomeLinksNoticesCol a:hover {
				color:#fff;
				text-decoration:none;
				}
			
#HomeLinksNoticesCol ul {
	list-style: none;
	margin:10px 10px 0 0;	
	}
	#HomeLinksNoticesCol li {
		list-style: none;
		margin: 0 0 14px 0;
		clear:both;
		}	
		#HomeLinksNoticesCol ul li a {
			font: 16px/18px Arial, Helvetica, sans-serif;
			text-transform:uppercase;
			color:#201e5d;
			text-decoration:none;
			}
			#HomeLinksNoticesCol ul li a:hover {
				color:#fff;
				text-decoration:none;
				}
				
#HomeLinksNoticesCol iframe {
	margin:5px 0 10px 15px;
	padding:0;
	line-height:0;
	font-size:0;
	}
	
#HomeLinksNoticesCol .RoadConditions {
	margin-left:15px;
	width:174px;
	}
	#HomeLinksNoticesCol .RCText {
		display:block;
		width:174px;
		height:20px;
		background-color:#201e5d;
		font-size:12px;
		text-transform:uppercase;
		text-align:center;
		color:#fff;
		margin-top:-3px;
		padding-top:1px;
		}
		#HomeLinksNoticesCol  a.RCText {
			color:#FFF;
			}
			#HomeLinksNoticesCol a.RCText:hover{
				color:#e6b521;
				}
#HomeLinksNoticesCol  a.NewsText {
			color:#FFF;
			}
			#HomeLinksNoticesCol a.NewsText:hover{
				color:#e6b521;
				}



/* ---------------------------------------- Footer*/

#Footer { 
	width:940px;
	margin: 0 auto;
	height:90px;
	background-color:#201e5d;
	}
	
.Copyright {
	padding-top:18px;
	font: 14px/18px Arial, Helvetica, sans-serif;
	color:#e6b521;
	text-align:center;
	}
.Copyright a:link, .Copyright a:visited {
	color:#e6b521;
	text-decoration:none;
	}
	.Copyright a:hover, .Copyright a:active {
		color:#e6b521;
		text-decoration:underline;
		}
	



/* ---------------------------------------- Form */

table.StandardForm {
	margin-bottom:15px;
	}
	table.StandardForm td {
	padding:6px 15px 6px 0;
	vertical-align:top;
	}
	
label {
	width:160px;  
	float:left;  
	text-align:right;
	}
	
.Error, .Required {
	color: #d43100;
	}
	.Error {
	clear:both;
	}

textarea, select {
	width:250px; 
	font: Arial, Helvetica, sans-serif;
	color: #000;
	border: 1px solid #7f9db9;
	}		
	select { 
		height:22px; 
		}
		
.Input {
	height:20px; 
	width:248px; 
	border: 1px solid #7f9db9;
	background: #fff url(../../images/input-bg.gif) repeat;
	}

		
input.SubmitButton {
	width:70px;
	height:25px;
	color:#fff;
	border:none;
	background-color:#201e5d;
	font: 14px Arial, Helvetica, sans-serif;	
	cursor:pointer;
	margin:5px 0 10px 175px;
	padding:0;	
	background-image: url(none) !important;
	}
	
input.GoButton {
	width:40px;
	height:25px;
	color:#fff;
	border:none;
	background-color:#201e5d;
	font: 14px Arial, Helvetica, sans-serif;	
	cursor:pointer;
	margin:0;
	padding:0;	
	background-image: url(none) !important;
	}