/* -------------------------------------------------------------
	Copyright 2005 America First Credit Union - americafirst.com 

	Contents:
	-LAYOUT
	-NAVIGATION
	-TEXT
	-STYLES
	-SIFR
------------------------------------------------------------- */


/*###################### ELEMENT STYLES #################################*/
* {
	margin: 0px;
	padding: 0px;
	font-family: "lucida grande", arial, verdana, tahoma;
}
body{
	background-color: #666;
	font-size: 12px;
}

a {
	outline: none;
	text-decoration: none;
	color:#3399cc;
}

a:hover {
	color:#888888;
}

a:visited:hover {
	text-decoration: none;
	color:#888888;
}

a:active {
  outline: none;
}

a img {border: none;}

p{
	text-align:justify;
}

h1, h2, h3, h4, h5, h6 {
color:#333333;
}

h1{
	font-size:20px;
	color:#333333;
}

h2{
	font-size:18px;
}

h3{
	font-size:16px;
}

h4{
	font-size: 15px;
}

h5{
	font-size: 14px;
}

h6{
	font-size: 13px;
}

ul, ol{
	margin: 10px 10px 15px 40px;
}

p{
	margin-top: 5px;
	padding: 0px 0px 5px 0px;
}

hr {
	background:#DDDDDD none repeat scroll 0 0;
	border:medium none;
	height:1px;
	margin: 10px 0px;
}

ol ol{
	list-style-type: lower-alpha;
}


/*##########################  GENERAL LAYOUT STYLES ##############################*/

.finePrint{font-size: 10px;}

#wrapper{
	width: 980px;
	margin-left: auto;
	margin-right: auto;
	background-color: #fff;
}
#innerWrap{
	padding-left: 15px;
	background:url(/images/layout/bg-head-left.png) top left no-repeat;
}

/*************************** EXPANDED FOOTER ****************************************/
#footer{
	padding-top: 10px;
	background-color: #666;
}
#footer p{
	color: #ccc;
}
#footer a{
	color: #ccc;
	text-decoration: underline;
}
#footer .footerColumn{
	float: left;
	width: 186px;
	padding: 0px 5px 5px 5px;
}
#footer .footerColumn h3{
	color: #fff;
	font-size: 17px;
	margin: 8px 0px;
}
#footer .footerColumn a{
	text-decoration: none;
}
#footer .footerColumn a:hover{
	text-decoration:underline;
}
#footer .footerColumn ul{
	margin: 0px 0px 0px 0px;
}
#footer .footerColumn ul li{
	list-style: none;
}
#footer .footerColumn ul li.gapBottom{
	margin-bottom: 10px;
}
#footerDisclosure{
	margin-top: 10px;
	padding-top: 27px;
	background: #666 url(/images/layout/bg-eagle-footer.gif) no-repeat;
	clear: left;
}
#footerDisclosure img{
	float:right;
	margin:0px 10px;
}
/*************************** END EXPANDED FOOTER ************************************/

#contentContainer{
	width: 718px;
	overflow:visible;/*This line does 2 things. 1-makes it so that this div will stretch to contain any floated elements, and 2-makes IE6 ignore the extra margin that it is assigning to the UL element.*/
	float:left;
}

#generalContentArea{
	margin-top:55px;
}

#centerContentArea{
	float:left;
	width:502px;
	display:inline;
}

#centerRightContentArea{
	float:right;
	margin-right:-239px;
	width:740px;
	background:#ffffff;
}

* html #centerRightContentArea{
	position:fixed;/*IE 6 Hack.  Unfortunately, I had to use one.  This is to fix a goofy IE6 issue on the pages with no sidebar on the right.  This prevents the repeated shadow box from showing through.*/
}

#colContent, #colNav, #colContentHome{
	float: left;
}

#colContentHome, #colContent{
	width: 480px;
}

#colWidgets{
	float:left;
	display:inline; /*IE6 double margin fix.*/
	width: 247px;
	overflow:hidden;
	background: url(/images/layout/bg-head-nav.gif) 0 -55px repeat-x;
}

.colWidgetShort{
	height:44px;
}

#colWidgets h3{
	background:url(/images/layout/bg-side-grey.gif) repeat-x;
	height:25px;
	line-height:25px;
	padding-left:7px;
	margin:-5px -5px 0px -5px;
	color:#0d557b;
}

.leftSidebarBox h3, .rightSidebarBox h3{
	background:url(/images/layout/bg-side-grey.gif) repeat-x;
	height:25px;
	line-height:25px;
	padding-left:7px;
	margin:-5px -5px 0px -5px;
	color:#0d557b;
}

.leftSidebarBox dl, .rightSidebarBox dl{
	margin-top: 5px;
}
.leftSidebarBox dt, .rightSidebarBox dt{
	font-weight: bold;
	font-size: 12px;
	color: #666;
	padding-bottom: 3px;
	border-bottom: 1px solid #ccc;
	margin-left: 10px;
}
.leftSidebarBox dd, .rightSidebarBox dd{
	margin-top: 5px;
	margin-left: 10px;
}

.sidebarWidget{
	width:255px;
	clear:both;
}

#branchSearch{
	margin:10px 0px 0px 10px;
	padding-bottom:10px;
}

#headerContainer{
	height: 76px;
}

