/* CSS Document */

/* ------------------------- Document Styles ------------------------- */
body{
	
	/* Set Site Font and Background */
	font-family:"Trebuchet MS";
	background: rgb(140,139,139) url(../images/bodyBack.gif) no-repeat top center;
}


/* ------------------------- Containers ------------------------- */
#header{
	height:160px;
	width:780px;
	margin:0 auto;
	position:relative;
	background:#FFF url(../images/headerBg.gif) no-repeat top left;
}

#content{
	width:780px;
	margin:0 auto;
	position:relative;
	background:#FFF url(../images/contentBg.gif) repeat-y top left;
	overflow-x:hidden;
}

/* ------------------------- Content Area Stuff ------------------------- */

#picInfoOne{
width:780px;
height:317px;
background:#333 url(../images/homeImg.jpg) no-repeat top left;
}


#picInfoTwo{
width:780px;
height:199px;
background:#333 url(../images/homeImgSm.jpg) no-repeat top left;
}

#picInfoThree{
width:780px;
height:50px;
background:#373737;
}

#picInfoFour{
width:780px;
height:317px;
background:#333 url(../images/pipesLarge.jpg) no-repeat top left;
}


#picInfoFive{
width:780px;
height:199px;
background:#333 url(../images/pipesSmall.jpg) no-repeat top left;
}

#picInfoSix{
width:780px;
height:199px;
background:#333 url(../images/moregearsSmall.jpg) no-repeat top left;
}

#picInfoSeven{
width:780px;
height:317px;
background:#333 url(../images/moregearsLarge.jpg) no-repeat top left;
}

#left{
width:280px;
float:left;
padding-bottom:50px;
}

#right{
width:499px;
float:right;
}

#footer{
clear:both;
width:780px;
margin:0 auto;
position:relative;
}

#bar{
height:40px;
width:100%;
background:#bfbfbf;
}

#map{
margin:0 auto;
position:relative;
}

#qew{
margin:0 auto;
margin-top:25px;
position:relative;
}

/* ------------------------- Navigation ------------------------- */

#navList{
height:63px;
position:absolute;
left:275px;
bottom:0;
list-style:none;
}

#navList li{
display:inline;
height:63px;
}

#navList li a{
height:63px;
display:block;
background-color:#FFF;
background-position:bottom left;
background-repeat:no-repeat;
float:left;
}

#home a{
width:76px;
background-image:url(../images/home.gif);
}

#products a{
width:100px;
background-image:url(../images/products.gif);
}

#msds a{
width:82px;
background-image:url(../images/msds.gif);
}

#find a{
width:90px;
background-image:url(../images/findus.gif);
}

#contact a{
width:111px;
background-image:url(../images/contact.gif);
}

#navList li a:hover{
background-position:center left;
}

#navList li a.selected{
background-position:top left;
}

/* ------------------------- Page Buttons ------------------------- */
#bigButtons{
list-style:none;
width:280px;
padding-top:5px;
padding-bottom:20px;
}

#bigButtons li{
margin:0px auto;
height:58px;
width:212px;
padding-top:15px;
}

#bigButtons li a{
height:58px;
width:212px;
display:block;
background-color:#d4d4d4;
background-position:bottom left;
background-repeat:no-repeat;
}

#productBut a{
background-image:url(../images/productBut.gif);
}

#msdsBut a{
background-image:url(../images/msdsBut.gif);
}

#bigButtons li a:hover{
background-position:top left;
}

#bigButtons li a.selected{
background-position:top left;
}

/* ------------------------- Content Styles ------------------------- */

#content{
color:#474747;
}

#content #left p{
color:#474747;
width:185px;
display:block;
margin:0 auto;
position:relative;
padding-top:10px;
font-style:italic;
}

#content #left p em{
padding-top:10px;
display:block;
color:#333;
font-weight:bold;
}

#right{
padding-top:20px;
padding-bottom:20px;
}

