.touchgallery{


position: relative;

float:left;

overflow: hidden;

width: 360px; 
margin:20px -50px 20px -25px;
border-radius:10px;


/* default gallery width */

height: 500px;
 /* default gallery height */
}



.touchgallery ul{
list-style: none;

margin: 0;

padding: 0;

left: 0;

position: relative;
float:left;
absolute;
-webkit-transform: translateX(0);

-moz-transform: translateX(0);
transform: translateX(0);

-moz-transition: all 700ms ease-in-out; /* image transition. 
Change 100ms to desired transition duration */
-webkit-transition: all 700ms ease-in-out;
transition: all 700ms ease-in-out;
}



.touchgallery ul li{
float: left;

		display: block;

		text-align: center;
		padding-bottom:15px;

		padding-top:0px;
		}

#touchgallery1 ul li img{ /* CSS for images within gallery */

max-width: 100%; /* make each image responsive, so its native width can occupy up to 100% of gallery's width, but not beyond */

height: 500px;
width:384px;
padding-bottom:0px;
padding-top:10px;


}






.touchgallery ul li img{ /* CSS for images within gallery */

max-width: 100%; /* make each image responsive, so its native width can occupy up to 100% of gallery's width, but not beyond */

height: 320px;
width:380px;
padding-bottom:0px;


}




.touchgallery .jumptodiv{ /* CSS for DIV that houses bullets that navigate to a specific image when clicked on */

text-align: center;
width: 100%;
background: #202127;
font-size: 1.3em;
font-weight: normal;
color: #afbbe5;
letter-spacing: 5px;
position:absolute;
bottom: 0;
padding-top:0px;
padding-bottom:3px;
margin-top: 5px;
margin-bottom:0px;
text-shadow: 0 1px 2px #8a8a8a;
}



.touchgallery .jumptodiv span.selected{ 

/* CSS for selected bullet inside jumptodiv */


color: #993939;


margin-bottom:10px;}