#headerContainer form{
	float:right;
	display:inline;/*IE6 double margin fix*/
	margin-right:10px;
}
#headerContainer ul{
	margin:0px;
	padding:0px;
}

#headerContainer ul li{	
	display:inline;
	margin:0px 15px 0px 0px;
	text-transform:uppercase;
	font-weight:bold;
	color:#888888;
}

#headerContainer ul li a{	
	color:#888888;
}
#headerContainer ul li a.active{
	color:#036;
}

#headerContainer ul li a:hover{	
	color:#3399cc;
}

#headerContainer ul{	
	margin-top:10px;
}

#mainNav{
	height:55px;
	background: url(/images/layout/bg-head-nav.gif) repeat-x 0 -55px;
	width:712px;
	float:right;
}
#mainNav ul{
	height: 55px;
	text-align: center;
	margin: 0px;
}

#mainNav ul li{
	list-style-type: none;
	height: 55px;	
	float: left;
	display:inline;
}	
#mainNav a.last{
	padding-right: 23px;
}
#mainNav a {
	float:left;/*This is to make the horizontal list work in IE6. I shouldn't have to float this element.*/
	display:inline;/*This is to take care of the double margin bug in IE6*/
	height: 55px;
	line-height: 38px;
	color: #036;
	padding: 0px 30px;
	background: transparent;
	font-weight: bold;
	font-size: 12px;
	text-decoration: none;
	white-space: nowrap;
	text-transform: uppercase;
	background:transparent url(/images/layout/bg-head-nav-li.gif) no-repeat scroll left top;
}
#mainNav a.active{
	background: url(/images/layout/bg-head-nav.gif) repeat-x 0 -110px !important;
	color: #fff;
}
#mainNav a:hover{
	background: url(/images/layout/bg-head-nav.gif) repeat-x 0 0;
}
#login{	
	background: url(/images/layout/bg-head-nav-li-last.gif) no-repeat scroll 0px 0px;
	height:41px;
	overflow:hidden;
	padding-bottom:5px;
}
#login a{
	display: block;
	text-decoration: none;
	font-size: 13px;
	color: #764b00;
	line-height: 38px;
	text-transform: uppercase;
	text-align: center;
	font-weight: bold;
	background: url(/images/layout/bg-head-nav-login.gif) repeat-x top;
	height: 55px;
	width:239px;
	float:right;
}
#login a:hover{
	color: #764b00;
	background: transparent url(/images/layout/bg-head-nav-login.gif) repeat-x 0 -55px;
}

/**** added for teathered login ****/
#login2{	
	background: url(/images/layout/bg-head-nav-li-last-new.gif) no-repeat scroll 0px 0px;
	height:45px;
	overflow:hidden;
}
#login2 a, #login2 span{
	display: block;
	text-decoration: none;
	font-size: 13px;
	color: #764b00;
	line-height: 38px;
	text-transform: uppercase;
	text-align: center;
	font-weight: bold;
	background: url(/images/layout/bg-head-nav-login-new.gif) repeat-x top;
	height: 45px;
	width:239px;
	float:right;
}
#loginBox{
	background: transparent url(/images/layout/bg-login-mid.gif) repeat-y 0 0 !important;
	margin-bottom: 0px;
}
#loginBox #formBox{
	padding: 3px 0px 15px 0px;
	border-bottom: 1px solid #fff;
	margin: 0px 25px 15px 30px;
	width: 200px;
}
#loginBox #formBox label{
	font-size: 11px;
	color: #666;
}
#loginBox ul{
	margin: 0px;
	padding: 0px;
	background: url(/images/layout/bg-login-bot.gif) no-repeat bottom left !important;
	padding-bottom: 22px;
}
#loginBox ul li{
	list-style-type: none;
	margin-left: 32px;
	background: url(/images/bul-login.gif) no-repeat 0 0;
	margin-bottom: 7px;
	height: 12px;
	font-size: 11px;
	line-height: 12px;
	padding-left: 18px;
}
#loginBox ul li a{
	color: #666;
}
/***** end teathered login addition ****/

#logo{
	margin:5px 10px 0px 15px;
}

#content{
	margin: 10px 10px 0px 10px;
	overflow:hidden;/*This is a hack to get IE6 and IE7 to expand the parent container around a floated item*/
	height:1%;/*Trigger HasLayout in IE6 and IE7*/
}

#columnContainer #fixedFirst{
	float:left;
	margin-bottom:10px;
	text-align:left;
}
#columnContainer #fixedSecond {
	float:left;
	margin-bottom:10px;
	text-align:left;
	margin-left: 10px;
}
#columnContainer #fixedFirst, #columnContainer #fixedSecond {
	width: 331px;
}

#columnContainer #first, #columnContainer #second, #columnContainer #third{
	width: 220px;
	float: left;
	display:inline;
	margin-bottom:1px;
}

#columnContainer #second, #columnContainer #third{
	margin-left: 10px;
}

#leftQuickLinks{
	width:216px;
	float:left;
}

.bodyContainer{
	background: #fff url(/images/layout/bg-body01.gif) repeat-x top left;
	min-height: 94px;
	margin-top: 3px;
	padding: 5px 10px;
}

.bodyContainer h3, .bodyContainer h4{
	text-transform: uppercase;
	color: #585858;
}

