body{
    background: radial-gradient(200% 200% at top left,  #54BDEC 0%, rgb(78, 168, 221) 10%,  #0F53A8  90%);
    text-align:center;
    height: 100%;
    margin: 0;


}

#login,#targetlogin{
    width:400px;
    text-align:center;
    background-color: rgba(0,0,0,0.1) ;
    position:absolute;
    top:50%;
    left:50%;
    height:280px;
    margin-left:-200px;
    margin-top:-140px;
    border-radius:0;

}



#login label{
    background:rgba(0,0,0,0.5);
    color:white;
    border-bottom:1px solid white;
    width:100% !important;
    height:47px;
}


#login input{
    padding:10px;
    font-size:12pt;
    text-align:center;
}
#login fieldset{
    width:100%;
    float:none;
    margin:0 auto;
    display:block !important;
}



#login input.invalid,#login input {
 color:white;
}
#login input.invalid ~ .focus-border{
    background-color:#FF7A7A;
}

#login input ~ .focus-border{

    background-color:#00FF00;
}


#login .fields{
    position:absolute;
    top:10px;
    width:100%;


}


#login .formActions{
    position:absolute;
    padding:0;
    top:250px;
    left:0;
    text-align:center;
    width:100%;
    background:transparent;
    height:30px;
    z-index:10;
    
}

#login .submit{
    border-radius:0;
    height:30px;
    margin:0;
    background-color:rgba(0,0,0,0.5);
    background-image: url('../imgs/loginButton.svg');
    background-position:center right;
    animation:buttonLogin 0.5s ease-in-out infinite;
    width:400px;
    border:0;
    color:transparent;
    bottom:0;
    cursor:pointer;

    

}



#login .formActions button.submit:hover{
    background-color:rgba(0,0,0,0.7);
    box-shadow:0 0 10px  rgba(0,204,255,1)
}
#login .formActions button.submit:disabled{
    display:none;
}



@keyframes buttonLogin {
    0% {
        background-position:center right;
    }
    50% {
        background-position:center right 10px;
    }
    100% {
        background-position:center right;
    }
}


#targetlogin .msg.success,
#targetlogin .msg.error,
#targetlogin .msg.fatal{
    border:0 !important;
}

#targetlogin .success,#targetlogin .fatal,#targetlogin .error{
    background:rgba(0,0,0,0.5);
    padding:20px;

}

#targetlogin .fatal{
    color:#FF7A7A;
}
#targetlogin .success{
    color:#4caf50;

}


#targetlogin .retryForm{
    background-color:rgba(0,0,0,0.5);
    background-image: url('../imgs/loginButtonPrev.svg');
    background-position:center left;

    border:0;


}
#targetlogin .retryForm:hover{
    background-color:rgba(0,0,0,0.7);
    box-shadow:0 0 10px  rgba(0,204,255,1)
}