

/* 

	Scalable Box  - Structural Styles
	
	This section contains the needed styles for
	
	GlowBox
	BorderBox
	Rounded Corner Box (or Standard Box)
	Gradient Box
	Gradient Fill Box

	NOTE: The order of these is IMPORTANT.  DONT MOVE THEM AROUND.
	
	why?  Because the quick results calculator is made of nested scalable boxes and the current
	nature of the boxes means they dont nest to well.  So the order of these styles is important

 */
 



div.GlowBox, div.GlowBox div
{

}

div.GlowBox
{
	background-image: url("/_layouts/Custom/FP/Images/box_glow_bottomright.gif");
	background-position: bottom right;
	background-repeat: no-repeat;
	display:inline-block;
}
div.GlowBox div.bba
{
	background-image: url("/_layouts/Custom/FP/Images/box_glow_bottomleft.gif");
	background-position: bottom left;
	background-repeat: no-repeat;
}
div.GlowBox div.bba div.bbb
{
	background-image: url("/_layouts/Custom/FP/Images/box_glow_topright.gif");
	background-position: top right;
	background-repeat: no-repeat;
}
div.GlowBox div.bba div.bbb div.bbc
{
	background-image: url("/_layouts/Custom/FP/Images/box_glow_topleft.gif");
	background-position: top left;
	background-repeat: no-repeat;
	padding:7px;
}

div.BorderBox, div.BorderBox div		
{ 
	/*margin:0px;
	padding:0px;*/
	overflow:hidden;

}
div.BorderBox				
{ 
	margin:4px;
	background-image: url("/_layouts/Custom/FP/Images/box_corner_bottomright.gif");
	background-position: bottom right;
	background-repeat: no-repeat;
	overflow:hidden;
}
div.BorderBox div.bba			
{ 
	background-image: url("/_layouts/Custom/FP/Images/box_corner_bottomleft.gif");
	background-position: bottom left; 
	background-repeat: no-repeat; 					  
	overflow:hidden;
	border:	1px solid white; 
}
div.BorderBox div.bba div.bbb
{
	background-image: url("/_layouts/Custom/FP/Images/box_corner_topright.gif");
	background-position: top right;
	background-repeat: no-repeat;
	overflow:hidden;
}

div.BorderBox div.bba div.bbb div.bbc
{
	background-image: url("/_layouts/Custom/FP/Images/box_corner_topleft.gif");
	background-position: top left;
	background-repeat: no-repeat;
	padding:3px;
	overflow:hidden;
}



div.roundedBox				
{
	/*overflow:hidden;*/
display:inline-block;
}

div.roundedBox span.rtop, div.roundedBox span.rbottom 		
{ 
	display:block;
	line-height: 0px;
}
div.roundedBox span.rtop span,  div.roundedBox span.rbottom span	
{ 
	display:block;
	line-height: 0px !important;
	font-size:0px !important;
	height: 1px;
}
div.roundedBox span.r1					
{ 
	margin: 0 3px;
	line-height: 0px !important;
	font-size:0px !important;
	overflow:hidden !important;
}
div.roundedBox span.r2, div.roundedBox span.r3				
{ 
	margin: 0 1px;
		line-height: 0px !important;
	font-size:0px !important;overflow:hidden !important;
}



.gradient
{
	overflow: hidden;
}

div.GradientBox  div.roundedBox .gradient .rbottom
{
	margin: 0 0px 0 0px;
}

div.GradientBox  div.roundedBox .gradient .rbottom span.r1
{
	margin: 0 3px 0 3px;
}
div.GradientBox  div.roundedBox .gradient .rbottom span.r2
{
	margin: 0 1px  0 1px;
}
div.GradientBox  div.roundedBox .gradient .rbottom span.r3
{
	margin: 0 1px 0 1px;
}

/************************************************************************************************


							end of Scalable Box  - Structural Styles


************************************************************************************************/






/*


	Scalable Box Styles - Colors and Backgrounds


*/



