﻿/*------------------------------------------------------------
Login Page
------------------------------------------------------------*/
.login-page {
	background-image:url(../login-image-01.jpg);
	background-size:cover !important;
	background-position:top center;
	background-repeat:no-repeat;
}

#login-box {
	max-width:320px;
	color:#fff;
}

#login-box.forget-password-page {
    display: inline-block;
    background: rgba(0,0,0,0.3);
    /* background: rgba(51,122,183,0.3); */
    border-radius: 3px;
    padding: 50px 20px 30px 20px;
    border: 1px solid rgba(255,255,255,0.2);
}

#login-box.forget-password-page h6 {
    line-height: 20px;
}

#login-box .forget {
	display:inline-block;
	margin-bottom:10px;
}

#login-box .forget a {
	color:#458fd8 !important;
}

.logo-login {
	margin-top:0;
	margin-bottom:50px;
}

#login-box section {
	background-color:rgba(0,0,0,0);
	background-color:transparent;
	border:0;
	padding:10px;
}

#login-box .user-login-field:nth-child(2) .user-login .input-group-addon,
#login-box .user-login-field:nth-child(3) .user-login .input-group-addon {
    border-top: 1px solid #eee;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

#login-box .user-login-field:nth-child(2) .user-login .form-control,
#login-box .user-login-field:nth-child(3) .user-login .form-control {
    border-top: 1px solid #eee;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

#login-box .user-login .input-group-addon,
#login-box .user-password .input-group-addon {
	background-color:#f7f7f7;
}

#login-box .user-login i,
#login-box .user-password i {
	color:#b3b6bb;
}

#login-box .icon-hover i {
	color:#458fd8 !important;
}

#login-box .user-login .input-group-addon {
	-webkit-border-radius: 4px 0px 0px 0px;
	-moz-border-radius: 4px 0px 0px 0px;
	border-radius: 4px 0px 0px 0px;
	border:0;
}

#login-box .user-login .form-control {
	-webkit-border-radius: 0px 4px 0px 0px;
	-moz-border-radius: 0px 4px 0px 0px;
	border-radius: 0x 0px 4px 0px;
	border-bottom-right-radius:0;
	border-bottom:0;
	border-right:0;
	border-top:0;
	border-left:1px solid #eee;
	-webkit-box-shadow: inset 0px 0px 0px #000000;
	-moz-box-shadow: inset 0px 0px 0px #000000;
	box-shadow: inset 0px 0px 0px #000000;
}

#login-box .user-password .input-group-addon {
	-webkit-border-radius: 0px 0px 0px 4px;
	-moz-border-radius: 0px 0px 0px 4px;
	border-radius: 0px 0px 0px 4px;
	border-top:1px solid #eee !important;
	border-left:0;
	border-right:0;
	border-bottom:0;
}

#login-box .user-password .form-control {
	-webkit-border-radius: 0px 0px 4px 0px;
	-moz-border-radius: 0px 0px 4px 0px;
	border-radius: 0x 0px 4px 0px;
	border-top-right-radius:0;
	border-left:1px solid #eee;
	border-top:1px solid #eee;
	border-bottom:0;
	border-right:0;
	-webkit-box-shadow: inset 0px 0px 0px #000000;
	-moz-box-shadow: inset 0px 0px 0px #000000;
	box-shadow: inset 0px 0px 0px #000000;
}

#login-box .captcha-code .input-group-addon {
	border:0;
	padding:0;
}

#login-box .captcha-code .input-group-addon img {
	-webkit-border-radius: 4px 0px 0px 4px;
	-moz-border-radius: 4px 0px 0px 4px;
	border-radius: 4px 0px 0px 4px;
}

#login-box .captcha-code .form-control {
	border-bottom:0;
	border-right:0;
	border-top:0;
	border-left:1px solid #eee;
	-webkit-box-shadow: inset 0px 0px 0px #000000;
	-moz-box-shadow: inset 0px 0px 0px #000000;
	box-shadow: inset 0px 0px 0px #000000;
}

#login-box .captcha-code .refresh-button:hover {
	background-color:#eee;
}

#login-box .captcha-code .refresh-button input[type="image"] {
	outline:none;
	padding:3px 10px;
}

#login-box .captcha-code .refresh-button:hover input[type="image"] {
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	transform: rotate(360deg);
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

#login-box .alert-required {
	color:#ff0000;
	display:inline-block;
	margin:3px 0 5px 0;
	text-align:left;
	width:100%;
}

#login-box input[type="submit"] {
    padding:10px 0;
    width:100%;
}

.validation-error {
	position:fixed;
	top:0;
	width:100%;
	z-index:99;
}

.validation-error .alert {
	background-color:rgba(255,0,0,0.5);
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	color:#fff;
	font-size:12px;
	left:0;
	width:100%;
}

.validation-error .alert-success {
    background-color:rgba(54, 218, 52, 0.7);
}

footer.login {
	background-color:rgba(0,0,0,0);
	background-color:transparent;
}

img.front {
    transform:perspective(1000px)  rotateY(0deg);
    margin:0 auto;
    display:block;
    width:112px;
    height:100px;
}

.rotation-animation {
    animation:my-rotation 3s infinite;
 -webkit-animation-delay: 0s;
    animation-delay: 0s;
}

@keyframes my-rotation {
    0% {
  transform:perspective(1000px)  rotateY(0deg);
    }
    25% {
  transform:perspective(1000px)  rotateY(360deg);
    }
 100% {
  transform:perspective(1000px)  rotateY(360deg);
    }
}

/*------------------------------------------------------------
Login RTL
------------------------------------------------------------*/
html[dir="rtl"] #login-box .user-login .input-group-addon {
	-webkit-border-radius: 0px 4px 0px 0px;
	-moz-border-radius: 0px 4px 0px 0px;
	border-radius: 0px 4px 0px 0px;
}

html[dir="rtl"] #login-box .user-login .form-control {
	-webkit-border-radius: 4px 0px 0px 0px;
	-moz-border-radius: 4px 0px 0px 0px;
	border-radius: 4x 0px 0px 0px;
	border-top-right-radius:0;
	border-top-left-radius:4px;
}

html[dir="rtl"] #login-box .user-password .input-group-addon {
	-webkit-border-radius: 0px 0px 4px 0px;
	-moz-border-radius: 0px 0px 4px 0px;
	border-radius: 0px 0px 4px 0px;
}

html[dir="rtl"] #login-box .user-password .form-control {
	-webkit-border-radius: 0px 0px 0px 4px;
	-moz-border-radius: 0px 0px 0px 4px;
	border-radius: 0x 0px 0px 4px;
	border-bottom-left-radius:4px;
	border-bottom-right-radius:0;
}

html[dir="rtl"] footer.login {
	padding:0 10px;
}

html[dir="rtl"] .validation-error .alert {
	right:0;
}

@media (max-width: 1199px){}
.login-page {
    background-size: inherit !important;
    background-position: top center;
}
}