/* LESS VARIABLES */
.rounded-corners (@radius: 5px) {
	border-radius: @radius;
  	-webkit-border-radius: @radius;
  	-moz-border-radius: @radius;
}
/* ############## */
* {
	margin: 0;
	padding: 0;
}
#logo {
	position: fixed;
	top: 7px;
	left: 17px;
	background: url(../images/logo.png) no-repeat center center;
	width: 94px;
	height: 20px;
	z-index: 2000;
}
html {
	height: 100%;
}
body {
	font-family: CharterOSCRegular;
	background: #fff;
	font-size: 15px;
	line-height: 21px;
	height: 100%;
}
#header {
	font-family: FFDINBold;
}
#preloader {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: #fff url(../images/zagruz.gif) no-repeat center center;
	z-index: 1000;
	text-align: center;
	letter-spacing: 20px;
}
#likes {
	position: fixed;
	width: 96px;
	top: 130px;
	right: 10px;
	padding: 5px;
	z-index: 100;
}
.descr {
	position: fixed;
	top: 50px;
	right: 130px;
	padding: 5px;
	z-index: 100;
	
	p {
		text-align: right;
		font-size: 122px;
		font-family: LineaturaLight;
		color: #F2AD64;
		text-shadow: 0px 1px 1px rgba(0,0,0, 0.2);
	}
}
#control {
	position: fixed;
	width: 96px;
	top: 10px;
	right: 10px;
	padding: 5px;
	z-index: 100;
	
	.button {
		float: left;
		background: rgba(242,173,100, 0.5);
 		border: 1px solid rgba(242,173,100, 0.4);
 		width: 20px;
 		text-align: center;
 		cursor: pointer;
 		font-size: 10px;
 		color: #fff;
 		letter-spacing: 1px;
 		text-transform: uppercase;
 		font-family: CirceRegular;
 		margin: 5px;
	}
	.button:hover {
		background: rgba(242,173,100, 0.4);
		border: 1px solid rgba(242,173,100, 0.5);
		
	}
	.button:active {
		position: relative;
		top: 1px;
		background: rgba(239,204,168, 0.5);
		border: 1px solid rgba(239,204,168, 0.9);
		color: #000;
	}
	.active {
		background: rgba(255,255,255, 0.5);
		border: 1px solid rgba(239,204,168, 0.6);
		color: #000;
	}
}
#wrapper {
	overflow: hidden;
}
#screens {
	position: relative;
	
	.screen {
		position: relative;
		background: #FFF;
		float: left;
		
		iframe {
			border: none;
			width: 100%;
			height: 100%;
		}
		.preloader {
			position: absolute;
			top: 0px;
			left: 0px;
			width: 100%;
			height: 100%;
			background: #fff;
			z-index: 1;
			
			img {
				width: 100%;
				height: 100%;
			}
		}
	}
	
}



.arrow {
	width: 50px;
	height: 50px;
	z-index: 100;
	div{
		position:absolute;
		color:#F2AD64;
		font-size:16px;
	}
	&.t {
		div{
			left:23px;
			top:30px;
		}
		position: fixed;
		top: 20px;
		left: 50%;
		margin-left: -25px;
		background-image: url(../images/up.png);
	}
	&.b {
		div{
			left:25px;
			top:5px;
		}
		position: fixed;
		bottom: 20px;
		left: 50%;
		margin-left: -25px;
		background-image: url(../images/down.png);
	}
	&.l {
		div{
			left:35px;
			top:15px;
		}
		position: fixed;
		left: 20px;
		top: 50%;
		margin-top: -25px;
		background-image: url(../images/left.png);
	}
	&.r {
		div{
			left:5px;
			top:15px;
		}
		position: fixed;
		right: 20px;
		top: 50%;
		margin-top: -25px;
		background-image: url(../images/right.png);
	}
}
.arrow.l:hover {
	background-image: url(../images/leftb.png);
}
.arrow.r:hover {
	background-image: url(../images/rightb.png);
}
.arrow.t:hover {
	background-image: url(../images/upb.png);
}
.arrow.b:hover {
	background-image: url(../images/downb.png);
}