@import url(content.css);

/* Eric Meyer Reset, v1.0 | 20080212, http://meyerweb.com/eric/tools/css/reset/index.html, modified */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;}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}:focus{outline:0;}ins{text-decoration:none;}del{text-decoration:line-through;}table{border-collapse:collapse;border-spacing:0;}/* mods */h1,h2,h3,h4,h5,h6{font-weight:normal}
/*CLEAR FIX*/.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}.clearfix {display: inline-block;}
/* Hides from IE-mac \*/* html .clearfix { height: 1%;} .clearfix {display: block;}

/***************************************************************
	Basic Layout */
body {
	font: normal 75% Helvetica, 'Helvetica Lt Std', Arial, sans-serif;
	text-align: center;
	background: #121213 url(../images/bg-body-fade.jpg) no-repeat center -101px;
}
html>body { /* ignored by IE6 */
	font-size: 12px;
}
#wrapper {
	width: 994px;
	margin: 55px auto 0;
	text-align: left;
}


/***************************************************************
	Header */
	
#header {
	position: relative;
	height: 158px;
	background: url(../images/bg-header.png) no-repeat;
}
#header h2 {
	width: 257px;
	height: 158px;
}
#header h2 a {
	display: block;
	width: 100%;
	height: 100%;
	overflow: hidden;
	text-indent: -999em;
}
#secondNav {
	position: absolute;
	top: 63px;
	left: 266px;
}
#secondNav li {
	float: left;
	width: 95px;
	padding: 9px 32px 12px;
	background: url(../images/bg-second-nav.png) no-repeat;
}
#secondNav li.hover {
	background-position: left -88px;
}
#secondNav li#getInvolvedLink {
	padding: 9px 26px 12px;
}
#secondNav li#donateLink {
	background-position: -147px top;
}
#secondNav li#donateLink.hover {
	background-position: -147px -88px;
}
#secondNav li#letterLink {
	background-position: -306px top;
}
#secondNav li#letterLink.hover {
	background-position: -306px -88px;
}
#secondNav li a {
	display: block;
	height: 67px;
	text-indent: -999em;
	overflow: hidden;
}
#socialNav {
	position: absolute;
	top: 76px;
	right: 40px;
	width: 149px;
	background: url(../images/bg-social-nav.png) no-repeat;
}
#socialNav a {
	display: block;
	width: 64px;
	height: 22px;
	overflow: hidden;
	text-indent: -999em;
	background: url(../images/bg-social-nav.png) no-repeat 149px top;
}
#socialNav .facebook a:hover {
	background-position: -149px top;
}
#socialNav .twitter a:hover {
	background-position: -149px -22px;
}
#socialNav .youtube a:hover {
	background-position: -149px -44px;
}


/***************************************************************
	Footer */
	
#footer {
	position: relative;
	padding: 0 17px 41px;
	font-weight: bold;
	font-size: 10px;
	line-height: 37px;
	color: #fdfdfe;
	background: url(../images/bg-footer.png) no-repeat;
}
#footer a {
	text-decoration: none;
	color: #fdfdfe;
}
#footer a:hover {
	text-decoration: underline;
}
#footerNav {
	position: absolute;
	top: 0;
	right: 17px;
	text-transform: lowercase;
}


/***************************************************************
	Main */

#main {
	padding: 0 24px 0 0;
	background: url(../images/bg-main.png) repeat-y;
}

	
/***************************************************************
	Content */

#content {
	float: right;
	width: 704px;
	margin: 0 0 0 9px;
	padding: 8px 0 0 0;
}

/* content page */
#banner {
	width: 692px;
	height: 260px;
	margin-bottom: 11px;
	overflow: hidden;
	border: 6px solid #e9e9e9;
}
#content h1.pageHeader {
	padding: 0 24px 20px;
	border-left: 1px solid #c4c3c3;
	font-size: 30px;
	font-weight: bold;
	line-height: 47px;
	color: #023e8a;
	background: url(../images/bg-page-header.png) no-repeat right bottom;
}
#copy {
	min-height: 500px;
	margin-bottom: 30px;
	padding: 0 66px 24px 24px;
	border-left: 1px solid #c4c3c3;
	line-height: 1.5em; /* 18px */
	color: #2e2d2d;
}

