body {
	margin: 5px;
	padding: 0;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 76%;
	background: white;
/*	behavior: url("/csshover.htc");*/
	}
* {margin:0; padding:0;}
/* Layout Structure */

#wrapHead {
	margin-right: 5px;
	width:788px; /* gg3 768 */
	background: #b7c5c1 url(/images/corner-br.gif) no-repeat bottom right;
}	
#wrapRest {margin-right: 5px;
	width:788px; /* gg3 768 */
 	background: url(../images/menuBarHome128c.gif) repeat-y top left;
	/*  	background:   url(/images/menuBarHome128b.gif) repeat-y top left; */
}	

#content {
	float: right;
	width: 660px; /*  - took out extra 4 px gg3 - adding 20 px. 644 why the extra 4 px? */
	line-height: 1.5em;	
}

#divider{
	background-image: url(/images/whiteLine.gif);
	background-color: white;
	padding-top: 0px;
	font-size: .5em;
}
#navContain{

}
#sidebar {
	float: left;
	width: 128px; 
	
	}
#bottomWrap{
	padding-top: 0px;
	font-size: .5em;
	width: 660px; /* gg3 was 640 */
	margin-left: 128px;
	background: url(/images/cornerGray-lr.gif) no-repeat bottom right;
}
#footer {
	clear: both;
	padding-top: 2px; /* top r/l bottom*/
	padding-right: 1em;
	background: #fff;
	height: 1%;
	}

/* gutters  */
#content .gutter{
	margin: 0 2em 2em 1.5em; /* to avoid problems in FF at large text*/
	/*margin: 0 15px 2em 25px;	/* gg3 changed left margin 15px*/
	margin-top: 1em;
/*	padding-left: 5px;
	padding-bottom: 15px;*/
}
#sidebar .gutter{
	/*padding: 15px 0;*/
}

/* HEADER */	
#headerRight {
	float: right;
	width: 572px; /* gg3 552 - old...538px;*/
	}
#headerLeft {
	float: left;
	width: 216px;/*230px;*/
	background: #b7c5c1;
	}	

#headerLeft h1 {
	margin: 0;
	margin: 5px 0 0 4px;	
	padding: 0;
	background: url(/images/logo2.gif) no-repeat top left;
	height: 80px;
	}	
	
form.search{
	text-align: right;
	margin: 10px 10px 0 0;	
}
	

/* from http://24ways.org/advent/centered-tabs-with-css */
#headNav{
	margin-bottom: 4px; /* 9/06 changed to allow for more padding under links */
}
#headNav ul, #headNav ul li {
   list-style: none;
	/* margin-top: 40px;*/ /* 9/06 changed to allow for more padding under links */
	margin-top: 34px;
 }

 #headNav ul {
   text-align: right;	
 }

 #headNav ul li {
   display: inline;
   margin-right: .75em;
	font-size: 10px;

}

 #headNav ul li.last {
     margin-right: 8px;
 }	
#headNav li a {
/*     padding: 5px .5em;*/
	padding: 5px 8px;/*5px 2px;*/
	text-decoration: none;
	color: #4d4c4c;
	font-weight: bold;
 } 
#headNav li a:hover {color: black;

 } 
/*orig lola - before pseudo sliding doors technique
 a#lola img{
 	border: 0;
	width: 88px;
	background: url(/images/askLolaNavBarNew2.gif) no-repeat top left ;
}
 a#lola:hover img{
 	border: 0;
	background: url(/images/askLolaNavBarOver.gif) no-repeat top left;
}
 */
 a#lola img{
 	 border: 0;
	width: 88px;
 	background: url(/images/askLolaTogether.gif) no-repeat 0 0 ; 
 }

 a#lola:hover img{
 	border: 0;
	background-position: 0 -30px; 
}

/*end of headNav inside header*/
	

/*main nav menu starts here */
/*XXXXXXXXXXXX Primary top nav rules XXXXXXXXXXX*/

