/*--
Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
--*/
/* reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;font-family: "Myriad Pro" , "Liberation Sans", "Numbus Sans L", "Helvetica Neue";}
ol,ul{list-style:none;margin:0px;padding:0px;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
table{border-collapse:collapse;border-spacing:0;}
/* start editing from here */
a{text-decoration:none;}
.txt-rt{text-align:right;}/* text align right */
.txt-lt{text-align:left;}/* text align left */
.txt-center{text-align:center;}/* text align center */
.float-rt{float:right;}/* float right */
.float-lt{float:left;}/* float left */
.clear{clear:both;}/* clear float */
.pos-relative{position:relative;}/* Position Relative */
.pos-absolute{position:absolute;}/* Position Absolute */
.vertical-base{	vertical-align:baseline;}/* vertical align baseline */
.vertical-top{	vertical-align:top;}/* vertical align top */
nav.vertical ul li{	display:block;}/* vertical menu */
nav.horizontal ul li{	display: inline-block;}/* horizontal menu */
img{max-width:100%;}
/*end reset*/
/****-----start-body----****/
body{
	/*background: #EBF3F3;
	background: #f2f1f1;*/
	background: #dfecea;
	font-family: "Myriad Pro" , "Liberation Sans", "Numbus Sans L", "Helvetica Neue";

}
.wrap{
	margin: 0 auto;
	width: 80%;
}
body a,form li,.submit input[type="submit"]{
	transition: 0.1s all;
	-webkit-transition: 0.1s all;
	-moz-transition: 0.1s all;
	-o-transition: 0.1s all;
}
.one-login-head{
	/*background: #df5441;*/
	background: #042630;
	//background: #939A9A;
	padding: 1em 1em;
	text-align:center;
	position: relative;
}
.one-login-head span{
	background: url('../images/tip2.png') no-repeat 0px 0px;
	width: 30px;
	height: 15px;
	position: absolute;
	bottom: -12px;
	left: 203px;
	display: none;
}
.one-login{
width:28%;
margin:5% auto;
background: #fff;
text-align: center;
border-bottom: 3px solid #218C8D;
}
.one-login-head h1 {
font-size: 2em;
color: #fff;
font-family: "Myriad Pro" , "Liberation Sans", "Numbus Sans L", "Helvetica Neue";
font-weight: 700;
}
form {
	padding: 12% 9%;
}
form li{
	border:none;
	list-style:none;
	margin-bottom:25px;
	width:100%;
	background:#fff;
	position: relative;
}
.icon{
height:45px;
width: 46px;
display: block;
float: left;
margin: 1px -13px 0px 0px;
}
.user{
	background: url(../images/icon.png) no-repeat 0px -1px #7a6d72;
	
}
.lock{
	background: url(../images/icon.png) no-repeat -49px 0px #7a6d72;
}
.home{
	background: url(../images/icon.png) no-repeat -49px 0px #7a6d72;
}
input[type="text"], input[type="email"], input[type="password"] {
	width: 80%;
	padding: 0.8em 0em 0.8em 1em;
	color: #111112;
	font-size: 17px;
	outline: none;
	background: none;
	font-weight: 500;
	border: none;
	font-family: "Myriad Pro" , "Liberation Sans", "Numbus Sans L", "Helvetica Neue";
}
.submit{
	/*border-bottom: 1px dashed #999;*/
	background-color:"#009BA3";
	padding: 15px 0;
}
.submit input[type="submit"]{
	width: 100%;
	font-family: "Myriad Pro" , "Liberation Sans", "Numbus Sans L", "Helvetica Neue";
	font-weight: 700;
	background-color: #F18200;
	/*background-color: #EE3233;
	background-color: #BED661;
	padding: 0.7rem 2rem;*/
	/*border: 1px solid #3a5051;
	border: 1px solid #8C9D4A;
	color: #404141;*/
	border: none;
	color: #fff;
	border-radius: 4px;
	cursor: pointer;
	text-decoration: none;
	font-size: 1.5rem;
	-webkit-appearance: none;
}
input[type="submit"]:hover{
	background-color: #F18200;
	/*background-color: #EE3233;
	background-color: #89E894;*/
	/*color: #fff;*/
	color: #000;
}
h6 {
float: right;
}
/*----------*/
.p-container{
	margin-top: 1em;font-family: "Myriad Pro" , "Liberation Sans", "Numbus Sans L", "Helvetica Neue";
}
.p-container  .checkbox input {
	position: absolute;
	left: -9999px;
}
.p-container.checkbox i {
	border-color: #fff;
	transition: border-color 0.3s;
	-o-transition: border-color 0.3s;
	-ms-transition: border-color 0.3s;
	-moz-transition: border-color 0.3s;
	-webkit-transition: border-color 0.3s;
	
}
.p-container.checkbox i:hover {
	border-color:red;
	
}
.p-container  i:before {
	background-color: #2da5da;	
}
.p-container  .rating label {
	color: #ccc;
	transition: color 0.3s;
	-o-transition: color 0.3s;
	-ms-transition: color 0.3s;
	-moz-transition: color 0.3s;
	-webkit-transition: color 0.3s;
}
.p-container  .checkbox input + i:after {
	position: absolute;
	opacity: 0;
	transition: opacity 0.1s;
	-o-transition: opacity 0.1s;
	-ms-transition: opacity 0.1s;
	-moz-transition: opacity 0.1s;
	-webkit-transition: opacity 0.1s;
}
.p-container .checkbox input + i:after {
	content:url(../images/tick.png) no-repeat 7px 1px;
	top:5px;
	left: 5px;
	width: 13px;
	height: 12px;
}
.p-container.checkbox {
	float: left;
	margin-right: 30px;
}
.p-container .checkbox {
	padding-left: 40px;
font-size: 16px;
line-height: 14px;
color: #858282;
cursor: pointer;
}
.p-container  .checkbox {
	position: relative;
	display: block;
}
.p-container  h6 a {
	float: right;
	color: #404141;
}
.p-container  h6 a:hover{
	text-decoration: underline;
}
label.checkbox {
float: left;
margin-top: 3px;
}
.p-container  .checkbox i {
	position: absolute;
	top: -5px;
	left: 5px;
	display: block;
	width: 22px;
	height: 22px;
	outline: none;
	border: none;
	background: #dfdfdf;
}
.p-container  .checkbox input + i:after {
	position: absolute;
	opacity: 0;
	transition: opacity 0.1s;
	-o-transition: opacity 0.1s;
	-ms-transition: opacity 0.1s;
	-moz-transition: opacity 0.1s;
	-webkit-transition: opacity 0.1s;
}
.p-container .checkbox input + i:after {
	color: #2da5da;
}
.p-container .checkbox input:checked + i,
.p-container . input:checked + i {
	border-color: #2da5da;	
}
.p-container .rating input:checked ~ label {
	color: #2da5da;	
}

