body {
    padding-top: 56px;
}

header {
  padding: 156px 0 100px;
}

section {
  padding: 150px 0;
}

section {
  padding: 70px 0
}

a.nav-link {
  cursor: pointer;
  font-weight: 300;
}

.navbar-brand {
  color: #fff !important;
  font-weight: 700
}

.card-body {
  padding-bottom: 0 !important;
  text-align: center;
}

p.card-text {
  font-size: 11px;
  font-weight: 300;
  min-height: 33px;
}

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

div.section-description {
  margin: 20px 0;
  font-size: 14px;
  font-weight: 300;
}

section h2 {
  font-weight: 700
}

.feature-select button {
  font-weight: 300
}

.card-image-top {
  padding-bottom: 7px;
}

.skeleton-loader {
  width: 80%;
  height: 285px;
  margin: 0 auto;
  margin-top: 25px;
  margin-bottom: 140px;
  background-size: 50px 350px;
  background-position: 0 0;
  background-repeat: no-repeat;
  border-radius: 3px;
  animation: skeleton-loading 1s linear infinite alternate;
  opacity: 0.7
}

@keyframes skeleton-loading {
  0% {
    background-color: hsl(200, 20%, 70%);
  }
  100% {
    background-color: hsl(200, 20%, 95%);
  }
}

/* overview tables */
table.overview{
    margin: 25px;
}
table.overview tbody td.metric{
    white-space: nowrap;
    min-width: max-content;
    width: 200px;
}
table.overview tbody td:not(.metric){
   border: 1px solid #333;
   text-align: center;
}
.g{
    background: {{ green }};
}
.y{
    background: {{ yellow }};
}
.r{
    background: {{ red }};
}
table.overview tfoot td {
    padding-top: 5px;
    text-align: center;
}
table.overview tfoot td span{
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    white-space: nowrap;

    font-size: 14px;
    font-weight: 300;
}

/* overview progress bars */
.tl-bar{
    padding-top:10px;
    padding-bottom:10px;
    color: white;
    text-align:center;
    padding-left:6px;
    padding-right: 6px;
    min-width: max-content;
}
.tl-container{
    display: flex;
    width: 100%;
}

#settings-btn{
    background-color: transparent;
    border-color: #666;
}