/***************************************************************
*	<CSSName>BODY, TABLE</CSSName>
*	<Type>Tags</Type>
*	<Purpose>Assign style to BODY and TABLE tags to set standard 
*			 default font to be inherited throughout
*			 entire site </Purpose>
*	<Description>Arial, 10pt, black.</Description>
*********************************************************************************************************************************/
BODY, TABLE
{
	font-family: Verdana, Arial;
	font-size: 10pt;
	color: #000000;
}

/***************************************************************
*	<CSSName>BODY</CSSName>
*	<Type>Tag</Type>
*	<Purpose>Assign style to body tag to set default
*			 bg color to be inherited throughout
*			 entire site</Purpose>
*	<Description>Light green bg</Description>
*****************************************************************/
BODY
{
	background-color: #FFFFFF;
}


/***************************************************************
*	<CSSName>SideBorders</CSSName>
*	<Type>Class</Type>
*	<Purpose>Define the side borders on the main pages of the site</Purpose>
*	<Description>set to 1px and set the color to a dark </Description>
*****************************************************************/
.SideBorders
{
	width: 1px;
	background: #ffffff;
}

/***************************************************************
*	<CSSName>TABLE</CSSName>
*	<Type>Tag</Type>
*	<Purpose>Assign style for all tables to display bg color
*			 different than default page bg</Purpose>
*	<Description>White bg</Description>
*****************************************************************/
td.leftsidetablecell
{
	width: 300px;
	
}

.maincontentcell
{
  padding-left: 10px;
}

TABLE
{
	background-color: #ffffff;		
}

/***************************************************************
*	<CSSName>A:link</CSSName>
*	<Type>Tag</Type>
*	<Purpose>Assign color style for text links</Purpose>
*	<Description>Blue</Description>
*****************************************************************/
A:link
{ 
	color: #0044CF; 
}

/***************************************************************
*	<CSSName>A:hover</CSSName>
*	<Type>Tag</Type>
*	<Purpose>Assign color style for text links when you mouse
*			 over them</Purpose>
*	<Description>Red</Description>
*****************************************************************/
A:hover 
{ 
	color: #FF0000; 
}

/***************************************************************
*	<CSSName>A:visited</CSSName>
*	<Type>Tag</Type>
*	<Purpose>Assign color style for visited text links</Purpose>
*	<Description>Dark Green</Description>
*****************************************************************/
A:visited 
{ 
	color: #2A5442; 
}


/***************************************************************
*	<CSSName>StrongContent</CSSName>
*	<Type>Class</Type>
*	<Purpose>Assign font-weight style to text that has
*		     to stand out</Purpose>
*	<Description>Bold</Description>
*****************************************************************/
.StrongContent
{
	font-weight: bold;
}

/***************************************************************
*	<CSSName>ButtonStyle</CSSName>
*	<Type>Class</Type>
*	<Purpose>Assign style for button and button text</Purpose>
*	<Description>Light green button with green text</Description>
*****************************************************************/
.ButtonStyle
{
	border: 1px outset #EEEEEE; 
	background-color: #EEEEEE;
	font-family: iArial, Verdana, Sans-Serif, Helvetica;  
	font-size: 8pt; 
	color: #666633;
	font-weight: bold;
}

/***************************************************************
*	<CSSName>StrongErrorStyle</CSSName>
*	<Type>Class</Type>
*	<Purpose>Sets error page heading style</Purpose>
*	<Description>Bold, red, 18pt font</Description>
*****************************************************************/
.StrongErrorStyle
{
	font-weight: bold;
	font-size: 18pt;
	color: #FF0000;
}

/***************************************************************
*	<CSSName>ErrorStyle</CSSName>
*	<Type>Class</Type>
*	<Purpose>Sets error page font style</Purpose>
*	<Description>Bold, red</Description>
*****************************************************************/
.ErrorStyle
{
	font-weight: bold;
	color: #FF0000;
}

/***************************************************************
*	<CSSName>PageTitle</CSSName>
*	<Type>Class</Type>
*	<Purpose>Sets page title font style</Purpose>
*	<Description>bold, green, 11pt</Description>
*****************************************************************/
.PageTitle
{  
	font-family: Helvetica, Verdana, Arial;
	font-size: 13px;
	color: #663333; 
	font-weight: bold;
	text-align: center;
}

/***************************************************************
*	<CSSName>NewMagazinesHeaderStyle, FeaturedMagazinesHeaderStyle, UsefulMagazinesHeaderStyle</CSSName>
*	<Type>Class</Type>
*	<Purpose></Purpose>
*	<Description></Description>
*****************************************************************/

