/********************************
HTML ELEMENTS
*/

* {
	margin: 0;
	padding: 0;
}

html {
	height: 100%;
}

body {
	font: 12px Arial, Helvetica, Verdana, Tahoma, sans-serif;
	color: #333;
	background: url(images/top.gif) repeat-x top center #F3F3F3;
}

a {
	outline: none;
}

a:link, a:visited {
	text-decoration: underline;
	color: #500A6F;
}

a:hover {
	text-decoration: underline;
}

a img {
	border: none;
}

strong {
	font-weight: bold;
}

.discount strong {
	font-weight: bold;
	color: #FF0000;
}

em {
	font-style: italic;
}

table { 
	border-collapse: collapse; 
	border-spacing: 0;
}

/*
COMMON CLASSES
*/

.center {
  text-align: center;
}

.right {
  float: right;
}

.hide {
  display: none;
}

.error {
	color: #FF0000;
}

.clear {
	clear: both;
}

/*******************************
CONTAINER
*/

#container {
  width: 866px;
  margin: 0 auto;
	background: url(images/body-bg.gif) repeat-y;
  position: relative;
	height: 100%;
	min-height:500px;
}

#content-container{
	float: left;
	width: 581px;
	margin-left: 6px;
}

/*******************************
HEADER
*/

#header{
	height: 78px;
	position: relative;
	background-color: #fff;
	border-bottom: 1px solid #C8C8C8;
}

#header h1 a{
	background: url(images/hba-logo.gif) no-repeat;
	width: 211px;
	height: 76px;
	text-indent: -1000em;
  position: absolute;
	top:0;
	left: 10px;
}

#header h2{
	background: url(images/celebrating-30-years.gif) no-repeat;
	width: 149px;
	height: 76px;
	text-indent: -1000em;
	position: absolute;
	top:0;
	left: 240px;
}

#search{
  position: absolute;
	top: 40px;
	right: 7px;
}

#search input{
	margin-right: 4px;
	width: 97px;
	height: 15px;
}

#search .search{
	background: url(images/btn-search.gif);
	width: 54px;
	height: 18px;
	border:none;
	margin-right: 0px;
	text-indent: -1000em !important;
	line-height:0;
	cursor: pointer;
}

#search .contact{
	background: url(images/icon-contact-us.gif) no-repeat;
	padding-left: 20px;
	margin-right: 10px;
	font-size: 90%;
}

.local-drop-down{
	position: absolute;
	top: 81px;
	right: 8px;
	font-size: 90%;
	color: #666;
}

/*******************************
NAVIGATION
*/

#main-content #flash{
	z-index: 1;
}

#main-nav ul{
	list-style: none;
	background: url(images/main-nav-bg.gif) repeat-x;
	height: 24px;
	margin-left: 6px;
	margin-right: 7px;
}

#main-nav ul li{
	float: left;
	position: relative;
	text-transform: uppercase;
	border-right: 1px solid #c8c8c8;
	font-size: 11px;
	font-weight: bold;
	display: block;
	letter-spacing: .04em;
}

#main-nav li a{
	display: block;
	height: 19px;
	text-decoration: none;
	color: #88708b;
	padding: 0 .7em;
	padding-top: 5px;
}

#main-nav li:hover,
#main-nav ul li.over{
	background-color: #ecebf1 !important;
}

#main-nav li:hover a,
#main-nav ul li.over a{
	color: #88708b !important;
}

#main-nav ul li.on{
	background-color: #3e9eaf;
}

#main-nav ul li.on a{
	color: #f8f7e0;
}

#main-nav ul li ul{
	display: none;
}

#main-nav ul li:hover ul,
#main-nav ul li.over ul{
	display: block;
	z-index: 500;
	position: absolute;
	top: 24px;
	left: -7px;
}

#main-nav ul li ul li{
	background: #ecebf1 !important;
	display: block;
	width: 175px;
	float: none !important;
	padding: .8em 0;
	text-transform: uppercase;
	font-size: 11px;
	border-left: 1px solid #c8c8c8;
	border-right: 1px solid #c8c8c8;
	letter-spacing: normal;
}