.bodyContainer h3 a, .bodyContainer h4 a{
	text-transform: none;
	color: #166697;
}

.bodyContainer h3 a:hover{
	color: #999;
}

.bodyContainer ul li, .bodyContainer ol li, #content ul li, #content ol li{
	margin-bottom: 5px;
}

/*ie6 compatability style*/
* html .bodyContainer{
	height: 94px;/*IE 6 treats height like all other browsers treat min-height*/
}

.bodyContainer2{
	border-top: 1px solid #ccc;
	padding: 10px 20px;
}
.bodyContainer2 h4{
	margin-bottom: 5px;
}

.bodyContainer2 h4 a:hover {
	color:#888888;
}

.leftFloatColumn{
	float: left;
	width: 48%;
	margin-right: 5px;
}
.leftFloatColumn ul{
	margin:0px 0px 0px 30px;
	padding:0px;
}

.leftFloat3Column{
	float:left;
	margin-right:5px;
	width:32%;
}
.leftFloat3Column ul{
	margin: 5px 0px 20px 12px;
}
.leftFloat3Column h4{
	margin-left: 5px;
}
.leftFloat3Column h4 a:hover{
	color:#888888;
}
.leftFloat3Column ul li{
	list-style-type: none;
	margin-bottom: 2px;
}

.actionItemsContianer{
	margin-top:15px;
	margin-bottom:20px;
	min-height:50px;
	text-align:center;
}

.actionBorder{
	border-left:solid 1px #dddddd;
}

* html .actionItemsContianer{ /*Min-height for IE6*/
	height:50px !important; /*IE 6 treats height like all other browsers treat min-height*/
}

.actionItemsContianer p{
	color:#835700;
	font-weight:bold;
	text-align:center;
	margin:10px;
}

.orangeButLink{
	background:url(https://assets.americafirst.com/images/bg-button-orange.gif) 0 0 no-repeat;
	color:#764b00;
	height:28px;
	overflow:hidden;
	line-height:28px;
	text-transform:uppercase;
	font-weight:bold;
	display:block;
	margin:13px auto;
	width:148px;
	text-align:center;
}

/*################################### TILE STYLES ##########################################################*/
#mainFeatureTile{
	width:477px;
}

.smallTile{
	float:left;
	width:237px;
	margin:5px 3px 0 0;
	display:inline;/*IE 6 Double Float Fix*/
}

#mainFeatureTile .shadowBoxContent{
	padding: 7px 10px 0;
}

.smallTile .shadowBoxContent{
	padding: 3px 5px 0;
}

.smallTile .shadowBoxBottom{
	margin-top:-4px;
}
/*################################# TABLE STYLES ###############################################*/
table#reviews{
	margin-top: 15px;
}

.bodyContainer table{
	border-collapse: collapse;
	margin: 10px 0px;
	text-align: left;
	width: 92%;
}
.bodyContainer table caption{
	font-weight: bold;
	font-size: 14px;
	color: #333;
	margin-top: 15px;
}
.bodyContainer th{
	background: #b2d289 none repeat scroll 0 0;
	border-bottom: 1px solid #FFF;
	border-top: 2px solid #92b663;
	color: #575757;
	font-size: 13px;
	padding: 8px;
}
.bodyContainer td{
	background: #e4f2d2 none repeat scroll 0 0;
	border-bottom: 1px solid #FFF;
	border-top: 1px solid transparent;
	color: #333;
	padding:8px;
}
.bodyContainer tr:hover td{
	background: #d5e8bd none repeat scroll 0 0;
}
.bodyContainer td a{
	font-weight: bold;
}

table.quickRates {
	width: 100%;
	font-size: .9em;
	border-collapse: collapse;
}

