article:has(h1), article.promo {
  --step--2: clamp(.606rem, .464rem + .606vw, .908rem);
  --step--1: clamp(.778rem, .596rem + .778vw, 1.167rem);
  --step-0: clamp(1rem, .766rem + 1vw, 1.5rem);
  --step-1: clamp(1.285rem, .984rem + 1.285vw, 1.928rem);
  --step-2: clamp(1.651rem, 1.264rem + 1.651vw, 2.477rem);
  --step-3: clamp(2.122rem, 1.625rem + 2.122vw, 3.183rem);
  --step-4: clamp(2.727rem, 2.088rem + 2.727vw, 4.09rem);
  --step-5: clamp(3.504rem, 2.682rem + 3.504vw, 5.255rem);
  --step-6: clamp(4.502rem, 3.447rem + 4.502vw, 6.753rem);
  --article-step--2: var(--step--2);
  --article-step--1: var(--step--1);
  --article-step-0: var(--step-0);
  --article-step-1: var(--step-1);
  --article-step-2: var(--step-2);
  --article-step-3: var(--step-3);
  --article-step-4: var(--step-4);
  --article-step-5: var(--step-5);
  --article-step-6: var(--step-6); }
  article:has(h1) h1, article:has(h1) h2, article:has(h1) h3, article:has(h1) h4, article:has(h1) h5, article:has(h1) h6, article.promo h1, article.promo h2, article.promo h3, article.promo h4, article.promo h5, article.promo h6 {
    font-weight: normal;
    line-height: 1.3333;
    margin: 0 0 0.3333em; }
  article:has(h1) h1, article.promo h1 {
    font-size: var(--step-5);
    text-align: left; }
    article:has(h1) h1 small, article.promo h1 small {
      display: inline-block;
      font-size: var(--step-3); }
  article:has(h1) h2, article.promo h2 {
    font-size: var(--step-3); }
    article:has(h1) h2 small, article.promo h2 small {
      display: inline-block;
      font-size: var(--step-2); }
  article:has(h1) h3, article.promo h3 {
    font-size: var(--step-2); }
    article:has(h1) h3 small, article.promo h3 small {
      display: inline-block;
      font-size: var(--step-1); }
  article:has(h1) h4, article.promo h4 {
    font-size: var(--step-1);
    font-style: normal; }
  article:has(h1) h5, article.promo h5 {
    font-size: var(--step-0); }
  article:has(h1) h6, article.promo h6 {
    font-size: var(--step-0);
    font-style: oblique; }
  article:has(h1) p, article.promo p {
    font-weight: 200;
    letter-spacing: 0.02em;
    line-height: 1.666;
    margin-bottom: 1.666rem; }
  article:has(h1) *:not(h1, h2, h3, h4), article.promo *:not(h1, h2, h3, h4) {
    font-size: var(--step-0);
    font-weight: 300; }
  article:has(h1) figcaption, article.promo figcaption {
    font-size: var(--step--1); }
  article:has(h1) strong, article:has(h1) b, article.promo strong, article.promo b {
    font-weight: 500; }
  article:has(h1) code, article.promo code {
    font-size: var(--step--1); }
  article:has(h1) aside, article.promo aside {
    --step--1: var(--article-step--2);
    --step-0: var(--article-step--1);
    --step-1: var(--article-step-0);
    --step-2: var(--article-step-1);
    --step-3: var(--article-step-2);
    --step-4: var(--article-step-3);
    --step-5: var(--article-step-4);
    --step-6: var(--article-step-5);
    padding: 0;
    opacity: 0.6666;
    line-height: calc(1.666 * var(--article-step-0)); }
    article:has(h1) aside ul, article.promo aside ul {
      margin-top: 0; }
    article:has(h1) aside p, article:has(h1) aside li, article.promo aside p, article.promo aside li {
      font-weight: 200;
      letter-spacing: 0.02em;
      line-height: calc(1.666 * var(--article-step-0)); }
