/*-----------------PNG/The CSS that's required for Transparent PNG's-----------------*/
/*Background PNG images can't be tiled. This is a limitation of the IE filter. Padding and borders don't indent the PNG image. An easy fix for this is wrapping your PNG images in container DIVs or similar.*/

body, img, h2, #page, #nonFooter, * html #nonFooter, * html #footer, #footer, #footer .wrapper, #footer .wrapper .email, #footer .wrapper .email input.button, #header-container, #header, #header .support, #header .support input.button, #logo, #priNav-container, #priNav, #terNav-container, #terNav, #terNav .cart .search input.button, #special-container, #special, #content-container, #content, #content .priCon, #content .priCon .bio .image, #content .priCon .bio, #content .cart .search input.button, #content-btm-gradient-container, #content-btm-gradient { behavior: url(/CSS/iepngfix.htc); }




/*-----------------PAGE/GENERAL-----------------*/

* {
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 20px;
}
body {
	text-align: center;
	background-color: #000000;
}
#page {
	min-height: 100%;
	text-align: left;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	background-image: url(BGD-Gradient.jpg);
	background-repeat: repeat-y;
	background-position: center top;	/*background-image: url(BGD-Header-Content.gif);
	background-repeat: no-repeat;
	background-position: center top;*/
}
#nonFooter {
	position: relative;
	min-height: 100%;
}
.clearer {
	clear: both;
	display: block;
	height: 1px;
	margin-bottom: -1px;
	font-size: 1px;
	line-height: 1px;
}
td {
	padding-bottom: 20px;
}
img {
	border: 0;
	margin: 0px;
	padding: 0px;
	text-decoration: none;
}
img.photo {
	border: 1px solid #CCCCCC;
}
img.padBtm {
	border: 1px solid #666666;
	margin-bottom: 10px;
}
img.floatLeft {
	border: 1px solid #666666;
	float: left;
	position: relative;
}
.hide {
	display: none;
}
.borderOne {
	border: 1px solid #dedede;
}
.borderTwo {
	border: 1px solid #797979;
}
.addToCart {
	background-image: url(Cart.gif);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 20px;
}


/*-----------------PAGE/FONTS/COLORS-----------------*/

h1 {
	font-size: 24px;
	font-weight: normal;
	font-style: italic;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #FFFFFF;
	padding-bottom: 10px;
}
h2 {
	font-weight: normal;
	font-style: italic;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #FFFFFF;
	padding-bottom: 20px;
	font-size: 16px;
	background-image: url(h2Ornament.png);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 40px;
}
h3 {
	font-weight: bold;
	color: #FFFFFF;
	padding-bottom: 10px;
	font-size: 17px;
}
p {
	padding-bottom: 10px;
	color: #CCCCCC;
}
a {
	color: #E03931;
	text-decoration: underline;
}
a:hover {
	color: #333333;
	text-decoration: none;
}
.current {
	color: #333333;
	text-decoration: none;
}
.bold {
	font-weight: bold;
}
.italic {
	font-style: italic;
}
.white {
	color: #FFFFFF;
}
.black {
	color: #000000;
}
.primary {
	color: #E03931;
}
.secondary {
	color: #999999;
	font-size: None;
}
.tertiary {
	color: #999999;
	font-size: None;
}




/*-----------------HEADER STYLES-----------------*/

#header-container {
	height: 125px;
	position: relative;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-color: #000000;
}
#header {
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	height: 125px;
	padding-right: 30px;
	padding-left: 30px;
	position: relative;
	width: 910px;
}
#logo {
	margin-top: 20px;
	float: left;
	position: relative;
	height: 86px;
	width: 263px;
	background-image: url(Logo.png);
	background-repeat: no-repeat;
}




/*-----------------HEADER SUPPORT NAV STYLES-----------------*/