#content h2{
font-family:"Georgia";
font-size:21px;
font-weight:normal;
padding-top:10px;
padding-bottom:10px;
}

#right p, #right h2{
padding-left:25px;
padding-right:40px;
}

#content p{
font-size:13px;
padding-bottom:10px;
}
#content p a{color:#000;}
#content p a:hover{color:#474747;}



.smallP{
padding-left:10px;
display:block;
width:160px;
float:left;
}

/* ------------------------- Category Navigation ------------------------- */

#productNav{
width:212px;
margin:25px auto;
position:relative;
list-style:none;
border:1px solid #bfbfbf;
padding-top:5px;
padding-bottom:5px;
}

#productNav li{
padding-top:5px;
padding-bottom:5px;
}

#productNav li a{
border:1px solid #FFF;
font-size:13px;
color:#fff;
text-decoration:none;
text-align:center;
display:block;
width:168px;
margin:0 auto;
position:relative;
padding:5px 10px 5px 10px;
background:url(../images/productNavBut.gif) no-repeat center center;
}

#productNav li a:hover{
background-position:center bottom;
color:#eee;
border:1px solid #eee;
}

/* ------------------------- Product List ------------------------- */

#itemList{
margin-top:10px;
margin-left:60px;
list-style:square;
font-size:13px;
}

#itemList li{
padding-bottom:5px;
}

#itemList li a{
color:#333;
}

#itemList li a:hover{
color:#666;
}

#itemList li a:visited{
color:#999;
}

/* ------------------------- PDF List ------------------------- */


#pdfList{
color:#ccc;
margin-top:10px;
margin-left:40px;
list-style:square;
font-size:11px;
}

#pdfList li{
width:150px;
float:left;
padding-bottom:5px;
}

#pdfList li a{
color:#333;
}

#pdfList li a:hover{
color:#666;
}

#pdfList li a:visited{
color:#999;
}


/* ------------------------- Product Details ------------------------- */

#picList{
margin-top:15px;
list-style:none;
padding-left:20px;
}

#picList li{
display:inline;
float:left;
width:210px;
text-align:center;
padding-bottom:5px;
}

#productDesc{
padding-top:15px;
font-size:13px;
clear:left;
}

#productDesc ul{
margin-left:60px;
padding-bottom:20px;
padding-top:10px;
}

#productDesc ol{
margin-left:60px;
padding-bottom:20px;
padding-top:10px;
}

.backBut{
border:1px solid #aaa;
font-size:13px;
color:#fff;
text-decoration:none;
text-align:center;
display:block;
width:100px;
margin:0 auto;
position:relative;
padding:5px 10px 5px 10px;
background:url(../images/productNavBut.gif) no-repeat center center;
}

#productNav li a:hover{
background-position:center bottom;
color:#eee;
border:1px solid #eee;
}

/* ------------------------- LinxSmart Link List ------------------------- */

/* ------------------------- LinxSmart Link List ------------------------- */
#linxsmart{
	list-style:none;
	padding:20px 0 20px 0px;
}
#linxsmart li{
	display:inline;
	color:#FFF;
	font-size:11px;
}
#linxsmart li a{
	color:#FFF;
}



/* ------------------------- Basic HouseKeeping ------------------------- */

/* Clear Browser Padding */
*{
	margin:0px;
	padding:0px;
}
/*  Clear FireFox's border around clicked links */
a{
	outline:none;
}


/* ------------------------- Special Classes ------------------------- */

/* Hide Text */
.hideText{
	position:absolute;
	text-indent:-5000px;
}
/* Clearing Div */
.easyClear{
	clear:both;
}


/* ------------------------- Event List Styles ------------------------- */

#errorList{
  margin: 10px 10px 10px 10px;
  padding: 10px;
  border: solid 1px #dd3c10;
  background: #ffebe8 url(../images/errorBg.gif) no-repeat center right;
  clear:both;
