/* READ THIS FIRST 
** This page has 2 sections, one for supply and one for common 
** If you make changes to the common section, you may need to update the common css on store and mobile
** Please ask VC if you have any questions
**/

body {
	font-family:helvetica;
	color:#261786;
	background-color:#fff;
	margin:5px 0px 0px 0px;
}

/* mouse over link */
a:hover { color:#ff0000; }

/* for text size adjustment */
.class1 A:link {text-decoration: none}
.class1 A:visited {text-decoration: none}
.class1 A:active {text-decoration: none}
.class1 A:hover {text-decoration: underline; color: red;}
.fontsizelink { font-size:12px; text-align:right; display:inline; float:right;}

/* for top links on index */
a.grey:link {color:#8d8a8a;}
a.grey:hover {color:#FF0000;}
a.black:link {color:#000;}
.note { color:red;font-size:12px;font-weight:bold;text-align:center; }

/* For related items links */
.topnav {text-align:center; font-size:12px;}

.topnav2 {
	background-color:#D6EBFF;
	text-align:center;
	width:770px;
	margin-left:auto;
	margin-right:auto;
}

.header {
	width: 900px;
	margin:0px auto;
}

.tagline { 
	text-align:center;
	font-size:14px;
	color:#FF9900;
}

.az {	
	font-size:14px;
	font-weight:bold;
	text-align:center;
	margin-left:auto;
	margin-right:auto;
	white-space:nowrap;
	padding:3px;
}

.contact {
	font-size: 13px;
	text-align:right;
	vertical-align:text-top;
}

.ship { color:green; text-align:center; font-size:12px;}
.motto { color:#5C3317;text-align:center;font-size:14px;}

.testimonials {
	width:900px;
	margin:0px auto;
	padding-top:5px;
	padding-bottom:5px;
	text-align:left;
	font-size:14px;
}

.testimonialhead {
	padding-right:10px;
	padding-left:10px;
	font-size:22px;
	text-align:center;
}

.bottomlinks {
	width:850px;
	margin:0px auto;
	padding:5px;
	text-align:left;
	font-size:16px;
}

/* This is for the largest inventory - best service - lowest prices line (lbl) */
.lbl {
	text-align:center;
	color:#dd5500;
	font-weight:bold;
	padding-bottom: 5px;
	font-size:18px;
}


.faq {
	width:800px;
	margin:0px auto;
	padding:5px;
	text-align:left;
}

.faq p { text-align:left;font-size:14px; }

.q { 
	text-align:left;
	font-size:28px; 
	font-family:"Comic Sans MS",sans-serif;
	color:green;
	text-shadow: 2px 3px 3px #979797;

}
	
.a { 
	text-align:left;
	font-size:28px;
	font-family:"Comic Sans MS",sans-serif;
	color:blue;
	text-shadow: 2px 3px 3px #979797;

}

.faqtitle {
	text-align: center;
	color: green;
	font-weight:bold;
	font-size:24px;
}

.greybar {
	background-image:url('/images/index-vertical-grey-bar.jpg');
	background-repeat:repeat-x;
}

hr.bottomlink {
	width:90%;
	border-bottom:1px;
	text-align:center;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* COMMON - will move to common.css */

.mainbody, footer {
	text-align:center;
	text-align:-moz-center;
	position:relative;
	max-width:900px;
	margin-left:auto;
	margin-right:auto;
}

.wrapper {
	width: 900px;
	margin:0px auto;
	border-width: 1px;
	border-color: #cccccc;
	border-style: solid;
}

.navlinks { font-size:13px;text-align:center; }

.us {
	width:800px;
	padding:5px;
	margin:0px auto;
	text-align:justify;
	font-size: 16px;
}

div.img {
  margin: 2px;
  padding: 3px;
  height: auto;
  width: auto;
}

/* ZC please add notes for this section (when to use it) */
div.img img {
  display: inline;
  margin: 3px;
  padding: 3px;
  border: 1px solid #000000;
}

div.img a:hover img {border: 1px solid #000000;}

/* this was taken from shower heads reivew page. ZC plz add notes for when to use it */
.listimg {
	float:left;
	clear:both;
	width:190px;
	padding-left:10px;
	padding-right:10px;
}

.listinfo {
	margin-left:220px;
	padding-left:10px;
	padding-right:10px;
}
/* end section from shower heads review page */




.quote {
	width:770px;
	margin:0px auto;
	padding:5px;
	text-align: center;
}

.search {
	margin:0px auto;
	text-align:center;
	text-align:-moz-center;
	font-weight:bold;
}

h1, h2, h3, h4 { text-align:center;font-family:Helvetica, Arial, Serif; }

ul { font-size:14px; }

.headingColor { color:#1b13be; }
.headingbg { 
		font-size:24px;
		background-color:#EAE6E6;
		padding-left:10px;
		padding-right:10px;
}

table { text-align:left; }

table.border td {
	border-style:solid;
	border-width:1px;
	border-collapse:collapse;
	border-color: #c8c7c7;
	padding:3px;
	margin:0px auto;
	font-size:14px;
}

table.border td.foot,th {
	border-style:solid;
	border-width:1px;
	border-collapse:collapse;
	border-color: #c8c7c7;
	padding:3px;
	margin:0px auto;
	font-size:12px;
}

.noborder {
	padding:3px;
	margin:0px auto;
	border:none;
	border-collapse:collapse;
}

.bordergrey{
	border-style:solid;
	border-width:1px;
	margin:0px auto;
	border:none;
	border-collapse:collapse;
	border-color:#eeeeee;
}

.borderpad {
	border-collapse:collapse;
	padding:3px;
	margin:0px auto;
}

.border {
	border-style:solid;
	border-width:1px;
	border-collapse:collapse;
	padding:3px;
	margin:0px auto;
}

/* ROUNDED CORNERS */
.r1 {
	border:1px solid #000080;
 	-moz-border-radius: 1em;
  	border-radius: 1em;
}

.shadow {
	background-color:#FFF8DC;
	-webkit-box-shadow: 10px 10px 5px #888888; /* Safari */
	box-shadow: 10px 10px 5px #888888;
}

.shadow2 {
	background-color:#FFF8DC;
	-webkit-box-shadow: 5px 5px 5px #888888; /* Safari */
	box-shadow: 5px 5px 5px #888888;
}

th {padding:3px;}
td {padding:3px;}

.tdheader { font-weight:bold;background-color:#e0e0e0; }
.bgcolor{background-color:#EAE6E6;}

.leftfloat { float:left; }
.rightfloat { float:right; }
.clearfloat { clear:both; }

.leftpadding { padding-left:5px; }
.rightpadding { padding-right:5px; }
.p5 { padding:5px; }
.pt5 { padding-top:5px; }
.pl5 { padding-left:5px; }
.pb5 { padding-bottom:5px; }
.pr5 { padding-right:5px; }

.blue { color:blue; }
.lblue{ color:#688efc;}

.brown {color:#663300; }
.orange { color: #CC6600; }
.green { color:green; }
.red { color:red; }
.black { color:#000000; }

.b { font-weight:bold; }
.i { font-style:italic; }

.top { vertical-align:top; }
.middle { vertical-align:middle; }
.bottom { vertical-align:bottom; }
.justify { text-align:justify; }
.center {text-align:center;}
.right { text-align:right; }
.left { text-align:left; }
.alignc { margin:0px auto; } /* In order to use this class, a width must be specified */
.nwrap {white-space:nowrap;}
.maxw700 {max-width:700px;} /* Is this used anymore? Our width is way wider now */
.mimg {border:0px;}  /* What is this used for? */

img {border:none;}

img.absmiddle {
	vertical-align: middle;
	margin-bottom: .25em;
	border:none;
}


.image {
	border-color: black;
	border-width: 1px;
	border-style: solid;
}





/* Used for tableless image gallery - ZC 9/2/11 */

.gallery li {
        display:inline;
        list-style:none;
        width:150px;
        min-height:175px;
        float:left;
        vertical-align:top;
        margin: 0 10px 10px 0;
        text-align:center;
		padding:0 2px 0 2px;
	}
	
.gallery2 li {
        display:inline-block;
        list-style:none;
        vertical-align:top;
        margin: 0 10px 10px 0;
        text-align:center;
		padding:0 2px 0 2px;
		line-height:120%;
	}
/* FONT SIZES */

.heading { font-size:28px; }
.small { font-size:14px;padding-top:5px; } 
.fs10 { font-size:10px; }
.fs11 { font-size:11px; }
.fs12 { font-size:12px; }
.fs13 { font-size:13px; }
.fs14 { font-size:14px; }
.fs15 { font-size:15px; }
.fs16 { font-size:16px; }
.fs18 { font-size:18px; }
.fs20 { font-size:20px; }
.fs22 { font-size:22px; }
.fs24 { font-size:24px; }
.fs26 { font-size:26px; }
.fs28 { font-size:28px; }
.fs30 { font-size:30px; }
.fs32 { font-size:32px; }

.hr300 { width:300px;border-bottom:1px;margin:0 auto; }
.hr400 { width:400px;border-bottom:1px;margin:0 auto; }
.hr500 { width:500px;border-bottom:1px;margin:0 auto; }
.hr600 { width:600px;border-bottom:1px;margin:0 auto; }
.hr700 { width:700px;border-bottom:1px;margin:0 auto; }
.hr770 { width:770px;border-bottom:1px;margin:0 auto; }
.hr800 { width:800px;border-bottom:1px;margin:0 auto; }
.hr820 { width:820px;border-bottom:1px;margin:0 auto; }
.hr850 { width:850px;border-bottom:1px;margin:0 auto; }
.hr900 { width:900px;border-bottom:1px;margin:0 auto; }
.hrmax { width:100%;border-bottom:1px;margin:0 auto; }

/* root element for tabs */

#flowtabs {
	
	/* dimensions */
	width:800px;
	height:31px !important;
	margin:0 !important; 
	padding:0;	
	
	/* IE6 specific branch (prefixed with "_") */
	_margin-bottom:-2px;
}

/* single tab */
#flowtabs li { 
	float:left; 
	margin:0; 
	padding:0; 
	text-indent:0; 
	list-style-type:none;
}

/* a- tag inside single tab */
#flowtabs li a {
	display:block;
	height: 31px;   
	width: 180px; 	
	padding:0px;
	margin:0px;
	
	/* font decoration */
	color:#000;
	font-size:12px;
	line-height:33px;
	text-align:center;
	text-decoration:none;
}




/* panes */
#flowpanes {
	width:800px;
	height:45px;
	margin:0px 0px 0px 20px;
	float:center;
}


/* single pane */
#flowpanes div {
	display:none;	
	color:#fff;	
	margin:0px 0px;
}

/* some decorations for elements inside single pane */
#flowpanes div h2 {
	font-weight:normal;
	color:#ddd;
	letter-spacing:1px;
	margin:0px 0 0 0;
	font-size:22px;	
}

#flowpanes a {
	color:#cc9;		
	font-size:14px;
}

#flowpanes p, #flowpanes samp {
	color:#ccc;		
}

#flowpanes .narrow {
	padding-right:160px;		
}
/* override the root element to enable scrolling */
	#flowpanes {
		position:relative;
		overflow:hidden;
		/*clear:both;*/
		float:left;
	}

	/* override single pane */
	#flowpanes div {
		float:left;
		display:block;
		width:800px;
		font-size:14px;
		background:#ffffff;
	}

	/* our additional wrapper element for the items */
	#flowpanes .items {
		width:20000em;
		position:absolute;
		clear:both;
		margin:0;
		padding:0;
	}

	#flowpanes .less, #flowpanes .less a {
		color:#999 !important;
		font-size:11px;
	}
	
.scroll_logo_footer_next{background:url(/images/plumbingsupply-scroll-right.png) no-repeat; width:30px; height: 28px; border-style:none;}	
.scroll_logo_footer_previous{background:url(/images/plumbingsupply-scroll-left.png) no-repeat; width:30px; height: 28px; border-style:none;}
.logo_scroll ul li {display:inline;}
.logo_scroll ul {padding:0; margin:0;}