@import url(reset.css);
@import url(price-popup.css);

body
{
    background: #eeeeee;
    color: #3d3d3d;
    font-family: Arial, Helvetica, Verdana;
    font-size: 62.5%;
}

.content-break
{
	width: 830px;
	clear: both;
}

/* Headers & Paragraph */
#main #content h1
{
	font-size: 2.1em;
	color: #0a5ca8;
	text-transform: uppercase;
}

#main #content h2
{
	font-size: 1.7em;
}

#main #content h3
{
	font-size: 1.5em;
}

#main #content h4
{
	font-size: 1.3em;
}

#main #content p
{
	font-size: 1.2em;
	line-height: 1.2em;
}

#main #content p.summary
{
	color: #0a5ca8;
	font-weight: bold;
	padding-top: 2px;
}
	
/* Links */
#main #content p a
{
	color: #3d3d3d;
	font-weight: bold;
}

#main #content p a:hover
{
	text-decoration: none;
}

/* Line Seperators */
.line-seperator
{
	float: left;
	width: 100%;
	border-top: solid 1px #bebebe;
	padding-bottom: 20px;
	margin-top: 20px;
}

/* Breadcrumb */
#breadcrumb
{
	font-size: 1.1em;
	font-style: italic;
	border-bottom: solid 1px #7a7a7a;
	padding-bottom: 10px;
	margin-bottom: 20px;
}

	#breadcrumb a
	{
		color: #3d3d3d;
	}
	
	#breadcrumb a:hover
	{
		text-decoration: none;
	}
	
/* Celebrating 25 Years Feature */
.celebrating
{
	width: 228px;
	height: 23px;
	background: url(/img/25years.gif) left top;
    text-indent: -5000px;
    position: relative;
    top: 80px;
    left: 10px;
}

/* Alignment */
.v-middle
{
	vertical-align: middle;
}

.text-center
{
	text-align: center;
}

/* Skeleton */
#wrapper
{
	margin: 0 auto;
	width: 980px;
}

#header
{
	float: left;
	width: 980px;
	padding: 0 0 20px 0;
}

#header-links
{
	float: left;
	width: 980px;
	padding: 10px 0;
	border-top: solid 1px #bebebe;
}

#top-navigation
{
	float: left;
	width: 980px;
	border-top: solid 1px #bebebe;
	border-bottom: solid 1px #bebebe;
}

#main
{
	float: left;
	width: 980px;
}

	#main #left-navigation
	{
		float: left;
		width: 140px;
		padding-top: 40px;
	}
	
	#main #content
	{
		float: right;
		width: 830px;
		padding-top: 20px;
	}
	
	#main .full-width
	{
		float: left !important;
		width: 970px!important;
	}

#footer
{
	float: left;
	width: 980px;
	margin: 40px 0 20px 0;
	border-top: solid 1px #bebebe;
}

/* Header */
#header .logo
{
	float: left;
    width: 257px;
    height: 42px;
    background: url(/img/walton_bathrooms.gif) left top;
    text-indent: -5000px;
    cursor: pointer;
}

#header p
{
	float: right;
	text-align: right;
	font-size: 1.6em;
}

#header a, #header span
{
	color: #0a5ca8;
	text-decoration: none;
	text-transform: uppercase;
}

/* Header Links */

#header-links input.textbox
{
	margin-top: 1px;
}

#header-links .search-btn
{
	margin-top: 8px;
	display: block;
}

#header-links a
{
	text-decoration: none;
	font-size: 1.2em;
	font-weight: bold;
	color: #434a50;
}

#header-links ul
{
	float: right;
}

#header-links li
{
	float: left;
	padding-left: 10px;
}

/* Top Navigation */
#top-navigation li
{
	float: left;
	padding-right: 18px;
}

#top-navigation li.last
{
	float: right;
	padding-right: 0;
}

#top-navigation a
{
	float: left;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.4em;
	color: #434a50;
	padding: 5px;
}

#top-navigation a:hover
{
	color: #0a5ca8;
}

