
/* 
======================
Class Tags Begin 
======================
*/

/* Class used to add padding between main page copy and promotional squares at bottom. */
.promotion {
	padding: 12px 0 0px 0;
	margin: 0;
}

/* classes for the tables on the douglas fir page (lists all the attributes of Doug Fir over other woods) */
.douglas_fir {
	width: 90%;
	border-style: solid;
	border-width: 1px;
	border-color: #9e9465;
}

.douglas_fir td {
	border-top: 1px solid #9e9465;
	padding: 5px;
}

.douglas_fir th {
	font-size: 11px;
	font-weight: normal;
	color: #FF0000;
	padding: 0.25em 0 0.25em 0;
}

.douglas_fir_header {
	font-size: 11px;
	font-weight: bold;
	color: #fff;
	background-color: #9e9465;
}

.douglas_fir_header_lite {
	font-size: 11px;
	font-weight: normal;
	color: #fff;
	background-color: #9e9465;
}

.douglas_fir_grey {
	background-color: #e2e2e2;
}

.douglas_fir td.left {
	border-left: 1px solid #9e9465;
}

/*Controls the div that surrounds each product isometric on the windows and doors homepages */
.product_description {
	padding: 0 0 0 0;
	margin: 0 0 20px 0;
}

.left { text-align: left; }

/* creates the vertical brown pinlines */
.pinline_brown {
	width: 1px;
	border: 0;
	padding: 0;
	margin: 0;
	background-color: #9e9465;
}

/* creates the vertical white pinlines */
.pinline_white {
	width: 1px;
	border: 0;
	padding: 0;
	margin: 0;
	background-color: #FFF;
}


/* used for any instance where the brown background is required */
.background_brown {
	background-color: #9e9465;
}

/* used for any instance where a white background is required */
.background_white {
	border: 0;
	padding: 0;
	margin: 0;
	background-color: #FFF;
}

/* Used on individual product pages (such as casement, awning, terrace door etc... */

.home_dealerlinks {
	padding: 0px 10px 5px 15px;
	margin: 0;
}

.mahogany_whiteheaders {
	float: left;
	padding: 0px;
	margin: 3px 0 20px 4px;
	color: #FFF;
	font-size: 10px;
}

img.right {
	float:right;
	margin: 0px 15px 0 20px;
}

/* this is not necessary-- use "container" div.class instead
.glazing{
	display: block;
}
*/

/* Div containing 3 columns, used on pages such as the cad download pages, the brickmould
pages and others...  */
div.container {
	padding: 0;
	margin: 0;
}

div.spacer {clear: both; line-height: 0; height: 0;}

/* the following is used to float the icons on the windows homepage */
div.float_icons {
	float: left;
	padding: 0;
	margin: 0px
}

/* This contains the product icons and their descriptions on the main product homepages */
div.icon_container {
	float: left;
	padding: 0;
	margin: 0px
}

div.float4 {
	float: left;
	padding-left: 7px;
	padding-right: 8px;
}

div.float5 {
	float: left;
	width: 163px;
	padding: 4px 4px 20px 4px;
	margin: 0 0 0 0;
}

div.float5 p {
	float: left;
	width: 163px;
	padding: 0 0 4px 10px;
	margin: 0 0 0 0;
}


div.float4 p {
	width: 60px;
	line-height: 12px;
	padding-top: 2px;
	text-align: center;
}


div.float3 {
	float: left;
	padding-left: 7px;
	padding-right: 8px;
}


div.float3 p {
	width: 105px;
	text-align: center;
	line-height: 12px;
	padding-top: 2px;
}

div.float3 p.left {
	width: 105px;
	text-align: left;
	line-height: 12px;
	padding-top: 2px;
}

div.float2 {
	float: left;
	padding-left: 7px;
	padding-right: 8px;
}

div.float2 p {
	text-align: center;
	width: 160px;
	line-height: 12px;
	padding-top: 2px;
}

div.float2 p.left {
	text-align: left;
	width: 168px;
	line-height: 12px;
	padding-top: 2px;
}

div.swatch {
	border: 1px solid #666;
	height: 20px;
	width: 103px;
}

div.float2wide {
	width: 250px;
	float: left;
	padding-left: 10px;
	padding-right: 0;
}

