.page__content {
    max-width: 760px;
    margin-right: auto;
    margin-left: auto;
}

.flash {
    color: #ff0000;
}

.footer {
    margin-top: 50px;
}

.text-center {
    text-align: center;
}

.font span.already-inputted {
    color: #3c8dbc;
}

.font span.yet-inputted {
    color: #f56954;
}

.font span.approved {
    color: #00a65a;
}

.bg span.approved {
    background-color: #00a65a;
}

.bg span.yet-approved {
    background-color: #f56954;
}

.bg span.already-inputted {
    background-color: #3c8dbc;
}

.bg span.yet-inputted {
    background-color: #f56954;
}

.bg span.locked {
    background-color: #00a65a;
}

.bg span.unlocked {
    background-color: #f56954;
}

.bg .pending {
    width: 50%;
    background-color: #f56954;
}

.bg .assigned {
    width: 50%;
    background-color: #3c8dbc;
}

.bg .denied {
    width: 50%;
    background-color: #d2d6de;
}

.list-margin {
    margin-top: 15px;
    margin-bottom: 35px;
}

.subheading {
    margin-top: 50px;
}

.mr-5 {
    margin-right: 5px;
}

.mr-15 {
    margin-right: 15px;
}

.mt-15 {
    margin-top: 15px;
}

.mt-100 {
    margin-top: 100px;
}

.mb-15 {
    margin-bottom: 15px;
}

.ml-auto {
    margin-left: auto;
}

.mr-auto {
    margin-right: auto;
}

.btn-login {
    width: 95%;
    margin: 15px auto 0px;
}

.word-break-all {
    word-break: break-all;
}

.icon-color-blue {
    color: #3c8dbc;
}

.icon-color-red {
    color: #f56954;
}

.icon-color-gray {
    color: #808080;
}

.icon-color-white {
    color: #ffffff;
}

.text-white {
    color: #ffffff;
}

.text-black {
    color: #000;
}

.btn-shift-cancel {
    background: #d2d6de;
    font-size: 0.8em;
    padding: 0px;
    line-height: unset;
}

.btn-shift-cancel:hover {
    cursor: pointer;
    opacity: 0.6;
}

[v-cloak] {
    display: none;
}