table.quickRates th, table.quickRates td {border-bottom: 1px dotted #666; line-height: 1.2em;}

table.width100 {width: 99%;}

table.contentTable {
	/*width: 100%;*/
	border-top: 1px solid #999;
	border-left: 1px solid #999;
	border-collapse: collapse;
	margin: 10px 0px 10px 1px;
}

table.contentTable caption {
	font-size: 1em;
	font-weight: bold;
	padding: 0 0 5px 0;
}

table.contentTable th, table.contentTable td {
	padding: 5px;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
}

table.contentTable th {
	/*background-color: #FFFFE6;*/
	background: #fff url(/images/bg_th_new.gif) bottom repeat-x;
	color: #000;
}

/* styles used in conjunction with table_stripes.js for automatic table striping. documented at http://validweb.nl/artikelen/javascript/better-zebra-tables/ */
table.contentTable tbody tr.even td {background-color: #F9F9F9;}

table.contentTable tbody tr.ruled td {
	background-color: #C6E3FF;
	font-weight: normal;
}

/* Opera fix for table striping */
head:first-child+body tr.ruled td {background-color: #C6E3FF;}

table.boardTable {
	border: 0px;
	text-align: center;
	margin: 0px;
}
table.boardTable td {
	padding-right: 20px;
	border-bottom: none;
	background: none;
	color: #000 !important;
}
table.boardTable tr.bottom td {
	padding-bottom: 20px;
}
table.boardTable tbody tr.ruled td {
	background-color: #fff !important;
}
table.boardTable tr:hover td{
	background: none;
}

table.sideRateTable{
	width: 99%;
	font-size: 11px;
	border: 1px solid #d5ebf6;
	border-collapse:collapse;
	text-transform: capitalize;
	margin-right: 5px;
}
table.sideRateTable tr td, table.sideRateTable tr th{
	text-align: left;
	padding: 3px 2px 3px 5px;
}
table.sideRateTable tr th{
	background-color: #d5ebf6;
}
table.sideRateTable tr{
	background-color: #f4fcff;
}
table.sideRateTable tr:hover td{
	background-color: #eee;
}
table.sideRateTable tr td em{
	font-weight: bold;
}

table.sideRateTable caption{
	padding: 5px 0px 2px 0px;
	font-weight: bold;
}
/*########################################## FORM STYLES ######################################*/
#searchFormDiv{
	margin: 15px 16px 0 0;
	text-align: right;
}
input[type="checkbox"], input[type="radio"]{
	border: none;
	background: none;
}
input[type="checkbox"]{
	margin-top: 5px;
}
input.topMargin{margin-top: 5px;}
input[type="submit"], input[type="reset"], input[type="button"]{
	font-size: .9em;
  color: #000;
	font-weight: bold;
	padding: 3px;
	border: 1px solid; 
	border-color: #ccc #000 #000 #ccc; 
	background: #FFA822 url("/images/btn_bg_submit.gif") center repeat-x;
	cursor: pointer;
}
input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover{
	background: #FFA822 url("/images/btn_bg_submit_hover.gif") center repeat-x;
	border-color: #ccc #000 #000 #ccc;
}
fieldset {
 	border: 1px solid #999;
 	padding: 10px;
	margin-bottom: 10px;
	background:#FFFFFF url(/images/bg_mobileupdates.gif) repeat-x scroll left top;
}
.submitBoxNoBack {
 	padding: 10px 5px;
 	text-align: center;
}
.submitBox {
	background:#FFFFFF url(/images/bg_mobileupdates.gif) repeat-x scroll left top;
 	padding: 10px 5px;
 	text-align: center;
	border: 1px solid #ccc;
	clear: both;
}
fieldset legend {
	background:#CCCCCC url(/images/bg_th_2.gif) repeat-x scroll center bottom;
	border:1px solid #999999;
	color:#FFFFFF;
	font-weight:bold;
	margin:10px 0pt;
	padding:4px 6px;
}
fieldset label {
 	float: left;
 	width: 50%;
 	margin-right: 5px;
 	margin-top: 2px;
 	padding-top: 2px;
 	text-align: right;
	font-weight: bold;
}
input, textarea, select {
  border: 1px solid #ccc;
	margin: 2px 0px;
	padding: 2px 0 2px 2px;
}
input.invalid, textarea.invalid, input.invalid:focus, input.sfFocus, textarea.invalid:focus {
	border: 1px solid #f00;
	background-color: #FFCECE;
}
input.inputHome{
	border:solid 1px #cccccc !important;
	vertical-align:middle !important;
	height:14px !important;
	background: #ffffff !important;
	margin: 0px !important;
	padding: 0px !important;
	font-size: 11px;
	line-height: 14px;
}
fieldset label.radioCheck {
	width: 98%;
	margin-left: 0;
	margin-top: 5px;
	padding-top: 0;
	text-align: left;
	font-weight: bold;
	font-size: 1em;
	line-height: 1.3em;
	clear: both;
}
label.radioCheck input {
	margin-right: 6px;
	float: left;
	background-color: #eee;
  border: 1px solid #999;
}
label.radioCheck input[type="radio"]{
	border: none;
	background: none;
}
input:focus, input.sfFocus, textarea:focus, select:focus{
	background: #C6E3FF none;
}
select:focus, select.sfFocus {
  background-color: #C6E3FF;
}
.submitButton{
  font-size: .9em !important;
	padding: 3px 2px !important;
  color: #000 !important;
	font-weight: bold !important;
	border: 1px solid !important; 
	border-color: #ccc #999 #999 #ccc !important; 
	background: #eee url("/images/bg_form_button_blue.gif") repeat-x bottom left !important; 
	cursor: pointer;
}
.submitButtonColor{
  font-size: .9em;
  color: #000;
	padding: 3px;
	font-weight: bold;
	border: 1px solid; 
	border-color: #ccc #000 #000 #ccc; 
	background: #FFA822 url("/images/btn_bg_submit.gif") center repeat-x; 
	cursor: pointer;
}
.submitButtonGeneral{
  color: #ffffff !important;
	background: url(/images/layout/bg-button-blue.gif) center repeat-x !important;	
	vertical-align: middle !important;
	font-weight: normal !important;
	text-transform: uppercase !important;
	font-size: 10px !important;
	height: 16px !important;
	padding:0 4px !important;
	border: none !important;
	margin: 0px !important;
	font-family:Arial,Helvetica,sans-serif !important;
}
a.submitButtonColor{
	color: #000 !important; text-decoration: none;
}
a.submitButtonColor:hover{
	background: #FFA822 url("/images/btn_bg_submit_hover.gif") center repeat-x;
}
div#displayError {
	border: 1px solid #f00;
	color: #f00;
	font-weight: bold;
	padding: 2px;
	margin: 10px 0px;
}
label {
	font-weight: bold;
}
.required {
	background: #eee url("/images/required_field.gif") right no-repeat;
}
/* for leadfusion input items */
input.tabButton, input.nextPageButton {
	border: none;
	background: none;
	margin: 0;
	padding: 0;
}

/*############################################## HSA STYLES #################################################*/

/* ----------------------- HSA STYLES ---------------------------*/

#hsaBanner{
	background: url(/images/hsa-head.jpg) no-repeat top left;
	height:187px;
	width:597px;
}

