*{
	box-sizing:border-box;
}
.solid-line{
	width:100%;
	display:block;
	border-bottom:1px solid #bbb;
}
input.fan-form,select.fan-form,textarea.fan-form{
	width:100%;
	border-radius:4px;
	border:1px solid #bbb;
	padding:10px;
	background:#fff;
}
input.fan-form:focus{
	background:#eee;
}
input[type=submit].fan-form{
	color:#efefef;
	border:1px solid rgb(18,118,81);
	background:linear-gradient(rgb(7,143,229),40%,rgb(1,92,228));
	background:linear-gradient(rgb(255,99,23),40%,rgb(242,71,24));
	background:linear-gradient(rgb(119,186,29),40%,rgb(53,166,26));
	background:linear-gradient(rgb(220,220,220),1%,rgb(10,186,32),98%,rgb(6,130,22));
}
.form-field{
	width:100%;
	display:table;
	margin:10px auto 20px;
	outline:px solid red;
}
.form-field label{
	width:40%;
	padding:6px;
	float:right;
	display:block;
	text-align:right;
	direction: rtl;
	font-weight:bold;
	color:#555;
	outline:0px solid blue;
}
.form-field input[type=text],.form-field input[type=password],.form-field textarea,.form-field select{
	width:60%;
	float:right;
	padding:9px;
	display:block;
	border-radius:2px;
	border:1px solid #bbb;
	background:#fff;
	box-shadow:1px 2px 4px 0 rgba(0, 0, 0, 0.08);
	outline:0px solid blue;
}
.form-field input[type=text]:hover,.form-field input[type=password]:hover,.form-field textarea:hover{
	border-color:rgb(27, 111, 247);
}
.form-field input[type=text]:focus,.form-field input[type=password]:focus,.form-field textarea:focus{
	border-color:rgb(27, 111, 247);
}
.form-field input[type=submit]{
	display:table;
	font-weight:bold;
	height:auto;
	cursor:pointer;
	padding:7px 0px;
	background:rgb(3,98,175);
	background:linear-gradient(rgb(3,98,175),80%,rgb(2,77,138));
	border-radius:3px;
	box-shadow:0px 1px 1px rgba(0,0,0,.4);
	border:px solid rgb(2,77,138);
	border-bottom:0px solid rgb(2,77,138);
	outline:0px solid blue;
}
.form-field input[type=submit]:active{
	border-bottom:0px solid rgb(2,77,138);
	background:linear-gradient(rgb(3,98,175),95%,rgb(2,77,138));
	box-shadow:0px 1px 1px rgba(0,0,0,0.2);
}
.form-field input[type=submit].fan-submit{
	border:none;
	font-weight:normal;
	direction:rtl;
	padding:10px 20px;
	color:#fff;
	background:rgb(27, 111, 247);
	box-shadow:0px 2px 2px rgba(0,0,0,0.3);
}
.form-field input[type=submit].fan-submit:hover{
	background:rgb(4, 98, 249);
}
.form-field input[type=submit].fan-submit-red{
	border:none;
	font-weight:normal;
	padding:10px 20px;
	color:#fff;
	background:rgb(244, 83, 66);
	box-shadow:0px 2px 2px rgba(0,0,0,0.3);
}
.form-field input[type=submit].fan-submit-red:hover{
	background:rgb(237, 66, 47);
}
.form-field input[type=submit].fan-submit-grey{
	border:none;
	font-weight:normal;
	padding:10px 20px;
	color:#fff;
	background:grey;
	box-shadow:0px 2px 2px rgba(0,0,0,0.3);
}
.form-field input[type=submit].fan-submit-grey:hover{
	background:#707070;
}
.form-field input[type=checkbox]{
	float:right;
	margin-top:12px;
	margin-left:px;
	width:auto;
}
#signup-wrap{
	width:90%;
	max-width:550px;
	margin:40px auto;
	display:table;
}
#signup-form{
	float:right;
	width:100%;
	border:0px solid #bbb;
	border-radius:3px;
	background:#fff;
	box-shadow:0px 1px 2px rgba(0,0,0,0.3);
	/*box-shadow:0px 1px 3px 0px rgba(0, 0, 0, 0.1);*/
	display:table;
}
#signup-form-head{
	width:90%;
	margin:0px auto;
	text-align:center;
	padding:20px 0px;
	font-weight:bold;
	font-size:18px;
	border-bottom:2px solid rgb(3,98,175);
}
#signup-form-body{
	width:90%;
	margin:20px auto;
	display:table;
}
.signup-steps-wrapper{
	height:auto;
	width:90%;
	max-width:550px;
	outline:0px solid red;
	margin:0px auto 10px;
	padding-bottom:2px;
	display:block;
	overflow:hidden;
}
.signup-step{
	float:right;
	width:14%;
	margin:0px 3%;
	padding:5% 0px 5%;
	border-radius:100%;
	background:white;
	font-size:12px;
	text-align:center;
	outline:0px solid red;
	display:inline-block;
	box-shadow:1px 1px 1px 1px rgba(0,0,0,.1);
}
.signup-step.passed{
	background:rgb(27, 111, 247);
	color:white;
}
.signup-step.current{
	background:grey;
	color:white;
}

@media ( max-width: 800px){
	#signup-wrap{
		width:80%;
		margin-top:20px;
	}
	#signup-form{
		width:100%;
	}
}
@media (max-width: 480px){
	#signup-wrap{
		width:90%;
		margin-top:0;
		margin-bottom:0;
	}
	.form-field label{
		width:100%;
	}
	.form-field input[type=submit].fan-submit, .form-field input[type=submit].fan-submit-red{
		width:100%;
	}
	.form-field input[type=text],.form-field input[type=password], .form-field textarea,.form-field select{
		width:100%;
	}
	.signup-steps-wrapper{
		width:95%;
	}
	.signup-step{
		margin:0px 0.2%;
		width:19%;
		padding:6% 0px 6%;
		font-size:10px;
	}
}