flux2/docs/_static/custom.css

@import url("https://fonts.googleapis.com/css?family=Montserrat&display=swap");

body {
  font-family: "Montserrat", sans-serif;
}

.md-logo {
    width: 40px;
    height: 40px;
    padding-bottom: 2px;
    padding-top: 2px;
}
.md-logo img {
    width: 40px;
    height: 40px;
}

.md-header, .md-footer-nav {
    background-image: linear-gradient(45deg, rgb(0, 150, 225) 0%, rgb(27, 141, 226) 24%, rgb(42, 125, 227) 53%, rgb(53, 112, 227) 78%, rgb(53, 112, 227) 100%);
}

.md-header-nav__title {
    font-size: .85rem;
}

.check-bullet {
  color:#07bfa5;
  background-color: white;
  margin-left:-22px;
}

/* Progress bar styling */

.progress-label {
    position: absolute;
    text-align: center;
    font-weight: 700;
    width: 100%;
    /* remove original styling for thin styling
    margin: 0 ! important; */
    margin-top: -0.4rem ! important;
    line-height: 1.2rem;
    white-space: nowrap;
    overflow: hidden;
  }
  
  .progress-bar {
    /*remove original styling for thin styling
    height: 1.2rem; */
    height: 0.4rem;
    float: left;
    background: repeating-linear-gradient(
        45deg,
        rgba(255, 255, 255, 0.2),
        rgba(255, 255, 255, 0.2) 10px,
        rgba(255, 255, 255, 0.3) 10px,
        rgba(255, 255, 255, 0.3) 20px
      ) #2979ff;
      border-radius: 2px;
  }
  
  .progress {
    display: block;
    width: 100%;
    /* remove original styling for thin styling
    margin: 0.5rem 0;
    height: 1.2rem; */
    margin-top: 0.9rem;
    height: 0.4rem;
    background-color: #eeeeee;
    position: relative;
    border-radius: 2px;
  }

  .progress-100plus .progress-bar {
    background-color: #00c853;
  }
  
  .progress-80plus .progress-bar {
    background-color: #64dd17;
  }
  
  .progress-60plus .progress-bar {
    background-color: #fbc02d;
  }
  
  .progress-40plus .progress-bar {
    background-color: #ff9100;
  }
  
  .progress-20plus .progress-bar {
    background-color: #ff5252;
  }
  
  .progress-0plus .progress-bar {
    background-color: #ff1744;
  }

/* Custom admonitions */
/* See https://squidfunk.github.io/mkdocs-material/reference/admonitions */
:root {
  --md-admonition-icon--heart: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14 20.408c-.492.308-.903.546-1.192.709-.153.086-.308.17-.463.252h-.002a.75.75 0 0 1-.686 0 16.709 16.709 0 0 1-.465-.252 31.147 31.147 0 0 1-4.803-3.34C3.8 15.572 1 12.331 1 8.513 1 5.052 3.829 2.5 6.736 2.5 9.03 2.5 10.881 3.726 12 5.605 13.12 3.726 14.97 2.5 17.264 2.5 20.17 2.5 23 5.052 23 8.514c0 3.818-2.801 7.06-5.389 9.262A31.146 31.146 0 0 1 14 20.408z"/></svg>')
}
.md-typeset .admonition.heart,
.md-typeset details.heart {
  border-color: rgb(233, 30, 99);
}
.md-typeset .heart > .admonition-title,
.md-typeset .heart > summary {
  background-color: rgba(233, 30, 99, 0.1);
}
.md-typeset .heart > .admonition-title::before,
.md-typeset .heart > summary::before {
  background-color: rgb(233, 30, 99);
  -webkit-mask-image: var(--md-admonition-icon--heart);
          mask-image: var(--md-admonition-icon--heart);
}

.timetable-explicit-col-widths th:nth-child(1) { width: 4%; }
.timetable-explicit-col-widths th:nth-child(2) { width: 32%; }
.timetable-explicit-col-widths th:nth-child(3) { width: 32%; }
.timetable-explicit-col-widths th:nth-child(4) { width: 32%; }