#main-nav ul li ul li:last-child,
#main-nav ul li ul li.last{
	border-bottom: 1px solid #c8c8c8;
}

#main-nav ul li ul li a{
	float: none;
	background: none;
	text-indent: 0;
	display: inline;
	text-decoration: none;
	width: auto;
	height: auto;
	font-weight: normal;
	color: #500a6f !important;
}

#main-nav li:hover ul li a,
#main-nav ul li.over ul li a{
	color: #500a6f !important;
}

#main-nav ul li ul li a:hover{
	text-decoration: underline;
}

#utility-nav ul{
	list-style: none;
	position: absolute;
	top: 15px;
	right: 7px;
	font-size: 90%;
}

#utility-nav ul li{
	display: inline;
	margin-left: 10px;
	color: #999994;
}



/*******************************
SECONDARY NAVIGATION
*/

#main-content #secondary-nav{
	background: url(images/secondary-nav-bg2.gif) no-repeat top left;
	height: 32px;
	padding:0;
	z-index: 10;
}

#main-content #secondary-nav ul {
	list-style: none;
	margin-left: 8px;
	margin-bottom: 0;
}

#main-content #secondary-nav ul li{
	float: left;
	line-height: 1em;
	text-align: center;
	margin-right: 4px;
}

#main-content #secondary-nav li a{
	display: block;
	text-align: center;
	height: 18px;
	padding: 5px .5em 0 .5em;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 11px;
	color: #f8f7e0;
	margin-top: 4px;
	border: 1px solid transparent;
}

#main-content #secondary-nav li a:hover,
#main-content #secondary-nav li.on a{
	border: 1px solid #f8f7e0;
	background: url(images/secondary-nav-on.gif) repeat-x;
}

/*******************************
MAIN-CONTENT
*/

#main-content{
	float: left;
	width: 583px;
}

#main-content div{
	height: auto;
	padding: 5px 15px 5px 15px;
	margin:0;
}

#main-content div div{
	padding: 0;
}

#main-content div img{
	margin-right: 10px;
	margin-bottom: 5px;
}

#main-content div p{
	margin-bottom: 1em;
}

#main-content p.intro{
	padding-top: 1em;
	padding-bottom: .5em;
}

#container #main-content h2{
	font-size: 180%;
	height: 30px;
	font-weight: normal;
	letter-spacing: -0.03em;
	color: #5B1976;
	margin:0;
	margin-top: 3px;
	margin-bottom: 7px;
}

#container #main-content div.icon{
	padding-top: 5px;
	margin-bottom: 15px;
	height: 35px;
}

#container #main-content div.icon h2{
	font-size: 180%;
	font-weight: normal;
	letter-spacing: -0.03em;
	color: #5B1976;
	margin-bottom: 8px;
	height: 30px;
	width: 400px;
}

#main-content div h3,
#side-bar div h3{
	font-size: 100%;
	font-weight: bold;
	color: #5B1976;
	margin:0;
	margin-bottom: .5em;
}

#main-content div h3.edge{
	text-transform: uppercase;
	padding-top: 1em;
}

#main-content div ul,
#main-content div ol{
	margin-left: 25px;
	margin-bottom: 1em;
}

p.arrow{
	margin-top: 15px;
	margin-bottom: 15px;
}

p.arrow a{
	display: block;
	background: url(images/icon-arrow.png) no-repeat;
	padding-left: 19px;
}

#main-content fieldset {
	border:1px solid #C8C8C8;
	clear:left;
	margin:1em 0pt;
	padding:15px;
}

#main-content legend {
	color:#5B1976;
	font-size:150%;
	font-weight:normal;
	letter-spacing:-0.03em;
	padding: 0 0.5em;
}

#main-content label {
	display: block;
	float: left;
	width: 150px;
	text-align: right;
	margin-right: 5px;
}

#main-content label.no-indent {
	text-align: left;
	width: auto;
}

#main-content legend span {
	color:#CCCCCC;
	font-size:95%;
}

