// Styles specific to the main page content.

.docs-page-title {
  margin-top: 0.5rem;
  display: inline-block;
  vertical-align: middle;
}

.docs-component section {
  position: relative;
}

.docs-component hr {
  max-width: none;
}

.docs-component .thumbnail {
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.docs-component .callout code {
  background: rgba($code-background, 0.5);
}

.docs-js.has-tip {
  border-bottom: 0;
}

.docs-js.label {
  background: #F0DB4F;
  color: black;
  margin-left: 10px;
  vertical-align: middle;
}

.docs-mui.label {
  background: #c6538c;
  margin-left: 10px;
  vertical-align: middle;
}

.docs-lib.label {
  margin-left: 10px;
  vertical-align: middle;

  a {
    color: white;
  }
}