* {
    box-sizing: border-box;
}
@font-face {
    font-family: "H-Black";
    src: url("../fonts/HelveticaNeueCyr-Black_0.otf");
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: "H-Bold";
    src: url("../fonts/HelveticaNeueCyr-Bold_0.otf");
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: "H-Italic";
    src: url("../fonts/HelveticaNeueCyr-Italic.otf");
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: "H-Light";
    src: url("../fonts/HelveticaNeueCyr-Light.otf");
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: "H-LightItalic";
    src: url("../fonts/HelveticaNeueCyr-LightItalic.otf");
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: "H-Medium";
    src: url("../fonts/HelveticaNeueCyr-Medium_0.otf");
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: "H-Roman";
    src: url("../fonts/HelveticaNeueCyr-Roman_0.otf");
    font-style: normal;
    font-weight: normal;
}

body, ul, li, ol, p, h1, h2, h3 {
    margin: 0;
    padding: 0;
    font-weight: normal;
}
html, body{
    height: 100%;
    -webkit-overflow-scrolling: touch;
}
body {
    background: #ffffff none repeat scroll 0 0;
    color: #3a3a3a;
    font: 14px/18px H-Medium;
    height: 100%;
    width: 100%;
    overflow-x: hidden;
    //overflow-y: hidden;
}
#wrap {
	min-width: 1190px;
	width: 100%;
}
a {
    text-decoration: none;
    color: #ffffff;
}
.clear {
    clear: both;
    overflow: hidden;
    height: 100%;
}
.center {
    text-align: center;
}
sup {
    top: -0.5em;
}
b, strong {
    font-weight: normal;
}
i {
    font-style: normal;
}
input, button {
    -webkit-appearance: none;
}
// END RESET

.i-block {
	display: inline-block;
	vertical-align: top;
}
.absolute-middle {
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto 0;
}
#total-header,
#total-content,
#total-footer {
	width: 100%;
}
.margin-auto {
	margin: 0 auto;
}
#total-content > section {
	width: 100%;
}
.green-btn,
.btn-skew,
.play,
.scroll-to,
.inst-link,
div.tabs a,
a.inst-link,
a.order-btn,
a.order-call-btn {
	transition: all ease 0.4s;
}
.green-btn:not(:hover),
.btn-skew:not(:hover),
.play:not(:hover),
.scroll-to:not(:hover),
.inst-link:not(:hover),
div.tabs a:not(:hover),
a.inst-link:not(:hover),
a.order-btn:not(:hover),
a.order-call-btn:not(:hover) {
	transition: all ease 1s;
}

.green-btn {
	.i-block;
	font: 18px/22px H-Medium;
	padding: 15px 33px;
	background: #a2c029;
	border-radius: 30px;
	box-shadow: 0px 4px 0px #7f9916;
	border: 1px none;
	color: #ffffff;
	cursor: pointer;
	&:hover {
		background: #98b428;
	}// hover
	&:active {
		bakcground: #829b1d;
		box-shadow: 0px 3px 0px #7f9916;
	}// active
}// .green-btn

.btn-skew {
	text-shadow: 2px 0 1px rgba(0,0,0,0.6);
	-webkit-transform: skew(-12deg);
	-moz-transform: skew(-12deg);
	-o-transform: skew(-12deg);
	transform: skew(-12deg);
	.i-block;
	font-size: 18px;
	line-height: 22px;
	color: #ffffff;
	background: #d339d5;
	border: 7px solid #ad2eaf;
	padding: 18px 43px;
	span {
		display: block;
		-webkit-transform: skew(12deg);
		-moz-transform: skew(12deg);
		-o-transform: skew(12deg);
		transform: skew(12deg);
	}// span
	&:hover {
		background: #ad2eaf;
		border: 7px solid #ad2eaf;
	}// hover
	&:active {
		bakcground: #d33ad5;
		border: 7px solid #d33ad5;
	}// active
}// .btn-skew
@width: 1270px;
@color-g: #a2c029;
@color-gd: #96b51b;
@color-p: #d33ad5;
@color-dg: #231e22;

#total-header {
	background: @color-gd;