.p-container .checkbox input:checked + i:after {
	opacity: 1;
}
.social-icons p{
	color: #404141;
	font-size: 17px;
	text-align: center;
	padding-top:20px;
}
ul.soc_icons2 {
text-align: center;
padding: 12px 0;
}
ul.soc_icons2 li.pic{
background: none;
display: inline-block;
width: 24%;
margin: 0;
}
ul.soc_icons2 li.pic i{
	width:68px;
	height:68px;
	display: inline-block;
	background: url('../images/icon.png') no-repeat 0px 0px;
	vertical-align: middle;
	-webkit-transition: 0.8s;
	-moz-transition: 0.8s;
	-o-transition: 0.8s;
	transition: 0.8s;
}
ul.soc_icons2 li.pic i:hover{
	border-top-left-radius: 3em;
	-o-border-top-left-radius: 3em;
	-moz-border-top-left-radius: 3em;
	-webkit-border-top-left-radius: 3em;
}
ul.soc_icons2 li.pic a:hover{
	text-decoration: none;
}
ul.soc_icons2 li.pic a i.icon_4{
	background-position: -106px 4px;
}
ul.soc_icons2 li.pic a i.icon_5 {
	background-position: -204px 4px;
}
ul.soc_icons2 li.pic a i.icon_6{
	background-position: -302px 4px;
}
.one-login h5 a,.one-login  h5 {
	color: #404141;
	font-size: 16px;
	text-align: center;
	padding: 10px 0;
}
.one-login h5 a:hover{
	text-decoration: underline;
}
/*---login-02---------*/
.two-login-head{
	background: #702c91;
	padding: 1em 1em;
	text-align:center;
	position: relative;
}
.two-login-head h2 {
font-size: 2em;
color: #fff;
font-weight: 500;
text-transform: uppercase;
}
.two-login-head lable{
	background: url('../images/tip2.png') no-repeat 0px 0px;
	width: 30px;
	height: 13px;
	position: absolute;
	bottom: -11px;
	left: 203px;
	display: inline-block;
}
.two-login h5,.two-login h5 a{
	color: #848484;
	font-size: 16px;
}
.two-login h5 a{
	font-weight: 600;
}
.two-login h5 a:hover{
	text-decoration: underline;
}
.two-login{
width:28%;
margin:5% auto;
background: #fff;
text-align: center;
border-bottom: 3px solid#1c817c;
}
.two-login-head h1 {
font-size: 2em;
color: #fff;
font-weight:500;
}
form.two {
	padding: 12% 9%;
}
form.two li{
	border:none;
	list-style:none;
	margin-bottom:25px;
	width:100%;
	background:#dfdfdf;
}
.login-02 {
margin-top: 9em;
}
.icon2{
height:45px;
width: 46px;
display: block;
float: left;
margin: 1px -13px 0px 0px;
}

