.body_bg {background-image: url(../images/background.jpg); position:relative; background-position: top center;  background-repeat: no-repeat;  background-attachment: fixed; background-size: cover; background-color:#FFF; font-family: 'Public Sans', sans-serif; color:#000; font-weight:500; white-space:normal; visibility:inherit; text-align:inherit; border:0px; letter-spacing:0px; font-stretch:inherit; overflow-x:hidden;}
.body_bg::before {position: absolute; content: ''; left: 0px; top: 0px; width: 100%; height: 100%; background-color: rgba(69, 30, 93, 0.75);}

.login-form-bg { min-height: 100vh; background:#FFBF00; position: relative; padding:45px 60px;}

.login-logo { float:left; margin:0; padding:0;}
.login-logo img { height:45px;}

.login-top-nav { float:right; background:#451E5D; padding:0; margin-top:5px; border-radius:30px;}
.login-top-nav ul { list-style:none; margin:0; padding:0 10px;}
.login-top-nav ul li { float:left; margin:0; padding:0; display:inline-block; border-left:1px solid #642D7B; border-right:1px solid #341548;}
.login-top-nav ul li a { float:left; font-size:14px; line-height:21px; color:#FFF; text-transform:capitalize; font-weight:700; margin:0; padding:7px 15px; transition:all ease .6s;-moz-transition:all ease .6s;-webkit-transition:all ease .6s;-o-transition:all ease .6s; letter-spacing:1px;}
.login-top-nav ul li a:hover { color:#FFBF00; transition:all ease .6s;-moz-transition:all ease .6s;-webkit-transition:all ease .6s;-o-transition:all ease .6s;}
.login-top-nav ul li:first-child {border-left:none;}
.login-top-nav ul li:last-child {border-right:none;}

/*LOGIN-TITLE*/
.login-title { margin-bottom:15px; margin-top:60px;} 
.login-title ul { margin:0; padding:0; list-style:none;} 
.login-title ul li { display:inherit; position:relative; margin:0;} 
.login-title .login-icon, .login-title .login-info {display: table-cell; vertical-align:top;} 
.login-title .login-info {padding-left: 15px;}
.login-title ul li i {background:#451E5D none repeat scroll 0 0; color:#FFBF00; font-size:36px; height:85px; line-height:85px; text-align: center; width:85px; border-radius:50%; }	
.login-title .login-info h5 {font-weight:800; margin:5px 0 5px 0; padding:0; text-transform: capitalize; color: #451E5D; font-size:30px; line-height:40px;} 
.login-title .login-info p { color:#000; font-size:16px; line-height:25px; font-weight:600; margin: 0; padding:0;} 
/*LOGIN-TITLE*/

/*FORM*/
.login-form { float:left; height:auto; margin:15px 0; font-size:14px; line-height:22px; color:#000; font-weight:400; }
.login-form a { color:#000; text-decoration:none; font-weight:700; margin:0; padding:0; transition:all ease .6s;-moz-transition:all ease .6s;-webkit-transition:all ease .6s;-o-transition:all ease .6s;}
.login-form a:hover { color:#451E5D; transition:all ease .6s;-moz-transition:all ease .6s;-webkit-transition:all ease .6s;-o-transition:all ease .6s;}
.login-form i { font-size:12px; line-height:22px; margin-left:5px;}

.login-form-bor {width:100%; height:55px; line-height:55px; font-size:14px; color:#000; font-weight:500; margin:0; padding:0 0 0 15px; background:#FFECC6; border:1px solid #FFB51A; font-family: 'Public Sans', sans-serif; transition:all ease .6s;-moz-transition:all ease .6s;-webkit-transition:all ease .6s;-o-transition:all ease .6s; border-radius:7px;}
.login-form-textar { width:100%; height:110px; line-height:35px; font-size:14px; color:#000; margin:0; padding:5px 0 0 15px; background:#FFECC6; border:1px solid #FFB51A; font-weight:500; font-family: 'Public Sans', sans-serif; transition:all ease .6s;-moz-transition:all ease .6s;-webkit-transition:all ease .6s;-o-transition:all ease .6s; border-radius:7px;}
.login-form-bor:focus, .login-form-textar:focus { background:#FFF; border:1px solid #451E5D; transition:all ease .6s;-moz-transition:all ease .6s;-webkit-transition:all ease .6s;-o-transition:all ease .6s; -webkit-box-shadow: 0px 0px 10px 2px rgba(69, 30, 93,0.5); -moz-box-shadow: 0px 0px 10px 2px rgba(69, 30, 93,0.5); box-shadow: 0px 0px 10px 2px rgba(69, 30, 93,0.5); }

.login-form select {width:100%; font-size:14px; margin:0; padding:0 0 0 15px; color:#000; height:55px; line-height:55px; font-weight:500; background:#FFECC6 url(../images/arrow-select.png) no-repeat right 15px center ;border:1px solid #FFB51A; font-family: 'Public Sans', sans-serif; appearance:none; -webkit-appearance:none;-moz-appearance: none; text-indent: 0.01px; text-overflow: ''; transition:all ease .6s;-moz-transition:all ease .6s;-webkit-transition:all ease .6s;-o-transition:all ease .6s; border-radius:7px; }
.login-form select:focus {background:#FFF  url(../images/arrow-select.png) no-repeat right 15px center ; border:1px solid #451E5D; color:#000; appearance:none; -webkit-appearance:none;-moz-appearance: none; text-indent: 0.01px; text-overflow: ''; transition:all ease .6s;-moz-transition:all ease .6s;-webkit-transition:all ease .6s;-o-transition:all ease .6s; -webkit-box-shadow: 0px 0px 10px 2px rgba(69, 30, 93,0.5); -moz-box-shadow: 0px 0px 10px 2px rgba(69, 30, 93,0.5); box-shadow: 0px 0px 10px 2px rgba(69, 30, 93,0.5);}

.code-button {background: none; cursor: pointer; border: none; position: absolute; top: 0; right:30px; height:55px; line-height:55px; font-size: 13px; font-weight:600; text-transform: capitalize; letter-spacing:1px; color:#666;}
.code-button:hover { color:#49215A;}

.form-btn { font-size:15px; font-weight:700; width:auto; text-transform:capitalize; padding:15px 25px; line-height:20px ; color:#49215A; background:none; border:2px solid #49215A;  letter-spacing:1px; margin-top:0; margin-bottom:0; margin-left:0; margin-right:0; transition: 0.5s all; border-radius:30px;}
.form-btn:hover {  background:#49215A; color:#FFF; transition: 0.5s all;}

::placeholder { color:#000; opacity: 1;}
:-ms-input-placeholder {color:#000;}
::-ms-input-placeholder { color:#000;}

.inner-down { float:left; margin:0 0 15px 0; }
/*input[type=checkbox] {opacity: 0; float:left;}
input[type=checkbox] + label {margin:0 0 0 15px; padding:0 0 0 15px; position: relative;cursor: pointer;font-size:14px;float: left; line-height:22px; font-weight:400; color:#000; }
input[type=checkbox] + label ~ label {margin: 0 0 0 15px; }
input[type=checkbox] + label::before {content: ' ';position: absolute;left: -15px;top: 0px;width: 20px;height: 20px;display: block;background:#FFECC6;border: 1px solid #FFB51A;  border-radius:4px;}
input[type=checkbox] + label::after {content: ' ';position: absolute;left: -15px;top: 0px;width: 20px;height: 20px;display: block;z-index: 1;
background:#49215A url(../images/checkbox-icon.png) no-repeat center center; -ms-transform: scale(0);-webkit-transform: scale(0);transform: scale(0);opacity: 0; border-radius:4px;}
input[type=checkbox]:checked + label::after {-ms-transform: scale(1);-webkit-transform: scale(1);transform: scale(1);opacity: 1;}*/
/*FORM*/

@media only screen and ( min-width: 1299px) and (max-width: 2399px) {

.login-form-bg { padding:45px 75px;}

.login-logo img { height:50px;}

.login-top-nav {margin-top:5px;}
.login-top-nav ul { padding:0 10px;}
.login-top-nav ul li a { font-size:14px; line-height:20px; padding:10px 15px;}

/*LOGIN-TITLE*/
.login-title ul li i {font-size:40px; height:90px; line-height:90px; width:90px; }	
.login-title .login-info h5 {font-size:35px; line-height:45px;} 
.login-title .login-info p { font-size:16px; line-height:25px;} 
/*LOGIN-TITLE*/

/*FORM*/
.login-form { font-size:14px; line-height:22px;}

.login-form-bor {height:55px; line-height:55px; font-size:14px;}
.login-form-textar {  height:110px; line-height:35px; font-size:14px;}

.login-form select {font-size:14px; height:55px; line-height:55px;}

.form-btn { font-size:15px; padding:15px 25px; line-height:20px;}

.inner-down { float:left; margin:15px 0; }
input[type=checkbox] {opacity: 0; float:left;}
input[type=checkbox] + label {margin:0 0 0 0; }
input[type=checkbox] + label ~ label {margin: 0 0 0 0; }
/*FORM*/	
}


@media only screen and ( min-width: 768px) and ( max-width: 980px ) {

.login-logo img { height:40px;}

.login-top-nav {margin-top:3px;}
.login-top-nav ul { padding:0 5px;}
.login-top-nav ul li a { font-size:13px; line-height:20px; padding:7px 10px;}	
}


@media only screen and ( min-width: 600px) and ( max-width: 765px ) {

.login-logo img { height:40px;}

.login-top-nav {margin-top:3px;}
.login-top-nav ul { padding:0 5px;}
.login-top-nav ul li a { font-size:13px; line-height:20px; padding:7px 10px;}

/*LOGIN-TITLE*/ 
.login-title ul li i {font-size:28px; height:75px; line-height:75px; width:75px; }	
.login-title .login-info h5 {font-size:25px; line-height:35px;} 
.login-title .login-info p { font-size:15px; line-height:20px;} 
/*LOGIN-TITLE*/

/*FORM*/
.login-form { font-size:13px; line-height:20px;}
.login-form i { font-size:11px; line-height:20px;}

.login-form-bor {height:50px; line-height:50px; font-size:14px;}
.login-form-textar {  height:90px; line-height:35px; font-size:14px;}

.login-form select {font-size:14px; height:50px; line-height:50px;}

.code-button { height:50px; line-height:50px; font-size:13px;}

.form-btn {font-size:14px; padding:15px 20px; line-height:20px;}

.inner-down { float:left; margin:15px 0; }
input[type=checkbox] {opacity: 0; float:left;}
input[type=checkbox] + label {margin:0 0 0 0; }
input[type=checkbox] + label ~ label {margin: 0 0 0 0; }
/*FORM*/	
}


@media only screen and ( min-width: 481px) and ( max-width: 599px ) {

.login-form-bg {padding:30px;}
.login-logo img { height:40px;}

.login-top-nav {margin-top:3px;}
.login-top-nav ul { padding:0 5px;}
.login-top-nav ul li a { font-size:12px; line-height:20px; padding:7px 10px;}

/*LOGIN-TITLE*/ 
.login-title ul li i {font-size:24px; height:70px; line-height:70px; width:70px; }	
.login-title .login-info h5 {font-size:20px; line-height:30px;} 
.login-title .login-info p { font-size:14px; line-height:20px;} 
/*LOGIN-TITLE*/

/*FORM*/
.login-form { font-size:13px; line-height:20px;}
.login-form i { font-size:11px; line-height:20px;}

.login-form-bor {height:50px; line-height:50px; font-size:13px;}
.login-form-textar {  height:90px; line-height:35px; font-size:13px;}

.login-form select {font-size:13px; height:50px; line-height:50px;}

.code-button { height:50px; line-height:50px; font-size:12px;}

.form-btn {font-size:13px; padding:10px 20px; line-height:25px;}

.inner-down { float:left; margin:15px 0; }
input[type=checkbox] {opacity: 0; float:left;}
input[type=checkbox] + label {margin:0 0 0 0; }
input[type=checkbox] + label ~ label {margin: 0 0 0 0; }
/*FORM*/	
}


@media only screen and ( min-width: 320px) and ( max-width: 480px ) {

.login-form-bg {padding:30px 15px;}
.login-logo img { height:35px;}

.login-top-nav {margin-top:0px;}
.login-top-nav ul { padding:0 5px;}
.login-top-nav ul li a { font-size:12px; line-height:21px; padding:7px 10px;}

/*LOGIN-TITLE*/ 
.login-title ul li i {font-size:24px; height:70px; line-height:70px; width:70px; }	
.login-title .login-info h5 {font-size:20px; line-height:30px;} 
.login-title .login-info p { font-size:14px; line-height:20px;} 
/*LOGIN-TITLE*/

/*FORM*/
.login-form { font-size:12px; line-height:18px;}
.login-form i { font-size:10px; line-height:18px;}

.login-form-bor {height:50px; line-height:50px; font-size:13px;}
.login-form-textar {  height:90px; line-height:35px; font-size:13px;}

.login-form select {font-size:13px; height:50px; line-height:50px;}

.code-button { height:50px; line-height:50px; font-size:12px;}

.form-btn {font-size:13px; padding:10px 20px; line-height:25px;}

.inner-down { float:left; margin:0 0 15px 0; }
input[type=checkbox] {opacity: 0; float:left;}
input[type=checkbox] + label {margin:0 0 0 15px; }
input[type=checkbox] + label ~ label {margin: 0 0 0 15px; }
/*FORM*/	
}
.inner-down { float:left; margin:0 0 15px 0; }
input[type=checkbox] {opacity: 0; float:left;}
input[type=checkbox] + label {margin:0 0 0 15px; padding:0 0 0 15px; position: relative;cursor: pointer;font-size:14px;float: left; line-height:22px; font-weight:400; color:#000; }
input[type=checkbox] + label ~ label {margin: 0 0 0 15px; }
input[type=checkbox] + label::before {content: ' ';position: absolute;left: -15px;top: 0px;width: 20px;height: 20px;display: block;background:#FFECC6;border: 1px solid #FFB51A;  border-radius:4px;}
input[type=checkbox] + label::after {content: ' ';position: absolute;left: -15px;top: 0px;width: 20px;height: 20px;display: block;z-index: 1;
background:#49215A url(../images/checkbox-icon.png) no-repeat center center; -ms-transform: scale(0);-webkit-transform: scale(0);transform: scale(0);opacity: 0; border-radius:4px;}
input[type=checkbox]:checked + label::after {-ms-transform: scale(1);-webkit-transform: scale(1);transform: scale(1);opacity: 1;}
/*FORM*/