header.header {
	width: @width;
	.clear;
	.margin-auto;
	div.logo {
		float: left;
		width: 203px;
		padding: 45px 0;
		margin: 0 0 0 40px;
		a {
			border: 0;
			display: block;
			img {
				border: 0;
			}
		}
	}// logo
	div.inner {
		float: right;
		width: 955px;
		div.contacts {
			padding: 35px 0 30px 0;
			a, div {
				.i-block;
				color: #ffffff;
			}// a, div
			div.oper-time {
				padding: 0 0 0 65px;
				background: url("../design/icons/clock_b.png") no-repeat center left;
				b, i {
					display: block;
					font-size: 19px;
					line-height: 22px;
				}// b, i
				b {
					font-family: H-Bold;
					padding-bottom: 10px;
				}// b
			}// div.oper-time
			div.phone {
				padding: 10px 0 10px 55px;
				background: url("../design/icons/phone_b.png") no-repeat center left;
				margin: 0 10px 0 37px;
				a {
					font-size: 27px;
					line-height: 34px;
					font-family: H-Bold;
				}
			}// div.phone
			a.order-call-btn {
				color: #2a2927;
				border: 2px solid;
				padding: 10px 8px;
				text-transform: lowercase;
				margin: 6px 10px 0 0;
				&:hover {
					opacity: 0.7;
				}// hover
			}// a.order-call-btn
			a.inst-link {

				margin-top: 2px;
				img {
					height: 50px;
					border: 0;
				}// img
				&:hover {
					opacity: 0.8;
				}// hover
			}// a.instagramm
		}// div.contacts
		nav.main-menu {
			display: flex;
			justify-content: center;
			align-items: center;
			flex-wrap: wrap;
			width: 100%;
			max-width: 870px;
			a {
				.i-block;
				color: #fff;
				font-size: 19px;
				line-height: 22px;
				border:3px solid #d33ad5;
				padding:5px 10px;
				background: rgba(32, 27, 31, 0.9);
				margin-right: 8px;
				margin-bottom: 0px;
				&:nth-child(5) {
					// margin-right: 0;
				}// nth-5
				&:nth-child(n+6) {
					margin-bottom: 0;
				}// nth

				&:nth-child(7) {
					margin-right: 0;
				}

				&:last-child {
					margin-top: 20px;

				}
				&:hover {
					background: #1f3741;
					color: #ffffff;
					//border-bottom: 1px solid #1f3741;
				}// hover
				&:active {
					background: #29414b;
					color: #ffffff;
					border-bottom: 1px solid #29414b;
				}// hover

			}// a
		}// nav.main-menu
	}// div.inner
}//header
}// #total-header
section#banner {
	.center;
	background: url("../design/banner_bg.jpg") no-repeat center center;
	background-size: cover;
	min-height: 765px;
	height: 100%;
	padding: 115px 0 0 0;
	div.inner {
		width: 910px;
		border: 10px solid @color-p;
		background: rgba(32,27,31,0.9);
		text-align: center;
		padding: 50px 0 60px 0;
		.margin-auto;
		h1 {
			font: 69px/72px H-Roman; //
			color: @color-g;
			margin-bottom: 20px;
		}// h1
		.title {
			font: italic 25px/27px H-Roman;
			font-size: 32px;
			color: #ffffff;
		}// span
	}// div.inner
	a.order-btn {
		.clear;
		margin: 60px 0 75px 0;
	}// a.order-btn
	div#scroll-image {
		margin-top: -40px;
		margin-bottom: 22px;
		a.scroll-to {
		background: url("../design/icons/scroll.png") no-repeat top center;
		display: block;
		.margin-auto;
		font-size: 18px;
		line-height: 22px;
		padding: 70px 0 0;
		color: #ffffff;
		width: 100%;
		max-width: 160px;
		}
	}// div#scroll-image

}// section#banner

