.flex {
    display: flex;
}
.flex-column {
    flex-direction: column;
}
.flex-center{
    display: flex;
    justify-content: center;
    align-items: center;
}
.bigIcon {
    font-size: 150px;
}
.failIcon{
    color: #F27079;
    z-index: -10;
    text-align: center;
}
#loginForm .bigInput{
    font-size:16px;
    border: 1px solid #999;
    border-radius: 5px;
    outline: none;
    box-sizing: border-box;
    width: 100%;
    height: 36px;
    color: #707070;
}
#loginForm .bigInput:focus{
    border-color: dodgerblue;
    border-width: 1.5px;
    background-color:  lightgoldenrodyellow;
}
div.header{
    color:#b3b3b3;
    width: 100%;
    display: flex;
    justify-content: space-between;
    font-weight: 530;
    font-size: 13px;
    line-height: 18px;
}
.formFooter{
    padding-bottom: 15px;

}
.formFooter2 div{
    flex: 1;
}
.formFooter, .formFooter2{
    display: flex;
    justify-content: space-between;
}
.split{
    font-weight: bolder;
}
.rightIcon{
    position: absolute;
    right: 0;
    font-size: 16px;
}
#eye-pwd-mode{
    color: #636363;
    cursor: pointer;
    height: 100%;
    display: inline-flex;
    align-items: center;
    padding: 0 10px;
}
#loginBTN{
    font-size: 14px;
    color: #929292;
    font-weight: 600;
    /*margin-top: 20px;*/
}
#error-times{
    display: none;
    color: red;
}

/* loginForm.jsp */
#custSSOLogin,#samlLogin {
    display: flex;
    justify-content: space-between;
    padding-bottom: 14px;
}
#custSSOLogin a span,
#home-url a span,
#samlLogin a span,
#forgetPassword a span{
    color:#707070;
    display: inline-block;
    box-sizing: border-box;
    height: 16px;
    padding-bottom: 0;
    border-bottom: 1.5px solid #959595;
    font-size: 10px;
    line-height: 14px;
}
#forgetPassword a span {
    border-bottom: none;
}
#custSSOLogin a span:hover,
#home-url a span:hover,
#samlLogin a span:hover,
#forgetPassword a span:hover {
    text-decoration: none;
    border-bottom: 1.5px solid #b4b4b4;
    color: #b4b4b4 !important;
}
#forgetPassword a{
    border:none;
}
#fauto-label{
    display: flex;
    align-items: center;
}
#fauto-label:after{
    padding-left: 5px;
}
span.login-error{
    color: #fa4343;
    font-size: 12px;
    font-weight: bold;
    display: inline-block;
    padding: 5px 0 0 0;
}
span.login-error > i.floatingErrorDel{
    display: none;
}
span.floatingError{
    color: white;
    position: absolute;
    top: 0;
    right: 20px;
    background-color: rgba(213, 14, 14, 0.8);
    padding: 5px 16px 5px 12px;
    font-weight: normal;
    transition: opacity 0.3s ease;
    max-width: 220px;
    pointer-events: none;
    box-sizing: border-box;
}
span.floatingError > i.floatingErrorDel{
    position: absolute;
    top: 2px;
    right: 5px;
    cursor: pointer;
    display: inline-block;
    pointer-events: auto;
}
span.floatingError > i.floatingErrorDel:hover{
    color: #e7e7e7;
}

.divider {
    display: flex;
    align-items: center;
    text-align: center;
    padding: 10px 0;
    color: #b3b3b3;
}

.divider::before{
    content: '';
    flex: 1;
    border-bottom: 1px solid;
    margin-right:20px;
}
.divider::after {
    content: '';
    flex: 1;
    border-bottom: 1px solid;
    margin-left: 20px;
}


.divider span {
    font-size: 12px;
    font-weight: bold;
}

/**********************************************************  Custom button  **********************************************************/
.thebuttonLogin, .thebuttonSignUp, .thebuttonSAMLLogin{
    border-radius: 5px;
    width: 100%;
    height: 35px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 15px;
    font-weight: 600;
    padding: 8px 10px;
    text-decoration: none;
    outline: none;
    /*letter-spacing: 5px;*/
    /*text-indent: 5px;*/
}
.thebuttonLogin:hover {
    background-color: #ee5668;
}
.thebuttonLogin:active {
    background-color: #F27079;
}
.thebuttonLogin:visited,.thebuttonLogin:hover,.thebuttonLogin:active,.thebuttonLogin:link{text-decoration:none;cursor:pointer;}

.thebuttonLogin{
    background-color: #D50E0E;
    border: 1px solid #D50E0E;
    color: #ffffff;
}
.thebuttonSignUp {
    background-color: white;
    border:1px solid #aaa;
    color: #707070;
}
.thebuttonSAMLLogin{
    background-color: #3366FF;
    border: 1px solid #3366FF;
    color: #ffffff;
}
.thebuttonSignUp:hover {
    background-color: #eeeeee;
}
.thebuttonSignUp:active {
    background-color:#f8fff2;
}
.thebuttonSignUp:visited,.thebuttonSignUp:hover,.thebuttonSignUp:active,.thebuttonSignUp:link{text-decoration:none;cursor:pointer;}

/********************************************************************************************************************************/


/**********************************************************  Custom checkbox  **********************************************************/
input[type=checkbox]{
    vertical-align: middle;
    cursor: pointer;
}

/*!* Hide the browser's default checkbox *!*/
input#fauto {
    display: none;
}

label.checkbox-container {
    display: flex;
    /*justify-content: center;*/
    align-items: center;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color:#333333;
}

label.checkbox-container i{
    width: 15px;
    height: 15px;
    font-size: 16px;
}
/********************************************************************************************************************************/