.NewMagazinesHeaderStyle, .UsefulMagazinesHeaderStyle, .FeaturedMagazinesHeaderStyle
{
	background-color: #CCCC99;
	font-family: Verdana, Arial, Sans-Serif;
	font-size: 12px;
        font-weight: bold;
	color: black;	
}
/***************************************************************
*<CSSName>NewMagazinesStyle, FeaturedMagazinesStyle, UsefulMagazinesStyle</CSSName>
*	<Type>Class</Type>
*	<Purpose></Purpose>
*	<Description></Description>
*****************************************************************/
table.NewMagazinesStyle, table.FeaturedMagazinesStyle, table.UsefulMagazinesStyle
{
	font-family: Arial, Sans-Serif, Verdana, Verdana Ref;	
	font-size: 8pt;
	margin-right: 30px;
	margin-left: 30px;
	border-collapse:collapse; 
	border-spacing:0; 
	border: none;
	border-style: hidden; 
	border: 1px solid;
	border-color: #A9A9A9;
}



/***************************************************************
*	<CSSName>alphabeticallisting, MajorCategories, FeaturedMagazines,
*		     EmailNewsletters, footer</CSSName>
*	<Type>Class</Type>
*	<Purpose>Sets font styles for corresponding controls to
*		     display smaller than inherited font size</Purpose>
*	<Description>8pt font</Description>
*****************************************************************/
.alphabeticallisting, .MajorCategories, .FeaturedMagazines, .EmailNewsletters, .footer, .MagazinesAffiliateControl, .SpecialsControl
{
	margin:0;
	padding:0;
	font-size: 12px;	
}

.alphabeticallistingcellhead, .MajorCategoriescellhead
{
	margin-top: 15px;
	border-top: 1px solid;
	text-align: left;
	font-size: 15px;
	font-weight: bold;
	background-color: #CCCC99;
}

.alphabeticallistingcellhead, .alphabeticallistingcell, .MajorCategoriescellhead, .MajorCategoriesCell
{
	
	margin-left: 7px;
	padding: 2px;
	border-left: 1px solid;
	border-right: 1px solid;
	border-color: #A9A9A9;
	FONT-FAMILY: Verdana, Arial;
}

.cbesplashimage
{
	margin-left: 7px;
	margin-top: 7px;
}

.alphabeticallistingcell, .MajorCategoriesCell
{
	border-bottom: 1px solid;
	border-color: #A9A9A9;
	padding: 15px;
}

ul.MajorCategories
{
	list-style-image: url(http://www.constructionbook.com/images/orange-arrow.gif);
	padding: 7px;
}


/***************************************************************
*	<CSSName>FreeLabel</CSSName>
*	<Type>Class</Type>
*	<Purpose>Sets font for featured mags display</Purpose>
*	<Description>8pt font, free label green</Description>
*****************************************************************/

/***************************************************************
*	PREVIOUS JOSHY COMMENT - Class required by the categories.aspx page.  
*	This class is referenced
*	Programatically, i.e. the code expects the existence of this class. 
*****************************************************************/
.FreeLabel 
{
	font-family: Arial, Verdana, Sans-Serif, Helvetica;
	font-size: 8pt;
}

/***************************************************************
*	<CSSName>MagazineThumbnail</CSSName>
*	<Type>Class</Type>
*	<Purpose>Sets magazine thumbnail display</Purpose>
*	<Description>width - 65px; height - 84px;</Description>
*****************************************************************/
/* PREVIOUS JOSHY COMMENT - Style used for display magazine images in the categories page.  *****************************************************************/
.MagazineThumbnail 
{
    width : 65px;
    height: 84px;
}

/***************************************************************
*	<CSSName>LargeMagazineThumbnail</CSSName>
*	<Type>Class</Type>
*	<Purpose>Sets magazine thumbnail display on description.aspx</Purpose>
*	<Description>width - 65px; height - 84px;</Description>
*****************************************************************/
.LargeMagazineThumbnail
{
    width : 120px;
    height: 160px;
}


/*********** USE THESE CLASSES TO CENTER THE CONTENT ********************************************************************************/

/***************************************************************
*	<CSSName>MainTable</CSSName>
*	<Type>Class</Type>
*	<Purpose>Control the display of the main table on all pages.  This is for Firefox</Purpose>
*	<Description>Center</Description>
*****************************************************************/
.MainTable
{	
	margin-left: auto;
	margin-right: auto;
	margin-top: auto;
	margin-bottom: auto;
	width: 100%
}

/***************************************************************
*	<CSSName>MainDiv</CSSName>
*	<Type>Class</Type>
*	<Purpose>Control the display of the main div tag on all pages.  This if for IE control</Purpose>
*	<Description>Center</Description>
*****************************************************************/
.MainDiv
{
	text-align: center;
}