.menu_img {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    height: 17px;
}

body,
html {
    margin: 0;
    padding: 0;
}

.form-group.required .control-label:after {
    content: "*";
    color: red;
}

.card {
    margin: 0 auto;
    /* Added */
    float: none;
    /* Added */
    margin-bottom: 10px;
    /* Added */
}

body {
    text-align: center;
    background-color: #ffffff;
    /* background-color: #f5f5f5; */

}
.completed-cell{
    background-color: greenyellow;
    height: 40px;
    width: 40px;
}
.no-completed-cell{
    background-color: lightcoral;
    height: 40px;
    width: 40px;
}
#login {
    display: inline-block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.pt-3-half {
    padding-top: 1.4rem;
}

output {
    display: block;
    margin-top: 4em;
    font-family: monospace;
    font-size: .8em;
}

.btn-outline-dark:hover{color:#000000;background-color:#A5D2FF;border-color:#A5D2FF}
.btn-outline-dark:not([disabled]):not(.disabled):active,.show>.btn-outline-dark.dropdown-toggle{color:#000000;background-color:#A5D2FF;border-color:#A5D2FF;box-shadow:0 0 0 .2rem rgba(52,58,64,.5)}
.btn-outline-dark{border-color:lightgray}