#header .support {
	float: left;
	padding-top: 50px;
	width: 335px;
}
#header .support label {
	font-size: 11px;
	color: #FFFFFF;
	padding-right: 5px;
}
#header .support .clientLogin {
	border: 1px solid #666666;
	width: 100px;
	font-size: 11px;
	padding: 2px;
	margin-right: 10px;
	height: 20px;
}
#header .support input.button {
	vertical-align: middle;
	height: 25px;
	width: 60px;
	background-image: url(Submit-Button.png);
	background-repeat: no-repeat;
	background-position: center center;
}
#header .support ul {
	float: left;
	padding-top: 5px;
	padding-right: 10px;
}
#header .support ul li {
	list-style-type: none;
	display: inline;
}
#header .support ul li a {
	text-decoration: underline;
	color: #999999;
	padding-left: 8px;
	background-image: url(Separator.gif);
	background-repeat: no-repeat;
	background-position: left center;
	padding-right: 5px;
}
#header .support ul li a:hover {
	text-decoration: none;
}
#header .support .noPipe {
	background-image: none;
}




/*-----------------PRIMARY NAV STYLES-----------------*/

#priNav-container {
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	position: relative;
	height: 50px;
	background-image: url(BGD-Nav.jpg);
	background-repeat: repeat-x;
	background-position: center center;
}
#priNav {
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	height: 50px;
	position: relative;
	width: 970px;
}
#priNav ul {
	list-style-type: none;
	position: relative;
}
#priNav ul li {
	float: left;
	display: inline;
}
#priNav ul li a {
	display: block;
	height: 50px;
}
#priNav ul li a.home {
	background: url(home.jpg) no-repeat top left;
	width: 106px;
}
#priNav ul li a.homeCurrent {
	background: url(home.jpg) no-repeat top left;
	width: 106px;
	background-position: top right;
}
#priNav ul li a.styles {
	background: url(styles.jpg) no-repeat 0 0;
	width: 111px;
}
#priNav ul li a.stylesCurrent {
	background: url(styles.jpg) no-repeat 0 0;
	width: 111px;
	background-position: top right;
}
#priNav ul li a.appliances {
	background: url(appliances.jpg) no-repeat 0 0;
	width: 136px;
}
#priNav ul li a.appliancesCurrent {
	background: url(appliances.jpg) no-repeat 0 0;
	width: 136px;
	background-position: top right;
}
#priNav ul li a.tiles {
	background: url(tiles.jpg) no-repeat 0 0;
	width: 94px;
}
#priNav ul li a.tilesCurrent {
	background: url(tiles.jpg) no-repeat 0 0;
	width: 94px;
	background-position: top right;
}
#priNav ul li a.wtops {
	background: url(wtops.jpg) no-repeat 0 0;
	width: 133px;
}
#priNav ul li a.wtopsCurrent {
	background: url(wtops.jpg) no-repeat 0 0;
	width: 133px;
	background-position: top right;
}
#priNav ul li a.sinks_and_taps {
	background: url(sinks_and_taps.jpg) no-repeat 0 0;
	width: 173px;
}
#priNav ul li a.sinks_and_tapsCurrent {
	width: 173px;
	background-image: url(sinks_and_taps.jpg);
	background-repeat: no-repeat;
	background-position: top right;
}
#priNav ul li a.finishing {
	background: url(finishing.jpg) no-repeat 0 0;
	width: 113px;
}
#priNav ul li a.finishingCurrent {
	background: url(finishing.jpg) no-repeat 0 0;
	width: 113px;
	background-position: top right;
}
#priNav ul li a.contact {
	background: url(contact.jpg) no-repeat 0 0;
	width: 104px;
}
#priNav ul li a.contactCurrent {
	background: url(contact.jpg) no-repeat 0 0;
	width: 104px;
	background-position: top right;
}
#priNav ul li a:hover {
	background-position: top right;
}
#priNav ul li .current {
	background-position: top right;
}


/*-----------------SPECIAL STYLES-----------------*/

#special-container {
	position: relative;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
#special {
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	width: 970px;
	height: 425px;
}




/*-----------------CONTENT STYLES-----------------*/

