/* LESS VARIABLES */
.border-radius (@radius: 5px) {
	border-radius: @radius;
  	-webkit-border-radius: @radius;
  	-moz-border-radius: @radius;
}
.box-sizing (@type: border-box) {
	-webkit-box-sizing: @type;
	-moz-box-sizing:    @type;
	box-sizing:         @type;
}



/* ############## */

a {
	color: inherit;
}
td {
	vertical-align: top;
}
* {
	margin: 0;
	padding: 0;
}

.clrfx {
	clear: both;
}
html {
	height: 100%;
}
body {
	font: 16px/26px CharterOSCRegular;
	background: #fff;
	height: 100%;
}
#preloader {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	background: #fff;
	z-index: 100000;
	box-shadow: 0px 1px 3px rgba(0,0,0,0.4);
	
	.spinner {
		display: none;
		position: absolute;
		top: 50%;
		left: 50%;
		margin: -25px 0 0 -25px;
		width: 50px;
		height: 50px;
		background: rgba(0,0,0, 0.9) url(../images/loading.gif) no-repeat center center;
		.border-radius(40px);
	}
}

#menu {
	position: absolute;
	width: 105px;
	z-index: 1000000!important;
	
	ul {
		list-style: none;
		font-family: 'NonameGroteskHanddrawnv4Rg';
		font-size: 12px;
		line-height: 14px;
		
		li {
			cursor: pointer;
			padding: 10px;
			text-transform: uppercase;
		}
		.active {
			background: #000;
			color: #fff;
		}
	}
	
}

#sub-menu1 {
	position: absolute;
	width: 115px;
	padding-left: 105px;
	
	ul {
		list-style: none;
		font-family: 'Futura';
		font-size: 12px;
		line-height: 14px;
		
		li {
			cursor: pointer;
			padding: 10px;
			text-transform: uppercase;
		}
		.active {
			background: #000;
			color: #fff;
		}
	}
}

#sub-menu2 {
	position: absolute;
	width: 115px;
	padding-left: 105px;
	
	ul {
		list-style: none;
		font-family: 'Futura';
		font-size: 12px;
		line-height: 14px;
		
		li {
			cursor: pointer;
			padding: 10px;
			text-transform: uppercase;
		}
		.active {
			background: #000;
			color: #fff;
		}
	}
}

#wrapper {
	width: 100%;
	position: relative;
}

.block {
	width: 1200px;
	margin: 0 auto;
	
	h2 {
		text-align: ;
		font: 90px/108px OctavaOSCRegular;
		letter-spacing: 3px;
		text-transform: uppercase;
		margin-left: 280px;

		span {
			font: normal 90px/108px 'NonameGroteskHanddrawnv4Rg';
			background: url(../images/line.png) no-repeat left 120px;
		}
	}
	.descr {
		width: 645px;
		text-align: center;
		margin-left: 280px;
		font: 20px/36px CharterOSCRegular;
	}
	h3 {
		width: 940px;
		letter-spacing: 5px;
		margin-left: 170px;
		margin-top: 100px;
		text-transform: uppercase;
		padding: 0 40px;
		text-align: right;
		background-color: #000;
		color: #fff;
		font: 40px/48px 'NonameGroteskHanddrawnv4Rg';
	}
	.tc {
		text-align: center;
		padding-left: 280px;
		width: 720px;
	}
	.bordered {
		width: 380px;
		margin-left: 740px;
		margin-top: 50px;
		text-align: center;
		padding: 20px 0;
		border: 5px solid #000;
		font: 18px/23px 'NonameGroteskHanddrawnv4Rg';
		text-transform: uppercase;
	}
}

