/* Default CSS layout */
body {
	background-image: url("../images/logo-bg.jpg");
	background-repeat: repeat-x;
    margin : 0;
    padding : 0;
    text-align : center;
    font-family: Arial, Helvetica, sans-serif;
}

a img
{
	border: 0;
}

a, a:link, a:visited {
	text-decoration: none;
	color: #333333; 
	font-size:12pt; 
	font-weight: bold; 
	font-style:normal; 
}

a:hover {
	font-weight:bold;
	color: #FF0000;
}

h1 {	
	font: italic 40px Arial;
	font-weight: bold;
	
	/*color: #FF0000;*/
}

h2 {
	font: italic 30px Arial;
}
h3 {
    font: italic 20px Arial;
}
/* container formatting */
.main-container {
	width: 800px;
	margin: 0px auto 0px auto;
}

.header {
	margin: 5px 0px 15px 0px; 
}

.content-container {
	position: relative;
	float: right;
	width: 570px;
	text-align: left;
}

.menu-container {
	float: left;
	width: 200px; 
	text-align: center;
}



/* Glossy Menu formatting */
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
.glossymenu{
text-align: center;
list-style-type: none;
margin: 5px 0;
padding: 0;
width: 184px;
border: 1px solid #9A9A9A;
border-bottom-width: 0;
}
.glossymenu li a{
background: white url(../images/glossyback.gif) repeat-x bottom left;
font: bold 13px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: white;
display: block;
width: auto;
padding: 3px 0;
padding-left: 10px;
text-decoration: none;

}
* html .glossymenu li a{ /*IE only. Actual menu width minus left padding of A element (10px) */
width: 174px;
}
.glossymenu li a:visited, .glossymenu li a:active{
color: white;
}
.glossymenu li a:hover{
background-image: url(../images/glossyback2.gif);
}

.glossymenu li.current a 
{
	background-image: url(../images/glossyback2.gif);
}


/* drop shadow */
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
.shiftcontainer{
position: relative;
left: 5px; /*Number should match -left shadow depth below*/
top: 5px; /*Number should match -top shadow depth below*/
}
.shadowcontainer{
width: 200px; /* container width*/
background-color: #d1cfd0;
}
.shadowcontainer .innerdiv{
/* Add container height here if desired */
background-color: white;
border: 1px solid gray;
padding: 6px;
position: relative;
left: -5px; /*shadow depth*/
top: -5px; /*shadow depth*/
}


/* LINK TRAIL */
.shiftcontainer2{
position: relative;
left: 5px; /*Number should match -left shadow depth below*/
top: 5px; /*Number should match -top shadow depth below*/
}
.shadowcontainer2{
width: 100%; /* container width*/
background-color: #d1cfd0;
}
.shadowcontainer2 .innerdiv2{
/* Add container height here if desired */
color: white;
border: 1px solid gray;
padding: 6px;
position: relative;
left: -5px; /*shadow depth*/
top: -5px; /*shadow depth*/
}
.innerdiv2{
	background: white url(../images/glossyback2-alt.gif) repeat-x bottom left;
	font-size: 12px;
    font-family: sans-serif;
    font-weight: bold;
    font-style: italic;
}
.innerdiv2 a {
	color: white;
	font-size: 12px;
    font-family: sans-serif;
    font-weight: bold;
    font-style: italic;
}
.innerdiv2 a:hover {
	color: #CCCCCC;
	font-weight: bold;
	font-style: italic;
}


/* alternative menu formatting */
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
.markermenu{
width: 170px; /*width of menu*/
}
.markermenu ul{
list-style-type: none;
margin: 5px 0;
padding: 0;
border: 1px solid #9A9A9A;
}
.markermenu ul li a{
/*background: white url(../images/arrow-list.gif) no-repeat 2px center;*/
background: white url(../images/ruby.png) no-repeat 2px center;
font: bold 13px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: #000000;
display: block;
width: auto;
padding: 3px 0;
padding-left: 23px;
text-decoration: none;
border-bottom: 1px solid #B5B5B5;
}
* html .markermenu ul li a{ /*IE only. Actual menu width minus left padding of LINK (20px) */
width: 150px;
}
.markermenu ul li a:visited, .markermenu ul li a:active{
color: #000000;
}
.markermenu ul li a:hover{
color: black;
background-color: #ffddcb;
/*background-image:url(../images/arrow-list-red.gif); */ /*onMouseover image change. Remove if none*/
}

