/*

Title:    ALA Regional - Home Page screen styles
Modified: 4/13/2008

*/

@import "lib/reset.css";
@import "lib/typography.css";
@import "alacs.css";



/* =structure overrides
------------------------------------------------------ */

#main {
	padding: 0 0 0 33px;
	background: none;
}
#primary {
	padding: 35px 0 0 0;
	width: 967px;
}
#content {
	float: left;
	width: 645px;
	padding: 0;
}
#sidebar {
	float: right;
	width: 304px;
	height: 232px;
	position: relative;
}
#secondary {
	padding: 0 0 0 0;
	width: 967px;
}
#banner { 
	margin-top: -12px;
	line-height: 0;
}


/* =primary content
------------------------------------------------------ */

#intro {
	float: left;
	width: 412px; height: 232px;
	background: url(../images/site/home-intro.gif) no-repeat 0 0;
}
#intro h1, #intro p { 
	text-indent: -9999px; 
}
#promo {
	float: left;
	width: 233px; height: 232px;
}
#community {
	padding-bottom: 15px;
	margin: 0 0 15px 0;
	border-bottom: 1px solid #c2c2c2;
}
#community h2 {
	margin-bottom: 15px;
}
#upcoming h2 {
	margin-bottom: 12px;
}
#upcoming ul {
	list-style: none;
	margin: 0; padding: 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 10px;
}
#upcoming ul li {
	margin: 0; padding: 0;
	line-height: 1.2em;
	clear: both;
	color: #b5b5b5;
}
#upcoming ul li.alt a {
	background: #e5f2f7;
}
#upcoming ul li a {
	display: block;
	padding: 4px 0;
	text-decoration: none;
	color: #b5b5b5;
}
#upcoming ul li a:hover, #upcoming ul li.alt a:hover {
	background: #b5deed;
}
#upcoming ul li a span.date {
	display: block;
	float: left;
	width: 50px;
	color: #007fac;
	font-weight: bold;
}
#upcoming ul li a span.title {
	padding-left: 5px;
	color: #015877;
}
#upcoming ul li.more-link a, #upcoming ul li.more-link a:hover {
	background: #fff;
	padding-left: 50px;
}
#upcoming ul li.more-link span {
	color: #015877;
	font-weight: bold;
	padding-left: 5px;
}
#facebook {
	position: absolute;
	bottom: 0; left: 0;
	padding: 7px 0;
	width: 304px;
	line-height: 0;
	border-top: 1px solid #c2c2c2;
	border-bottom: 1px solid #c2c2c2;
}


/* =secondary content
------------------------------------------------------ */

.feature {
	float: left;
	width: 206px;
	background: url(../images/site/feature-bg.gif) no-repeat 0 30px;
	line-height: 1.3em;
}
.feature h2 {
	margin: 32px 0 10px 0;
	padding: 0 35px 0 27px;
}
.feature p {
	margin: 0 0 1.5em;
	padding: 0 35px 0 27px;
	font-family: arial, helvetica, sans-serif;
	color: #000;
	font-size: 11px;
}
.asthma, .cleanair {
	width: 180px;
}
.asthma h2, .asthma p,
.cleanair h2, .cleanair p {
	padding-right: 15px;
}
.spotlight {
	float: left;
	width: 374px; height: 171px;
	/*background: url(../images/site/ad-bg.gif) no-repeat top left;*/
	background: url(/images/site/ad-bg-alt.gif) no-repeat top left;
	position: relative;
	overflow: visible;
}
.spotlight-ad img {
	position: absolute;
	top: 15px; left: 70px;
}
/* default help line ad with girls */
.spotlight-helpline {
	background: url(../images/site/ad-helpline.jpg) no-repeat top left;
}
.spotlight-helpline a {
	position: absolute;
	top: 70px; left: 215px;
	width: 85px; height: 50px;
	text-indent: -9999px;
}


/* national zipcode "widget" */

.spotlight-zipcode {
	float: left;
	width: 374px; height: 171px;
	background: url(/images/site/ad-zipcode-bg.gif) no-repeat top left;
	position: relative;
}
#zipcode-widget {
	width: 125px; height: 125px;
	margin: 15px 0 0 70px;
	background: url(/images/site/zipcode_grey.gif) no-repeat 0 0;
	position: relative;
}
#zipcode-widget form {
	padding-top: 98px;
	text-align: right;
}
#zipcode-widget form input {
	vertical-align: middle;
}
#zipcode-widget .input-zip-125 {
	width: 65px;
	margin-right: 4px;
	font-size: 11px;
}
#zipcode-widget .input-submit-125 {
	margin-right: 2px
}



/* =extra (functional footer)
------------------------------------------------------ */

#extra {
	padding: 27px 0 18px 61px;
}
#extra .column {
	float: left;
	width: 132px;
	margin-right: 22px;
	font-family: arial, helvetica, sans-serif;
	font-size: 10px;
	line-height: 1.3em;
}
#extra .column a.title-link {
	display: block;
	font-weight: bold;
}
#extra .column p {
	margin: 0;
}