.orangeBDWhiteBG, .orangeBDWhiteBG span.rtop, .orangeBDWhiteBG span.rbottom
{
	background: #ff7800;
}
.orangeBDWhiteBG div.roundedBox, .orangeBDWhiteBG span.rtop span, 
.orangeBDWhiteBG span.rbottom span
{
	background: white;
}
.orangeBDWhiteBG div.content
{
	border:1px solid white;
}
/* ----- */
.greyBDWhiteBG, .greyBDWhiteBG span.rtop, .greyBDWhiteBG span.rbottom
{
	background: #f0f0f0;
}
.greyBDWhiteBG div.roundedBox, .greyBDWhiteBG span.rtop span, 
.greyBDWhiteBG span.rbottom span
{
	background: white;
}
.greyBDWhiteBG div.content
{
	border:1px solid white;
}
/* ----- */

.qqrblueBDWhiteBG, .qqrblueBDWhiteBG span.rtop, .qqrblueBDWhiteBG span.rbottom
{
	background: #00AEEF;
		
}
.qqrblueBDWhiteBG div.roundedBox, .qqrblueBDWhiteBG span.rtop span, 
.qqrblueBDWhiteBG span.rbottom span
{
	background: white;
}
.qqrblue div.content
{
	border:1px solid white;
}
/* ----- */
.tealBDWhiteBG, .tealBDWhiteBG span.rtop, .tealBDWhiteBG span.rbottom
{
	background: #00aeef;
}
.tealBDWhiteBG div.roundedBox, .tealBDWhiteBG span.rtop span, 
.tealBDWhiteBG span.rbottom span
{
	background: white;
}
.tealBDWhiteBG div.content
{
	border:1px solid white;
}
/* ----- */
.whiteBDWhiteBG, .whiteBDWhiteBG span.rtop, .whiteBDWhiteBG span.rbottom
{
	background: white;
}
.whiteBDWhiteBG div.roundedBox, .whiteBDWhiteBG span.rtop span, 
.whiteBDWhiteBG span.rbottom span
{
	background: white;
}
.whiteBDWhiteBG div.content
{
	border:1px solid white;
}
/* ----- */

.whiteBDGreyGF span.rtop
{
	background: #f0f0f0;

}
.whiteBDGreyGF
{
	background: #f0f0f0;
	width: 243px;
}
.whiteBDGreyGF  div.roundedBox
{
	width: 229px;
}
.whiteBDGreyGF div.content
{
	border:0px solid #f0f0f0;
}
.whiteBDGreyGF .roundedBox .gradient
{
	background-image:url(/_layouts/Custom/FP/Images/box_BG_gradient_small_calc.gif);
	background-position: bottom left;
	background-repeat:no-repeat;	
	height: 330px;
	width: 229px;
}
.whiteBDGreyGF .roundedBox .gradient span.rbottom
{
	display:none;
}

/* ----- */
.greyBG, .greyBG span.rtop, .greyBG span.rbottom
{
	background:white;
}
.greyBG, .greyBG span.rtop span, .greyBG span.rbottom span
{
	background:  #f0f0f0;
}
.greyBG div.content
{
	padding-bottom: 5px;
	background-color:  #f0f0f0;
	border:1px solid  #f0f0f0;
}

 
/* Orange Border, White Background*/
 .bbOrangeBWhiteBG, .bbOrangeBWhiteBG span.rtop, .bbOrangeBWhiteBG span.rbottom
 {
  background: #ff7800;
 }
 .bbOrangeBWhiteBG div.roundedBox, .bbOrangeBWhiteBG span.rtop span, 
 .bbOrangeBWhiteBG span.rbottom span
 {
  background: red;
 }
 .bbOrangeBWhiteBG div.content
 {
  border:1px solid white;
 }
 
 /* Light Grey Border, White Background*/
 .bbLightGreyBWhiteBG, .bbLightGreyBWhiteBG span.rtop, .bbLightGreyBWhiteBG span.rbottom
 {
  background: #f0f0f0;
  
 }
 .bbLightGreyBWhiteBG div.roundedBox, .bbLightGreyBWhiteBG span.rtop span, 
 .bbLightGreyBWhiteBG span.rbottom span
 {
  background: white;
 }
 .bbLightGreyBWhiteBG div.content
 {
  border:1px solid white;
 }

