@charset "utf-8";
/* CSS Document */

@font-face {
  font-family: 'Ubuntu-Light';
  src: url('../fonts/Ubuntu-Light/Ubuntu-Light.eot?#iefix') format('embedded-opentype'),  url('../fonts/Ubuntu-Light/Ubuntu-Light.woff') format('woff'), url('../fonts/Ubuntu-Light/Ubuntu-Light.ttf')  format('truetype'), url('../fonts/Ubuntu-Light/Ubuntu-Light.svg#Ubuntu-Light') format('svg');
  font-weight: normal;
  font-style: normal;
}


/*3D Flip Styles*/
.flipcontiner {
	position:relative;
	width:312px;
	margin:0 auto;
	-webkit-perspective: 800px;
	-moz-perspective: 800px;
	-o-perspective: 800px;
	perspective: 800px;
}
.login-box {
	position:relative;
	z-index:9;
	top:0px;
}
.fpassword-box {
	position:absolute;
	z-index:8;
	top:0px;
}
.sign-up-box {
	position:absolute;
	z-index:7;
	top:0px;
}
.login-box, .fpassword-box, .sign-up-box, .box-normal {
	opacity:1;
	filter:alpha(opacity=100);
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;
	transition: all 0.5s linear;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
}
.box-fliped {
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transform: rotateY(-180deg);
	-moz-transform: rotateY(-180deg);
	-o-transform: rotateY(-180deg);
	transform: rotateY(-180deg);
}
.fpassword-box.box-fliped {
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transform: rotateY(180deg); 
	-moz-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);
}
.sign-up-box.box-fliped {
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);
}
.login-box-con {
	/*padding:12px;
	border-radius:30px;
	font-size:12px;
	text-align:center;
	color:#434343;
	background:rgba(0, 0, 0, 0.1);
	cursor:pointer;*/
}
.login-box-con, .fpassword-box-con, .sign-up-con {
	cursor:pointer;
}
.login-box, .fpassword-box, .sign-up-box {
	background:#fff url(../images/top_border.png) repeat-x center top;
	width:312px;
	min-height:230px;
	margin-bottom:30px;
	-webkit-box-shadow: 0px 1px 3px #a6a6a6;
	-moz-box-shadow:  0px 1px 3px #a6a6a6;
	-o-box-shadow:  0px 1px 3px #a6a6a6;
	box-shadow:  0px 1px 3px #a6a6a6;

}
.login-box .tittle, .fpassword-box .tittle, .sign-up-box .tittle {
	padding:33px 0;
	font-size:15px;
	color:#373737;
	word-spacing:0.5px;
	text-align:center;
	font: 18px "Ubuntu-Light";;
}
.signup-link {
	background:#f7f7f7;
	border-top:1px solid #cccccc;
	text-align:center;
	font: 14px/25px "Ubuntu-Light";
	color:#1a1a1a;
	padding:13px 0;
	-webkit-border-radius:0px 0px 6px 6px;
	-moz-border-radius:0px 0px 6px 6px;
	-o-border-radius:0px 0px 6px 6px;
	border-radius:0px 0px 6px 6px;
}

.signup-link strong {
	color: #2d7c78;
}



/*3D Flip Styles Ends */

/*Genral Styles*/
body {
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 1rem;
	font-weight:normal;
	background:#f3f5f7;
	padding:0px;
	margin:0px;
}
h1 {
	margin:40px 0;
	padding:0px;
	font: 24px "Ubuntu-Light";;
	color:#2e2e2e;
	text-shadow:1px 0px 1px #fff;
	text-align:center;
}
.wrapper {
}


/*Form Styles*/
.form {
	padding:0 30px 10px 30px;
}
.form input[type=text] {
	display:block;
	width:92%;
	color:#999999;
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size:12px;
	border:1px solid #d6d6d6;
	padding:10px 4%;
	margin-bottom:12px;
	background:#f9f9f9;
}
.form input:hover[type=text] {
	color:#000;
	background:#fff;
}
.form input:focus[type=text] {
	color:#000;
	background:#fff;
}
.form input[type=email] {
	display:block;
	width:92%;
	color:#999999;
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size:12px;
	border:1px solid #d6d6d6;
	padding:10px 4%;
	margin-bottom:12px;
	background:#f9f9f9;
}
.form input:hover[type=email] {
	color:#000;
	background:#fff;
}
.form input:focus[type=email] {
	color:#000;
	background:#fff;
}
.form input[type=password] {
	display:block;
	width:92%;
	color:#999999;
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size:12px;
	border:1px solid #d6d6d6;
	padding:10px 4%;
	margin-bottom:12px;
	background:#f9f9f9;
}
.form input:hover[type=password] {
	color:#000;
	background:#fff;
}
.form input:focus[type=password] {
	color:#000;
	background:#fff;
}
.form input[type=checkbox] {
	margin-right:5px;
	position:relative;
	top:2px;
}
.form p {
	font-size:13px;
	margin:10px 0;
}
.form .greenbtn {
	border:0px solid;
	box-shadow:0 7px 0 #528f04;
	border-radius:4px;
	margin:10px 0;
	cursor:pointer;
	background:#6dbb0a;
	width:150px;
	height:40px;
	color:#fff;
	text-shadow:0px 1px 1px #528f04;
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-weight:600;
	font-size:14px;
}
.form .greenbtn:hover {
	position:relative;
	top:-2px;
	box-shadow:0 9px 0 #528f04;
}
.form .greenbtn:active {
	position:relative;
	top:4px;
	box-shadow:0 5px 0 #528f04;
}
.form .redbtn {
	border:0px solid;
	box-shadow:0 7px 0 #8f0408;
	border-radius:4px;
	margin:10px 0;
	cursor:pointer;
	background:#cc1217;
	width:150px;
	height:40px;
	color:#fff;
	text-shadow:0px 1px 1px #8f0408;
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-weight:600;
	font-size:14px;
}
.form .redbtn:hover {
	position:relative;
	top:-2px;
	box-shadow:0 9px 0 #8f0408;
}
.form .redbtn:active {
	position:relative;
	top:4px;
	box-shadow:0 5px 0 #8f0408;
}
.form .bluebtn {
	border:0px solid;
	box-shadow:0 7px 0 #0083a2;
	border-radius:4px;
	margin:10px 0;
	cursor:pointer;
	background:#00acd5;
	width:150px;
	height:40px;
	color:#fff;
	text-shadow:0px 1px 1px #0083a2;
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-weight:600;
	font-size:14px;
}
.form .bluebtn:hover {
	position:relative;
	top:-2px;
	box-shadow:0 9px 0 #0083a2;
}
.form .bluebtn:active {
	position:relative;
	top:4px;
	box-shadow:0 5px 0 #0083a2;
}


div.msg, div.msg p {
	font: bold 13px/22px tahoma;
	/*text-align: center;*/	
}

div.msg {
	margin-bottom: 20px;	
}
	

div.msg.error {
	color: #e93735;
}

div.msg.success {
	color: #008000;
}