#top-navigation a.on
{
	color: #0a5ca8;
}

/* Left Navigation */

#left-navigation li
{
	padding-bottom: 2px;
}

#left-navigation li span
{
	color: #0a5ca8;
	font-size: 1.4em;
	font-weight: bold;
	padding: 0 0 5px 5px;
	border-bottom: solid 1px #7a7a7a;
	display: block;
	margin-bottom: 5px;
}

#left-navigation a
{
	text-decoration: none;
	font-size: 1.2em;
	font-weight: bold;
	color: #434a50;
	padding: 2px 0 2px 5px;
	display: block;
}

#left-navigation a:hover
{
	color: #0a5ca8;
}

#left-navigation a.on
{
	color: #0a5ca8;
}

#left-navigation ul.legend
{
	border-top: solid 1px #7a7a7a;
	margin-top: 20px;
	padding-top: 20px;
}

#left-navigation ul.legend li
{
	padding: 0 0 10px 25px;
	font-size: 1.2em;
}

#left-navigation ul.legend li.blue
{
	background: url("/img/star_blue.gif") no-repeat 5px top;
}

#left-navigation ul.legend li.green
{
	background: url("/img/star_green.gif") no-repeat 5px top;
}

#left-navigation ul.legend li.red
{
	background: url("/img/star_red.gif") no-repeat 5px top;
}

#left-navigation ul.legend li.yellow
{
	background: url("/img/star_yellow.gif") no-repeat 5px top;
}

#left-navigation .platinum-card
{
	float: left;
	width: 140px;
	margin-top: 150px;
	background: url("/img/platinum-card.jpg") no-repeat left top;
}

	#left-navigation .platinum-card a
	{
		float: left;
		padding-top: 80px;
		color: #0a5ca8;
		text-decoration: underline;
	}
	
		#left-navigation .platinum-card a:hover
		{
			text-decoration: none;
		}

/* Footer */
#footer ul
{
	float: left;
	padding: 7px;
	font-size: 1.1em;
}

#footer li
{
	float: left;
	padding-right: 5px;
}

#footer a
{
	color: #434a50;
}

#footer a:hover
{
	text-decoration: none;
}

#footer p
{
	float: right;
	font-size: 1.1em;
	padding: 7px 0;
}

#footer p.pci
{
	clear: both;
}

#footer p.pci a
{
	padding-left: 10px;
}

/* Homepage */
#homepage
{
	float: left;
	width: 830px;
	background: #ffffff;
}

	#homepage .homepage-1-2
	{
		float: left;
		width: 560px;
	}
	
	#homepage .homepage-2-2
	{
		float: left;
		width: 230px;
		padding: 20px 20px 0 20px;
	}
	
	#homepage h1
	{
		color: #434a50;
	}
	
	#homepage h2
	{
		font-size: 2.0em;
		font-weight: normal;
		padding: 10px 0 5px 0;
		border-top: solid 1px #cccccc;
		text-transform: uppercase;
	}
	
	#homepage p
	{
		padding: 10px 0;
	}
	
	#homepage .form-field input
	{
		width: 93%;
	}

	#homepage .form-submit
	{
		float: left;
		width: 100%;
		text-align: right;
		padding: 5px 0;
	}
	
/* Homepage Carousel */
.home-carousel
{
    position: relative;
    top: 40px;
}

	.home-carousel a.prev, .home-carousel a.next
	{
        display: block;
        float: left;
        width: 70px;
        height: 24px;
        background: url("/img/carousel_prev.gif") no-repeat left top;
        text-indent: -5000px;
        margin-top: 50px;
    }
    
        .home-carousel a.next
        {
            background: url("/img/carousel_next.gif") 40px top no-repeat;
        }
            
    .home-carousel .carousel
    {
        float: left;
        position: relative;
        visibility: hidden;
        left: -5000px;
    }
    
    .home-carousel ul
    {
        margin: 0;
    }
    
    .home-carousel li
    {
		margin-right: 10px;
		width: 267px;
		height: 220px;
    }
    
    .home-carousel .image
	{
		height: 100px;
	}
	
	.home-carousel .image img
	{
		
	}
	
	.home-carousel h3
	{
		border-top: solid 1px #cccccc;
		padding-top: 10px;
		margin-top: 10px;
		font-size: 1.6em;
	}
	
	.home-carousel p
	{
		font-size: 1.2em;
		padding-top: 10px;
	}
	
	.home-carousel a
	{
		color: #434a50;
	}
	
	.home-carousel a:hover
	{
		text-decoration: none;
	}
	
