body 			{margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; font: normal 11px Verdana, sans-serif; color: #FFF; margin: 0px;
  background-color: #565656;
}
html			{height: 100%; font-size: 11px;}
A 			{ color: #c4c4c4; text-decoration: none;}
A:hover 		{ color: white; text-decoration: none;}
table			{ font-size: 11px };
.footer 		{text-align: center; }
.copyright 		{color: #999; font-weight: bold; margin: 0; padding: 10px; }
.layout			{border-width: 0px 1px 0px 1px; padding: 15px 10px 0px 10px; border-style: solid solid solid solid; border-color: #6c6c6c; width: 980px; margin-right: auto; margin-left: auto; background-color: black; color: white; font-size: 11px;}
.content		{ font-size: 11px; }

p#socialicons img{ /* 2nd set of icons. Rotate them 60deg onmouseover and out */
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}

p#socialicons img:hover{
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}

ul{
margin:0;
padding:0;
}

li{
display:inline;
list-type:none;
}

a.glidebutton{
display: inline-block;
position: relative;
color: #c4c4c4; /* default color */
background: black; /* default bg color */
text-decoration: none;
font: 17px Helvetica Neue; /* font settings */
letter-spacing: 2px; /* font settings */
overflow: hidden;
height: 30px; /* height of each button */

text-align: center;
border-radius: 3px; /* border radius */
box-shadow: 0 0 20px black inset;


}

a.glidebutton > span:first-child{ /* first span inside button */
position: relative;
display: block;
height: 100%;
padding: 5px; /* padding of button */
-moz-box-sizing: border-box;
box-sizing: border-box;

}

a.glidebutton > span:first-child:after{ /* CSS generated content */
content: attr(data-text); /* Duplicate text of span markup */
display: block;
width: 100%;
height: 100%;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: inherit;
position: absolute;
top:100%;
left:0;
}

a.glidebutton:hover{
color: white; /* color of button on hover */
background: black; /* bg color of button on hover */
box-shadow: 1px 1px 8px #585858 inset;
text-shadow: 2px 2px 2px #6c6c6c;

}

a.glidebutton:hover > span:first-child{

}

.productheading { 
display: inline-block;
position: relative;
color: white; /* default color */
background: rgba(50,50,50,.5); /* default bg color */
text-decoration: none;
font: 18px Helvetica Neue; /* font settings */
letter-spacing: 2px; /* font settings */
overflow: hidden;
text-align: top;
text-shadow: 0px 0px 0px #6c6c6c;
width: 100%;
border-radius: 2px;
}

.addtocart {
background: url(images/addtocart.jpg) no-repeat;
width:138px; 
height:22px;
}

.addtocart:hover {
background: url(images/addtocart-rollover.jpg) no-repeat;
}

.infoicons {
opacity: 1;
width:173px; 
height:75px;
}

.infoicons:hover {
opacity: 0.7;
}

.sema {
opacity: 1;
width:200px; 
height:106px;
margin-left: auto;
margin-right: auto;
}

.sema:hover {
opacity: 0.7;
}

.dealerbuy {
opacity: 1;
margin-left: 15px;
margin-bottom: -23px;
width:138px; 
height:54px;
border-style: solid;
border-width: 1px;
border-color: rgba(108,108,108,.4); 
border-radius: 2px;
}

.dealerbuy:hover {
opacity: 0.7;
}

.imagepluscontainer{ /* main image container */
position: relative;
z-index: 1;
}

.imagepluscontainer img{ /* CSS for image within container */
position: relative;
z-index: 2;
-moz-transition: all 0.5s ease; /* Enable CSS3 transition on all props */
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}

.imagepluscontainer:hover img{ /* CSS for image when mouse hovers over main container */
-moz-box-shadow: 5px 5px 5px rgba(50,50,50, 0.5);
-webkit-box-shadow: 5px 5px 5px rgba(50,50,50, 0.5);
box-shadow: 5px 5px 5px rgba(50,50,50, 0.5);
-moz-transform: scale(1.05, 1.05);
-webkit-transform: scale(1.05, 1.05);
-ms-transform: scale(1.05, 1.05);
-o-transform: scale(1.05, 1.05);
transform: scale(1.05, 1.05);
}

.imagepluscontainer div.desc{ /* CSS for desc div of each image. */
position: absolute;
width: 90%;
z-index: 1; /* Set z-index to that less than image's, so it's hidden beneath it */
bottom: 0; /* Default position of desc div is bottom of container, setting it up to slide down */
left: 7px;
padding: 8px;
background: rgba(50, 50, 50, 0.7); /* black bg with 80% opacity */
color: white;
-moz-border-radius: 0 0 8px 8px; /* CSS3 rounded borders */
-webkit-border-radius: 0 0 8px 8px;
border-radius: 0 0 8px 8px;
opacity: 0; /* Set initial opacity to 0 */
-moz-box-shadow: 0 0 0px rgba(0, 0, 0, 0.8); /* CSS3 shadows */
-webkit-box-shadow: 0 0 0px rgba(0, 0, 0, 0.8);
box-shadow: 0 0 0px rgba(0, 0, 0, 0.8);
-moz-transition: all 0.5s ease 0.5s; /* Enable CSS3 transition on desc div. Final 0.5s value is the delay before animation starts */
-webkit-transition: all 0.5s ease 0.5s;
-o-transition: all 0.5s ease 0.5s;
-ms-transition: all 0.5s ease 0.5s;
transition: all 0.5s ease 0.5s;
font: 14px Helvetica Neue;
font-weight: normal;
font-color: #6c6c6c;
}

.imagepluscontainer div.desc a{
color: #6c6c6c;
font: 14px Helvetica Neue;
font-weight: normal;
font-color: #6c6c6c;
}

.imagepluscontainer:hover div.desc{ /* CSS for desc div when mouse hovers over main container */
-moz-transform: translate(0, 100%);
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
transform: translate(0, 100%);
opacity:1; /* Reveal desc DIV fully */
font: 14px Helvetica Neue;
font-weight: normal;
font-color: #6c6c6c;
}

/*### Below CSS when applied to desc DIV slides the desc div from the right edge of the image ###*/

.imagepluscontainer div.rightslide{
width: 150px; /* reset from default */
top:15px;
right:0;
left:auto;  /* reset from default */
bottom:auto;  /* reset from default */
padding-left:15px;
-moz-border-radius: 0 8px 8px 0;
-webkit-border-radius: 0 8px 8px 0;
border-radius: 0 8px 8px 0;
}

.imagepluscontainer:hover div.rightslide{
-moz-transform: translate(100%, 0);
-webkit-transform: translate(100%, 0);
-ms-transform: translate(100%, 0);
-o-transform: translate(100%, 0);
transform: translate(100%, 0);
}

/*### Below CSS when applied to desc DIV slides the desc div from the left edge of the image ###*/

.imagepluscontainer div.leftslide{
width: 150px;  /* reset from default */
top:15px;
left:0;
bottom:auto;  /* reset from default */
padding-left:15px;
-moz-border-radius: 8px 0 0 8px;
-webkit-border-radius: 8px 0 0 8px;
border-radius: 8px 0 0 8px;
}

.imagepluscontainer:hover div.leftslide{
-moz-transform: translate(-100%, 0);
-webkit-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
-o-transform: translate(-100%, 0);
transform:translate(-100%, 0);
}

/*### Below CSS when applied to desc DIV slides the desc div from the top edge of the image ###*/

.imagepluscontainer div.upslide{
top:0;
bottom:auto;  /* reset from default */
padding-bottom:10px;
-moz-border-radius: 8px 8px 0 0;
-webkit-border-radius: 8px 8px 0 0;
border-radius: 8px 8px 0 0;
}

.imagepluscontainer:hover div.upslide{
-moz-transform: translate(0, -100%);
-webkit-transform: translate(0, -100%);
-ms-transform: translate(0, -100%);
-o-transform: translate(0, -100%);
transform:translate(0, -100%);
}

.aboutus { 
display: inline-block;
position: relative;
color: white; /* default color */
background-color: transparent; /* default bg color */
text-decoration: none;
font: 14px Helvetica Neue; /* font settings */
width: 920px;
text-align: justify;
letter-spacing: 1px;
}

.headermenu {
opacity: 1;
font: 16px Arial;
}

.headermenu:hover {
box-shadow: 1px 1px 8px #585858 inset;
border-radius: 2px;
}

.contactinfo {
font: 24px Helvetica Neue;

}