.user2{
	background: url(../images/icon2.png) no-repeat 0px -1px #702c91;
	
}
.lock2{
	background: url(../images/icon2.png) no-repeat -49px 0px #702c91;
}
.mail{
	background: url(../images/icon2.png) no-repeat -99px 0px #702c91;
}
form.two input[type="text"],form.two input[type="password"] {
	width: 60%;
	padding: 0.8em 4em 0.8em 1.7em;
	color: #858282;
	font-size: 17px;
	outline: none;
	background: none;
	font-weight: 500;
	border: none;
	}
	.submit.two{
		border: none;
		padding: 41px 0 20px 0;
	}
.submit.two input[type="submit"]{
	font-size: 20px;
	font-weight: 400;
	color: #fff;
	cursor: pointer;
	outline: none;
	padding: 13px 10px;
	width: 100%;
	border: none;
	background: #702c91;
}
.submit.two input[type="submit"]:hover{
	background:#ffc50c;
}
.p-container a {
color: #702C91;
font-size: 15px;
}
.p-container a:hover{
	text-decoration: underline;
}
/*---login-three----------*/
.three-login-head{
	background: #f26122;
	padding: 1em 1em;
	text-align:center;
	position: relative;
}
.three-login-head h3 {
font-size: 2em;
color: #fff;
font-weight: 500;
text-transform: uppercase;
}
.three-login-head lable{
	background: url('../images/tip3.png') no-repeat 0px 0px;
	width: 30px;
	height: 13px;
	position: absolute;
	bottom: -11px;
	left: 203px;
	display: inline-block;
}
.three-login h5,.three-login h5 a{
	color: #848484;
	font-size: 16px;
	text-align: left;
}
.three-login h5 a:hover{
	text-decoration: underline;
}
.three-login p{
	color: #848484;
	font-size: 16px;
	line-height:20px;
	padding: 10px 0 20px 0;
	text-align: left;
}
.three-login{
width:28%;
margin:5% auto;
background: #fff;
text-align: center;
border-bottom: 3px solid#1c817c;
}
.three-login-head h1 {
font-size: 2em;
color: #fff;
font-weight:500;
}
form.three {
	padding: 12% 9%;
}
form.three li{
	border:none;
	list-style:none;
	margin-bottom:25px;
	width:100%;
	background:#dfdfdf;
}
.login-03 {
margin-top: 9em;
}
.icon3{
height:45px;
width: 46px;
display: block;
float: left;
margin: 1px -13px 0px 0px;
}
.mail2{
	background: url(../images/mail.png) no-repeat -0px 0px #f26122;
}
form.three input[type="text"],form.three input[type="password"] {
	width: 60%;
	padding: 0.8em 4em 0.8em 1.7em;
	color: #858282;
	font-size: 17px;
	outline: none;
	background: none;
	font-weight: 500;
	border: none;
	}
	.submit.three{
		border: none;
		padding: 8px 0 13px 0;
	}