#hsaAbout{
	float:left;
	width: 283px;
	height:138px;
	background: url(/images/hsa-about.jpg) no-repeat top left;
	margin: 10px 10px 0px 10px;
	display:inline;/*To make it look right in IE6*/
}

#hsaAbout h2{
	height:0px;
	overflow:hidden;
	padding:14px 0px 0px 0px;
	background:url(/images/hsa-about.png) no-repeat top left;
	margin:7px 0px 5px 10px;
}

#hsaAbout p{
	margin: 20px 70px 0px 7px;
}

#hsaCompare{
	float:left;
	width: 283px;
	height:138px;
	background: url(/images/hsa-calc.gif) no-repeat top left;
	margin: 10px 10px 0px 0px;
	display:inline;/*To make it look right in IE6*/
	position:relative;
}

#hsaCompare h2{
	height:0px;
	overflow:hidden;
	padding:18px 0px 0px 0px;
	background:url(/images/hsa-calc.png) no-repeat top left;
	margin:7px 0px 5px 7px;
}

#hsaCompare p{
	margin:20px 20px 0px 7px;
}

#hsaEmployer {
	height: 23px;
	width:88px;
	position:absolute;
	bottom:6px;
	left:8px;
}

#hsaIndividual {
	height: 23px;
	width:88px;
	position:absolute;
	bottom:6px;
	right:17px;
}

#hsaEmploy{
	float:left;
	width: 283px;
	height:191px;
	background: url(/images/hsa-employers.gif) no-repeat top left;
	margin: 10px 10px 10px 10px;
	display:inline;/*To make it look right in IE6*/
	position:relative;
}

#hsaEmploy h2{
	height:0px;
	overflow:hidden;
	width:106px;
	background:url(/images/hsa-employers.png) no-repeat top left;
	padding:15px 0 0 0;
	margin:11px 0 0 12px;
}

#hsaEmploy p{
	margin:5px 20px 0px 7px;
}

#hsaEmployMore{
	position:absolute;
	bottom:1px;
	right:10px;
}

#hsaInd{
	float:left;
	width: 283px;
	height:191px;
	background: url(/images/hsa-individuals.gif) no-repeat top left;
	margin: 10px 10px 10px 0px;
	display:inline;/*To make it look right in IE6*/
	position:relative;
}

#hsaInd h2{
	height:0px;
	padding:15px 0 0 0;
	overflow:hidden;
	width:118px;
	background:url(/images/hsa-individuals.png) no-repeat top left;
	margin: 11px 0 0 12px;
}

#hsaInd li, #hsaEmploy li{
	list-style-image:url(/images/hsa-check.gif);
}

#hsaIndMore{
	position:absolute;
	bottom:1px;
	right:10px;
}

#hsaInd p{
	margin:5px 20px 0px 7px;
}

#hsaBottom{
	width: 580px;
	height: 138px;
	background: url(/images/hsa-why.gif) no-repeat top left;
	margin:10px 0px 15px 10px;
	padding-top:1px;
	position:relative;
}

#hsaBottom h2{
	height:0px;
	padding:18px 0 0 0;
	background:url(/images/hsa-why.png) no-repeat top left;
	overflow:hidden;
	margin:12px 0 0 10px;	
}

#hsaBottom ol li{
	list-style-image:none;
}

#hsaApply {
	width:58px;
	height:62px;
	position:absolute;
	top:68px;
	right:7px;
}

/*############################################### MOBILE STYLES ##########################################*/

.mobileupdates{ 
	background-color:#FFFFFF; 
	border:#e4e4e4 1px solid; 
	padding: 10px; 
	color:#333333; 
	background:#FFFFFF url(/images/bg_mobileupdates.gif) repeat-x scroll top left; 
	width:auto; 
	height:auto; 
	margin-bottom:12px;
}

/*#################################################### MISC STYLES ###############################################*/