section#advantages {
	text-align: center;
	padding: 60px 0 50px;
	background: @color-dg;
	h2 {
		font: 65px/68px H-Medium;
		color: #ffffff;
		text-transform: uppercase;
		padding: 0 0 50px;
	}// h2
	div.inner {
		div.item {
			.i-block;
			text-align: center;
			margin: 0 70px 0 0;
			&:last-child {
				margin-right: 0;
			}// last-child
			img {
				.margin-auto;
			}// img
			span, i {
				color: #ffffff;
				font: 26px/28px H-LightItalic;
			}// span, i
			span.title {
				display: block;
				margin: 0 0 15px 0;
				text-transform: uppercase;
			}// span.title
		}// div.item
	}// div.inner
}// section#advantages

section#about {
	background: url("../design/about_bg.jpg") no-repeat top center;
	max-height: 749px;
	height: 100%;
	div.inner {
		.clear;
		.margin-auto;
		width: @width;
		position: relative;
		div.text {
			color: #ffffff;
			width: 570px;
			float: left;
			padding: 40px 10px 20px 20px;
			h2 {
				font: 65px/68px H-Medium;
				text-transform: uppercase;
				padding: 0 0 30px 0;
			}// h2
			p {
				font: 17px/28px H-Roman;
				padding: 0 0 10px 0;
			}// p
		}// div.text
		div.video {
			left: 610px;
			.absolute-middle;
			height: 350px;
			text-align: center;
			width: 530px;
			span {
				font: 22px/26px H-Roman;
				display: block;
				margin: 0 auto;
				color: #ffffff;
				margin: 0px 0 20px 0;
				text-transform: uppercase;
				text-shadow: 0 0 5px rgba(0,0,0,0.8);
			}// span
			div.v-inner {
				width: 100%;
				height: 320px;
				border: 10px solid @color-p;
				box-shadow: 1px 2px 18px rgba(0,0,0,0.3);
				-webkit-box-shadow: 1px 2px 18px rgba(0,0,0,0.3);
				-o-box-shadow: 1px 2px 18px rgba(0,0,0,0.3);
				-moz-box-shadow: 1px 2px 18px rgba(0,0,0,0.3);
				iframe {
					width: 100%;
					height: 100%;
				}// iframe
			}// div.v-inner
		}// div.video
	}// div.inner
}// section#about
section#trainers {
	text-align: center;
	padding: 80px 0 90px;
	background: @color-dg;
	h2 {
		font: 65px/68px H-Medium;
		color: #ffffff;
		text-transform: uppercase;
		padding: 0 0 50px;
	}// h2
	div.inner {
		div.item {
			.i-block;
			text-align: center;
			margin: 0 70px 0 0;
			&:last-child {
				margin-right: 0;
			}// last-child
			img {
				margin: 0 auto 40px auto;
			}// img
			span, i {
				color: #ffffff;
				font: 26px/28px H-LightItalic;
			}// span, i
			span.title {
				display: block;
				margin: 0 0 15px 0;
			}// span.title
		}// div.item
	}// div.inner
}// section#trainers

section#catalog {
	text-align: center;
	padding: 80px 0 90px;
	background: #fff;
	.inner {
		width: 1270px;
		margin: 0 auto;
		padding: 0 15px;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		.catalog-item {
			width: 370px;
			padding: 15px;
			padding-bottom: 30px;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			align-items: center;
			margin-right: 65px;
			background: #96b51b;
			.item-description {
				display: flex;
				flex-direction: column;
				align-items: center;
				height: 100%;
				background: #fff;
				padding: 15px 10px;
				h4 {
					margin: 15px 0 10px;
					font: 21px H-Medium;
				}
				p {
					font: 16px H-LightItalic;
				}
				.item-img {

					max-width: 180px;
					min-height: 180px;
				}
			}
			.item-btn {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 130px;
				margin-top: 25px;
				padding: 15px 0;
				font: 15px/16px H-Medium;
				color: #fff;
				text-transform: uppercase;
				border: 3px solid #fff;
			}
		}
		.catalog-item:nth-child(even) {
			background: #1d2b31;
		}
		.catalog-item:last-child,  .catalog-item:nth-child(3){
			margin-right: 0;
		}
		.catalog-item:last-child,  .catalog-item:nth-child(4) {
			margin-top: 80px;
		}

		.catalog-item:last-child {
			.item-description {
				.item-img {
					margin: 31px 0;

				}
			}
		}

	}



	h2 {
		margin-bottom: 50px;
		color: #1d2b31;
		font: 65px/68px H-Medium;
		text-transform: uppercase;
	}
}

