/*
 * Photon - swipe action slideshow
 * (c) 2014 CSSplay - Stu Nicholls
 *
 * http://www.cssplay.com/
 *
 */
html, body {width:100%, min-height:100%; padding:0; margin:0;}
.photoncontainer {width:100%; position:relative;}
.photoncontainer:before {display:block; content:""; width:10px; height:100%; position:absolute; left:0; top:0; background:#fff; z-index:200;}
.photoncontainer:after {display:block; content:""; width:10px; height:100%; position:absolute; right:0; top:0; background:#fff; z-index:200;}

.photon {position:absolute; left:0; top:0; width:100%; height:100%; overflow:hidden; display:block; background:#fff; z-index:100; visibility:hidden; opacity:0;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
-ms-touch-action: none;
}
.photon .slides {display:block; position:absolute; left:0; white-space:nowrap; width:100%; top:10px; bottom:30px; z-index:50; cursor:w-resize;
-webkit-transform: translate3d(0,0,0);
-moz-transform: translate3d(0,0,0);
-o-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
.photon .animate {
-webkit-transition: 0.4s ease-out;
-moz-transition: 0.4s ease-out;
-ms-transition: 0.4s ease-out;
-o-transition: 0.4s ease-out;
transition: 0.4s ease-out;
}
.photon .slides img {display:inline-block; vertical-align:top; height:100%; width:auto; padding:0 10px; background:#fff; opacity:0.4; filter: alpha(opacity=40);
-webkit-transition: opacity 0.4s ease-out;
-moz-transition: opacity 0.4s ease-out;
-ms-transition: opacity 0.4s ease-out;
-o-transition: opacity 0.4s ease-out;
transition: opacity 0.4s ease-out;
}
.photon .slides img.current {opacity:1.0; filter: alpha(opacity=100);}

.photon .caption {position:absolute; white-space:normal; bottom:0; left:0; right:0; margin:0; text-align:left; background: transparent; display:block; min-height:30px; z-index:200;}
.photon .caption p {margin:0; padding:5px 40px; font:400 11px/20px 'arial', sans-serif; color:#000; z-index:100;}
.photon .caption p a {color:#036; text-decoration:none;}
.photon .caption p a:before {content:"\0020"; color:#c00;}
.photon .caption p a:hover {color:#c00;}

.photon .leftArrow {display:none; position:absolute; top:50%; margin-top:-30px; z-index:200; width:32px; height:44px; cursor:pointer; background:url(arrows.png); background-position:left top;}
.photon .rightArrow {display:none; position:absolute; top:50%; margin-top:-30px; z-index:200; width:32px; height:44px; cursor:pointer; background:url(arrows.png); background-position:right top;}

.photon .leftCover {position:absolute; left:0; top:0; bottom:30px; width:25%; background:url(trans.gif); z-index:1000;}
.photon .rightCover {position:absolute; right:0; top:0; bottom:30px; width:25%; background:url(trans.gif); z-index:1000;}

.photon .dots {position:absolute; white-space:normal; top:3px; left:0; right:0; margin:0; padding:0; text-align:center; display:block; z-index:200;}
.photon .dots span {display:inline-block; width:8px; height:4px; padding:0; margin:0 4px; background:#aaa; vertical-align:top;}
.photon .dots span.select {background:#f00;}

.photon .thumbIcon {width:15px; height:15px; background:url(thumbs.png); position:absolute; left:10px; bottom:7px; z-index:1500; cursor:pointer;}
.photon .thumbImages {position:absolute; left:0; top:10px; right:0; height:0; background:#000; background: rgba(255,255,255,0.8); z-index:1200; overflow:hidden; text-align:center;}
.photon .thumbImages span {width:90px; height:120px; display:inline-block; vertical-align:middle; margin:5px;}
.photon .thumbImages span img {display:inline-block; vertical-align:top; opacity:0.8;}
.photon .thumbImages span img:hover {cursor:pointer; opacity:1;}
.photon .thumbImages span img.current {opacity:1;}

@media only screen and (max-device-width: 480px) {
.photon .slides img {opacity:1;}
.photon .leftCover {background:url(diagonal-light.png);}
.photon .rightCover {background:url(diagonal-light.png);}
}