/* Sub Carousel */
.sub-carousel-hr
{
	background-color: #7a7a7a;
	color: #7a7a7a;
	width: 100%;
	height: 1px;
	float: left;
	border: 0;
	margin-top: 30px;
}

.sub-carousel
{
    position: relative;
    top: 20px;
}

	.sub-carousel a.prev, .sub-carousel a.next
	{
        display: block;
        float: left;
        width: 70px;
        height: 24px;
        background: url("/img/carousel_prev.gif") no-repeat left top;
        text-indent: -5000px;
        margin-top: 50px;
    }
    
        .sub-carousel a.next
        {
            background: url("/img/carousel_next.gif") 40px top no-repeat;
        }
            
    .sub-carousel .carousel
    {
        float: left;
        position: relative;
        visibility: hidden;
        left: -5000px;
    }
    
    .sub-carousel ul
    {
        margin: 0;
    }
    
    .sub-carousel li
    {
		margin-right: 10px;
		height: 130px;
		width: 150px;
    }
    
    .sub-carousel .image
	{
		height: 100px;
		border-bottom: solid 1px #cccccc;
		padding-bottom: 10px;
	}
	
/* Products */
#products
{
	float: left;
	width: 830px;
}

	#products .product
	{
		float: left;
		width: 830px;
		border-top: solid 1px #7a7a7a;
		padding-top: 20px;
		margin-top: 20px;
	}
	
		#products .product .product-img
		{
			float: left;
			width: 190px;
			margin-right: 10px;
			background: #ffffff;
			text-align: center;
			padding: 20px 0 20px 0;
		}
			
			#products .product .lightbox-img a
			{
				display: block;
				background: #ffffff url("/img/enlarge.gif") 10px bottom no-repeat;
				padding: 20px 0 30px 0;
			}
			
			#products .product .lightbox-img-more a
			{
				display: block;
				background: #ffffff url("/img/more_images.gif") 10px bottom no-repeat;
				padding: 20px 0 30px 0;
			}
			
			#products .product .lightbox-img a.hidden, #products .product .lightbox-img-more a.hidden
			{
				visibility: hidden;
				padding: 0;
			}
		
		#products .product .product-content
		{
			float: left;
			width: 630px;
		}
	
	#products h2
	{
		float: left;
		width: 100%;
		font-size: 1.6em;
		color: #3d3d3d;
		border-bottom: solid 1px #c2c2c2;
		padding-bottom: 10px;
		margin-bottom: 10px;
	}
	
	#products h2 a
	{
		float: left;
		color: #3d3d3d;
		text-decoration: none;
	}
	
	#products h2 span
	{
		float: left;
	}
	
	#products h2 span.special-offer
	{
		color: #0a5ca8;
	}
	
	#products h2 span.ref
	{
		float: right;
		color: #8b8b8b;
	}
	
	#products h2 .status-images
	{
		float: right;
		padding-right: 10px;
	}
	
	#products p
	{
		float: left;
		width: 100%;
		color: #434a50;
		margin-bottom:5px;
	}
	
	#products pre
	{
		float: left;
		width: 100%;
		font-size: 12px;
	}
	
	#products .product p
	{
		color: #434a50;
	}
	
	#products .product p.platinum
	{
		float: left;
		clear: both;
		width: 100%;
		color: #0a5ca8;
		padding-top: 10px;
		font-weight: bold;
	}
	
	#products .drop-down
	{
		margin-top: 10px;
		color: #0a5ca8;
	}
	
	#products .check-boxes
	{
		float: left;
		width: 100%;
		clear: both;
		margin-top: 10px;
		font-size: 1.2em;
		font-weight: bold;
	}
	
	#products .button
	{
		float: left;
		margin-top: 20px;
	}
	
	#products .related-downloads
	{
		float: right;
		width: 200px;
	}
	
	#products .related-downloads h4
	{
		color: #0a5ca8;
		padding-bottom: 3px;
		margin-bottom: 10px;
		border-bottom: solid 1px #c2c2c2;
	}
	
	#products .related-downloads a
	{
		font-size: 1.2em;
		color: #434a50;
	}
	
	#products .related-downloads a:hover
	{
		text-decoration: none;
	}
	
	#products .button-sub
	{
		float: left;
		clear: both;
		margin-top: 20px;
	}
	
	#products p.price
	{
		padding-top: 10px;
		font-size: 1.5em !important;
		font-weight: bold;
		color: #0a5ca8;
	}
	
		#products p.price span
		{
			color: #ab0000;
		}
		
	#products .footer
	{
		float: left;
		width: 100%;
		border-top: solid 1px #7a7a7a;
		padding-top: 20px;
		margin-top: 20px;
	}
	