list-style:none;
font-size:13px;
}

#errorList li{
}

#successList{
  margin: 10px 10px 10px 10px;
  padding: 10px;
  border: solid 1px #82c242;
  background: #dafab9  url(../images/successBg.gif) no-repeat center right;
  clear:both;
list-style:none;
font-size:13px;
}

#successList li{
}


/* ------------------------- Forms ------------------------- */

/* Input Box Styles */
.formBox{

	/* Set Colors */
	border:1px solid #bfbfbf;
	color:#474747;
	
	/* Set Background */
	background:none;
	
	/* Set Size and Font */
	/* 20px less than fieldset */ width:390px;
	font-family: "Trebuchet MS",Arial;
	font-size:13px;
	
	/* Structure */
	float:left;
	padding:5px 10px 5px 10px;
	margin-top:5px;
	
}
/* Input Titles */
label {

	/* Set Font */
	font-size: 14px;
	font-family: "Trebuchet MS", Arial;
	
	/* Structure */
	text-align: left;
	float: left;
	margin:15px 0px 0px 0px;
}
/* Form Containter */
fieldset {
	
	/* Set Size and Position  - Default Center */
	margin:0px auto;
	/* 20px greater than .formBox */ width:410px;
	
	/* Border Option */
	border:none;
	
	/* Structure */
	padding:0 0px 20px 0px;
}
/* Positioning */
form {
	/* Position - Default Center */
	margin:0px auto;
}



/* ------------------------- Basic Photo Gallery ------------------------- */

#gallery {position:relative; width:750px;}
#thumbs {width:180px; float:right;}
#thumbs a {display:block; float:left; margin:0 0 5px 5px; width:50px; height:50px; border:1px solid #000;}
#thumbs a img {width:50px; height:50px; border:0;}
#thumbs a:hover {border-color:#ddd;}
#thumbs a:hover img {position:absolute; width:auto; height:auto; right:185px; top:0; border:1px solid #333;}



/* ------------------------- Standard Button Styles ------------------------- */
.buttons{
	font-size:13px;
}
.buttons a, .buttons button{
    display:block;

		/* Clear if not using multiple buttons in a row */
		clear:both;

    float:left;
    margin:10px 7px 0 0;
    background-color:#f5f5f5;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;
    font-family:"Tahoma", Arial, Verdana, sans-serif;
    font-size:100%;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    color:#565656;
    cursor:pointer;
    padding:5px 10px 6px 7px; /* Links */
}
.buttons button{
    width:auto;
    overflow:visible;
    padding:4px 10px 3px 7px; /* IE6 */
}
.buttons button[type]{
    padding:5px 10px 5px 7px; /* Firefox */
    line-height:17px; /* Safari */
}
.buttons button img, .buttons a img{
    margin:0 3px -3px 0 !important;
    padding:0;
    border:none;
    width:16px;
    height:16px;
}
/* STANDARD */
button:hover, .buttons a:hover{
    background-color:#dff4ff;
    border:1px solid #c2e1ef;
    color:#336699;
}
.buttons a:active{
    background-color:#6299c5;
    border:1px solid #6299c5;
    color:#fff;
}
/* POSITIVE */
button.positive, .buttons a.positive{
    color:#82c242;
}
.buttons a.positive:hover, button.positive:hover{
    background-color:#dafab9;
    border:1px solid #8fc955;
    color:#82c242;
}
.buttons a.positive:active{
    background-color:#82c242;
    border:1px solid #529214;
    color:#fff;
}
/* NEGATIVE */
.buttons a.negative, button.negative{
    color:#d12f19;
}
.buttons a.negative:hover, button.negative:hover{
    background:#fbe3e4;
    border:1px solid #fbc2c4;
    color:#d12f19;
}
.buttons a.negative:active{
    background-color:#d12f19;
    border:1px solid #d12f19;
    color:#fff;
}