div.float3wide {
	width: 179px;
	float: left;
	padding-left: 10px;
	padding-right: 10px;
	/*Padding means max image width can only be 159px wide*/
}

div.float2wide ul.nopad {
	float: left;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

/*
.threecolumn_container {
	padding: 10px 10px 10px 10px ;
	margin: 0;
}

.threecolumn_column {
	width: 115px;
	font-size: 10px;
	line-height: 13px;
	float: left;
	padding: 10px 5px 10px 5px ;
	margin: 0;
}

.threecolumn_column a {
	margin: 1px 0 1px 0;
	padding: 1px 0 1px 0;
	text-decoration: none;
	font-weight: bold;
	color: #FD1914;
}

.threecolumn_column a:hover {
	color: #000;
}

.threecolumn_column a:active{
	color: #000;
}
*/

ul.loose li {
	margin-bottom: 0.5em;
}

/* Removes the left indent that occurs with unordered lists, used on heatsmart glazing page etc... */
ul.noindent {
	margin: 0 0 0 0;
	padding: 0;
}

ul.smallindent {
	margin: 0 10px 10px 10px;
	padding: 0;
}

/* formats the news list on the homepage */
.home_news li {
	padding: 0 0 0 10px;
	list-style: none;
	margin: 0 0 7px 0;
}

.archive_link {
	float: right;
	font-size: 9px;
	padding: 0 15px 10px 0;
}


/* formats the quick links on homepage */
.home_links li {
	padding: 0 0 0 10px;
	list-style: none;
	margin: 0 0 2px 0;
}

/*.home_links strong {
	color: #FD1914;
	text-decoration: none;
}*/

/* formats the product column on the homeowner homepage */
.home_products {
	padding: 0px 10px 0px 20px;
	margin: 0;
}

/* the next ID sizes the wider cell on the product main pages. (Ex: Windows Home)
There's two cells, one contains the photo and the other contains the body copy.  */
.productmain_large {
	width: 567px;
	border: 0;
	padding: 0;
	margin: 0;
	background-color: #fff;
}

.search_content {
	width: 739px;
	border: 0;
	padding: 0;
	margin: 0;
	background-color: #fff;
}

/* the next ID sizes the narrow cell on the product main pages. (Ex: Windows Home)
There's two cells, one contains the intro copy on a red background and the other
contains the navigation on the left */
.productcolumn_small {
	width: 170px;
	border: 0;
	padding: 0;
	margin: 0;
	background-color: #fff;
}



/* The following is used to size the content column on the individual product pages
(ex: awning, casement, terrace door etc... ) */
.productcolumn_medium {
	width: 395px;
	border: 0;
	padding: 0;
	margin: 0;
	background-color: #fff;
}

/* This is the second header in the sitemap. Typically applied to the div that 
surrounds secondary headers such as "Windows, Doors etc..." */
/*.sitemap_2nd_header {
	color: #9e9465;
	padding: 0 0 0 0;
	margin: 0 40px 10px 40px;
	border-bottom: 1px solid #BAAF7B;
}*/

.sitemap_body {
	color: #9e9465;
	padding: 0 0 0 0;
	margin: 0 10px 0px 40px;
}

/* This class is applied to the Div's that contain the sitemap column content. Such as the listing
of the casement section, the awning section etc */
.sitemap_columns {
	float: left;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	width: 159px;
	color: #9e9465;
}


/*ul.sitemap_menu li {
	list-style: none;
	margin: 0;
	padding: 1px 6px 1px 6px;
	text-align: left;
	background-image: none;
	font-weight: bold;
}

ul.sitemap_menu li a {
	display: block;
	padding: 0 0 0 8px;
	text-decoration: none;
	color: #FD1914;
}

ul.sitemap_menu li a:hover {
	background: url(images/happenings_bullet.gif) no-repeat left;
	color: #000;
}*/

ul.sitemap_menu li {
	list-style: none;
/*	list-style-image: none;*/
	margin: 0;
	padding: 1px 6px 1px 10px;
	margin-left: 6px;
	/* In IE, bullet graphic disappears if there is no border */
	border: 1px solid white;
}

ul.sitemap_menu li a {
	list-style: none;
	margin: 0;
/*	padding: 1px 6px 1px 6px;*/
	text-align: left;
	background-image: none;
	text-decoration: none;
	font-weight: normal;
}

ul.sitemap_menu li a:visited {
	text-decoration: none;
}

ul.sitemap_menu li.underline {
	list-style: none;
	background-image: none;
	margin: 0 0 0 0;
	padding: 2px 6px 1px 0px;
	font-weight: bold;
	text-decoration: none;
	color: #FD1914;
	border-bottom: 1px solid #BAAF7B;
}


ul.sitemap_submenu {
	margin: 0 0 0 0;
	padding: 0 0 0 6px;
	text-align: left;
/*	border: 1px dashed black;*/
}

/* Note: IE can't display the list properly unless a minimum of 1 px is in the top and bottom padding. */
ul.sitemap_submenu li {
	list-style: none;
	list-style-image: none;
	border-bottom: none;
	padding: 1px 0 1px 5px;
/*	padding: 1px 6px 1px 10px;*/
	margin-left: 6px;
	text-align: left;
/*	background-image: none;*/
	font-weight: normal;
/*	border: 1px solid red;*/
}

ul.sitemap_submenu li a {
/*	background: url(images/happenings_bullet.gif) no-repeat left;*/

	display: block;
	padding: 0 0 0 10px;
	text-decoration: none;
	color: #999;
/*	border: 1px solid blue;*/
}

ul.sitemap_submenu li a:hover {
	color: #000;
}

ul.sitemap_submenu li a:visited {
	text-decoration: none;
	color: #999;
}

/* This class controls the div that surrounds the individual hardware
components on the hardware homepages. */
.hardware_component {
	float: left;
	padding: 0px 10px 10px 10px ;
	margin: 0;
}

.hardware_swatch {
	float: left;
	width: 48px;
	padding: 10px 10px 10px 10px;
	margin: 0;
}

.hardware_swatch_on {
	border: 1px solid #FD1914;
}

.hardware_swatch_off {
	border: 0px;
}
.imageOff{ 
border: 0px 
} 
.imageOn{ 
border: 1px solid #000 
} 

/* Links for the cad headers (Currently in progress)*/
.cad_links td.title {
	padding: 4px 0 4px 0px;
	margin: 0;
	color: #FFF;
	font-size: 11px;
}

.literature_background {
	background: #9e9465;
}

.literature_copy {
	font-size: 10px;
	color: #fff;
}

.footnote {
	font-size: 10px;
	font-style: italic;
}

.smallcopy {
	font-size: 9px;
	color: #999;
}

.help {
	color: #808080;
	line-height: normal;
}

.smalldate {
	color: #808080;
	font-size: 10px;
}


/* 
======================
ID classes begin 
======================
*/

table#news_image {
	padding: 0px 15px 15px 10px;
	margin: 0;
}

