@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@700&display=swap");
body {
  background-color: #101214;
  font-family: "Roboto", sans-serif;
  font-size: 100%;
  line-height: 1.5;
}

a {
  transition: background-color ease 0.2s, color ease 0.2s;
  text-decoration: none;
}
a:hover, a:active {
  color: white;
  text-decoration: none;
}

ul.comma-list {
  display: inline;
  margin: 0;
  padding: 0;
}
ul.comma-list li {
  display: inline;
}
ul.comma-list li::after {
  content: ", ";
}
ul.comma-list li:last-child::after {
  content: "";
}

.cursor-auto {
  cursor: auto;
}

.cursor-default {
  cursor: default;
}

.cursor-pointer {
  cursor: pointer;
}

.cursor-wait {
  cursor: wait;
}

.cursor-text {
  cursor: text;
}

.cursor-move {
  cursor: move;
}

.cursor-help {
  cursor: help;
}

.cursor-not-allowed {
  cursor: not-allowed;
}

/**
 * TYPOGRAPHY
 */
p:last-of-type {
  margin-bottom: 0 !important;
}

h1, h2, h3, h4, h5, h6 {
  margin: 2rem 0 1.25rem;
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  line-height: 1.25;
}

h1 {
  margin-top: 0;
  font-size: 3rem;
}

h2 {
  font-size: 2.5rem;
}

h3 {
  font-size: 2rem;
}

h4 {
  font-size: 1.72rem;
}

h5 {
  font-size: 1.44rem;
}

h6 {
  font-size: 1.2rem;
}

small, .text-sm, .text-small {
  font-size: 0.8333rem;
}

.text-xs, .text-smaller {
  font-size: 0.75rem;
}

.fw-100 {
  font-weight: 100;
}

.fw-200 {
  font-weight: 200;
}

.fw-300 {
  font-weight: 300;
}

.fw-400 {
  font-weight: 400;
}

.fw-500 {
  font-weight: 500;
}

.fw-600 {
  font-weight: 600;
}

.fw-700 {
  font-weight: 700;
}

.fw-800 {
  font-weight: 800;
}

.fw-900 {
  font-weight: 900;
}

#header .site-title {
  font-family: "Roboto Condensed", sans-serif;
  font-size: 2.5rem;
}

/**
 * All menu styling goes here.
 */
li.breadcrumb-item > a:hover, li.breadcrumb-item > a:active {
  text-decoration: underline;
}

@media all and (min-width: 800px) {
  .nav-item > .dropdown-menu {
    margin-top: 0;
  }
  .nav-item > .dropdown-menu:hover,
  .nav-item > .dropdown-hover:hover + .dropdown-menu {
    display: block;
  }
}
input#font-text-preview:focus {
  background-color: var(--bs-light-rgb) !important;
}

select#font-size-value {
  appearance: none;
  background: transparent url("/themes/custom/xylotstrap/images/caret-dark.svg") no-repeat 110% center;
  background-size: 50% 50%;
  transition: background-color ease 0.2s, color ease 0.2s;
}
select#font-size-value:hover {
  background-color: #202428 !important;
  color: white !important;
}
select#font-size-value option {
  background-color: #202428;
  color: #c0c4c8;
}

.font-preview-pane {
  position: relative;
  flex: 1;
  min-width: 1px;
}
.font-preview-pane::after {
  background: linear-gradient(-90deg, #101214, rgba(16, 18, 20, 0));
  content: "";
  display: block;
  position: absolute;
  width: 125px;
  height: 100%;
  right: 0;
  top: 0;
  pointer-events: none;
}
.font-preview-pane p.font-preview-text {
  font-family: "Cabin", sans-serif;
  font-size: 36px;
}
.font-preview-pane a.font-variant-select:hover, .font-preview-pane a.font-variant-select:active {
  background-color: #202428 !important;
}

/*# sourceMappingURL=style.css.map */