

.fa-solid,
.fa-regular,
.fa-brands,
.fa-classic,
.fas,
.far,
.fab,
.fal,
.fat,
.fad,
.fadr,
.fadl,
.fadt,
.fass,
.fasr,
.fasl,
.fast,
.fasds,
.fasdr,
.fasdl,
.fasdt,
.faslr,
.faslpr,
.fasldr,
.faslpdr,
.fapr,
.fams,
.favs,
.fawsb,
.fatl,
.fans,
.fands,
.faes,
.fagt,
.fajr,
.fajfr,
.fajdr,
.facr,
.fausb,
.faudsb,
.faufsb,
.fa-solid,
.fa-semibold,
.fa-regular,
.fa-light,
.fa-thin,
.fa-brands,
.fa-classic,
.fa-duotone,
.fa-sharp,
.fa-sharp-duotone,
.fa-chisel,
.fa-etch,
.fa-graphite,
.fa-jelly,
.fa-jelly-duo,
.fa-jelly-fill,
.fa-mosaic,
.fa-notdog,
.fa-notdog-duo,
.fa-pixel,
.fa-slab,
.fa-slab-duo,
.fa-slab-press,
.fa-slab-press-duo,
.fa-thumbprint,
.fa-utility,
.fa-utility-duo,
.fa-utility-fill,
.fa-vellum,
.fa-whiteboard,
.fa {
  --_fa-family: var(--fa-family, var(--fa-style-family, "Font Awesome 7 Pro"));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: var(--fa-display, inline-block);
  font-family: var(--_fa-family);
  font-feature-settings: normal;
  font-style: normal;
  font-synthesis: none;
  font-variant: normal;
  font-weight: var(--fa-style, 900);
  line-height: 1;
  text-align: center;
  text-rendering: auto;
  width: var(--fa-width, 1.25em)
}

:is(.fas, .fass, .far, .fasr, .fal, .fasl, .fat, .fast, .fad, .fadr, .fadl, .fadt, .fasds, .fasdr, .fasdl, .fasdt, .fab, .faslr, .faslpr, .fasldr, .faslpdr, .fapr, .fams, .favs, .fawsb, .fatl, .fans, .fands, .faes, .fagt, .fajr, .fajfr, .fajdr, .facr, .fausb, .faudsb, .faufsb, .fa-solid, .fa-semibold, .fa-regular, .fa-light, .fa-thin, .fa-brands, .fa-classic, .fa-duotone, .fa-sharp, .fa-sharp-duotone, .fa-chisel, .fa-etch, .fa-graphite, .fa-jelly, .fa-jelly-duo, .fa-jelly-fill, .fa-mosaic, .fa-notdog, .fa-notdog-duo, .fa-pixel, .fa-slab, .fa-slab-duo, .fa-slab-press, .fa-slab-press-duo, .fa-thumbprint, .fa-utility, .fa-utility-duo, .fa-utility-fill, .fa-vellum, .fa-whiteboard, .fa):before {
  content: var(--fa)/""
}

@supports not (content:"" /"") {
  :is(.fas, .fass, .far, .fasr, .fal, .fasl, .fat, .fast, .fad, .fadr, .fadl, .fadt, .fasds, .fasdr, .fasdl, .fasdt, .fab, .faslr, .faslpr, .fasldr, .faslpdr, .fapr, .fams, .favs, .fawsb, .fatl, .fans, .fands, .faes, .fagt, .fajr, .fajfr, .fajdr, .facr, .fausb, .faudsb, .faufsb, .fa-solid, .fa-semibold, .fa-regular, .fa-light, .fa-thin, .fa-brands, .fa-classic, .fa-duotone, .fa-sharp, .fa-sharp-duotone, .fa-chisel, .fa-etch, .fa-graphite, .fa-jelly, .fa-jelly-duo, .fa-jelly-fill, .fa-mosaic, .fa-notdog, .fa-notdog-duo, .fa-pixel, .fa-slab, .fa-slab-duo, .fa-slab-press, .fa-slab-press-duo, .fa-thumbprint, .fa-utility, .fa-utility-duo, .fa-utility-fill, .fa-vellum, .fa-whiteboard, .fa):before {
    content: var(--fa)
  }
}

:is(.fad, .fa-duotone, .fadr, .fadl, .fadt, .fasds, .fa-sharp-duotone, .fasdr, .fasdl, .fasdt, .fatl, .fa-thumbprint, .fands, .fa-notdog-duo, .fajdr, .fa-jelly-duo, .faudsb, .fa-utility-duo, .fasldr, .fa-slab-duo, .faslpdr, .fa-slab-press-duo, .favs, .fa-vellum):after {
  content: var(--fa)/"";
  font-feature-settings: "ss01"
}

@supports not (content:"" /"") {
  :is(.fad, .fa-duotone, .fadr, .fadl, .fadt, .fasds, .fa-sharp-duotone, .fasdr, .fasdl, .fasdt, .fatl, .fa-thumbprint, .fands, .fa-notdog-duo, .fajdr, .fa-jelly-duo, .faudsb, .fa-utility-duo, .fasldr, .fa-slab-duo, .faslpdr, .fa-slab-press-duo, .favs, .fa-vellum):after {
    content: var(--fa)
  }
}

.fa-1x {
  font-size: 1em
}

.fa-2x {
  font-size: 2em
}

.fa-3x {
  font-size: 3em
}

.fa-4x {
  font-size: 4em
}

.fa-5x {
  font-size: 5em
}

.fa-6x {
  font-size: 6em
}

.fa-7x {
  font-size: 7em
}

.fa-8x {
  font-size: 8em
}

.fa-9x {
  font-size: 9em
}

.fa-10x {
  font-size: 10em
}

.fa-2xs {
  font-size: .625em;
  line-height: .1em;
  vertical-align: .225em
}

.fa-xs {
  font-size: .75em;
  line-height: .0833333em;
  vertical-align: .125em
}

.fa-sm {
  font-size: .875em;
  line-height: .0714286em;
  vertical-align: .0535715em
}

.fa-lg {
  font-size: 1.25em;
  line-height: .05em;
  vertical-align: -.075em
}

.fa-xl {
  font-size: 1.5em;
  line-height: .0416667em;
  vertical-align: -.125em
}

.fa-2xl {
  font-size: 2em;
  line-height: .03125em;
  vertical-align: -.1875em
}

.fa-width-auto {
  --fa-width: auto
}

.fa-fw,
.fa-width-fixed {
  --fa-width: 1.25em
}

.fa-canvas-square {
  padding-block: .125em;
  margin-block-end: -.125em
}

.fa-canvas-roomy {
  padding-block: .25em;
  padding-inline: .125em;
  margin-block-end: -.25em;
  box-sizing: content-box
}

.fa-ul {
  list-style-type: none;
  margin-inline-start: var(--fa-li-margin, 2.5em);
  padding-inline-start: 0
}

.fa-ul>li {
  position: relative
}

.fa-li {
  inset-inline-start: calc(-1*var(--fa-li-width, 2em));
  position: absolute;
  text-align: center;
  width: var(--fa-li-width, 2em);
  line-height: inherit
}

.fa-border {
  border-color: var(--fa-border-color, #eee);
  border-radius: var(--fa-border-radius, .1em);
  border-style: var(--fa-border-style, solid);
  border-width: var(--fa-border-width, .0625em);
  box-sizing: var(--fa-border-box-sizing, content-box);
  padding: var(--fa-border-padding, .1875em .25em)
}

.fa-pull-left,
.fa-pull-start {
  float: inline-start;
  margin-inline-end: var(--fa-pull-margin, .3em)
}

.fa-pull-right,
.fa-pull-end {
  float: inline-end;
  margin-inline-start: var(--fa-pull-margin, .3em)
}

.fa-beat {
  animation-name: fa-beat;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, ease-in-out)
}

.fa-bounce {
  animation-name: fa-bounce;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, cubic-bezier(.28, .84, .42, 1))
}

.fa-fade {
  animation-name: fa-fade;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, ease-in-out)
}

.fa-beat-fade {
  animation-name: fa-beat-fade;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, ease-in-out)
}

.fa-flip {
  animation-name: fa-flip;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1.5s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, ease-in-out)
}

.fa-flip-360 {
  animation-name: fa-flip-360;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, ease-in-out)
}

.fa-shake {
  animation-name: fa-shake;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, .75s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, ease-in-out)
}

.fa-spin {
  animation-name: fa-spin;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 2s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, linear)
}

.fa-spin-reverse {
  --fa-animation-direction: reverse
}

.fa-pulse,
.fa-spin-pulse {
  animation-name: fa-spin;
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, steps(8))
}

.fa-spin-snap {
  animation-name: fa-spin-snap;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 3s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, linear)
}

.fa-spin-snap-4 {
  animation-name: fa-spin-snap-4;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 2.4s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, linear)
}

.fa-spin-snap-8 {
  animation-name: fa-spin-snap-8;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 4s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, linear)
}

.fa-buzz {
  animation-name: fa-buzz;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, .6s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, linear)
}

.fa-wag {
  animation-name: fa-wag;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, .9s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, ease-out);
  transform-origin: bottom
}

.fa-float {
  animation-name: fa-float;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 3s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, ease-in-out);
  will-change: transform
}

.fa-swing {
  animation-name: fa-swing;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1.2s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, ease-out);
  transform-origin: top
}

.fa-jello {
  animation-name: fa-jello;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, .9s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, ease-out)
}

@media (prefers-reduced-motion:reduce) {

  .fa-beat,
  .fa-bounce,
  .fa-fade,
  .fa-beat-fade,
  .fa-flip,
  .fa-flip-360,
  .fa-pulse,
  .fa-shake,
  .fa-spin,
  .fa-spin-pulse,
  .fa-buzz,
  .fa-float,
  .fa-jello,
  .fa-spin-snap,
  .fa-spin-snap-4,
  .fa-spin-snap-8,
  .fa-swing,
  .fa-wag {
    animation: none !important;
    transition: none !important
  }
}

@keyframes fa-beat {
  0% {
    transform: scale(1)
  }

  25% {
    transform: scale(calc(1.25*var(--fa-beat-scale, 1.25)))
  }

  45% {
    transform: scale(calc(1.22*var(--fa-beat-scale, 1.22)))
  }

  65% {
    transform: scale(calc(1.25*var(--fa-beat-scale, 1.25)))
  }

  90% {
    transform: scale(1)
  }
}

@keyframes fa-bounce {
  0% {
    transform: scale(1)translateY(0);
    animation-timing-function: var(--fa-animation-timing)
  }

  14% {
    transform: scale(var(--fa-bounce-start-scale-x, 1.06), var(--fa-bounce-start-scale-y, .94))translateY(var(--fa-bounce-anticipation, 3px));
    animation-timing-function: cubic-bezier(.33, 0, .66, .33)
  }

  32% {
    transform: scale(var(--fa-bounce-jump-scale-x, .94), var(--fa-bounce-jump-scale-y, 1.12))translateY(calc(-1*var(--fa-bounce-height, .5em)));
    animation-timing-function: cubic-bezier(.33, .66, .66, 1)
  }

  52% {
    transform: scale(1, 1)translateY(calc(-1*var(--fa-bounce-height, .5em)*1.1));
    animation-timing-function: cubic-bezier(.5, 0, 1, .5)
  }

  70% {
    transform: scale(var(--fa-bounce-land-scale-x, 1.06), var(--fa-bounce-land-scale-y, .92))translateY(0);
    animation-timing-function: cubic-bezier(.33, .33, .66, 1)
  }

  85% {
    transform: scale(.98, 1.04)translateY(calc(-2px*var(--fa-bounce-rebound, 1)));
    animation-timing-function: cubic-bezier(.33, 0, .66, 1)
  }

  to {
    transform: scale(1)translateY(0)
  }
}

@keyframes fa-fade {
  0% {
    opacity: 1;
    transform: scale(1);
    animation-timing-function: cubic-bezier(.2, 0, .4, 1)
  }

  40% {
    opacity: var(--fa-fade-opacity, .4);
    transform: scale(.98);
    animation-timing-function: cubic-bezier(.4, 0, .6, 1)
  }

  to {
    opacity: 1;
    transform: scale(1)
  }
}

@keyframes fa-beat-fade {
  0% {
    opacity: var(--fa-beat-fade-opacity, .4);
    transform: scale(1);
    animation-timing-function: cubic-bezier(.2, 0, .4, 1)
  }

  25% {
    opacity: calc(var(--fa-beat-fade-opacity, .4) + .4);
    transform: scale(var(--fa-beat-fade-scale, 1.28));
    animation-timing-function: cubic-bezier(.4, 0, .6, 1)
  }

  45% {
    opacity: 1;
    transform: scale(var(--fa-beat-fade-scale, 1.25));
    animation-timing-function: cubic-bezier(.4, 0, .2, 1)
  }

  65% {
    opacity: calc(var(--fa-beat-fade-opacity, .4) + .4);
    transform: scale(var(--fa-beat-fade-scale, 1.28));
    animation-timing-function: cubic-bezier(.4, 0, .6, 1)
  }

  to {
    opacity: var(--fa-beat-fade-opacity, .4);
    transform: scale(1)
  }
}

@keyframes fa-flip {
  0% {
    transform: perspective(2em)scale(1)rotate3d(var(--fa-flip-x, 0), var(--fa-flip-y, 1), var(--fa-flip-z, 0), 0deg);
    animation-timing-function: cubic-bezier(.2, 0, .4, 1)
  }

  8% {
    transform: perspective(2em)scale(var(--fa-flip-anticipation-scale, .95))rotate3d(var(--fa-flip-x, 0), var(--fa-flip-y, 1), var(--fa-flip-z, 0), 0deg);
    animation-timing-function: cubic-bezier(.33, 0, .66, .33)
  }

  35% {
    transform: perspective(2em)scale(1)rotate3d(var(--fa-flip-x, 0), var(--fa-flip-y, 1), var(--fa-flip-z, 0), calc(var(--fa-flip-angle, -360deg)*.6));
    animation-timing-function: linear
  }

  65% {
    transform: perspective(2em)scale(1)rotate3d(var(--fa-flip-x, 0), var(--fa-flip-y, 1), var(--fa-flip-z, 0), calc(var(--fa-flip-angle, -360deg)*.5));
    animation-timing-function: cubic-bezier(.33, .66, .66, 1)
  }

  92% {
    transform: perspective(2em)scale(1)rotate3d(var(--fa-flip-x, 0), var(--fa-flip-y, 1), var(--fa-flip-z, 0), calc(var(--fa-flip-angle, -360deg)*var(--fa-flip-overshoot, 1.04)));
    animation-timing-function: cubic-bezier(.33, 0, .66, 1)
  }

  to {
    transform: perspective(2em)scale(1)rotate3d(var(--fa-flip-x, 0), var(--fa-flip-y, 1), var(--fa-flip-z, 0), var(--fa-flip-angle, -360deg))
  }
}

@keyframes fa-flip-360 {
  0% {
    transform: perspective(2em)scale(1)rotate3d(var(--fa-flip-x, 0), var(--fa-flip-y, 1), var(--fa-flip-z, 0), 0deg);
    animation-timing-function: cubic-bezier(.2, 0, .4, 1)
  }

  8% {
    transform: perspective(2em)scale(var(--fa-flip-anticipation-scale, .95))rotate3d(var(--fa-flip-x, 0), var(--fa-flip-y, 1), var(--fa-flip-z, 0), 0deg);
    animation-timing-function: cubic-bezier(.33, 0, .66, .33)
  }

  50% {
    transform: perspective(2em)scale(1)rotate3d(var(--fa-flip-x, 0), var(--fa-flip-y, 1), var(--fa-flip-z, 0), calc(var(--fa-flip-angle, -360deg)*.6));
    animation-timing-function: cubic-bezier(.33, .66, .66, 1)
  }

  80% {
    transform: perspective(2em)scale(1)rotate3d(var(--fa-flip-x, 0), var(--fa-flip-y, 1), var(--fa-flip-z, 0), calc(var(--fa-flip-angle, -360deg)*var(--fa-flip-overshoot, 1.04)));
    animation-timing-function: cubic-bezier(.33, 0, .66, 1)
  }

  to {
    transform: perspective(2em)scale(1)rotate3d(var(--fa-flip-x, 0), var(--fa-flip-y, 1), var(--fa-flip-z, 0), var(--fa-flip-angle, -360deg))
  }
}