/* more neat buttons */
/* thanks to http://particletree.com/features/rediscovering-the-button-element/*/
.buttons a, .buttons button{
    display:block;
    float:left;
    margin:0 7px 0 0;
    background-color:#f5f5f5;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;

    font-family:"Lucida Grande", 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 */
}
*:first-child+html button[type]{
    padding:4px 10px 3px 7px; /* IE7 */
}
.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:#529214;
}
.buttons a.positive:hover, button.positive:hover{
    background-color:#E6EFC2;
    border:1px solid #C6D880;
    color:#529214;
}
.buttons a.positive:active{
    background-color:#529214;
    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;
}


.admin-view {
	margin: 0px 30px 0px 30px;
	padding: 5px 3px 0px 3px;
}

.admin-view td {
	margin: 0px 30px 0px 30px;
	padding: 5px 15px 0px 5px;
}

/* admin page formatting */
.update-table {
	width: 100%;
    background-color: #FFFFFF;  
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    border: 2px groove #000000;
}
.delete-box {
    padding: 0px 0px 2px 15px;
    font-size: 12px;
}
/* Our Products page formatting */
.view {
    width: 100%;
    text-align: center;
    background-color: #FFFFFF;
    border: 1px solid #000000;
}

.view-category {
    width: 100%;
    text-align: left;
    background-color: #FFFFFF;
    border-top: 1px solid #000000;  
    border-bottom: 1px solid #000000;
}
.view-category td {
	width: 50%;
    margin: 0px 0px 0px 0px;
    padding: 0px 30px 5px 0px;
}


/* admin page formatting */
.view-all {
	width: 100%;
	background-color: #FFFFFF;	
}

.view-all-row {
    border-top: 1px dotted #000000;	
}

/* view column formatting for admin page */
.view-col {
    background-color: #99ccff;	
    text-align: center;
}

.edit-col {
	text-align: center;
}

.delete-col {
	background-color: #ff6666;
	text-align: center;
}


a img.icon {
    border:none;
}

.alpha {
	display: block;
	text-align: center;
	border: 1px solid #000033;
	background: white url(../images/glossyback2-alt.gif) repeat-x bottom left;
}

.alpha a {
    font-weight: bold;
    font-style: italic;
    color: white;	
    font-size: 24px;
}

.alpha a:hover {
    font-weight: bold;
    font-style: italic;
    color: #CCCCCC;
    font-size: 24px;
}

/* clear float formatting */
.clear {
	clear: both;
}

.footer, .footer a {
	margin: 20px 0px 0px 0px;
	text-align: center;
	font-size: 10px;	
}


.msds-group td
{
	width: 284px;
}

.product-table
{
	width: 100%;
	background-color: #ffffff;
}

.product-table-row_2
{
	background-color: #CCCCCC;
}

.product-table-row_short_description
{
	font-size: 12px;
	width: 66%;
}

.new-txt
{
	text-transform: uppercase;
	color: red;
	font-weight: bold;
}

.bold-txt
{
	font-weight: bold;
}

.about-img
{
	float: right;
	margin: 0px 0px 6px 20px;
	width: 50%;
}

.right-img
{
	float: right;
	margin: 0px 0px 6px 20px;
}

.left-img
{
	float: left;
	margin: 0px 20px 6px 0px;
}


#about-box
{
	width: 100%;
}

.fancy-box
{
	background-image: url(../images/boxgradient.gif);
	background-repeat: repeat-x;
	float: left;
	margin: 0px 20px 6px 0px;
	padding: 5px 5px 5px 25px;
	border: 1px solid #7da2ec;
	background-color: #e5ecfc;
}

#material-box
{
	float: right;
	width:40%;
}

#price-table
{
	width: 100%;
}

#other-links p
{
	margin: 0.5em 0 -0.5em 0;
	padding: 1em 0 0 0;
}
#other-links ul 
{
	list-style: none;
	margin: 0;
	padding: 1em 0px 0px 0px;
}
#other-links li
{
	display: inline;	
}
#other-links a:link, #other-links a:visited
{
	margin-right: 0.2em;
	padding: 0.2em 0.6em 0.2em 0.6em;
	color: #0033cc;
	background-color: #EFEFEF;
	text-decoration: none;
	border-top: 1px solid #FFFFFF;
	border-left: 1px solid #FFFFFF;
	border-bottom: 1px solid #717171;
	border-right: 1px solid #717171;
	-moz-border-radius: 6px;
}
#other-links a:hover
{
	border-top: 1px solid #717171;
	border-left: 1px solid #717171;
	border-bottom: 1px solid #FFFFFF;
	border-right: 1px solid #FFFFFF;
}

#mim_img
{
	margin: 20px 0px 0px 0px;	
}