.nav {
	border: 1px solid #FFF; /* borders the top and bottom of the top nav */
	border-width: 0 0 1px 0;
	/*	width: 100%;*/
	width: 660px; /* gg3 was 640 */
	margin-left: 128px; /* GG 128px; */
	font-family: Arial, Helvetica, sans-serif;
	/*font-size: 1.1em; works at medium or smaller*/
	font-size: 13px;
	background:  #8ba7bb url(/images/cornerGray-tr.gif) no-repeat top right;
}

.nav li {list-style: none;} /* removes list bullets */

.mainnav {
	width: 110px; /* GG 128px; */
	float: left;
	text-align: center;
}

.floatfix {margin-right: -3px;}

.parent {
position: relative;
} 
/* needed for absolute positioned drop downed*/
/* it is this that is hovered */
.parent:hover {background-image: url(bgfix.gif);} 										
/*XXXXXXXXXXXX Primary dropdown rules XXXXXXXXXXX*/

.dropdown { /* rules for dropdown div */
	width: 170px; /* gg3 128- big john - gg2 166px for new tab *//* GG 188px; */
	position: absolute;		
	left: -3000px;
	top: auto; /* puts dropdowns directly under top nav */
	text-align: left; /* needed because IE misapplies text centering to boxes */	
	background:  url(/images/bgfix.gif);
	background:none; /* GJG this takes care of the ie8 black backgroundissue */

	 /*padding: 0 30px 30px 30px;gg2 for ie8 */
}
	
.dropdown ul { 

	width: 109px; /* gg3 105 GG 127px; tweaked so that dropdowns appear to "line up" with top links */
	border: 1px solid #FFF; 
	border-width: 1px 1px 0; /* borders for the sides and top of the dropdowns and flyouts; links 
	provide the bottom border */ 
	 margin: 0 30px 30px 30px; /*gg2 eliminate for ie8 creates "sticky hovering" zones for dropdowns */
} 
	
.loan .dropdown ul {width:110px;} /*gg3 106; GG 128px; modifies width for rightmost "visible" dropdown (tweak) */
		
.mainnav:hover div.dropdown {left: -31px;} /* hover rule for dropdowns: the extra pixel makes 
dropdowns "line up" with top links */ 


/*XXXXXXXXXX Secondary dropdown rules XXXXXXXXXXXX*/

.nav a {
	color: #FFF;
	font-weight: bolder;
	font-size: 12px;
	text-decoration: none;
	padding: 5px 0 5px 1px; /* 6px 0 5px 10px;  */
	display: block;
	border-right: 1px solid #FFF; /* makes the dividers between the top nav links; must be negated 
	for later links */ 

} 

.person a {
	border-left: 1px solid #FFF; 
}
.info a {border-right: 0;} /* removes right border on last top link */
	
.dropdown li {vertical-align: bottom;} /* IE5/win bugfix */
				