section#instuctors {
	background: #060606 url("../design/instructors_bg.jpg") no-repeat center center;
	width: 100%;
	min-height: 1410px;
	div.inner {
		.clear;
		.margin-auto;
		min-height: 1300px;
		width: @width;
		position: relative;
		padding: 0 15px;
		color: #ffffff;
		div.text {
			width: 500px;
			.absolute-middle;
			height: 200px;
			span.title {
				display: block;
				font-family: H-Medium;
				i {
					font-size: 44px;
					line-height: 48px;
				}// i
				b {
					font-size: 65px;
					line-height: 68px;
					text-transform: uppercase;
					display: block;
					margin: 5px 0 0;
				}// b
			}// span.title
			i.descr {
				font: 23px/26px H-LightItalic;
				.i-block;
				padding: 0 105px 0 0;
			}// i
		}// div.text
		div.person {
			width: 555px;
			.absolute-middle;
			background: @color-gd;
			right: 15px;
			top: -500px;
			padding: 35px 0 30px 220px;
			height: 470px;
			div.photo {
				border: 4px solid #ffffff;
				display: block;
				position: absolute;
				top: -62px;
				left: -183px;
				width: 358px;
				height: 358px;
			}// div.photo
			img {
				display: block;
				width: 100%;
				height: 100%;
			}// img
			h3 {
				font: 58px/63px H-Medium;
				margin: 0 0 10px;
			}// h3
			i {
				font: 19px/22px H-LightItalic;
			}// i
		}// div.person
		div.person:nth-of-type(2) {
			top: 689px;
		}
	}// div.inner
}// section#instructor

section#discount {
	height: 435px;
	background: #1d2b31 url("../design/discount_bg.jpg") no-repeat center center;
	div.inner {
		width: @width;
		.clear;
		position: relative;
		.margin-auto;
		div.item {
			.absolute-middle;
			width: 800px;
			padding: 0 0 0 15px;
			color: #ffffff;
			//height: 450px;
			h2 {
				font: 65px/70px H-Bold;
			}// h2
			p {
				font: 23px/39px H-Roman;
				padding: 20px 0 40px;
			}// p
			a.btn-skew {
				margin: -35px 0 0 12px;
			}// a.btn-skew
		}// div.item
	}// div.inner
}// section#discount