@keyframes fa-shake {
  0% {
    transform: rotate(0);
    animation-timing-function: cubic-bezier(.2, 0, .8, 1)
  }

  8% {
    transform: rotate(35deg)translate(1px);
    animation-timing-function: cubic-bezier(.3, 0, .7, 1)
  }

  20% {
    transform: rotate(-22deg)translate(-1px);
    animation-timing-function: cubic-bezier(.3, 0, .7, 1)
  }

  35% {
    transform: rotate(15deg)translate(1px);
    animation-timing-function: cubic-bezier(.3, 0, .7, 1)
  }

  50% {
    transform: rotate(-9deg);
    animation-timing-function: cubic-bezier(.4, 0, .6, 1)
  }

  65% {
    transform: rotate(5deg);
    animation-timing-function: cubic-bezier(.4, 0, .6, 1)
  }

  78% {
    transform: rotate(-3deg);
    animation-timing-function: cubic-bezier(.4, 0, .6, 1)
  }

  90% {
    transform: rotate(1deg);
    animation-timing-function: cubic-bezier(.4, 0, .2, 1)
  }

  to {
    transform: rotate(0)
  }
}

@keyframes fa-spin {
  0% {
    transform: rotate(0)
  }

  to {
    transform: rotate(360deg)
  }
}