#content-container {
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
#content {
	padding-top: 10px;
	position: relative;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-right: 30px;
	padding-left: 30px;
	width: 910px;
}
#content .bottom {
	width: 910px;
	float: left;
	position: relative;
	text-align: center;
	padding-top: 15px;
	padding-bottom: 15px;
}
#content .bottom ul {
	list-style-type: none;
	padding-bottom: 1px;
}
#content .bottom ul li {
	display: inline;
	padding-right: 10px;
	color: #CCCCCC;
}
/*-----------------CONTENT PRICON STYLES-----------------*/
#content .priCon {
	width: 910px;
	position: relative;
	float: left;
}
#content .priCon p {
	color: #FFFFFF;
}
#content .priCon td {
	color: #CCCCCC;
}
#content .priCon .bio {
	width: 910px;
	position: relative;
	clear: both;
	float: left;
	margin-bottom: 15px;
}
#content .priCon .bio .image {
	float: left;
	height: 190px;
	width: 300px;
	position: relative;
	margin-right: 15px;
	background-image: url(Bio-Shadow.png);
	background-repeat: no-repeat;
	background-position: center center;
	padding: 10px;
}
#content .priCon .bio .text {
	float: right;
	position: relative;
	width: 573px;
	margin-top: 10px;
}
#content .priCon .main {
	float: left;
	width: 910px;
	position: relative;
	background-image: url(1x1Gray.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
	margin-bottom: 25px;
}
/*-----------------CONTENT PRICONLEFT STYLES-----------------*/
#content .priConLeft {
	width: 442px;
	float: left;
	position: relative;	/*had to be absolutely positioned to keep IE from expanding 
the white content area extremely to the right and left*/
}
#content .priConLeft ul {
	list-style-type: none;
}
#content .priConLeft ul li {
	display: block;
	margin-bottom: 23px;
	list-style-type: none;
}
/*-----------------CONTENT PRICONRIGHT STYLES-----------------*/
#content .priConRight {
	width: 442px;
	float: right;
	position: relative;
}
#content .priConRight ul {
	list-style-type: none;
}
#content .priConRight ul li {
	display: block;
	margin-bottom: 23px;
	list-style-type: none;
}
/*-----------------CONTENT PRICON SIDEBAR STYLES-----------------*/
#content .priCon .sidebar {
	float: right;
	position: relative;
	padding-right: 30px;
	padding-left: 25px;
}
#content .priCon .sidebar ul {
 list-style-type: none;
}
#content .priCon .sidebar ul li {
	display: block;
	padding-bottom: 15px;
	font-weight: bold;
	color: #FFFFFF;
}
/*-----------------CONTENT BOTTOM PAGINATION STYLES-----------------*/
#content .pagination {
	float: right;
	position: relative;
	width: 910px;
	padding-bottom: 15px;
}
#content .pagination ul {
	list-style-type: none;
	float: right;
	padding-bottom: 1px;
}
#content .pagination ul li {
	display: inline;
	color: #CCCCCC;
}
#content .pagination ul li a {
	font-size: 11px;
	font-weight: bold;
	color: #CCCCCC;
	margin-right: 2px;
	margin-left: 2px;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
	text-decoration: underline;
}
#content .pagination ul li a:hover {
	font-size: 11px;
	font-weight: bold;
	color: #FFFFFF;
	margin-right: 2px;
	margin-left: 2px;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
	text-decoration: none;
	background-color: #93231E;
}
#content .pagination .current {
	font-size: 11px;
	font-weight: bold;
	color: #CCCCCC;
	margin-right: 2px;
	margin-left: 2px;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
}
/*-----------------CONTENT BOTTOM CART PAGINATION AND SEARCH STYLES-----------------*/
#content .cart {
	margin-top: 25px;
	position: relative;
	height: 70px;
	float: right;
	width: 535px;
}
#content .cart .pagination {
	float: right;
	position: relative;
	clear: both;
	padding-top: 7px;
	padding-bottom: 7px;
	width: 535px;
}
#content .cart .pagination ul {
	list-style-type: none;
}
#content .cart .pagination ul li {
	display: inline;
}
#content .cart .pagination ul li a {
	font-size: 11px;
	font-weight: bold;
	color: #CCCCCC;
	margin-right: 2px;
	margin-left: 2px;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
	text-decoration: underline;
}
#content .cart .pagination ul li a:hover {
	font-size: 11px;
	font-weight: bold;
	color: #FFFFFF;
	margin-right: 2px;
	margin-left: 2px;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
	text-decoration: underline;
	background-color: #93231E;
}
#content .cart .pagination .current {
	font-size: 11px;
	font-weight: bold;
	color: #666666;
	margin-right: 2px;
	margin-left: 2px;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
	text-decoration: none;
}
#content .cart .search {
	float: right;
	position: relative;
}
#content .cart .search .searchLogin {
	border: 1px solid #666666;
	width: 100px;
	font-size: 11px;
	padding: 2px;
	margin-right: 10px;
	height: 20px;
}
#content .cart .search input.button {
	vertical-align: middle;
	height: 25px;
	width: 60px;
	background-image: url(Search-Button.png);
	background-repeat: no-repeat;
	background-position: center center;
}
/*-----------------CONTENT BOTTOM GRADIENT STYLES-----------------*/
#content-btm-gradient-container {
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
/*	background-image: url(BGD-Content-Btm-Gradient.gif);
	background-repeat: repeat-x;
	background-position: center center;*/
}
#content-btm-gradient {
	position: relative;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	height: 10px;
}