.hidden {display: none;}
.clear {clear: both;}
.boldText{font-weight: bold;}
.centerText{text-align: center;}
.toolTipUnderline {border-bottom:2px dotted #003366 !important;cursor: pointer;}
.largeFont{font-size: 18px !important;}
.boldRed{font-weight: bold; color: #F00;}
#map {
	border: 1px solid #999;
	margin-bottom: 25px;
	font-size: 1.1em;
}
img.rightContentImage{
	border:medium none;
	float:right;
	margin:0 0 6px 12px;
	padding:5px;
}
.download{ background:url(/images/button-blue.gif) no-repeat top center; width:90px; height:23px; display:block; text-align:center; font: Arial, Helvetica, sans-serif; font-size:13px; color:#FFFFFF; line-height:22px; font-weight:bold; margin:0 15px 0 0;}
a.download:hover{ background-position:bottom; color:#FFFFFF;}
.regZ {font-size:1.8em;}
.btn a{background: url(https://assets.americafirst.com/images/layout/bg-btn-orange.gif) repeat scroll center top transparent; padding:8px; border: solid 1px #d8ab35; color:#764B00; font-weight:bold;}
.btn{padding:1px; margin:15px; text-align:center;}

/*#################################################### LIST STYLES ###############################################*/
ul.appList{
	list-style-type: none;
	list-style: none;
	font-size: 20px;
	margin-left: 0px;
}
ul.appList li{
	line-height: 35px;
}
#contentTools{
	clear: both;
	margin: 0px 0px 6px 10px;
}
#contentTools ul{
	list-style: none;
	font-weight: bold;
	margin:0px;
	padding:0px;
}
#contentTools ul li{
	text-transform:uppercase;
	display:inline;
	font-size: 11px;
	margin-right: 6px;
}
#contentTools ul li a{
	margin-right: 6px;
}
.rightFloatList{
	float: right;
	width: 190px;
	margin: 15px 0px 20px 20px;
	padding: 5px 10px 0px 10px;
	border: 1px solid #ccc;
	background-color: #fff;
}
.rightFloatList h5{
	color: #036;
	margin-bottom: 10px;
	text-transform: uppercase;
}
.rightFloatList ul{
	list-style: none;
	margin:0px;
	padding:0px;
}
.rightFloatList ul li{
	margin: 0px 0px 8px 0px;
}

/*################################################### BOX WITH SHADOW BORDER ####################################*/

.shadowBoxTop,
.shadowBoxBottom {
	font-size:1px; /* make IE behave on such short div's */
	height:10px;
	background:url(/images/layout/bg-container.png) -9px 0 no-repeat;
}

.shadowBoxBottom {
	background-position:-9px -10px;
}

.shadowBoxTop div,
.shadowBoxBottom div {
	float:right;
	width:12px;
	height:10px;
	background:url(/images/layout/bg-container.png) -2013px 0 no-repeat;
}

.shadowBoxBottom div {
	background-position:-2013px -10px;
}

.shadowBoxSide1 {
	background:url(/images/layout/bg-container.png) 0 0 repeat-y;
	padding-left:8px;
}

.shadowBoxSide2 {
	background:url(/images/layout/bg-container.png) top right repeat-y;
	padding-right:8px;
}

.shadowBoxContent {
	background:#FFF;
	padding:3px 5px 0px 5px;
}
.shadowBoxContentColor {
	background: #fff url(/images/layout/bg-shadow-box-blue.gif) repeat-x top left !important;
}
/*  IN ORDER TO USE THE SHADOW BOX, JUST COPY AND PASTE THE FOLLOWING CODE INTO A CONTAINER THAT HAS THE PROPER HEIGHT AND WIDTH PROPERTY (THIS IS SCALEABLE)
	
	<div class="shadowBoxTop"><div></div></div>
	<div class="shadowBoxSide1"><div class="shadowBoxSide2"><div class="shadowBoxContent">
		<!-- Contents of the container go inside here. -->
	</div></div></div>
	<div class="shadowBoxBottom"><div></div></div>

*/

#quickLinksHeader{
	height:0px;
	padding-top:40px;
	background:url(/images/hd-quick-links.png) no-repeat top center;
	width:203px;
	overflow:hidden;
}
.sidebarWidget .shadowBoxBottom, .leftImageBanner{
	background-position:-9px -14px;
}
.sidebarWidget .shadowBoxBottom div, .leftImageBanner div{
	background-position:-2013px -14px;
}

/*######################################## QUICK LINK STYLES ################################################*/

#colNav{
	width: 230px;
}

#colNav .shadowBoxContent div{
	background:#b8d288;
	margin-top:4px;
	height:488px;
}

#colNav .shadowBoxContent div h3{
	margin:0px 0px 0px 15px;
	color:#ffffff;
	border-bottom:solid #ffffff 1px;
	padding:7px 0px 5px 0px;
}

#colNav .shadowBoxContent div ul{
	margin:0px 0px 0px 15px;
	list-style-type:none;
}

#colNav .shadowBoxContent div ul li{
	border-bottom:solid #ffffff 1px;
	padding:3px 0px 3px 10px;
	background:url(/images/layout/bul-arrow-green.gif) no-repeat left center;/*We are using a background image instead of a bullet for compatibility with IE6 and IE7.*/
}

#colNav .shadowBoxContent div ul li.more{
	border-bottom:solid #ffffff 1px;
	padding:3px 0px 3px 10px;
	background:url(/images/layout/bul-plus-green.gif) no-repeat left center;/*We are using a background image instead of a bullet for compatibility with IE6 and IE7.*/
}

#colNav .shadowBoxContent div ul li a{
	color:#000000;
	font-size:11px;
	display:block;
}

#colNav .shadowBoxContent div ul li a:hover{
	color:#ffffff;
}

/*############################## LEFT SIDEBAR STYLES ###################################*/
/*---Green---*/
#lsGreen {
	background:#B8D288;
}

#lsGreen h2{	
	background:url(/images/ls-green.gif) no-repeat top center;	
}

#lsGreen ul li{
	color:#666666;
}

#lsGreen ul li a{
	color:#333333;
}

#lsGreen ul li a:hover{
	color:#666666;
}

/*---Blue---*/
#lsBlue {
	background:#00548e;
}

