/* CSS for the Kirkpatrick Bank Homepage */

#homeBtmBar{
	display:inline-table;
	width:100%;
	background-color:#000;
	padding:15px 0;
}

#homeBtmBar2010{
	display:inline-table;
	width:520px;
	height:50px;
	background-color:#000;
	padding:15px 0;
}

#homeBtmLeft{
	vertical-align:top;
}

#homeBtmLeft{
	width:340px;
	text-align:center;
	margin:0 0 0 15px;
}

#homeBtmLeft2010{
	vertical-align:top;
}

#homeBtmLeft2010{
	width:240px;
	text-align:center;
	margin:0 0 0 15px;
}

#thingsWeLove{
	position:absolute;
	z-index:2;
	margin:361px 0 0 33px;
	background-color:#000;
}

#thingsWeLove2010{
	position:absolute;
	z-index:2;
	margin:305px 0 0 33px;
	background-color:#000;
}

#promoDiv{
	position:absolute;
	z-index:3;
	overflow:hidden;
	height:0;
}

#promoX{
	position:absolute;
	z-index:4;
}

#promoDiv2010LL{
    background:  url(../assets/images/whatsnewwithkb.png) no-repeat bottom;
	position:absolute;
	z-index:3;
	overflow:hidden;
	width:366px;
	height:307px;
	margin-left:521px;
	margin-top:252px;
	padding-bottom:60px;
	background-color:#666666;
}

#promoDiv2010{
    background:  url(../assets/images/whatsnewwithkb.png) no-repeat;
	position:absolute;
	z-index:3;
	overflow:hidden;
	width:366px;
	height:312px;
 	margin-left:-10px;
	margin-top:-20px; 
	padding-top:0px;
	background-color:#666666;
}

#promoDiv2010 p{
	font-size:15px;
}

#promoDiv2010 li{
	font-size:10px;
}

#promoX{
	position:absolute;
	z-index:4;
}


#easteregg{
	display: none;
}



/* Layout helpers
----------------------------------*/
.ui-helper-hidden { display: none; }
.ui-helper-hidden-accessible { position: absolute; left: -99999999px; }
.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
.ui-helper-reset a{ margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.ui-helper-clearfix { display: inline-block; }
/* required comment for clearfix to work in Opera \*/
* html .ui-helper-clearfix { height:1%; }
.ui-helper-clearfix { display:block; }
/* end clearfix */
.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }


/* Accordion
----------------------------------*/
.ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; }
.ui-accordion .ui-accordion-li-fix { display: inline; }
.ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; }
.ui-accordion .ui-accordion-header a { display: block; font-size: .8em; padding: .5em .5em .5em .7em; }
/* IE7-/Win - Fix extra vertical space in lists */
.ui-accordion a { zoom: 1; }
.ui-accordion-icons .ui-accordion-header a { padding-left: 1.2em; }
.ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; }
.ui-accordion .ui-accordion-content { padding: 1em 1.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: hidden; display: none; zoom: 1; }
.ui-accordion .ui-accordion-content-active { display: block; }/* Autocomplete
----------------------------------*/
.ui-autocomplete { position: absolute; cursor: default; }	
.ui-autocomplete-loading { background: 666666; }

/* workarounds */
* html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */


/* Component containers
----------------------------------*/
.ui-widget { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1.1em/*{fsDefault}*/; }
.ui-widget .ui-widget { font-size: 1em; }
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1em; }
/*
for 3 accordion items max-height:171px; min-height:171px;
for 4 accordion items max-height:136px; min-height:136px;
for 5 accordion items max-height:110px; min-height:110px;
-------------------------------------------------------------------*/
.ui-widget-content { max-height:105px; min-height:105px; background: #ffffff/*{bgColorContent}*/ url(../assets/images/homepagepromobg.jpg)/*{bgImgUrlContent}*/ 100%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/; color: #FFFFFF/*{fcContent}*/; background-position:top; }
.ui-widget-content a { color: #FFFFFF/*{fcContent}*/; }
.ui-widget-header { background: #cccccc/*{bgColorHeader}*/; color: #222222/*{fcHeader}*/; font-weight: bold; }
.ui-widget-header a { color: #222222/*{fcHeader}*/; }


#promoDiv2010-1{
	background-color: #FF6000;
	background:  url(../assets/images/un-orange-accordion.png) repeat-x; 
}

#promoDiv2010-2{
	background-color: #2D3D98;
	background:  url(../assets/images/un-blue-accordion.png) repeat-x; 
}

#promoDiv2010-3{
	background-color: #acb737;
	background:  url(../assets/images/un-green-accordion.png) repeat-x; 
}

#promoDiv2010-4{
	background-color: #dea639;
	background:  url(../assets/images/un-yellow-accordion.png) repeat-x; 
}

#promoDiv2010-5{
	background-color: #761B02;
	background:  url(../assets/images/un-red-accordion.png) repeat-x; 
}

#promoDiv2010-img{
	margin-top:-20px;
}


