.stepcarousel{
position: relative; /*leave this value alone*/
overflow: scroll; /*leave this value alone*/
width: 934px; /*Width of Carousel Viewer itself*/
height: 426px; /*Height should enough to fit largest content's height*/
}

.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel .panel{
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	width: 934px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
	background:url(/assets/images/bg-wood.jpg) no-repeat;
	color:#ffffff;
	font-weight:normal;
	font-size:18px;
	font-style:italic;
	height: 426px;
}
.stepcarousel .panel .txt{
	position:absolute; 
	top:25px; left:28px;
}
.stepcarousel .panel.warranty .txt{
	left:595px;
}
.stepcarousel .panel.international .txt{
	left:654px;
}
.stepcarousel .panel.joy .txt{
	top:156px; left:628px;
}
.stepcarousel .panel h2{
	color:#ffffff;
	font-size:26px;
	font-style:normal;
	font-weight:bold;
}
.stepcarousel .panel a, .stepcarousel .panel a:visited {
	background:url(/assets/images/btn-learn-more.png) no-repeat;
	display:block;
	width:203px;
	height:51px;
	color:#ffffff;
	font-size:17px;
	font-style:normal;
	font-weight:bold;
	text-decoration:none;
	text-align:center;
	line-height:47px;
	margin: 8px 0 0 -6px;
}
.stepcarousel .panel a:hover{
	background:url(/assets/images/btn-learn-more-over.png) no-repeat;
	color:#464646;
}

.promocarousel{
position: relative; /*leave this value alone*/
overflow: scroll; /*leave this value alone*/
width: 934px; /*Width of Carousel Viewer itself*/
height: 426px; /*Height should enough to fit largest content's height*/
}

.promocarousel .belt2{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.promocarousel .panel2{
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	width: 934px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */

	color:#ffffff;
	font-weight:normal;
	font-size:18px;
	font-style:italic;
	height: 426px;
}
.promocarousel .panel2 .txt{
	position:absolute; 
	top:25px; left:28px;
}
.promocarousel .panel2 h2{
	color:#ffffff;
	font-size:26px;
	font-style:normal;
	font-weight:bold;
}
		
.headerPromosWrapper{
	position:absolute; 
	
	width:212px; height:112px; 
	padding:0px; 
	/*background:url(../images/promo-bg.png) no-repeat; */
	/*z-index:500;*/
}
.promocarousel{
	position: relative; /*leave this value alone*/
	overflow: scroll; /*leave this value alone*/
	width: 190px; /*Width of Carousel Viewer itself*/
	height: 150px; /*Height should enough to fit largest content's height*/
}

.promocarousel .belt2{
	position: absolute; /*leave this value alone*/
	left: 0;
	top: 0;
}

.promocarousel .panel2{
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	margin: 0px; /*margin around each panel*/
	padding: 0px;
	width: 190px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
	color:#ffffff;
	font-size: 11px;
}
.promocarousel .panel2 h4{
	font-size:12px;
	color:#c2c2c2;
	font-weight:bold;
	padding-bottom:3px;
}
.promocarousel .panel2 a{
	font-size:10px;
	font-weight:bold;
	color:#ffffff;
	display:block;
	padding:4px 0;
}
#headerPromos-paginate{
	width: 190px; 
	text-align: center;
	position:relative;
	top: 140px;
	z-index: 100;
}
		
#topNav {
	width: 934px;
	position:relative;
	left:0px;
	top:256px;
	cursor:pointer;
}
#topNav .txt {
	color:#c2c2c2;
	font-weight:bold;
	position:absolute;
	top:97px; left:0px;
	width:185px; height:40px;
	text-align:center;
	z-index:1;
	line-height:13px;
}
#topNav .cropPromos .txt {
	top:120px;
	width:191px;
}
#topNav .cropPromos #promoInvestorCall .txt {
	top:97px; 
	width:191px;
	font-weight:bold;
	font-size:12px;
	font-style:normal;
}
#topNav .cropPromos #promoJoy .txt, #topNav .cropPromos #promoHappy .txt {
	top:97px; 
	width:191px;
}
#topNav .crop.over .txt, #topNav .cropPromos.over .txt, #topNav #at.crop .txt {
	color:#ffffff;
}
#topNav .thumblink {
	position:absolute;
	top:0px; left:0px;
	width:185px; height:160px;
	z-index:1;
}
#thumblink1.thumblink{
	background:url(/assets/faf/images/header/thumb-title-off.jpg) 43px 24px no-repeat;
}
#thumblink2.thumblink {
	background:url(/assets/faf/images/header/thumb-warranty-off.jpg) 43px 24px no-repeat;
}
#thumblink3.thumblink {
	background:url(/assets/faf/images/header/thumb-banking-off.jpg) 43px 24px no-repeat;
}
#thumblink4.thumblink {
	background:url(/assets/faf/images/header/thumb-international-off.jpg) 43px 24px no-repeat;
}
#thumblink5.thumblink {
	background:url(/assets/faf/images/header/thumb-investor-call-off.jpg) 43px 24px no-repeat;
}
.crop.over #thumblink1.thumblink, #at.crop #thumblink1.thumblink{
	background:url(/assets/faf/images/header/thumb-title.jpg) 43px 24px no-repeat;
}
.crop.over #thumblink2.thumblink, #at.crop #thumblink2.thumblink{
	background:url(/assets/faf/images/header/thumb-warranty.jpg) 43px 24px no-repeat;
}
.crop.over #thumblink3.thumblink, #at.crop #thumblink3.thumblink{
	background:url(/assets/faf/images/header/thumb-banking.jpg) 43px 24px no-repeat;
}
.crop.over #thumblink4.thumblink, #at.crop #thumblink4.thumblink{
	background:url(/assets/faf/images/header/thumb-international.jpg) 43px 24px no-repeat;
}
.cropPromos.over #thumblink5.thumblink, #at.cropPromos #thumblink5.thumblink{
	background:url(/assets/faf/images/header/thumb-investor-call.jpg) 43px 24px no-repeat;
}
.spriteOFF {
	position:absolute;
	top:0px; left:0px;
	width:185px;
	height:513px;
	background:url(/assets/faf/images/header/sprite-nav.png);
	background-repeat:no-repeat;
	z-index:1;
}
.cropPromos #promoNewEra .spriteOFF {
	width:191px;
	height:342px;
	background:url(/assets/faf/images/header/sprite-spin.png);
}
.cropPromos #promoInvestorCall .spriteOFF {
	width:185px;
	height:342px;
	background:url(/assets/faf/images/header/sprite-nav-clear.png);	
}
.cropPromos #promoJoy .spriteOFF {
	width:191px;
	height:342px;
	background:url(/assets/faf/images/header/sprite-joy.png);	
}
.cropPromos #promoHappy .spriteOFF {
	width:191px;
	height:342px;
	background:url(/assets/faf/images/header/sprite-happy.png);	
}
.crop,.cropPromos {
	position:relative;
	width:185px; height:171px;
	overflow:hidden;
	float:left;
}
.cropPromos {
	background:url(/assets/faf/images/header/sprite-bg-thumb.png) repeat-x;
	width:190px;
}
.crop.over {
	background:none;
}
.crop .spriteOFF,.cropPromos .spriteOFF {
	top:0px;
}
.crop.over .spriteOFF, .cropPromos.over .spriteOFF {
	top:-171px;
}

#at.crop .spriteOFF {
	top:-342px;
}
.wide {
	width:186px;
}
.cropnarrow {
	left:-1px;
}

.divider {
	width:1px;
	height:171px;
	background-image:url(/assets/faf/images/header/nav-divider.png);
	float:left;
}