/* forms */
.form {
	line-height: 28px;
}
.formCell {
	float: left;
	width: 289px;
}
.formCellLeft {
	margin-right: 35px;
}
.formCellState {
	width: 148px;
	margin-right: 20px;
}
.formCellZip {
	width: 121px;
	margin-right: 35px;
}
.formCell label {
	font-weight: bold;
	font-size: 16px;
	color: #002c64;
}
.formCell label.chkLabel {
	font-size: 12px;
	font-weight: normal;
	color: #2e2d2d;
}
.formCell .error,
.form p.error {
	color: #c35b0f;
}
.formCell .txtInput {
	width: 267px;
	height: 22px;
	margin: 0 0 22px;
	padding: 0 8px;
	border: 3px solid #e9e9e9;
}
.formCellState .txtInput {
	width: 126px;
}
.formCellZip .txtInput {
	width: 99px;
}
.formCellPhone .txtInput {
	width: 125px;
}
.formCell textarea {
	width: 275px;
	height: 97px;
	margin: 0 0 22px;
	padding: 0 0 0 8px;
	border: 3px solid #e9e9e9;
	font: normal 12px Helvetica, Arial, sans-serif;
	line-height: 28px;
}
.buttons {
	clear: both;
	margin-top: 36px;
	padding: 12px 0 75px 0;
	border-top: 1px solid #c4c3c3;
}
.buttons a {
	float: left;
	height: 21px;
	text-indent: -999em;
	overflow: hidden;
}
.submitBtn {
	width: 58px;
	height: 21px;
	border: 0;
	background: url(../images/btn-submit.png) no-repeat;
	cursor: pointer;
}
.submitBtn:hover {
	background-position: left -21px;
}
.clearBtn {
	width: 52px;
	height: 21px;
	border: 0;
	background: url(../images/btn-clear.png) no-repeat;
}
.buttons a:hover {
	background-position: left -21px;
}
.buttons img {
	float: left;
}

/* home */
#homeBanner {
	float: left;
	margin: 0 12px 23px 0;
	padding: 6px 14px 15px 8px;
	background: url(../images/bg-banner.png) no-repeat;
}
#homeBanner .banners {
	width: 453px;
	height: 299px;
	overflow: hidden;
}
#topStory {
	margin-left: 487px;
	padding-bottom: 31px;
	font-size: 13px;
	line-height: 18px;
	color: #081d28;
}
#topStory h1 {
	position: relative;
	left: -3px;
	width: 217px;
	height: 52px;
	overflow: hidden;
}
#topStory h1 span {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../images/top-story.png) no-repeat;
}
#topStory p {
	margin-bottom: 14px;
}
#topStory .storyLink {
	display: block;
	position: relative;
	width: 117px;
	height: 21px;
	text-indent: -999em;
	overflow: hidden;
	background: url(../images/read-full-story-large.png) no-repeat;
}
#topStory .storyLink:hover {
	background-position: left -21px;
}
#otherNews {
	font-size: 12px;
	line-height: 18px;
	color: #404649;
}
#otherNews h2 {
	position: relative;
	width: 217px;
	height: 32px;
	margin-bottom: 13px;
	overflow: hidden;
}
#otherNews h2 span {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../images/in-other-news.png) no-repeat;
}
#otherNews p {
	margin-bottom: 5px;
}
#otherNews .storyLink {
	display: block;
	position: relative;
	width: 97px;
	height: 18px;
	margin-bottom: 12px;
	text-indent: -999em;
	overflow: hidden;
	background: url(../images/read-full-story-small.png) no-repeat;
}
#otherNews .storyLink:hover {
	background-position: left -18px;
}
#callouts {
	clear: both;
	margin-bottom: 25px;
	padding-bottom: 29px;
	line-height: 18px;
	color: #3d3d3d;
	background: url(../images/bg-callouts.png) no-repeat;
}
#callouts .callout {
	float: left;
	width: 146px;
	min-height: 67px;
	padding: 24px 68px 0 25px;
}
#callouts .feature {
	width: 135px;
	padding-left: 23px;
}
#callouts h3 {
	height: 35px;
	margin-bottom: 10px;
	text-indent: -999em;
	overflow: hidden;
}
#callouts p {
	margin-bottom: 13px;
}
#callouts .learnMoreBtn {
	display: block;
	width: 88px;
	height: 21px;
	text-indent: -999em;
	overflow: hidden;
	background: url(../images/btn-learn-more.png) no-repeat;
}
#callouts .learnMoreBtn:hover {
	background-position: left -21px;
}
#callouts .signUpBtn {
	display: block;
	width: 63px;
	height: 21px;
	text-indent: -999em;
	overflow: hidden;
	background: url(../images/btn-sign-up.png) no-repeat;
}
#callouts .signUpBtn:hover {
	background-position: left -21px;
}
#callouts .contactBtn {
	display: block;
	width: 68px;
	height: 21px;
	text-indent: -999em;
	overflow: hidden;
	background: url(../images/btn-contact.png) no-repeat;
}
#callouts .contactBtn:hover {
	background-position: left -21px;
}