section#tickets {
	min-height: 1000px;
	background: #ffffff url("../design/tickets_bg.jpg") no-repeat center 520px;
	h2 {
		color: #1d2b31;
		font: 65px/68px H-Medium;
		text-align: center;
		text-transform: uppercase;
		padding: 130px 0 30px 0;
	}// h2
	span.title {
		color: #1d2b31;
		display: block;
		text-align: center;
		font: 23px/28px H-LightItalic;
		padding: 0 0 70px;
	}// span.title
	div.inner {
		width: @width;
		margin: 0 auto;
		padding: 0 15px;
		text-align: center;
		div.item {
			display: inline-block;
			vertical-align: middle;
			width: 200px;
			border: 4px solid #1d2b31;
			background: #a920ab;
			color: #ffffff;
			text-align: center;
			margin-right: 15px;
			padding: 115px 10px;

			&:last-child {
				margin-right: 0;
			}

			&:nth-child(1) {
				padding: 98px 30px;

				p {
					margin-bottom: 37px;
				}
			}

			&:nth-child(2) {
				padding: 92px 30px;

				p {
					margin-bottom: 37px;
				}
			}

			&:nth-child(3) {
				padding: 78px 30px;

				p {
					margin-bottom: 37px;
				}
			}

			&:nth-child(4) {
				padding: 58px 30px;

				p {
					margin-bottom: 37px;
				}
			}

			&:nth-child(5) {
				padding: 48px 30px;

				p {
					margin-bottom: 37px;
				}
			}

			&.bright {
				background: #5bb037;
				.price {
					font-weight: bold;
					font-size: 42px;
				}
			}

			h3 {
				font: 23px/27px H-Black;
				margin-bottom: 25px;
			}// h3
			p {
				font: 21px/25px H-Roman;
				margin: 0 0 60px;
			}// p
			span, a, b, i {
				display: block;
			}// span, a
			span.small-title {
				font: 39px/45px H-Roman;
				margin-bottom: 10px;
			}// span.small-title
			span.price {
				font: 35px/38px H-Roman;
				margin-bottom: 15px;
				text-shadow: 0 5px 10px rgba(0,0,0,.25); // drop shadow
				i.fa-rub {
					font-size: 40px;
					display: inline-block;
				}// i.fa-rub
			}// span.price
			a.order-btn {
				text-align:center;
				color: #ffffff;
				font: 15px/16px H-Medium;
				border: 3px solid;
				padding: 5px 10px;
				width: 130px;
				margin: 0 auto;
				&:hover {
					opacity: 0.8;
				}// hover
			}// a.order-btn

			&.mark {
				background: #ffffff;
				width: 240px;
				color: #1d2b31;
				text-shadow: 0 0 2px rgba(0,0,0,0.6);
				padding: 24px 0 40px 0;
				box-shadow: 0 0 10px rgba(0,0,0,0.6);
				a.order-btn {
					text-shadow: 0 0 0;
					color: #1d2b31;
					&:hover {
					opacity: 0.6;
				}// hover
				}// a.order-btn
				h3 {
					background: url("../design/icons/card_icon.png") no-repeat top center;
					display: block;
					padding: 60px 0 0 0;
					margin: 0;
				}// h3
				& > i {
					font: 21px/24px H-Roman;
					margin: 20px 0 35px 0;
				}// i
				b {
					font: 21px/25px H-Medium;
					margin-bottom: 10px;
				}// b
			}// .mark
		}// div.item
	}// div.inner
}// section#tickets

section#gallery {
	background: url("../design/gallery_bg.jpg") no-repeat top center;
	color: #ffffff;
	h2 {
		font: 65px/67px H-Medium;
		text-transform: uppercase;
		text-align: center;
		padding: 70px 0 25px 0;
	}// h2
	span.title {
		display: block;
		text-align: center;
		font: 23px/28px H-LightItalic;
	}// span.title
	div.slider {
		margin: 80px auto 0 auto;
    	width: 945px;
		div.slick-slide {
			margin: 0 15px;
			text-align: center;
			& > div {
				padding: 15px 0;
			}
			a.fancybox {
				display: block;
				position: relative;
				overflow: hidden;
				box-shadow: 0 0 7px rgba(0,0,0,0.4);
				img {
					width: 100%;
					border: 1px solid #bcced6;
					display: block;
				}// img
				span.zoom {
					background: rgba(0,0,0,0.5) url("../design/zoom_bg.png") no-repeat center center;
					width: 100%;
					height: 100%;
					display: none;
					position: absolute;
				}// span.zoom
				&:hover {
					span.zoom {
						display: block;
					}// span
				}// hover
			}// a
		}// div.slick-slide
		.slick-prev {
		    left: -80px;
		    background: url("../design/prev_arrow.png") no-repeat center center;

		}// .slick-prev
		.slick-next {
		    right: -80px;
		    background: url("../design/next_arrow.png") no-repeat center center;
		}// .slick-next
	}// div.slider
}// section#gallery
/* Slick Slider */
.slick-loading .slick-list {
    background: #fff url('../design/ajax-loader.gif') center center no-repeat;
}
/* Arrows */
.slick-prev,
.slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    width: 68px;
    height: 68px;
    display: block;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
    opacity: 0.5;
}
.slick-prev:focus,
.slick-next:focus {
    opacity: 1;
}
.slick-prev:hover,
.slick-next:hover {
    opacity: 1;
}

.slick-prev.slick-disabled,
.slick-next.slick-disabled {
    opacity: .25;
}




