@media (max-width: 992px) {
    .container {
        width: 100%;
    }
}

@-ms-viewport {
    width: device-width;
}

body {
    font-family: "Trebuchet MS", sans-serif !important;
}

.login-screen {
    margin-top: 250px;
}

.table-xs th, .table-xs td {
    padding: 1px !important;
}

.table-xs input {
    padding: 0 !important;
}

table.table th, table.table td {
   vertical-align: middle;
}
.base {
    padding-top: 40px;
    margin-top: 40px;
}

body {
    min-height: 100%;
}

.navbar {
    background-color: white;
}

.nav-item {
    text-align: left;
}

.number {
    width: 100% !important;
    max-width: 100%;
    text-align: center;
    padding: 0 !important;
    padding-top: 5.25px !important;
    padding-bottom: 5.25px !important;
    background-color: transparent;
    overflow-y: visible;
}

.month .number{
    max-width: 150px;
}

.invis {
    color: rgba(0, 0, 0, 0) !important;
}

.invis:focus-within, .invis:-moz-focusring {
    color: black !important;
}

.invis:active, .invis:focus {
    color: black !important;
}

th.rotate {
    /* Something you can count on */
    height: 140px !important;
    white-space: nowrap !important;

}

th.rotate > div {
    transform: /* Magic Numbers */ translate(0px, 60px) /* 45 is really 360 - 45 */ rotate(315deg) !important;
    width: 30px !important;
    margin-top: -75px !important;
}

th.rotate > div > span {
    padding: 0 15px !important;
}

.no-border {
    border: black solid 0 !important;
}

.hidden {
    display: none;
}

@media (min-width: 992px) {
    th.th-weekday {
        white-space: nowrap;
    }
}

th.th-day {
    white-space: nowrap;
}

input[readonly]{
    background-color: lightgrey;
    color: darkslategray;
}

th.job-1{
    border-bottom: 3px solid black !important;
    background-color: lightgray;
}

table.table-sm td{
    padding: 0 !important;
}

#weekstaat-container{
    margin-left:15px!important;
    max-width:95%!important;
}
@media (min-width: 992px) {
    #weekstaat-container{
        margin-left:15%!important;
        max-width: 70%!important;
    }
}

#weekstaat-container .number{
    max-width: 85px;
}

.month td, .month th{
    max-width: 125px;
}
#hours-table{
    min-width: 50%;
    max-width: 100%;
    width:auto;
}

.show_pointer{
    cursor: pointer;
}