/*   
Theme Name: Naturechem
Theme URI: http://www.naturechem.com
Description: an art company
Author: Steve Rampton
Author URI: www.naturechem.com
Template: b1naryg0d
Version: 1
.
All rights reserved.
.
----------------------------------
	GENERAL SELECTORS
----------------------------------*/

/* This sets all browser padding and margin defaults to zero */
* { margin: 0; padding: 0; } 

/* This is a fix for IE 6 & 7 spacing issues. I think. */
* html img { display: block; } 

/* This keeps images wrapped in an anchor tag from displaying a border. Maybe. */
a img { border: none; display: inline; margin: 0; padding: 0; }

/* this is a fix for IE/Mac, to keep the nav items from breaking. */
#menu li { /*\*/overflow: hidden;/**/ }

/*----------------------------------
	Sticky Footer calculations
----------------------------------*/

html, body, #wrap {height: 100%;}

body > #wrap {height: auto; min-height: 100%;}

#wrap, #footer {width: 950px; margin: 0 auto;}

#main {padding-bottom: 81px;}  /* must be same height as the footer */

#footer {position: relative;
	margin-top: -81px; /* negative value of footer height */
	height: 70px;
	clear: both;} 

/* CLEAR FIX*/
.clearfix:after {content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

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

#main {
	width: 975px;
	}
	
.left {
	float: left;
	width: 260px;
	padding-top: 30px;
	margin: 0 20px 0 0;
	z-index: 20;
	}
	
.content {
	float: right;
	width: 655px;
	padding-top: 30px;
	margin: 0 20px 0 20px;
	}	
	
.right	{
	float: right;
	width: 155px;
	padding-top: 30px;
	margin: 0 0 0 10px;
	}				
	
.left p {
	line-height: 150%;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 90%;
	color: #000000;
	widows: none;
	orphans: none;
	margin: 0 -10px 10px -10px;
	}	
	
	
/*----------------------------------
	Background images
----------------------------------*/

body{
	background: url(images/structure/contentbackground.jpg) repeat-y;
	margin: 0 auto;
	}
	
body{
	margin: 0;
	padding: 0;
	line-height: 1.5em;
	min-width: 950px;
	min-height: 100%;
	height: 100%;
	overflow-x: hidden;
	}

.top{
	background: url(images/structure/topbackground.jpg) repeat-x;
	width: 100%;
	height: 90px;
	margin: 0 auto -90px;
	}
	
#wrap	{	
	height: 100%;
	}
	
#metal-top{
	background:url(images/structure/lefttop.png) no-repeat;
	height: 75px;
	margin: 0 auto -75px;
	}			
	
#metal-bottom{
	background:url(images/structure/leftbottom.png) no-repeat;
	height: 130px;
	margin: -186px auto;
	}					

/*----------------------------------
	Font styles
----------------------------------*/

p{
	font-family: Helvetica, Arial, sans-serif;
	font-size: smaller;
	line-height: 150%;
	text-align: justify;
	widows: none;
	orphans: none;
	padding: 0 10px;
	}

h1{
	font-family: Helvetica, Arial, sans-serif;
	font-size: medium;
	line-height: 150%;
	text-align: justify;
	widows: none;
	orphans: none;
	}
	
.title {
	background: #C0B287;
	color: #FFFFFF;
	padding: 5px 10px;
	font-style: italic;
	font-weight: bolder;
	}	

ul{
	font-family: Helvetica, Arial, sans-serif;
	font-size: small;
	line-height: 150%;
	text-align: justify;
	widows: none;
	orphans: none;
	}

a{
	text-decoration: none;
	color: #669900;
	}

a:hover{
	text-decoration: underline;
	}

a:visited{
	color: #999999;
	text-decoration: none;
	}
	
span.subtitle {
	color: #e98d37;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: small;
	font-weight: bold;
	}
	
span.date {
	color: #5f27a6;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: x-small;
	font-weight: bold;
	}	
	
span.company	{
	font-weight: bold;
	}
	
span.new	{ 
	vertical-align: super;
	color: #FF9900;
	font-size: x-small;
	}
	
span.name	{
	font-style: oblique;
	}
	
/*----------------------------------
	Font styles
----------------------------------*/

dl {
	padding: 10px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: smaller;
	line-height: 150%;
	text-align: justify;
	widows: none;
	orphans: none;
	padding-bottom: 20px;
	}
	