.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}
.slick-list {
    position: relative;
    overflow: hidden;
    display: block;
    margin: 0;
    padding: 0;

    &:focus {
        outline: none;
    }

    &.dragging {
        cursor: pointer;
        cursor: hand;
    }
}
.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    left: 0;
    top: 0;
    display: block;

    &:before,
    &:after {
        content: "";
        display: table;
    }

    &:after {
        clear: both;
    }

    .slick-loading & {
        visibility: hidden;
    }
}
.slick-slide {
    float: left;
    height: 100%;
    min-height: 1px;
    [dir="rtl"] & {
        float: right;
    }
    img {
        display: block;
    }
    &.slick-loading img {
        display: none;
    }

    display: none;

    &.dragging img {
        pointer-events: none;
    }

    .slick-initialized & {
        display: block;
    }

    .slick-loading & {
        visibility: hidden;
    }

    .slick-vertical & {
        display: block;
        height: auto;
        border: 1px solid transparent;
    }
}
.slick-arrow.slick-hidden {
    display: none;
}


section#zoj-block {
  min-height: 410px;
  margin: 100px 0 190px 0;
  padding-top: 70px;
	div.inner {
		width: @width;
		position: relative;
		.margin-auto;
		padding: 0 15px;
		div.overlay-zoj {
			background: #1d2b31;
			width: ~"calc(100% - 332px)";
			height: 410px;
			position: absolute;
			margin-left: 332px;
			z-index: 100;
			margin-bottom: -410px;
		}// div.overlay-zoj
		div.tabs {
			width: 280px;
			margin: 50px 0 0 0;
			.i-block;
			a {
				display: block;
				width: 185px;
				text-align: center;
				border-radius: 15px;
				color: #c3de55;
				border: 4px solid;
				font: 30px/32px H-Medium;
				padding: 40px 0;
				border-color: #c3de55;
				&.active {
					background: #a2c029;
					color: #ffffff !important;
					box-shadow: 0 0 5px rgba(0,0,0,0.4);
					border: 4px solid #a2c029;
					position: relative;
					&:after {
						-moz-border-bottom-colors: none;
						-moz-border-left-colors: none;
						-moz-border-right-colors: none;
						-moz-border-top-colors: none;
						border-color: transparent transparent transparent #a2c029;
						border-image: none;
						border-style: solid;
						border-width: 20px;
						content: "";
						position: absolute;
						right: -40px;
						top: 37px;
					}// after

				}// current
				&:hover {
					color: #a2c029;
					border-color: #a2c029;
				}// hover
			}// a
		}// div.tabs
		div.tab-content {
			position: relative;
			z-index: 200;
			.i-block;
			width: 445px;
			color: #ffffff;
			margin: 0 0 0 390px;
			img {
				position: absolute;
				bottom: -31px;
				z-index: 100;
			}// img
			div#zoj img {
				right: 361px;
			}// .tab-content-1 img
			div#no-zoj img {
				right: 318px;
			}// .tab-content-2 img
			h3, span, p {
				z-index: 101;
				position: relative
			}// h3, span, p
			h3 {
				font: 30px/35px H-Bold;
				padding: 40px 0 30px;
			}// h3
			span {
				display: block;
				font: 18px/22px H-Light;
				padding: 0 0 10px 0;
				b {
					font: 21px/25px H-Bold;
				}// b
			}// span
			p {
				display: block;
				padding: 20px 0 0 0;
				font: 17px/28px H-LightItalic;
			}// p
		}// div.tab-content
	}// div.inner
}// section#zoj-block
section#contacts {
	height: 100%;
	min-height: 709px;
	.clear;
	background: #1d2b31;
	div.container {
		width: @width;
		.margin-auto;
		position: relative;
		img.ya-map {
			position: absolute;
			left: -398px;
		}// img.ya-map
	}// div.container
	div.inner {
		width: 670px;
		float: right;
		height: 100%;
		color: #ffffff;
		background: #1d2b31;
		padding: 0 15px 0 80px;
		h2 {
			font: 65px/67px H-Medium;
			text-transform: uppercase;
			margin: 80px 0 30px 0;
		}// h2
		span.adress {
			display: block;
			font: 20px/31px H-Light;
		}// span.adress
		a.shema,
		span.oper-time,
		a.telephone,
		a.mail {
			font-size: 21px;
			line-height: 25px;
			padding: 10px 0;
			margin: 20px 0;
			display: block;
		}
		a.shema {
			background: url("../design/icons/map_mark.png") no-repeat 4px center;
			padding-left: 45px;
			color: #a2c029;
			font-family: H-Medium;
			span {
				border-bottom: 1px solid;
				display: inline-block;
				&:hover {
					border-bottom: 1px solid #1d2b31;
				}// hover
			}// span
		}//a.shema
		span.oper-time {
			background: url("../design/icons/clock_g.png") no-repeat left center;
			padding-left: 45px;
			font-family: H-Roman;
			display: block;
		}// span.oper-time
		a.telephone {
			background: url("../design/icons/phone_g.png") no-repeat left center;
			padding-left: 45px;
			font-family: H-Bold;
			color: #ffffff;
		}// a.telephone
		a.mail {
			background: url("../design/icons/mail_g.png") no-repeat left center;
			padding-left: 45px;
			font-family: H-Roman;
			display: block;
			color: #ffffff;
		}// a.mail
		a.green-btn {
			padding: 10px 70px;
		}// a.green-btn
		div.context{
			padding-top: 20px;
			img{
				position: absolute;
				top: 5;
			}
			a{
				padding-top: 25px;
				font-size: 20px;
			&:hover{
				color: #a2c029;
			}
			}
			div.text-context{
				padding-left: 50px;
				line-height: 32px;
			}
		}
		div.copyright {
			.clear;
			position: relative;
			padding: 40px 0 0 0;
			font: 16px/18px H-Roman;
			span {
				float: left;
				display: inline-block;
			}// span
			b {
				float: right;
				display: inline-block;
				i {
					display: inline-block;
					border-bottom: 1px solid;
				}//i
			}// b
		}// div.copyright
	}// div.inner
}// section#contacts

