@charset "utf-8";
/* CSS Document */

body {
	margin: 0 auto;
	overflow: hidden;
		
}

	.main-3d {
		position:absolute;
		margin: 0 auto;
		width: 100%;
		overflow: hidden;	
		z-index: 40;
		background-color: #fff;
		-webkit-tap-highlight-color:transparent;
	}

		.plane { 	/*initial images containers*/
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			margin: 0 auto;
			overflow: hidden;
			visibility:hidden;
		}
	
		/***Photos containers BEGIN***/
		div.container {
			position:absolute;
			top:50px;
			left:50px;
			
			-moz-transform-origin: center center;
			-ms-transform-origin: center center;
			-o-transform-origin: center center;
			-webkit-transform-origin: (50, 50);
			
			-webkit-user-select: none;
			-khtml-user-select: none;
			-moz-user-select: none;
			-o-user-select: none;
			user-select: none;
		}
		
		.container-1 {
			z-index: 3;
		}
		
		.container-2 {
			z-index: 6;
		}
		
		.container-3 {
			z-index: 9;
		}
		.container-4 {
			z-index: 12;
		}
		.container-5 {
			z-index: 15;
		}
		.container-6 {
			z-index: 18;
		}
		.container-7 {
			z-index: 21;
		}
		.container-8 {
			z-index: 24;
		}

		.slide-me .container {
			-moz-transition-property: left, top !important;
			-ms-transition-property: left, top !important;
			-o-transition-property: left, top !important;
			-webkit-transition-property: left, top !important;
			
			-moz-transition-duration: 0ms !important;
			-ms-transition-duration: 0ms !important;
			-o-transition-duration: 0ms !important;
			-webkit-transition-duration: 0ms !important;
		}
		
		.scale-me .container {
			-moz-transition-property: -moz-transform, opacity;
			-ms-transition-property: -ms-transform, opacity;
			-o-transition-property: -o-transform, opacity;
			-webkit-transition-property: -webkit-transform, opacity;
			
			-moz-transition-duration: 300ms 1000ms;
			-ms-transition-duration: 300ms 1000ms;
			-o-transition-duration: 300ms 1000ms;
			-webkit-transition-duration: 300ms 1000ms;
		}
		
		.useJS.scale-me .container {
			-moz-transition-property: opacity;
			-ms-transition-property: opacity;
			-o-transition-property: opacity;
			-webkit-transition-property: opacity;
			
			-moz-transition-duration: 1000ms;
			-ms-transition-duration: 1000ms;
			-o-transition-duration: 1000ms;
			-webkit-transition-duration: 1000ms;
		}
		
		.useJS .container-1, .useJS .container-2, .useJS .container-3, .useJS .container-4, .useJS .container-5, .useJS .container-6, .useJS .container-7, .useJS .container-8 {
			-moz-transform: none;
			-webkit-transform: none;
			-o-transform: none;
		}

		/***Photos containers END***/
			
		/***Photos BEGIN***/	
			.photo {
				position:absolute;
				padding: 0;
				margin: 0;
			}
		
				.photo:hover {
					cursor: pointer;
				}
	
				div.lightbox .container .photo:hover {
					cursor: default;
				}
			
			.useJS .container .photo.show {
				-moz-transform: none;
				-webkit-transform: none;
				-o-transform: none;
			}
			
			.photo.show {
				max-height:100%;
				-moz-transform-property: scale;
			}
			.photo.top-slice {
				z-index: 999;
				cursor: default;
				-moz-transition-property: left, top !important;
				-ms-transition-property: left, top  !important;
				-o-transition-property: left, top !important;
				-webkit-transition-property: left, top !important;
			
				-moz-transition-duration: 400ms;
				-ms-transition-duration: 400ms;
				-o-transition-duration: 400ms;
				-webkit-transition-duration: 400ms;
				
				-moz-transition-delay: 0 !important;
				-ms-transition-delay: 0 !important;
				-o-transition-delay: 0 !important;
				-webkit-transition-delay: 0 !important;
			}
		/***Photos END***/	
		
		/***Rollover BEGIN***/
			canvas.corners {
				display: none; /*required for chrome*/
				position:absolute;
				cursor: pointer;
				opacity:0;
				
				-moz-transition-property: opacity;
				-ms-transition-property: opacity;
				-o-transition-property: opacity;
				-webkit-transition-property: opacity;
			
				-moz-transition-duration: 450ms;
				-ms-transition-duration: 450ms;
				-o-transition-duration: 450ms;
				-webkit-transition-duration: 450ms;
			}
			
			canvas.corners:hover {
				opacity:0.7;	
			}
			
			.container:hover canvas.corners {
				display: block; /*required for chrome*/ 
			}
	
			div.lightbox .container .corners, .scale-me .container span {
				display: none !important;
			}
			
			.container span { /*spans for IE*/
				position: absolute;
				width: 27px;
				height: 27px;
				border: #fff solid;
				z-index:9999;
				opacity: 0;
				filter:alpha(opacity=0);
			}
		
			div.lightbox .container span {
				opacity: 0 !important;
			}
			
			span.top-l {
				top: 0;
				left: 0;
				border-width: 3px 0 0 3px;
				margin: -3px 0 0 -3px; 
			}
		
			span.top-r {
				top: 0;
				right: 0;
				border-width: 3px 3px 0 0;
				margin: -3px -3px 0 0; 
			}
		
			span.bottom-r {
				bottom: 0;
				right: 0;
				border-width: 0 3px 3px 0;
				margin: 0 -3px -3px 0; 
			}
		
			span.bottom-l {
				bottom: 0;
				left: 0;
				border-width: 0 0 3px 3px;
				margin: 0 0 -3px -3px; 
			}
		/***Rollover END***/
	
			.toBG{ /*for image click detection*/
				z-index: 1 !important;
				-moz-transition-duration: 0ms 0ms !important;
				-ms-transition-duration: 0ms 0ms !important;
				-o-transition-duration: 0ms 0ms !important;
				-webkit-transition-duration: 0ms 0ms !important;
			}
			
			
		/***Dark overlay BEGIN***/	
		.dark-layer {
			position:absolute;
			visibility: hidden;
			left: 0;
			top: 0;
			background-color:#000000;
			opacity: 0;
		}
		
		.dark-layer.l1 {
			opacity: 0.5;
			filter:alpha(opacity=50);
			z-index: 4;
			height:100%;
			width:100%;
			visibility: visible;
		}
		
		.dark-layer.l2 {
			opacity: 0.4;
			filter:alpha(opacity=40);
			z-index: 7;
			height:100%;
			width:100%;
			visibility: visible;
		}
		
			.container .l3 {
				visibility: visible;
				opacity: 0.9;
				filter: alpha(opacity=90);
				z-index: 998;
				
				-moz-transform-origin: center center;
				-ms-transform-origin: center center;
				-o-transform-origin: center center;
				-webkit-transform-origin: (50, 50);
			
				-moz-transition-property: opacity;
				-ms-transition-property: opacity;
				-o-transition-property: opacity;
				-webkit-transition-property: opacity;
				
				-moz-transition-duration: 400ms;
				-ms-transition-duration: 400ms;
				-o-transition-duration: 400ms;
				-webkit-transition-duration: 400ms;
			}
			
			.useJS .container .l3 {
				-moz-transform: none;
				-webkit-transform: none;
				-o-transform: none;
				
				-moz-transition: opacity;
				-ms-transition: opacity;
				-o-transition: opacity;
				-webkit-transition: opacity;
			}
		/***Dark overlay END***/	
		
		
		/***Close button BEGIN***/
		.close {
			position: relative;
			width: 30px;
			height: 30px;
			/*background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%09%20width=%22512px%22%20height=%22512px%22%20viewBox=%220%200%20512%20512%22%20enable-background=%22new%200%200%20512%20512%22%20xml:space=%22preserve%22%3E%3Cpath%20fill=%22white%22%20d=%22M462,256c0,113.771-92.229,206-206,206S50,369.771,50,256S142.229,50,256,50S462,142.229,462,256z%09%20M422,256c0-91.755-74.258-166-166-166c-91.755,0-166,74.259-166,166c0,91.755,74.258,166,166,166C347.755,422,422,347.741,422,256z%09%20M325.329,362.49l-67.327-67.324l-67.329,67.332l-36.164-36.186l67.314-67.322l-67.321-67.317l36.185-36.164l67.31,67.301%09l67.3-67.309l36.193,36.17l-67.312,67.315l67.32,67.31L325.329,362.49z%22/%3E%3C/svg%3E");*/
			
			background-size: 30px 30px;
			
			/*background:url(img/close2.png) no-repeat left top\9; background-color:#F00;*/
			background-image:url(img/close2.png);background-color:#fff;
			width:20px\9;
			height:20px\9;
			background-size: 20px 20px\8;
			
			background-repeat: no-repeat;
			background-position: center center;
			cursor: pointer;
			opacity: 0;
			filter:alpha(opacity=0);
			z-index: 1;
		}
		
		:root .close {
			width:30px\0/IE9;
			height:30px\0/IE9;
		}
		
		.lightbox .close {
			z-index:10;
			padding:0;
			margin:0 auto;
			cursor: pointer;
			opacity: 0.9; 
			filter:alpha(opacity=90);
			
			-moz-transition-property: opacity;
			-ms-transition-property: opacity;
			-o-transition-property: opacity;
			-webkit-transition-property: opacity;
			
			-moz-transition-delay:1000ms;
			-ms-transition-delay: 1000ms;
			-o-transition-delay: 1000ms;
			-webkit-transition-delay: 1000ms;
		}
		
		.lightbox .close:hover {
			opacity: 1;
			filter:alpha(opacity=100);
		}
		
		.lightbox .close.hovered {
			-moz-transition-delay:0ms;
			-ms-transition-delay: 0ms;
			-o-transition-delay: 0ms;
			-webkit-transition-delay: 0ms;
		}
		
		
		.lightbox.useJS .close {
			display: none;
			-moz-transition: none;
			-ms-transition: none;
			-o-transition: none;
			-webkit-transition: none;
		}
		/***Close button END***/
		
		/***Caption BEGIN***/
		.img-caption {
			position: absolute;
			height: 30px;
			width: 100%;
			margin: 0 auto;
			margin-top: 10px;
			padding:0 0 0 0;
			z-index:-10;
			opacity: 0;
			filter:alpha(opacity=0);
			
		}
			.img-caption p {
				margin: 0 auto;
				padding:0 10px 0 10px;
				color: #ffffff;
				font-family: Arial, Helvetica, sans-serif;
				font-size: 14px;
				line-height: 22px;
				text-align: center;
			}
				.img-caption a {
					color: #858585;
				}
				.img-caption a:hover {
					text-decoration: none;
				}
		
		div.lightbox .img-caption {
			opacity: 1; 
			z-index:10;
			filter:alpha(opacity=100);	
			-moz-transition-property: opacity;
			-ms-transition-property: opacity;
			-o-transition-property: opacity;
			-webkit-transition-property: opacity;
	
			-moz-transition-delay:1000ms;
			-ms-transition-delay: 1000ms;
			-o-transition-delay: 1000ms;
			-webkit-transition-delay: 1000ms;
		}
		
		div.lightbox.useJS .img-caption {
			display: none;
			-moz-transition: none;
			-ms-transition: none;
			-o-transition: none;
			-webkit-transition: none;
		}
		
			div.slide-me.lightbox .img-caption { /*warning message position (when there are no images in the slider)*/
				top: 45%;			
			}
		/***Caption END***/
		
		/***Layers Navigation BEGIN***/
		.navig {
			height: 96px;
    		position: absolute;
		    right: 20px;
    		top: 100px;
		    width: 30px;
		    z-index: 999;
			text-align: center;
			top: 43%;
			opacity: 1;
			filter:alpha(opacity=100);	
		}
		
		div.lightbox .navig {
			z-index:1;
		}
		
		.scale-me .navig {
			opacity: 0.7;
			filter:alpha(opacity=70);
		}
			
			.scale-me .navig div:hover{
				cursor:default;
				background-color: #fff;
				background: url(img/circles.png) -3px 54px transparent \9;
				color:  #868686;	
			}
			
			.scale-me .navig div.act:hover{
				background-color: #868686;
				background: url(img/circles.png) 0px 30px transparent \9;
				color: #fff;
			}
		

			.navig div {
				padding:0;
				margin:3px;
				float: right;
				right:0;
				clear:right;
				border-radius: 50%;
				width: 24px;
				height: 24px;
				z-index: 999;
				background-color: #fff;
				background: url(img/circles.png) -3px 54px transparent \9;
				color:  #868686;
				text-align:center;
				font-family: Arial, Helvetica, sans-serif;
				font-size:14px;
				font-weight: bold;
				line-height:24px;
				vertical-align: middle;
			}
			
			.navig div:hover {
				background-color: #868686;
				background: url(img/circles.png) -3px 0px transparent \9;
				color: #fff;
				cursor: pointer;
			}
			
			.navig .act {
				width: 30px;
				height:30px;
				margin:3px 0;;
				line-height: 30px;
				background-color: #868686;
				background: url(img/circles.png) 0px 30px transparent \9;
				color: #fff;
			}
			
			.navig .act:hover {
				cursor: default;
				background: url(img/circles.png) 0px 30px transparent \9;
			}
			
		/***Layers Navigation END***/
		
				
		#loading {
			position: absolute;
			padding: 0;
			 margin: -64px 0 0 -64px;
			height:128px;
			width: 128px;
			left: 50%;
			top: 50%;
			background-repeat: no-repeat;
			color: #000; border:3px #000 solid; 
			font-family: Arial, Helvetica, sans-serif;
			font-size: 24px;
			line-height: 128px;
			text-align: center;
			vertical-align: middle;
			z-index: 999; 
 		}
		
		.destroy {
			position: absolute;
			width:70px;
			height:70px;
			bottom:0px;
			right: 300px;
			background-color:#d03935;
			cursor:pointer;
			color: #fff;
			font-size: 12px;
		}

		img, .navig div {
			-webkit-user-select: none;
			-khtml-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
			-o-user-select: none;
			user-select: none;
		}