dt {
	font-size: small;
	border-bottom: 1px solid gray;
	margin: 10px 0;
	padding: 5px 0;
	font-weight: normal;
	}	

.subtitle {
	font-variant: small-caps;
	font-weight: bold;
	color: #006600;
	}	

/*----------------------------------
	Contact button
----------------------------------*/

.formbutton	{
	border: none;
	padding: 5px 2px 5px 0px;
	background: none;
	}

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

#header	{
	margin-top: 0px;
	width: 975px;
	height: 70px;
	}
	
#menu	{
	width: 975px;
	height: 70px;
	background: url(images/structure/header.jpg);
	background-repeat: no-repeat;
	margin: 0 0 0 0;
	position: relative;
	}
	
#menu li	{
	margin: 0 0 0 0; 
	padding: 0 0 0 0; 
	list-style: none; 
	position: absolute; 
	top: 0px;
	}
	
#menu li, #menu a	{
	height: 70px;
	display: block;
	}
	
#home {left: 300px; width: 41px;}
#about {left: 385px; width: 45px;}
#products {left: 476px; width: 65px;}
#contact {left: 587px; width: 58px;}
#press {left: 690px; width: 40px;}
#distributors {left: 777px; width: 86px;}
#links {left: 908px; width: 40px;}

#home a:hover {background: transparent url(images/structure/header.jpg) -300px -70px;}
#about a:hover {background: transparent url(images/structure/header.jpg) -385px -70px;}
#products a:hover {background: transparent url(images/structure/header.jpg) -476px -70px;}
#contact a:hover {background: transparent url(images/structure/header.jpg) -587px -70px;}
#press a:hover {background: transparent url(images/structure/header.jpg) -690px -70px;}
#distributors a:hover {background: transparent url(images/structure/header.jpg) -777px -70px;}
#links a:hover {background: transparent url(images/structure/header.jpg) -908px -70px;}

#home a:active {background: transparent url(images/structure/header.jpg) -300px -70px;}
#about a:active {background: transparent url(images/structure/header.jpg) -385px -70px;}
#products a:active {background: transparent url(images/structure/header.jpg) -476px -70px;}
#contact a:active {background: transparent url(images/structure/header.jpg) -587px -70px;}
#press a:active {background: transparent url(images/structure/header.jpg) -690px -70px;}
#distributors a:active {background: transparent url(images/structure/header.jpg) -777px -70px;}
#links a:active {background: transparent url(images/structure/header.jpg) -908px -70px;}


/*----------------------------------
	Products menu
----------------------------------*/

#productmenu {
	width: 260px;
	background-image: url(images/structure/productback.jpg);
	}
	
#xasphalt {
	background-image: url(images/structure/asphaltmenu.jpg);
	height: 40px;
	cursor: pointer;
	}
#xconcrete {
	background-image: url(images/structure/concretemenu.jpg);
	height: 40px;
	cursor: pointer;
	}
#xheavyoil {
	background-image: url(images/structure/heavyoilmenu.jpg);
	height: 40px;
	cursor: pointer;
	}
#xdustcontrol {
	background-image: url(images/structure/dustcontrolmenu.jpg);
	height: 40px;
	cursor: pointer;
	}
#xdegreasers {
	background-image: url(images/structure/degreasersmenu.jpg);
	height: 40px;
	cursor: pointer;
	}
#xspecialized {
	background-image: url(images/structure/specializedmenu.jpg);
	height: 40px;
	cursor: pointer;
	}	
	
#xasphalt:hover {
	background: transparent url(images/structure/asphaltmenu.jpg) 0px -40px;
	}
#xconcrete:hover {
	background: transparent url(images/structure/concretemenu.jpg) 0px -40px;
	}
#xheavyoil:hover {
	background: transparent url(images/structure/heavyoilmenu.jpg) 0px -40px;
	}
#xdustcontrol:hover {
	background: transparent url(images/structure/dustcontrolmenu.jpg) 0px -40px;
	}
#xdegreasers:hover {
	background: transparent url(images/structure/degreasersmenu.jpg) 0px -40px;
	}
#xspecialized:hover {
	background: transparent url(images/structure/specializedmenu.jpg) 0px -40px;
	}

.childX {
	background-image: none;
	width: 260px;
	height: 81px;
	text-align:center;
	}

/*------------------*/
	
#xreplay {
	background-image: url(images/structure/replaythumb.jpg);
	height: 81px;
	}
