table th img {
  height: 1rem;
  vertical-align: middle;
}

i.fa.fa-bolt, i.fa.fa-globe, i.fa.fa-diagram-project, i.fa.fa-grapes {
  font-size: 1rem;
  text-align: center;
  width: 1rem;
  vertical-align: middle;
}

i.fa {
  width: 1rem;
  font-size: 1rem;
  text-align: center;
  vertical-align: middle;
}

.letter-index {
  display: inline-flex;
}

.letter-index p {
  display: flex;
  min-width: 2.3rem;
  justify-content: center;
}

.letter-index.link-empty a {
  pointer-events: none;
  color: #888888;
}

.version-list p.last {
  display: none;
}

.version-list:hover p.last {
  display: block;
}

.version-list a {
  display: inline-block;
  min-width: 10rem;
}

.md-typeset a.help-button {
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  width: auto;
  height: 2rem;
  color: #f2f2f2;
  background-color: #333333;
  text-align: center;
  box-shadow: 2px 2px 2px rgba(51, 51, 51, 0.8);
  border-radius: 1rem;
  padding: 0.3rem 1rem;
}

@media print {
  .help-button {
    display: none;
  }
}

.align-center img {
  margin-left: auto;
  margin-right: auto;
  display: block;
}

@media only screen and (max-width: 76.1875em) {
  .md-content {
    margin-right: 0rem;
  }
}

.caption {
  font-size: 85%;
}

.footnote-reference {
  vertical-align: super;
  font-size: 75%;
}

.figure {
  display: inline;
}

/* hide link style when no documentation history available or dev version */
a.no-style-link[href="#"] {
  color: #333333;
  pointer-events: none;
}
/* add space to the elements. First child is the title */
details.with-top-margin :nth-child(2) {
  margin-top: .6rem;
}

.first-line-details {
  display: flex;
  flex-wrap: wrap;
}
/* show error color when value is not provided */
.colored-error i.error,
.colored-error i.error + span {
  color: #ff5252;
}
/* replace html spaces by css spaces */
.first-line-details i + span {
  margin: 0 10px 0 5px;
}

/* add color to unmaintained title */
section#unmaintained h2 {
    color: #ff5252;
}

/* style used for topic / tag items */
.pill-button {
  background-color: #dde9f2;
  border: none;
  color: black;
  padding: 5px 15px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  margin: 4px 4px;
  border-radius: 16px;
}

/* STYLES FOR CUSTOM NAVBARS WITH FILTER AND CONTENT */

/* display the anchor element on headers only when hover */
.md-typeset h1:hover a.headerlink {
  opacity: 1;
}

/* hide sidebars because we will use custom filter bar */
.md-sidebar.md-sidebar--primary,
.md-sidebar.md-sidebar--secondary {
  display: none;
}

/* remove style from original left and right sidebar */
.md-content,
.md-content__inner {
  margin-right: 0rem;
  margin-left: 0rem;
}
.md-content__inner:before {
  height: 0;
}
.md-grid {
  padding-top: 0;
  max-width: 100%;
}

/* create own left sidebar and content */
.md-content .custom-left-sidebar {
  position: sticky;
  width: 12rem;
  overflow: hidden;
  top: 60px;
  display: inline-block;
  vertical-align: top;
  margin: 0 1vw;
}
.md-content .project-list {
  display: inline-block;
  width: calc(90vw - 12rem);
  padding: 0 2vw;
  border-left: 1px solid;
}
@media only screen and (max-width: 777px) {
  .md-content .project-list,
  .md-content .custom-left-sidebar {
    display: block;
  }
  .md-content .project-list {
    width: 90%;
    margin: 0 auto;
  }
  .md-content .custom-left-sidebar {
    position: relative;
    top: 0px;
    margin: 0 auto;
    width: 90%;
  }
}
/* Center page header */
#software-catalog > h1 {
  text-align: center;
}

/* used to hide section when filter is applied */
.project-list.loading {
  display: none;
}
.project-list section.filtered-hide {
  display: none;
}

.project-list section > h1 {
  margin-top: 2rem;
  margin-bottom: 1rem;
}

.project-list .projects-title {
  font-size: 2.5rem;
}

/* custom theming the filter inputs */
.custom-left-sidebar .name-filter {
  border: solid 1px;
  height: 35px;
  padding: 10px;
  width: 100%;
  border-radius: 5px;
}
.custom-left-sidebar .teams-dropdown {
  height: 35px;
  width: 100%;
  border-radius: 5px;
  padding: 5px;
}
.custom-left-sidebar .reset-filter-btn {
  border: solid 1px;
  padding: 5px 10px;
  border-radius: 5px;
  margin: 20px 10px 0 0;
}
.custom-left-sidebar input[type='checkbox'] {
  margin: 0 5px 0 0;
}
.custom-left-sidebar .filter-title {
  font-size: 1.5rem;
}

.custom-left-sidebar > div {
  margin: 10px 0;
}