.submit.three input[type="submit"]{
	font-size: 20px;
	font-weight: 400;
	color: #fff;
	cursor: pointer;
	outline: none;
	padding: 13px 10px;
	width: 100%;
	border: none;
	background: #f26122;
}
.submit.three input[type="submit"]:hover{
	background:#ffc50c;
}
/****************/
.copy-right {
	text-align: center;
	margin: 10% 0 2% 0;
}
.copy-right p {
	color: #ffffff;
	font-size: 1em;
	font-weight:200;
}
.copy-right p a {
	font-size: 1em;
	color:#2c2a2f;
}
.copy-right p a:hover {
	text-decoration: underline;
}
/*-----start-responsive-design------*/
@media (max-width:1440px){
	.three-login,.two-login,.one-login{
		width: 31%;
	}
}
@media (max-width:1366px){
	.three-login,.two-login,.one-login{
		width: 32%;
	}
}
@media (max-width:1280px){
	.three-login, .two-login, .one-login {
	width: 35%;
	}
	.login-02,.login-03 {
	margin-top: 7em;
	}
}
@media (max-width:1024px){
	.three-login, .two-login, .one-login {
	width: 43%;
	}
	.three-login-head h3,.one-login-head h1,.two-login-head h2 {
	font-size: 1.7em;
	}
}
@media (max-width:768px){
	.three-login, .two-login, .one-login {
	width: 58%;
	}
	form {
	padding: 12% 6%;
	}
	.one-login .textbox-icon {
    padding: 10px 9px !important;
    }
}
@media (max-width:640px){
	.three-login, .two-login, .one-login {
	width: 70%;
	}
	.three-login-head h3, .one-login-head h1, .two-login-head h2 {
	font-size: 1.55em;
	}
}
@media (max-width:480px){
	.three-login, .two-login, .one-login {
	width: 95%;
	}
	.copy-right p {
	font-size: 1em;
	}
	form {
	padding: 12% 5%;
	}
	.copy-right p {
	font-size: 1.05em;
	line-height: 1.5em;
	}
}
@media (max-width:320px){
	.one-login-head img,.two-login-head img,.three-login-head img {
	width: 16%;
	}
	input[type="text"], input[type="password"] {
	width: 62%;
	padding: 0.9em 1em 0.9em 1.7em;
	color: #858282;
	font-size: 16px;
	}
	.social-icons p {
	font-size: 15px;
	padding-top:18px;
	line-height: 23px;
	}
	label.checkbox {
	float: none;
	margin-top: 3px;
	}
	.p-container .checkbox {
	padding-left: 0px;
	}
	.p-container h6,.p-container h6 a{
		float: none;
		margin-top: 10px;
	}
	.p-container {
	margin-top: 0;
	}
	ul.soc_icons2 li.pic {
	width: 32%;
	}
	.one-login h5 a, .one-login h5 {
	font-size: 15px;
	}
	.three-login-head h3, .one-login-head h1, .two-login-head h2 {
	font-size: 1.3em;
	}
	.submit input[type="submit"],.submit.two input[type="submit"],.submit.three input[type="submit"] {
	font-size: 18px;
	padding: 13px 10px;
	}
	.two-login h5, .two-login h5 a {
	font-size: 15px;
	}
	.three-login p {
	font-size: 14px;
	}
	.three-login h5, .three-login h5 a {
	font-size: 15px;
	}
	form {
	padding: 12% 4%;
	}
	.p-container a {
	font-size: 14px;
	}
	.three-login,.two-login,.one-login {
	width: 94%;
	}
	form li {
	margin-bottom: 14px;
	}
	.submit.three {
	padding: 1px 0 13px 0;
	}
	.submit.two {
	padding: 22px 0 20px 0;
	}
	.p-container .checkbox i {
	position: absolute;
	top: -3px;
	left: 39px;
	}
	.p-container label.checkbox.two i {
	position: absolute;
	top: -5px;
	left: 5px;
	}
	.one-login-head span,.two-login-head lable,.three-login-head lable {
	bottom: -11px;
	left: 129px;
	}
	.login-02,.login-03 {
	margin-top:7em;
	}
	.login-02, .login-03 {
	margin-top: 6em;
	}
}

#messagediv {
	background: #dfe7f3;
	border: 1px solid #1934a0;
	box-shadow: 0 1px 4px #000;
	font-size: 15px;
	margin: 15px auto 0;
	padding: 10px 40px;
	width: initial;
	text-align: center;
	display: none;
}
#errormessagediv {
	font-size: 15px;
	margin: 15px auto 0;
	padding: 10px 40px;
	background-color: #ffecec;
	border: 1px solid #f64b2f;
	box-shadow: 0 1px 4px #000;
	width: initial;
	text-align: center;
	display: none;
}
#togglePassword{
	cursor: pointer;
	display: inline;
	position: absolute;
	top: 17px;
	right: 14px;
}
.one-login .textbox-icon {
    float: left;
background: #939A9A;
color: #fff;
padding: 10px 15px;
font-size: 25px;
width: 25px;
text-align: center;
height: 29px;
line-height: 1.2;
}
p{
	margin-bottom: 1.5rem;
}