/************************************************************************************************


						end of Scalable Box Styles - Colors and Backgrounds


************************************************************************************************/

/* Styles for teal header box on forms Alex Billerey 28 August */
.tealBG
{
	margin:0 9px 0 9px;
}
.tealBG, .tealBG span.rtop 
{
	background:white;
}
.tealBG, .tealBG span.rtop span, .tealBG span.rbottom span
{
	background:  #00aeef;
}
.tealBG div.content
{
	background-color:  #00aeef;
	border:1px solid  #00aeef;
}
.tealBG span.rbottom 
{
	display:none;
}


/* End of styles for teal header box on forms */






/* styles for light blue box faq content box*/
.darkblueBG, .darkblueBG span.rtop, .darkblueBG span.rbottom
{
	background:white;
}
.darkblueBG, .darkblueBG span.rtop span, .darkblueBG span.rbottom span
{
	background:  #00AEEF;
}
.darkblueBG div.content
{
	background-color:  #00AEEF;
	border:1px solid  #00AEEF;
}


.blueBG, .blueBG span.rtop, .blueBG span.rbottom
{
	background:white;
}
.blueBG, .blueBG span.rtop span, .blueBG span.rbottom span
{
	background:  #dceffd;
}
.blueBG div.content
{
	background-color:  #dceffd;
	border:1px solid  #dceffd;
}

.newblueBG, .newblueBG span.rtop, .newblueBG span.rbottom
{
	background:white;
}
.newblueBG, .newblueBG span.rtop span, .newblueBG span.rbottom span
{
	background:  #dceffd;
}
.newblueBG div.content
{
	background-color:  #dceffd;
	border:1px solid  #dceffd;
}



.lightGreyBG, .lightGreyBG span.rtop, .lightGreyBG span.rbottom
{
	background:white;
}
.lightGreyBG, .lightGreyBG span.rtop span, .lightGreyBG span.rbottom span
{
	background:  #F0F0F0;
}
.lightGreyBG div.content
{
	background-color:  #F0F0F0;
	border:1px solid  #F0F0F0;
}


.greyBG, .greyBG span.rtop, .greyBG span.rbottom
{
	background:white;
}
.greyBG, .greyBG span.rtop span, .greyBG span.rbottom span
{
	background:  #f0f0f0;
}
.greyBG div.content
{
	background-color:  #f0f0f0;
	border:1px solid  #f0f0f0;
}

/*dark grey*/
.darkGreyBG, .darkGreyBG span.rtop, .darkGreyBG span.rbottom
{
	background:white;
}
.darkGreyBG, .darkGreyBG span.rtop span, .darkGreyBG span.rbottom span
{
	background:  #f5f5f5;
}
.darkGreyBG div.content
{
	background-color:  #f5f5f5;
	border:1px solid  #f5f5f5;
}

/**/



.whiteBDBlueGF, .whiteBDWhiteGF, .whiteBDWhiteSmallGF 
{
	float:left;
}
.whiteBDBlueGF div.bba, .whiteBDWhiteGF  div.bba, .whiteBDWhiteSmallGF div.bba
{
	float:left;	
}
.whiteBDBlueGF div.bba div.bbb, .whiteBDWhiteGF  div.bba div.bbb, .whiteBDWhiteSmallGF div.bba div.bbb
{
	float:left;	
}
.whiteBDBlueGF div.bba div.bbb div.bbc, .whiteBDWhiteGF  div.bba div.bbb div.bbc, .whiteBDWhiteSmallGF div.bba div.bbb div.bbc
{
	float:left;
}


.whiteBDBlueGF
{
	background: #f0f0f0;
}
.whiteBDBlueGF .roundedBox span.rtop, .whiteBDBlueGF .roundedBox span.rbottom
{
	display:none;
}

