/* 
 Workplace Savings NZ (ASFONZ) Website
 Developed by SilverStripe
 */

* {
	margin: 0;
	padding: 0;
}

body {
	width: 100%;
	font-family: Verdana, Arial, sans-serif;
	color: #414141;
}

a img {
	border: none;
}

.clear {
	clear: both;
}

/* Site Layout
--------------------------- */

#Container {
	width: 960px; /* Meant to be LIQUID. TODO */
}

#Header {
	width: 960px;
	height: 85px;
	margin-top: 30px;
	background: #005f9f url(../images/headerBg.gif) repeat-x;
}
	/* Logo */
	#Header h1 {
		display: block;
		width: 198px;
		height: 50px;
		position: absolute; /* Im doing this quicky */
		top: 39px; /* 47px */
		left: 34px;
	}
	/* Rounded corner */
	#HeaderRounder {
		width: 11px;
		height: 85px;
		float: right;
		background: url(../images/headerRounded.gif) no-repeat right top;
	}

/* Top right Utility Navigation 
------------------------------------*/
#UtilityNav {
	position: absolute;
	top: 9px;
	left: 0;
	width: 936px;
	text-align: right;
	font-size: 10px;
	color: #d7d7d7;
}
	/* We have the links in a list */
	#UtilityNav li {
		list-style: none;
		display: inline;
	}
	#UtilityNav a {
		color: #9c9c9c;
		text-decoration: none;
	}
		#UtilityNav a:hover {
			color: #9c9c9c;
			text-decoration: underline;
		}
/* Search form in the header
----------------------------------- */	
#HeaderSearch {
	width: 260px;
	height: 44px;
	margin-top: 20px;
	float: right;
	background: url(../images/searchFormBg.gif) no-repeat;
}
	#Search {
		margin: 0;
		padding: 0;
	}
	#HeaderSearch label {
		display: none;
	}
	#HeaderSearch input.text {
		background: #fff;
		float: left;
		margin: 12px 0 0 12px;
		border: none;
		width: 152px;
		height: 19px;
	}
	#HeaderSearch input.action {
		float: right;
		/* background: #e28406 url(../images/searchArrow.gif) no-repeat right center; */
		background: #808285 url(../images/searchArrow.gif) no-repeat right center;
		width: 65px;
		margin: 12px 19px 0 0;
		border: none;
		line-height: 1.1;
		font-size: 13px;
		color: #fff;
		text-align: left;
	}
		#HeaderSearch input.action:hover {
			cursor: pointer;
		}
		
		#HeaderSearch legend {
			display: none;
		}
/* Main Top Level Navigation 
----------------------------------- */
#Navigation {
	margin: 14px 0 0 34px;
	border-bottom: 1px solid #ebebeb;
	padding-bottom: 10px;
	font-family:  'Myriad Pro', Tahoma, sans-serif;
	margin-bottom: 20px;
}
	#Navigation ul {
		font-size: 13px;
	}
		#Navigation li {
			display: inline;
		}
			#Navigation a {
				color: #393939;
				margin-right: 20px;
				text-decoration: none;
			}
			#Navigation a:hover {
				text-decoration: underline;
			}
			#Navigation a.current,
			#Navigation a.current:hover,
			#Navigation a.section,
			#Navigation a.section:hover {
				font-weight: bold;
			} 
/* Layout of the content 
-------------------------------------------------- */
#Layout {
	width: 100%;
	margin-top: 20px;
}
#Content {
	width: 646px; /* LIQUID? */
	float: right;
	margin: 0 14px 0 0;
}
	#home #Content {
		width: 472px;
		border-left: 1px solid #ececec;
		padding-left: 28px;
	}
	#home #Sidebar {
		width: 420px;
	}
/* Site Crumbs 
--------------------------------------------------- */
#SiteCrumbs {
	overflow: hidden;
	display: block;
	height: 20px;
	width: 100%;
	margin-bottom: 10px;
}
	#SiteCrumbs p {
		color: #787877;
	}
		#SiteCrumbs a {
			color: #787877;
			text-decoration: none;
		}
			#SiteCrumbs a:hover {
				text-decoration: underline;
			}
/* Breadcrumbs on the top right of the layout 
--------------------------------------------------- */
#Breadcrumbs {
	float: right;
	margin: 0 22px 0 0;
	font-size: 10px;
}
/* Middle left area for trace. Its only shown on the events page 
   but mostly the same style as breadcrumbs
---------------------------------------------------- */
#Trace {
	float: left;
	font-size: 10px;
	margin: 0 0 0 34px;
}