.heading {
	color: white;
	z-index: 100;
	margin: 0 auto;
	width: 100%;
	margin-top: 90px;
		
	h1 {
		text-align: center;
		font: italic 60px/72px OctavaOSCRegular;
		letter-spacing: 3px;
		span {
			font: 85px/101px 'NonameGroteskHanddrawnv4Rg';
		}
	}
	.capt {
		font: italic 30px/36px OctavaOSCRegular;
		width: 450px;
		position: absolute;
		left: 50%;
		margin-left: -140px;
		margin-top: 30px;
		span {
			font: 30px/36px 'NonameGroteskHanddrawnv4Rg';
		}
	}
	.down {
		position: absolute;
		padding-left: 300px;
			margin-top: 200px;
		text-align: center;
		left: 50%;
		margin-left: -32px;
	}
	.credits {
		position: absolute;
		margin-top: 180px;
		text-align: center;
		left: 50%;
		margin-left: -150px;
		font: 16px/20px Futura;
	}
}

.lead {
	width: 690px;
	margin: 90px auto;
	font: 20px/36px CharterOSCRegular;
}

.fullWidth {
	 max-width: 100%;
	 margin: 0 auto;
	 
	 .full-width-slider {
	 	width: 100%;
	 	position: relative;
	 }
	 .rsArrow {
	 	top: 50%;
	 	margin-top: -28px;
	 }
	 
	 .rsArrowLeft {
	 	left: 50px;
	 	width: 33px!important;
	 	height: 57px!important;
	 	background: url(../images/prev-w.png);
	 }
	 .rsArrowRight {
	 	right: 50px!important;
	 	width: 33px!important;
	 	height: 57px!important;
	 	background: url(../images/next-w.png);
	 }
	 
	 .rsArrowIcn
	 {
	 	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.46);
	 	display: none;
	 }
	 .rsArrowDisabled {
	 	opacity: 0.1;
	 }
	 
	 .rsGCaption {
	 	font: 30px/23px 'NonameGroteskHanddrawnv4Rg';
	 	margin-top: 10px;
	 }
}

.smallslider {
	 max-width: 70%;
	 margin: 50px auto;
	 float: right;
	 
	 .rsArrow {
	 	top: 50%;
	 	margin-top: -28px;
	 }
	 
	 .rsArrowLeft {
	 	left: 25px;
	 	width: 33px!important;
	 	height: 57px!important;
	 	background: url(../images/prev-w.png);
	 }
	 .rsArrowRight {
	 	right: 25px!important;
	 	width: 33px!important;
	 	height: 57px!important;
	 	background: url(../images/next-w.png);
	 }
	 
	 .rsArrowIcn
	 {
	 	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.46);
	 	display: none;
	 }
	 .rsArrowDisabled {
	 	opacity: 0.1;
	 }
	 
}

.slider2 {
	&.royalSlider {
		width: 800px;
		height: 544px;  
	}
	.rsGCaption {
		font: 30px/23px 'NonameGroteskHanddrawnv4Rg';
		position: absolute;
		left: -450px;
		top: 50%;
		-webkit-transform: rotate(-90deg);
		     -moz-transform: rotate(-90deg);
		      -ms-transform: rotate(-90deg);
		       -o-transform: rotate(-90deg);
		          transform: rotate(-90deg);
	}
}

.outarr {
	margin-right: 110px;
	
	.rsArrowLeft {
		left: -70px;
		background: url(../images/prev-b.png);
	}
	.rsArrowRight {
		right: -70px!important;
		background: url(../images/next-b.png);
	}
}

.outarr-bl {
	left: 50%;
	margin-left: -260px;
	margin-top: 150px;
	float: none;
	
	.rsArrowLeft {
		left: -70px;
		background: url(../images/prev-w.png);
	}
	.rsArrowRight {
		right: -70px!important;
		background: url(../images/next-w.png);
	}
}