#acrobat {
	padding: 15px 15px 0px 20px;
	margin: 0;
	font-size: 10px;
	font-style: italic;
}

/* Hardware picker main Div control: */
#hardware_picker {
	width: 100%;
	padding: 10px 10px 10px 10px;
	margin: 0;
}

/* Div that surrounds the hardware photo */
#hardware_photo {
	float: left;
	width: 332;
	padding: 10px 10px 10px 10px;
	margin: 0;
}

#hardware_header {
	font-weight: bold;
	font-size: 12px;
	float: left;
	width: 100%;
	padding: 10px 10px 3px 14px;
	margin: 0px 0px 10px 0px;
	border-bottom: 1px solid #BAAF7B;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}

/* Div that surrounds the color swatches and drop down on
the hardware picker */
#hardware_selections {
	font-size: 11px;
	line-height: 15px;
	font-weight: normal;
	text-align: left;
	float: left;
	width: 180px;
	padding: 10px 10px 10px 10px;
	margin: 0;
}

/* This Div contains the actual hardware finish swatches */
#hardware_swatches {
	width: 159px;
	padding: 0 0 0 0;
	margin: 5px 0 10px 0;
	border-bottom: 1px solid #9e9465;
	border-top: 1px solid #9e9465;
}


/* This ID controls the DIV that contains the individual hardware images on 
the hardware homepages. */
#hardware_content {
	padding: 10px 10px 20px 10px ;
	margin: 0;
}