/* The left hand Side bar
-------------------------------------- */
#Sidebar {
	width: 242px;
	float: left;
	font-size: 12px;
	position: relative;
}
#SidebarBlue {
	background: #e4f1f9 url(../images/sidebarTop.gif) no-repeat right top;
}
	#SidebarExpander {
		float: left;
		height: 357px; /* 165px */
		background: url(../images/sidebarAsfonz.gif) no-repeat left top;
		width: 29px; /* 22px */
		margin-top: 5px;
	}
	#SidebarContent {
		float: right;
		width: 206px;
		margin-top: 18px;
	}
		#home #SidebarContent {
			width: 364px;
			display: inline;
			margin-right: 18px;
		}
	#SidebarBottom {
		width: 100%;
		height: 30px;
		clear: both;
		background: url(../images/sidebarBottom.gif) no-repeat right bottom;	
	}
	#Sidebar h2 {
		font-size: 24px;
		display: block;
		margin-bottom: 12px;
	}
	#Sidebar h3 {
		font-size: 16px;
		display: inline;
		margin-bottom: 0;
	}
	#Sidebar p {
		color: #123e5b;
		font-size: 11px;
		line-height: 20px;
		letter-spacing: -0.01px;
	}
	#Sidebar ul {
		margin-bottom: 24px;
	}
		/* Menu3 items get a bullet image on the left for usability */
		#Sidebar ul ul li {
			padding-left: 15px;
			/*background: url(../images/menu_bullet.gif) no-repeat 0% 4px;*/
		}
		#Sidebar li {
			list-style: none;
			margin: 10px 8px 0 0;
		}
			#Sidebar li a {
				font-size: 11px;
				color: #00446e;
				text-decoration: none;
			}
				#Sidebar li a:hover {
					text-decoration: underline;
				}
					#Sidebar li a.current,
					#Sidebar li a.current:hover {
						font-weight: bold;
					}
					
/* Pagination Bar
----------------------------------- */

.pagination {
	height: 40px;
	width: 100%;
	margin-top: 40px;
	font-size: 11px;
	background: #fff url(../images/paginationMain.gif) repeat-x;
}
	.typography .pagination p {
		line-height: 40px;
	}
	.pagination p.prevLink {
		width: 130px;
		float: left;
	}
		.pagination .prevLink a,
		.pagination .prevLink span {
			display: block;
			width: 129px;
			height: 40px;
			font-weight: bold;
			text-indent: 34px;
			color: #777;
			outline: none;
			text-decoration: none;
			background: url(../images/prevLink.gif) no-repeat center left;
		}
		.pagination .prevLink span {
			color: #ddd;
			background-position: bottom left;
		}
		.pagination .prevLink a:hover {
			background-position: top left;
			color: #fff;
		}
	.pagination p.nextLink {
		width: 130px;
		float: right;
	}
		.pagination .nextLink a,
		.pagination .nextLink span {
			display: block;
			width: 129px;
			height: 40px;
			font-weight: bold;
			color: #777;
			outline: none;
			text-decoration: none;
			text-indent: 34px;
			background: url(../images/nextLink.gif) no-repeat center left;
		}
		.pagination .nextLink span {
			color: #ddd;
			background-position: bottom left;
		}
		.nextLink a:hover {
			background-position: top left;
			color: #fff;
		}
	.pagination p.pages {
		width:380px;
		float: left;
		text-align: center;
	}

/* Footer */
#Footer {
	clear: both;
	padding: 48px 34px 34px 34px;
}
	#Footer p {
		color: #9C9C9C;
		margin: 0;
		font-size: 11px;
		margin-bottom: 12px;
	}
	#Footer a {
		color: #9c9c9c;
		text-decoration: none;
	}
		#Footer a:hover {
			color: #9c9c9c;
			text-decoration: underline;
		}	
	#FooterUtilityNav {
		width: 936px;
		font-size: 10px;
		color: #d7d7d7;
		margin-bottom: 12px;
	}
		/* We have the links in a list */
		#FooterUtilityNav li {
			list-style: none;
			display: inline;
		}
			#FooterUtilityNav li a {
				text-decoration: underline;
			}
				#FooterUtilityNav li a:hover {
					text-decoration: none;
				}

/* Homepage Layout 
------------------------------- */

ul#GoldSupportList {
	margin: 0;
} 
	
	ul#GoldSupportList li {
		list-style: none;
		float: left;
		margin-right: 10px;
	}

.typography p.date {
	color: #999;
	font-size: 11px;
	margin-bottom: 0px;
}
#FeaturedImage {
	float: left;
	margin: 4px 12px 6px 0;
}
#FeaturedImage img {
	border: 3px solid #d5e9f4;
}

#Gold {
	width: 400px;
	margin: 34px 0 24px 34px;
}
#Gold h2 {
	margin: 0;
}

#Gold.blog {
	width: 200px;
}

#Silver {
	width: 200px;
	float: left;
	display: inline;
	margin: 10px 0 0 34px;
	border-right: 1px solid #ECECEC;
}
#Bronze {
	float: right;
	width: 130px;
	margin: 10px 24px 0 0;
}
	#Gold img,
	#Silver img,
	#Bronze img {
		margin-top: 14px;
	}
/* events */
.event {
	margin-top: 30px;
	margin-bottom: 55px;
	clear: right;
}

.backEvents {
	position: absolute;
	top: -44px;
	left: 34px;
	font-size: 10px !important;
}
	.backEvents a {
		color: #787877;
		text-decoration: none;
	}
		.backEvents a:hover {
			text-decoration: underline;
		}

.archiveEvents,
.upcomingEvents {
	margin: 40px 0 !important;
	font-size: 24px !important;
}

.event h5 {
	font-size: 12px !important;
}

.banner {
	border: 3px solid #c3d6e2;
}

#Brochure {
	margin-top: 30px;
}

#Brochure a {
	font-size: 11px;
	color: #00446E !important;
	text-decoration: none;
}
	#Brochure a:hover {
		text-decoration: underline !important;
	}

.info {
	color: #999;
	font-size: 10px !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

#EventFooter {
	margin-top: 100px;
}

.supportersHeader {
	text-align: center;
}

.supporters {
	text-align: center;
	margin-bottom: 30px;
}

/* Poll */
#PollHolder {
	margin-bottom: 18px;
}