/***************************************************************
	Sidebar */

#sidebar {
	float: right;
	width: 257px;
}
#nav {
	padding: 5px 31px 0 36px;
	font-size: 17px;
	background: url(../images/bg-nav.png) repeat-y;
}
#navFoot {
	height: 44px;
	margin-bottom: 15px;
	background: url(../images/bg-nav-foot.png);
}
#nav li {
	border-bottom: 1px solid #437ec3;
	line-height: 33px;
}
#nav li.last {
	border: 0;
}
#nav li li {
	padding: 0 18px;
	border: 0;
	font-size: 14px;
	line-height: 18px;
	background: url(../images/bg-nav-item-sub.png) no-repeat -999em top;
}
#nav li li.current,
#nav li li.hover {
	background-position: left 1px;
}
#nav li li.last {
	padding-bottom: 22px;
}
#nav a {
	display: block;
	padding: 0 18px 0 1px;
	text-decoration: none;
	color: #fffffe;
	background: url(../images/bg-nav-item.png) no-repeat right top;
}
#nav a:hover {
	text-decoration: underline;
	background-position: right -278px;
}
#nav a.current {
	font-weight: bold;
}
#nav li li a {
	padding: 6px 0 2px;
	border-bottom: 1px solid #437ec3;
	background: none;
}
#nav li li a:hover {
	text-decoration: none;
}
#nav li li.current a {
	font-weight: bold;
	font-style: italic;
}
#nav li li.last a {
	border: 0;
}
#message {
	margin: 0 0 15px 29px;
	padding: 0 0 35px 0;
	background: #eeeeed;
}
#message h3 {
	position: relative;
	width: 100%;
	height: 71px;
	overflow: hidden;
}
#message h3 span {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: url(../images/message-from-mayor-ballard.png);
}
#message .copy {
	padding: 0 39px 0 23px;
	font-style: italic;
	line-height: 18px;
	color: #404649;
}
#message .copy p {
	margin: 0 0 22px 0;
	padding: 0 12px 0 0;
}
#message .copy p img {
	position: relative;
	top: 1px;
	vertical-align: top;
}
#message .readStoryLink {
	display: block;
	position: relative;
	width: 166px;
	height: 28px;
	text-indent: -999em;
	overflow: hidden;
	background: url(../images/read-full-letter-message.png) no-repeat;
}
#message .readStoryLink:hover {
	background-position: left -28px;
}
#newsletter {
	margin: 0 0 0 29px;
	padding: 0 0 18px 0;
	line-height: 18px;
	color: #3d3d3d;
	background: url(../images/bg-newsletter.png) no-repeat;
}
#newsletter h3 {
	position: relative;
	width: 122px;
	height: 78px;
	overflow: hidden;
}
#newsletter h3 span {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: url(../images/bg-newsletter.png);
}
#newsletter .copy {
	padding: 0 80px 0 21px;
}
#newsletter .copy p {
	margin-bottom: 15px;
}
#newsletter .signUpBtn {
	display: block;
	width: 63px;
	height: 21px;
	text-indent: -999em;
	overflow: hidden;
	background: url(../images/btn-sign-up.png) no-repeat;
}
#newsletter .signUpBtn:hover {
	background-position: left -21px;
}
#newsletterFoot {
	height: 14px;
	margin: 0 0 18px 29px;
	background: url(../images/bg-newsletter.png) no-repeat;
}