.slider3 {
	&.royalSlider {
		width: 514px;
		height: 400px;  
	}
	.rsGCaption {
		font: 30px/23px 'NonameGroteskHanddrawnv4Rg';
		position: absolute;
		left: -420px;
		top: 50%;
		-webkit-transform: rotate(-90deg);
		     -moz-transform: rotate(-90deg);
		      -ms-transform: rotate(-90deg);
		       -o-transform: rotate(-90deg);
		          transform: rotate(-90deg);
	}
}
.slider4 {
	&.royalSlider {
		width: 800px;
		height: 525px;  
	}
	.rsGCaption {
		font: 30px/23px 'NonameGroteskHanddrawnv4Rg';
		position: absolute;
		left: -450px;
		top: 50%;
		-webkit-transform: rotate(-90deg);
		     -moz-transform: rotate(-90deg);
		      -ms-transform: rotate(-90deg);
		       -o-transform: rotate(-90deg);
		          transform: rotate(-90deg);
	}
}

.slider5 {
	&.royalSlider {
		width: 606px;
		height: 420px;  
	}
	.rsGCaption {
		font: 30px/23px 'NonameGroteskHanddrawnv4Rg';
		position: absolute;
		left: -420px;
		top: 50%;
		color: #fff;
		-webkit-transform: rotate(-90deg);
		     -moz-transform: rotate(-90deg);
		      -ms-transform: rotate(-90deg);
		       -o-transform: rotate(-90deg);
		          transform: rotate(-90deg);
	}
}

.row2 {	
	margin-left: 440px;
	
	td {
		width: 360px;
		padding-right: 20px;
		font: 16px/26px CharterOSCRegular;
		
		h4 {
			font: italic 20px/28px OctavaOSCRegular;
			text-align: center;
		}
		i {
			font: italic 16px/28px OctavaOSCRegular;
			text-align: center;
		}
	}
}

.slide-descr {
	width: 520px;
	font: 16px/26px CharterOSCRegular;
	margin-left: 620px;
}

.slide-h4 {
	font: italic 20px/28px OctavaOSCRegular;
	margin: 50px 0 20px 620px;
}

.descr-i {
	width: 520px;
	/*text-align: center;*/
	margin-left: 620px;
	font: italic 18px/30px OctavaOSCRegular;
}

.descr730 {
	width: 730px;
	text-align: center;
	margin-left: 235px;
	font: 20px/36px CharterOSCRegular;
}

.video-descr {
	margin-left: 450px;
	font: 16px/22px OctavaOSCRegular;
	
	td {
		width: 320px;
	}
	.blank {
		width: 100px;
	}
}

.video-descr-notable {
	font: 16px/24px OctavaOSCRegular;
	width: 520px;
	margin: 45px 0 0 540px;
}

.slider8 {
	&.royalSlider {
		width: 598px;
		height: 420px;  
	}
	.rsGCaption {
		font: 30px/23px 'NonameGroteskHanddrawnv4Rg';
		position: absolute;
		left: -420px;
		top: 50%;
		color: #000;
		-webkit-transform: rotate(-90deg);
		     -moz-transform: rotate(-90deg);
		      -ms-transform: rotate(-90deg);
		       -o-transform: rotate(-90deg);
		          transform: rotate(-90deg);
	}
}

.slider9 {
	&.royalSlider {
		width: 453px;
		height: 300px;  
	}
	.rsGCaption {
		font: 30px/23px 'NonameGroteskHanddrawnv4Rg';
		position: absolute;
		left: -350px;
		top: 50%;
		color: #000;
		-webkit-transform: rotate(-90deg);
		     -moz-transform: rotate(-90deg);
		      -ms-transform: rotate(-90deg);
		       -o-transform: rotate(-90deg);
		          transform: rotate(-90deg);
	}
}

.slider10 {
	&.royalSlider {
		width: 453px;
		height: 300px;  
	}
	.rsGCaption {
		font: 30px/23px 'NonameGroteskHanddrawnv4Rg';
		position: absolute;
		left: -350px;
		top: 50%;
		color: #000;
		-webkit-transform: rotate(-90deg);
		     -moz-transform: rotate(-90deg);
		      -ms-transform: rotate(-90deg);
		       -o-transform: rotate(-90deg);
		          transform: rotate(-90deg);
	}
}

