/*
=============================================================================================
																		   REGISTER FORM PAGE
=============================================================================================
*/

.register{}


.container-960.lower.register{
	min-height:			230px;
}

header .pageInfo{
	width:				370px;
	margin-left:		0px
}

header .pageInfo h1{
	font-size:			36px;
	line-height:		36px
}

/************************************/
/*	PAGE INFO - LOGO AND TITLE		*/
/************************************/

.register header{
	margin-bottom:		20px;
}


.roundButtonResize.large{
	margin-right:		40px
}


.register header .linkArea{
	position:			absolute;
	right:				0px;
	top:				0px;
}

.register header .linkArea a{
	font-size:			16px;
}


/************************************/
/*	HEADER REGISTER STEPS			*/
/************************************/

header ul.registerSteps{
	display:			inline-block;
	text-align:			right;
	position:			absolute;
	right:				0px;
	top:				50px;
	margin-right:		-8px;
}

/* INACTIVE */
header ul.registerSteps li{
	display:			inline-block;
	vertical-align:		top;
	width:				90px;
	text-align:			center;
	font-size:			0px;
}

header ul.registerSteps li h1{
	display:			block;
	text-align:			center;
	font-family: 		'Poiret One', cursive;
	line-height:		50px;
	font-size:			30px;
	color:				#c7c7c7;
	width:				50px;
	height:				50px;
	margin:				0 auto;
	border-radius:		50px;
	border:				1px solid #c7c7c7;
}

header ul.registerSteps li span{
	display:			inline-block;
	font-size:			14px;
	margin-top:			5px;
	text-align:			center;
	font-weight:		400;
	color:				#c7c7c7;
}

header ul.registerSteps li.arr{
	display:			inline-block;
	vertical-align:		middle;
	margin:				0px -31px 0px -25px;
	margin-top:			20px;
	
}

header ul.registerSteps li.arr div{
	display:			inline-block;
	width:				12px;
	height:				12px;
	border:				1px solid #c7c7c7;
	border-radius:		30px;
	margin-right:		6px;
}

/* ACTIVE */
header ul.registerSteps li.active h1{
	background-color:	#e30075;
	color:				#ffffff;
	border:				1px solid #e30075;
}

header ul.registerSteps li.active span{
	color:				#585858
}

header ul.registerSteps li.arr.active div{
	border:				1px solid #e30075;
}



/************************************/
/*	SIDEBAR REGISTER STEPS			*/
/************************************/

.register .left ul{
	padding:			0px;
}

.register .left li{
	display:			block;
	margin:				0 auto;
	text-align:			center;
}

.register .left li h1{
	display:			block;
	text-align:			center;
	font-family: 		'Poiret One', cursive;
	line-height:		62px;
	font-size:			34px;
	color:				#c7c7c7;
	width:				62px;
	height:				62px;
	margin:				0 auto;
	border-radius:		50px;
	border:				1px solid #c7c7c7;
}

.register .left li span{
	display:			block;
	font-size:			14px;
	margin-top:			5px;
	text-align:			center;
	font-weight:		400;
	color:				#c7c7c7;
}

.register .left li.active h1{
	color:				#e30075;
	border:				1px solid #e30075;
}

.register .left li.active span{
	color:				#585858
}

#step-1{
	margin-top:			45px;
}


/************************************/
/*	COLUMNS							*/
/************************************/

.register .left{
	width:				190px;
	margin-right:		45px;	
}

.register .right{
	width:				720px;
}


/************************************/
/*	SELECT ACCOUNT TYPE RADIO		*/
/************************************/

.radio.accountType input[type="radio"]{
	display:			none;
}

.radio.accountType {
	position: 			relative;
	margin-right:		10px;
	margin-top:			18px;
	display:			inline-block;
	vertical-align:		top;
	margin:				0px 23px;	
}

