@charset "utf-8";
/* FAST FACTS CSS Document */

#fastFactsWidget{
	
/* custom settings for this usage */
	padding: 15px 0 0 30px;
	/* max-height: 150px; */


/* all the below style if for a STAND ALONE FFACTS WIDGET. When embedded in a tabbox this is all commented out
	since the tabbox supplies location in flow/hidden layers and borders */
/*	
	position:absolute;
	top: 135px;
	left: 20px;
	padding: 10px 15px 0px 12px;
	
	width: 685px;
	height: 205px;
	
	background:url(../../ItemPickerHoroScroll/code/images/blackTrans25.png) repeat;

	border-color:#666666;
	border-style:solid;
	border-width:2px;
	-moz-border-radius: 	20px;
	-webkit-border-radius: 	20px;
	-khtml-border-radius: 	20px;
	border-radius: 		20px;
	overflow:hidden;
*/		
}


#fastFactIconView {
width:495px;  /* 492px; THE "icon viewPort" - ^x width - MUST be a factor of full width and margin o factIconWrapper */
/* width:410px;  /* THE "icon viewPort" - 5x width - MUST be a factor of full width and margin o factIconWrapper */
height: 80px;
overflow: hidden;
float:left;

/* border: solid #eeeeee 2px; */
}

#fastFactIconView ul {
width:1394px;  		/* 820= 10x82 if more, widen out numIcons*iconWidth(82px) wide enough for ALL ICONS sidebySIDE - should  be a factor of full width and margin o factIconWrapper */
height: 80px;		/* same as above */
overflow:hidden;  	/* cut off any extra- to NOT scroll inside a scroll.  extra width shouldl be adjust with the width param above*/
margin-left:1px; 	/*-82px use factors of icon width in JS to move viz icons.  */
}

#fastFactIconView ul li {
background:url(../../ItemPickerHoroScroll/code/images/fastfactIconBakgrndDualState.png) right center no-repeat;
width: 82px;  /* note margins build into graphics szing */
height: 73px;
display:block;
float:left;

xborder: #eeeeee solid 1px;
}

#fastFactIconView ul li:hover,  #fastFactIconView ul li.selected  {
background:url(../../ItemPickerHoroScroll/code/images/fastfactIconBakgrndDualState.png) left center no-repeat;
}
#fastFactIconView ul li a {
/* might want to put bg images here instead of LI to ensure clicks work */
}

#fastFactIconView ul li img{
position:relative;
top:12px;
left:12px;
border:none;
}

#fastFactIconView ul li.ffIconEdgeRight,#fastFactIconView ul li.ffIconEdgeLeft {
background:url(../../ItemPickerHoroScroll/code/images/goldRectDull10x10.jpg) center center no-repeat;
}

.ffDisabledLeft {
background:url(../../ItemPickerHoroScroll/code/images/ffLeftBtnDisabled.png) center center no-repeat;
}


#factContentWrapper {
width: 585px;  /* was 550 */
height: 140px;
margin:5px 0 0 0;
clear:left;
overflow:auto;

/* border: solid #eeeeee 2px; */

}

#factContentWrapper dl {

}

#factContentWrapper dt {
font-family: arial, verdana, helvetica, sans_serif;
font-weight:800;  /* !!!arial black is what I want but cant get it to work atm- so this! */
font-size: 160%;
color:#5A565F; /* brighter alts #555256 #758093 #505B70 */
margin: 0 0 7px 0;
}

#factContentWrapper dl img {
margin: 0 10px 0 0px;
height:65px;  /* scale width to this height by NOT specifying sz on img tags */
}

#factContentWrapper dl .imgColumn {
float:left;
height:100%;  
}

#factContentWrapper dd {
color:#cccccc;
font-size: 90%;
line-height:135%;

}

#factContentWrapper dd a {
color:#0099FF;
padding: 0 16px 0 0;
background:url(../../ItemPickerHoroScroll/code/images/rightArrowGoldTrans50per.png) right  center no-repeat;
text-decoration:none;
}

#factContentWrapper dd a:hover {
color:#00CCFF;
padding: 0 16px 0 0;
background:url(../../ItemPickerHoroScroll/code/images/rightArrowGold.png) right  center no-repeat;
}


.ffControls {
	background:none;
	float:left;
	margin-top: 18px;
	
/*	position:absolute;
	z-index:100003;
	top:355px;
	left:550px;   same as scBed *//* debug to see edges of divs:
	  
*/

/* border: solid 1px #eeeeee; */
}

.ffControls ul {
	display: block;
}
.ffControls ul li{
	list-style-type:none;
}
.ffControls ul li a{
	display: block;
	width: 30px;
	height:30px;
}

.ffControls ul li a#ffLeftScroll {
	background:url(../../ItemPickerHoroScroll/code/images/ffLeftBtn2State.png) top left no-repeat;
	color:#990000;
}
.ffControls ul li a#ffLeftScroll:hover {
	background:url(../../ItemPickerHoroScroll/code/images/ffLeftBtn2State.png) top right no-repeat;
	color:#CC9900;

}
.ffControls ul li a#ffLeftScroll.disabled {
	background:url(../../ItemPickerHoroScroll/code/images/ffLeftBtnDisabled.png) top left no-repeat;
}


.ffControls ul li a#ffRightScroll {
	background:url(../../ItemPickerHoroScroll/code/images/ffRightBtn2State.png) top left no-repeat;
	color:#990000;
}
.ffControls ul li a#ffRightScroll:hover {
	background:url(../../ItemPickerHoroScroll/code/images/ffRightBtn2State.png) top right no-repeat;
	color:#CC9900;
}
.ffControls ul li a#ffRightScroll.disabled {
	background:url(../../ItemPickerHoroScroll/code/images/ffRightBtnDisabled.png) top left no-repeat;
}

.ffControls ul li a#ffMenu {
	background:url(../../ItemPickerHoroScroll/code/images/ffMenuBtn2State.png) top left no-repeat;
	color:#990000;
}
.ffControls ul li a#ffMenu:hover {
	background:url(../../ItemPickerHoroScroll/code/images/ffMenuBtn2State.png) top right no-repeat;
	color:#CC9900;
}