#xactivate {
	background-image: url(images/structure/activatethumb.jpg);
	height: 81px;
	}
#xar3600 {
	background-image: url(images/structure/ar3600thumb.jpg);
	height: 81px;
	}
#xbr3600 {
	background-image: url(images/structure/br3600thumb.jpg);
	height: 81px;
	}
#xcr3600 {
	background-image: url(images/structure/cr3600thumb.jpg);
	height: 81px;
	}
	
#xreplay:hover {
	background: transparent url(images/structure/replaythumb.jpg) 0px -81px;
	}
#xactivate:hover {
	background: transparent url(images/structure/activatethumb.jpg) 0px -81px;
	}
#xar3600:hover {
	background: transparent url(images/structure/ar3600thumb.jpg) 0px -81px;
	}
#xbr3600:hover {
	background: transparent url(images/structure/br3600thumb.jpg) 0px -81px;
	}
#xcr3600:hover {
	background: transparent url(images/structure/cr3600thumb.jpg) 0px -81px;
	}
	
/*------------------*/

#xc-cure {
	background-image: url(images/structure/c-curethumb.jpg);
	height: 81px;
	}
#xc-patch {
	background-image: url(images/structure/c-patchthumb.jpg);
	height: 81px;
	}
	
#xc-cure:hover {
	background: transparent url(images/structure/c-curethumb.jpg) 0px -81px;
	}
#xc-patch:hover {
	background: transparent url(images/structure/c-patchthumb.jpg) 0px -81px;
	}
	
/*------------------*/	
	
#xar3600b {
	background-image: url(images/structure/ar3600thumb.jpg);
	height: 81px;
	}
	
#xar3600b:hover {
	background: transparent url(images/structure/ar3600thumb.jpg) 0px -81px;
	}
	
#xar-ot {
	background-image: url(images/structure/ar-otthumb.jpg);
	height: 81px;
	}
	
#xar-ot:hover {
	background: transparent url(images/structure/ar-otthumb.jpg) 0px -81px;
	}	
	
/*------------------*/	

#xvetrasept {
	background-image: url(images/structure/vetraseptthumb.jpg);
	height: 81px;
	}
	
#xvetrasept:hover {
	background: transparent url(images/structure/vetraseptthumb.jpg) 0px -81px;
	}	
	
/*----------------------------------
	Press menu
----------------------------------*/

#pressmenu {
	width: 260px;
	}
	
#xnewspapers {
	background-image: url(images/structure/newsmenu.jpg);
	height: 40px;
	cursor: pointer;
	}
	
#xtestimonials {
	background-image: url(images/structure/testimonialsmenu.jpg);
	height: 40px;
	cursor: pointer;
	}	
	
#xnewspapers:hover {
	background: transparent url(images/structure/newsmenu.jpg) 0px -40px;
	}
#xtestimonials:hover {
	background: transparent url(images/structure/testimonialsmenu.jpg) 0px -40px;
	}	
	
.childY {
	background-image: none;
	width: 260px;
	height: 81px;
	text-align:center;
	}
	

/*----------------------------------
	Products menu
----------------------------------*/
	
.thumbnails	{
	width: 655px;
	margin: 10px;
	}
	
.thumbnails	td {
	width: 200px;
	margin: 10px;
	}	

img.thumb	{
	width: 200px;
	height: 259px;
	border: solid 1px #999999;
	}

/*----------------------------------
	Footer
----------------------------------*/

#footer	{
	clear: both;
	background: #FFFFFF;
	padding-top: 10px;
	border-top: 1px solid #BBBBBB;
	}	
	
#footer li	{
	list-style: none;
	margin-left: 20px;
	margin-right: 20px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: x-small;
	text-align: justify;
	line-height: 150%;
	color: #000000; 
	}	
	
#footer a:link {
	text-decoration: none;
	font-variant: small-caps;
	font-weight: bolder;
	color: #000000;
	}
	
#footer a:visited {
	text-decoration: none;
	font-style: italic;
	font-variant: small-caps;
	color: #666666;
	}	
	
#footer a:hover	{
	text-decoration: underline;
	}
	
.text {	
	margin-left: 20px;
	margin-right: 20px;
	margin-top: 10px;
	margin-bottom: 10px;
	}
	
.lefttext {	
	margin-left: 20px;
	margin-right: 20px;
	margin-top: 10px;
	margin-bottom: 10px;
	color: #FFFFFF;
	font-style: italic;
	font-size: x-small;
	}	