body{

    font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

}

#app{

    background-color:#343a40

}

.wrapper-signed{

    height:100vh;

    display: flex;

    align-items: center;

    justify-content: center;

}

.container-signed{

    background-color:#454d55;

    width: 450px;

    margin:auto;

    padding:20px;

    border-radius:8px;

    overflow: hidden;

}

span.icon-input {

    position: absolute;

    top: 39px;

    right: 10px;

}

span.icon-input i{

    color:#fff;

}

.box-signed .form-label{

    color:#FFF;

}

.box-signed input{

    background-color:#343a40;

    border:1px solid #6c757d;

    border-radius: 0;

    color:#FFF;

}

.box-signed .form-control:focus {

    background-color: #343a40;

    border-color: #86b7fe;

    color:#FFF;

    outline: 0;

    box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);

}

button.btn-login{

    padding: 6px 25px;

    text-transform: uppercase;

    border-radius: 4px;

}

.title-login-form {

    text-align: center;

    color: #FFF;

    font-weight: 600;

    border-bottom: 1px solid #fff;

    padding-bottom: 10px;

    margin-bottom: 15px;

    font-size: 22px;

}

.box-signed .form-control.is-invalid, 

.was-validated .box-signed .form-control:invalid,

.box-signed .form-control.is-valid, .was-validated .box-signed .form-control:valid{

    background-image:none

}

@media (max-width:768px) {
    .container-signed{
        width: 100%;
    }
}