/* 
 * Styles used for BizAssist Page Content
 *
 * Author: Ludwin 
 */

/*************************************** Containers & Holders  *************************/

.mainContent {
	position		: relative;
	top				: -28px;		/* this will move up the content below the main menu */ 
	left			: 130px;		/* standard left indent for bizassist, all left elements must align at this position */
	width			: 980px;		/* standard screen width for bizassist, all elements must be within this width */
	background		: #e9e9e9;		/* light gray */
}

.padInside {
	padding			: 5px 10px;		/* this will create a consistent padding inside the mainContent */
}


.banner  {
	overflow		: hidden; 		/* content should not spill over */
	width			: 180px;		/* max width for a banner */
	background		: #FFF;	
}

.banner a {
	position		: relative;
	display			: block; 		
	padding			: 8px 12px;	
}

.popTopicsSideMenu, .departmentsSideMenu  {
	overflow		: hidden; 			/* content should not spill over */
	width			: 180px;			/* max width for the side menu, same as banner*/
	background		: #006D96;			/* blue */	
	margin-bottom	: 15px;
}

.popTopicsSideMenu a, .departmentsSideMenu a {
	display			: block;
	font			: 13px Arial, Helvetica, sans-serif;
	color			: #FFFFFF;
	padding			: 4px 8px;
	border-top		: 1px solid #004864;
	width			: 100%;
}