#main-content .checkbox input{
	margin-left: 10px;
}

#main-content .checkbox label{
	margin-left: 3px;
	display: inline;
	width: 25px;
	float: none;
}

#main-content #submit {
	background-color:#F3F3F3;
	margin-left:136px;
	margin-top:15px;
	width:75px;
}

#main-content .radio-buttons input{
	margin-left: 10px;
}

#main-content .radio-buttons label{
	margin-left: 3px;
	display: inline;
	width: 25px;
	float: none;
}

/* news (common) */
.news-story{
	margin-bottom: 10px;
}

.news-story .news-content{
	margin-right: 40px;
}

/* events (common) */
#main-content .events .event{
	margin-bottom: 15px;
	width: 250px;
}

#main-content #events{
	margin-left: 55px;
	padding-left: 20px;
	border-left: 1px solid #A988A3;
	background: none;
}

#main-content #events h3{
	margin-top: -1.3em;
	margin-bottom: 2px;
}

#main-content #events span.simple-date{
	position: relative;
	left: -75px;
	font-size: 12px;
	font-weight: bold;
	color: #500A6F;
}

#main-content .events p.arrow{
	margin-left: 75px;
}
		
#main-content .events #calendar{
	float: right;
}

.calendar{
	width: 190px;
	height: 170px;
}

#main-content .calendar .next-previous a{
	font-size: 130%;
	color: #fff !important;
	text-decoration: none;
	background: #B08FBE;
	padding: 0 5px;
}

#main-content table.border{
	width: 100%;
	margin-bottom: 1em;
}

#main-content table.border td{
	border: 1px solid #333;
	padding: 2px;
	text-align: left;
}

#main-content table.border th{
	border: 1px solid #333;
	padding: 2px;
	text-align: left;
	background: #e7e7e7;
}

#main-content table.border tr.top th{
	background: #aaa;
}

#main-content table.border tr.shaded td{
	background: #e7e7e7;
}

/*******************************
SIDEBAR
*/

#side-bar{
	float: right;
	width: 269px;
	padding: 0px;
	margin-right: 8px;
}

.banner a img{
	border: 1px solid #CC9900;
	margin-top: 10px;
	margin-bottom: 15px;
	margin-left: 5px;
}

#woty.banner a img{
	margin-left: 5px;
}

#thirty-years.banner a img{
	margin-left: 5px;
	border: 1px solid #8C8C8B;
}

/*******************************
FOOTER
*/

#footer{
	clear: both;
	background-color: #807F8D;
	margin-left: 6px;
	margin-right: 8px;
	height: 32px;
	padding: 6px;
	font-size: 90%;
}

#footer a{
	color: #ccc;
}

#footer #footer-nav ul{
	list-style: none;
	text-align: center;
	margin-bottom: 4px;
}

#footer #footer-nav ul li{
	display: inline;
	padding-right: 8px;
}

#footer #footer-nav ul li.on a{
	font-weight: bold;
	color: #fff;
}

#footer #footer-utility-nav ul{
	list-style: none;
	text-align: center;
}

#footer #footer-utility-nav ul li{
	display: inline;
	padding-right: 8px;
}

/* sIFR */
/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h2 {
	visibility: hidden;
	letter-spacing: -9px;
	font-size: 22px;
}

/* Message on the member homepage */

	#main-content #member-message{
		width: 557px;
		background: #F6F4D6;
		padding: 5px 0;
		border: 1px solid #333;
	}
	
	#main-content #member-message a.btn-close{
		display: block;
		background: url(images/btn-close.gif);
		width: 19px;
		height: 18px;
		text-indent: -1000em;
		float: right;
		margin-right: 6px;
	}
	
	#main-content #member-message p{
		padding: 3px 6px;
		margin-bottom: 0px;
		line-height: 1em;
	}
	
	#main-content #member-message span{
		margin: 0 1em;
	}
	
	#main-content #member-message span a{
		margin: 0 .25em;
	}
	
	.hidden{
		display: none;
	}