html {
}
body{
    height:90vh;
    margin: 0;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-image: linear-gradient(to top, #f4b856, #fac54c, #fdd340, #fde232, #faf223);
}
.navbar{
    margin-top:1.2rem;
}
.head-logo{
    display: flex;margin:0 auto;justify-content: space-between;width: 90%;
}

#username-txt{
    margin-bottom:20px;
}
#password-txt{
    margin-bottom:20px;
}
#content-starter{
    margin-top:4rem;
}
#content-survey{
    margin-top:4rem;
}
#waktu-pelayanan{
    margin-top:3rem;
}
#stopwatch{
    margin-bottom:3rem;font-size: 7rem;
}
.timer{
    text-align:center;
}

.clock{
    font-size:3rem;
}

.dates{
    font-size:1.4rem;
}
#login-head{
    margin-top:5vh;
    margin-bottom:5vh;
}
#login-box{
    border:solid 1px lightgray;
    border-radius:4px 4px 4px 4px;
    width:500px;margin:0 auto;
    background: rgba(255, 255, 255,0.7);
    height:50vh;
    padding-left:50px;
    padding-right:50px;
    padding-top:20px;
    padding-bottom:20px;
    font-size: 1.5rem;
}
#login-box h3{
    font-size: 2.5rem;
    margin-top:1vh;
    margin-bottom:2vh;
}

#login-box input{
    font-size: 1.5rem;
    height:30px;
}
#login-btn{
    width:90%;margin:0 auto;
}
#login-btn button{
    font-size: 1.7rem;
}
#content-box{
    border:solid 1px lightgray;
    border-radius:4px 4px 4px 4px;
    width:90%;
    margin:0 auto;
    margin-bottom:20px;
    background: rgba(255, 255, 255,0.7);
    height:auto;padding-left:50px;padding-right:50px;padding-top:20px;padding-bottom:20px;
}
#button-menu{
    margin:0 auto;
    margin-top:20px;
    width:90%;
    left:0;
    right:0;
    height:60px;
    text-decoration: none;
    color:white;
    font-size:1.7rem !important;
    display: flex;
    justify-content: center;
    flex-direction: column;
    white-space: pre-wrap;
}

#button-starter{
    margin:0 auto;
    margin-top:20px;
    width:180px;
    height:50px;
    left:0;
    right:0;
    text-decoration: none;
    color:white;
    font-size:1.7rem !important;
    padding:5px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.navigate-bar{
    background-color:rgba(255, 255, 255,0.4);width: 100%;padding:10px;display:flex;justify-content: space-between;
}

.logout-bar{
    position: relative;
    margin: 0 0 0 auto;
}

.modal{
    opacity:1;
}

#button-menu.btn.btn-primary.group{
    white-space:unset;
}

/* vertically center dialog */
.modal-dialog {
    min-height: calc(100vh - 60px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: auto;
}
@media(max-width: 768px) {
  .modal-dialog {
    min-height: calc(100vh - 20px);
  }
}