a:link.sideMenuLink       	{text-decoration: none; font-family: Arial; font-size:13px; color: #FFFFFF;}
a:visited.sideMenuLink    	{text-decoration: none; font-family: Arial; font-size:13px; color: #FFFFFF;}
a:active.sideMenuLink     	{text-decoration: none; font-family: Arial; font-size:13px; color: #FFFFFF;}
a:hover.sideMenuLink      	{text-decoration: none; font-family: Arial; font-size:13px; background: #39A1C9;}

.rightContent  {
	overflow		: hidden; 		/* content should not spill over */
	position		: absolute;
	top				: 5px;
	left			: 200px;
	width			: 770px;		/* max width for content */
	background		: #FFF;	
}

.searchContainer {
	position		: relative;
	width			: 700px;
	margin			: 0 auto;
	background 		: #e9e9e9; 
}

/***************************  Round Corners   ****************************************************/

/* gray lines with varying width & height to create a rounded illusion */
.g1 {margin: 0 1px; height: 2px; background : #e9e9e9; overflow: hidden; }
.g2 {margin: 0 2px; height: 1px; background : #e9e9e9; overflow: hidden; }
.g3 {margin: 0 3px; height: 1px; background : #e9e9e9; overflow: hidden; }
.g4 {margin: 0 5px; height: 1px; background : #e9e9e9; overflow: hidden; }

.topGrayRounded {
	position		: relative;
	top				: -28px;		/* this will move up the content below the main menu */ 
	left			: 130px;		/* standard left indent for bizassist, all left elements must align at this position */
	width			: 980px;		/* standard screen width for bizassist, all elements must be within this width */
	background 		: #fff; 
}

.bottomGrayRounded {
	position		: relative;
	top				: -28px;		/* this will move up the content below the main menu */ 
	left			: 130px;		/* standard left indent for bizassist, all left elements must align at this position */
	width			: 980px;		/* standard screen width for bizassist, all elements must be within this width */
	background 		: #fff; 
}

.contentWhiteRounded {	/* grey background to be painted with white, fix width at the top & bottom of right Content */
	position		: absolute;
	top				: 0;		/* this will move up the content below the main menu */ 
	left			: 200px;		/* standard left indent for bizassist, all left elements must align at this position */
	width			: 770px;		/* standard screen width for bizassist, all elements must be within this width */
	background 		: #e9e9e9; 
}

.botContentWhiteRounded {	/* grey background to be painted with white, fix width at the top & bottom of right Content */
	position		: relatlive;
	top				: 0;		/* this will move up the content below the main menu */ 
	left			: 200px;		/* standard left indent for bizassist, all left elements must align at this position */
	width			: 770px;		/* standard screen width for bizassist, all elements must be within this width */
	background 		: #e9e9e9; 
}

.whiteRounded { background : #e9e9e9; } /* grey background to be painted with white */

/* white lines with varying width & height to create a rounded illusion */
.w1 {margin: 0 1px; height: 2px; background : #fff; overflow: hidden; } 
.w2 {margin: 0 2px; height: 1px; background : #fff; overflow: hidden; }
.w3 {margin: 0 3px; height: 1px; background : #fff; overflow: hidden; }
.w4 {margin: 0 5px; height: 1px; background : #fff; overflow: hidden; }

.blueRounded { background : #e9e9e9; } /* grey background to be painted with blue */

/* white lines with varying width & height to create a rounded illusion */
.b1 {margin: 0 1px; height: 2px; background : #006D96; overflow: hidden; } 
.b2 {margin: 0 2px; height: 1px; background : #006D96; overflow: hidden; }
.b3 {margin: 0 3px; height: 1px; background : #006D96; overflow: hidden; }
.b4 {margin: 0 5px; height: 1px; background : #006D96; overflow: hidden; }

/******************************* Business Tools *****************************/

.busiTools {
	position		: relative;
	overflow		: hidden;
	width			: 700px;
	margin-left		: 15px;
	padding-top		: 15px; 
}

.toolsList {
	/* empty holder, width depends on calling block */
}

.toolsList td {
	padding			: 5px 10px;
}

.toolDescription {
	font		: 11px Arial;
	color		: #666; 
}

.toolsList .downloadText {
	position	: relative;
	top			: 4px;
}

.toolsList .toolLink a:link    	{text-decoration: none; font-family: Arial; font-size:18px; color: #006D96; font-weight:800;}
.toolsList .toolLink a:visited 	{text-decoration: none; font-family: Arial; font-size:18px; color: #006D96; font-weight:800;}
.toolsList .toolLink a:active	{text-decoration: none; font-family: Arial; font-size:18px; color: #006D96; font-weight:800;}
.toolsList .toolLink a:hover	{text-decoration: none; font-family: Arial; font-size:18px; color: #e35717; font-weight:800;}

.toolsList .providerLink a:link       	{text-decoration: none; font-family: Arial; font-size:12px; color: #5AA6D2;}
.toolsList .providerLink a:visited    	{text-decoration: none; font-family: Arial; font-size:12px; color: #5AA6D2;}
.toolsList .providerLink a:active     	{text-decoration: none; font-family: Arial; font-size:12px; color: #5AA6D2;}
.toolsList .providerLink a:hover      	{text-decoration: none; font-family: Arial; font-size:12px; color: #e35717;}

.toolsList .downloadLink a:link       	{text-decoration: none; font-family: Arial; font-size:12px; color: #FFF;}
.toolsList .downloadLink a:visited    	{text-decoration: none; font-family: Arial; font-size:12px; color: #FFF;}
.toolsList .downloadLink a:active     	{text-decoration: none; font-family: Arial; font-size:12px; color: #FFF;}
.toolsList .downloadLink a:hover      	{text-decoration: underline; font-family: Arial; font-size:12px; color: #FFF;}



/******************************* Savings & Offers *****************************/

.offers {
	position		: relative;
	overflow		: hidden;
	height			: 90px;
	width			: 740px;
	margin-left		: 15px;
	padding-top		: 15px; 
	border-top		: 1px solid #EEEEEE;
}

.offerPartner {
	position	: absolute;
	top			: 5px;
	left		: 15px;
	width		: 120px;
}


.offerTitle {
	position	: absolute;
	top			: 5px;
	left		: 140px;
	width		: 300px;
}

.offerSubtitle  {
	font		: 12px Arial;
	color		: #555555;
}

.offerDescription {
	position	: absolute;
	top			: 5px;
	left		: 440px;
	width		: 300px;
}

/******************************* Departments & Popular Topics *****************************/

.popTopicsPFP {
	float		: left;
	width		: 480px;
	margin-left	: 20px; 
}

.popTopicsTools {
	float		: left;
	width		: 480px;
	margin-left	: 20px; 
}

.popTopicsLinks {
	float		: left;
	margin-left	: 20px; 
	width		: 480px;
}

.popTopicsOffers {
	position	: absolute;
	top			: 100px;
	left		: 520px;
	width		: 240px;
	float		: right;
	background	: #d1d3da;
}

/*** Department Links ***/

.depLinks {
	margin			: 10px 20px 10px 0;
}
.depLinks .icon {
	float			: left;
	width			: 20px;
}
.depLinks .link  {
	font			: 800 15px Arial;
}
.depLinks .link a {
	color			: #006D96;
	text-decoration	: none;
}
.depLinks .link a:hover {
	color			: #E35819;
	text-decoration	: none;
}
.depLinks .details a {
	color			: #5AA6D2;
	font			: 12px Arial;
	margin-left		: 25px;
}
.depLinks .details a:hover {
	text-decoration	: none;
}