body,
html {
    height: 100%;
    margin: 0;
} 

.user-panel { 
    border-right: 1px solid #000; 
    max-height: 50%;
    padding: 4% 15;
}

.user-panel,
.login-panel {
    padding-bottom: 20px;
} 

.username-btn  { 
    padding: 6px; 
}

.username-btn button { 
    width: 100%; 
    height: auto; 
}

.username-btn button p { 
    margin-bottom: .2rem;
}

.numeric_keypad_row {
    padding: 0 30%;
}
.numeric_keypad_row .keypad-btn {
    padding: 4px;
}
.numeric_keypad_row .keypad-btn button {
   height: 50px;
   width: 100%;
}

.login-area { 
}

.clock-status {
    margin-bottom: 30px; 
}

.customMargin{
    margin-bottom:17px;
}


.btn-outline-primary {
    color: #041A79 !important;
    border-color: #041A79 !important;
}

.btn-outline-primary:hover {
    color: #fff !important;
    background-color: #041A79 !important;
    border-color: #041A79 !important;
}


.btn-primary {
    color: #fff;
    background-color: #041A79 !important;
    border-color: #041A79 !important;
}