/* Formats the hardware picker dropdown*/
#hardware_dropmenu {
	border: 1px;
	font-size: 10px;
	padding: 3px 10px 3px 0;
}


/* This ID controls the div that surrounds the hardware finish option */

/* formats the search box */
#searchbox {
	margin: 0;
	float: right;
	font-size: 10px;
	padding: 0px 10px 6px 0;
	background-color: #FFF;
}

#searchbox input {
	border: 1px solid #9E9465;
	font-size: 10px;
	width: 100px;
	vertical-align: baseline;
	margin-right: 5px;
}


/* This sets the defaults for all sitemap links. */
#sitemap_links a:link {
	text-decoration: none;
	/*color: #DC143C;*/
}

#sitemap_links a:visited {
	text-decoration: none;
	/*color: #DC143C;*/
}

#sitemap_links a:active {
	text-decoration: none;
	/*color: #999;*/
}

#sitemap_links a:hover {
	text-decoration: none;
	/*color: #999;*/
}
/* End sitemap links */


/* This is the ID the site map DIV that contains the text "home" and the links there in. */
#sitemap_home {
	color: #9e9465;
	padding: 0 0 0 0;
	margin: 10px 0 10px 22px;
	border-bottom: 1px solid #BAAF7B;
	text-decoration: none;
	font-weight: bold;
}

/*#sitemap_home a {
	color: #9e9465;
	text-decoration: none;
	font-weight: bold;
}*/

table#dealer_table{
	border-right: 1px solid #9e9465;
	border-bottom: 1px solid #9e9465;
}

table#dealer_table th{
	background: #9e9465;
	color: #FFF;
	padding: 4px 3px 4px 5px;
	font-size: 10px;
	font-weight: bold;
}

table#dealer_table td{
	border-left: 1px solid #9e9465;
	padding-right: 6px;
}

/* ID for the main table containing the all of the navigation at the top */
table#content_table {
	width: 767px;
	border: 0;
	padding: 0;
	margin: 0;
	margin-left: auto;
	margin-right: auto;
	background-color: #fff;
}

table#international_table {
	width: 741px;
	border: 0;
	padding: 0;
	margin: 0;
	margin-left: auto;
	margin-right: auto;
}



/* ID for the main table containing the all of the navigation at the top */
table#navigation_table {
	width: 767px;
	border: 0;
	padding: 0;
	margin: 0;
	margin-left: auto;
	margin-right: auto;
	background-color: #fff;
}



/* ID for the main table containing the all of the navigation at the top */
table#footer_table {
	width: 767px;
	border: 0;
	margin-left: auto;
	margin-right: auto;
	background-color: #9e9465;
}

/* ID for the individual product homepages, it centers the large image 
(ex: casements, awning etc) and red text beside it. */
table#prodhome_table {
	width: 767px;
	border: 0;
	margin-left: auto;
	margin-right: auto;
	background-color: #9e9465;
}

/* ID for the individual product homepages, it centers the bottom table that contains
that particular section's navigation and content */
table#prodhomecont_table {
	width: 767px;
	border: 0;
	margin-left: auto;
	margin-right: auto;
	background-color: #9e9465;
}

/* individual product tables (ex: casement, awning, terrace door etc...) */
table#product_table {
	width: 767px;
	border: 0;
	padding: 0;
	margin: 0;
	margin-left: auto;
	margin-right: auto;
	background-color: #fff;
}

table#sitemap_table_container {
	width: 639px;
	border: 0;
	padding: 0;
	margin: 0;
	margin-left: auto;
	margin-right: auto;
	background-color: #fff;
}


/* ID for the main table containing the all of the navigation at the top */
table#popupnav_table {
	width: 100%;
	border: 0;
	padding: 0;
	margin: 0;
	background-color: #fff;
}

/* Sets the attributes for the product listing tables on the windows 
and doors homepages that contain the isometric illustrations and descriptions*/
table#product_listing {
	width: 536px;
	border: 0px;
	padding: 0;
	margin: 10px 0 0 0;
}