.dropdown li:hover {background: #000;} /* hover color effect on dropdown links */

.nav div div a {
	color: #fff;
	border-right: 0; /* negates right border for dropdowns */
	border-bottom: 1px solid #FFF;  /* borders the bottoms of the dropdowns */
	padding-left: 5px; /* a little left side padding */
}

/*XXXXXXXXXXX Top nav and dropdown backgrounds XXXXXXXXXX*/
.person {background: #987995;}
.person ul {background: #80627C;}

.business {background: #c7a273;}
.business ul {background: #a48051;}

.invest {background: #88ab9f; }
.invest ul {background: #6c9084; }

.loan {background: #aabac6;}
.loan ul {background: #909ea8;}

.eGSB {	background: #E8C17E;}
.eGSB ul {	background: #c2a269;}
	

.info {/*background: #8ba7bb;*/ /* white to cover gray in tab */
background: url(/images/cornerGray-tr.gif) no-repeat top right;


 }
.info ul {background: #7698AF; }
/*XXXXXXXXXXX Special fixes XXXXXXXXXXX*/
/* there's speical stuff in the ie css */

.brclear { /* Use a break with this class to clear float containers */
	clear:both;
	height:0;
	margin:0;
	font-size: 1px;
	line-height: 0;
}
/* removed some drop down window stuff */

	
/*end of main nav */		
/* 
-
-
-
*/
/* content */
#content h2{
	margin: 0 0 1em 0;
	padding: 0;
	font-size: 1.5em;
	color: black;
}

.bold{
	font-weight: bold;
}
.italics{
	font-style: italic;
}
#content .redText{
	color: #ff0000;
}

/* be aware of the font size with the floated picture being shoved up */
.super {
vertical-align: super;
font-size: 0.5em;
} 
p .super {
vertical-align: super;
font-size: 0.75em;
} 
.subscript {
vertical-align: sub;
font-size: 0.5em;
}
	

/*xxxxxxxxxxxx           sidebar menu          xxxxxxxxxxxxxxxx */
#sidebar h2{
	font-size: 1.2em;
/*	padding: 5px 0;*/
	padding: 5px 1px 5px 5px;
	border-top: 2px solid #fff;
	background-color: #68867c;
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
}
/* set margin-left for ie/opera, padding-left for others */
/* about lists and csacading: embedded class objects don't work for FF; ie .subnav li a
	However, embedded ID objects work, ie #submenu li li a
	*/	
.box{
	border-top: 2px solid #fff;
	font-size: 11px;/*.90em;*/
}
.boxFollows{
	border-top: 2px solid #fff;
	font-size: 11px;
}

#sidebar ul{
	margin-left: 0px; 
	padding-left: 5px;
	padding-bottom: 5px;
	list-style-type: none;
}
#sidebar li{
	padding: .15em 0;
}
#sidebar .box a{
	display: block;
	width: 100%;
	text-decoration: none;
	color: #4d4c4c;
	font-weight: bold;
	line-height: 1.5em;	
}
#sidebar .box a:hover{
	color: #000
}
#sidebar .boxFollows a{
	display: block; 
	width: 100%;
	color: #4d4c4c;
	font-weight: bold;
	line-height: 1.5em;
}
#sidebar .boxFollows a:hover{
	color: #000;
}

.box h3, .boxFollows h3 {
	font-size: 11px;
	color: #000;
	font-weight: bold;
}
/*xxxxxxxxxxxx         end  sidebar menu          xxxxxxxxxxxxxxxx */



/* xxxxxxxxxxxx          trailer stuff            xxxxxxxxxx*/
#footNav ul, #headNav ul li {
     list-style: none;
	  margin-top: 0px;
	  color: #007041;
 }

 #footNav ul {
    text-align: right;
	 line-height: 2;
 }

 #footNav ul li {
    display: inline;
	 font-size: .8em;
 }

 #footNav ul li.last {
    margin-right: 0;
	 padding-right: 0;
 }	
#footNav li a {
	padding: 5px 0px 10px 10px;
	text-decoration: none;
	color: #007041;
 } 

#footNav li a:hover {
	color: black; 
} 

.footerCopyText{
	 text-align: right;
	 font-size: .85em;
	 color: #A7A7A7;
}
.imgSpace{
	padding-left: 10px;
}

/* xxxxxxxxxx          end trailer stuff          xxxxxxxxxx */





/*xxxxxxxxxx           misc other items           xxxxxxxxxx */
.clearfloats{
	clear: both;
}

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-table;}

/* xxxxxxxxxx          end misc stuff         xxxxxxxxxx */



/* xxxxxxxxxx          content area          xxxxxxxxxx */
#contentLists{
	float: right;
	width: 160px;
	z-index: 50;
	padding: 0;	
	padding-left: 15px;
/*	border-left: solid 2px red; for testing only
*/
}

#contentMain{
	float: left;
	width: 410px; /*	410px;this also works width: 70%;*/
	margin: 0 5px 10px 0;
}

/* xxxxx     right side content stuff     xxxxx */
#contentLists h3, h5{
	color: #475B54;
	padding-top: 5px;
}
.contentListBox{
/*	margin: 0 0 15px 0;*/
	padding-left: 5px;
	background: url(/images/home/long160_02.gif) no-repeat bottom left;
	width: 160px;
	margin-bottom: 15px;
}

#contentLists ul{
/*	margin: 5px 1.25em 5px 1.25em; */
	margin: 5px 1.25em 5px .25em;
	padding-left: 10px;
	list-style: none;
	list-style-image: url(/images/bullet2.gif);
	background:transparent;
}
#contentLists li{
	padding: .3em 0;