#lsBlue h2{	
	background:url(/images/ls-blue.gif) no-repeat top center;	
}

#lsBlue ul li{
	color:#999999;
}

#lsBlue ul li a{
	color:#ffffff;
}

#lsBlue ul li a:hover{
	color:#999999;
}

/*---End of side bar colors---*/

.sideBarContent h2, .rightSideBarContent h2{
	font-size:15px;
	width:180px;
	height:40px;
	line-height:26px;
	text-transform:uppercase;
	color:#555555;
	padding-left:10px;
}

.sideBarContent ul{
	margin:0px 0px 0px 15px;
	list-style-type:none;
	padding-bottom:10px;
}

.rightSideBarContent ul{
	margin:5px 0px 0px 5px;
	list-style-type:none;
}

.rightSideBarContent ul li{
	font-size: 13px !important;
}

.sideBarContent ul li, .rightSideBarContent ul li{
	border-bottom:solid #ffffff 1px;
	padding:3px 0px 3px 3px;
	font-weight:bold;
	font-size:11px;
}

.sideBarContent ul li a{
	font-size:11px;
	display:block;
	font-weight:bold;
}

.rightSideBarContent ul li a{
	font-size:13px;
	display:block;
	font-weight:bold;
}

.sideBarContent ul li a:hover, .rightSideBarContent ul li a:hover{
	color:#777777;
}

.sideBarContent ul li#selected{
	/*background-color:rgba(255,255,255, .3); /*Some browsers will ignore this, but newer browsers will have no problem. */
	padding:0px;
}

.sideBarContent ul li ul li{
	border-bottom:none;
	background: url(/images/layout/bul-arrow-green.gif) no-repeat left center;
	padding-left:8px;
}

.sideBarContent ul li#selected span{
	display:block;
	background-color:rgba(255,255,255, .3); /*Some browsers will ignore this, but newer browsers will have no problem. */
	padding:3px 0px 3px 3px;
}

/*#####################################################  H1 title page styles  ##############################################*/
h1#bgHeadPersonal, h1#bgHeadBusiness, h1#bgHeadAbout, h1#bgHeadInvestments, h1#bgHeadTools{	
	height:49px;
	padding-left:10px;
	line-height:49px;
	color:#ffffff;
	margin-bottom: 5px;
	height: auto;
}
h1#bgHeadPersonal{background:url(/images/bg-title-green.png) repeat-x;}
h1#bgHeadBusiness{background:url(/images/bg-title-darkblue.png) repeat-x;}
h1#bgHeadAbout{background: #996500 url(/images/bg-title-brown.png) repeat-x bottom left;}
h1#bgHeadInvestments{background:url(/images/bg-title-gray.png) repeat-x;}
h1#bgHeadTools{background:url(/images/bg-title-lightblue.png) repeat-x;}

/* --------------------------------------------- 
	start icon classes for using icons with links 
--------------------------------------------- */
.phone, .chat16, .closexbox16, .edit16, .notes16, .mail, .feedback16,
.browserIE, .browserFF, .browserChrome, .browserSafari, .browserOpera{
	margin: 0;
	padding: 2px 0 2px 22px;
	line-height: 18px;
	background: no-repeat left center;
}
.phone {background-image: url(/images/icons/16/mobile-phone_16.gif);}
.chat16 {background-image: url(/images/icons/16/chat_16.gif);}
.closexbox16 {background-image:  url(/images/icons/16/close_16.gif);}
.edit16 {background-image:  url(/images/icons/16/edit_16.gif);}
.notes16 {background-image:  url(/images/icons/16/notes_16.gif);}
.mail {background-image: url(/images/icons/16/mail_16.gif);}
.feedback16 {background-image: url(/images/icons/16/favorites_16.gif);}
.browserIE {background-image: url(/images/icons/browser_msie.png);}
.browserFF {background-image: url(/images/icons/browser_firefox.png);}
.browserSafari{background-image: url(/images/icons/browser_safari.png);} 
.browserChrome{background-image: url(/images/icons/browser_chrome.gif);}
.browserOpera{background-image: url(/images/icons/browser_opera.png);}
/* ----------------- 
	end icon classes 
----------------- */
/*-----------------------------------------------------------------------------------------------*/
/*                   A BETTER TOOLTIP - POWERED BY JQUERY AWESOMENESS                            */
/*                   AUTHOR: jon cazier                                                          */
/*                   EMAIL: jon at 3nhanced dot com                                              */
/*-----------------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------------------*/
/*                                  CSS RESET THANKS TO ERIC MEYER                               */
/*                   http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/                */
/*-----------------------------------------------------------------------------------------------*/
.tip {
	width: 212px;
	padding-top: 37px;
	overflow: hidden;
	display: none;
	position: absolute;
	z-index: 500;
	background: transparent url(/images/tipTop.png) no-repeat top;
	color:#666;
	font-size:11px;
}
.tipMid {
	background: transparent url(/images/tipMid.png) repeat-y; 
	padding: 0 20px 0 20px;
}
.tipBtm {
	background: transparent url(/images/tipBtm.png) no-repeat bottom; 
	height: 32px;
}