/* Used for additional information that may be critical to the reader. */
.warning {
	margin: 1em;
	margin-left: 0;
	padding: .6em;
	color: black;
	border: 1px dashed #314263;
	background-color: #fbf9e4;
}

p.tight {
	margin-bottom: 0;
	padding-bottom: 0;
}

/* Homeowner homepage selectors begin */

#homeowner_banner_table {
	margin: 0 auto;
	width: 767px;
	background: #fff;
}

#homeowner_links_table {
	margin: 0 auto;
	width: 767px;
	background: #fff;
}


#homeowner_photo {
	width: 569px;
	vertical-align: bottom;
	border-top: 1px solid #9e9465;
	background: #fff;
}

#homeowner_description {
	width: 170px;
	text-align: center;
	background: #9e9465;
	border-top: 1px solid #9e9465;
	vertical-align: top;
}

#homeowner_prod_links {
	padding-top: 5px;
	width: 125px;
	margin: 0 auto;
	
}

.homeowner_news_products {
	width: 246px;
	background: #fff;
	vertical-align: top;
}

#homeowner_quicklinks {
	width: 247px;
	background: #fff;
	vertical-align: top;
}

.homeowner_content {
	padding: 0px 10px 15px 5px;
	line-height: 16px;
	margin: 0;
}

#homepage_footer_links {
	float: left;
	display: inline;
}


/* -------------------------------------------------------
For use on the temporary cyprium pages. Remove once the cyprium mini site goes live.
Ensure there are no references to these selectors before hand.
------------------------------------------------------------*/

div.cyprium_spacer { clear: both; height:0 ; border-bottom: 1px solid #9E9465; width: 100%; margin: 5px 0 10px 0;}

div.cyprium_features { width: 255px; padding: 0 0 10px 0; margin: 10px 0 0 0;}

div.img_border_right {border: 1px solid #9e9465; margin: 0 0 5px 5px; padding: 3px; float: right; }
div.img_border_left {border: 1px solid #9e9465; margin: 0 5px 5px 0; padding: 3px; float: left; }
div.img_border_right img {vertical-align: bottom;}
div.img_border_left img {vertical-align: bottom;}

img.float_right { float: right; margin: 0 0 10px 30px;}
img.float_left { float: left; margin: 0 30px 10px 0;}

div.patina_samples {float: left; border: 1px solid #9e9465; margin: 0 15px 5px 0; padding: 3px;}
div.patina_samples img{vertical-align: bottom;}

.cyprium_table {
	width: 80%;
	border-style: solid;
	border-left: 1px solid #9e9465;
	border-bottom: 1px solid #9e9465;
	border-top: none;
	border-right: 1px solid #9e9465;
	font-size: 10px;
}

.cyprium_table td {
	border-top: 1px solid #9e9465;
	padding: 5px;
	text-align: center;
}

.cyprium_table td.seperator {
	border-right: 1px solid #9e9465;
}

.cyprium_table th {
	font-size: 10px;
	font-weight: normal;
	color: #FF0000;
	padding: 0.25em 0 0.25em 0;
}

.cyprium_table_header {
	font-size: 10px;
	font-weight: bold;
	color: #fff;
	background-color: #9e9465;
}

.cyprium_table_header_lite {
	font-size: 10px;
	font-weight: bold;
	color: #f00;
}

.cyprium_table_header_lite_seperator {
	font-size: 10px;
	font-weight: bold;
	color: #f00;
	border-right: 1px solid #9e9465;
}

.cyprium_table_grey {
	background-color: #e2e2e2;
}

.cyprium_table_grey_seperator {
	background-color: #e2e2e2;
	border-right: 1px solid #9e9465;
}

.cyprium_table td.left {
	border-left: 1px solid #9e9465;
}

/* -------------------------------------------------------
End of Cyprium Specific Tags
------------------------------------------------------------*/

.bifold_float { float:left; width:105px; margin-top:5px; }
.bifold_float img { border:1px solid #9e9465; }
.bifold_float p { line-height:normal; font-size:10px; margin-top:1px; }

div#cad_details_picker { 
  padding-left: 8px;
  padding-right: 1em;
}

div#cad_plugin_sub_notice { 
  float: right;
  width: 170px;
  border: 1px solid #9e9465;
  background-color: #f8f6ef;
}