@keyframes fa-spin-snap {
  0% {
    transform: rotate(0);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  12% {
    transform: rotate(60deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  16.67% {
    transform: rotate(60deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  28.67% {
    transform: rotate(120deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  33.33% {
    transform: rotate(120deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  45.33% {
    transform: rotate(180deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  50% {
    transform: rotate(180deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  62% {
    transform: rotate(240deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  66.67% {
    transform: rotate(240deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  78.67% {
    transform: rotate(300deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  83.33% {
    transform: rotate(300deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  95.33% {
    transform: rotate(360deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  to {
    transform: rotate(360deg)
  }
}

@keyframes fa-spin-snap-4 {
  0% {
    transform: rotate(0);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  15% {
    transform: rotate(90deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  25% {
    transform: rotate(90deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  40% {
    transform: rotate(180deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  50% {
    transform: rotate(180deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  65% {
    transform: rotate(270deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  75% {
    transform: rotate(270deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  90% {
    transform: rotate(360deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  to {
    transform: rotate(360deg)
  }
}

@keyframes fa-spin-snap-8 {
  0% {
    transform: rotate(0);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  9% {
    transform: rotate(45deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  12.5% {
    transform: rotate(45deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  21.5% {
    transform: rotate(90deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  25% {
    transform: rotate(90deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  34% {
    transform: rotate(135deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  37.5% {
    transform: rotate(135deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  46.5% {
    transform: rotate(180deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  50% {
    transform: rotate(180deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  59% {
    transform: rotate(225deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  62.5% {
    transform: rotate(225deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  71.5% {
    transform: rotate(270deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  75% {
    transform: rotate(270deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  84% {
    transform: rotate(315deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  87.5% {
    transform: rotate(315deg);
    animation-timing-function: cubic-bezier(0, 0, .2, 1)
  }

  96.5% {
    transform: rotate(360deg);
    animation-timing-function: cubic-bezier(.8, 0, 1, 1)
  }

  to {
    transform: rotate(360deg)
  }
}

@keyframes fa-buzz {
  0% {
    transform: translate(0)rotate(0);
    animation-timing-function: cubic-bezier(.1, 0, .9, 1)
  }

  5% {
    transform: translateX(var(--fa-buzz-distance, 4px))rotate(.5deg)
  }

  10% {
    transform: translateX(calc(-1*var(--fa-buzz-distance, 4px)))rotate(-.5deg)
  }

  15% {
    transform: translateX(var(--fa-buzz-distance, 4px))rotate(.3deg)
  }

  20% {
    transform: translateX(calc(-1*var(--fa-buzz-distance, 4px)))rotate(-.3deg)
  }

  25% {
    transform: translateX(calc(var(--fa-buzz-distance, 4px)*.7))rotate(.2deg)
  }

  30% {
    transform: translateX(calc(-1*var(--fa-buzz-distance, 4px)*.7))rotate(-.2deg)
  }

  35% {
    transform: translateX(calc(var(--fa-buzz-distance, 4px)*.4))rotate(.1deg)
  }

  40% {
    transform: translate(0)rotate(0)
  }

  to {
    transform: translate(0)rotate(0)
  }
}

@keyframes fa-wag {
  0% {
    transform: rotate(0);
    animation-timing-function: cubic-bezier(.2, 0, .6, 1)
  }

  12% {
    transform: rotate(var(--fa-wag-angle, 12deg));
    animation-timing-function: cubic-bezier(.4, 0, .2, 1)
  }

  24% {
    transform: rotate(2deg);
    animation-timing-function: cubic-bezier(.2, 0, .6, 1)
  }

  36% {
    transform: rotate(calc(var(--fa-wag-angle, 12deg)*.85));
    animation-timing-function: cubic-bezier(.4, 0, .2, 1)
  }

  48% {
    transform: rotate(1deg);
    animation-timing-function: cubic-bezier(.2, 0, .6, 1)
  }

  58% {
    transform: rotate(calc(var(--fa-wag-angle, 12deg)*.6));
    animation-timing-function: cubic-bezier(.4, 0, .2, 1)
  }

  68% {
    transform: rotate(0)
  }

  to {
    transform: rotate(0)
  }
}

@keyframes fa-float {
  0% {
    transform: translateY(0)translateX(0)rotate(0deg)scale(var(--fa-float-squash-x, 1.02), var(--fa-float-squash-y, .98));
    animation-timing-function: cubic-bezier(.33, 0, .66, .33)
  }

  15% {
    transform: translateY(calc(-.4*var(--fa-float-height, 6px)))translateX(var(--fa-float-drift, 1px))rotate(var(--fa-float-tilt, 1deg))scale(1, 1);
    animation-timing-function: cubic-bezier(.33, .66, .66, 1)
  }

  35% {
    transform: translateY(calc(-1*var(--fa-float-height, 6px)))translateX(0)rotate(0deg)scale(var(--fa-float-stretch-x, .98), var(--fa-float-stretch-y, 1.03));
    animation-timing-function: cubic-bezier(.5, 0, .5, 0)
  }

  50% {
    transform: translateY(calc(-.92*var(--fa-float-height, 6px)))translateX(calc(-.5*var(--fa-float-drift, 1px)))rotate(calc(-.5*var(--fa-float-tilt, 1deg)))scale(.995, 1.01);
    animation-timing-function: cubic-bezier(.33, 0, .66, .33)
  }

  70% {
    transform: translateY(calc(-.3*var(--fa-float-height, 6px)))translateX(calc(-1*var(--fa-float-drift, 1px)))rotate(calc(-1*var(--fa-float-tilt, 1deg)))scale(1, 1);
    animation-timing-function: cubic-bezier(.33, .66, .66, 1)
  }

  90% {
    transform: translateY(calc(.05*var(--fa-float-height, 6px)))translateX(0)rotate(0deg)scale(var(--fa-float-squash-x, 1.02), var(--fa-float-squash-y, .98));
    animation-timing-function: cubic-bezier(.33, 0, .66, 1)
  }

  to {
    transform: translateY(0)translateX(0)rotate(0deg)scale(var(--fa-float-squash-x, 1.02), var(--fa-float-squash-y, .98))
  }
}

@keyframes fa-swing {
  0% {
    transform: rotate(0);
    animation-timing-function: cubic-bezier(.2, 0, .8, 1)
  }

  8% {
    transform: rotate(var(--fa-swing-angle, 22deg));
    animation-timing-function: cubic-bezier(.3, 0, .7, 1)
  }

  18% {
    transform: rotate(calc(-1*var(--fa-swing-angle, 22deg)*.85));
    animation-timing-function: cubic-bezier(.3, 0, .7, 1)
  }

  28% {
    transform: rotate(calc(var(--fa-swing-angle, 22deg)*.65));
    animation-timing-function: cubic-bezier(.35, 0, .65, 1)
  }

  38% {
    transform: rotate(calc(-1*var(--fa-swing-angle, 22deg)*.45));
    animation-timing-function: cubic-bezier(.4, 0, .6, 1)
  }

  48% {
    transform: rotate(calc(var(--fa-swing-angle, 22deg)*.25));
    animation-timing-function: cubic-bezier(.4, 0, .6, 1)
  }

  56% {
    transform: rotate(calc(-1*var(--fa-swing-angle, 22deg)*.1));
    animation-timing-function: cubic-bezier(.4, 0, .6, 1)
  }

  64% {
    transform: rotate(0)
  }

  to {
    transform: rotate(0)
  }
}

@keyframes fa-jello {
  0% {
    transform: scale(1);
    animation-timing-function: cubic-bezier(.2, 0, .8, 1)
  }

  12% {
    transform: scale(var(--fa-jello-scale-x, 1.15), calc(2 - var(--fa-jello-scale-x, 1.15)));
    animation-timing-function: cubic-bezier(.3, 0, .7, 1)
  }

  24% {
    transform: scale(calc(2 - var(--fa-jello-scale-y, 1.12)), var(--fa-jello-scale-y, 1.12));
    animation-timing-function: cubic-bezier(.3, 0, .7, 1)
  }

  36% {
    transform: scale(calc(1 + (var(--fa-jello-scale-x, 1.15) - 1)*.5), calc(2 - (1 + (var(--fa-jello-scale-x, 1.15) - 1)*.5)));
    animation-timing-function: cubic-bezier(.4, 0, .6, 1)
  }

  48% {
    transform: scale(calc(2 - (1 + (var(--fa-jello-scale-y, 1.12) - 1)*.3)), calc(1 + (var(--fa-jello-scale-y, 1.12) - 1)*.3));
    animation-timing-function: cubic-bezier(.4, 0, .6, 1)
  }

  58% {
    transform: scale(1.02, .98);
    animation-timing-function: cubic-bezier(.4, 0, .2, 1)
  }

  68% {
    transform: scale(1)
  }

  to {
    transform: scale(1)
  }
}

.fa-rotate-90 {
  transform: rotate(90deg)
}

.fa-rotate-180 {
  transform: rotate(180deg)
}

.fa-rotate-270 {
  transform: rotate(270deg)
}

.fa-flip-horizontal {
  transform: scaleX(-1)
}

.fa-flip-vertical {
  transform: scaleY(-1)
}

.fa-flip-both,
.fa-flip-horizontal.fa-flip-vertical {
  transform: scale(-1)
}

.fa-rotate-by {
  transform: rotate(var(--fa-rotate-angle, 0))
}

.fa-stack {
  display: inline-block;
  height: 2em;
  line-height: 2em;
  position: relative;
  vertical-align: middle;
  width: 2.5em
}

.fa-stack-1x,
.fa-stack-2x {
  --fa-width: 100%;
  inset: 0;
  position: absolute;
  text-align: center;
  width: var(--fa-width);
  z-index: var(--fa-stack-z-index, auto)
}

.fa-stack-1x {
  line-height: inherit
}

.fa-stack-2x {
  font-size: 2em
}

.fa-inverse {
  color: var(--fa-inverse, #fff)
}

.fa-ad {
  --fa: ""
}

.fa-add {
  --fa: "+"
}

.fa-angle-double-left {
  --fa: ""
}

.fa-angle-double-right {
  --fa: ""
}

.fa-angles-left {
  --fa: ""
}

.fa-angles-right {
  --fa: ""
}

.fa-archive {
  --fa: ""
}

.fa-arrow-left-rotate {
  --fa: ""
}

.fa-arrow-right {
  --fa: ""
}

.fa-arrow-right-from-bracket {
  --fa: ""
}

.fa-arrow-rotate-back {
  --fa: ""
}

.fa-arrow-rotate-backward {
  --fa: ""
}

.fa-arrow-rotate-left {
  --fa: ""
}

.fa-arrows-alt {
  --fa: ""
}

.fa-arrows-rotate {
  --fa: ""
}

.fa-ballot {
  --fa: ""
}

.fa-bell-on {
  --fa: ""
}

.fa-bookmark {
  --fa: ""
}

.fa-box-archive {
  --fa: ""
}

.fa-bullseye-pointer {
  --fa: ""
}

.fa-calendar-alt {
  --fa: ""
}

.fa-calendar-days {
  --fa: ""
}

.fa-caret-left {
  --fa: ""
}

.fa-caret-right {
  --fa: ""
}

.fa-chain {
  --fa: ""
}

.fa-chain-broken {
  --fa: ""
}

.fa-chain-slash {
  --fa: ""
}

.fa-check {
  --fa: ""
}

.fa-check-square {
  --fa: ""
}

.fa-circle-question {
  --fa: ""
}

.fa-close {
  --fa: ""
}

.fa-cog {
  --fa: ""
}

.fa-face-frown {
  --fa: ""
}

.fa-face-smile {
  --fa: ""
}

.fa-file {
  --fa: ""
}

.fa-file-chart-column {
  --fa: ""
}

.fa-file-chart-line {
  --fa: ""
}

.fa-file-csv {
  --fa: ""
}

.fa-file-excel {
  --fa: ""
}

.fa-file-image {
  --fa: ""
}

.fa-file-pdf {
  --fa: ""
}

.fa-file-powerpoint {
  --fa: ""
}

.fa-file-spreadsheet {
  --fa: ""
}

.fa-file-word {
  --fa: ""
}

.fa-flag-pennant {
  --fa: ""
}

.fa-frown {
  --fa: ""
}

.fa-gear {
  --fa: ""
}

.fa-graduation-cap {
  --fa: ""
}

.fa-home {
  --fa: ""
}

.fa-home-alt {
  --fa: ""
}

.fa-home-lg-alt {
  --fa: ""
}

.fa-house {
  --fa: ""
}

.fa-link {
  --fa: ""
}

.fa-link-slash {
  --fa: ""
}

.fa-list-check {
  --fa: ""
}

.fa-map-signs {
  --fa: ""
}

.fa-mortar-board {
  --fa: ""
}

.fa-multiply {
  --fa: ""
}

.fa-pencil {
  --fa: ""
}

.fa-pencil-alt {
  --fa: ""
}

.fa-pennant {
  --fa: ""
}

.fa-plus {
  --fa: "+"
}

.fa-print {
  --fa: ""
}

.fa-puzzle-piece {
  --fa: ""
}

.fa-question {
  --fa: "?"
}

.fa-question-circle {
  --fa: ""
}

.fa-rectangle-ad {
  --fa: ""
}

.fa-refresh {
  --fa: ""
}

.fa-remove {
  --fa: ""
}

.fa-screen-users {
  --fa: ""
}

.fa-sign-out {
  --fa: ""
}

.fa-signs-post {
  --fa: ""
}

.fa-smile {
  --fa: ""
}

.fa-spinner {
  --fa: ""
}

.fa-square {
  --fa: ""
}

.fa-square-check {
  --fa: ""
}

.fa-star {
  --fa: ""
}

.fa-star-half-alt {
  --fa: ""
}

.fa-star-half-stroke {
  --fa: ""
}

.fa-stopwatch {
  --fa: ""
}

.fa-swords {
  --fa: ""
}

.fa-sync {
  --fa: ""
}

.fa-tasks {
  --fa: ""
}

.fa-times {
  --fa: ""
}

.fa-undo {
  --fa: ""
}

.fa-unlink {
  --fa: ""
}

.fa-up-down-left-right {
  --fa: ""
}

.fa-user {
  --fa: ""
}

.fa-user-alt {
  --fa: ""
}

.fa-user-alt-slash {
  --fa: ""
}

.fa-user-group-crown {
  --fa: ""
}

.fa-user-large {
  --fa: ""
}

.fa-user-large-slash {
  --fa: ""
}

.fa-user-slash {
  --fa: ""
}

.fa-users-class {
  --fa: ""
}

.fa-users-crown {
  --fa: ""
}

.fa-xmark {
  --fa: ""
}

:root,
:host {
  --fa-family-classic: "Font Awesome 7 Pro";
  --fa-font-regular: normal 400 1em/1 var(--fa-family-classic);
  --fa-style-family-classic: var(--fa-family-classic)
}

@font-face {
  font-family: "Font Awesome 7 Pro";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url(/assets/fa-regular-400-80849738054399817ce75afd7d93aa3c6c4323449dcc647bdc3700ebc1aa9084.woff2)
}

.far {
  --fa-family: var(--fa-family-classic);
  --fa-style: 400
}

.fa-classic {
  --fa-family: var(--fa-family-classic)
}

.fa-regular {
  --fa-style: 400
}

:root,
:host {
  --fa-family-classic: "Font Awesome 7 Pro";
  --fa-font-solid: normal 900 1em/1 var(--fa-family-classic);
  --fa-style-family-classic: var(--fa-family-classic)
}

@font-face {
  font-family: "Font Awesome 7 Pro";
  font-style: normal;
  font-weight: 900;
  font-display: block;
  src: url(/assets/fa-solid-900-61e2b2cce311f3c83307bd7ca6c02ab25a2c978a8dcd7fe85dc96d6393f93310.woff2)
}

.fas {
  --fa-family: var(--fa-family-classic);
  --fa-style: 900
}

.fa-classic {
  --fa-family: var(--fa-family-classic)
}

.fa-solid {
  --fa-style: 900
}

:root,
:host {
  --fa-family-duotone: "Font Awesome 7 Duotone";
  --fa-font-duotone-regular: normal 400 1em/1 var(--fa-family-duotone);
  --fa-style-family-duotone: var(--fa-family-duotone)
}

@font-face {
  font-family: "Font Awesome 7 Duotone";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url(/assets/fa-duotone-regular-400-b67a727670891cfc2e2037e317c581b1b8790df2196f4049691da2bb6e9073be.woff2)
}

.fadr {
  --fa-family: var(--fa-family-duotone);
  --fa-style: 400;
  position: relative;
  letter-spacing: normal
}

.fa-duotone {
  --fa-family: var(--fa-family-duotone);
  position: relative;
  letter-spacing: normal
}

.fa-regular {
  --fa-style: 400
}

.fadr:before,
.fa-duotone:before {
  position: absolute;
  color: var(--fa-primary-color, currentColor);
  opacity: var(--fa-primary-opacity, 1)
}

.fadr:after,
.fa-duotone:after {
  color: var(--fa-secondary-color, currentColor);
  opacity: var(--fa-secondary-opacity, .4)
}

.fa-swap-opacity .fadr:before,
.fa-swap-opacity .fa-duotone:before,
.fa-swap-opacity.fadr:before,
.fa-swap-opacity.fa-duotone:before {
  opacity: var(--fa-secondary-opacity, .4)
}

.fa-swap-opacity .fadr:after,
.fa-swap-opacity .fa-duotone:after,
.fa-swap-opacity.fadr:after,
.fa-swap-opacity.fa-duotone:after {
  opacity: var(--fa-primary-opacity, 1)
}

.fa-li.fadr,
.fa-li.fa-duotone,
.fa-stack-1x.fadr,
.fa-stack-1x.fa-duotone,
.fa-stack-2x.fadr,
.fa-stack-2x.fa-duotone {
  position: absolute
}

trix-editor {
  border: 1px solid #bbb;
  border-radius: 3px;
  margin: 0;
  padding: 0.4em 0.6em;
  min-height: 5em;
  outline: none;
}

trix-toolbar * {
  box-sizing: border-box;
}
trix-toolbar .trix-button-row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  overflow-x: auto;
}
trix-toolbar .trix-button-group {
  display: flex;
  margin-bottom: 10px;
  border: 1px solid #bbb;
  border-top-color: #ccc;
  border-bottom-color: #888;
  border-radius: 3px;
}
trix-toolbar .trix-button-group:not(:first-child) {
  margin-left: 1.5vw;
}
@media (max-width: 768px) {
  trix-toolbar .trix-button-group:not(:first-child) {
    margin-left: 0;
  }
}
trix-toolbar .trix-button-group-spacer {
  flex-grow: 1;
}
@media (max-width: 768px) {
  trix-toolbar .trix-button-group-spacer {
    display: none;
  }
}
trix-toolbar .trix-button {
  position: relative;
  float: left;
  color: rgba(0, 0, 0, 0.6);
  font-size: 0.75em;
  font-weight: 600;
  white-space: nowrap;
  padding: 0 0.5em;
  margin: 0;
  outline: none;
  border: none;
  border-bottom: 1px solid #ddd;
  border-radius: 0;
  background: transparent;
}
trix-toolbar .trix-button:not(:first-child) {
  border-left: 1px solid #ccc;
}
trix-toolbar .trix-button.trix-active {
  background: #cbeefa;
  color: rgb(0, 0, 0);
}
trix-toolbar .trix-button:not(:disabled) {
  cursor: pointer;
}
trix-toolbar .trix-button:disabled {
  color: rgba(0, 0, 0, 0.125);
}
@media (max-width: 768px) {
  trix-toolbar .trix-button {
    letter-spacing: -0.01em;
    padding: 0 0.3em;
  }
}
trix-toolbar .trix-button--icon {
  font-size: inherit;
  width: 2.6em;
  height: 1.6em;
  max-width: calc(0.8em + 4vw);
  text-indent: -9999px;
}
@media (max-width: 768px) {
  trix-toolbar .trix-button--icon {
    height: 2em;
    max-width: calc(0.8em + 3.5vw);
  }
}
trix-toolbar .trix-button--icon::before {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.6;
  content: "";
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
@media (max-width: 768px) {
  trix-toolbar .trix-button--icon::before {
    right: 6%;
    left: 6%;
  }
}
trix-toolbar .trix-button--icon.trix-active::before {
  opacity: 1;
}
trix-toolbar .trix-button--icon:disabled::before {
  opacity: 0.125;
}
trix-toolbar .trix-button--icon-attach::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M10.5%2018V7.5c0-2.25%203-2.25%203%200V18c0%204.125-6%204.125-6%200V7.5c0-6.375%209-6.375%209%200V18%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-miterlimit%3D%2210%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
  top: 8%;
  bottom: 4%;
}
trix-toolbar .trix-button--icon-bold::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M6.522%2019.242a.5.5%200%200%201-.5-.5V5.35a.5.5%200%200%201%20.5-.5h5.783c1.347%200%202.46.345%203.24.982.783.64%201.216%201.562%201.216%202.683%200%201.13-.587%202.129-1.476%202.71a.35.35%200%200%200%20.049.613c1.259.56%202.101%201.742%202.101%203.22%200%201.282-.483%202.334-1.363%203.063-.876.726-2.132%201.12-3.66%201.12h-5.89ZM9.27%207.347v3.362h1.97c.766%200%201.347-.17%201.733-.464.38-.291.587-.716.587-1.27%200-.53-.183-.928-.513-1.198-.334-.273-.838-.43-1.505-.43H9.27Zm0%205.606v3.791h2.389c.832%200%201.448-.177%201.853-.497.399-.315.614-.786.614-1.423%200-.62-.22-1.077-.63-1.385-.418-.313-1.053-.486-1.905-.486H9.27Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-italic::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M9%205h6.5v2h-2.23l-2.31%2010H13v2H6v-2h2.461l2.306-10H9V5Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-link::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M18.948%205.258a4.337%204.337%200%200%200-6.108%200L11.217%206.87a.993.993%200%200%200%200%201.41c.392.39%201.027.39%201.418%200l1.623-1.613a2.323%202.323%200%200%201%203.271%200%202.29%202.29%200%200%201%200%203.251l-2.393%202.38a3.021%203.021%200%200%201-4.255%200l-.05-.049a1.007%201.007%200%200%200-1.418%200%20.993.993%200%200%200%200%201.41l.05.049a5.036%205.036%200%200%200%207.091%200l2.394-2.38a4.275%204.275%200%200%200%200-6.072Zm-13.683%2013.6a4.337%204.337%200%200%200%206.108%200l1.262-1.255a.993.993%200%200%200%200-1.41%201.007%201.007%200%200%200-1.418%200L9.954%2017.45a2.323%202.323%200%200%201-3.27%200%202.29%202.29%200%200%201%200-3.251l2.344-2.331a2.579%202.579%200%200%201%203.631%200c.392.39%201.027.39%201.419%200a.993.993%200%200%200%200-1.41%204.593%204.593%200%200%200-6.468%200l-2.345%202.33a4.275%204.275%200%200%200%200%206.072Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-strike::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M6%2014.986c.088%202.647%202.246%204.258%205.635%204.258%203.496%200%205.713-1.728%205.713-4.463%200-.275-.02-.536-.062-.781h-3.461c.398.293.573.654.573%201.123%200%201.035-1.074%201.787-2.646%201.787-1.563%200-2.773-.762-2.91-1.924H6ZM6.432%2010h3.763c-.632-.314-.914-.715-.914-1.273%200-1.045.977-1.739%202.432-1.739%201.475%200%202.52.723%202.617%201.914h2.764c-.05-2.548-2.11-4.238-5.39-4.238-3.145%200-5.392%201.719-5.392%204.316%200%20.363.04.703.12%201.02ZM4%2011a1%201%200%201%200%200%202h15a1%201%200%201%200%200-2H4Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-quote::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M4.581%208.471c.44-.5%201.056-.834%201.758-.995C8.074%207.17%209.201%207.822%2010%208.752c1.354%201.578%201.33%203.555.394%205.277-.941%201.731-2.788%203.163-4.988%203.56a.622.622%200%200%201-.653-.317c-.113-.205-.121-.49.16-.764.294-.286.567-.566.791-.835.222-.266.413-.54.524-.815.113-.28.156-.597.026-.908-.128-.303-.39-.524-.72-.69a3.02%203.02%200%200%201-1.674-2.7c0-.905.283-1.59.72-2.088Zm9.419%200c.44-.5%201.055-.834%201.758-.995%201.734-.306%202.862.346%203.66%201.276%201.355%201.578%201.33%203.555.395%205.277-.941%201.731-2.789%203.163-4.988%203.56a.622.622%200%200%201-.653-.317c-.113-.205-.122-.49.16-.764.294-.286.567-.566.791-.835.222-.266.412-.54.523-.815.114-.28.157-.597.026-.908-.127-.303-.39-.524-.72-.69a3.02%203.02%200%200%201-1.672-2.701c0-.905.283-1.59.72-2.088Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-heading-1::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21.5%207.5v-3h-12v3H14v13h3v-13h4.5ZM9%2013.5h3.5v-3h-10v3H6v7h3v-7Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-code::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3.293%2011.293a1%201%200%200%200%200%201.414l4%204a1%201%200%201%200%201.414-1.414L5.414%2012l3.293-3.293a1%201%200%200%200-1.414-1.414l-4%204Zm13.414%205.414%204-4a1%201%200%200%200%200-1.414l-4-4a1%201%200%201%200-1.414%201.414L18.586%2012l-3.293%203.293a1%201%200%200%200%201.414%201.414Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-bullet-list::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%207.5a1.5%201.5%200%201%200%200-3%201.5%201.5%200%200%200%200%203ZM8%206a1%201%200%200%201%201-1h11a1%201%200%201%201%200%202H9a1%201%200%200%201-1-1Zm1%205a1%201%200%201%200%200%202h11a1%201%200%201%200%200-2H9Zm0%206a1%201%200%201%200%200%202h11a1%201%200%201%200%200-2H9Zm-2.5-5a1.5%201.5%200%201%201-3%200%201.5%201.5%200%200%201%203%200ZM5%2019.5a1.5%201.5%200%201%200%200-3%201.5%201.5%200%200%200%200%203Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-number-list::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3%204h2v4H4V5H3V4Zm5%202a1%201%200%200%201%201-1h11a1%201%200%201%201%200%202H9a1%201%200%200%201-1-1Zm1%205a1%201%200%201%200%200%202h11a1%201%200%201%200%200-2H9Zm0%206a1%201%200%201%200%200%202h11a1%201%200%201%200%200-2H9Zm-3.5-7H6v1l-1.5%202H6v1H3v-1l1.667-2H3v-1h2.5ZM3%2017v-1h3v4H3v-1h2v-.5H4v-1h1V17H3Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-undo::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3%2014a1%201%200%200%200%201%201h6a1%201%200%201%200%200-2H6.257c2.247-2.764%205.151-3.668%207.579-3.264%202.589.432%204.739%202.356%205.174%205.405a1%201%200%200%200%201.98-.283c-.564-3.95-3.415-6.526-6.825-7.095C11.084%207.25%207.63%208.377%205%2011.39V8a1%201%200%200%200-2%200v6Zm2-1Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-redo::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2014a1%201%200%200%201-1%201h-6a1%201%200%201%201%200-2h3.743c-2.247-2.764-5.151-3.668-7.579-3.264-2.589.432-4.739%202.356-5.174%205.405a1%201%200%200%201-1.98-.283c.564-3.95%203.415-6.526%206.826-7.095%203.08-.513%206.534.614%209.164%203.626V8a1%201%200%201%201%202%200v6Zm-2-1Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-decrease-nesting-level::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%206a1%201%200%200%201%201-1h12a1%201%200%201%201%200%202H6a1%201%200%200%201-1-1Zm4%205a1%201%200%201%200%200%202h9a1%201%200%201%200%200-2H9Zm-3%206a1%201%200%201%200%200%202h12a1%201%200%201%200%200-2H6Zm-3.707-5.707a1%201%200%200%200%200%201.414l2%202a1%201%200%201%200%201.414-1.414L4.414%2012l1.293-1.293a1%201%200%200%200-1.414-1.414l-2%202Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-increase-nesting-level::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%206a1%201%200%200%201%201-1h12a1%201%200%201%201%200%202H6a1%201%200%200%201-1-1Zm4%205a1%201%200%201%200%200%202h9a1%201%200%201%200%200-2H9Zm-3%206a1%201%200%201%200%200%202h12a1%201%200%201%200%200-2H6Zm-2.293-2.293%202-2a1%201%200%200%200%200-1.414l-2-2a1%201%200%201%200-1.414%201.414L3.586%2012l-1.293%201.293a1%201%200%201%200%201.414%201.414Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-dialogs {
  position: relative;
}
trix-toolbar .trix-dialog {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  font-size: 0.75em;
  padding: 15px 10px;
  background: #fff;
  box-shadow: 0 0.3em 1em #ccc;
  border-top: 2px solid #888;
  border-radius: 5px;
  z-index: 5;
}
trix-toolbar .trix-input--dialog {
  font-size: inherit;
  font-weight: normal;
  padding: 0.5em 0.8em;
  margin: 0 10px 0 0;
  border-radius: 3px;
  border: 1px solid #bbb;
  background-color: #fff;
  box-shadow: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}
trix-toolbar .trix-input--dialog.validate:invalid {
  box-shadow: #F00 0px 0px 1.5px 1px;
}
trix-toolbar .trix-button--dialog {
  font-size: inherit;
  padding: 0.5em;
  border-bottom: none;
}
trix-toolbar .trix-dialog--link {
  max-width: 600px;
}
trix-toolbar .trix-dialog__link-fields {
  display: flex;
  align-items: baseline;
}
trix-toolbar .trix-dialog__link-fields .trix-input {
  flex: 1;
}
trix-toolbar .trix-dialog__link-fields .trix-button-group {
  flex: 0 0 content;
  margin: 0;
}

trix-editor [data-trix-mutable]:not(.attachment__caption-editor) {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

trix-editor [data-trix-mutable] ::-moz-selection, trix-editor [data-trix-mutable]::-moz-selection,
trix-editor [data-trix-cursor-target]::-moz-selection {
  background: none;
}
trix-editor [data-trix-mutable] ::selection, trix-editor [data-trix-mutable]::selection,
trix-editor [data-trix-cursor-target]::selection {
  background: none;
}

trix-editor [data-trix-mutable].attachment__caption-editor:focus::-moz-selection {
  background: highlight;
}
trix-editor [data-trix-mutable].attachment__caption-editor:focus::selection {
  background: highlight;
}

trix-editor [data-trix-mutable].attachment.attachment--file {
  box-shadow: 0 0 0 2px highlight;
  border-color: transparent;
}
trix-editor [data-trix-mutable].attachment img {
  box-shadow: 0 0 0 2px highlight;
}
trix-editor .attachment {
  position: relative;
}
trix-editor .attachment:hover {
  cursor: default;
}
trix-editor .attachment--preview .attachment__caption:hover {
  cursor: text;
}
trix-editor .attachment__progress {
  position: absolute;
  z-index: 1;
  height: 20px;
  top: calc(50% - 10px);
  left: 5%;
  width: 90%;
  opacity: 0.9;
  transition: opacity 200ms ease-in;
}
trix-editor .attachment__progress[value="100"] {
  opacity: 0;
}
trix-editor .attachment__caption-editor {
  display: inline-block;
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-family: inherit;
  line-height: inherit;
  color: inherit;
  text-align: center;
  vertical-align: top;
  border: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}
trix-editor .attachment__toolbar {
  position: absolute;
  z-index: 1;
  top: -0.9em;
  left: 0;
  width: 100%;
  text-align: center;
}
trix-editor .trix-button-group {
  display: inline-flex;
}
trix-editor .trix-button {
  position: relative;
  float: left;
  color: #666;
  white-space: nowrap;
  font-size: 80%;
  padding: 0 0.8em;
  margin: 0;
  outline: none;
  border: none;
  border-radius: 0;
  background: transparent;
}
trix-editor .trix-button:not(:first-child) {
  border-left: 1px solid #ccc;
}
trix-editor .trix-button.trix-active {
  background: #cbeefa;
}
trix-editor .trix-button:not(:disabled) {
  cursor: pointer;
}
trix-editor .trix-button--remove {
  text-indent: -9999px;
  display: inline-block;
  padding: 0;
  outline: none;
  width: 1.8em;
  height: 1.8em;
  line-height: 1.8em;
  border-radius: 50%;
  background-color: #fff;
  border: 2px solid highlight;
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.25);
}
trix-editor .trix-button--remove::before {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.7;
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg%20height%3D%2224%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M19%206.41%2017.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 90%;
}
trix-editor .trix-button--remove:hover {
  border-color: #333;
}
trix-editor .trix-button--remove:hover::before {
  opacity: 1;
}
trix-editor .attachment__metadata-container {
  position: relative;
}
trix-editor .attachment__metadata {
  position: absolute;
  left: 50%;
  top: 2em;
  transform: translate(-50%, 0);
  max-width: 90%;
  padding: 0.1em 0.6em;
  font-size: 0.8em;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: 3px;
}
trix-editor .attachment__metadata .attachment__name {
  display: inline-block;
  max-width: 100%;
  vertical-align: bottom;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
trix-editor .attachment__metadata .attachment__size {
  margin-left: 0.2em;
  white-space: nowrap;
}

.trix-content {
  line-height: 1.5;
  overflow-wrap: break-word;
  word-break: break-word;
}
.trix-content * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
.trix-content h1 {
  font-size: 1.2em;
  line-height: 1.2;
}
.trix-content blockquote {
  border: 0 solid #ccc;
  border-left-width: 0.3em;
  margin-left: 0.3em;
  padding-left: 0.6em;
}
.trix-content [dir=rtl] blockquote,
.trix-content blockquote[dir=rtl] {
  border-width: 0;
  border-right-width: 0.3em;
  margin-right: 0.3em;
  padding-right: 0.6em;
}
.trix-content li {
  margin-left: 1em;
}
.trix-content [dir=rtl] li {
  margin-right: 1em;
}
.trix-content pre {
  display: inline-block;
  width: 100%;
  vertical-align: top;
  font-family: monospace;
  font-size: 0.9em;
  padding: 0.5em;
  white-space: pre;
  background-color: #eee;
  overflow-x: auto;
}
.trix-content img {
  max-width: 100%;
  height: auto;
}
.trix-content .attachment {
  display: inline-block;
  position: relative;
  max-width: 100%;
}
.trix-content .attachment a {
  color: inherit;
  text-decoration: none;
}
.trix-content .attachment a:hover, .trix-content .attachment a:visited:hover {
  color: inherit;
}
.trix-content .attachment__caption {
  text-align: center;
}
.trix-content .attachment__caption .attachment__name + .attachment__size::before {
  content: " •";
}
.trix-content .attachment--preview {
  width: 100%;
  text-align: center;
}
.trix-content .attachment--preview .attachment__caption {
  color: #666;
  font-size: 0.9em;
  line-height: 1.2;
}
.trix-content .attachment--file {
  color: #333;
  line-height: 1;
  margin: 0 2px 2px 2px;
  padding: 0.4em 1em;
  border: 1px solid #bbb;
  border-radius: 5px;
}
.trix-content .attachment-gallery {
  display: flex;
  flex-wrap: wrap;
  position: relative;
}
.trix-content .attachment-gallery .attachment {
  flex: 1 0 33%;
  padding: 0 0.5em;
  max-width: 33%;
}
.trix-content .attachment-gallery.attachment-gallery--2 .attachment, .trix-content .attachment-gallery.attachment-gallery--4 .attachment {
  flex-basis: 50%;
  max-width: 50%;
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *




 */

/* ===== variables ===== */
:root {
  --bodytext: #151515;
  --grey: gainsboro;
  --shelf: #3f3f3f;
  --brand: #0090cb;
  --error: red;
  --green: green;
  --shaded: #f5f5f5;
  --selected: #d6f9ff;
}

/* ===== reset ===== */
/*! modern-normalize v0.6.0 | MIT License | https://github.com/sindresorhus/modern-normalize */

/*
Document
========
*/

/**
Use a better box model (opinionated).
*/

*,
*::before,
*::after {
  box-sizing: border-box;
}

/**
Use a more readable tab size (opinionated).
*/

:root {
  -moz-tab-size: 4;
  tab-size: 4;
}

/**
1. Correct the line height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
*/

html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/*
Sections
========
*/

/**
Remove the margin in all browsers.
*/

body {
  margin: 0;
}

/**
Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
*/

body {
  font-family: system-ui, -apple-system,
    /* Firefox supports this but not yet `system-ui` */
    "Segoe UI", Roboto,
    Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
}

/*
Grouping content
================
*/

/**
Add the correct height in Firefox.
*/

hr {
  height: 0;
}

/*
Text-level semantics
====================
*/

/**
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr[title] {
  text-decoration: underline dotted;
}

/**
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/**
1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
2. Correct the odd 'em' font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/**
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/**
Prevent 'sub' and 'sup' elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
Forms
=====
*/

/**
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */
}

/**
Remove the inheritance of text transform in Edge and Firefox.
1. Remove the inheritance of text transform in Firefox.
*/

button,
select {
  /* 1 */
  text-transform: none;
}

/**
Correct the inability to style clickable types in iOS and Safari.
*/

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
Remove the inner border and padding in Firefox.
*/

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
Restore the focus styles unset by the previous rule.
*/

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
Correct the padding in Firefox.
*/

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
Remove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.
*/

legend {
  padding: 0;
}

/**
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/**
Correct the cursor style of increment and decrement buttons in Safari.
*/

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/**
Remove the inner padding in Chrome and Safari on macOS.
*/

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to 'inherit' in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/*
Interactive
===========
*/

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/* Animations */

.animation-preload * {
  transition: none !important;
}

/* ===== actiontext (Trix, vendored from node_modules/trix/dist/trix.css) ===== */
/*
Trix 1.3.1
Copyright © 2020 Basecamp, LLC
http://trix-editor.org/*/
trix-editor {
  border: 1px solid #bbb;
  border-radius: 3px;
  margin: 0;
  padding: 0.4em 0.6em;
  min-height: 5em;
  outline: none;
}

trix-toolbar * {
  box-sizing: border-box;
}

trix-toolbar .trix-button-row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  overflow-x: auto;
}

trix-toolbar .trix-button-group {
  display: flex;
  margin-bottom: 10px;
  border: 1px solid #bbb;
  border-top-color: #ccc;
  border-bottom-color: #888;
  border-radius: 3px;
}

trix-toolbar .trix-button-group:not(:first-child) {
  margin-left: 1.5vw;
}

@media (max-device-width: 768px) {
  trix-toolbar .trix-button-group:not(:first-child) {
    margin-left: 0;
  }
}

trix-toolbar .trix-button-group-spacer {
  flex-grow: 1;
}

@media (max-device-width: 768px) {
  trix-toolbar .trix-button-group-spacer {
    display: none;
  }
}

trix-toolbar .trix-button {
  position: relative;
  float: left;
  color: rgba(0, 0, 0, 0.6);
  font-size: 0.75em;
  font-weight: 600;
  white-space: nowrap;
  padding: 0 0.5em;
  margin: 0;
  outline: none;
  border: none;
  border-bottom: 1px solid #ddd;
  border-radius: 0;
  background: transparent;
}

trix-toolbar .trix-button:not(:first-child) {
  border-left: 1px solid #ccc;
}

trix-toolbar .trix-button.trix-active {
  background: #cbeefa;
  color: black;
}

trix-toolbar .trix-button:not(:disabled) {
  cursor: pointer;
}

trix-toolbar .trix-button:disabled {
  color: rgba(0, 0, 0, 0.125);
}

@media (max-device-width: 768px) {
  trix-toolbar .trix-button {
    letter-spacing: -0.01em;
    padding: 0 0.3em;
  }
}

trix-toolbar .trix-button--icon {
  font-size: inherit;
  width: 2.6em;
  height: 1.6em;
  max-width: calc(0.8em + 4vw);
  text-indent: -9999px;
}

@media (max-device-width: 768px) {
  trix-toolbar .trix-button--icon {
    height: 2em;
    max-width: calc(0.8em + 3.5vw);
  }
}

trix-toolbar .trix-button--icon::before {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.6;
  content: "";
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

@media (max-device-width: 768px) {
  trix-toolbar .trix-button--icon::before {
    right: 6%;
    left: 6%;
  }
}

trix-toolbar .trix-button--icon.trix-active::before {
  opacity: 1;
}

trix-toolbar .trix-button--icon:disabled::before {
  opacity: 0.125;
}

trix-toolbar .trix-button--icon-attach::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M16.5%206v11.5a4%204%200%201%201-8%200V5a2.5%202.5%200%200%201%205%200v10.5a1%201%200%201%201-2%200V6H10v9.5a2.5%202.5%200%200%200%205%200V5a4%204%200%201%200-8%200v12.5a5.5%205.5%200%200%200%2011%200V6h-1.5z%22%2F%3E%3C%2Fsvg%3E);
  top: 8%;
  bottom: 4%;
}

trix-toolbar .trix-button--icon-bold::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M15.6%2011.8c1-.7%201.6-1.8%201.6-2.8a4%204%200%200%200-4-4H7v14h7c2.1%200%203.7-1.7%203.7-3.8%200-1.5-.8-2.8-2.1-3.4zM10%207.5h3a1.5%201.5%200%201%201%200%203h-3v-3zm3.5%209H10v-3h3.5a1.5%201.5%200%201%201%200%203z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-button--icon-italic::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M10%205v3h2.2l-3.4%208H6v3h8v-3h-2.2l3.4-8H18V5h-8z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-button--icon-link::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M9.88%2013.7a4.3%204.3%200%200%201%200-6.07l3.37-3.37a4.26%204.26%200%200%201%206.07%200%204.3%204.3%200%200%201%200%206.06l-1.96%201.72a.91.91%200%201%201-1.3-1.3l1.97-1.71a2.46%202.46%200%200%200-3.48-3.48l-3.38%203.37a2.46%202.46%200%200%200%200%203.48.91.91%200%201%201-1.3%201.3z%22%2F%3E%3Cpath%20d%3D%22M4.25%2019.46a4.3%204.3%200%200%201%200-6.07l1.93-1.9a.91.91%200%201%201%201.3%201.3l-1.93%201.9a2.46%202.46%200%200%200%203.48%203.48l3.37-3.38c.96-.96.96-2.52%200-3.48a.91.91%200%201%201%201.3-1.3%204.3%204.3%200%200%201%200%206.07l-3.38%203.38a4.26%204.26%200%200%201-6.07%200z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-button--icon-strike::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M12.73%2014l.28.14c.26.15.45.3.57.44.12.14.18.3.18.5%200%20.3-.15.56-.44.75-.3.2-.76.3-1.39.3A13.52%2013.52%200%200%201%207%2014.95v3.37a10.64%2010.64%200%200%200%204.84.88c1.26%200%202.35-.19%203.28-.56.93-.37%201.64-.9%202.14-1.57s.74-1.45.74-2.32c0-.26-.02-.51-.06-.75h-5.21zm-5.5-4c-.08-.34-.12-.7-.12-1.1%200-1.29.52-2.3%201.58-3.02%201.05-.72%202.5-1.08%204.34-1.08%201.62%200%203.28.34%204.97%201l-1.3%202.93c-1.47-.6-2.73-.9-3.8-.9-.55%200-.96.08-1.2.26-.26.17-.38.38-.38.64%200%20.27.16.52.48.74.17.12.53.3%201.05.53H7.23zM3%2013h18v-2H3v2z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-button--icon-quote::before {
  background-image: url(data:image/svg+xml,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M6%2017h3l2-4V7H5v6h3zm8%200h3l2-4V7h-6v6h3z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-button--icon-heading-1::before {
  background-image: url(data:image/svg+xml,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M12%209v3H9v7H6v-7H3V9h9zM8%204h14v3h-6v12h-3V7H8V4z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-button--icon-code::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M18.2%2012L15%2015.2l1.4%201.4L21%2012l-4.6-4.6L15%208.8l3.2%203.2zM5.8%2012L9%208.8%207.6%207.4%203%2012l4.6%204.6L9%2015.2%205.8%2012z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-button--icon-bullet-list::before {
  background-image: url(data:image/svg+xml,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M4%204a2%202%200%201%200%200%204%202%202%200%200%200%200-4zm0%206a2%202%200%201%200%200%204%202%202%200%200%200%200-4zm0%206a2%202%200%201%200%200%204%202%202%200%200%200%200-4zm4%203h14v-2H8v2zm0-6h14v-2H8v2zm0-8v2h14V5H8z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-button--icon-number-list::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M2%2017h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1%203h1.8L2%2013.1v.9h3v-1H3.2L5%2010.9V10H2v1zm5-6v2h14V5H7zm0%2014h14v-2H7v2zm0-6h14v-2H7v2z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-button--icon-undo::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M12.5%208c-2.6%200-5%201-6.9%202.6L2%207v9h9l-3.6-3.6A8%208%200%200%201%2020%2016l2.4-.8a10.5%2010.5%200%200%200-10-7.2z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-button--icon-redo::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M18.4%2010.6a10.5%2010.5%200%200%200-16.9%204.6L4%2016a8%208%200%200%201%2012.7-3.6L13%2016h9V7l-3.6%203.6z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-button--icon-decrease-nesting-level::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M3%2019h19v-2H3v2zm7-6h12v-2H10v2zm-8.3-.3l2.8%202.9L6%2014.2%204%2012l2-2-1.4-1.5L1%2012l.7.7zM3%205v2h19V5H3z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-button--icon-increase-nesting-level::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M3%2019h19v-2H3v2zm7-6h12v-2H10v2zm-6.9-1L1%2014.2l1.4%201.4L6%2012l-.7-.7-2.8-2.8L1%209.9%203.1%2012zM3%205v2h19V5H3z%22%2F%3E%3C%2Fsvg%3E);
}

trix-toolbar .trix-dialogs {
  position: relative;
}

trix-toolbar .trix-dialog {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  font-size: 0.75em;
  padding: 15px 10px;
  background: #fff;
  box-shadow: 0 0.3em 1em #ccc;
  border-top: 2px solid #888;
  border-radius: 5px;
  z-index: 5;
}

trix-toolbar .trix-input--dialog {
  font-size: inherit;
  font-weight: normal;
  padding: 0.5em 0.8em;
  margin: 0 10px 0 0;
  border-radius: 3px;
  border: 1px solid #bbb;
  background-color: #fff;
  box-shadow: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

trix-toolbar .trix-input--dialog.validate:invalid {
  box-shadow: #F00 0px 0px 1.5px 1px;
}

trix-toolbar .trix-button--dialog {
  font-size: inherit;
  padding: 0.5em;
  border-bottom: none;
}

trix-toolbar .trix-dialog--link {
  max-width: 600px;
}

trix-toolbar .trix-dialog__link-fields {
  display: flex;
  align-items: baseline;
}

trix-toolbar .trix-dialog__link-fields .trix-input {
  flex: 1;
}

trix-toolbar .trix-dialog__link-fields .trix-button-group {
  flex: 0 0 content;
  margin: 0;
}

trix-editor [data-trix-mutable]:not(.attachment__caption-editor) {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

trix-editor [data-trix-mutable]::-moz-selection,
trix-editor [data-trix-cursor-target]::-moz-selection,
trix-editor [data-trix-mutable] ::-moz-selection {
  background: none;
}

trix-editor [data-trix-mutable]::selection,
trix-editor [data-trix-cursor-target]::selection,
trix-editor [data-trix-mutable] ::selection {
  background: none;
}

trix-editor [data-trix-mutable].attachment__caption-editor:focus::-moz-selection {
  background: highlight;
}

trix-editor [data-trix-mutable].attachment__caption-editor:focus::selection {
  background: highlight;
}

trix-editor [data-trix-mutable].attachment.attachment--file {
  box-shadow: 0 0 0 2px highlight;
  border-color: transparent;
}

trix-editor [data-trix-mutable].attachment img {
  box-shadow: 0 0 0 2px highlight;
}

trix-editor .attachment {
  position: relative;
}

trix-editor .attachment:hover {
  cursor: default;
}

trix-editor .attachment--preview .attachment__caption:hover {
  cursor: text;
}

trix-editor .attachment__progress {
  position: absolute;
  z-index: 1;
  height: 20px;
  top: calc(50% - 10px);
  left: 5%;
  width: 90%;
  opacity: 0.9;
  transition: opacity 200ms ease-in;
}

trix-editor .attachment__progress[value="100"] {
  opacity: 0;
}

trix-editor .attachment__caption-editor {
  display: inline-block;
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-family: inherit;
  line-height: inherit;
  color: inherit;
  text-align: center;
  vertical-align: top;
  border: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

trix-editor .attachment__toolbar {
  position: absolute;
  z-index: 1;
  top: -0.9em;
  left: 0;
  width: 100%;
  text-align: center;
}

trix-editor .trix-button-group {
  display: inline-flex;
}

trix-editor .trix-button {
  position: relative;
  float: left;
  color: #666;
  white-space: nowrap;
  font-size: 80%;
  padding: 0 0.8em;
  margin: 0;
  outline: none;
  border: none;
  border-radius: 0;
  background: transparent;
}

trix-editor .trix-button:not(:first-child) {
  border-left: 1px solid #ccc;
}

trix-editor .trix-button.trix-active {
  background: #cbeefa;
}

trix-editor .trix-button:not(:disabled) {
  cursor: pointer;
}

trix-editor .trix-button--remove {
  text-indent: -9999px;
  display: inline-block;
  padding: 0;
  outline: none;
  width: 1.8em;
  height: 1.8em;
  line-height: 1.8em;
  border-radius: 50%;
  background-color: #fff;
  border: 2px solid highlight;
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.25);
}

trix-editor .trix-button--remove::before {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.7;
  content: "";
  background-image: url(data:image/svg+xml,%3Csvg%20height%3D%2224%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M19%206.4L17.6%205%2012%2010.6%206.4%205%205%206.4l5.6%205.6L5%2017.6%206.4%2019l5.6-5.6%205.6%205.6%201.4-1.4-5.6-5.6z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 90%;
}

trix-editor .trix-button--remove:hover {
  border-color: #333;
}

trix-editor .trix-button--remove:hover::before {
  opacity: 1;
}

trix-editor .attachment__metadata-container {
  position: relative;
}

trix-editor .attachment__metadata {
  position: absolute;
  left: 50%;
  top: 2em;
  transform: translate(-50%, 0);
  max-width: 90%;
  padding: 0.1em 0.6em;
  font-size: 0.8em;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: 3px;
}

trix-editor .attachment__metadata .attachment__name {
  display: inline-block;
  max-width: 100%;
  vertical-align: bottom;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

trix-editor .attachment__metadata .attachment__size {
  margin-left: 0.2em;
  white-space: nowrap;
}

.trix-content {
  line-height: 1.5;
}

.trix-content * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.trix-content h1 {
  font-size: 1.2em;
  line-height: 1.2;
}

.trix-content blockquote {
  border: 0 solid #ccc;
  border-left-width: 0.3em;
  margin-left: 0.3em;
  padding-left: 0.6em;
}

.trix-content [dir=rtl] blockquote,
.trix-content blockquote[dir=rtl] {
  border-width: 0;
  border-right-width: 0.3em;
  margin-right: 0.3em;
  padding-right: 0.6em;
}

.trix-content li {
  margin-left: 1em;
}

.trix-content [dir=rtl] li {
  margin-right: 1em;
}

.trix-content pre {
  display: inline-block;
  width: 100%;
  vertical-align: top;
  font-family: monospace;
  font-size: 0.9em;
  padding: 0.5em;
  white-space: pre;
  background-color: #eee;
  overflow-x: auto;
}

.trix-content img {
  max-width: 100%;
  height: auto;
}

.trix-content .attachment {
  display: inline-block;
  position: relative;
  max-width: 100%;
}

.trix-content .attachment a {
  color: inherit;
  text-decoration: none;
}

.trix-content .attachment a:hover,
.trix-content .attachment a:visited:hover {
  color: inherit;
}

.trix-content .attachment__caption {
  text-align: center;
}

.trix-content .attachment__caption .attachment__name+.attachment__size::before {
  content: ' · ';
}

.trix-content .attachment--preview {
  width: 100%;
  text-align: center;
}

.trix-content .attachment--preview .attachment__caption {
  color: #666;
  font-size: 0.9em;
  line-height: 1.2;
}

.trix-content .attachment--file {
  color: #333;
  line-height: 1;
  margin: 0 2px 2px 2px;
  padding: 0.4em 1em;
  border: 1px solid #bbb;
  border-radius: 5px;
}

.trix-content .attachment-gallery {
  display: flex;
  flex-wrap: wrap;
  position: relative;
}

.trix-content .attachment-gallery .attachment {
  flex: 1 0 33%;
  padding: 0 0.5em;
  max-width: 33%;
}

.trix-content .attachment-gallery.attachment-gallery--2 .attachment,
.trix-content .attachment-gallery.attachment-gallery--4 .attachment {
  flex-basis: 50%;
  max-width: 50%;
}

/* ===== ads ===== */

.banner-sponsor-container {
  display: flex;
  justify-content: flex-end;
  align-items: stretch;
  padding: 0;
  margin-top: 1em;
  grid-gap: 1em;
  flex-direction: column;
}

@media (min-width: 768px) {
  .banner-sponsor-container {

    align-items: center;
    flex-direction: row;
  }
}

.banner-wrapper {
  text-align: center;
  flex-grow: 1;

  img {
    max-width: 900px;
    max-height: 110px;
    height: auto;
    cursor: pointer;
  }
}

.sponsor-wrapper {
  border-top: 1px solid gainsboro;
  padding: 1em;

  margin-top: 1em;
}

@media (min-width: 768px) {
  .sponsor-wrapper {
    margin-top: 0;
    border-left: 1px solid gainsboro;
  }
}

.sponsored-by {
  font-size: 80%;
  font-weight: bold;
  margin-bottom: 0.5em;
  text-align: center;


}

@media (min-width: 768px) {
  .sponsored-by {
    text-align: left;
  }
}

.sponsor-logos {
  display: flex;
  justify-content: center;
  align-items: center;
  grid-gap: 1em;
  flex-direction: column;

  a {
    display: flex;
  }
}

@media (min-width: 768px) {
  .sponsor-logos {
    flex-direction: row;
  }
}

.banner-sponsor-container+.footer {
  margin-top: 0;
}

/* ===== alert ===== */

#error_explanation {
  border-radius: 5px;

  ul {
    color: var(--error);
    margin: 0;
    padding-top: 5px;
    margin-bottom: 1rem;
    padding-bottom: 5px;
  }

  h2 {
    font-size: 1.4em;
    margin: 0;
    font-weight: bold;
  }
}

.alert {
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 4px;
  max-width: 800px;
}

.alert-notice {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #3c763d;
}

.alert-error,
.alert-danger,
.alert-alert {
  background-color: #f2dede;
  border-color: #ebccd1;
  color: #a94442;
}

.alert-hidden {
  display: none;
  visibility: hidden;
}

/* ===== autocomplete ===== */

div.autocomplete {
  z-index: 10000;
  border: solid 1px var(--grey);
  background: white;

  div {
    border-bottom: solid 1px var(--grey);
    padding: 0.5em;
  }
}

.autocomplete .selected {
  background: var(--selected);
}

input.autocomplete {
  margin-bottom: 0.5em;
}

/* ===== branding ===== */
#ocp-logo {
  text-align: center;
  display: inline-block;
  width: 100%;

  img {
    max-width: 200px;
  }
}

/* ===== bookmark ===== */

.not-yet-bookmarked {
  color: grey;
}

.currently-bookmarked {
  color: red;
}

/* ===== buttons ===== */

.btn-toolbar {
  margin-left: -5px;
}

.btn-group {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

.btn-toolbar>.btn,
.btn-toolbar>.btn-group,
.btn-toolbar>.input-group {
  margin-left: 5px;
  float: left;
}

.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}

.well .btn-group {
  padding-top: 0.5em;
  padding-bottom: 0.5em;
}

.well-sm {
  padding: 9px;
  border-radius: 3px;
  display: inline-block;
  width: 100%;
}

input[type="submit"].btn,
button.btn,
.btn {
  display: inline-block;
  margin-bottom: 0;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  touch-action: manipulation;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  padding: 0.5rem 0.75rem;
  font-size: 1rem;
  line-height: 1.428571429;
  border-radius: 4px;
  user-select: none;

  &:hover {
    opacity: 0.8;
  }

  &.btn-danger {
    color: #fff;
    background-color: red;
    border-color: #ce0808;
  }

  &.btn-info {
    color: #fff;
    background-color: coral;
    border-color: #ff5a1d;
  }

  &.btn-primary {
    color: #fff;
    background-color: #00aced;
    border-color: #0099d4;
  }

  &.btn-default {
    color: #333;
    background-color: #fff;
    border-color: #ccc;
  }

  &:active,
  &.active {
    outline: 0;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  }

  &.btn-sm {
    padding: 0.25rem 0.5rem;
    font-size: 90%;
  }
}

.btn-default:active,
.btn-default.active {
  color: #333;
  background-color: #e6e6e6;
  background-image: none;
  border-color: #adadad;
}

.btn-group>.btn,
.btn-group-vertical>.btn {
  position: relative;
  float: left;
}

.btn-group>.btn:first-child {
  margin-left: 0;
}

.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
  border-radius: 0;
}

.btn-group .btn+.btn,
.btn-group .btn+.btn-group,
.btn-group .btn-group+.btn,
.btn-group .btn-group+.btn-group {
  margin-left: -1px;
}

.btn-toolbar .btn,
.btn-toolbar .btn-group {
  float: left;
  z-index: 2;
}

.btn-group.btn-group-right {
  float: right;
}

.btn-group.btn-group-right>.btn,
.btn-group-vertical.btn-group-right>.btn {
  position: relative;
  float: right;
}

.btn-group .btn {
  font-size: 90%;
}

.btn-sm {
  font-size: 75%;
}

input[type="submit"].btn-no-pad,
button.btn-no-pad,
.btn-no-pad {
  padding: 0rem;
  background-color: transparent;
}

input[type="submit"].btn-outline-default,
button.btn-outline-default,
.btn-outline-default {
  background: white;
  border-color: #007eb2;
}

input[type="submit"].btn-outline-default,
button.btn-outline-default {
  color: #0090cb;
}

.btn-report-shortcut {
  i {
    margin-right: 0.5em;
  }
}

.btn-group.padding-left {
  padding-left: 0.5em;
}

.in-page-button-toolbar {
  display: inline-block;
  width: 100%;
}

td form {
  margin-bottom: 0;
}

/* ===== course_cards ===== */

.course-card-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  max-width: 100%;
  width: 800px;
  margin-bottom: 2em;
}

.course-card {
  border: 1px solid var(--grey);
  padding: 0.75rem 1rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  background: #f5f5f5;

  h3 {
    font-size: 1.5rem;
    margin: 0;
    margin-bottom: 0.5em;
    width: 100%;
  }

  form {
    margin-bottom: 0;
    display: inline-block;
  }
}

.course-card.full {
  border: none;
  padding: 0;
  background: transparent;
}

.course-card-name-logo {
  margin-bottom: 1em;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
}

.course-card-name-logo-left {
  flex-grow: 1;
  grid-column: 1/3;
  grid-row: 1;
}

.course-card-description {
  font-size: 1em;
  margin-bottom: 1em;

  &.warn {
    color: var(--error);
  }
}

.course-preview {
  margin: 1rem 0rem;
  color: var(--green);
}

.course-card-buttons {
  margin-top: 1em;
  text-align: right;
}

.card-sponsor-wrapper {
  padding: 1em;
  padding-top: 0.25em;
  margin-top: 0;
}

.course-sponsored-by {
  font-size: 60%;
  font-weight: bold;
  margin-bottom: 0.5em;
  white-space: nowrap;
  text-align: left;
}

.course-sponsor-logos {
  display: flex;
  justify-content: center;
  align-items: center;
  grid-gap: 1em;
  flex-direction: row;

  a {
    display: flex;
  }

  img {
    max-width: 100px;
    height: auto;
  }
}

.course-card-unpublished {
  text-align: center;
  border: solid 1px gainsboro;
  padding: 0.5rem;
  margin: 0.5rem 0rem;
  color: var(--error);
}

.course-challenge-notice {
  text-align: left;
  color: var(--green);
  padding: 0 0.5em;
  margin-bottom: 1em;
}

/* ===== course_materials ===== */

.course-material-section-actions {
  border: 1px dashed grey;
  padding: .5rem;
  margin-bottom: 1rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.course-material-section-icons {
  display: flex;
}

.course-material-section-icons span {
  margin-right: 1rem;
}

.course-material-section {
  margin-bottom: 1rem;
}


/* Inline #4 | http://localhost:3000/courses/47/course_materials */

.course-material-section .download {
  display: flex;
  width: 100%;
  justify-content: flex-start;
  align-items: center;
  font-size: 1.25rem;
  margin-bottom: 1rem;

  i,
  svg {
    font-size: 3rem;
    margin-right: 1rem;
    color: #151515;
  }

}

.download_preview_file {
  display: flex;
  width: 100%;
  justify-content: flex-start;
  align-items: center;
  font-size: 1rem;
  margin-top: 1rem;

  i,
  svg {
    font-size: 1.5rem;
    margin-right: .5rem;
    color: #151515;
  }
}

.remove {
  color: red;
}

/* ===== client_landing_page ===== */

.landing-page {
  display: flex;
}

.landing-page-welcome {
  padding: 2rem;
  font-size: 1.25rem;
}

/* ===== filters ===== */

.list-filters {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;

  &>div {
    margin-right: 1em;
    margin-bottom: 1em;
  }

  .table-date-filter {
    max-width: 110px;
    position: relative;
  }

  .filter-set {
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;

    &>div {
      margin-right: 0.25em;
    }

    &>div.last-child {
      margin-right: 0;
    }
  }
}

.list-filters.stacked {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
  flex-direction: column;
}

#stale-filter-warning {
  margin: 0em 1em 1em 1em;
  color: var(--error);
}

.filter-input {
  position: relative;

  /* If treating a standard Rails input form as filter-input
     (IE, horizontal inputs) we can to disable the form-group
     styling that's on there by default */
  .form-group {
    margin-bottom: 0;
    display: block;
  }

  .field_with_errors input {
    border: 1px solid var(--error);
  }

  select {
    max-width: 200px;
  }
}

.filter-input label {
  text-align: left;
  width: auto;
  padding-right: 0;
  max-width: initial;
  font-size: 95%;
}

.filter-input.horizontal {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;

  label {
    margin-bottom: 0;
    margin-right: 0.5em;
  }

  input[type="radio"],
  input[type="checkbox"] {
    margin: 0;
  }
}

.filter-actions {
  display: flex;
  justify-content: flex-start;
  align-items: center;

  a {
    margin-left: 0.5em;
  }
}

.filter-radios {
  display: inline-block;
}

.filter-input.special-filters {
  &>span {
    padding-right: 0.25em;
  }

  label {
    margin-left: 0.25em;
  }
}

/* ===== flatpickr ===== */
.flatpickr-calendar {
  background: transparent;
  opacity: 0;
  display: none;
  text-align: center;
  visibility: hidden;
  padding: 0;
  -webkit-animation: none;
  animation: none;
  direction: ltr;
  border: 0;
  font-size: 14px;
  line-height: 24px;
  border-radius: 5px;
  position: absolute;
  width: 307.875px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  background: var(--shelf);
  -webkit-box-shadow: 1px 0 0 #20222c, -1px 0 0 #20222c, 0 1px 0 #20222c, 0 -1px 0 #20222c,
    0 3px 13px rgba(0, 0, 0, 0.08);
  box-shadow: 1px 0 0 #20222c, -1px 0 0 #20222c, 0 1px 0 #20222c, 0 -1px 0 #20222c, 0 3px 13px rgba(0, 0, 0, 0.08);
}

.flatpickr-calendar.open,
.flatpickr-calendar.inline {
  opacity: 1;
  max-height: 640px;
  visibility: visible;
}

.flatpickr-calendar.open {
  display: inline-block;
  z-index: 99999;
}

.flatpickr-calendar.animate.open {
  -webkit-animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
  animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

.flatpickr-calendar.inline {
  display: block;
  position: relative;
  top: 2px;
}

.flatpickr-calendar.static {
  position: absolute;
  top: calc(100% + 2px);
}

.flatpickr-calendar.static.open {
  z-index: 999;
  display: block;
}

.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n + 1) .flatpickr-day.inRange:nth-child(7n + 7) {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n + 2) .flatpickr-day.inRange:nth-child(7n + 1) {
  -webkit-box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
  box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
}

.flatpickr-calendar .hasWeeks .dayContainer,
.flatpickr-calendar .hasTime .dayContainer {
  border-bottom: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.flatpickr-calendar .hasWeeks .dayContainer {
  border-left: 0;
}

.flatpickr-calendar.showTimeInput.hasTime .flatpickr-time {
  height: 40px;
  border-top: 1px solid #20222c;
}

.flatpickr-calendar.noCalendar.hasTime .flatpickr-time {
  height: auto;
}

.flatpickr-calendar:before,
.flatpickr-calendar:after {
  position: absolute;
  display: block;
  pointer-events: none;
  border: solid transparent;
  content: "";
  height: 0;
  width: 0;
  left: 22px;
}

.flatpickr-calendar.rightMost:before,
.flatpickr-calendar.rightMost:after {
  left: auto;
  right: 22px;
}

.flatpickr-calendar:before {
  border-width: 5px;
  margin: 0 -5px;
}

.flatpickr-calendar:after {
  border-width: 4px;
  margin: 0 -4px;
}

.flatpickr-calendar.arrowTop:before,
.flatpickr-calendar.arrowTop:after {
  bottom: 100%;
}

.flatpickr-calendar.arrowTop:before {
  border-bottom-color: #20222c;
}

.flatpickr-calendar.arrowTop:after {
  border-bottom-color: var(--shelf);
}

.flatpickr-calendar.arrowBottom:before,
.flatpickr-calendar.arrowBottom:after {
  top: 100%;
}

.flatpickr-calendar.arrowBottom:before {
  border-top-color: #20222c;
}

.flatpickr-calendar.arrowBottom:after {
  border-top-color: var(--shelf);
}

.flatpickr-calendar:focus {
  outline: 0;
}

.flatpickr-wrapper {
  position: relative;
  display: inline-block;
}

.flatpickr-months {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.flatpickr-months .flatpickr-month {
  background: var(--shelf);
  color: #fff;
  fill: #fff;
  height: 34px;
  line-height: 1;
  text-align: center;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
  text-decoration: none;
  cursor: pointer;
  position: absolute;
  top: 0;
  height: 34px;
  padding: 10px;
  z-index: 3;
  color: #fff;
  fill: #fff;
}

.flatpickr-months .flatpickr-prev-month.flatpickr-disabled,
.flatpickr-months .flatpickr-next-month.flatpickr-disabled {
  display: none;
}

.flatpickr-months .flatpickr-prev-month i,
.flatpickr-months .flatpickr-next-month i {
  position: relative;
}

.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month.flatpickr-prev-month {
  /*
      /*rtl:begin:ignore*/
  /*
      */
  left: 0;
  /*
      /*rtl:end:ignore*/
  /*
      */
}

/*
      /*rtl:begin:ignore*/
/*
      /*rtl:end:ignore*/
.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,
.flatpickr-months .flatpickr-next-month.flatpickr-next-month {
  /*
      /*rtl:begin:ignore*/
  /*
      */
  right: 0;
  /*
      /*rtl:end:ignore*/
  /*
      */
}

/*
      /*rtl:begin:ignore*/
/*
      /*rtl:end:ignore*/
.flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-months .flatpickr-next-month:hover {
  color: #eee;
}

.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
  fill: #f64747;
}

.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg {
  width: 14px;
  height: 14px;
}

.flatpickr-months .flatpickr-prev-month svg path,
.flatpickr-months .flatpickr-next-month svg path {
  -webkit-transition: fill 0.1s;
  transition: fill 0.1s;
  fill: inherit;
}

.numInputWrapper {
  position: relative;
  height: auto;
}

.numInputWrapper input,
.numInputWrapper span {
  display: inline-block;
}

.numInputWrapper input {
  width: 100%;
}

.numInputWrapper input::-ms-clear {
  display: none;
}

.numInputWrapper input::-webkit-outer-spin-button,
.numInputWrapper input::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

.numInputWrapper span {
  position: absolute;
  right: 0;
  width: 14px;
  padding: 0 4px 0 2px;
  height: 50%;
  line-height: 50%;
  opacity: 0;
  cursor: pointer;
  border: 1px solid rgba(255, 255, 255, 0.15);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.numInputWrapper span:hover {
  background: rgba(192, 187, 167, 0.1);
}

.numInputWrapper span:active {
  background: rgba(192, 187, 167, 0.2);
}

.numInputWrapper span:after {
  display: block;
  content: "";
  position: absolute;
}

.numInputWrapper span.arrowUp {
  top: 0;
  border-bottom: 0;
}

.numInputWrapper span.arrowUp:after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 4px solid rgba(255, 255, 255, 0.6);
  top: 26%;
}

.numInputWrapper span.arrowDown {
  top: 50%;
}

.numInputWrapper span.arrowDown:after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid rgba(255, 255, 255, 0.6);
  top: 40%;
}

.numInputWrapper span i,
.numInputWrapper span svg {
  width: inherit;
  height: auto;
}

.numInputWrapper span svg path {
  fill: rgba(255, 255, 255, 0.5);
}

.numInputWrapper:hover {
  background: rgba(192, 187, 167, 0.05);
}

.numInputWrapper:hover span {
  opacity: 1;
}

.flatpickr-current-month {
  font-size: 135%;
  line-height: inherit;
  font-weight: 300;
  color: inherit;
  position: absolute;
  width: 75%;
  left: 12.5%;
  padding: 7.48px 0 0 0;
  line-height: 1;
  height: 34px;
  display: inline-block;
  text-align: center;
  -webkit-transform: translate3d(0px, 0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}

.flatpickr-current-month span.cur-month {
  font-family: inherit;
  font-weight: 700;
  color: inherit;
  display: inline-block;
  margin-left: 0.5ch;
  padding: 0;
}

.flatpickr-current-month span.cur-month:hover {
  background: rgba(192, 187, 167, 0.05);
}

.flatpickr-current-month .numInputWrapper {
  width: 6ch;
  width: 7ch\0;
  display: inline-block;
}

.flatpickr-current-month .numInputWrapper span.arrowUp:after {
  border-bottom-color: #fff;
}

.flatpickr-current-month .numInputWrapper span.arrowDown:after {
  border-top-color: #fff;
}

.flatpickr-current-month input.cur-year {
  background: transparent;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: inherit;
  cursor: text;
  padding: 0 0 0 0.5ch;
  margin: 0;
  display: inline-block;
  font-size: inherit;
  font-family: inherit;
  font-weight: 300;
  line-height: inherit;
  height: auto;
  border: 0;
  border-radius: 0;
  vertical-align: initial;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}

.flatpickr-current-month input.cur-year:focus {
  outline: 0;
}

.flatpickr-current-month input.cur-year[disabled],
.flatpickr-current-month input.cur-year[disabled]:hover {
  font-size: 100%;
  color: rgba(255, 255, 255, 0.5);
  background: transparent;
  pointer-events: none;
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
  appearance: menulist;
  background: var(--shelf);
  border: none;
  border-radius: 0;
  box-sizing: border-box;
  color: inherit;
  cursor: pointer;
  font-size: inherit;
  font-family: inherit;
  font-weight: 300;
  height: auto;
  line-height: inherit;
  margin: -1px 0 0 0;
  outline: none;
  padding: 0 0 0 0.5ch;
  position: relative;
  vertical-align: initial;
  -webkit-box-sizing: border-box;
  -webkit-appearance: menulist;
  -moz-appearance: menulist;
  width: auto;
}

.flatpickr-current-month .flatpickr-monthDropdown-months:focus,
.flatpickr-current-month .flatpickr-monthDropdown-months:active {
  outline: none;
}

.flatpickr-current-month .flatpickr-monthDropdown-months:hover {
  background: rgba(192, 187, 167, 0.05);
}

.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
  background-color: var(--shelf);
  outline: none;
  padding: 0;
}

.flatpickr-weekdays {
  background: transparent;
  text-align: center;
  overflow: hidden;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 28px;
}

.flatpickr-weekdays .flatpickr-weekdaycontainer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

span.flatpickr-weekday {
  cursor: default;
  font-size: 90%;
  background: var(--shelf);
  color: #fff;
  line-height: 1;
  margin: 0;
  text-align: center;
  display: block;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  font-weight: bolder;
}

.dayContainer,
.flatpickr-weeks {
  padding: 1px 0 0 0;
}

.flatpickr-days {
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 307.875px;
}

.flatpickr-days:focus {
  outline: 0;
}

.dayContainer {
  padding: 0;
  outline: 0;
  text-align: left;
  width: 307.875px;
  min-width: 307.875px;
  max-width: 307.875px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-around;
  justify-content: space-around;
  -webkit-transform: translate3d(0px, 0px, 0px);
  transform: translate3d(0px, 0px, 0px);
  opacity: 1;
}

.dayContainer+.dayContainer {
  -webkit-box-shadow: -1px 0 0 #20222c;
  box-shadow: -1px 0 0 #20222c;
}

.flatpickr-day {
  background: none;
  border: 1px solid transparent;
  border-radius: 150px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: rgba(255, 255, 255, 0.95);
  cursor: pointer;
  font-weight: 400;
  width: 14.2857143%;
  -webkit-flex-basis: 14.2857143%;
  -ms-flex-preferred-size: 14.2857143%;
  flex-basis: 14.2857143%;
  max-width: 39px;
  height: 39px;
  line-height: 39px;
  margin: 0;
  display: inline-block;
  position: relative;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
}

.flatpickr-day.inRange,
.flatpickr-day.prevMonthDay.inRange,
.flatpickr-day.nextMonthDay.inRange,
.flatpickr-day.today.inRange,
.flatpickr-day.prevMonthDay.today.inRange,
.flatpickr-day.nextMonthDay.today.inRange,
.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus {
  cursor: pointer;
  outline: 0;
  background: #646c8c;
  border-color: #646c8c;
}

.flatpickr-day.today {
  border-color: #eee;
}

.flatpickr-day.today:hover,
.flatpickr-day.today:focus {
  border-color: #eee;
  background: #eee;
  color: var(--shelf);
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
  background: var(--brand);
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
  border-color: var(--brand);
}

.flatpickr-day.selected.startRange,
.flatpickr-day.startRange.startRange,
.flatpickr-day.endRange.startRange {
  border-radius: 50px 0 0 50px;
}

.flatpickr-day.selected.endRange,
.flatpickr-day.startRange.endRange,
.flatpickr-day.endRange.endRange {
  border-radius: 0 50px 50px 0;
}

.flatpickr-day.selected.startRange+.endRange:not(:nth-child(7n + 1)),
.flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n + 1)),
.flatpickr-day.endRange.startRange+.endRange:not(:nth-child(7n + 1)) {
  -webkit-box-shadow: -10px 0 0 var(--brand);
  box-shadow: -10px 0 0 var(--brand);
}

.flatpickr-day.selected.startRange.endRange,
.flatpickr-day.startRange.startRange.endRange,
.flatpickr-day.endRange.startRange.endRange {
  border-radius: 50px;
}

.flatpickr-day.inRange {
  border-radius: 0;
  -webkit-box-shadow: -5px 0 0 #646c8c, 5px 0 0 #646c8c;
  box-shadow: -5px 0 0 #646c8c, 5px 0 0 #646c8c;
}

.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay,
.flatpickr-day.notAllowed,
.flatpickr-day.notAllowed.prevMonthDay,
.flatpickr-day.notAllowed.nextMonthDay {
  color: rgba(255, 255, 255, 0.3);
  background: transparent;
  border-color: transparent;
  cursor: default;
}

.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
  cursor: not-allowed;
  color: rgba(255, 255, 255, 0.1);
}

.flatpickr-day.week.selected {
  border-radius: 0;
  -webkit-box-shadow: -5px 0 0 var(--brand), 5px 0 0 var(--brand);
  box-shadow: -5px 0 0 var(--brand), 5px 0 0 var(--brand);
}

.flatpickr-day.hidden {
  visibility: hidden;
}

.rangeMode .flatpickr-day {
  margin-top: 1px;
}

.flatpickr-weekwrapper {
  float: left;
}

.flatpickr-weekwrapper .flatpickr-weeks {
  padding: 0 12px;
  -webkit-box-shadow: 1px 0 0 #20222c;
  box-shadow: 1px 0 0 #20222c;
}

.flatpickr-weekwrapper .flatpickr-weekday {
  float: none;
  width: 100%;
  line-height: 28px;
}

.flatpickr-weekwrapper span.flatpickr-day,
.flatpickr-weekwrapper span.flatpickr-day:hover {
  display: block;
  width: 100%;
  max-width: none;
  color: rgba(255, 255, 255, 0.3);
  background: transparent;
  cursor: default;
  border: none;
}

.flatpickr-innerContainer {
  display: block;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
}

.flatpickr-rContainer {
  display: inline-block;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.flatpickr-time {
  text-align: center;
  outline: 0;
  display: block;
  height: 0;
  line-height: 40px;
  max-height: 40px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.flatpickr-time:after {
  content: "";
  display: table;
  clear: both;
}

.flatpickr-time .numInputWrapper {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  width: 40%;
  height: 40px;
  float: left;
}

.flatpickr-time .numInputWrapper span.arrowUp:after {
  border-bottom-color: rgba(255, 255, 255, 0.95);
}

.flatpickr-time .numInputWrapper span.arrowDown:after {
  border-top-color: rgba(255, 255, 255, 0.95);
}

.flatpickr-time.hasSeconds .numInputWrapper {
  width: 26%;
}

.flatpickr-time.time24hr .numInputWrapper {
  width: 49%;
}

.flatpickr-time input {
  background: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: 0;
  border-radius: 0;
  text-align: center;
  margin: 0;
  padding: 0;
  height: inherit;
  line-height: inherit;
  color: rgba(255, 255, 255, 0.95);
  font-size: 14px;
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}

.flatpickr-time input.flatpickr-hour {
  font-weight: bold;
}

.flatpickr-time input.flatpickr-minute,
.flatpickr-time input.flatpickr-second {
  font-weight: 400;
}

.flatpickr-time input:focus {
  outline: 0;
  border: 0;
}

.flatpickr-time .flatpickr-time-separator,
.flatpickr-time .flatpickr-am-pm {
  height: inherit;
  float: left;
  line-height: inherit;
  color: rgba(255, 255, 255, 0.95);
  font-weight: bold;
  width: 2%;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.flatpickr-time .flatpickr-am-pm {
  outline: 0;
  width: 18%;
  cursor: pointer;
  text-align: center;
  font-weight: 400;
}

.flatpickr-time input:hover,
.flatpickr-time .flatpickr-am-pm:hover,
.flatpickr-time input:focus,
.flatpickr-time .flatpickr-am-pm:focus {
  background: #6a7395;
}

.flatpickr-input[readonly] {
  cursor: pointer;
}

@-webkit-keyframes fpFadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fpFadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.flatpickr-confirm {
  height: 40px;
  max-height: 0px;
  visibility: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  background: rgba(0, 0, 0, 0.06);
}

.flatpickr-confirm svg path {
  fill: inherit;
}

.flatpickr-confirm.darkTheme {
  color: white;
  fill: white;
}

.flatpickr-confirm.visible {
  max-height: 40px;
  visibility: visible;
}

.flatpickr.form-control {
  border-radius: 4px 0px 0px 4px !important;
}

/* ===== forms ===== */

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}

input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

label {
  font-size: 90%;
  display: block;
  font-weight: bold;
  letter-spacing: 0.5px;
  margin-bottom: 0.25em;
}

form {
  margin-bottom: 1em;
}

.input:not(.hidden)+.input:not(.hidden) {
  margin-top: 1em;
}

.form-section {
  margin: 1.5em 0em;
  padding: 1.5em 0em;
  border-top: solid 1px var(--grey);
}

input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="url"],
textarea,
select {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  width: 100%;
  padding: 0.5em;
  line-height: 1.4;
  background-color: #f9f9f9;
  border: 1px solid #e5e5e5;
  border-radius: 3px;
  transition: all 0.35s ease-in-out;
  color: black;
}

input[type="file"] {
  margin-bottom: 1em;
}

.form-inputs {
  max-width: 800px;
}

.form-actions {
  margin-top: 0.5em;
  text-align: right;
  max-width: 800px;
  display: flex;
  justify-content: flex-end;
  grid-gap: 0.5em;
  align-items: center;
}

abbr[title] {
  color: red;
  text-decoration: none;
}

@supports (-webkit-appearance: none) or (-moz-appearance: none) {

  input[type="checkbox"],
  input[type="radio"] {
    --active: #0090cb;
    --active-inner: #fff;
    --focus: 2px rgba(39, 94, 254, 0.3);
    --border: #bbc1e1;
    --border-hover: #0090cb;
    --background: #fff;
    --disabled: #f6f8ff;
    --disabled-inner: #e1e6f9;
    -webkit-appearance: none;
    -moz-appearance: none;
    height: 21px;
    outline: none;
    display: inline-block;
    vertical-align: top;
    position: relative;
    margin: 0;
    cursor: pointer;
    border: 1px solid var(--bc, var(--border));
    background: var(--b, var(--background));
    transition: background 0.3s, border-color 0.3s, box-shadow 0.2s;

    &:after {
      content: "";
      display: block;
      left: 0;
      top: 0;
      position: absolute;
      transition: transform var(--d-t, 0.3s) var(--d-t-e, ease), opacity var(--d-o, 0.2s);
    }

    &:checked {
      --b: var(--active);
      --bc: var(--active);
      --d-o: 0.3s;
      --d-t: 0.6s;
      --d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2);
    }

    &:disabled {
      --b: var(--disabled);
      cursor: not-allowed;
      opacity: 0.9;

      &:checked {
        --b: var(--disabled-inner);
        --bc: var(--border);
      }

      &+label {
        cursor: not-allowed;
      }
    }

    &:hover {
      &:not(:checked) {
        &:not(:disabled) {
          --bc: var(--border-hover);
        }
      }
    }

    &:focus {
      box-shadow: 0 0 0 var(--focus);
    }

    &:not(.switch) {
      width: 21px;

      &:after {
        opacity: var(--o, 0);
      }

      &:checked {
        --o: 1;
      }
    }

    &+label {
      font-size: 14px;
      line-height: 21px;
      display: inline-block;
      vertical-align: top;
      cursor: pointer;
      margin-left: 4px;
    }
  }

  input[type="checkbox"] {
    &:not(.switch) {
      border-radius: 7px;

      &:after {
        width: 5px;
        height: 9px;
        border: 2px solid var(--active-inner);
        border-top: 0;
        border-left: 0;
        left: 7px;
        top: 4px;
        transform: rotate(var(--r, 20deg));
      }

      &:checked {
        --r: 43deg;
      }
    }

    &.switch {
      width: 38px;
      border-radius: 11px;

      &:after {
        left: 2px;
        top: 2px;
        border-radius: 50%;
        width: 15px;
        height: 15px;
        background: var(--ab, var(--border));
        transform: translateX(var(--x, 0));
      }

      &:checked {
        --ab: var(--active-inner);
        --x: 17px;
      }

      &:disabled {
        &:not(:checked) {
          &:after {
            opacity: 0.6;
          }
        }
      }
    }
  }

  input[type="radio"] {
    border-radius: 50%;

    &:after {
      width: 19px;
      height: 19px;
      border-radius: 50%;
      background: var(--active-inner);
      opacity: 0;
      transform: scale(var(--s, 0.7));
    }

    &:checked {
      --s: 0.5;
    }
  }
}

.input-group {
  display: flex;
}

.input-group-btn {
  display: flex;
  justify-content: center;
  align-items: stretch;
}

.field_with_errors {
  border-left: 10px solid red;
  padding-left: 1em;

  .error {
    color: red;
    font-weight: normal;
    font-size: 90%;
    margin-top: 0.5em;
    display: block;
  }
}

.image_preview {
  margin-bottom: 1em;
  margin-top: 1em;
  display: flex;
  justify-content: flex-start;
  align-items: center;

  img {
    margin-right: 0.5em;
    border: 2px dashed gainsboro;
  }
}

.input.inline {
  display: flex;

  label {
    margin-right: 0.5em;
  }
}

.depends-on {
  margin-top: 1em;
}

.depends-on+.input:not(.hidden) {
  margin-top: 1em;
}

.radio-check-wrapper .checkbox {
  display: block;
}

.inline_checkbox .checkbox {
  margin-right: 0.5em;
}

.input.radio-wrapper {
  display: flex;

  input[type="radio"] {
    margin-right: .5em;
  }
}

.input.boolean {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.image-preview {
  padding: 5px;
  border: 1px dashed black;
}

/* ===== info ===== */

.i .l {
  font-weight: normal;
  display: block;
  font-size: 80%;
}

.i+.i {
  margin-top: 1em;
}

.i {
  max-width: 800px;
}

.image-wrapper {
  margin-bottom: 2em;
}

/* ===== icon ===== */
span.plus {
  margin-right: 0.5em;
}

.bool {
  font-weight: 400;
}

.bool.yes {
  color: green;
}

.bool.no {
  color: black;
}

.archive-icon {

  i,
  svg,
  a {
    color: green;
  }
}

.delete-icon {

  i,
  svg,
  a {
    color: var(--error);
  }
}

.add-icon {

  i,
  svg,
  a {
    color: var(--brand);
  }
}

.no-delete-icon {
  color: var(--error);
}

.edit-icon.disabled {
  color: #006c98;
  opacity: 0.5;
}

.delete-icon.disabled {
  opacity: 0.5;
}

/* ===== info_grid ===== */

.info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 5px;

  .info-field {
    font-size: 1em;
    border: 1px solid var(--grey);
    padding: 0.25em 0.5em;
    display: flex;
    justify-content: space-between;
    background: white;

    form {
      margin-bottom: 0rem;

      .input+.input {
        margin-top: 0rem;
      }
    }
  }

  .info-field-right {
    justify-content: right;
  }

  span {
    font-weight: bold;
  }
}

.info-flex {
  display: flex;
  justify-content: center;
  align-items: center;

  i,
  svg {
    margin-left: 0.5em;
  }
}

/* ===== layout ===== */

html {
  overflow: hidden;
  height: 100%;
  font-size: 100%;
}

#l-page-wrapper {
  padding-left: 0;
  transition: all 0.5s ease;
  min-height: 100%;
  display: flex;

  &.toggled {
    padding-left: 230px;
    overflow-x: hidden;
    overflow-y: auto;

    #l-sidebar-wrapper {
      width: 230px;
    }

    #l-page-content-wrapper {
      position: relative;
      margin-right: 0px;
    }
  }
}

#l-sidebar-wrapper {
  z-index: 1000;
  position: fixed;
  left: 230px;
  width: 0;
  height: 100%;
  margin-left: -230px;
  margin-top: 0;
  overflow-y: auto;
  transition: all 0.5s ease;
  background-color: var(--shelf);
  color: white;
  border-right: 1px solid var(--grey);
  overflow-x: hidden;
  padding-bottom: 50px;
  /* to compensate for body top padding on long sidebars */
}

#l-page-content-wrapper {
  display: flex;
  flex-direction: column;
  padding: 0;
  margin: 0;
  overflow-x: hidden;
  height: 100%;
  width: auto;
  margin-right: 0;
  margin-left: 0;
  padding-left: 0;
  transition: all 0.5s ease;
}

.l-login-container {
  margin: 0px auto;
  max-width: 900px;

  h2 {
    text-align: center;
  }
}

.l-body-width-container {
  min-height: 100%;
  flex-grow: 1;
  max-width: 100%;
}

.toggled .l-body-width-container {
  width: calc(100% + 230px);
}

@media (min-width: 768px) {
  .toggled .l-body-width-container {
    width: auto;
  }

  .registered {
    #l-page-wrapper {
      padding-left: 230px;

      &.toggled {
        padding-left: 0;
      }
    }
  }

  .sidebar-width-brand {
    width: 230px;
  }

  #l-sidebar-wrapper {
    width: 230px;
  }

  #l-page-wrapper.toggled-open #l-sidebar-wrapper {
    width: 230px;
  }

  #l-page-wrapper.toggled-closed #l-sidebar-wrapper {
    width: 73px;
    /* Just show icons */
  }

  #l-page-wrapper.toggled #l-page-content-wrapper {
    margin-right: 0;
    padding-left: 230px;
    transition: all 0.5s ease;
  }

  #l-page-wrapper.toggled-closed #l-page-content-wrapper {
    margin-right: 0;
    margin-left: -160px;
    width: auto;
    transition: all 0.5s ease;
  }
}

.l-padded-container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

#l-page-content-inner {
  margin: 0 auto;
  display: flex;
  width: 100%;
  flex-grow: 1;
  align-items: stretch;
  flex-direction: column;
}

footer {
  margin-right: auto;
  margin-left: auto;
  padding-left: 15px;
  padding-right: 15px;
  clear: both;
  width: 100%;
  margin-top: 1em;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  border-top: 1px solid var(--grey);
  color: var(--shelf);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-shrink: 0;

  a {
    color: var(--shelf);

    &:hover {
      color: var(--shelf);
    }
  }

  small {
    float: left;
    font-size: 75%;
  }

  ul {
    float: right;
    list-style: none;
    padding: 0;
    font-size: 75%;
    margin: 0;

    li {
      float: left;
    }

    li+li {
      margin-left: 1em;
    }
  }
}

body {
  height: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch !important;
  margin: 0;
  font-size: 100%;
  line-height: 1.42857143;
  color: var(--bodytext);
  background-color: #ffffff;
  font-weight: normal;
  padding-top: 50px;
}

.nav {
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}

#l-top {
  background: white;
  margin-right: -15px;
  margin-left: -60px;
  padding-left: 43px;
  margin-bottom: 1.25em;
  border-bottom: 1px solid #e3e3e3;
  display: flex;

  .well.well-sm {
    border: 0;
    padding: 0;
    margin-bottom: 0;
    min-height: 0;
    box-shadow: none;
  }

  .well .btn-group {
    padding-bottom: 0em;
  }
}

.pull-right {
  float: right !important;
}

.pull-right-end {
  float: right !important;
  align-self: end;
}

#l-content {
  display: flex;
  align-items: stretch;
  width: 100%;
  flex-direction: column;
  flex-grow: 1;
}

.text-readable {
  max-width: 800px;
}

/* ===== leaderboard ===== */

.leaderboards-index {
  display: grid;
  grid-template-columns: repeat(2, 2fr);
  grid-gap: 1em;
}

.leaderboard {
  font-size: 0.9em;

  border: solid 1px gainsboro;
  border-radius: 5px;
}

.leaderboard-header {
  display: grid;
  grid-template-columns: repeat(2, 2fr);
  padding: 0.5rem 0.75rem;
  border-bottom: solid 1px gainsboro;
  width: 100%;
  justify-content: space-between;

  h3 {
    margin: 0rem;
    padding: 0.4rem 0.75rem 0.4rem 0rem;
  }
}

.leaderboard-buttons {
  text-align: right;
}

.leaderboard-table {
  padding: 0.25rem;

  th {
    padding: 4px !important;
  }

  td {
    padding: 4px !important;
  }
}

/* ===== login ===== */

.login-branding {
  text-align: center;
  padding-top: 2rem;
  padding-bottom: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;

  .login-branding-image {
    max-width: 500px;

    img {
      max-width: 100%;
      height: auto;
    }
  }

  &.client-present {
    padding-top: 0;

    .login-branding-image {
      max-width: 200px;
    }
  }
}

.login-client-branding {
  text-align: center;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  flex-direction: column;
}

.login-client-powered {
  font-size: 75%;
  margin-top: 1em;
}

.login-client-image {
  max-width: 500px;

  img {
    max-width: 100%;
    height: auto;
  }
}

#l-login-container {
  flex-grow: 1;
  width: 100%;
  max-width: 530px;
  margin: 0px auto;
}

.nav.login-links {
  font-size: 90%;

  li {
    margin-bottom: 0.25em;
  }
}

.client-registration {
  text-align: center;
  max-width: 500px;
  margin: 0px auto;
  width: 100%;

  h3 {
    font-size: 2rem;
  }
}

.client-registration-message {
  border: 1px solid gainsboro;
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  text-align: left;
  font-size: 1.3em;
  margin-top: 1em;
  margin-bottom: 1em;
}

.client-registration-buttons {
  margin-top: 1em;
  text-align: right;
}

.login-introduction {
  text-align: center;
  margin-bottom: 2em;
}

#turnstile_wrapper {
  margin-top: .75em;
}

/* ===== nav ===== */

span.back-icon {
  margin-right: 0.25em;
}

.navback {
  font-size: 80%;
}

.content-crumb+h2 {
  margin-top: 0.25em;
}

.top-image-wrapper {
  background: white;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  border-right: 1px solid #e3e3e3;

  a {
    padding: 0.5em;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}

.top-right {
  padding-top: 1em;
  padding-right: 15px;
  padding-bottom: 0.5em;
  background: var(--shaded);
  flex-grow: 1;
  padding-left: 0.75em;
}

/* ===== micromodal ===== */

/**************************\
  Basic Modal Styles
\**************************/

.modal__overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9000;
}

.modal__container {
  background-color: #fff;
  padding: 30px;
  max-height: 100vh;
  border-radius: 4px;
  overflow-y: auto;
  box-sizing: border-box;
  max-width: 100%;
}

@media (min-width: 768px) {
  .modal__container {
    min-width: 700px;
    max-width: 1000px;
  }
}

.modal__container.wide {
  min-width: 100%;
}

@media (min-width: 768px) {
  .modal__container.wide {
    min-width: 1000px;
  }
}

.modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal__title {
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.25;
  color: var(--brand);
  box-sizing: border-box;
}

.modal__close {
  background: transparent;
  border: 0;
}

.modal__header .modal__close:before {
  content: "\2715";
}

.modal__content {
  margin-top: 2rem;
  margin-bottom: 2rem;
  line-height: 1.5;
  color: rgba(0, 0, 0, 0.8);
}

.modal__btn {
  font-size: 0.875rem;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  background-color: #e6e6e6;
  color: rgba(0, 0, 0, 0.8);
  border-radius: 0.25rem;
  border-style: none;
  border-width: 0;
  cursor: pointer;
  -webkit-appearance: button;
  text-transform: none;
  overflow: visible;
  line-height: 1.15;
  margin: 0;
  will-change: transform;
  -moz-osx-font-smoothing: grayscale;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  transition: -webkit-transform 0.25s ease-out;
  transition: transform 0.25s ease-out;
  transition: transform 0.25s ease-out, -webkit-transform 0.25s ease-out;
}

.modal__btn:focus,
.modal__btn:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}

.modal__btn-primary {
  background-color: #00449e;
  color: #fff;
}

/**************************\
  Demo Animation Style
\**************************/
@keyframes mmfadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes mmfadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes mmslideIn {
  from {
    transform: translateY(15%);
  }

  to {
    transform: translateY(0);
  }
}

@keyframes mmslideOut {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(-10%);
  }
}

.micromodal-slide {
  display: none;
}

.micromodal-slide.is-open {
  display: block;
}

.micromodal-slide[aria-hidden="false"] .modal__overlay {
  animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden="false"] .modal__container {
  animation: mmslideIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__overlay {
  animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__container {
  animation: mmslideOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide .modal__container,
.micromodal-slide .modal__overlay {
  will-change: transform;
}

/* ===== navbar ===== */

#navbar {
  float: right;
  margin-bottom: 0;
}

.navbar-nav {
  margin: 0;

  &>li>a {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}

.navbar-fixed-top {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
}

.navbar-brand {
  float: left;
  height: 50px;
  font-size: 18px;
  line-height: 20px;
  padding: 5px 15px;
  margin-left: -15px;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  justify-content: flex-start;
  align-items: center;
}

.navbar {
  background-color: var(--brand);
  border-color: var(--brand);
  z-index: 2000;

  .navbar-nav>li>a {
    color: white;
  }
}

a.navbar-icon,
div.nolink.navbar-icon {
  display: inline-flex;
  color: white;
  align-items: center;
  margin-left: 1rem;
  font-size: 1.5em;

  &:hover {
    opacity: 0.7;
    color: white;
  }
}

.navbar-right-icons {
  float: right;
  vertical-align: text-bottom;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 52px;
}

.navbar-left-icons {
  float: left;
  vertical-align: text-bottom;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 52px;
}

#navbar-logo img {
  max-width: 140px;
  grid-column: 1;
  grid-row: 1;
  opacity: 0;
  transition: opacity 2s linear;

  &.show {
    opacity: 1;
  }
}

.navbar-current-user {
  display: inline-block;
  color: white;
}

.navbar-sidebar-toggle {
  display: none;
  visibility: hidden;


  float: left;
  background: transparent;
  border: none;
  color: white;
  padding: 0;
  margin: 0;
  font-size: 1.3rem;
}

@media (min-width: 768px) {
  .navbar-sidebar-toggle {
    display: block;
    visibility: visible;
  }
}

.navbar-btn {
  margin-bottom: 0.5rem;
}

#replacement-navbar-logo {
  display: none;
}

/* ===== pagination ===== */

.pagination {
  background: white;
  cursor: default;
  /* self-clearing method: */
  float: right;
  font-size: 85%;
  margin-bottom: 1em;

  a,
  span,
  em {
    padding: 0.2em 0.5em;
    display: block;
    float: left;
    margin-right: 1px;
  }

  .disabled {
    color: #999999;
    border: 1px solid #dddddd;
  }

  .current {
    font-style: normal;
    font-weight: bold;
    background: var(--brand);
    color: white;
    border: 1px solid var(--brand);
  }

  a {
    text-decoration: none;
    color: var(--brand);
    border: 1px solid #9aafe5;
  }

  a:hover,
  a:focus {
    color: #000033;
    border-color: var(--brand);
  }

  .page_info {
    background: #2e6ab1;
    color: white;
    padding: 0.4em 0.6em;
    width: 22em;
    margin-bottom: 0.3em;
    text-align: center;
  }

  .page_info b {
    color: #000033;
    background: #6aa6ed;
    padding: 0.1em 0.25em;
  }

  .pagination:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
  }
}

* html .pagination {
  height: 1%;
}

*:first-child+html .pagination {
  overflow: hidden;
}

/* ===== section_cards ===== */

.section-cards {
  display: flex;
  flex-wrap: wrap;
}

.section-card-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  max-width: 100%;
  width: 800px;
  margin-right: 1em;
  margin-bottom: 1em;
}

.section-card-bookmark {
  display: inline-block;
  border: 1px solid var(--grey);
  font-size: 1.5rem;
  padding: 0.25rem 1.25rem;
  margin-bottom: -20px;
  background: white;
  margin-right: 10px;
  z-index: 10;
}

.section-card {
  border: 1px solid var(--grey);
  padding: 0.75rem 1rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  background: #f5f5f5;

  h3 {
    font-size: 1.5rem;
    grid-column: 1/3;
    grid-row: 1;
    margin: 0;
    padding-right: 60px;
  }
}

.section-card.full {
  border: none;
  padding: 0;
  background: transparent;
}

.section-card-name-logo {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 1em;

  a+h3 {
    margin-left: 1em;
  }
}

.section-card-description {
  font-size: 1em;
}

.section-card-buttons {
  margin-top: 1em;
  text-align: right;

  .grant-me-link {
    display: inline;
  }

  .admin-badge {
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    touch-action: manipulation;
    background-image: none;
    border: 1px solid transparent;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
    padding: 0.5em 0.75em;
    font-size: 1em;
    line-height: 1.428571429;
    border-radius: 4px;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: red;
  }
}

/* ===== section ===== */

.welcome {
  font-size: 1.2em;
  max-width: 800px;
  border: 1px solid white;
  padding: 0.5rem;
  margin-bottom: 2em;
}

.welcome-logo {
  margin-bottom: 1em;
}

/* ===== sheets ===== */
.sheet-form {
  display: none;
}

/* ===== sidebar ===== */

.mobile-sidebar-toggle {
  background: transparent;
  border: none;
  color: white;
  padding: 0;
  margin: 0;
  margin-right: 1rem;
  font-size: 1.3rem;


}

@media (min-width: 768px) {
  .mobile-sidebar-toggle {
    display: none;
    visibility: hidden;
  }
}

ul.sidebar-nav {
  width: 230px;
  margin: 0;
  padding: 0;
  list-style: none;
  margin-bottom: 1rem;
  margin-top: 1em;

  li.danger {
    background: var(--error) !important;
  }

  li {
    line-height: 40px;
    display: inline-block;
    width: 100%;

    &.active {
      background: rgba(255, 255, 255, 0.11);

      a {
        background: transparent;
      }

      a:hover {
        background: transparent;
      }
    }

    &:hover {
      background: rgba(255, 255, 255, 0.11);

      a {
        background: transparent;
      }

      a:hover {
        background: transparent;
      }
    }

    a {
      text-decoration: none;
      font-weight: 400;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
      color: white;

      .sidebar-label {
        font-size: 1rem;
        font-weight: 300;
      }

      &:hover {
        text-decoration: none;
      }

      &:active,
      &:focus {
        text-decoration: none;
      }
    }

    li ul li {
      text-indent: 0;
      margin-left: 0;
      float: left;

      a {
        font-size: 1.2rem;
      }
    }
  }
}

ul.sidebar-nav+ul.sidebar-nav {
  margin-bottom: 0;
  margin-top: 0.5em;
}

.tooltip.sidebar-tooltip {
  left: 73px !important;
}

body.toggled-open .sidebar-tooltip {
  display: none !important;
}

.sidebar-icon {
  font-size: 1.8rem;
  color: white;
  padding-left: 0;
  width: 73px;
  display: inline-flex;
  justify-content: center;
  align-items: center;

  .fa-layers-counter {
    transform: scale(0.4) translate(15px, -21px);
  }
}

#l-sidebar-wrapper {
  h2 {
    margin-top: 0.5rem;
    margin-bottom: 0;
    font-size: 1rem;
    text-align: left;
    background: var(--brand);
    color: white;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 0.5em;
    text-transform: none;
    line-height: 1.5;
    max-height: 200px;
    overflow: visible;
    transition: all 0.5s ease;

    i svg {
      margin-left: 0.35rem;
    }
  }


  h2.other-sections {
    background: grey;
  }

  h3 {
    margin-top: 0rem;
    margin-bottom: 0;
    font-size: 1rem;
    text-align: left;
    background: var(--brand);
    color: white;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 1em;
    text-transform: none;
    line-height: 1.5;
    max-height: 200px;
    overflow: visible;
    transition: all 0.5s ease;
    font-weight: 300;

    i,
    svg {
      margin-right: 0.25rem;
    }
  }
}

.toggled-closed {
  #l-sidebar-wrapper h2 {
    color: #0090cb;
    max-height: 0;
    overflow: hidden;
  }
}

/* ===== quiz_attempt ===== */

.pre-quiz-notification {
  font-size: 1.4em;
  max-width: 900px;
  margin: 0px auto;
  text-align: center;
}

.quiz-component {
  display: flex;
  align-items: stretch;
  flex-grow: 1;
}

.quiz-attempt-actions {
  text-align: center;
  margin-top: 1em;
}

/* ===== quiz_cards ===== */

.quiz-list-logo {
  text-align: center;
  max-width: 800px;
}

.quiz-card-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  max-width: 100%;
  width: 800px;
  margin-bottom: 2em;
}

.quiz-card {
  border: 1px solid var(--grey);
  padding: 0.75rem 1rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  background: #f5f5f5;

  h3 {
    font-size: 1.5rem;
    margin: 0;
    width: 100%;
    font-weight: bold;
    margin-bottom: 1em;

    a {
      color: black;
    }

    strong {
      font-weight: bold;
    }

    .trix-content {
      line-height: 1;
    }
  }

  form {
    margin-bottom: 0;
    display: inline-block;
  }

  &.course {
    background: whitesmoke;
  }
}

.quiz-card-right {
  text-align: center;
  width: 100%;
}

@media (min-width: 768px) {
  .quiz-card-right {

    max-width: 250px;
  }
}

.quiz-card-top.with-quiz-card-logo {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  grid-gap: 1em;
  flex-direction: column-reverse;


}

@media (min-width: 768px) {
  .quiz-card-top.with-quiz-card-logo {
    flex-direction: row;
    grid-gap: 2em;
  }
}

.quiz-card.full {
  border: none;
  padding: 0;
  background: transparent;
}

.quiz-card-name-logo {
  margin-bottom: 1em;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
}

.quiz-card-name-logo-left {
  flex-grow: 1;
  grid-column: 1/3;
  grid-row: 1;
}

.quiz-card-description {
  font-size: 1em;
  margin-bottom: 1em;

  &.warn {
    color: var(--error);
    font-weight: bold;
  }
}

.quiz-preview {
  margin: 1rem 0rem;
  color: var(--green);
}

.quiz-card-buttons {
  margin-top: 1em;
  text-align: right;
}

.card-sponsor-wrapper {
  padding: 1em;
  padding-top: 0.25em;
  margin-top: 0;
}

.card-sponsored-by {
  font-size: 60%;
  font-weight: bold;
  margin-bottom: 0.5em;
  white-space: nowrap;
  text-align: left;
}

.card-sponsor-logos {
  display: flex;
  justify-content: center;
  align-items: center;
  grid-gap: 1em;
  flex-direction: row;

  a {
    display: flex;
  }

  img {
    max-width: 100px;
    height: auto;
  }
}

.quiz-card-unpublished {
  text-align: center;
  border: solid 1px gainsboro;
  padding: 0.5rem;
  margin: 0.5rem 0rem;
  color: var(--error);
}

.quiz-challenge-notice {
  text-align: left;
  color: var(--green);
  padding: 0 0.5em;
  margin-bottom: 1em;
}

.quiz-card-banner {
  max-width: 100%;
  width: 800px;
  margin-bottom: 2em;
  text-align: center;

  .banner-wrapper img {
    max-width: 760px;
    max-height: 300px;
  }

}

.quiz-card-left {
  flex-grow: 1;
}

/* ===== quiz_challenges ===== */

.challenge-not-top-attempt-warning {
  padding: 0.5rem;
  color: var(--error);
  border: solid 1px gainsboro;
  margin: 0.5rem 0rem;

  .warning-msg {
    padding: 0rem 0.5rem;
  }
}

.challenge-header {
  font-size: 1.4em;
  max-width: 900px;
  margin: 0px auto;
  text-align: left;
  display: flex;
  align-items: center;
  margin-bottom: 1em;

  i,
  svg {
    font-size: 4em;
    margin-right: -15px;
    opacity: 0.1;
  }

  h3 {
    font-size: 1.4rem;
    margin: 0;
  }
}

.quiz-challenge-result {
  padding: 0.25em 0.5em;
  text-align: center;
  margin-top: 0.5em;
  font-weight: bold;
}

.quiz-challenge-top {
  display: flex;
  justify-content: space-between;
}

.challenge-better-score {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1em;
  padding: 0 1em;
  border: 2px dashed orange;
}

/* ===== reports ===== */
.report-running i {
  font-size: 5em;
}

ul.reports-list {
  list-style: none;
  padding: 0;
  margin: 0;
  column-count: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 1em;

  li {
    display: inline-block;
    width: 100%;
    border-bottom: 1px solid gainsboro;
  }
}

.report-meta {
  margin-bottom: 1rem;
  font-size: 80%;
}

#report-print-buttons {
  &.report-complete-false {
    display: none;
    visibility: hidden;
  }
}

#report-filters {
  margin-top: 2em;
  margin-bottom: 2em;

  &.report-complete-false {
    display: none;
    visibility: hidden;
  }
}

#report-controls {
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
}

.report-two-column {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 2em;
}

/* Not needed on the web */
.continued-report-heading {
  display: none;
}

.subsection-report-heading {
  margin-top: 3em;
}

.report-body {
  h2 {
    clear: both;
  }
}

.report-header {
  clear: both;
}

.report-body {
  width: 100%;
  display: inline-block;
}

.report-meta h2 {
  display: none;
}

.report-running {
  text-align: center;
  margin-top: 5em;
}

tr.report-row-important {
  font-weight: bolder;
}

ul.report-set {
  margin: 0;
  padding: 0 1em;

  li {
    list-style: none;
    margin-bottom: 0.5em;
  }

  li:last-child {
    margin-bottom: 0;
  }

  li a {
    border: 1px solid var(--grey);
    padding: 0.25em 0.5em;
    display: inline-block;
    width: 100%;
    max-width: 200px;
  }
}

/* ===== tables ===== */
.table-responsive {
  overflow-x: auto;
}

.full-width-table {
  width: 100%;
}

.table {
  width: 100%;
  max-width: 100%;
  margin-bottom: 20px;
}

table {
  background-color: transparent;
  border-collapse: collapse;
  border-spacing: 0;
}

.table>caption+thead>tr:first-child>th,
.table>caption+thead>tr:first-child>td,
.table>colgroup+thead>tr:first-child>th,
.table>colgroup+thead>tr:first-child>td,
.table>thead:first-child>tr:first-child>th,
.table>thead:first-child>tr:first-child>td {
  border-top: 0;
}

.table>thead>tr>th {
  vertical-align: bottom !important;
  border-bottom: 2px solid #ddd !important;
}

.table>thead>tr>th,
.table>thead>tr>td,
.table>tbody>tr>th,
.table>tbody>tr>td,
.table>tfoot>tr>th,
.table>tfoot>tr>td {
  padding: 8px;
  line-height: 1.428571429;
  vertical-align: top;
  border-top: 1px solid #ddd;
}

th {
  padding: 8px;
  font-weight: normal;
  color: var(--bodytext);
  text-align: left;
}

.table-striped>tbody>tr:nth-child(odd)>td,
.table-striped>tbody>tr:nth-child(odd)>th {
  background-color: var(--shaded);
}

.custom-stripe>tbody>tr.stripe>td,
.custom-stripe>tbody>tr.stripe>th {
  background-color: var(--shaded);
}

.table-hover>tbody>tr:hover>td,
.table-hover>tbody>tr:hover>th {
  background-color: #ffffa9;
}

.table-striped>tbody>tr,
.table-striped>tbody>tr:nth-child(odd) {
  .today {
    background: yellow;
  }
}

.table-fixed {
  table-layout: fixed;
}

td.maxwrap {
  max-width: 200px;
}

td h3 {
  font-size: 1em;
  margin: 0;
  line-height: 1.428571429;
}

.drag {
  cursor: move;
}

tr.editing td {
  background: #efff0059 !important;
}

.table-compact {
  border-collapse: collapse;
  border-spacing: 0;
  background: white;
  margin-bottom: 1em;
  font-size: 90%;
  border-left: 1px solid var(--grey);
  border-top: 1px solid var(--grey);
  width: 100%;

  th {
    font-weight: bold;
    text-align: left;
    border-right: 1px solid var(--grey);
    border-bottom: 1px solid var(--grey);
    padding: 5px;
  }

  td {
    border-right: 1px solid var(--grey);
    border-bottom: 1px solid var(--grey);
    padding: 5px;
  }

  &>thead>tr>th {
    border-bottom: 0;
  }

  ul {
    margin-bottom: 0;
  }
}

.table-totals {
  border-collapse: collapse;
  border-spacing: 0;
  background: white;
  margin-bottom: 1em;
  font-size: 100%;
  border: none;
  max-width: 300px;
  float: right;
  font-weight: bold;
  text-align: right;

  >tbody>tr>td {
    border-top: none;
  }
}

table thead,
table tbody,
table tfoot {

  th.right,
  td.right {
    text-align: right;
  }

  th.center,
  td.center {
    vertical-align: middle;
    text-align: center;
  }

  th.w3rem,
  td.w3rem {
    width: 3rem;
  }

  th.w100,
  td.w100 {
    width: 100px;
  }

  td.modified {
    font-weight: bold;
  }
}

td div.icons {
  display: flex;
  align-items: center;
  justify-content: flex-end;

  div {
    margin-left: 1em;
  }
}

.table>tbody>tr>td.subtable {
  padding: 8px 0;
}

.table-controls {
  text-align: right;
}

.table>tbody>tr.middle>td {
  vertical-align: middle;
}

td.strike {
  text-decoration: line-through;
}

div.strike {
  text-decoration: line-through;
}

div.no-strike {
  text-decoration: none;
}

/* ===== typography ===== */

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-weight: 700;
  line-height: 1.1;
  color: var(--bodytext);
  -webkit-font-smoothing: antialiased;
  -mox-osx-font-smoothing: grayscale;
}

h1 {
  letter-spacing: -2px;
  margin-bottom: 0.25rem;
  font-size: 2rem;
  text-align: left;
  margin-top: 0;
  font-weight: 300;

  i,
  svg {
    margin-right: 0.75rem;
  }
}

h2 {
  font-size: 1.7rem;
  font-weight: 300;
  margin-bottom: 1em;

  &.center {
    text-align: center;
  }
}

h3 {
  font-size: 1.4rem;
}

h4 {
  font-size: 1.1rem;
  margin-bottom: 1rem;
}

h2+h3 {
  margin-top: 0;
}

p {
  font-size: 1rem;
  line-height: 1.357;
}

a {
  text-decoration: none;
  color: var(--brand);
}

a:hover,
a:focus {
  text-decoration: none;
}
