body {
    padding-top: 5rem;
}

.navbar.bg-dark {
    background-color: #343a40 !important;
}

.navbar-dark .navbar-brand {
    background-color: #ffffff !important;
}

h1 {
    padding-bottom: 30px;
}

.vertical-th {
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    width: 1.5em;
}

.vertical-th div {
    -moz-transform: rotate(-90.0deg);  /* FF3.5+ */
    -o-transform: rotate(-90.0deg);  /* Opera 10.5 */
    -webkit-transform: rotate(-90.0deg);  /* Saf3.1+, Chrome */
    filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);  /* IE6,IE7 */
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)"; /* IE8 */
    margin-left: -10em;
    margin-right: -10em;
}

th.vertical-th {
    padding: 0px;
}

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

}

th.rotate > div {
    transform:
            translate(0px, 92px) rotate(270deg);
    width: 30px;
}
th.rotate > div > span {
    padding: 5px 30px;
}