.input {
	position: relative;
	z-index: 1;
	display: inline-block;
	margin: 1em;
	max-width: 350px;
	width: calc(100% - 2em);
	vertical-align: top;
}

.input__field {
	position: relative;
	display: block;
	float: right;
	padding: 0.8em;
	width: 60%;
	border: none;
	border-radius: 0;
	background: #f0f0f0;
	color: #aaa;
	font-weight: bold;
	font: 24px/25px H-Roman;
	-webkit-appearance: none; /* for box shadows to show on iOS */
}

.input__field:focus {
	outline: none;
}

.input__label {
	font: 24px/25px H-Roman;
	display: inline-block;
	float: right;
	padding: 0;
	width: 40%;
	color: #6a7989;
	font-weight: bold;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.input__label-content {
	position: relative;
	display: block;
	padding: 0;
	width: 100%;
	border-bottom: 2px solid #888888;
	padding: 15px 0;
}
label.error {
	span {
		color: #ffaeae;
		border-bottom: 2px solid #ffaeae;
	}// span
	&:after {
		border-color: #ffaeae;
	}// after
}// label.error span

.graphic {
	position: absolute;
	top: 0;
	left: 0;
	fill: none;
}

.icon {
	color: #ddd;
	font-size: 150%;
}

/* Individual styles */


/* Jiro */
.input--jiro {
	margin-top: 2em;
}

.input__field--jiro {
	padding: 35px 15px 10px 15px;
	width: 100%;
	background: transparent;
	color: #585858;
	opacity: 0;
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
	font: 20px/24px H-Roman;
}

.input__label--jiro {
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: left;
	pointer-events: none;
}

.input__label-content--jiro {
	-webkit-transition: -webkit-transform 0.3s 0.3s;
	transition: transform 0.3s 0.3s;
}

.input__label--jiro::before,
.input__label--jiro::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
}

.input__label--jiro::before {
	-webkit-transform: translate3d(0, 100%, 0) translate3d(0, -2px, 0);
	transform: translate3d(0, 100%, 0) translate3d(0, -2px, 0);
	-webkit-transition-delay: 0.3s;
	transition-delay: 0.3s;
}

.input__label--jiro::after {
	z-index: -1;
	background: #ffffff;
	border: 2px solid #a2c029;
	-webkit-transform: scale3d(1, 0, 1);
	transform: scale3d(1, 0, 1);
	-webkit-transform-origin: 50% 0%;
	transform-origin: 50% 0%;
	border-radius: 5px;
}