.radio.accountType label {
	display: 			block;
	width: 				188px;
	height: 			206px;
	text-align:			center;
	font-size:			30px;
	color:				#c6c6c6;
	cursor: 			pointer;
	background-repeat:	no-repeat;
	background-position:top;
	position:			relative;
	opacity:			0.7;
	moz-transition: 	all 0.2s ease-out;
	-webkit-transition: all 0.2s ease-out;
	-o-transition: 		all 0.2s ease-out;
	-ms-transition: 	all 0.2s ease-out;
	transition: 		all 0.2s ease-out;
}

.radio.accountType label:hover {
	opacity:			1;
}

.radio.accountType label img{
	opacity:			0;
	moz-transition: 	all 0.4s ease-out;
	-webkit-transition: all 0.4s ease-out;
	-o-transition: 		all 0.4s ease-out;
	-ms-transition: 	all 0.4s ease-out;
	transition: 		all 0.4s ease-out;
}

.radio.accountType label span{
	display:			block;
	font-weight:		300;
	moz-transition: 	all 0.4s ease-out;
	-webkit-transition: all 0.4s ease-out;
	-o-transition: 		all 0.4s ease-out;
	-ms-transition: 	all 0.4s ease-out;
	transition: 		all 0.4s ease-out;	
}

.radio.accountType label img.select{
	display:			inline-block;
	position:			absolute;

}

.radio.accountType input[type=radio]:checked + label{
	opacity:			1;	
}

.radio.accountType input[type=radio]:checked + label span {
	color:				#e30074;
}

.radio.accountType input[type=radio]:checked + label img{
	opacity:			1;
}


.radio.accountType label.man {
	background-image:	url(/img/registration/manGray.png);
}

.radio.accountType label.man img.select{
	right:				-27px;
	bottom:				12px;
}


.radio.accountType label.woman {
	background-image:	url(/img/registration/womanGray.png);
}

.radio.accountType label.woman img.select{
	right:				-1px;
	bottom:				12px;
}


.radio.accountType label.employer {
	background-image:	url(/img/registration/employerGray.png);
}

.radio.accountType label.employer img.select{
	right:				-34px;
	bottom:				12px;
}


/************************************/
/*	CUSTOM CHECKBOX STYLE			*/
/************************************/

.checkbox input[type="checkbox"]{
	display:			none;
}

.checkbox {
	position: 			relative;
	display:			inline-block;
	vertical-align:		top;	
}

.checkbox label {
	display: 			block;
	height: 			28px;
	text-align:			left;
	font-size:			16px;
	color:				#585858;
	cursor: 			pointer;
	position:			relative;
	opacity:			1;
}


.checkbox label span.field{
	position:			absolute;
	width:				26px;
	height:				26px;
	border:				dashed 1px #c6c6c6;
	border-radius:		8px;
	font-family: 		'Raleway' , seans-serif;
	font-weight: 		400;
	font-size:			16px;
	moz-transition: 	all 0.4s ease-out;
	-webkit-transition: all 0.4s ease-out;
	-o-transition: 		all 0.4s ease-out;
	-ms-transition: 	all 0.4s ease-out;
	transition: 		all 0.4s ease-out;
}

.checkbox label span.field.error{
	border:				dashed 1px #e30075;
	-webkit-box-shadow: 0px 0px 7px 0px rgba(222,0,122,1), inset 0px 0px 7px 0px rgba(222,0,122,1);
	-moz-box-shadow: 	0px 0px 7px 0px rgba(222,0,122,1), inset 0px 0px 7px 0px rgba(222,0,122,1);
	box-shadow: 		0px 0px 7px 0px rgba(222,0,122,1), inset 0px 0px 7px 0px rgba(222,0,122,1);
}

.checkbox label span{
	display:			inline-block;
	vertical-align:		middle;
	font-weight:		300;
}

.checkbox label a{
	display:			inline-block;
	vertical-align:		middle;
	font-weight:		300;
	text-decoration:	underline;
}

.checkbox label img{
	display:			inline-block;
	vertical-align:		middle;
	margin-right:		15px;
	opacity:			0;
	moz-transition: 	all 0.2s ease-out;
	-webkit-transition: all 0.2s ease-out;
	-o-transition: 		all 0.2s ease-out;
	-ms-transition: 	all 0.2s ease-out;
	transition: 		all 0.2s ease-out;
}


