#testa{
    padding: 2px 5px;


    width: 100vw!important;

    height: auto!important;
    max-height: 150px!important;
    z-index: 16777271!important;
    position: fixed;
    left: 0vw;
    top: 0px;
    text-align: center;
    text-transform: uppercase;
    border-bottom: #1d8ee0 solid 2px;
}
#piede{
    padding: 2px 5px;
    color:white;
    background-color: rgba(0, 0, 0, 0.8);
    width: 100vw!important;

    height: auto!important;
    max-height: 150px!important;
    z-index: 16777271!important;
    position: fixed;
    left: 0vw;
    bottom: 0px;
    text-align: center;

}

.login-container{
    /*position: relative;*/
    width: 344px;
    margin: 80px auto;
    padding: 20px;
    text-align: center;
    border: 1px solid #ccc;

    background-color: #f7f7f7;
    -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
}
.loginiframe{
    /*position: relative;*/
    width: auto;
    max-width: 302px;
    margin: 5px auto;
    padding: 0px;
    text-align: center;


    background-color: #f7f7f7;
    -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    box-shadow: none;
}
#output{
    /*position: absolute;*/
    width: 300px;
    top: -75px;
    left: 0;
color: white;
}

#output.alert-success{
    background: rgb(25, 204, 25);
}

#output.alert-danger{
    background: rgb(228, 105, 105);
}


.form-box input[type='text'],
.form-box input[type='password']{
    width: 100%;
    padding: 10px;
    text-align: center;
    height:40px;
    border: 1px solid #ccc;;
    background: #fafafa;
    transition:0.2s ease-in-out;

}

.form-box input:focus{
    outline: 0;
    background: #eee;
}

.form-box input[type="text"]{
    border-radius: 5px 5px 0 0;
    text-transform: lowercase;
}

.form-box input[type="password"]{
    border-radius: 0 0 5px 5px;
    border-top: 0;
}

.form-box button.login{
    margin-top:15px;
    padding: 10px 20px;
}