/* Content page */
#content-page
{
	float: left;
	width: 830px;
	border-top: solid 1px #7a7a7a;
	padding-top: 20px;
	margin-top: 20px;
}

#content-page ol
{
	padding: 10px 0;
}

#content-page li
{
	font-size: 12px;
	line-height: 1.2em;
}

#content-page li a
{
	color: #3d3d3d;
	font-weight: bold;
}

#content-page li a:hover
{
	text-decoration: none;
}

#content-page ul li
{
	padding: 10px 0 0 10px;
	margin-left: 30px;
	list-style-type: disc;
}

#content-page ol li
{
	padding: 10px 0 0 10px;
	font-weight: bold;
	list-style-type: none;
}

#content-page ol li ol li
{
	margin-left: 0;
	padding-left: 0;
	font-weight: normal;
}

#content-page ol li ol li ol li
{
	margin-left: 30px;
}

/* Our People */
#our-people
{
	float: left;
	width: 830px;
}

#our-people .person
{
	float: left;
	border-top: solid 1px #7a7a7a;
	margin-top: 20px;
	padding-top: 10px;
}

#our-people .person-col
{
	float: left;
	width: 410px;
	margin-left: 10px;
}

#our-people .col-1
{
	margin-left: 0;
}

#our-people .person-img
{
	float: left;
	width: 190px;
	margin-right: 10px;
	text-align: center;
	background: #ffffff;
	padding: 20px 0 0 0;
}

	#our-people .person-img a
	{
		display: block;
		background: #ffffff url("/img/enlarge.gif") 10px bottom no-repeat;
		padding: 20px 0 30px 0;
	}