/*	text-indent: .5em;*/
}
#contentLists a, #contentLists a:visited{
	COLOR: #446175;
}
#contentLists a:hover, #contentLists li:hover{
	color: #000;
	list-style-image: url(/images/bullet3.gif);
}

 /* for David - is for a div, not as a class*/
#redDK a, #redDK a:visited{
	COLOR: #ff0000;
}
#redDK a:hover, #redDK li:hover{
	color: #000;
	list-style-image: url(/images/bullet3.gif);
}
#content .listNoBullet{
list-style-type: none;
	
}

.topofList{
	background: url(/images/home/long160_01.gif) no-repeat top left;
	margin-left: -5px;
	padding: 0 8px;
	line-height: 1.5;
}

#contentLists table td { 
font-size: 10px;
line-height: 1;
margin: 0;


}
#contentLists table th{ 
font-size: 10px;
text-align: left; 
line-height: 1;
margin: 0;
}
.extraHeight{
	padding: 0 0 4px 0;
}

.green{
	color: #475B54;
}
.reverseTH{
	background: #000;
	color: white;
	text-align: center;
}

/* xxxxx     end right side content stuff     xxxxx */

/* xxxxx     left side content stuff     xxxxx */
.toLeft100{
		float: left;
		width: 100px;
	}
.toLeft300{
	/*	float: left;*/
		width: 300px;
	}
.toRight100{
	float: right;
	width: 100px;
}
/* the next two go together
	having margin-left will push over a paragraph past an image left aligned
	also used to .toLeft100 on a img for the width of the image
	Notice that it also cascades the .toLeft300 above, which has the width
		*/
		
p.toLeft300{
	margin-bottom: 5px;
}
p.toLeft300alignImage{
	margin-bottom: 5px;
	margin-left: 100px;  
}

/*end of these two */


p.toLeft400{
	width: 400px;
	margin-bottom: 5px;
}

#contentMain a:link {
text-decoration: none;
color: #475B54;
font-weight: bold;
}

#contentMain  a:visited {
text-decoration: none;
color:  #475B54;
font-weight: bold;
}
#contentMain a:hover{
	color: black;
}
#contentMain h3 a:hover, #contentMain dt a:hover{
	text-decoration: none;
	background: #AEAEAE;
	border-top: solid 2px white;
	border-bottom: solid 2px white;
}

 /* xxxxx  gjg for link within content text xxxxx */
#contentMain  a.textLink:link{ 
text-decoration: underline;
color: #0000ff;
font-weight: bold;
}
#contentMain  a.textLink:hover{ 
text-decoration: underline;
color: #000000;
font-weight: bold;
}

#contentMain  a.textLink:visited {
text-decoration: underline;
color: #663399;
font-weight: bold;
}



div#content .boxbp ul{

 	margin-left: 1.5em;
	list-style: disc;
	margin-bottom: 1.2em;
	padding-bottom: 0;
	margin-top: -1.2em;
 }

/* xxxxx     bullet proof box    xxxxx */ 
.boxbp {
 /* width: 273px;*/
 	width: 420px;
 	margin-bottom: 10px;
 	background: url(/images/home/rounded520_02.gif) no-repeat bottom left; 
  }
  
 /* same markup as #contentMain dt */
.boxbp h3 {
  margin: 0;
  padding: 6px 12px 4px 10px;
  font-size: 1.5em;
  border-bottom: 1px solid #9093a8;
	background: url(/images/home/rounded520_01.gif) no-repeat top left;  
	color: #475B54;/* color: #68867c; */
  }
  
.boxbp ul, .boxbp p {
  padding: 5px 15px 14px 15px;
  list-style: none;
}
.largerText {
  font-size: 1.2em;
}
  
.boxbp li {
  margin: 0 0 6px; 
} 
.boxbp .moveOverForImage100{
	padding-left: 108px;
}

.boxbp img{
	margin-left: 2px;
	margin-right: 8px;
}
.alt img{
 	margin-right: 2px;
 	margin-left: 5px;
 }




	