.checkbox input[type=checkbox]:checked + label img{
	opacity:			1;		
}

/************************************/
/*	STEPS 							*/
/************************************/

.registrationStep{
	max-height:			1000px;
	margin-bottom:		30px;
	opacity:			1;
	moz-transition: 	all 1.5s ease-out;
	-webkit-transition: all 1.5s ease-out;
	-o-transition: 		all 1.5s ease-out;
	-ms-transition: 	all 1.5s ease-out;
	transition: 		all 1.5s ease-out;
}

.registrationStep.hidden{
	visibility:			hidden;
	max-height:			0px;
	opacity:			0;
}


/************************************/
/*	REGISTRATION FORM				*/
/************************************/

.registrationStep .row{
	width:				100%;
	margin-bottom:		15px;
	position:			relative;
}


.registrationStep .row h1{
	display:			block;
	color:				#e30075;
	font-weight:		100;
	margin-bottom:		10px;
}

.registrationStep .row .fieldContainer{
	display:			inline-block;
	vertical-align:		top;
}

.registrationStep .row .fieldContainer input[type="text"], .registrationStep .row .fieldContainer input[type="password"]{
	border:				dashed 1px #c6c6c6;
	border-radius:		13px;
	padding:			5px 10px;
	width:				210px;	
	color:				#585858;
	font-family: 		'Raleway' , seans-serif;
	font-weight: 		400;
	font-size:			16px;
	margin-right:		25px;
	moz-transition: 	all 0.4s ease-out;
	-webkit-transition: all 0.4s ease-out;
	-o-transition: 		all 0.4s ease-out;
	-ms-transition: 	all 0.4s ease-out;
	transition: 		all 0.4s ease-out;
}

.registrationStep .row .fieldContainer input[type="text"].error, .registrationStep .row .fieldContainer input[type="password"].error{
	border:				dashed 1px #e30075;
	-webkit-box-shadow: 0px 0px 7px 0px rgba(222,0,122,1), inset 0px 0px 7px 0px rgba(222,0,122,1);
	-moz-box-shadow: 	0px 0px 7px 0px rgba(222,0,122,1), inset 0px 0px 7px 0px rgba(222,0,122,1);
	box-shadow: 		0px 0px 7px 0px rgba(222,0,122,1), inset 0px 0px 7px 0px rgba(222,0,122,1);
}


.registrationStep .row .fieldContainer select{
	background-color:	transparent;
	background-image:	url(/img/registration/arrow.png);
	background-repeat:	no-repeat;
	background-position:right top;
	border:				dashed 1px #c6c6c6;
	border-radius:		13px;
	padding:			5px 10px;
	width:				233px;	
	color:				#585858;
	font-family: 		'Raleway' , seans-serif;
	font-weight: 		400;
	font-size:			16px;
	margin-right:		25px;
	moz-transition: 	all 0.4s ease-out;
	-webkit-transition: all 0.4s ease-out;
	-o-transition: 		all 0.4s ease-out;
	-ms-transition: 	all 0.4s ease-out;
	transition: 		all 0.4s ease-out;
	appearance:			none;
	-moz-appearance: 	none;
	-webkit-appearance:	none;
    text-indent: 		0.01px;
    text-overflow: 		'';
}

.registrationStep .row .fieldContainer select:hover{
	cursor:				pointer;
}

.registrationStep .row .fieldContainer select::-ms-expand {
    display: none;
}

.registrationStep .row .fieldContainer select.error{
	border:				dashed 1px #e30075;
	-webkit-box-shadow: 0px 0px 7px 0px rgba(222,0,122,1), inset 0px 0px 7px 0px rgba(222,0,122,1);
	-moz-box-shadow: 	0px 0px 7px 0px rgba(222,0,122,1), inset 0px 0px 7px 0px rgba(222,0,122,1);
	box-shadow: 		0px 0px 7px 0px rgba(222,0,122,1), inset 0px 0px 7px 0px rgba(222,0,122,1);
}