.video-descr-left {
	font: 14px/20px OctavaOSCRegular;
	width: 275px;
	float: left;
	margin: 45px 0 0 210px;
	
	.big-p {
		font: italic 22px/28px OctavaOSCRegular;
		margin-bottom: 65px;
		width: 275px;
		text-align: center;
	}
}

.mr50 {
	margin-right: 50px;
}

.slider11 {
	&.royalSlider {
		width: 503px;
		height: 403px;  
	}
	.rsGCaption {
		font: 30px/23px 'NonameGroteskHanddrawnv4Rg';
		position: absolute;
		left: -350px;
		top: 50%;
		color: #000;
		-webkit-transform: rotate(-90deg);
		     -moz-transform: rotate(-90deg);
		      -ms-transform: rotate(-90deg);
		       -o-transform: rotate(-90deg);
		          transform: rotate(-90deg);
	}
}

.w365 {
	width: 365px;
	margin-left: 720px;
}
.descr670 {
	width: 670px;
	text-align: center;
	margin-left: 265px;
	font: 20px/36px CharterOSCRegular;
}

.bordtc {
	width: 570px;
	border: 5px solid #000;
	font: 18px/23px 'NonameGroteskHanddrawnv4Rg';
	text-align: center;
	text-transform: uppercase;
	padding: 15px 0;
	margin: 70px auto;
}
.choice {
	font: italic 30px/34px OctavaOSCRegular;
	margin-bottom: 65px;
	text-align: center;
}

.slider12 {
	&.royalSlider {
		width: 503px;
		height: 400px;  
	}
	.rsGCaption {
		font: 30px/23px 'NonameGroteskHanddrawnv4Rg';
		position: absolute;
		left: -350px;
		top: 50%;
		color: #000;
		-webkit-transform: rotate(-90deg);
		     -moz-transform: rotate(-90deg);
		      -ms-transform: rotate(-90deg);
		       -o-transform: rotate(-90deg);
		          transform: rotate(-90deg);
	}
}

.slider13 {
	&.royalSlider {
		width: 598px;
		height: 400px;  
	}
	.rsGCaption {
		font: 30px/23px 'NonameGroteskHanddrawnv4Rg';
		position: absolute;
		left: -400px;
		top: 50%;
		color: #000;
		-webkit-transform: rotate(-90deg);
		     -moz-transform: rotate(-90deg);
		      -ms-transform: rotate(-90deg);
		       -o-transform: rotate(-90deg);
		          transform: rotate(-90deg);
	}
}

.w490 {
	width: 490px;
	margin-left: 630px;
}
.floatimg {
	/*padding-left: 505px;*/
	
	img {
		float: right;
		margin-right: 20px;
	}
}

.mr10 {
	margin-right: 10px;
}
.w400 {
	width: 400px;
	margin-left: 680px;
}

.block h2 {
	margin: 150px 0 50px 280px!important;
}
.block h3 {
	margin: 100px 0 50px 220px!important;
}

.beat-wrap {
	font: 10px/12px 'NonameGroteskHanddrawnv4Rg';
	border: 5px solid #000;
	padding: 5px;
	margin-left: -10px;
	margin-top: 20px;
	
}

.beat {
	/*display: none;*/
	width: 20px;
	height: 20px;
	cursor: pointer;
	background: url(../images/play.png);
	z-index: 10000;
	position: absolute;
	bottom: 80px;
	right: 10px;
	
	
	
	&.active {
		background: url(../images/pause.png);
	}
}

#sub-menu3 {
	position: absolute;
	width: 115px;
	padding-left: 105px;
	
	ul {
		list-style: none;
		font-family: 'Futura';
		font-size: 12px;
		line-height: 14px;
		
		li {
			cursor: pointer;
			padding: 10px;
			text-transform: uppercase;
		}
		.active {
			background: #000;
			color: #fff;
		}
	}
}

.player-cap {
	font: italic 12px/14px OctavaOSCRegular!important;
	margin-top: 10px;
}