/* start page for div based layout */

/* top border */
#top_border { line-height: 0; background-color: #f9f7f1; width: 800px; height: 27px; margin: 0; padding: 0; border-width: 0; outline-width: 0; }
/* IE / Win hacks */
* html #top_border { margin-bottom: -3px; }

/* top nav, right column */
#topnav-container { line-height: 0; background-color: #573015; background-image: url(../ssi-images/menu-under.gif); background-repeat: no-repeat; background-position: 0 0; text-align: left; vertical-align: top; width: 460px; height: 76px; overflow: hidden; min-width: 460px; min-height: 76px; max-width: 460px; max-height: 76px; margin: 0; padding: 0; border-width: 0; outline-width: 0; }

#topnav-top { line-height: 0; text-align: left; vertical-align: top; width: 460px; height: 38px; float: left; min-width: 460px; max-width: 460px; margin: 0; padding: 0; border-width: 0; outline-width: 0; white-space: nowrap; }
#topnav-bottom { line-height: 0; text-align: left; vertical-align: top; width: 460px; height: 26px; float: left; min-width: 460px; max-width: 460px; margin: 0; padding: 0; border-width: 0; outline-width: 0; white-space: nowrap; }
#topnav-spacer { line-height: 0; text-align: left; white-space: nowrap; margin: 0; padding: 0; width: 460px; height: 12px; vertical-align: top; float: left; min-width: 460px; min-height: 12px; max-width: 460px; max-height: 12px; border-width: 0; outline-width: 0; }
/* top nav image ids */
#left_nav_l_t { width: 11px; height: 38px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#major_brands { width: 127px; height: 38px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#how_to_getstarted { width: 170px; height: 38px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#tile_maintenance { width: 152px; height: 38px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#left_nav_l_b { width: 11px; height: 26px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#home_body_08 { width: 82px; height: 26px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#about { width: 77px; height: 26px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#directions { width: 100px; height: 26px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#contactus { width: 107px; height: 26px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#home_body_12 { width: 83px; height: 26px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }



/* main body area for div based layout */
#body-wrap  { background: url(../images/portico-tile.gif) repeat-y 0 0; text-align: left; vertical-align: top; width: 800px; clear: both; margin: 0; padding: 0; }
/* IE / Win hacks */
* html #body-wrap  { margin-bottom: -3px; padding: 0; }

#left-nav-col { font-size: 11px; font-family: Arial, Helvetica, sans-serif; line-height: 17px; background: url(../images/left-tile.gif) repeat-y; text-align: left; vertical-align: top; width: 313px; float: left; min-width: 313px; max-width: 313px; margin: 0; padding: 0; }

#left-nav-col .logo { position: relative; width: 280px; height: 145px; float: left; clear: both; margin: -11px 0 10px; padding: 0; }

/* left col image ids */
#portico { width: 280px; height: 145px; float: left; clear: both; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#left_spacer { width: 280px; height: 7px; float: left; clear: both; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#dec_tile { width: 280px; height: 47px; float: left; clear: both; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#imp_stone { width: 280px; height: 32px; float: left; clear: both; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#basic_tile { width: 280px; height: 36px; float: left; clear: both; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#glass_metal { width: 280px; height: 35px; float: left; clear: both; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#slate_quartz { width: 280px; height: 34px; float: left; clear: both; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#terra_cotta { width: 280px; height: 32px; float: left; clear: both; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#floor_tile { width: 280px; height: 34px; float: left; clear: both; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#specialty_mosaic { width: 280px; height: 49px; float: left; clear: both; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#left_nav_spacer_2 { width: 280px; height: 9px; float: left; clear: both; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
/* IE / Win hacks */


/* lower link ids */
#lowerlink-wrap { font-size: 11px; font-family: Arial, Helvetica, sans-serif; line-height: 17px; background-color: #f3efe6; background-image: url(../images/left-tile.gif); background-repeat: repeat-y; height: 164px; width: 280px; margin: 0; padding: 0; border-width: 0; outline-width: 0; }
#lowerlinks { line-height: 0; background-color: #f3efe6; background-image: url(../images/left-tile.gif); background-repeat: repeat-y; height: 40px; width: 280px; margin: 0; padding: 0; border-width: 0; outline-width: 0; white-space: nowrap; position: relative; left: 24px; }
#designs  { background-color: transparent; width: 175px; height: 40px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#whatshot  { background-color: transparent; width: 105px; height: 40px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }
#lowerlink-image { line-height: 0; background-color: transparent; background-image: url(../images/left-tile.gif); background-repeat: repeat-y; height: 124px; width: 280px; margin: 0; padding: 0; border-width: 0; outline-width: 0; white-space: nowrap; position: relative; left: 24px; }
#lower_images_full { background-color: transparent; background-image: url(../images/left-tile.gif); background-repeat: repeat-y; width: 280px; height: 124px; float: left; margin: 0; padding: 0; border-style: none; border-width: 0; outline-style: none; outline-width: 0; }

/* IE / Win hacks */
* html #lowerlink-wrap { margin-top: 0; margin-bottom: 0; }
* html #lowerlink-image { margin-top: 0; margin-bottom: 0; }


#nav_content { line-height: 0; width: 280px; background-color: #f3efe6; margin: 0; padding: 0; vertical-align: top; position: relative; left: 24px; height: 444px; border-width: 0; outline-width: 0; }