.registrationStep .row p{
	color:				#585858;
	font-size:			14px;
	font-weight:		400;
	margin-top:			10px;
}

.registrationStep .row p.error{
	font-size:			14px;
	color:				#e30075;
}


.registrationStep .row .checkbox.profession{
	display:			inline-block;
	width:				160px;
	margin-right:		15px;
}


.registrationStep .submitForm{
	display:			block;
	margin:				0 auto;
	text-align:			center;
	width:				160px;
	height:				150px;
	padding:			15px 10px;
	border-radius:		250px;
	border:				3px solid #e30075;
	moz-transition: 	all 0.4s ease-out;
	-webkit-transition: all 0.4s ease-out;
	-o-transition: 		all 0.4s ease-out;
	-ms-transition: 	all 0.4s ease-out;
	transition: 		all 0.4s ease-out;
}


.registrationStep .submitForm.disabled{
	border:				3px solid #c7c7c7;
	color:				#c7c7c7;
}

.registrationStep .submitForm.disabled:hover{
	border:				3px solid #c7c7c7;
	color:				#c7c7c7;
	background-color:	transparent;
	cursor:				default;
}

.registrationStep .submitForm:hover{
	color:				#FFF;
	background-color:	#e30075;
	cursor:				pointer;
}

.registrationStep .submitForm h1{
	line-height:		50px;
	margin-top:			37px;
	font-size:			32px;
	font-weight:		300;
	margin-bottom:		-5px;
}

.registrationStep .submitForm h3{
	font-size:			13px;
	font-size:			400;
}


.registrationStep#finalize h2{
	color:				#c7c7c7;
	margin-bottom:		20px;
	margin-top:			20px;
	font-size: 			26px;
	text-align:			center;
	opacity:			1;
	moz-transition: 	all 0.4s ease-out;
	-webkit-transition: all 0.4s ease-out;
	-o-transition: 		all 0.4s ease-out;
	-ms-transition: 	all 0.4s ease-out;
	transition: 		all 0.4s ease-out;
}

.registrationStep#finalize #notofication.hidden{
	opacity:			0;
}


/* facebook login btn */
.facebookRegistration{
	margin-bottom:		15px
}

.facebookRegistration .outerBox .circle{
	background-color:	#375792
}


.facebookRegistration:hover{
	color:				#375792
}


/* facebook sync btn */
.fbSync{
	display:			block
} 

.fbSync.hidden{
	display:			none
}

.fbSync img{
	display:			inline-block;
	vertical-align:		middle;
	margin-right:		30px	
}

.fbSync div{
	display:			inline-block;
	vertical-align:		middle
}


/* facebook notify */
.fbNotify{
	display:			inline-block;
	margin-left:		230px;
	padding:			10px;
	border-radius:		15px;
	background-color:	#375792;
	color:				#FFFFFF;
	margin-bottom:		40px
}

.fbNotify img{
	display:			inline-block;
	vertical-align:		middle;
	margin-right:		15px;
	margin-left:		10px
}

.fbNotify div{
	display:			inline-block;
	vertical-align:		middle;
	margin-right:		10px
}

#pass.hidden{
	display:			none
}



.registrationStep .submitForm.disabled{
	border:				3px solid #c7c7c7;
	color:				#c7c7c7;
}

.registrationStep .submitForm.disabled:hover{
	border:				3px solid #c7c7c7;
	color:				#c7c7c7;
	background-color:	transparent;
	cursor:				default;
}

.registrationStep .submitForm:hover{
	color:				#FFF;
	background-color:	#e30075;
	cursor:				pointer;
}

.registrationStep .submitForm h1{
	line-height:		50px;
	margin-top:			37px;
	font-size:			32px;
	font-weight:		300;
	margin-bottom:		-5px;
}

.registrationStep .submitForm h3{
	font-size:			13px;
	font-size:			400;
}