.whiteBDBlueGF div.roundedBox
{
	background: white;
}
.whiteBDBlueGF div.content
{
	border:0px solid #f0f0f0;
}


.whiteBDWhiteGF
{
	background: #f0f0f0;
	width:518px;
}

.whiteBDWhiteSmallGF 
{
	background: #f0f0f0;
	width:403px;
}

.whiteBDWhiteGF .roundedBox span.rtop,.whiteBDWhiteGF .roundedBox span.rbottom, .whiteBDWhiteSmallGF .roundedBox span.rtop, .whiteBDWhiteSmallGF .roundedBox span.rbottom
{
	display:none;
}
.whiteBDWhiteGF  div.roundedBox, .whiteBDWhiteSmallGF div.roundedBox
{
	background: #f0f0f0;
}
.whiteBDWhiteGF div.content, .whiteBDWhiteSmallGF div.content
{
	border:0px solid #f0f0f0;
}
.whiteBDWhiteGF .roundedBox .gradient
{
	float:left;
	width:504px;
	height:186px;
	background-image:url(/_layouts/Custom/FP/Images/box_BG_rachel_gradient_white.gif);
	background-position: top left;
	background-repeat:no-repeat;

}

.whiteBDWhiteSmallGF .roundedBox .gradient
{
	float:left;
	width:389px;
	height:186px;
	background-image:url(/_layouts/Custom/FP/Images/box_BG_rachel_gradient_white_small.gif);
	background-position: top left;
	background-repeat:no-repeat;
}
	
.whiteBDSmallNoGradient
{
	float:left;
	/*width:389px;*/
	height:186px;
	background-image: url(/_layouts/Custom/FP/Images/box_BG_rachel_white_small.gif);
	background-position: top left;
	background-repeat:no-repeat;
	
	
	
}
.whiteBDOrangeGF
{
	background: #f0f0f0;
	width: 401px;
}
.whiteBDOrangeGF .roundedBox span.rtop,.whiteBDOrangeGF .roundedBox  span.rbottom
{
	display: none;
}
.whiteBDOrangeGF  div.roundedBox
{
	background: #f0f0f0;
}
.whiteBDOrangeGF div.content
{
	border:0px solid #f0f0f0;
}
.whiteBDOrangeGF .roundedBox .gradient
{

	width: 387px;
	height: 316px;
	background-image: url(/_layouts/Custom/FP/Images/calculator_gradient.gif);
	background-repeat: no-repeat;
	background-position: top left;
}



.whiteBDwhiteCalcGF
{
	width: 200px;
	background: #f0f0f0;
}
.whiteBDwhiteCalcGF .roundedBox span.rtop,.whiteBDwhiteCalcGF .roundedBox  span.rbottom
{
	display: none;
}
.whiteBDwhiteCalcGF  div.roundedBox
{
	background: #f0f0f0;
}
.whiteBDwhiteCalcGF div.content
{
	border:0px solid #f0f0f0;
}
.whiteBDwhiteCalcGF .roundedBox .gradient
{
	background-image: url(/_layouts/Custom/FP/Images/calculator_bg_white_gradient.gif);
	background-repeat: no-repeat;
	width: 186px;
	height: 256px;
	background-position: top left;
}


.whiteBDorangeCalcGF
{
	width: 200px;
	background: #f0f0f0;
}
.whiteBDorangeCalcGF .roundedBox span.rtop,.whiteBDorangeCalcGF .roundedBox  span.rbottom
{
	display: none;
}
.whiteBDorangeCalcGF  div.roundedBox
{
	background: #f0f0f0;
}
.whiteBDorangeCalcGF div.content
{
	border:0px solid #f0f0f0;
}
.whiteBDorangeCalcGF .roundedBox .gradient
{
	background-image: url(/_layouts/Custom/FP/Images/calculator_bg_orange_gradient.gif);
	background-repeat: no-repeat;
	width: 186px;
	height: 256px;
	background-position: top left;
}

