/** START: EZC CSS **/
body { color: #ffffff; font-family: arial !important; }
.nav, .nav .title, a.nav, a.nav:visited, a.nav:active, a.nav:hover, .pageNav, a.down, a.down:active, a.down:hover, a.down:visited, .nav a.down { color: #ffffff !important; font-family: arial !important; }
.title, #userName.title, #userName .title, #userHome.title { font-family: arial !important; color: #A1A5A9 !important; }
.boxBottom a, .boxBottom a:hover, .boxBottom a:visited, .boxBottom a:active, #albumDescription a, #albumDescription a:hover, #albumDescription a:visited, #albumDescription a:active, #displayPhoto a, #displayPhoto a:hover, #displayPhoto a:visited, #displayPhoto a:active {color: #A1A5A9; font-family: arial !important; }
.description { color: #ffffff !important;font-family: arial !important; }
.foreground { color: #ffffff; font-family: arial !important; }
.updated { color: #ffffff !important; font-family: arial !important; }
.alert, a.alert { color: #ffffff; font-family: arial !important; }
#userName, #userHome { display: none; }
#homepage #breadcrumb { background-color: transparent !important; border: none; margin-bottom: 5px; }
/** END: EZC CSS **/

.albumNav_right {width: 400px;}

#homepage {
    margin: 0 auto;
    width: 1000px;
}

/* format bioBox */
#userBio {text-align: center; margin-top: -35px; margin-left: -8px; margin-bottom:-7px; margin-right: 3px; background-color:#1e1e1e;}
#bioBox .photo {display: none;}
#bioBox {background-color:#1e1e1e; width: auto !important;} 
#bioBox,
#bioBox .boxTop,
#bioBox .boxBottom,
#userBio {border-color: #1e1e1e !important;} 

#galleriesBox {background-color:#1e1e1e; border-color: #1e1e1e !important;}

#galleriesBox,
#galleriesBox .boxTop,
#galleriesBox .boxBottom{border-color: #1e1e1e !important;}

#bioText {display: none;}

.gallery_9876202 .nophotos h3 {display: none;}

textArea {width:300px;}

.gallery_11035065 .pageNav {
visibility:hidden;
}

.gallery_11035065 .play_slideshow
{display:none;}

.gallery_11046304 .pageNav {
visibility:hidden;
}

.gallery_11046304 .play_slideshow
{display:none;}

.gallery_10955149 .caption
{display:none;visibility:hidden;}

.gallery_10955149 .play_slideshow
{display:none;}

.notLoggedIn .nophotos {display: none;}

.journalNav_right {width: 400px;}


/* ==================================================== */
/* == FAQ #18, Line up boxes with titles underneath === */
/* ============== Current as of 13 Feb 07 ============= */
/* ==================================================== */

.miniBox {width:122px; text-align:center; height:210px; margin:0 36px;}
  .miniBox .photo {float:none; width:122px; height:auto; _height:1px;}
  .miniBox .albumTitle {width:122px;}
  .miniBox .description {width:122px;}
  .miniBox .updated {width:122px;}

.loggedIn .miniBox {height:auto; min-height:300px;}
  .loggedIn .miniBox .smbuttons {margin:0 auto; width:122px;}
  .loggedIn .miniBox input {width:122px;}
  .loggedIn .miniBox textarea {width:112px;}

.boxBottom .albumLarge {width:192px; height:350px; text-align:center; margin:0 24px;}
  .albumLarge .photoLarge {float:none; width:192px; height:auto; _height:1px;}
  .albumLarge .albumTitle {width:192px;}
  .albumLarge .description {width:192px;}
  .albumLarge .updated {width:192px;}

.loggedIn .boxBottom .albumLarge {height:auto; min-height:450px;}
  .loggedIn .albumLarge .smbuttons {margin:0 auto; width:192px;}
  .loggedIn .albumLarge input {width:192px;}
  .loggedIn .albumLarge textarea {width:182px;} 

.miniBox .albumTitle a.nav {
    font-size: 14px;
    font-weight: normal;
    padding-top: 5px;
    }

.boxBottom {padding-top:20px;}

.imgBorder
{-webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, .5);
-moz-box-shadow: 0px 3px 6px rgba(0, 0, 0, .5);
filter:progid:DXImageTransform.Microsoft.Shadow
(Color='000000', direction='135', strength='3');_filter: none;}

.headerMenuLink {color:#fff;}
.headerMenuItem a:visited{text-decoration:none;}
.headerMenuItemLast a:visited{text-decoration:none;}
.headerMenuItem a:link{text-decoration:none;}
.headerMenuItem a:hover{text-decoration:underline;}
.headerMenuItemLast a:link{text-decoration:none;}
.headerMenuItemLast a:hover{text-decoration:underline;}


.headerMenuItem {
  text-align:center; 
  vertical-align:middle; 
  font-weight:normal;
  white-space:nowrap;
  border-right: 1px solid #fff;
  padding-right:15px;
  padding-left:15px;
  font-size:14px;
}

.headerMenuItemLast {
  text-align:center; 
  vertical-align:middle; 
  font-weight:normal;
  white-space:nowrap;
  padding-right:30px;
  padding-left:15px;
  font-size:14px;
}

body {
background: #000 url(http://www.stevegphotography.com/photos/1234255316_LstrT-O.jpg) center fixed !important;
} 

body.homepage {

background-attachment: fixed;

background-image: url(http://www.stevegphotography.com/photos/1234255316_LstrT-O.jpg);

background-repeat: repeat;

background-position: center;

}




/*----------------------------------------------------------------------
 Start of JFriend HTML5 Slideshow CSS
 
 Copyright John Friend, 2011, All Rights Reserved
 Limited permission is granted to use this code on Smugmug
 Version 1.0.0
------------------------------------------------------------------------ */
/* File: ..\src\jftransitions.css (-o-, -moz-, -webkit- prefixes echoed)*/
/* special rule to differentiate Safari from Chrome  so we can tell who really supports 3d transforms*/
@media  (transform-3d),(-o-transform-3d),(-moz-transform-3d),(-ms-transform-3d),(-webkit-transform-3d) {#testQueryObj {height: 29px; width: 1px;}}

.slideshowContainerOuter.ssGecko2, .ssOpera .slideOuter {overflow: hidden;}	/* prevent scrollbar flash on some browsers */

/* unless we set the height in the code, we want each div to take on the full height of it's parent */
.slideshowContainer, .slideshowContainerOuter, .slideshowContainerInner {height: 100%;}

.slideshowContainerOuter {text-align: left;}		/* works around a bug in IE7 or IE8 in compatibility mode with absolute positioning */

.slideshowContainerInner {
	position: relative; 
	margin: 0 auto;
}

.slideshowContainer {margin: 0 auto;}

.slideOuter {
	position: relative; 
	
	/* items added to reduce flicker on Safari */
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-o-perspective: 1000;
	perspective: 1000;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
}

.slideShutter {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	overflow: visible;		/* gets overridden for some transitions to clip the image */
	z-index: 10;			/* required for IE filters on shutter to work properly */
	
	/* default values for all CSS transitions */
	-webkit-transition-property: none;
	-moz-transition-property: none;
	-o-transition-property: none;
	transition-property: none;
	-webkit-transition-duration: 2s;
	-moz-transition-duration: 2s;
	-o-transition-duration: 2s;
	transition-duration: 2s;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

.slideContainer {
	position: absolute; 	/* has to be absolute for modern browsers to stop margin collapsing */
	_position: relative;	/* has to be relative for IE6 because it won't let the filter transitions work otherwise */
	left: 0;				/* works around bug in IE7 that observes "text-align: center" when left is not specified */
	top: 0;
	z-index: 9;

/*	Remove these because they cause caption flicker in IE8 - standards mode
	-ms-filter: inherit;
	filter: inherit; */
	
	/* default values for all CSS transitions */
	-webkit-transition-property: none;
	-moz-transition-property: none;
	-o-transition-property: none;
	transition-property: none;
	-webkit-transition-duration: 2s;
	-moz-transition-duration: 2s;
	-o-transition-duration: 2s;
	transition-duration: 2s;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

/************************************************************************************************
** All caption text is in .slideCaption
** If the caption is on top of the photo, then there's a parent class .slideCaptionOverlay
** If the caption is above or below the photo, there there's a parent class .slideCaptionOutside
** Position is indicated with a parent class of:
**     .slideCaptionTop, .slideCaptionBottom, .slideCaptionAbove, .slideCaptionBelow
** 
** .slideLight is present when the background of the page is a light color (luminance < 0.5)
** .slideDark is present when the background of the page is a dark color (luminance >= 0.5)
** 
** .slideCaptionHolder is a wrapper class around .slideCaption that just helps us contain
** the caption to an exact height.  All borders, margins, padding, etc... must go on
** .slideCaption, not on .slideCaptionHolder
** 
*************************************************************************************************/

/* settings all caption locations (can be overridden below) */
.slideCaption {
	font-size: 16px;
	text-align: center;
	font-family: Arial, Tahoma, Trebuchet MS, Verdana, Geneva, sans-serif;
}

/* IE filters (which we use for transitions in IE) interact 
** poorly with ClearType fonts, so on IE, we use bitmap fonts 
** and we must be careful to choose a supported font size
** like 8,10,12,14,18,24  
*/
.ssIE .slideCaption {
	font-size: 14px;
	font-family: Verdana, MS Sans Serif, Tahoma, Trebuchet MS, Verdana, Geneva, Arial, sans-serif;
	font-weight: bold;
/*	zoom: 1;
	z-index: 9; */
}

.slideCaptionHolder {

}

.slideCaptionOverlay  .slideCaptionHolder {
	position: absolute;		/* has to be absolute to be on top of the image */
	left: 8.5%;
	width: 80%; 
	padding-left: 1.5%;
	padding-right: 1.5%;
	padding-top: 10px;
	padding-bottom: 10px;
	color: #FFF; 
	overflow: hidden;
	text-shadow: 1px 1px 1px #000; 
	-webkit-border-radius: 12px; 
	-moz-border-radius: 12px; 
	-o-border-radius: 12px; 
	border-radius: 12px; 
	
	background: transparent url(http://jfriend.smugmug.com/photos/1155231379_dvqbp-O.png) repeat;
	/* no transparent background in IE6 because it looks bad, can't use filters for PNG transparency 
	   because it interacts poorly with the filter based slide transitions */
	_background: none;

	zoom: 1;
	z-index: 8;
}

.slideCaptionOutside .slideCaptionHolder {
	width: 100%;
	height: 25px;
	margin: 0 auto;
	overflow: hidden;
	background-color: #CCC; 
}

.slideDark .slideCaptionOutside .slideCaptionHolder {
	background-color: #222; 
}
.slideCaptionOutside .slideCaption {
	padding: 3px 5px;
	white-space: nowrap;
	font-size: 12px;
}

.ssIE .slideCaptionOutside .slideCaption {
	padding: 3px 5px;
	font-size: 14px;
}

.slideCaptionTop  .slideCaptionHolder {
	top: 25px;
}

.slideCaptionBottom  .slideCaptionHolder {
	bottom: 25px;
}

.slideLight .slideCaptionOutside .slideCaption {
	color: #000;
}

.slideDark .slideCaptionOutside .slideCaption {
	color: #FFF;
}



.slideImageHolder {
	-ms-filter: inherit;
	filter: inherit;
	z-index: 8;
	position: relative;		/* added for superSize mode */
	/* when resizing, make the background scale to fit in newer browsers */
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
}

/* do not change this */
.slideImageHolderMeasure {
	line-height: 0;
	font-size: 0;
	position: static !important;
	overflow: hidden;				/* prevent collapsing margins during measurement */
	-ms-filter: none;				/* disable IE filters because they count in size measurements */
	filter: none;
	zoom: 1;
}

/* do not change this */
.slideImageOuterMeasure {
	line-height: 0;
	font-size: 0;
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}

.slideImage {
	display: block; 		/* no extra line-height */
	line-height: 0;
	font-size: 0;
	z-index: 7;				/* has to be below slideImageHolder for superSize mode */
}

.slideSplash {
	z-index:15;
}

.slideshowBusy {
	background: transparent url(http://cdn.smugmug.com/img/cart/ajax_busy.gif) no-repeat;
	height: 16px;
	width: 16px;
	visibility: hidden;
	z-index: 20;
	position: absolute;
}

.slideshowProtector {
	z-index: 11;		/* should be on top of everything */
	position: absolute;
	left: 0;
	right: 0;
}

/* ---------------------------------------------------------------------------------------------
  CSS3 transition for fading out the old image (only used if the new image is smaller
  in some dimension than the new image.
 ---------------------------------------------------------------------------------------------  */
.transitionOldCommon {
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-o-perspective: 1000;
	perspective: 1000;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-property: opacity;
	-moz-transition-property: opacity;
	-o-transition-property: opacity;
	transition-property: opacity;
	-webkit-transition-duration: 2s;
	-moz-transition-duration: 2s;
	-o-transition-duration: 2s;
	transition-duration: 2s;
	-webkit-transition-timing-function: cubic-bezier(0.8, 0.1, 1.0, 0.7);
	-moz-transition-timing-function: cubic-bezier(0.8, 0.1, 1.0, 0.7);
	-o-transition-timing-function: cubic-bezier(0.8, 0.1, 1.0, 0.7);
	transition-timing-function: cubic-bezier(0.8, 0.1, 1.0, 0.7);
}

.transitionOldStart {
	opacity: 1;
}

.transitionOldEnd {
	opacity: 0;
}

/* ---------------------------------------------------------------------------------------------
  Name = "Spin".
 ---------------------------------------------------------------------------------------------  */
/* nice rotating and translating transition */
.transitionSpinContainerCommon {
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-o-perspective: 1000;
	perspective: 1000;
	z-index: 10;
}

.transitionSpinCommon {
	-webkit-transition-property: -webkit-transform, -webkit-transform-origin;
	-moz-transition-property: -moz-transform, -moz-transform-origin;
	-o-transition-property: -o-transform, -o-transform-origin;
	transition-property: transform, transform-origin;
	-webkit-backface-visibility: visible;
	-moz-backface-visibility: visible;
	-o-backface-visibility: visible;
	backface-visibility: visible;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

.transitionSpinStart {
	-webkit-transform: scale(0) rotate(-180deg); 
	-moz-transform: scale(0) rotate(-180deg); 
	-o-transform: scale(0) rotate(-180deg); 
	transform: scale(0) rotate(-180deg); 
	-webkit-transform-origin: 50% 25%;
	-moz-transform-origin: 50% 25%;
	-o-transform-origin: 50% 25%;
	transform-origin: 50% 25%;
}

.transitionSpinEnd {
	-webkit-transform: scale(1) rotate(0deg);
	-moz-transform: scale(1) rotate(0deg);
	-o-transform: scale(1) rotate(0deg);
	transform: scale(1) rotate(0deg);
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	-o-transform-origin: 0 0;
	transform-origin: 0 0;
}

/* use 3d transitions when available */
.deviceTransform3d  .transitionSpinStart {
	-webkit-transform: scale(0) rotateY(-180deg); 
	-moz-transform: scale(0) rotateY(-180deg); 
	-o-transform: scale(0) rotateY(-180deg); 
	transform: scale(0) rotateY(-180deg); 
}

.deviceTransform3d .transitionSpinEnd {
	-webkit-transform: scale(1) rotateY(0deg);
	-moz-transform: scale(1) rotateY(0deg);
	-o-transform: scale(1) rotateY(0deg);
	transform: scale(1) rotateY(0deg);
}

/* ---------------------------------------------------------------------------------------------
  Name = "ExpandRight"
 ---------------------------------------------------------------------------------------------  */
.transitionExpandRightContainerCommon {
	z-index: 10;
}

.transitionExpandRightCommon {
	-webkit-transition-property: -webkit-transform, -webkit-transform-origin;
	-moz-transition-property: -moz-transform, -moz-transform-origin;
	-o-transition-property: -o-transform, -o-transform-origin;
	transition-property: transform, transform-origin;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

.transitionExpandRightStart {
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	transform: scale(0);
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	-o-transform-origin: 0 0;
	transform-origin: 0 0;
}

.transitionExpandRightEnd {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}

/* ---------------------------------------------------------------------------------------------
  Name = "Flip"
 ---------------------------------------------------------------------------------------------  */
.transitionFlipContainerCommon {
	-webkit-perspective: 500;
	-moz-perspective: 500;
	-o-perspective: 500;
	perspective: 500;
	z-index: 10;
}

.transitionFlipCommon {
	-webkit-transition-property: -webkit-transform, -webkit-transform-origin;
	-moz-transition-property: -moz-transform, -moz-transform-origin;
	-o-transition-property: -o-transform, -o-transform-origin;
	transition-property: transform, transform-origin;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

.transitionFlipStart {
	-webkit-transform: scaleX(0) scaleY(0.5) rotate(-90deg);
	-moz-transform: scaleX(0) scaleY(0.5) rotate(-90deg);
	-o-transform: scaleX(0) scaleY(0.5) rotate(-90deg);
	transform: scaleX(0) scaleY(0.5) rotate(-90deg);
}

.transitionFlipEnd {
	-webkit-transform: scaleX(1) scaleY(1) rotate(0deg);
	-moz-transform: scaleX(1) scaleY(1) rotate(0deg);
	-o-transform: scaleX(1) scaleY(1) rotate(0deg);
	transform: scaleX(1) scaleY(1) rotate(0deg);
}

.deviceTransform3d .transitionFlipStart {
	-webkit-transform: scaleX(0) scaleY(0.5) rotateY(-30deg);
	-moz-transform: scaleX(0) scaleY(0.5) rotateY(-30deg);
	-o-transform: scaleX(0) scaleY(0.5) rotateY(-30deg);
	transform: scaleX(0) scaleY(0.5) rotateY(-30deg);
}

.deviceTransform3d .transitionFlipEnd {
	-webkit-transform: scaleX(1) scaleY(1) rotateY(0deg);
	-moz-transform: scaleX(1) scaleY(1) rotateY(0deg);
	-o-transform: scaleX(1) scaleY(1) rotateY(0deg);
	transform: scaleX(1) scaleY(1) rotateY(0deg);
}


/* ---------------------------------------------------------------------------------------------
  CSS3 transition for the page flipping up from down below.
  
  Name = "Flip2"
 ---------------------------------------------------------------------------------------------  */
.transitionFlip2ContainerCommon {
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-o-perspective: 1000;
	perspective: 1000;
	z-index: 10;
}

.transitionFlip2Common {
	-webkit-transition-property: -webkit-transform, -webkit-transform-origin;
	-moz-transition-property: -moz-transform, -moz-transform-origin;
	-o-transition-property: -o-transform, -o-transform-origin;
	transition-property: transform, transform-origin;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-timing-function: cubic-bezier(0.1,0.1,.2,1);
	-moz-transition-timing-function: cubic-bezier(0.1,0.1,.2,1);
	-o-transition-timing-function: cubic-bezier(0.1,0.1,.2,1);
	transition-timing-function: cubic-bezier(0.1,0.1,.2,1);
}

.transitionFlip2Start {
	-webkit-transform: scaleX(0) rotate(180deg);
	-moz-transform: scaleX(0) rotate(180deg);
	-o-transform: scaleX(0) rotate(180deg);
	transform: scaleX(0) rotate(180deg);
	-webkit-transform-origin: 0 400%;
	-moz-transform-origin: 0 400%;
	-o-transform-origin: 0 400%;
	transform-origin: 0 400%;
}

.transitionFlip2End {
	-webkit-transform: scaleX(1) rotate(0deg);
	-moz-transform: scaleX(1) rotate(0deg);
	-o-transform: scaleX(1) rotate(0deg);
	transform: scaleX(1) rotate(0deg);
}

.deviceTransform3d .transitionFlip2Start {
	-webkit-transform: scaleX(0) rotateX(180deg);
	-moz-transform: scaleX(0) rotateX(180deg);
	-o-transform: scaleX(0) rotateX(180deg);
	transform: scaleX(0) rotateX(180deg);
}

.deviceTransform3d .transitionFlip2End {
	-webkit-transform: scaleX(1) rotateX(0deg);
	-moz-transform: scaleX(1) rotateX(0deg);
	-o-transform: scaleX(1) rotateX(0deg);
	transform: scaleX(1) rotateX(0deg);
}

/* ---------------------------------------------------------------------------------------------
  Name = "RotateGrow"
 ---------------------------------------------------------------------------------------------  */
.transitionRotateGrowContainerCommon {
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-o-perspective: 1000;
	perspective: 1000;
	z-index: 10;
	overflow: visible;
}

.transitionRotateGrowCommon {
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	transition-property: transform;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

/* non-3d rules */
.transitionRotateGrowStart {
	-webkit-transform: scale(0) rotate(270deg);
	-moz-transform: scale(0) rotate(270deg);
	-o-transform: scale(0) rotate(270deg);
	transform: scale(0) rotate(270deg);
}

/* non-3d rules */
.transitionRotateGrowEnd {
	-webkit-transform: scale(1) rotate(0deg);
	-moz-transform: scale(1) rotate(0deg);
	-o-transform: scale(1) rotate(0deg);
	transform: scale(1) rotate(0deg);
}

/* 3d (iDevice) specific rules */
.xdeviceTransform3d .transitionRotateGrowStart {
	-webkit-transform: scale3d(0,0,0) rotate3d(0,0,1,270deg);
	-moz-transform: scale3d(0,0,0) rotate3d(0,0,1,270deg);
	-o-transform: scale3d(0,0,0) rotate3d(0,0,1,270deg);
	transform: scale3d(0,0,0) rotate3d(0,0,1,270deg);
}


/* 3d (iDevice) specific rules */
.xdeviceTransform3d .transitionRotateGrowEnd {
	-webkit-transform: scale3d(1,1,0) rotate3d(0,0,1,0);
	-moz-transform: scale3d(1,1,0) rotate3d(0,0,1,0);
	-o-transform: scale3d(1,1,0) rotate3d(0,0,1,0);
	transform: scale3d(1,1,0) rotate3d(0,0,1,0);
}


/* ---------------------------------------------------------------------------------------------
  Name = "FlipReverse"
 ---------------------------------------------------------------------------------------------  */
.transitionFlipReverseContainerCommon {
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-o-perspective: 1000;
	perspective: 1000;
	z-index: 10;
	overflow: visible;
}

.transitionFlipReverseCommon {
	-webkit-transition-property: -webkit-transform, -webkit-transform-origin;
	-moz-transition-property: -moz-transform, -moz-transform-origin;
	-o-transition-property: -o-transform, -o-transform-origin;
	transition-property: transform, transform-origin;
	-webkit-backface-visibility: visible;
	-moz-backface-visibility: visible;
	-o-backface-visibility: visible;
	backface-visibility: visible;
	-webkit-transition-timing-function: cubic-bezier(0.1,0.1,.2,1), linear;  /* ease-out is (0, 0, 0.58, 1.0) */
	-moz-transition-timing-function: cubic-bezier(0.1,0.1,.2,1), linear;  /* ease-out is (0, 0, 0.58, 1.0) */
	-o-transition-timing-function: cubic-bezier(0.1,0.1,.2,1), linear;  /* ease-out is (0, 0, 0.58, 1.0) */
	transition-timing-function: cubic-bezier(0.1,0.1,.2,1), linear;  /* ease-out is (0, 0, 0.58, 1.0) */
}

.transitionFlipReverseStart {
	-webkit-transform: scaleX(0) rotate(270deg) skew(80deg);
	-moz-transform: scaleX(0) rotate(270deg) skew(80deg);
	-o-transform: scaleX(0) rotate(270deg) skew(80deg);
	transform: scaleX(0) rotate(270deg) skew(80deg);
	-webkit-transform-origin: 50% 30%;
	-moz-transform-origin: 50% 30%;
	-o-transform-origin: 50% 30%;
	transform-origin: 50% 30%;
}

.transitionFlipReverseEnd {
	-webkit-transform: scaleX(1) rotate(0deg) skew(0deg);
	-moz-transform: scaleX(1) rotate(0deg) skew(0deg);
	-o-transform: scaleX(1) rotate(0deg) skew(0deg);
	transform: scaleX(1) rotate(0deg) skew(0deg);
}

.deviceTransform3d .transitionFlipReverseStart {
	-webkit-transform: scaleX(0) rotateX(270deg) skew(80deg);
	-moz-transform: scaleX(0) rotateX(270deg) skew(80deg);
	-o-transform: scaleX(0) rotateX(270deg) skew(80deg);
	transform: scaleX(0) rotateX(270deg) skew(80deg);
	-webkit-transform-origin: 50% 30%;
	-moz-transform-origin: 50% 30%;
	-o-transform-origin: 50% 30%;
	transform-origin: 50% 30%;
}

.deviceTransform3d .transitionFlipReverseEnd {
	-webkit-transform: scaleX(1) rotateX(0deg) skew(0deg);
	-moz-transform: scaleX(1) rotateX(0deg) skew(0deg);
	-o-transform: scaleX(1) rotateX(0deg) skew(0deg);
	transform: scaleX(1) rotateX(0deg) skew(0deg);
}

/* ---------------------------------------------------------------------------------------------
  CSS3 transition for expanding down and to the right while scaling
  the image.
  Name = "SlideRight"
 ---------------------------------------------------------------------------------------------  */
.transitionSlideRightContainerCommon {
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-o-perspective: 1000;
	perspective: 1000;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	z-index: 10;
	overflow: hidden;
}

.transitionSlideRightCommon {
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	transition-property: transform;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

.transitionSlideRightStart {
	-webkit-transform: translate(-100%, 0) scale(0,.5);
	-moz-transform: translate(-100%, 0) scale(0,.5);
	-o-transform: translate(-100%, 0) scale(0,.5);
	transform: translate(-100%, 0) scale(0,.5);
}

.transitionSlideRightEnd {
	-webkit-transform: translate(0,0) scale(1);
	-moz-transform: translate(0,0) scale(1);
	-o-transform: translate(0,0) scale(1);
	transform: translate(0,0) scale(1);
}

/* ---------------------------------------------------------------------------------------------
  Name = "SlideLeft"
 ---------------------------------------------------------------------------------------------  */
.transitionSlideLeftContainerCommon {
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-o-perspective: 1000;
	perspective: 1000;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	z-index: 10;
	overflow: hidden;
}

.transitionSlideLeftCommon {
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	transition-property: transform;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

.transitionSlideLeftStart {
	-webkit-transform: translate(100%, 0) scale(0,.5);
	-moz-transform: translate(100%, 0) scale(0,.5);
	-o-transform: translate(100%, 0) scale(0,.5);
	transform: translate(100%, 0) scale(0,.5);
}

.transitionSlideLeftEnd {
	-webkit-transform: translate(0,0) scale(1);
	-moz-transform: translate(0,0) scale(1);
	-o-transform: translate(0,0) scale(1);
	transform: translate(0,0) scale(1);
}

/* ---------------------------------------------------------------------------------------------
  CSS3 transition for fading in  the image.
  Name = "Fade"
 ---------------------------------------------------------------------------------------------  */
.transitionFadeContainerCommon {
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-o-perspective: 1000;
	perspective: 1000;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	z-index: 10;
}

.transitionFadeCommon {
	-webkit-transition-property: opacity;
	-moz-transition-property: opacity;
	-o-transition-property: opacity;
	transition-property: opacity;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-timing-function: linear;
	-moz-transition-timing-function: linear;
	-o-transition-timing-function: linear;
	transition-timing-function: linear;
}

.transitionFadeStart {
	opacity: 0;
}

.transitionFadeEnd {
	opacity: 1;
}
/* ---------------------------------------------------------------------------------------------
  CSS3 transition for expanding down and to the right while scaling
  the image.
  Name = "Slit"
 ---------------------------------------------------------------------------------------------  */
.transitionSlitContainerCommon {
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-o-perspective: 1000;
	perspective: 1000;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	z-index: 10;
	overflow: hidden;
	-webkit-transition-property: width, border;
	-moz-transition-property: width, border;
	-o-transition-property: width, border;
	transition-property: width, border;
	-webkit-transition-duration: 2s;
	-moz-transition-duration: 2s;
	-o-transition-duration: 2s;
	transition-duration: 2s;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

.transitionSlitContainerStart {
	width: 0 !important;
}

.transitionSlitContainerEnd {
}

.transitionSlitCommon {
	-webkit-transition-property: none;
	-moz-transition-property: none;
	-o-transition-property: none;
	transition-property: none;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

.transitionSlitStart {
	-xwebkit-transform: translate(100%, 0) scale(0,.5);
}

.transitionSlitEnd {
	-xwebkit-transform: translate(0,0) scale(1);
}


/*----------------------------------------------------------------------
 End of JFriend HTML5 Slideshow CSS

 Copyright John Friend, 2011, All Rights Reserved
 Limited permission is granted to use this code on Smugmug
------------------------------------------------------------------------ */