.button,
button,
input[type="button"],
input[type="submit"] {
  border: 0;
  background: #004151;
  color: #fff;
  text-decoration: none;
  line-height: 2.5;
  padding: 0 0.5em;
  display: inline-block;
  font-size: 1em;
  margin: 0;
  font-family: "Helvetica Neue", Helvetica, "Nimbus Sans", "Nimbus Sans L", Inter, Roboto, "Arial Nova", Arial, sans-serif; }
  .button:hover, .button:focus,
  button:hover,
  button:focus,
  input[type="button"]:hover,
  input[type="button"]:focus,
  input[type="submit"]:hover,
  input[type="submit"]:focus {
    color: #fff;
    background: #111;
    transform: scale(1.04); }
  .button.primary,
  button.primary,
  input.primary[type="button"],
  input.primary[type="submit"] {
    background: #09762d; }
    .button.primary:hover, .button.primary:focus,
    button.primary:hover,
    button.primary:focus,
    input.primary[type="button"]:hover,
    input.primary[type="button"]:focus,
    input.primary[type="submit"]:hover,
    input.primary[type="submit"]:focus {
      color: #fff;
      background: #009432; }
  .button.secondary,
  button.secondary,
  input.secondary[type="button"],
  input.secondary[type="submit"] {
    background: #ddd;
    color: #111; }
    .button.secondary:hover, .button.secondary:focus,
    button.secondary:hover,
    button.secondary:focus,
    input.secondary[type="button"]:hover,
    input.secondary[type="button"]:focus,
    input.secondary[type="submit"]:hover,
    input.secondary[type="submit"]:focus {
      color: #111;
      background: #bbb; }
  .button.warn, .button.alert,
  button.warn,
  button.alert,
  input.warn[type="button"],
  input.alert[type="button"],
  input.warn[type="submit"],
  input.alert[type="submit"] {
    background: red;
    color: #fff;
    padding: 0 0.5em;
    margin: 0; }
    .button.warn:hover, .button.warn:focus, .button.alert:hover, .button.alert:focus,
    button.warn:hover,
    button.warn:focus,
    button.alert:hover,
    button.alert:focus,
    input.warn[type="button"]:hover,
    input.warn[type="button"]:focus,
    input.alert[type="button"]:hover,
    input.alert[type="button"]:focus,
    input.warn[type="submit"]:hover,
    input.warn[type="submit"]:focus,
    input.alert[type="submit"]:hover,
    input.alert[type="submit"]:focus {
      color: #fff;
      background: #cc0000; }
  .button.small,
  button.small,
  input.small[type="button"],
  input.small[type="submit"] {
    font-size: 0.825rem;
    line-height: 1;
    padding: 0.3em; }

small.button,
small button,
small input[type="button"],
small input[type="submit"] {
  line-height: 1;
  padding: 0.3em; }

aside .button,
aside button,
aside input[type="button"],
aside input[type="submit"] {
  width: 100%;
  margin-bottom: 0.5em; }
ul.cards, ol.cards {
  list-style: none;
  margin: 0;
  padding: 0; }

.card {
  border: #eee 1px solid;
  display: flex;
  flex-direction: column;
  align-content: baseline;
  padding: 1em;
  position: relative;
  border-radius: 1em; }
  .card .text {
    display: flex;
    flex-direction: column;
    max-width: 60ch;
    order: 1; }
  .card .img {
    text-align: center;
    min-height: 100px; }
  .card a:focus {
    text-decoration: underline; }
  .card:focus-within {
    box-shadow: 0 0 0 1px #004151; }
  .card:focus-within a:focus {
    text-decoration: none; }
  .card + .card {
    margin-top: 1.5rem; }

@supports (display: grid) {
  ol.cards, ul.cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(13em, 1fr));
    grid-gap: 1.5rem; }
  .card + .card {
    margin-top: 0; } }
/* Devise specific */
.actions {
  margin: 1em 0; }

.field {
  margin: 1em 0 0; }
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="date"],
input[type="number"],
textarea,
select {
  font-size: 1em;
  width: 100%;
  font-family: "Helvetica Neue", Helvetica, "Nimbus Sans", "Nimbus Sans L", Inter, Roboto, "Arial Nova", Arial, sans-serif;
  padding: 0 0.5em;
  line-height: 2;
  border: 1px solid #bbb;
  line-height: inherit;
  margin-top: -2px; }
  input[type="text"][disabled],
  input[type="email"][disabled],
  input[type="password"][disabled],
  input[type="search"][disabled],
  input[type="date"][disabled],
  input[type="number"][disabled],
  textarea[disabled],
  select[disabled] {
    background: #eee;
    border-color: #eee; }
  input[type="text"]:last-child,
  input[type="email"]:last-child,
  input[type="password"]:last-child,
  input[type="search"]:last-child,
  input[type="date"]:last-child,
  input[type="number"]:last-child,
  textarea:last-child,
  select:last-child {
    margin-bottom: 0; }

input + label,
input + input {
  margin-top: 0.5em; }

label {
  display: block; }

label + label {
  margin-top: 1em; }

input[type="file"] {
  width: 100%; }

input[type="radio"],
input[type="checkbox"] {
  height: 1.25em;
  width: 1.75em;
  display: inline-block; }

input[type="radio"] + label[for],
input[type="checkbox"] + label[for] {
  display: inline-block; }

label + p {
  margin-top: 1em; }

input[aria-invalid],
select[aria-invalid],
textarea[aria-invalid] {
  border: #dd0000 solid 3px; }

select {
  padding: 0.2em 0.5em; }

form label input {
  margin-bottom: 0; }

form .field > label:first-child {
  width: 100%;
  display: inline-block; }

form > *:first-child {
  margin-top: 0; }

textarea {
  line-height: 1.6666;
  min-height: 6em; }
  textarea.large {
    min-height: 22em; }

fieldset {
  margin-bottom: 1em;
  margin-top: 1em;
  border: 1px solid #eee;
  border-radius: 1em;
  padding: 1em; }

.button_to {
  display: inline-block; }

.form-actions {
  margin-top: 1em; }

.form__fields--compact {
  display: flex;
  flex-direction: row;
  align-content: stretch;
  gap: 1em; }

.form__fields--compact > * {
  flex-grow: 5;
  flex-spacing: 1em; }

.field--small {
  flex-grow: 1; }

.warn.button input[type="checkbox"] {
  display: none; }

fieldset.destroyed {
  display: none; }

form .hint {
  margin-top: -0.3em;
  display: block;
  font-size: var(--step-0); }

form span.error,
form div.error {
  font-size: 0.875em;
  color: #dd0000;
  margin-top: -0.3em;
  display: block;
  margin-bottom: 1em; }
@media (min-width: 40em) {
  .grid header {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    grid-template-rows: auto;
    grid-template-areas: "spacer spacer title title title title title title title title"; }
    .grid header h1 {
      grid-area: title; }
  .grid > div,
  .grid > section {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    grid-template-areas: "subtitle subtitle main main main main main main aside aside"; }
    .grid > div .subtitle,
    .grid > div h2,
    .grid > section .subtitle,
    .grid > section h2 {
      grid-area: subtitle; }
    .grid > div > div:not(.grid--full-width),
    .grid > div > section:not(.grid--full-width),
    .grid > section > div:not(.grid--full-width),
    .grid > section > section:not(.grid--full-width) {
      grid-area: main; }
    .grid > div aside,
    .grid > section aside {
      grid-area: aside; } }

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

.grid--full-width {
  grid-area: none;
  grid-column-start: subtitle-start;
  grid-column-end: aside-end;
  grid-row-start: unset;
  grid-row-end: unset; }
  .grid--full-width.callout, .grid--full-width.alert, .grid--full-width.notice, .grid--full-width.expand {
    margin: 0;
    max-width: unset;
    width: calc(100% + (3 * var(--root-step-0)) - 1px);
    margin-left: calc(-1.5 * var(--root-step-0));
    padding: calc(1.5 * var(--root-step-0));
    margin-top: 1em;
    margin-bottom: 1em;
    box-shadow: 0 0 1em rgba(0, 0, 0, 0.1); }
@charset "UTF-8";
:root {
  --step--2: clamp(0.778rem, 0.596rem + 0.415vw, 0.875rem);
  --step--1: clamp(0.882rem, 0.675rem + 0.47vw, 0.992rem);
  --step-0: clamp(1rem, 0.766rem + 0.533vw, 1.125rem);
  --step-1: clamp(1.134rem, 0.868rem + 0.605vw, 1.275rem);
  --step-2: clamp(1.285rem, 0.984rem + 0.685vw, 1.446rem);
  --step-3: clamp(1.457rem, 1.115rem + 0.777vw, 1.639rem);
  --step-4: clamp(1.651rem, 1.264rem + 0.881vw, 1.858rem);
  --step-5: clamp(1.872rem, 1.433rem + 0.998vw, 2.106rem);
  --step-6: clamp(2.122rem, 1.625rem + 1.132vw, 2.387rem);
  --root-step--2: var(--step--2);
  --root-step--1: var(--step--1);
  --root-step-0: var(--step-0);
  --root-step-1: var(--step-1);
  --root-step-2: var(--step-2);
  --root-step-3: var(--step-3);
  --root-step-4: var(--step-4);
  --root-step-5: var(--step-5);
  --root-step-6: var(--step-6); }

* {
  box-sizing: border-box; }

html {
  font-family: "Helvetica Neue", Helvetica, "Nimbus Sans", "Nimbus Sans L", Inter, Roboto, "Arial Nova", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6666;
  color: #111;
  background: #eee;
  accent-color: #09762d;
  caret-color: #09762d; }

::selection {
  background: #09762d;
  color: #fff; }

*:focus {
  outline: 2px solid #09762d; }

body {
  font-size: var(--step-0); }

h1 {
  font-size: var(--step-5); }

h2 {
  font-size: var(--step-4); }

h3 {
  font-size: var(--step-3); }

h4 {
  font-size: var(--step-2); }

h5 {
  font-size: var(--step-1); }

h6 {
  font-size: inherit; }

p {
  font-size: inherit; }

hr {
  border: 0 none;
  border-top: 1px solid #eee;
  clear: both;
  display: block;
  margin: 0.5em 0; }

blockquote {
  font-size: var(--step-1);
  padding: 0.5em 1em;
  background: #eee;
  border-radius: 1em; }

blockquote blockquote {
  font-size: var(--step-0);
  background: #fff; }

section section,
section:not(section),
article {
  break-inside: avoid; }

blockquote::before {
  content: open-quote;
  position: absolute;
  margin-left: calc(-1 * var(--step-2));
  margin-top: calc(-1 * var(--step-2));
  font-size: var(--step-4);
  display: block; }

blockquote::after {
  content: close-quote;
  visibility: hidden;
  position: absolute; }

figure:has(> blockquote) {
  overflow: auto; }
  figure:has(> blockquote) figcaption {
    margin-top: 0;
    float: right;
    font-size: var(--step-0); }
    figure:has(> blockquote) figcaption::before {
      content: "— "; }

a {
  color: #004151; }
  a:hover {
    color: #111; }

h1 > a,
h2 > a,
h3 > a,
h4 > a,
h5 > a,
h6 > a {
  color: inherit; }

body {
  background: #eee; }

header {
  position: relative; }

header *:first-child {
  margin-top: 0; }

main {
  margin: 1em auto;
  background: #fefefe;
  max-width: 80em;
  padding: 1em;
  border-radius: 1em;
  box-sizing: content-box;
  position: relative; }

body > footer {
  margin: 1em auto;
  max-width: 80em;
  padding: 1em;
  border-radius: 1em;
  box-sizing: content-box;
  position: relative; }

main footer {
  border-top: 1px solid #eee;
  clear: both;
  display: block;
  margin: 1em 0 0;
  padding: 1em 0 0; }

main:has(> article:first-child h1),
main:has(article.promo) {
  max-width: 40em; }

.u-columns main:has(> article:first-child h1) {
  max-width: inherit; }

h1 sub {
  font-weight: normal; }

aside {
  padding: 1em; }

main > h1:first-child,
main > h2:first-child,
main > h3:first-child,
main > nav + h1,
main > nav + h2,
main > nav + h3,
aside > h1:first-child,
aside > h2:first-child,
aside > h3:first-child,
aside > nav + h1,
aside > nav + h2,
aside > nav + h3 {
  margin-top: 0; }

main > aside,
main > section > aside {
  background: #eee;
  border-radius: 1em;
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
  margin-top: 0.5em;
  margin-bottom: 1em; }
  main > aside *:last-child,
  main > section > aside *:last-child {
    margin-bottom: 0; }

section:has(section) {
  border-top: #eee 1px solid;
  margin: 1em 0; }

table {
  width: 100%;
  margin-bottom: 1em; }
  table th {
    text-align: left; }

img {
  max-width: 100%;
  margin: 0 auto;
  max-height: 20cm; }

figure {
  margin: 1em 0; }
  figure img {
    display: block; }
  figure.standout {
    border: calc(1em / 4) #fff solid;
    box-shadow: 0 0 1em rgba(0, 0, 0, 0.1);
    width: calc(100% + (1em / 2));
    margin-left: calc(-1em / 4); }

caption,
figcaption {
  display: block;
  text-align: center;
  color: #666; }

p {
  margin-top: 0; }

p:last-child {
  margin-bottom: 0; }

p + p {
  margin-top: 1em; }

address {
  font-style: normal; }
  address p {
    margin: 0; }

dl dt {
  font-weight: bold; }

code {
  background: #666;
  color: #fefefe;
  border-radius: 0.25em;
  padding: 0 0.25em; }

pre {
  overflow: scroll; }

pre > code {
  display: block;
  border-radius: 1em;
  padding: 1em;
  overflow: scroll; }

iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto; }

* {
  transition-timing-function: ease-in-out;
  transition-duration: 0.15s;
  transition-property: margin, color, transform, box-shadow; }
.preview .invoice {
  box-shadow: 0 0 1em rgba(0, 0, 0, 0.1);
  padding: 1.5em; }

.invoice {
  max-width: 21cm; }
dl.no-inset dd {
  margin-left: 0; }

dl.no-inset dd + dt {
  margin-top: 0.5em; }

dl.inline dd {
  display: inline;
  margin-left: 0; }

dl.inline dt {
  display: inline; }

dl.inline dd + dt::before {
  content: " ";
  display: block;
  margin-top: 0.5em; }

ul.labels {
  display: block;
  margin: 1em 0;
  padding: 0; }

ul.labels li, .label {
  list-style: none;
  display: inline-block;
  background: #ddd;
  color: #111;
  border-radius: 0.5em;
  padding: 0 0.5em;
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important; }
  ul.labels li.primary, .label.primary {
    background: #09762d; }

ul.labels li {
  margin: 0; }

ul.labels li:has(> a),
.label:has(> a) {
  padding: 0; }
  ul.labels li:has(> a):hover, ul.labels li:has(> a):focus,
  .label:has(> a):hover,
  .label:has(> a):focus {
    color: #111;
    background: #bbb; }
  ul.labels li:has(> a) a,
  .label:has(> a) a {
    padding: 0 0.5em;
    display: inline-block; }

ul.labels li + li {
  margin-left: 0.5em; }

.label {
  margin: 0 0.125em; }
.meta, form .hint, form span.error,
form div.error {
  --step--1: var(--root-step--2);
  --step-0: var(--root-step--1);
  --step-1: var(--root-step-0);
  --step-2: var(--root-step-1);
  --step-3: var(--root-step-2);
  --step-4: var(--root-step-3);
  --step-5: var(--root-step-4);
  --step-6: var(--root-step-5);
  padding: 0;
  opacity: 0.6666; }

h1:has(+ .meta),
h2:has(+ .meta),
h3:has(+ .meta) {
  margin-bottom: 0; }
.h-event {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-areas: "title title title org date" "description description description description description"; }
  .h-event h2,
  .h-event h3,
  .h-event h4,
  .h-event h5 {
    margin: 0; }
  .h-event .dt-range {
    text-align: right; }

h3 {
  grid-area: title; }

.dt-start + .dt-end::before {
  content: " - "; }

.p-summary {
  grid-area: description; }

p:last-child {
  margin-bottom: 0; }
nav {
  box-sizing: content-box;
  margin: auto;
  padding: 0.5em 1em;
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 80em;
  position: relative; }
  nav.sticky {
    top: 0;
    z-index: 1000;
    background: rgba(238, 238, 238, 0.85);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    position: sticky; }

main > nav {
  border-radius: 0.5em;
  background: #eee;
  margin: 1em 0; }

nav > ul,
nav > ul ul {
  list-style: none;
  margin: 0;
  padding: 0; }
  nav > ul li,
  nav > ul ul li {
    display: inline-block; }
  nav > ul a,
  nav > ul ul a {
    display: inline-block; }
  nav > ul li + li,
  nav > ul ul li + li {
    margin-left: 1em; }
  nav > ul li:has(.button.secondary) + li:has(.button.secondary),
  nav > ul ul li:has(.button.secondary) + li:has(.button.secondary) {
    margin-left: .25em; }

nav.actions,
nav[role="actions"],
nav[role="user-actions"] {
  display: block;
  float: right;
  width: fit-content;
  margin: 0; }
  nav.actions ul,
  nav[role="actions"] ul,
  nav[role="user-actions"] ul {
    display: block;
    float: right; }

nav a:hover, nav a:focus {
  transform: scale(1.04); }

nav a.active {
  color: #111;
  font-weight: bold;
  text-decoration: none; }

[id]::before {
  content: '';
  display: block;
  height: 2em;
  margin-top: -2em;
  visibility: hidden; }
.notice, .alert, .callout {
  max-width: 50em;
  margin: 2em auto;
  padding: 1em; }

.notice {
  background: #ACD1AF; }

.alert {
  background: #D1AFAC; }

.callout {
  background: #eee; }

.callout .callout, .alert .alert, .notice .notice {
  background: #fff; }

.grid--full-width.expand {
  background: #fff;
  border-radius: 1em; }

div.notice, div.alert, div.callout, section.notice, section.alert, section.callout {
  padding: 1em;
  border-radius: 1em; }

div:not(.u-columns) > *:first-child, section:not(.u-columns) > *:first-child {
  margin-top: 0; }
.print-preview {
  box-shadow: 0 0 1em rgba(0, 0, 0, 0.1);
  width: 210mm;
  padding: 1.5cm;
  font-size: 12.5px; }
  .print-preview .not-for-print, .print-preview u-not-for-print {
    display: none; }

hr.page {
  border: none;
  border-top: 1px solid #eee; }

.u-only-for-print {
  display: none; }

@media print {
  html {
    background: none; }
  hr.page {
    border: none;
    border-top: none;
    page-break-after: always; }
  html {
    font-size: 12.5px; }
  body {
    background: none;
    margin: 10mm 10mm 10mm 10mm; }
  main {
    box-shadow: none;
    background: none; }
  nav {
    display: none; }
  .not-for-print, .u-not-for-print {
    display: none; }
  .u-only-for-print {
    display: block !important; }
  .invoice {
    padding: 0;
    box-shadow: none; }
  .preview,
  .print-preview {
    box-shadow: none;
    width: auto;
    padding: 0; }
    .preview .invoice,
    .print-preview .invoice {
      box-shadow: none; } }

@page {
  margin: 1cm; }
.search {
  display: flex;
  flex-direction: row;
  padding: 1em;
  box-sizing: content-box;
  width: 100%;
  margin-left: -1em; }
  .search input {
    margin-bottom: 0; }
  .search > * {
    border-style: solid;
    border-color: #004151; }
  .search > *:last-child {
    border-style: solid;
    border-radius: 0 1em 1em 0;
    border-left: 0 none; }
  .search > *:first-child {
    border-style: solid;
    border-radius: 1em 0 0 1em;
    border-right: 0 none; }
@charset "UTF-8";
td,
th {
  line-height: 1.25;
  padding: 0.25em; }

td {
  vertical-align: top; }
  td.center {
    text-align: center; }

td.number,
th.number {
  text-align: right; }

th small {
  font-weight: normal;
  line-height: 1; }

thead th {
  vertical-align: bottom; }

thead th[aria-sort="ascending"]::after {
  content: '▲';
  opacity: 0.75;
  margin: 0 0.5em; }

thead th[aria-sort="descending"]::after {
  content: '▼';
  opacity: 0.75;
  margin: 0 0.5em; }
.u-columns {
  display: flex;
  flex-direction: column;
  align-items: start;
  justify-content: center;
  gap: 1em;
  margin-bottom: 1em; }
  .u-columns > * {
    flex: 1 1 0%;
    max-width: 100%; }
  .u-columns > aside, .u-columns > .u-column--reduced {
    flex: 0.5 0.5 0%; }
  .u-columns:has(> aside):has(> main) {
    max-width: 82em;
    margin: auto; }
    .u-columns:has(> aside):has(> main) > * {
      max-width: 100%; }
    .u-columns:has(> aside):has(> main) main {
      flex-grow: 3; }
    .u-columns:has(> aside):has(> main) aside {
      margin-top: 1em;
      flex-grow: 1; }
    @media (min-width: 60em) {
      .u-columns:has(> aside):has(> main):has(> main > article > h1) aside {
        margin-top: 4em; } }
.u-right {
  float: right; }

@media (min-width: 40em) {
  .u-columns {
    flex-direction: row; }
    .u-columns > * {
      max-width: 50%; }
  .u-column-offset--fourth {
    margin-left: calc(25% + 0.666rem); } }
.work .stock_number {
  padding: 0.25em;
  background: #eee;
  display: inline-block; }

.card .stock_number {
  position: absolute;
  bottom: 0;
  right: 0em;
  margin: 0;
  border-radius: 0 0 1em 0; }

.card p {
  margin: 0; }

header.work .stock_number {
  float: right; }
/*
 * 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, 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.
 *


 */
/* test */
.video {
  width: 100%;
  border-top: 1px solid #c6c6c6;
  border-bottom: 1px solid #c6c6c6; }
  .video iframe {
    display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 560px;
    height: 315px;
    max-height: 315px; }
/* test */
.edit_questionnaire td {
  text-align: center; }

table {
  margin-bottom: 1em; }
  table thead th {
    text-align: center;
    padding: 0.5em; }
  table tbody td {
    padding: 1px 10px; }
  table tbody th {
    text-align: left;
    font-weight: normal;
    font-style: italic; }
  table tbody tr {
    border-top: 1px solid #c6c6c6;
    border-bottom: 1px solid #c6c6c6; }
    table tbody tr:hover {
      background: #f9f9f9; }

.results .item {
  float: left;
  width: 100%; }
  .results .item h5 {
    float: left;
    width: 100%; }
  .results .item .result {
    padding: 0 0 60px 30px;
    float: left;
    width: 100%; }
    .results .item .result.bars {
      padding: 0 0 60px 0; }

figure.value {
  float: left;
  margin: 0;
  margin-left: -60px;
  width: 150px;
  height: 150px; }
  figure.value figcaption {
    padding: 0 30px;
    font-size: 0.8em;
    text-align: center; }

.tabs {
  float: left;
  width: 100%;
  margin-bottom: 4em; }
  .tabs section {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background: #fff;
    padding: 1em;
    float: left;
    width: 100%;
    box-sizing: border-box;
    z-index: 4; }
  @media print {
    .tabs .tab-head {
      display: none;
      visibility: hidden; } }
  .tabs ul.tab-head,
  .tabs .tab-head li,
  .tabs ul li a {
    margin: 0;
    padding: 0;
    float: left;
    z-index: 10;
    list-style: none; }
  .tabs ul.tab-head li {
    position: relative; }
  .tabs ul.tab-head li a {
    padding: 0.4em;
    font-size: 0.8em;
    background: #fff;
    margin-right: 1em;
    z-index: 10;
    border: 1px solid #ddd;
    margin-bottom: -1px; }
    .tabs ul.tab-head li a.selected {
      border: 1px solid #ddd;
      border-bottom: 1px #fff solid;
      background: #fff;
      text-decoration: none;
      color: #000;
      font-weight: bold; }

@media (min-width: 550px) {
  .tabs.in-columns .tab-head {
    width: 25%; }
    .tabs.in-columns .tab-head li,
    .tabs.in-columns .tab-head li a {
      width: 100%;
      display: block; }
    .tabs.in-columns .tab-head li a.selected {
      border: 1px solid #ddd;
      border-right: 1px #fff solid;
      background: #fff; }
  .tabs.in-columns .panels {
    float: left;
    width: 75%;
    margin-left: -1px;
    border-left: 1px solid #ddd;
    overflow: hidden; } }

@media (max-width: 550px) {
  .tabs .tab-head {
    width: 100%; }
  .tabs li,
  .tabs li a {
    width: 100%;
    display: block; }
  .tabs ul.tab-head li a.selected {
    border-bottom: 1px #ddd solid; } }

@media print {
  .tabs .tab-head {
    width: 100%; }
  .tabs.in-columns .panels {
    width: 100%;
    border: 0; }
  .tabs section.hide {
    display: block !important;
    visibility: visible !important; }
  .tabs li,
  .tabs li a {
    width: 100%;
    display: block; }
  .tabs ul.tab-head li a.selected {
    border-bottom: 1px #ddd solid; } }
/* test */
/*
 * 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 styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *



 */
.item {
  page-break-inside: avoid; }
  .item .result {
    margin-bottom: 5em; }

.chart {
  width: 100%;
  max-width: 600px;
  aspect-ratio: 16 / 10;
  margin: auto; }

.legend {
  font-size: var(--step--2, 0.75); }
  .legend th,
  .legend td {
    width: 2000px;
    text-align: center;
    font-weight: 300; }
  .legend .label {
    border-radius: 0;
    display: inline-block;
    min-width: 3em;
    min-height: 1em; }