/*----------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------
Neon Sky Creative Media :: LG CSS :: Slideshow
Version: 2.4.0
Last Modified: 2010.05.25

------------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------- */


/* slideshow for text sections - need to change size based on the orientation*/

/* used for non text pages , #slideshow */

#gallery{
	display: block;
	position: relative;
	z-index: 500;/* !important*/
	overflow: hidden;
	width: 100%;
	max-height: 100%;
	margin: 0 auto;
	
}

/* for testing on desktop
#slideshow{
	z-index: 50 !important;
	max-width: 550px;
	max-height: 450px;
}
*/

.gallery-images {
	display: block;
	overflow: hidden;
	position: relative;
	margin: 0 auto;
	padding: 0;

	/*
	min-width: 550px;
	min-height: 200px;

	z-index: inherit;
	-webkit-transition-property: width height;
	-webkit-transition-duration: .25s;
	-webkit-animation-timing-function: linear;
	-webkit-transform: translate(0px,0px);
	
	-moz-transition-property: width height;
	-moz-transition-duration: .25s;
	-moz-animation-timing-function: linear;
	-moz-transform: translate(0px,0px);
*/	
}




/* this is what controls the slide
may need a different for swiping slides -webkit-transform
in order to make the whole are swipble we make slide fill space
*/
.gallery-images div{
	display: block;
	position: absolute;
	top:0;
	left:0;
	height: 100%;
	width: 100%;
	-webkit-transition-property: opacity -webkit-transform;
  	-webkit-transition-duration: 0;
  	-webkit-animation-timing-function: linear;
  	-webkit-transform: translate(0px,0px); 
  	-webkit-transform-origin: translate(0px,0px);

	-moz-transition-property: opacity -webkit-transform;
  	-moz-transition-duration: 0;
  	-moz-animation-timing-function: linear;
  	-moz-transform: translate(0px,0px); 
  	-moz-transform-origin: translate(0px,0px);

  	opacity:1;
  	-webkit-touch-callout:none;
	-moz-touch-callout:none;
  	
	border: none;
  	/* background: red; 
  	z-index: inherit;*/
  	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
}
/*
this will be centered inside the slide
*/		
.gallery-images img.slideimage {
	display: -webkit-box;
	/* #position: relative; 
	z-index: 401 !important;*/
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	height: auto;
	width: auto;
	border: none;
	/* background-color: blue; */
}

.gallery-images div.slidePrep {
	-webkit-transition-duration: 0;
	-moz-transition-duration: 0;
	opacity: 0;
}

.gallery-images div.slideActive {
	-webkit-transition-property: opacity -webkit-transform;
	-moz-transition-property: opacity -moz-transform;
	/* -webkit-transition-duration: 0; */
	opacity: 1;
	/*display: -webkit-box;
	visibility: visible;
	 z-index:15; */
}

.gallery-images div.slideEnterImmediate {
	opacity: 1;	
	-webkit-transition-property: opacity -webkit-transform;
	-webkit-transition-duration: 0;
	-webkit-animation-timing-function: ease-in;
	
	-moz-transition-property: opacity -moz-transform;
	-moz-transition-duration: 0;
	-moz-animation-timing-function: ease-in;
	
	z-index:2;
}
	
.gallery-images div.slideEnter {
	opacity: 1;	
	-webkit-transition-property: opacity -webkit-transform;
	-webkit-transition-duration: 0.95s;
	-webkit-animation-timing-function: ease-in;
	
	-moz-transition-property: opacity -moz-transform;
	-moz-transition-duration: 0.95s;
	-moz-animation-timing-function: ease-in;
	
	z-index:2;
}

.gallery-images div.slideExit {
	opacity: 0;
	-webkit-transition-property: opacity -webkit-transform;
	-webkit-transition-duration: 0.75s;
	-webkit-animation-timing-function: ease-out;
	
	-moz-transition-property: opacity -webkit-transform;
	-moz-transition-duration: 0.75s;
	-moz-animation-timing-function: ease-out;
	
	z-index:5;
}
/*
classes for non css transition
*/

.gallery-images div.slideEnter-noncss {	
	z-index:2;
}

.gallery-images div.slideExit-noncss {
	z-index:5;
}