/* column 2 all col 2 body content */
#body-col { line-height: 0; background-image: url(../images/body-tile.gif); background-repeat: repeat-y; background-position: 0 0; text-align: left; vertical-align: top; width: 487px; height: 608px; min-width: 487px; max-width: 487px; margin-left: 313px; padding: 0; }
/* IE / Win hacks */
* html #body-col { text-align: left; vertical-align: top; position: absolute; top: 27px; width: 487px; min-width: 487px; max-width: 487px; margin: 0; padding: 0; }
 
/* column 2 all col 2 body content that require an off white background */
#body-col-2 { line-height: 0; background-image: url(../images/body-tile-2.gif); background-repeat: repeat-y; background-position: 0 0; text-align: left; vertical-align: top; width: 487px; height: 608px; min-width: 487px; max-width: 487px; margin-left: 313px; padding: 0; }
/* IE / Win hacks */
* html #body-col-2 { position: relative; margin-top: -625px; }
 

/* home image for div layout */
#home-image-wrap { line-height: 0; width: 463px; margin: 0 0 0 11px; padding: 0; border-width: 0; outline-width: 0; }
#home-image-body { line-height: 0; width: 449px; background-color: transparent; text-align: left; margin: 0; padding: 0; vertical-align: top; min-width: 449px; min-height: 532px; border-width: 0; outline-width: 0; }
/* IE / Win hacks */
* html #home-image-wrap { margin-top: 0px; margin-bottom: -3px; }
* html #home-image-body { margin-top: 0px; margin-bottom: 0px; }


#controlPane { text-decoration: none; width: 449px; height: 532px; margin: 0; padding: 0; border-style: none; border-width: 0; }
 
#home-image-wrap-b { line-height: 0; width: 463px; margin: 0 0 0 11px; padding: 0; border-width: 0; outline-width: 0; } 
* html #home-image-wrap-b { margin-top: 0px; margin-bottom: -3px; }


#bodyborder-top { line-height: 0; width: 449px; height: 7px; background-color: transparent; text-align: left; margin: 0; padding: 0; vertical-align: top; min-width: 449px; border-width: 0; outline-width: 0; }
/* IE / Win hacks */
* html #bodyborder-top { margin-top: -8px; margin-bottom: 0px; }


#bodyborder-bottom { line-height: 0; width: 449px; height: 7px; background-color: transparent; text-align: left; margin: 0 0 0 11px; padding: 0; vertical-align: bottom; min-width: 449px; border-width: 0; outline-width: 0; }
/* IE / Win hacks */
* html #bodyborder-bottom { margin-top: 0; margin-bottom: -3px; }
 

.right-image { background-color: #fff; float: right; margin: 0; padding: 1px; border: solid 1px #8b8477; }
 

/* footer, bottom border */
#footer { line-height: 0; background-color: #f9f7f1; width: 800px; margin: 0; padding: 0; }
/* IE / Win hacks */
* html #footer { margin-top: 0; position: relative; }
*:first-child+html #footer { clear: both; }
 
 /* footer, bottom border */
#footer-l2 { background: #f9f7f1 url(../images/footer-short-2.gif) no-repeat; width: 800px; float: left; clear: both; margin-top: -3px; padding: 0; }
/* IE / Win hacks */
* html #footer-l2 { margin-top: -5px; position: relative; margin-bottom: -5px; }
*:first-child+html #footer-l2 { clear: both; }
 

#bottom_border { line-height: 0; background-color: #f9f7f1; vertical-align: top; width: 800px; height: 50px; margin: 0; padding: 0; border: 0; }
#footer_text { background-color: #f9f7f1; text-align: left; vertical-align: top; width: 775px; height: 21px; margin: 0; padding: 0 0 0 25px; border: 0; }

#bottom_border-40px { line-height: 0; width: 800px; height: 40px; margin: 0; padding: 0; border: 0; }
#bottom_border-47px { line-height: 0; width: 800px; height: 47px; margin: 0; padding: 0; border: 0; }


/* Start vertical align so that bottom elements corect align to the bottom */

/* IE Win can be a bit out - you might need to adjust  
bottom value by -1px or as required */
.verticalalign
	{
	position: relative;
	bottom: 0;
	}
#left-nav-col .verticalalign
	{
	width: 313px;
	}
#body-col-2 .verticalalign
	{
	width: 487px;
	}

/* But Opera 9 does it right, so CSS3 hax to the max */
div[id^="body-wrap"] #left-nav-col .verticalalign
	{	width: 313px !important;	}
div[id^="body-wrap"] #body-col-2 .verticalalign
	{	width: 487px !important;	}

/* hack for IEs of all persuasions */
* html .verticalalign
	{
	width: 100% !important;
 	position: absolute;
 	bottom: 0;
	}
.verticalalign p
	{
	position: absolute;
	bottom: 0;
	right: 0;
	margin: 0;
	padding: 0;
	}


/* easy clearing */
#body-wrap:after
	{
	content: '[DO NOT LEAVE IT IS NOT REAL]'; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}
#body-wrap
	{
	display: inline-block;
	}
/*\*/
#body-wrap
	{
	display: block;
	}
/* end easy clearing */