@font-face {
		font-family: 'wlight';
		src: url('wlight.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
}

@font-face {
		font-family: 'wmedium';
		src: url('wmedium.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
}

@font-face {
	font-family: 'icons';
	src: url('flaticons-stroke.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'solid';
	src: url('flaticons-solid.eot');
	src: url('flaticons-solid.eot?#iefix') format("embedded-opentype"),
			 url('flaticons-solid.woff') format('woff'),
			 url('flaticons-solid.ttf') format('truetype'),
			 url('flaticons-solid.svg#flaticons-solid') format('svg');
	font-weight: normal;
	font-style: normal; }


@font-face {
	font-family: 'social';
	src: url('flaticons-social.eot');
	src: url('flaticons-social.eot?#iefix') format("embedded-opentype"),
			 url('flaticons-social.woff') format('woff'),
			 url('flaticons-social.ttf') format('truetype'),
			 url('flaticons-social.svg#flaticons-social') format('svg');
	font-weight: normal;
	font-style: normal; }

html {min-height: 100%; height: 100%; font-family: wlight; width: 100%;}
body {margin: 0px; padding: 0px; width: 100%; overflow-x: hidden;}
body.fixed {overflow: hidden;}


.top {position: relative; font-size: 0px;}
.top .img {width: 100%; height: auto;}

.box {position: absolute; width: 800px; height: 500px; left: 100px; bottom: 0px;}
.box .case {position: absolute; left: 0px; width: 100%; top: 0px; bottom: 0px; background: url(img/case.png); z-index: 10}
.box .cd {position: absolute; left: 0px; margin-left: -50px; width: 100%; top: 0px; bottom: 0px; background: url(img/cd.png); z-index: 8}

.top .itunes {position: absolute; bottom: 200px; left: 50%; margin-left: 200px; font-size: 20px;
background: #000; padding: 20px; color: #fff; z-index: 21; border-radius: 8px;}
.top .itunes .button {width: 100px; height: 30px; border-radius: 8px; border: 1px solid #fff; background: url(img/itunes.png) center center no-repeat; background-size: 75%;
display: inline-block; vertical-align: middle; margin-left: 10px;}


.about {background: #000; height: 700px; position: relative; transition: all 0.25s ease-out; overflow: hidden;}
.about .bg {height: 700px; width: 1050px; background: url(img/about.jpg); position: absolute; right: -100px; top: 0px; margin-top: -200px;}
.about .content {position: absolute; width: 500px; color: #fff; left: 50%; margin-left: -460px; margin-top: 380px;}
.about .content .title {font-size: 50px;}
.about .content p {font-size: 18px; line-height: 24px; margin-top: 20px; margin-bottom: 20px;}


.music {background: #000; background-size: contain; height: 740px; position: relative; overflow: hidden;}
.music .bg {height: 700px; width: 800px; background: url(img/music.jpg); position: absolute; left: 0px; top: 0px; margin-top: -220px;}
.music .content .title {font-size: 50px; margin-bottom: 20px;}
.music .content {color: #fff; width: 400px; position: absolute; left: 50%; margin-left: 100px; margin-top: 400px;}

.player .controls {display: inline-block; vertical-align: middle; width: 40px; height: 40px; cursor: pointer; margin-top: -4px;}
.player .controls:before {line-height: 40px; text-align: center;}
.player .controls.play:before {font-family: icons; content:'\e56f';}
.player .controls.stop:before {font-family: icons; content:'\e56d';}
.player .controls.stop {display: none;}
.player .name {display: inline-block; vertical-align: middle; font-size: 18px;}



.button {border: 1px solid #fff; color: #fff; font-size: 20px; padding: 10px; border-radius: 8px; text-decoration: none; display: inline-block;}

.music .button {margin-top: 40px;}




.afisha {position: relative; background: url(img/black_bg.jpg); padding-top: 80px; padding-bottom: 80px; color: #fff; text-align: center;}
.afisha .title {font-size: 40px; margin-bottom: 20px;}
.afisha .item {display: inline-block; vertical-align: top; width: 300px; margin-bottom: 40px; margin-left: 20px; margin-right: 20px; border-right: 1px solid #fff; text-align: left;}
.afisha .item:last-child {border-right: 0px;}
.afisha .item .name {font-size: 24px; margin-bottom: 10px;}
.afisha .item .place {font-size: 18px; line-height: 30px;}

.gallery {position: relative; font-size: 0px; width: 100%; height: 600px; font-size: 0px;}
.gallery .item {background-size: cover !important; }
.gallery .item:after {background: rgba(255, 255, 255, 0.5); position: absolute; left: 0px; top: 0px; bottom: 0px; right: 0px; content: ''; opacity: 0;}
.gallery .item:before {content:'\e46b'; width: 30px; height: 30px; position: absolute; top: 50%; margin-top: -15px; left: 50%; margin-left: -15px;
color: #000; z-index: 40; font-family: icons; font-size: 30px; opacity: 0;}
.gallery .item:hover:after {opacity: 1;}
.gallery .item:hover:before {opacity: 1;}

.gallery.video .item:before {content:'\e57a';}

.gallery .item {width: 20%; height: 250px;}
.gallery .item.g {height: 500px;}


.news {position: relative; background: url(img/black_bg.jpg); padding-top: 80px; padding-bottom: 80px; color: #fff; text-align: center;}
.news .title {font-size: 50px; margin-bottom: 20px;}
.news .item {text-align: left; display: inline-block; vertical-align: top; width: 240px; padding: 40px;}
.news .name {font-weight: bold; font-size: 20px; margin-bottom: 10px;}
.news .date {font-size: 14px;}
.news .item:hover {background: rgba(255, 255, 255, 0.12)}


.footer {position: relative; background: url(img/black_bg.jpg); padding-top: 80px; padding-bottom: 80px; color: #fff; text-align: center;}
.footer .left {width: 36%; display: inline-block; vertical-align: top; margin: 20px; text-align: center;}
.footer .right {width: 36%; display: inline-block; vertical-align: top; margin: 20px; text-align: center;}
.footer .title {font-size: 40px; margin-bottom: 20px;}

.footer p {line-height: 26px;}
.footer a {color: #fff; text-decoration: none;}

.footer .right a {font-size: 20px; font-weight: bold; display: block; line-height: 30px;}

.ico:before {display: inline-block; vertical-align: middle; margin-right: 6px; width: 20px; height: 20px; content:''; background-size: cover !important; margin-top: -2px;}
.ico.fb:before {background: url(img/ico_fb.png);}
.ico.youtube:before {background: url(img/ico_youtube.png);}
.ico.vk:before {background: url(img/ico_vk.png);}
.ico.twitter:before {background: url(img/ico_twitter.png);}
.ico.insta:before {background: url(img/ico_insta.png);}
.ico.sc:before {background: url(img/ico_sc.png);}




.fixed {position: fixed; left: 0px; right: 0px; top: 0px; height: 50px; line-height: 50px; z-index: 30; background: #000; display: none;}
.fixed .logo {width: 200px; height: 26px; background-size: cover !important; background: url(img/uma.png); position: absolute; left: 20px; top: 10px;}
.fixed .menu {position: absolute; right: 20px; top: 4px;}
.fixed .menu a {border: 0px solid #fff; padding: 8px; border-radius: 6px; margin-left: 6px; margin-right: 6px; box-sizing: border-box; width: 38px !important;
color: #fff; text-decoration: none;}
.fixed .menu a:before {margin: 0px !important}




.pxl {display: none; position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; background: rgba(255, 255, 255, 0.3); z-index: 30; overflow: auto;}
.modal {position: absolute; width: 1000px; left: 50%; margin-left: -500px; top: 60px; background: #fff; padding: 40px; z-index: 1000;
color: #000;}
.modal .title {font-size: 30px; margin-bottom: 20px; text-align: center;}
.pxl.photo img {width: 100%; display: block;}
.modal .modal_closer {position: absolute; right: -40px; top: 0px; text-align: center; line-height: 40px; cursor: pointer; color: #fff;

     background: #000; width: 40px; height: 40px;
}
.modal .modal_closer:hover {background: #fff; color: #000;}
.modal .modal_closer:after {content:'+'; font-size: 40px; font-weight: bold;
     -moz-transform:    rotate(45deg);
     -o-transform:      rotate(45deg);
     -webkit-transform: rotate(45deg);
     transform:         rotate(45deg);
     position: absolute; left: 0px; top: 0px; width: 40px; height: 40px; line-height: 40px; text-align: center;}


.pxl.video .modal {width: 600px; margin-left: -300px;}



.mobile .box {width: 200px; height: 100px; left: 50%; margin-left: -80px; bottom: auto;}
.mobile .box .case {background-size: cover; width: 160px; height: 160px;}
.mobile .fixed .logo {width: 200px; height: 26px; position: relative; left: auto; margin: 0 auto;}
.mobile .fixed .menu {display: none;}
.mobile .top .itunes {position: absolute; width: 200px; left: 50%; margin-left: -100px; text-align: center; bottom: 0px; background: none;}

.mobile .top .img {opacity: 0.4}
.mobile .top .itunes {margin-left: -110px;}
.mobile .top .itunes .button {margin-left: 0px; background: url(img/itunes.png) center center no-repeat #000; background-size: 60%;}

.mobile .about {height: 400px;}
.mobile .about .bg {background-size: cover !important; width: 200px; height: 200px; right: 0px; margin-top: 120px; opacity: 0.8;}
.mobile .about .content {font-size: 14px; margin-top: 40px; width: 260px; left: 0px; margin-left: 20px;}
.mobile .about .content p {font-size: 14px;}

.mobile .about .content .title {font-size: 30px;}


.mobile .music .bg {background-size: cover !important; width: 200px; height: 200px; left: 0px; margin-top: 40px; opacity: 0.8; margin-left: 0px;}

.mobile .music .content {margin: 0px; left: auto; right: 20px; margin-top: 120px; width: 240px;}

.mobile .music .content .title {font-size: 30px;}
.mobile .music {height: 400px;}
.mobile .afisha .item {margin-bottom: 20px; width: 240px; border: 0px; margin: 0 auto; display: block; margin-top: 20px;}

.mobile .gallery .item {width: 50%; height: 200px;}

.mobile .footer .left {width: auto;}
.mobile .footer br {display: none;}
.mobile .footer b {display: block;}
.mobile .footer .right {width: auto;}

.mobile .footer .right a {margin-top: 10px; margin-bottom: 10px;}
.mobile .news .item {width: auto;}

.mobile .modal {position: absolute; width: 260px; left: 50%; margin-left: -140px; top: 80px; background: #fff; padding: 10px; z-index: 1000;
color: #000; z-index: 2000;}

.mobile .pxl {background: #000; opacity: 1; z-index: 2000;}

.mobile .modal .modal_closer {left: 50%; margin-left: -20px; top: -60px;}

audio {display: none;}
.mobile audio {display: block; background: none; width: 100%;}




.desktop .m {display: none !important;}
.mobile .d {display: none;}
.mobile .m {display: block;}
.mobile .player .controls.play.m {display: inline-block;}


.QOverlay {
	background-color: #000000;
	z-index: 9999;
	height: 100% !important;
}

.QLoader {
	background-color: #CCCCCC;
	height: 1px;
}


.mobile .QQverlay {display: none !important;}



.q_content {background: #000; margin-bottom: -20px; padding-top: 80px; padding-bottom: 80px; color: #fff;}
.q_content .title {font-size: 30px; text-align: center;}
.q_content .page_content {font-size: 16px; max-width: 600px; display: block; margin: 0 auto; line-height: 22px;}
.q_content .back {display: inline-block; vertical-align: middle; margin-right: 6px; text-align: center; width: 40px; height: 40px; text-decoration: none;}
.q_content .back:before {color: #fff; content:'\2190'; text-decoration: none;}

.about a {color: #fff;}