.welcome-wrap {
	width: 1000px;
	margin: 0 auto;
	text-align: center;
}

.step { position: relative; width: 1080px; background-color: #ebebeb; margin: 0 auto; }

#step_1 .top { background-color: #fff; margin-top: 5%; margin-bottom: 5%; }
#step_1 .top .title { font-size: 1.7em; font-weight: bold; text-align: center; text-transform: uppercase; padding: 2% 0; }
#step_1 .top hr { width: 40%; height: 2px; background-color: #000; border: none; margin: auto; }
#step_1 .top .text { text-align: center; padding: 2% 0 3%; }
#step_1 .points { width: 74%; margin-left: 13%; }
#step_1 #img_step_1 { width: 100%; }


#step_2 .content { height: 80%; }
#step_2 .top { background-color: #fff; margin-bottom: 5%; text-align: center; margin-top: 5%; padding: 3% 22%; }
#step_2 figure { padding: 0 15%; }


#step_3 .content { height: 80%; }
#step_3 .top { background-color: #fff; margin-bottom: 8%; text-align: center; margin-top: 5%; padding: 3% 18% 3.5%; }
#step_3 .controll .prev { margin-right: 30%; }
#step_3 .controll .next { float: right; height: 56%; width: 43%; padding-top: 2.2%; font-size: 1.8em; text-transform: uppercase; color: #fff; }
#step_3 .controll .points { width: 14%; }
#step_3 .controll .points span { width: 18%; }
#step_3 .controll .points span.activ, #step_3 .controll .points span:hover { width: 16%; }
#step_3 .controll .next { display: inline-block; margin-top: 2%; }



#step_2, #step_3 { display: none; }



.controls { height: 80px; padding-top: 10px; }
.controls div { float: left; margin: 2% 0; }
.controls .prev, .controls .next { cursor: pointer; width: 13%; height: 70%; background-color: #0d4355; text-align: center; }
.controls .prev img, .controls .next img { margin-top: 8%; }
.controls .points { width: 15px; height: 15px; text-align: center; margin-top: 5.5%; }
.controls .points span { display: inline-block; vertical-align: middle; cursor: pointer; background-color: #0d4355; width: 15px; height: 15px; border-radius: 50%; }
.controls .points span.active { background-color: #ebebeb; width: 11px; height: 11px; border-radius: 50%; border: 2px solid #0d4355; }article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden],template{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a{background:0 0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}
.clear {clear: both;}
.kinomap-button {
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FDCC24',endColorstr='#FDB824');
	background: -webkit-gradient(linear, left top, left bottom, from(#FDCC24), to(#FDB824));
	background: linear-gradient(to bottom, #FDCC24 0%, #FDB824 100%) repeat-x scroll 0 0 transparent;
	border: 1px solid #FDCC24;
	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.05), 0 1px 0 0 rgba(255, 255, 255, 0.2) inset;
	user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	border-radius: 3px;
	cursor: pointer;
	display: inline-block;
	font-size: 12px;
	line-height: 32px;
	height: 32px;
	color: #000000;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
	transition: all 0.05s linear 0s;
	padding: 0 10px;
	font-family: Arial;
}
.kinomap-button:hover {
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFDE6E',endColorstr='#FDCC24');
	background: -webkit-gradient(linear, left top, left bottom, from(#FFDE6E), to(#FDCC24));
	background: linear-gradient(to bottom, #FFDE6E 0%, #FDCC24 100%) repeat-x scroll 0 0 transparent;
	color: #000000;
}
.kinomap-button:active {
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FDB824',endColorstr='#FDCC24');
	background: -webkit-gradient(linear, left top, left bottom, from(#FDB824), to(#FDCC24));
	background: linear-gradient(to bottom, #FDB824 0%, #FDCC24 100%) repeat-x scroll 0 0 transparent;
	color: #000000;
}
.button-submit {
	width: 80px;
}
.button-recover {
	width: 140px;
}
body {
	background: #F1F1F1;
}
.kinomap-form {
	padding: 10px 10px 30px;
	text-align: center;
}
.kinomap-title {
	color: #333333;
	text-align: center;
	width: 280px;
	height: 20px;
	line-height: 20px;
	font-size: 18px;
	text-transform: uppercase;
	font-weight: bold;
	padding: 0 0 20px;
}
.switch-link {
	width: 280px;
	text-align: center;
	font-size: 12px;
}
.validate-button {
	float: right;
	width: 100px;
	text-align: right;
	font-size: 12px;
	padding: 0 10px 0 0;
}
.validate-recover {
	float: right;
	width: 270px;
	text-align: right;
	font-size: 12px;
	padding: 0 10px 0 0;
}
.kinomap-form-field {
	padding: 0 0 10px;
}
.inputfield {
	width: 270px;
	height: 25px;
	line-height: 25px;
	font-size: 16px;
}
.remember {
	padding: 5px 0;
	float: left;
	width: 170px;
}
.login-remember-input {
	vertical-align: middle;
	opacity: 0;
	display: none;
}
.login-remember-text {
	font-weight: bold;
	font-size: 12px;
	display: inline-block;
	cursor: pointer;
	position: relative;
	padding: 0 0 0 25px;
	margin: 0 15px 0 0;
	color: #333333;
}
.login-remember-text:before {
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;
	margin: 0 10px 0 0;
	position: absolute;
	left: 0;
	bottom: 1px;
	background-color: #FFFFFF;
	box-shadow: inset 0px 2px 3px 0px rgba(0,0,0,.3), 0px 1px 0px 0px rgba(255,255,255,.4);
}
.login-remember-input label:before {
	border-radius: 3px;
}
.login-remember-input:checked + label:before {
	content: "\2713";
	text-shadow: 1px 1px 1px rgba(0, 0, 0, .2);
	font-size: 15px;
	color: #333333;
	text-align: center;
	line-height: 15px;
}
.field-label {
	font-size: 12px;
	line-height: 12px;
	display: block;
	margin: 0 0 5px;
}
.linksfield {
	padding: 10px 0 0;
}
.recover-text {
	font-size: 12px;
	padding: 0 0 10px;
}.kinomap-wrap {
	width: 300px;
	margin: 0 auto;
	border: 1px solid #EFEFEF;
	background: #FFFFFF;
	position: relative;
}
.kinomap-logo {
	padding: 30px 0 5px;
	width: 172px;
	margin: 0 auto;
}
.kinomap-logo img {
	background: url(../img/spritesheet.png) no-repeat scroll transparent;height: 40px;width: 172px;
}
.logo-hr {
	border: 0;
	height: 1px;
	background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
	background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
	background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
	background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
}
@media screen and (min-width: 980px) {
	.kinomap-wrap:before, .kinomap-wrap:after {
		content: "";
		position: absolute;
		z-index: -1;
		-webkit-box-shadow: 0 0 30px rgba(0,0,0,0.4);
		-moz-box-shadow: 0 0 30px rgba(0,0,0,0.4);
		box-shadow: 0 0 30px rgba(0,0,0,0.4);
		top: 10px;
		bottom: 10px;
		left: 0;
		right: 0;
		-moz-border-radius: 100px / 10px;
		border-radius: 100px / 10px;
	}
	.kinomap-wrap:after {
		right: 10px;
		left: auto;
		-webkit-transform: skew(8deg) rotate(3deg);
		-moz-transform: skew(8deg) rotate(3deg);
		-ms-transform: skew(8deg) rotate(3deg);
		-o-transform: skew(8deg) rotate(3deg);
		transform: skew(8deg) rotate(3deg);
	}
}
@media screen and (max-device-width: 980px) {
	body {
		background: #FFFFFF;
	}
	.kinomap-wrap {
		border: 0;
	}
}.welcome-wrap {
	width: 1000px;
	margin: 0 auto;
	text-align: center;
}

.step { position: relative; width: 1080px; background-color: #ebebeb; margin: 0 auto; }

#step_1 .top { background-color: #fff; margin-top: 5%; margin-bottom: 5%; }
#step_1 .top .title { font-size: 1.7em; font-weight: bold; text-align: center; text-transform: uppercase; padding: 2% 0; }
#step_1 .top hr { width: 40%; height: 2px; background-color: #000; border: none; margin: auto; }
#step_1 .top .text { text-align: center; padding: 2% 0 3%; }
#step_1 .points { width: 74%; margin-left: 13%; }
#step_1 #img_step_1 { width: 100%; }


#step_2 .content { height: 80%; }
#step_2 .top { background-color: #fff; margin-bottom: 5%; text-align: center; margin-top: 5%; padding: 3% 22%; }
#step_2 figure { padding: 0 15%; }


#step_3 .content { height: 80%; }
#step_3 .top { background-color: #fff; margin-bottom: 8%; text-align: center; margin-top: 5%; padding: 3% 18% 3.5%; }
#step_3 .controll .prev { margin-right: 30%; }
#step_3 .controll .next { float: right; height: 56%; width: 43%; padding-top: 2.2%; font-size: 1.8em; text-transform: uppercase; color: #fff; }
#step_3 .controll .points { width: 14%; }
#step_3 .controll .points span { width: 18%; }
#step_3 .controll .points span.activ, #step_3 .controll .points span:hover { width: 16%; }
#step_3 .controll .next { display: inline-block; margin-top: 2%; }



#step_2, #step_3 { display: none; }



.controls { height: 80px; padding-top: 10px; }
.controls div { float: left; margin: 2% 0; }
.controls .prev, .controls .next { cursor: pointer; width: 13%; height: 70%; background-color: #0d4355; text-align: center; }
.controls .prev img, .controls .next img { margin-top: 8%; }
.controls .points { width: 15px; height: 15px; text-align: center; margin-top: 5.5%; }
.controls .points span { display: inline-block; vertical-align: middle; cursor: pointer; background-color: #0d4355; width: 15px; height: 15px; border-radius: 50%; }
.controls .points span.active { background-color: #ebebeb; width: 11px; height: 11px; border-radius: 50%; border: 2px solid #0d4355; }