@charset "utf-8";
/* CSS Document */
body { 
	margin: 0px;
	padding: 0px;
background: rgba(255,255,255,1);
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(208,237,245,1) 41%, rgba(73,165,191,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(41%, rgba(208,237,245,1)), color-stop(100%, rgba(73,165,191,1)));
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(208,237,245,1) 41%, rgba(73,165,191,1) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(208,237,245,1) 41%, rgba(73,165,191,1) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(208,237,245,1) 41%, rgba(73,165,191,1) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(208,237,245,1) 41%, rgba(73,165,191,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#49a5bf', GradientType=0 );
background-attachment:fixed;
	height:auto;
}
#masterwaper {
	
	margin: 0px;
	padding: 0px;
	height: auto;
	width: 100%;
	
	background: rgba(255,255,255,1);
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(208,237,245,1) 41%, rgba(73,165,191,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(41%, rgba(208,237,245,1)), color-stop(100%, rgba(73,165,191,1)));
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(208,237,245,1) 41%, rgba(73,165,191,1) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(208,237,245,1) 41%, rgba(73,165,191,1) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(208,237,245,1) 41%, rgba(73,165,191,1) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(208,237,245,1) 41%, rgba(73,165,191,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#49a5bf', GradientType=0 );
background-repeat:repeat;
}
#mainwaper{
	padding:0;
	width:1024px;
	height:auto;
	margin-top: 0;
	margin:0 auto;
	background-color:#ffffff;
	}
#header{ margin:0; padding:0; width:1024px; height:134px; background:#FFFFFF;}
#clear
{height:3px;
clear:both;}

#headertop
{width:1024px;
height:5px;}

#logo{ margin-left:5px;
margin-top:15px;
 padding:0; 
 width:559px;
  height:95px;
  float:left;
  background-image:url(../images/logo1.jpg);
}

#call
{
margin-left:75px;
margin-top:10px;
 padding:0; 
 width:363px;
  height:134px;
  float:left;
  background-image:url(../images/callus.jpg);}

#nav{ margin-top:3px; padding:0; width:1024px; height:54px; background-image:url(../images/nav.jpg);
background-repeat:repeat;}



<style type="text/css">

div.topbar{ /* bar that runs across the top of the menu */
height:74px;
background:url(images/nav.jpg);
background-repeat:repeat;
}

ul.claybricks{ /* main menu UL */
font-weight: bold;
width: 100%;

padding: 25px 0 6px 0; /* padding of the 4 sides of the menu */
margin: 0;
text-align: left; /* set value to "left", "center", or "right" to align menu accordingly */
}

ul.claybricks li{
display: inline;
}

ul.claybricks li a{
color:white;
padding: 6px 8px 4px 8px; /* padding of the 4 sides of each menu link */
margin-right: 20px; /* spacing between each menu link */
text-decoration: none;
font-family:Arial, Helvetica, sans-serif;
}