/*-----------------SPECIAL NOTE FOR ANY CONTENT ABOVE THE FOOTER-----------------*/
/*ANY Container above the footer needs to have the bottom margin set to the same height as the footer. In this case, the footer is 60pixels high. So any div's also need to have a bottom margin of 60pixels high to keep the footer from overflowing into those areas.*/





/*-----------------FOOTER STYLES-----------------*/
#footer {
	position: relative;
	margin-right: auto;
	margin-left: auto;
	height: 60px;
	background-image: url(BGD-GradientFooter.jpg);
	background-repeat: repeat-y;
	background-position: center top;	
	/*background-image: url(BGD-Footer.gif);
	background-repeat: repeat-x;
	background-position: center bottom;*/
}
#footer .wrapper {
	margin-right: auto;
	margin-left: auto;
	height: 60px;
	padding-right: 30px;
	padding-left: 30px;
	width: 910px;
}
#footer .wrapper ul {
	list-style-type: none;
	margin-top: 20px;
	margin-bottom: 20px;
	float: left;
}
#footer .wrapper ul li {
	display: inline;
	font-size: 11px;
	padding-right: 8px;
	padding-left: 4px;
	background-image: url(Separator.gif);
	background-repeat: no-repeat;
	background-position: right center;
	color: #FFFFFF;
}
#footer .wrapper ul li a {
	color: #FFFFFF;
	text-decoration: underline;
	font-size: 11px;
}
#footer .wrapper ul li a:hover {
	text-decoration: none;
	color: #CCCCCC;
}
#footer .wrapper ul li .current {
	color: #FFFFFF;
}
#footer .wrapper .LastPipe {
	background: none;
}
#footer .wrapper .email {
	float: right;
	padding-top: 15px;
}
#footer .wrapper .email label {
	font-size: 11px;
	color: #FFFFFF;
	padding-right: 5px;
}
#footer .wrapper .nameBox {
	border: 1px solid #666666;
	width: 100px;
	font-size: 11px;
	padding: 2px;
	margin-right: 10px;
	height: 20px;
}
#footer .wrapper .emailBox {
	border: 1px solid #666666;
	width: 100px;
	font-size: 11px;
	padding: 2px;
	margin-right: 10px;
	height: 20px;
}
#footer .wrapper .email input.button {
	vertical-align: middle;
	background-image: url(Submit-Button.png);
	background-repeat: no-repeat;
	background-position: center center;
	height: 25px;
	width: 60px;
}

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 0;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: 0px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 0px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -200px;
left: 330px; /*position where enlarged image should offset horizontally */

}