
:root{
    --primary-color:#820024;
    --secondary-color:#323d4b;
    --primary-yellow-color:#fdcb0a;
}


.navbar {display:none}

.top-bg {display:none}
.top-bg{background:transparent}
.user-page-body{background:#423232;     box-shadow: none;}
.copyright{background:transparent; border:0px; font-size:0px;     left: -210px;
    bottom: 250px; color:rgba(255,255,255,0.7)}

.loginContainer{padding: 0px; border-radius: 0px;  width: 420px; height: 380px;    position: absolute;    left: 0;    top: 0;   background: #fff;    bottom: 0;    margin: auto;    right: 0;}
.login-head{float:left; width:100%;height:60px; background:var(--primary-color); position:relative; overflow:hidden}
.cmpny-logo{float:left; width:65%;  background:none;  height:100%; display:flex;  top:0px ;   place-content: center;     align-items: center;  position:relative}
.cmpny-logo img{position:relative; z-index:9; max-height:55px}
.cmpny-logo a{z-index:9}
.cmpny-logo:before {background: #fff; content: "" !important;    left: -13px;    position: absolute;    width: 100%;    height: 68px;    z-index: 1;    transform: rotate(-16deg);
    padding: 64px 0; display:block !important}
.cmpny-logo:after {    background: var(--primary-yellow-color);  content: "" !important;    left: -6px;    position: absolute;    width: 100%;    height: 65px;    z-index: 0;    transform: rotate(-8deg);    padding: 50px 0; display:block !important}
.help-block,
.login-error-msg .err{position:absolute; font-size:10px}

.cmpny-logo h1{border: 0px; position: relative; z-index: 9;    width: calc(100% - 60px);    font-size: 30px;    display: grid;    place-content: center;
    height: 60px;    margin: 0;   padding: 0 10px;    align-items: flex-start;    justify-content: flex-start; line-height:normal; color:#820024; text-transform:uppercase}
.cmpny-logo h1 span{font-size:14px; text-transform:uppercase; line-height:normal; padding:0px; margin:0px; color:#222222}
form input.error, form input.err{border:0px !important; border-bottom:1px solid #d9534f !important}

.login-label{float:left; width:35%; height:100%; display:grid;     align-items: center;    text-align: center; position:relative; font-size:24px; text-transform:uppercase; color:#ffffff}
.login-label p{display:none}
.mt20{margin-top:30px !important}
.login-center{padding:40px 50px; float:left; width:100%; box-sizing:border-box;     height: calc(382px - 60px);}  
.login-center a{color:var(--primary-color); font-size:12px}
.login-center a:hover,
.login-center a:focus{color:var(--secondary-color)}

.login-center .form-row{padding:0px; margin:0px; position:relative}
.login-center .form-row input{border-radius:0px; padding:0px; border:0px; border-bottom:1px solid #e3e4e8; width:100%; color:#222222; height:40px; line-height:40px; text-indent:10px}

.login-center .form-row input:focus{border:0px;border-bottom:1px solid var(--primary-color); }
.login-center .form-row input:focus ~ i{color: var(--primary-color);}
.login-center .form-row > i{position:absolute; right:10px; color:#bdbfc7; font-size:18px; bottom: 13px;}
.login-pwd-icon{    margin-right: 0px;top: 8px;position:absolute;display:inline-block;right:10px;}
.login-pwd-icon i{font-size:18px;}

.login-actions{margin:30px 0 0; float:left; width:100%}
.normal-login-type{margin:30px 0 0; width:100%; float:left; text-align:center}
.forgot-send-btn,
.normal-login-type .login-btn{width:200px !important; border-radius:0px !important; text-align:center; text-transform:uppercase; font-weight:bold; height:50px !important; padding:0px !important}
.btn.btn-primary{background:var(--primary-color); color:#fff; border-color:var(--primary-color);}
.btn.btn-primary:hover{background:var(--secondary-color); color:#fff; border-color:var(--secondary-color);}

.checkbox{padding:0px; position:relative}
.checkbox label {display: block; position: relative;  padding-left:25px;  margin: 0;  cursor: pointer;	line-height: 20px;  -webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none; font-size:12px !important; text-transform:none !important; color:#222222 }
.checkbox label input {  position: absolute;  opacity: 0;  cursor: pointer;  height: 0;  width: 0;}
.check-remember {position: absolute;  top: 0;  left: 0;  height: 16px;  width: 16px;  background-color: #ffffff; border:1px solid #eeeeee; }
.checkbox label:hover input ~ .check-remember { background-color: #ffffff; border:1px solid #999999;}
.checkbox label input:checked ~ .check-remember { background-color: var(--primary-color);  border:1px solid var(--primary-color);}
.check-remember:after { content: ""; position: absolute;  display: none;}
.checkbox label input:checked ~ .check-remember:after { display: block;}
.checkbox label .check-remember:after {    left: 5px;  top: 2px;width: 4px;    height: 8px;  border: solid #ffffff;  border-width: 0 1px 1px 0;  -webkit-transform: rotate(45deg);  -ms-transform: rotate(45deg);  transform: rotate(45deg);}

.show-forgot-pwd{margin:0px; font-size:12px; float:right}

.login-main-page .errorbox-position{top:0px}
.fa{color:#bdbfc7}

form input.valid{border:1px solid #dfecd9 !important;   background-color:#f6fff2; }

.login-remember-me{float:left}

.forgotpassContainer .form-row{margin:40px 0}
.forgotpassContainer .normal-login-type{margin-top:40px}
.forgotpassContainer .login-btn{padding:0px !important; width:48% !important; height:40px !important; line-height:40px !important; text-align:center !important; float:left; text-transform:uppercase; font-weight:normal; font-size:14px}
.forgotpassContainer .cancel-btn{padding:0px !important;  width:48% !important; height:40px !important; line-height:40px !important; text-align:center !important; float:right; border-radius:0px; background:#666666 ; color:#fff ; border-color:#666666; text-transform:uppercase; font-weight:normal; font-size:14px}

.forgotpassContainer .cancel-btn:hover{background:var(--secondary-color); border-color:var(--secondary-color); color:#fff}
.forgotpassContainer .login-label{font-size:21px !important ;    white-space: pre-wrap; padding:5px 14%; width:49%}
.forgotpassContainer input{font-size:16px !important}

.resetpassContainerStep1 .form-row{margin:40px 0}
.resetpassContainerStep2 .form-row{margin:10px 0}
.resetpassContainer .normal-login-type{margin-top:40px}
.resetpassContainer input{font-size:16px !important}

.resetpassContainerStep2 .login-btn{padding:0px !important; width:48% !important; height:40px !important; line-height:40px !important; text-align:center !important; float:left; text-transform:uppercase; font-weight:normal; font-size:14px}
.resetpassContainerStep2 .btn-danger{padding:0px !important;  width:48% !important; height:40px !important; line-height:40px !important; text-align:center !important; float:right; border-radius:0px; background:#666666 ; color:#fff ; border-color:#666666; text-transform:uppercase; font-weight:normal; font-size:14px}

.resetpassContainerStep2 .btn-danger:hover{background:var(--secondary-color); border-color:var(--secondary-color); color:#fff}

.resetpassContainerStep1 .login-label{font-size:21px !important ;    white-space: pre-wrap; padding:6px 10%; width:49%}
.resetpassContainerStep2 .login-label{font-size:21px !important ;    white-space: pre-wrap; padding:6px 10%}
.resetpassContainerStep2 #reset_password_section .login-label{    padding: 6px 4%;}
.login-center .form-row #password{padding-right:40px !important}

 .procurement .cmpny-logo img{max-width:90%}
 
 .theme-logo{
     gap:5px;
     padding: 5px 0;
     box-sizing: border-box;
 }
 .theme-logo .theme-name h2{
     color:#000 !important;
 }
 .theme-logo .theme-name p{
     color:#000 !important;
 }
 
 
 .cmpny-logo{
	     place-content: start;
    align-items: center;
    position: relative;
    padding-left: 10px;
 }
 .cmpny-logo:before {
    background: #fff;
    content: "" !important;
    left: -17px;
    position: absolute;
    width: 100%;
    height: 88px;
    z-index: 1;
    transform: rotate(-16deg);
    padding: 74px 0;
    display: block !important;
    top: -40px;
}
.cmpny-logo:after {
    background: var(--primary-yellow-color);
    content: "" !important;
    left: -6px;
    position: absolute;
    width: 100%;
    height: 105px;
    z-index: 0;
    transform: rotate(-8deg);
    padding: 30px 0;
    display: block !important;
    top: -20px;
}

.password_err{color: #c93605 !important; bottom: -33px;     height: 30px; position:absolute; left:0px;   font-size: 11px !important;}