/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { background: #e6e6e6/*{bgColorDefault}*/; font-weight: normal/*{fwDefault}*/; color: #555555/*{fcDefault}*/; }


/*
#promoDiv2010-1.ui-state-default a, #promoDiv2010-1.ui-state-default a:link, #promoDiv2010-1.ui-state-default a:visited { color: #ffffff; text-decoration: none; background-color:#333333; }
#promoDiv2010-2.ui-state-default a, #promoDiv2010-2.ui-state-default a:link, #promoDiv2010-2.ui-state-default a:visited { color: #ffffff; text-decoration: none; background-color:#333333; }
#promoDiv2010-3.ui-state-default a, #promoDiv2010-3.ui-state-default a:link, #promoDiv2010-3.ui-state-default a:visited { color: #ffffff; text-decoration: none; background-color:#333333; }
#promoDiv2010-4.ui-state-default a, #promoDiv2010-4.ui-state-default a:link, #promoDiv2010-4.ui-state-default a:visited { color: #ffffff; text-decoration: none; background-color:#333333; }
#promoDiv2010-5.ui-state-default a, #promoDiv2010-5.ui-state-default a:link, #promoDiv2010-5.ui-state-default a:visited { color: #ffffff; text-decoration: none; background-color:#333333; }
*/

#promoDiv2010-1.ui-state-default a, #promoDiv2010-1.ui-state-default a:link, #promoDiv2010-1.ui-state-default a:visited { color: #ffffff; text-decoration: none; background-color:#FF6000; background:  url(../assets/images/un-orange-accordion.png) repeat-x; }
#promoDiv2010-2.ui-state-default a, #promoDiv2010-2.ui-state-default a:link, #promoDiv2010-2.ui-state-default a:visited { color: #ffffff; text-decoration: none; background-color:#2D3D98; background:  url(../assets/images/un-blue-accordion.png) repeat-x; }
#promoDiv2010-3.ui-state-default a, #promoDiv2010-3.ui-state-default a:link, #promoDiv2010-3.ui-state-default a:visited { color: #ffffff; text-decoration: none; background-color:#acb737; background:  url(../assets/images/un-green-accordion.png) repeat-x; }
#promoDiv2010-4.ui-state-default a, #promoDiv2010-4.ui-state-default a:link, #promoDiv2010-4.ui-state-default a:visited { color: #ffffff; text-decoration: none; background-color:#dea639; background:  url(../assets/images/un-yellow-accordion.png) repeat-x; }
#promoDiv2010-5.ui-state-default a, #promoDiv2010-5.ui-state-default a:link, #promoDiv2010-5.ui-state-default a:visited { color: #ffffff; text-decoration: none; background-color:#761B02; background:  url(../assets/images/un-red-accordion.png) repeat-x; }

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { background: #dadada/*{bgColorHover}*/ ; font-weight: normal/*{fwDefault}*/; color: #212121/*{fcHover}*/; }

#promoDiv2010-1.ui-state-hover a, #promoDiv2010-1.ui-state-hover a:hover { color: #FFFFFF/*{fcHover}*/; text-decoration: none; background-color:#d55000;  background:  url(../assets/images/orange-accordion.png) repeat-x; }
#promoDiv2010-2.ui-state-hover a, #promoDiv2010-2.ui-state-hover a:hover { color: #FFFFFF/*{fcHover}*/; text-decoration: none; background-color:#233074;  background:  url(../assets/images/blue-accordion.png) repeat-x; }
#promoDiv2010-3.ui-state-hover a, #promoDiv2010-3.ui-state-hover a:hover { color: #FFFFFF/*{fcHover}*/; text-decoration: none; background-color:#959e30;  background:  url(../assets/images/green-accordion.png) repeat-x; }
#promoDiv2010-4.ui-state-hover a, #promoDiv2010-4.ui-state-hover a:hover { color: #FFFFFF/*{fcHover}*/; text-decoration: none; background-color:#c59331;  background:  url(../assets/images/yellow-accordion.png) repeat-x; }
#promoDiv2010-5.ui-state-hover a, #promoDiv2010-5.ui-state-hover a:hover { color: #FFFFFF/*{fcHover}*/; text-decoration: none; background-color:#641803;  background:  url(../assets/images/red-accordion.png) repeat-x; }

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {background: #ffffff/*{bgColorActive}*/; font-weight: normal/*{fwDefault}*/; color: #212121/*{fcActive}*/; }

#promoDiv2010-1.ui-state-active a, #promoDiv2010-1.ui-state-active a:link, #promoDiv2010-1.ui-state-active a:visited { color: #ffffff; text-decoration: none; background-color:#d55000;  background:  url(../assets/images/orange-accordion.png) repeat-x; }
#promoDiv2010-2.ui-state-active a, #promoDiv2010-2.ui-state-active a:link, #promoDiv2010-2.ui-state-active a:visited { color: #ffffff; text-decoration: none; background-color:#233074;  background:  url(../assets/images/blue-accordion.png) repeat-x; }
#promoDiv2010-3.ui-state-active a, #promoDiv2010-3.ui-state-active a:link, #promoDiv2010-3.ui-state-active a:visited { color: #ffffff; text-decoration: none; background-color:#959e30; background:  url(../assets/images/green-accordion.png) repeat-x;  }
#promoDiv2010-4.ui-state-active a, #promoDiv2010-4.ui-state-active a:link, #promoDiv2010-4.ui-state-active a:visited { color: #ffffff; text-decoration: none; background-color:#c59331;  background:  url(../assets/images/yellow-accordion.png) repeat-x; }
#promoDiv2010-5.ui-state-active a, #promoDiv2010-5.ui-state-active a:link, #promoDiv2010-5.ui-state-active a:visited { color: #ffffff; text-decoration: none; background-color:#641803;  background:  url(../assets/images/red-accordion.png) repeat-x; }

.ui-widget :active { outline: none; }