/*-----------------------------------------Blockquote Styles---------------------------------------*/
.bodyContainer blockquote{
	background: #cde4f2 url(/images/blockquote-t.gif) no-repeat scroll center top;
	color: #256e9b;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 13px;
	font-style: italic;
	font-weight: bold;
	line-height: 1.5;
	margin: 20px auto;
	padding-top: 12px;
	width: 353px;
}
.bodyContainer blockquote p{
	margin: 0px;
	padding: 8px 55px 0;
}
.endquote{
	background: transparent url(/images/blockquote-b.gif) no-repeat scroll center bottom;
	display:block;
	margin:0;
	padding:8px 55px 20px !important;
}

/* -----------------------PRESS RELEASE STUFF ---------------------*/


/*### new news section css###*/
.presImage{
	float:left;
	margin:0px 15px 15px 0px;
}

.newsList{
	list-style-type:none;
}
.newsList span{
	color:#888;
	font-size:9px;
	text-transform:uppercase;
}

.newsList li{
	border-bottom:1px solid #eee;
	margin-bottom:3px !important;
	padding-bottom:5px;
}

.newsList h3{
	font-size:14px;
}

.archiveYear h3{
	border-bottom:solid 1px black;
}

#newsArchive ul{
	list-style-type:none;
}

#newsArchive{
	margin-left:115px;
}

.archiveYear{
	list-style-type:none;
	float:left;
	margin-left:0px;
	border-right:solid 1px #999999;
	padding-right:10px;
}

#newsRssContainer{
	background: url(https://assets.americafirst.com/images/icons/news-rss-feed-icon.png) no-repeat left center;
	height:20px;
	border:solid 1px #eeeeee;
	overflow:hidden;
	width:90%;
	margin:auto;
}

#newsRssContainer p{
	line-height:20px;
	margin:0px 10px 0px 0px;
	padding:0px;
	text-align:right;
}

#newsCatContainer{
	border:solid 1px #eeeeee;
	margin-bottom:10px;
}

#newsCatContainer p{
	text-align:center;
}

.newsRss li a{
	background:url(/images/icons/rss-feed-icon-small.png) no-repeat left center;
	padding-left:20px !important;
}

 /*#### End New News CSS ### */

/*-----------------
Payment Partner Styles
-------------------*/

.ppReasonOne {
	background:url(/images/step-1a.gif) no-repeat top left;
	padding:0px 0px 0px 50px;
	min-height:50px;
	height:auto !important; /*This and the next line are to make IE6 honor minimum height*/
  height:50px;
}
.ppReasonOne strong{
	font-size:18px;
	color:#D69328;
	font-weight:bolder;
}
.ppReasonTwo {
	background:url(/images/step-2a.gif) no-repeat top left;
	padding:0px 0px 0px 50px;
	min-height:50px;
	height:auto !important; /*This and the next line are to make IE6 honor minimum height*/
  height:50px;
}
.ppReasonTwo strong{
	font-size:18px;
	color:#D69328;
	font-weight:bolder;
}
.ppReasonThree {
	background:url(/images/step-3a.gif) no-repeat top left;
	padding:0px 0px 0px 50px;
	min-height:50px;
	height:auto !important; /*This and the next line are to make IE6 honor minimum height*/
  height:50px;
}
.ppReasonThree strong{
	font-size:18px;
	color:#D69328;
	font-weight:bolder;
}
.paymentPartner {
	list-style-image:url(/images/arrow-green.png);
}

.ppFormInfo {
	width:45%;
	float:left;
	margin:10px;
}

.ppFormInfo fieldset{
	padding:5px; /*Safari adds extra padding. This is to clarify how much padding it should have.*/
}

.ppSuccess {
	padding:10px 0px 0px 50px;
	background:url(/images/green-check.png) no-repeat top left;
	height:50px;
}

.ppSubText {
	margin-left:50%;
}

/*-----------------
End Payment Partner Styles
-------------------*/

/*-----------------
Begin Member / Non Member Form Styles
-------------------*/
.col2Box{
	float: left;
	width: 280px;
	background:#FFFFFF url(/images/bg_mobileupdates.gif) repeat-x scroll left top;
	border:1px solid #999999;
	padding: 10px 15px;
	margin: 10px 0px 10px 15px;
	min-height: 210px;
}
.col2Box a{
	color: #5784B3;	
}
.col2Box h4{
	margin-bottom: 15px;
}
.bulletArrow16, .bulletLearn16{
	margin: 0;
	padding: 2px 0 2px 20px;
	line-height: 18px;
	background: no-repeat left center;
}
.bulletArrow16 {background-image: url(/images/icons/16/bullet-arrow-16.gif);}
.bulletLearn16 {background-image: url(/images/icons/16/bullet-learn-16.gif);}
/*-----------------
End Member / Non Member Form Styles
-------------------*/

/* Online Banking FAQ */
.obFaq{
	background:none;
}

.obFaq .CollapsiblePanelTab{
	background:none;
	padding:2px 2px 2px 15px;
}

.obFaq .CollapsiblePanelTabHover{
	background:#f2f4ec;
}

.obFaq .CollapsiblePanelOpen{
	background:#d5e88d;
}

.obFaq .CollapsiblePanelContent{
	margin-top:0px;
}

.obFaq h3{
	border-bottom:solid 2px #D5E88D;
	margin-top:20px;
	color:#333333;
}

/* Investment Market Snapshot Widget */
#marketSnapshot{
	padding: 10px 0px 5px 25px;
}