#our-people h2
{
	float: left;
	width: 210px;
	border-bottom: solid 1px #c2c2c2;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

#our-people p
{
	float: left;
}

/* Login */
#login
{
	float: left;
	width: 830px;
	border-top: solid 1px #7a7a7a;
	padding-top: 20px;
	margin-top: 20px;
}

#login input.textbox
{
	width: 200px;
}

#login p
{
	padding-top: 5px;
}

/* Register */
#register
{
	float: left;
	width: 830px;
	border-top: solid 1px #7a7a7a;
	padding-top: 20px;
	margin-top: 20px;
}

#register p
{
	padding: 10px 0;
}

#register .register-col
{
	float: left;
	width: 250px;
	padding-left: 40px;
}

	#register .register-col input.textbox, #register .register-col textarea
	{
		width: 200px;
	}

#register .col-1
{
	padding-left: 0;
}

/* Shopping Cart */
#shopping-cart
{
	float: left;
	width: 830px;
	border-top: solid 1px #7a7a7a;
	padding-top: 20px;
	margin-top: 20px;
}

#shopping-cart .shopping-cart-col
{
	float: left;
	width: 390px;
	padding: 0 20px 0 0;
	border-top: solid 1px #7a7a7a;
	margin-top: 20px;
}

#shopping-cart .shopping-cart-col ol
{
	padding: 10px 0;
}

#shopping-cart .shopping-cart-col li
{
	font-size: 12px;
	line-height: 1.2em;
}

#shopping-cart .shopping-cart-col li a
{
	color: #3d3d3d;
	font-weight: bold;
}

#shopping-cart .shopping-cart-col li a:hover
{
	text-decoration: none;
}

#shopping-cart .shopping-cart-col ul li
{
	padding: 10px 0 0 10px;
	margin-left: 30px;
	list-style-type: disc;
}

#shopping-cart .shopping-cart-col ol li
{
	padding: 10px 0 0 10px;
	font-weight: bold;
	list-style-type: none;
}

#shopping-cart .shopping-cart-col ol li ol li
{
	margin-left: 0;
	padding-left: 0;
	font-weight: normal;
}

#shopping-cart .shopping-cart-col ol li ol li ol li
{
	margin-left: 30px;
}

#shopping-cart h3
{
	padding-top: 20px;
}

#shopping-cart .existing-user
{
	float: left;
	font-size: 1.6em;
	font-weight: bold;
	clear: both;
	width: 100%;
	padding-bottom: 10px;
}

/* My Bathroom */
#my-bathroom
{
	float: left;
	width: 830px;
	border-top: solid 1px #7a7a7a;
	padding-top: 20px;
	margin-top: 20px;
}

#my-bathroom .my-bathroom-footer, #my-bathroom .my-bathroom-footer .buttons
{
	padding-top: 10px;
}

/* Quote Details */
#quote-details
{
	float: left;
	width: 830px;
	border-top: solid 1px #7a7a7a;
	padding-top: 20px;
	margin-top: 20px;
}

#quote-details .quote-details-col
{
	float: left;
	width: 410px;
	margin-left: 10px;
	margin-top: 10px;
	padding: 10px 0;
	border-top: solid 1px #c2c2c2;
}

#quote-details .col-1
{
	margin-left: 0;
}

#quote-details .comments p
{
	background: #ffffff;
	padding: 5px;
	font-size: 1.1em;
	margin-top: 5px;
}

#quote-details table
{
	float: left;
}

/* Testimonials */
#testimonials
{
	float: left;
	width: 830px;
}

#testimonials .testimonial
{
	float: left;	
	border-top: solid 1px #7a7a7a;
	margin-top: 20px;
	padding-top: 10px;
}



#testimonials .testimonial-col
{
	float: left;
	width: 400px;
	margin-left: 10px;
}

#testimonials .col-1
{
	margin-left: 0;
	width: 410px;
}

#testimonials h2
{
	border-bottom: solid 1px #c2c2c2;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

/* Contact Us */
#contact-us
{
	float: left;
	width: 830px;
}

#contact-us .contact
{
	float: left;
	border-top: solid 1px #7a7a7a;
	margin-top: 20px;
	padding-top: 10px;
}

#contact-us .contact-col-1
{
	float: left;
	width: 370px;
	margin-right: 10px;
	padding: 10px;
	background: #ffffff;
}

#contact-us .contact-col-2
{
	float: left;
	width: 430px;
}

#contact-us h2
{
	border-bottom: solid 1px #c2c2c2;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

/* Order Detail */
#order-detail
{
	float: left;
	width: 830px;
	border-top: solid 1px #7a7a7a;
	padding-top: 20px;
	margin-top: 20px;
}

/* Order Confirmation */
#order-confirmation
{
	float: left;
	width: 830px;
	border-top: solid 1px #7a7a7a;
	padding-top: 20px;
	margin-top: 20px;
}

#order-confirmation .textarea
{
	width: 500px;
	height: 120px;
}

/* Search */
.search-pagination
{
	float: left;
	width: 830px;
	border-top: solid 1px #7a7a7a;
	padding-top: 20px;
	margin-top: 20px;
}

	.search-pagination h3
	{
		padding-bottom: 10px;
	}

	.search-pagination .pagination-left, .search-pagination .pagination-right
	{
		float: left;
		width: 50%;
	}
	
	.search-pagination .pagination-right
	{
		text-align: right;
	}
	
/* Site Map */
#sitemap
{
	float: left;
	width: 970px;
	border-top: solid 1px #7a7a7a;
	padding-top: 20px;
	margin-top: 20px;
}

	#sitemap .sitemap-col
	{
		float: left;
		width: 230px;
		padding-right: 10px;
	}
	
	#sitemap .break
	{
		float: left;
		width: 970px;
		border-top: solid 1px #7a7a7a;
		margin: 20px 0;
	}
	
	#sitemap a:hover
	{
		text-decoration: none;
	}
	
	#sitemap h2 a, #sitemap h3 a
	{
		color: #0a5ca8;
	}
		
	#sitemap h2
	{
		padding-bottom: 5px;
	}
	
	#sitemap h3
	{
		padding: 5px 0;
		font-size: 1.3em !important;
	}
	
	#sitemap li
	{
		padding: 2px 0;
		line-height: 1.2em;
	}
	
		#sitemap li a
		{
			color: #3d3d3d;
			font-weight: bold;
		}
		
		#sitemap li a.level3
		{
			font-weight: normal;
			padding-left: 10px;
		}

/* Table Related */
.table-header td
{
	background: #494b4f;
	color: #ffffff;
	font-size: 1.2em;
	font-weight: bold;
	padding: 7px;
	text-align: left;
	border-right: solid 1px #fff;
}

	.table-header td a
	{
		color: #ffffff;
	}

.table-item td
{
	padding: 7px;
	background: #ffffff;
	font-size: 1.2em;
	border-right: solid 1px #efefef;
}

	.table-item td a
	{
		color: #0a5ca8;
		font-weight: bold;
	}
	
	.table-item td a:hover
	{
		text-decoration: none;
	}
	
.table-item-plain td
{
	padding: 7px 0;
}

.table-item-seperator td
{
	border-top: solid 1px #7a7a7a;
}

.footer-item td
{
	padding: 7px;
}

.table-cart-totals
{
	margin-bottom: 10px;
}

.table-cart-totals td
{
	padding: 5px 10px;
	background: #ffffff;
	font-size: 1.2em;
	border-right: solid 1px #efefef;
}

	.table-cart-totals td a
	{
		color: #0a5ca8;
		font-weight: bold;
	}
	
	.table-cart-totals td a:hover
	{
		text-decoration: none;
	}

	.table-cart-totals td.seperator
	{
		border-top: solid 1px #0a5ca8;	
	}

	.table-cart-totals td strong
	{
		color: #0a5ca8;
	}
	
.table-align-right
{
	font-size: 1.2em;
	float: right;
}

	.table-align-right td
	{
		padding: 2px;
	}
	
.table
{
	font-size: 1.2em;
}

	.table td
	{
		padding: 2px 0;
	}
	
/* Form Related */
textarea
{
	font-family: Arial;
	font-size: 1.2em;
}

fieldset .form-field
{
	float: left;
	width: 100%;
	padding: 5px 0;
}

fieldset label
{
	width: 100%;
	float: left;
	font-size: 1.2em;
	padding-bottom: 5px;
}

fieldset .checkbox label
{
	float: none;
}

input.textbox
{
	font-family: Arial, Helvetica, Verdana;
	font-size: 12px;
	margin-top: 1px;
	padding: 4px;
}

select
{
	font-family: Arial, Helvetica, Verdana;
	font-size: 12px;
	padding: 4px;
}

.textarea
{
	font-family: Arial, Helvetica, Verdana;
	font-size: 12px;
	padding: 4px;
}

fieldset .validation
{
	color: Red;
	font-size: 1.1em;
	width: 100%;
	float: left;
	padding-top: 5px;
	font-weight: bold;
}

.req-field
{
	color: #0a5ca8;
}

.error, .msg
{
	color: Red;
	font-size: 1.2em;
	font-weight: bold;
}