@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');

*:focus {outline:0 !important;  -webkit-box-shadow: none !important;  box-shadow: none !important}
::-webkit-input-placeholder {color: #666 !important; font-weight: 400;}
:-ms-input-placeholder {color: #666 !important; font-weight: 400;}
::-ms-input-placeholder {color: #666 !important; font-weight: 400}
::placeholder {color: #666 !important; font-weight: 400}

@-webkit-keyframes scaleOut {
	0%   { -webkit-transform: scale(1.4); transform: scale(1.4); }
	100% { -webkit-transform: scale(1); transform: scale(1);  }
}

@keyframes scaleOut {
	0%   { -webkit-transform: scale(1.4); transform: scale(1.4); }
	100% { -webkit-transform: scale(1); transform: scale(1);  }
}

.eye-icon{width: 20px; height: 20px; background-image: url('/admin/images/eye_icon.png'); background-repeat: no-repeat;  background-size: 100% auto; background-position: center; display: inline-block; position: absolute;bottom: 10px; right: 15px; cursor: pointer; z-index: 10;}
.eye-icon.closed{ background-image: url('/admin/images/eye_icon_closed.png');}

.login-panel {background: #000 !important; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 200; color: #000;}
.login-panel h1{ font-family: 'Plus Jakarta Sans', sans-serif; color: #fff; font-weight: 200; line-height: 120%;}
.login-panel .wrapper{display: -webkit-box;display: -ms-flexbox;display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-height: 100vh;}
.form-signin { padding: 0; margin: 0 auto;}
.form-signin .form-signin-heading {font-weight: normal; font-size: 12px;}
.login-panel .form-control {position: relative; height: auto; padding: 10px; -webkit-box-sizing: border-box; box-sizing: border-box;}
.login-panel .form-control:focus {z-index: 2;}
.panel-wrapper input[type="text"],
.panel-wrapper input[type="password"], .panel-wrapper input[type="email"] {border: 1px solid #595959 !important; background: #1a1a1a !important; margin-bottom: 0.5rem; padding: 0.5rem 0.75rem; color: #fff; margin-bottom: 1rem; 
    border-radius: 0.25rem;}
.login-header.panel {background: none; border: 0; width: auto; -webkit-box-shadow: none; box-shadow: none;}
.login-header div.panel-heading {background: none; border: 0; padding: 0; position: relative; z-index: 9;}
.login-header div.panel-heading h2 {font-size: 4rem; line-height: 1.2; font-weight: bold; color: #fff;}
.login-panel .submit-button {-webkit-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000);-o-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000);transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); padding: 0; margin: 0; text-transform: none; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.063rem;
    line-height: 1;
    border-radius: 1.688rem;
    padding: 1.063rem 2.5rem 1.2rem;
    transition: all .25s;
    box-shadow: none !important;
    background-color: #05e47a;
    color: #000;
    border: 0;}
.login-panel .submit-button:hover {background: #fff; color: #000;}

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle, .btn-primary:focus {background-color: #05e47a; border-color: #05e47a}

.form-signin .alert-danger {border: 1px solid #f76b6b; border-width: 1px 0; background: none; color: #df2525; text-align: center; font-size: 14px; margin: 70px auto 0; border-radius: 0; max-width: 80%;}


.form-signin .checkbox-wrapper {position: relative; display: inline-block; margin: 20px 0;}
.form-signin .checkbox-wrapper p {display: inline-block; line-height: 14px; color: #000; font-size: 12px; font-weight: normal;padding: 0; margin: 0; padding-left: 0px; vertical-align: middle;}

.login-panel.loading .panel-image, .login-panel.loading .info-wrapper {-webkit-transform: translate3d(-20%,0,0);transform: translate3d(-20%,0,0); opacity: 0; -webkit-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); -o-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000);}
.login-panel .panel-image{ -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); opacity: 1; -webkit-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); -o-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); position: relative; background-color: #000; z-index: 1; overflow: hidden}
.login-panel .panel-image .content-wrapper{height: 100%;}
.login-panel .panel-wrapper{flex: 1; position: relative; overflow: hidden;}
.login-panel .info-wrapper {position: relative; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); opacity: 1; -webkit-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); -o-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); max-width: 400px;}
.login-panel .info-wrapper p {color: #fff; padding-top: 40px; font-size: 13px;}
.login-panel .info-wrapper p img{position: absolute; left: 0;}
.login-panel .info-wrapper .support-mail{font-weight: 600; color: #05e47a;}
.login-panel .bottom-row{display: -webkit-box;display: -ms-flexbox;display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align:  center; -ms-flex-align:  center; align-items:  center}
.login-panel .bottom-row .password-reset, .login-panel .bottom-row .back-to-login{text-decoration: underline; font-size: 12px; background-color: transparent; border: none;     margin: 20px 0;}
.login-panel .input{position: relative}
.login-panel .input .invalid-tooltip{padding: 15px; background-color: #f50034; left: calc(100%  + 40px); top: 0; width: 240px;}
.login-panel .input .invalid-tooltip:after {right: 100%;top: 50%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;border-color: rgba(136, 183, 213, 0);border-right-color: #f50034;border-width: 10px;margin-top: -10px;}
.login-panel .custom-checkbox label p{color: #fff;}

.panel-box {
	max-width: 400px;
}

.reset-box {position: absolute;top: 0;width: 100%;}
.reset-box .bottom-row{margin-top: 64px;}
.reset-box .bottom-row .submit-button{width: 230px;}

.login-panel.loading .login-box.active{-webkit-transform: translate3d(0,20%,0);transform: translate3d(0,20%,0); opacity: 0; -webkit-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); -o-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000);}
.reset-box, .login-box{-webkit-transform: translate3d(-100%,0,0);transform: translate3d(-100%,0,0); opacity: 0; -webkit-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); -o-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000);}
.reset-box.active, .login-box.active{-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0); opacity: 1; -webkit-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); -o-transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); transition: 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000); -webkit-transition-delay: 0.3s; -o-transition-delay: 0.3s; transition-delay: 0.3s;}