.input__field--jiro:focus,
.input--filled .input__field--jiro {
	opacity: 1;
	-webkit-transition-delay: 0.3s;
	transition-delay: 0.3s;
}

.input__field--jiro:focus + .input__label--jiro .input__label-content--jiro,
.input--filled .input__label-content--jiro {
	-webkit-transform: translate3d(0, -80%, 0);
	transform: translate3d(0, -80%, 0);
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	border: 0;
	position: relative;
	top: 30px;
	left: 15px;
	font: 15px/16px H-Roman;
}

.input__field--jiro:focus + .input__label--jiro::before,
.input--filled .input__label--jiro::before {
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}

.input__field--jiro:focus + .input__label--jiro::before,
.input--filled .input__label--jiro::before {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

.input__field--jiro:focus + .input__label--jiro::after,
.input--filled .input__label--jiro::after {
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
	-webkit-transition-delay: 0.3s;
	transition-delay: 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}


.fancybox-skin {
	 h2 {
		color: #000000;
		font: 35px/39px H-Bold;
		margin-bottom: 25px;
	}// h2
	p {
		font: 18px/24px H-Roman;
	}
}// .fancybox-skin

#popupform, #catalog-order {
    display: none;
    width: 400px;
	.error {
	    color: #c00000;
	}// .error
	h2 {
	    margin-bottom: 10px;
	}// h2
	.button {
	    display: block;
	    color: #ffffff;
	    cursor: pointer;
	    margin: 10px 0;
	    width: 100%;
	}// .button
}// #popupform

#catalog-order {
	width: 500px;
	h2 {
		width: 98%;
		margin-bottom: 30px;
	}

	.order-item {
		display: flex;
		justify-content: space-between;
		.item-img {
			height: auto;
			width: 150px;

		}

		.item-description {
			width: 335px;

			h4 {
					margin:0 0 10px;
					font: 21px H-Medium;
				}
				p {
					font: 17px H-LightItalic;
				}
		}
	}

	#form-order {
		width: 98%;
	}
	.input {
		margin: 10px 0;
		max-width: 100%;

	}
	.input__field {
		height: 30px;
		width: 100%;

	}

	.green-btn {
		margin-top: 30px;
	}
}




section#order-form {
	padding: 0 0 190px 0;
	h2 {
		text-align: center;
		font: 65px/73px H-Medium;
		text-transform: uppercase;
		margin: 0 auto 60px auto;
		text-shadow: 0 0 4px rgba(0,0,0,0.5);
	}// h2
	form {
		border: 9px solid @color-g;
		display: block;
		width: 1140px;
		margin: 0 auto;
		border-radius: 120px;
		padding: 50px 90px;
		position: relative;
		span.input {
			max-width: 250px;
			margin: 0 30px 0 0;
			&.phone-span {
				max-width: 360px;
			}// .phone-span
		}// span.input
		.green-btn {
			width: 250px;
			position: absolute;
			height: 50px;
			top: 0;
			bottom: 0;
			margin: auto 0;
		}// .green-btn
	}// form
}// section#order-form

section#tickets div.inner div.item.mark h3 {
	text-shadow: 0 5px 10px rgba(0,0,0,.6); // drop shadow
	font-family: H-Black;
}
section#tickets div.inner div.item.mark > i{
	text-shadow: 0 5px 10px rgba(0,0,0,.6); // drop shadow
	font-family: H-Italic;
}
section#tickets div.inner div.item.mark b{
	text-shadow: 0 5px 10px rgba(0,0,0,.6); // drop shadow
	font-family: H-Medium;
}
section#tickets div.inner div.item.mark a.order-btn{
	padding: 15px 10px;
}
section#tickets div.inner div.item a.order-btn{
	padding: 15px 10px;
}

.weonmaps{
	position: absolute;
	left: -200px;
	display: block;
	padding-top: 100px;
}

	@media screen and (max-width: 480px) {
		section#about div.inner div.text p {
	  		background-color: lightgreen;
	  		font-size: 5px;
	    }
	}

#notifications {
	padding: 15px 10px 13px;
	width: 100%;
	text-align: center;
	font-size: 135%;
}