ul.claybricks li a:hover, ul.claybricks li a.selected{
color: white;
background:#f7042c;
background: -moz-linear-gradient(top, #f7042c 0%, #1f7042c 12%, #1f7042c 100%); /* moz syntax for CSS3 gradient */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1f7042c), color-stop(12%,#41251b), color-stop(100%,#2c0f05));
background: -webkit-linear-gradient(top, #1f7042c 0%,#1f7042c 12%,#1f7042c 100%); /* webkit syntax for CSS3 gradient */
background: -o-linear-gradient(top, #1f7042c 0%,#1f7042c 12%,#1f7042c 100%); /* opera syntax for CSS3 gradient */
background: -ms-linear-gradient(top, #1f7042c 0%,#f7042c 12%,#f7042c 100%);
background: linear-gradient(top, #f7042c 0%,#f7042c 12%,#f7042c 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7042c', endColorstr='#2c0f05',GradientType=0 );
-moz-box-shadow: 0 0 5px #139eae; /* moz syntax for CSS3 box shadows */
-webkit-box-shadow: 0 0 5px #139eae;
box-shadow: 0 0 2px #139eae;
padding-top: 25px; /* large padding to get menu item to protrude upwards */
padding-bottom: 10px;
}

</style>



.baner{ margin:0; padding:0; width:970px; height:auto];}

#banner{ margin:0;
padding:0; 
width:1024px;
height:350px;
 background:#f1f1f1;}
 
 
 #aboutB
 { margin:0;
padding:0; 
width:1024px;
height:350px;
 background:#f1f1f1;
 background-image:url(../images/aboutus.jpg);}
 
 
 #contactimg
{margin:0;
padding:0; 
width:1024px;
height:350px;
 background:#f1f1f1;
 background-image:url(../images/contactus.jpg);}
 
 
 #Enimg
{margin:0;
padding:0; 
width:1024px;
height:350px;
 background:#f1f1f1;
 background-image:url(../images/Enquirey.jpg);}
 
 
 .inquriyt
{font-family:Verdana, Geneva, sans-serif;
font-size:14px;
color:#930;
}
 
 #pro1
{
	width:960px;
	height:300px;
	border:1px solid #09C;
	padding-top:15px;
	margin-left:15px;
}
#pro1hdr
{
	width: 283px;
	height:50px;
	padding-left:30px;
	-webkit-border-radius:50px;
	-moz-border-radius:50px;
	-ms-border-radius:50px;
	border:1px solid #09C;
	background-color: white;
	margin-left: 44px;
	margin-top: -41px;
}

.promain
{font-family:Verdana, Geneva, sans-serif;
font-size:18px;
color:#333;
padding-top:10px;}

.pro1p1
{font-family:Verdana, Geneva, sans-serif;
font-size:16px;
font-weight:500;
line-height:20px;
color:#09C;}
.pro1nm
{
	font-size: 20px;
text-decoration: none;
padding-top: 12px;
color: #301F0D;
text-align: left;}
#pro1img
{
	width:300px;
	height:250px;
	border: 5px solid #930;
padding-left: 0px;
margin-left: 27px;
margin-top: 14px;
-webkit-border-radius: 10px;
float:left;}
#pro1con
{
	width:600px;
	height:auto;
	float:right;
	width: 577px;
padding-top: 17px;
padding-right: 15px;
color: #000;
text-align:justify;}


#pro2
{width:960px;
	height: 378px;
	border:1px solid #09C;
	padding-top:15px;
	margin-top: 38px;
	margin-left:15px;}
#pro2hdr
{width: 333px;
	height:50px;
	padding-left:30px;
	-webkit-border-radius:50px;
	-moz-border-radius:50px;
	-ms-border-radius:50px;
	border:1px solid  #09C;
	background-color: white;
	margin-left: 535px;
	margin-top: -41px;}
.pro1nm,.pro2nm,.pro3nm,.pro4nm,.pro5nm
{
	font-size: 20px;
text-decoration: none;
padding-top: 12px;
color: #301F0D;
text-align: left;}
#pro2img
{
	width:300px;
	height:250px;
	border: 5px solid #930;
padding-left: 0px;
margin-right: 27px;
margin-top: 14px;
-webkit-border-radius: 10px;
float:right;}
#pro2con
{
	width:600px;
	height:auto;
	float:left;
	width: 577px;
padding-top: 17px;
padding-left: 15px;
color: #000;
text-align:justify;
}
 
 
 
 
 #prodcut
 { margin:0;
padding:0; 
width:1024px;
height:350px;
 background:#f1f1f1;
 background-image:url(../images/producta.jpg);}
 
 
 

.clear{ clear:both;}

#contant
{padding:0;
	width:1024px;
	height:auto;
	margin-top: 0;
	margin:0 auto;
	background-color:#ececec;}
	
	#contantwel
	{padding:0;
	width:1024px;
	height:630px;
	margin-top: 20;
	margin:0 auto;
	background-color:#FFF;}
	
	
	#contantwelh
	{padding:0;
	width:1024px;
	height:530px;
	margin-top:48px;
	margin:0 auto;
	background-color:#FFF;}
	
	
	#contantwell
	{padding:0;
	width:1024px;
	height:auto;
	margin-top: 20;
	margin:0 auto;		
/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #67AFEF 100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #67AFEF 100%);

/* Opera */ 
background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #67AFEF 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #FFFFFF), color-stop(1, #67AFEF));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #67AFEF 100%);

/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to top, #FFFFFF 0%, #67AFEF 100%);}
	
	#productmid
	{padding:0;
	width:1024px;
	height:auto;
	margin-top: 20;
	margin:0 auto;
	background-color:#ececec;}
	
	
	
	#VRCMAIN
	{padding:0;
	width:1024px;
	height:630px;
	margin-top: 20;
	margin:0 auto;
	background-color:#FFF;}
	
	
	#contanttext
	{ width:1024px;
	height:50px;
	background-color:#006699;
	}
	
	
	
	
	.contanttextL
	{font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-size:24px;
	color:#09C;
	padding-top:45px;
	font-weight:400;
	padding-left:10px;
	font-weight:800;
	
	}
	
	
	.contanttext
	{font-family:Arial, Helvetica, sans-serif;
	font-size:22px;
	color:#FFF;
	padding-top:10px;
	padding-left:10px;
	font-weight:400;
	background-color:#006699;
	}
	
	
	#contantT
	{ width:1024px;
	height:40px;
	background-color:#09C;
	
	}
	
	
	.contantT
	{font-family:Arial, Helvetica, sans-serif;
	font-size:24px;
	color:#FFF;
	padding-top:5px;
	padding-left:10px;
	font-weight:400;
	background-color:#09C;
	}
	
	
	#box
	{width:1024px;
	height:40px;
	color:#666666;
	padding-top:20px;
	background:#006699;
	}
	

	
	.sidbar
	{ width:1024px;
	height:17px;
	background-image:url(../images/sidbar.png);
	}
	
	#sider
	{width:1024px;
	height:30px;}
	
	#contantright
{width:1024px;
height:auto;
background-color:#FFF;}

#contantR
{width:650px;
height:auto;
background-color:#FFF;
float:left;
margin-top:10px;
margin-left:10px;
background: rgba(255,255,255,1);
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 47%, rgba(237,237,237,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(255,255,255,1)), color-stop(100%, rgba(237,237,237,1)));
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 47%, rgba(237,237,237,1) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 47%, rgba(237,237,237,1) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 47%, rgba(237,237,237,1) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 47%, rgba(237,237,237,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 );

}


#contantRA
{width:950px;
height:auto;
background-color:#FFF;
float:left;
margin-top:10px;
margin-left:10px;}


#contantPo
{width:1025px;
height:auto;
background-color:#ececec;
float:left;
}


#contProdcut
{width:1010px;
height:30px;
background-color:#0382b8;
float:left;
margin-top:10px;
}
.contprodcut
{font-family:Arial, Helvetica, sans-serif;
font-size:18px;
font-style:normal;
padding-top:15px;
padding-left:15px;
font-weight:900;
color:#ffffff;}



#contactdis
{width:1000px;
height:auto;
float:left;}

#contactdistri
{width:190px;
height:160px;
float:left;
margin-top:15px;
margin-left:15px;}

.contactdistri
{width:190px;
height:auto;
font-family:Arial, Helvetica, sans-serif;
color:#006699;
font-weight:300;
padding-left:10px;
padding-top:5px;
}




#contactIMG
{width:250px;
height:auto;
float:left;
margin-top:10px;}

#contactIMGR
{width:250px;
height:auto;
float:left;
margin-top:10px;}


.contR
{font-family:Arial, Helvetica, sans-serif;
font-size:15px;
color:#666666;
font-weight:300;
text-align:justify;
}

.abthead
{font-family:Verdana, Geneva, sans-serif;
color:#FFF;
font-size:18px;
padding-top:10px;
padding-left:10px;}

.h1
{font-family:Arial, Helvetica, sans-serif;
font-size:15px;
color:#003399;
font-weight:800;
padding-left:10px;}

#vrc

{width:880px;
height:auto;
background-color:#ececec;
float:left;}

#vrcL

{width:440px;
height:auto;
background-color:#ececec;
float:left;}

#vrcR

{width:430px;
height:auto;
margin-top:10px;
margin-left:10px;
background-color:#ececec;
float:left;}




#contact
{width:1024px;
height:auto;
background-color:#FFF;
float:left;
margin-top:10px;
}

#contacte
{width:1024px;
height:auto;
/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #67AFEF 100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #67AFEF 100%);

/* Opera */ 
background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #67AFEF 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #FFFFFF), color-stop(1, #67AFEF));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #67AFEF 100%);

/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to top, #FFFFFF 0%, #67AFEF 100%);
float:left;
margin-top:10px;
}


#enquiry
{width:1024px;
height:auto;
background-color:#FFF;
float:left;
margin-top:10px;
/* Note: This gradient may render differently in browsers that don't support the unprefixed gradient syntax */

/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(top right, #FFFFFF 0%, #67AFEF 100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top right, #FFFFFF 0%, #67AFEF 100%);

/* Opera */ 
background-image: -o-linear-gradient(top right, #FFFFFF 0%, #67AFEF 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, right top, left bottom, color-stop(0, #FFFFFF), color-stop(1, #67AFEF));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top right, #FFFFFF 0%, #67AFEF 100%);

/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to bottom left, #FFFFFF 0%, #67AFEF 100%);
}


#contactL
{width:500px;
height:auto;
/* Note: This gradient may render differently in browsers that don't support the unprefixed gradient syntax */

/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(top left, #FFFFFF 0%, #EFC9C9 100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top left, #FFFFFF 0%, #EFC9C9 100%);

/* Opera */ 
background-image: -o-linear-gradient(top left, #FFFFFF 0%, #EFC9C9 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #FFFFFF), color-stop(1, #EFC9C9));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top left, #FFFFFF 0%, #EFC9C9 100%);

/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to bottom right, #FFFFFF 0%, #EFC9C9 100%);
float:left;
border-radius: 15px 12px 109px 3px;
-moz-border-radius: 15px 12px 109px 3px;
-webkit-border-radius: 15px 12px 109px 3px;
border: 0px solid #000000;
-webkit-box-shadow: 1px -6px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px -6px 5px 0px rgba(0,0,0,0.75);
box-shadow: 1px -6px 5px 0px rgba(0,0,0,0.75);
margin-left:10px;
}


#contactR
{width:400px;
height:375px;
margin-left:50px;

float:left;
margin-top:10px;
background-image:url(../images/contact_us.jpg)
}

.h2
{font-family:Arial, Helvetica, sans-serif;
font-size:18px;
color:#333;
font-weight:500;
padding-left:10px;
line-height:20px;}

.h3
{font-family:Arial, Helvetica, sans-serif;
font-size:16px;
color:#FF0000;
font-weight:300;}




.contRA
{font-family:Arial, Helvetica, sans-serif;
font-size:15px;
color:#666666;
font-weight:300;
}


.contpro
{font-family:Arial, Helvetica, sans-serif;
font-size:15px;
color:#666666;
font-weight:300;
}



#button
{width:100px;
height:53px;
margin-left:480px;
float:left;}

#contantL
{width:274px;
height:auto;
background-color:#ececec;
float:left;
margin-top:0px;
margin-left:40px;
border:2px solid #0382b8;
}

#conbg
{width:264px;
height:30px;
background-color:#6b6b6b;
float:left;
margin-top:15px;
}
#product
{
height:260px;
margin-top:70px;
background-image:url(../images/product.jpg);}

#click
{width:275px;
height:30px;
background:#666
}



.link
{font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color:#09C;
font-weight:700;
padding-left:10px;
padding-top:10px;}


.link a:visited{font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color:#FFF;
font-weight:700;
text-decoration:none;}



.link a{font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color:#09F;
font-weight:700;
text-decoration:none;}

.link a:hover{font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color:#0CF;
font-weight:700;}

.links a{ color:#0382b8;
text-decoration:none;
}

.links a:hover{color:#FF0000;}

.contL
{font-family:Arial, Helvetica, sans-serif;
font-size:18px;
color:#ffffff;
font-weight:300;
padding-top:10px;
padding-left:10px;
}

#fotterbott
{width:1024px;
height:10px;}

#footer{ margin:o; padding:0; width:1024px; height:100px; background:#0382b8;
}

#footertop
{width:1024px;
height:100px;
float:left;}

#footerL
{width:650px;
height:auto;
float:left;
margin-top:20px;
margin-left:20px;
color:#FFFFFF;
}
.footerl
{color:#FFFFFF;
font-family:Arial, Helvetica, sans-serif;
font-weight:400;
text-decoration:none;}

.footerl a {text-decoration:none;
color:#FFFFFF;}

.footerl a:hover {text-decoration:none;
color:#FF0000;}

#footerr
{width:294px;
height:auto;
float:left;
margin-left:20px;
margin-top:20px;}


.footert
{width:274px;
height:auto;
float:left;

}

#footerrL
{width:80px;
height:30px;
float:left;
}

#footerLogo
{width:150px;
height:47px;
float:left;

background-image:url(../images/pinnaclelogo.jpg);
}





#footerP{ margin-left:200px;; padding:0; width:1024px; height:250px; background:#0382b8;
}

#footertop
{width:1024px;
height:100px;
float:left;}
#footerL
{width:650px;
height:auto;
float:left;
margin-top:20px;
margin-left:20px;
color:#FFFFFF;
}
.footerl
{color:#FFFFFF;
font-family:Arial, Helvetica, sans-serif;
font-weight:400;
text-decoration:none;}

.footerl a {text-decoration:none;}

#footerr
{width:294px;
height:auto;
float:left;
margin-left:20px;
margin-top:20px;}


.footert
{width:274px;
height:auto;
float:left;

}

#footerrL
{width:80px;
height:30px;
float:left;
}

#footerLogo
{width:150px;
height:47px;
float:left;

background-image:url(../images/pinnaclelogo.jpg);
}





.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(0, 0, 0, 0.5);
-webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
box-shadow: 5px 5px 5px rgba(0, 0, 0, 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: 5px;
padding: 8px;
background: rgba(0, 0, 0, 0.8); /* 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 6px rgba(0, 0, 0, 0.8); /* CSS3 shadows */
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
box-shadow: 0 0 6px 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;
}

.imagepluscontainer div.desc a{
color: white;
}

.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 */
}

/*### 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%);