/* CUSTOM CHECKBOX */
.custom-checkbox {
	padding: 0;
}
.custom-checkbox label {
	cursor: pointer;
	line-height: 18px;
	padding-left: 1.8rem;
	line-height: 140%;
    color: #fff;
    font-size: .75rem
}
.custom-checkbox .custom-control-label:before {
	position: absolute;
	border-radius: 0;
	top: 0px;
	left: 0;
	width: 18px;
	height: 18px;
	display: inline-block;
	margin-right: 5px;
	vertical-align: middle;
	margin-bottom: 3px;
	border: 1px solid #595959 !important;
    background: #1a1a1a !important;
    border-radius: 0.25rem;
}
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before, .custom-control-input:not(:disabled):active~.custom-control-label::before {
	border-color: #05e47a;
	background: #05e47a !important;
	-webkit-box-shadow: none;
	box-shadow: none;
}
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
	top: 0px;
	left: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	width: 18px;
	height: 18px;
	mix-blend-mode: difference;
}
.custom-control-input:focus:not(:checked)~.custom-control-label::before{
	border-color: #05e47a;
	box-shadow: none;
}
/* FORM FEEDBACK */
.was-validated .custom-control-input:invalid ~ .custom-control-label, .custom-control-input.is-invalid ~ .custom-control-label {
	color: #000;
}
.was-validated .custom-control-input:invalid ~ .custom-control-label::before, .custom-control-input.is-invalid ~ .custom-control-label::before {
	border-color: #d7d7d7;
}
.was-validated .custom-control-input:valid ~ .custom-control-label, .custom-control-input.is-valid ~ .custom-control-label {
	color: #000;
}
.was-validated .custom-control-input:valid:checked ~ .custom-control-label::before, .custom-control-input.is-valid:checked ~ .custom-control-label::before {
	border-color: #d7d7d7;
	background-color: #fff;
}
.custom-control-input:checked~.custom-control-label::before, .custom-control-input.is-valid~.custom-control-label::before, .was-validated .custom-control-input:valid~.custom-control-label::before, .custom-control-input.is-valid:checked~.custom-control-label::before, .was-validated .custom-control-input:valid:checked~.custom-control-label::before{
	border-color: #d7d7d7 !importat;
}
.form-control.is-invalid, .was-validated .form-control:invalid{
	background-image: none;
}

.was-validated button[type="submit"]{ background-color: #d7d7d7; background-image: none;}

.form-control.is-valid, .was-validated .form-control:valid{border-color: #d7d7d7; background-image: none;}
input:-internal-autofill-previewed, input:-internal-autofill-selected, textarea:-internal-autofill-previewed, textarea:-internal-autofill-selected, select:-internal-autofill-previewed, select:-internal-autofill-selected {
	background-color: transparent !important;
}


@media screen and (max-width: 1300px){
	.login-panel .panel-image{padding: 20px; }
	.login-panel h1{font-size: 24px;}
}

@media screen and (max-width: 1100px){
	.login-panel .login-box {width: 100%;}
	.login-panel .wrapper{display: -webkit-box;display: -ms-flexbox;display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;}
	.login-panel .panel-image{width: 100%;}
	.login-panel h1{font-size: 28px;}
	.login-panel h1 br{display: none;}
	.panel-wrapper{padding-top: 30px;}

	.login-panel .panel-image:after{height: 10vh;}
	.bottom-row{display: -webkit-box;display: -ms-flexbox;display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start;}
	.bottom-row div, .bottom-row button{width: 100%;}
	.password-reset, .back-to-login{text-align: left;}
	.login-panel .bottom-row .password-reset, .login-panel .bottom-row .back-to-login{margin: 10px 0;}
	.form-signin .checkbox-wrapper{margin: 0; margin-top: 20px;}
	.form-signin .checkbox-wrapper p{padding-left: 0;}
	.reset-box .bottom-row .submit-button{width: 100%; -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2;}
	.reset-box{top: 30px;}
	.reset-box .bottom-row{margin-top: 30px;}

}
@media screen and (max-width: 768px){
	.login-header div.panel-heading h2{font-size: 20px;}
	.panel-box{width: 100%}
	.login-panel .input .invalid-tooltip{left: 0; top: 100%;}
	.login-panel .input .invalid-tooltip:after{display: none;}

}