/*! Checka11y.css v2.4.0 | MIT License | github.com/jackdomleo7/Checka11y.css */
:root {
  --checka11y-text-warning: #856404;
  --checka11y-bg-warning: #ffffd8;
  --checka11y-border-warning: #ff6;
}

:root {
  --checka11y-space: 0.25rem;
  --checka11y-space-0: calc(var(--checka11y-space) * 0);
  --checka11y-space-2: calc(var(--checka11y-space) * 2);
  --checka11y-space-4: calc(var(--checka11y-space) * 4);
  --checka11y-space-6: calc(var(--checka11y-space) * 6);
}

[accesskey]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0000): accesskey attribute could interfere and conflict with screen readers and assistive technologies." !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[aria-hidden=true] a::after, [aria-hidden=true] button::after, [aria-hidden=true] summary::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0009): Focusable element in a aria-hidden element." !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[aria-hidden=true] area, [aria-hidden=true] audio[controls], [aria-hidden=true] iframe, [aria-hidden=true] input, [aria-hidden=true] select, [aria-hidden=true] textarea, [aria-hidden=true] video[controls] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-warning);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350px" height="80px" viewBox="0 0 350 80"><rect class="box" x="4" y="4" width="342" height="72" rx="12" ry="12" fill="rgba(255, 255, 216, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 255, 102, 0.999999)" /><g fill="rgba(133, 100, 4, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">WARNING (W0009): Focusable</text> <text x="15" y="60">element in a aria-hidden element.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 350px;
  padding-bottom: 80px;
}

a[aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

button[aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

summary[aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=separator][aria-valuenow][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=separator][aria-valuemin][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=separator][aria-valuemax][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

area[aria-hidden=true] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-warning);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350px" height="80px" viewBox="0 0 350 80"><rect class="box" x="4" y="4" width="342" height="72" rx="12" ry="12" fill="rgba(255, 255, 216, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 255, 102, 0.999999)" /><g fill="rgba(133, 100, 4, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">WARNING (W0017): Interactive</text> <text x="15" y="60">element containing aria-hidden</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 350px;
  padding-bottom: 80px;
}

audio[controls][aria-hidden=true] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-warning);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350px" height="80px" viewBox="0 0 350 80"><rect class="box" x="4" y="4" width="342" height="72" rx="12" ry="12" fill="rgba(255, 255, 216, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 255, 102, 0.999999)" /><g fill="rgba(133, 100, 4, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">WARNING (W0017): Interactive</text> <text x="15" y="60">element containing aria-hidden</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 350px;
  padding-bottom: 80px;
}

iframe[aria-hidden=true] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-warning);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350px" height="80px" viewBox="0 0 350 80"><rect class="box" x="4" y="4" width="342" height="72" rx="12" ry="12" fill="rgba(255, 255, 216, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 255, 102, 0.999999)" /><g fill="rgba(133, 100, 4, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">WARNING (W0017): Interactive</text> <text x="15" y="60">element containing aria-hidden</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 350px;
  padding-bottom: 80px;
}

input[aria-hidden=true] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-warning);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350px" height="80px" viewBox="0 0 350 80"><rect class="box" x="4" y="4" width="342" height="72" rx="12" ry="12" fill="rgba(255, 255, 216, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 255, 102, 0.999999)" /><g fill="rgba(133, 100, 4, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">WARNING (W0017): Interactive</text> <text x="15" y="60">element containing aria-hidden</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 350px;
  padding-bottom: 80px;
}

select[aria-hidden=true] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-warning);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350px" height="80px" viewBox="0 0 350 80"><rect class="box" x="4" y="4" width="342" height="72" rx="12" ry="12" fill="rgba(255, 255, 216, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 255, 102, 0.999999)" /><g fill="rgba(133, 100, 4, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">WARNING (W0017): Interactive</text> <text x="15" y="60">element containing aria-hidden</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 350px;
  padding-bottom: 80px;
}

textarea[aria-hidden=true] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-warning);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350px" height="80px" viewBox="0 0 350 80"><rect class="box" x="4" y="4" width="342" height="72" rx="12" ry="12" fill="rgba(255, 255, 216, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 255, 102, 0.999999)" /><g fill="rgba(133, 100, 4, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">WARNING (W0017): Interactive</text> <text x="15" y="60">element containing aria-hidden</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 350px;
  padding-bottom: 80px;
}

video[controls][aria-hidden=true] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-warning);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350px" height="80px" viewBox="0 0 350 80"><rect class="box" x="4" y="4" width="342" height="72" rx="12" ry="12" fill="rgba(255, 255, 216, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 255, 102, 0.999999)" /><g fill="rgba(133, 100, 4, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">WARNING (W0017): Interactive</text> <text x="15" y="60">element containing aria-hidden</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 350px;
  padding-bottom: 80px;
}

[role=button][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=combobox][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=link][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=menuitem][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=menuitemcheckbox][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=menuitemradio][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=option][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=scrollbar][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=searchbox][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=slider][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=spinbutton][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=switch][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=tab][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=radio][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=textbox][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[role=treeitem][aria-hidden=true]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0017): Interactive element containing aria-hidden" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

[autoplay] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-warning);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350px" height="80px" viewBox="0 0 350 80"><rect class="box" x="4" y="4" width="342" height="72" rx="12" ry="12" fill="rgba(255, 255, 216, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 255, 102, 0.999999)" /><g fill="rgba(133, 100, 4, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">WARNING (W0001): Media should</text> <text x="15" y="60">not autoplay.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 350px;
  padding-bottom: 80px;
}

[onclick]:not(a, button, [onkeydown], [onkeyup], [onkeypress])::after, [onclick][onkeyup]:not([tabindex], a, button)::after, [onclick][onkeyup][tabindex="-1"]:not(a, button)::after, [onclick][onkeydown]:not([tabindex], a, button)::after, [onclick][onkeydown][tabindex="-1"]:not(a, button)::after, [onclick][onkeypress]:not([tabindex], a, button)::after, [onclick][onkeypress][tabindex="-1"]:not(a, button)::after, [ondblclick]:not(a, button, [onkeydown], [onkeyup], [onkeypress])::after, [ondblclick][onkeyup]:not([tabindex], a, button)::after, [ondblclick][onkeyup][tabindex="-1"]:not(a, button)::after, [ondblclick][onkeydown]:not([tabindex], a, button)::after, [ondblclick][onkeydown][tabindex="-1"]:not(a, button)::after, [ondblclick][onkeypress]:not([tabindex], a, button)::after, [ondblclick][onkeypress][tabindex="-1"]:not(a, button)::after, [onmousedown]:not(a, button, [onkeydown], [onkeyup], [onkeypress])::after, [onmousedown][onkeyup]:not([tabindex], a, button)::after, [onmousedown][onkeyup][tabindex="-1"]:not(a, button)::after, [onmousedown][onkeydown]:not([tabindex], a, button)::after, [onmousedown][onkeydown][tabindex="-1"]:not(a, button)::after, [onmousedown][onkeypress]:not([tabindex], a, button)::after, [onmousedown][onkeypress][tabindex="-1"]:not(a, button)::after, [onmouseup]:not(a, button, [onkeydown], [onkeyup], [onkeypress])::after, [onmouseup][onkeyup]:not([tabindex], a, button)::after, [onmouseup][onkeyup][tabindex="-1"]:not(a, button)::after, [onmouseup][onkeydown]:not([tabindex], a, button)::after, [onmouseup][onkeydown][tabindex="-1"]:not(a, button)::after, [onmouseup][onkeypress]:not([tabindex], a, button)::after, [onmouseup][onkeypress][tabindex="-1"]:not(a, button)::after, [onmouseover]:not(a, button)::after, [onmouseenter]:not(a, button)::after, [onmouseleave]:not(a, button)::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0002): Potentially inaccessible click event used on non-clickable element. Ensure you have an accessible alternative." !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

head {
  display: block;
}

head meta[name=viewport][content*="maximum-scale=1" i], head meta[name=viewport][content*="user-scalable=no" i] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-warning);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="458px" height="80px" viewBox="0 0 458 80"><rect class="box" x="4" y="4" width="450" height="72" rx="12" ry="12" fill="rgba(255, 255, 216, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 255, 102, 0.999999)" /><g fill="rgba(133, 100, 4, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">WARNING (W0016): The display zoom/scale</text> <text x="15" y="60">has been disabled.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 458px;
  padding-bottom: 80px;
  display: block;
  border: 0;
}

h1[role=text]::after, h2[role=text]::after, h3[role=text]::after, h4[role=text]::after, h5[role=text]::after, h6[role=text]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0010): Using role='text' on a heading element causes it to lose semantic meaning for screen readers" !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

img[alt^="logo for" i], img[alt^="logo of" i], img[alt^="image of" i], img[alt^=bullet i], img[alt^="graphic of" i], img[alt$=logo i], img[alt$=graphic i], img[alt$=image i], img[alt$=".ivaf" i], img[alt$=".webp" i], img[alt$=".bmp" i], img[alt$=".svg" i], img[alt$=",jpeg" i], img[alt$=".jpg" i], img[alt$=".gif" i], img[alt$=".png" i], img[alt=" " i], img[alt="*" i], img[alt=graph i], img[alt=diagram i], img[alt=table i], img[alt=chart i], img[alt=blank i], img[alt=spacer i], img[alt=more i], img[alt=arrow i], img[alt=button i], img[alt=bullet i], img[alt=logo i], img[alt=artwork i], img[alt=painting i], img[alt=drawing i], img[alt=photograph i], img[alt=photo i], img[alt=graphic i], img[alt=image i] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-warning);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400px" height="80px" viewBox="0 0 400 80"><rect class="box" x="4" y="4" width="392" height="72" rx="12" ry="12" fill="rgba(255, 255, 216, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 255, 102, 0.999999)" /><g fill="rgba(133, 100, 4, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">WARNING (W0003): Alt text must</text> <text x="15" y="60">describe the content of the image.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 400px;
  padding-bottom: 80px;
}

img[longdesc] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-warning);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="450px" height="80px" viewBox="0 0 450 80"><rect class="box" x="4" y="4" width="442" height="72" rx="12" ry="12" fill="rgba(255, 255, 216, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 255, 102, 0.999999)" /><g fill="rgba(133, 100, 4, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">WARNING (W0015): longdesc attribute is</text> <text x="15" y="60">deprecated and should be avoided.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 450px;
  padding-bottom: 80px;
}

[style*="!important"]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0004): !important inline styles should be avoided." !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

*:not([role=text]) > em::after, *:not([role=text]) span::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0005): Text broken by <span> or <em> elements might need a [role='text'] attribute." !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

a[target=_blank]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0006): Links that open in a new tab or window should be communicated to the user, ensure the user knows of this behavior." !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

a[href="#"]::after, a[role=button]::after, a[href^="javascript:"]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0011): Anchor tags should not be used as buttons. Links should redirect to a resource/page, if they don't they probably should be buttons." !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

a[href$=".pdf"]::after, a[href$=".docx"]::after, a[href$=".doc"]::after, a[href$=".xlsx"]::after, a[href$=".xls"]::after, a[href$=".pptx"]::after, a[href$=".pptm"]::after, a[href$=".ppt"]::after, a[href$=".txt"]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0013): Anchor tags that contain a link to a PDF, Word, Excel, or PowerPoint document is present on the page and could be a potential accessibility issue." !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

a[href*="https://youtu.be"]::after, a[href*="https://youtube.com"]::after, a[href*="https://spotify.com/"]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0014): Anchor tags that contain a link to content site (Youtube, Spotify etc) is present on the document." !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

section:empty::before, section > :not(h1, h2, h3, h4, h5, h6, img):last-child::before {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0012): A <section> should contain a heading element." !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

section > :is(h1, h2, h3, h4, h5, h6) ~ :not(:is(h1, h2, h3, h4, h5, h6, img)):last-child::before {
  content: none !important;
}

[title]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0008): The title attribute has many accessibility concerns, consider using an alternative method." !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

u::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "WARNING (W0007): Using <u> element could be confused as a hyperlink, consider using a different element such as <em> or <b>." !important;
  color: var(--checka11y-text-warning);
  border: 0.4rem solid var(--checka11y-border-warning);
  background-color: var(--checka11y-bg-warning);
}

:root {
  --checka11y-text-error: #721c24;
  --checka11y-bg-error: #ffc6c6;
  --checka11y-border-error: #f00;
}

button audio[controls] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0000): Ensure that &lt;audio controls&gt; is</text> <text x="15" y="60">not a child of &lt;button&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

button button::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0000): Ensure that <button> is not a child of <button>." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

button details::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0000): Ensure that <details> is not a child of <button>." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

button embed {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350px" height="80px" viewBox="0 0 350 80"><rect class="box" x="4" y="4" width="342" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0000): &lt;embed&gt; cannot</text> <text x="15" y="60">be a child of &lt;button&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 350px;
  padding-bottom: 80px;
}

button iframe {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0000): Ensure that &lt;iframe&gt; is</text> <text x="15" y="60">not a child of &lt;button&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

button img[usemap] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0000): Ensure that &lt;img usemap&gt; is</text> <text x="15" y="60">not a child of &lt;button&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

button input:not([type=hidden]) {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0000): Ensure that &lt;input type="hidden"&gt;</text> <text x="15" y="60">is not a child of &lt;button&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

button label::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0000): Ensure that <label> is not a child of <button>." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

button object[usemap] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0000): Ensure that &lt;object usemap&gt; is</text> <text x="15" y="60">not a child of &lt;button&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

button select {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0000): Ensure that &lt;select&gt; is</text> <text x="15" y="60">not a child of &lt;button&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

button textarea {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0000): Ensure that &lt;textarea&gt; is</text> <text x="15" y="60">not a child of &lt;button&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

button video[controls] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0000): Ensure that &lt;video controls&gt; is</text> <text x="15" y="60">not a child of &lt;button&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

button:not([aria-label], [aria-labelledby]):empty::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0001): Ensure that <button> has meaningful content or is labelled appropriately." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

[dir]:not([dir=rtl], [dir=ltr], [dir=auto])::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0002): The dir attribute can only have the values, 'ltr', 'rtl' and 'auto'." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

head {
  display: block;
}

head title:empty {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="458px" height="80px" viewBox="0 0 458 80"><rect class="box" x="4" y="4" width="450" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0017): the page title tag must not</text> <text x="15" y="60">be empty.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 458px;
  padding-bottom: 80px;
  display: block;
  border: 0;
}

head:not(:has(title)) {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="458px" height="80px" viewBox="0 0 458 80"><rect class="box" x="4" y="4" width="450" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0018): a title tag must be present</text> <text x="15" y="60">in the page head.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 458px;
  padding-bottom: 80px;
  display: block;
  border: 0;
}

h1:empty::after, h2:empty::after, h3:empty::after, h4:empty::after, h5:empty::after, h6:empty::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0003): Headings must not be empty." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

h1[aria-hidden]::after, h2[aria-hidden]::after, h3[aria-hidden]::after, h4[aria-hidden]::after, h5[aria-hidden]::after, h6[aria-hidden]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0004): Headings should be reachable by assistive technologies (no aria-hidden)." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

h2 ~ h1:first-of-type::after, h2 ~ * h1:first-of-type::after, h3 ~ h2:first-of-type::after, h3 ~ * h2:first-of-type::after, h4 ~ h2:first-of-type::after, h4 ~ * h2:first-of-type::after, h5 ~ h2:first-of-type::after, h5 ~ * h2:first-of-type::after, h6 ~ h2:first-of-type::after, h6 ~ * h2:first-of-type::after, h4 ~ h3:first-of-type::after, h4 ~ * h3:first-of-type::after, h5 ~ h3:first-of-type::after, h5 ~ * h3:first-of-type::after, h6 ~ h3:first-of-type::after, h6 ~ * h3:first-of-type::after, h5 ~ h4:first-of-type::after, h5 ~ * h4:first-of-type::after, h6 ~ h4:first-of-type::after, h6 ~ * h4:first-of-type::after, h6 ~ h5:first-of-type::after, h6 ~ * h5:first-of-type::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0005): Headings should not skip levels." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

html:not([lang]) body::before {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0006): html has no lang attribute." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

html[lang=""] body::before {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0006): html lang attribute should not be empty." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

iframe:not([title]) {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350px" height="80px" viewBox="0 0 350 80"><rect class="box" x="4" y="4" width="342" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0007): All &lt;iframe&gt; must</text> <text x="15" y="60">have a title.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 350px;
  padding-bottom: 80px;
}

img:not([alt]) {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350px" height="80px" viewBox="0 0 350 80"><rect class="box" x="4" y="4" width="342" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0008): All &lt;img&gt; must</text> <text x="15" y="60">have alternative text.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 350px;
  padding-bottom: 80px;
}

img[longdesc$=".jpg" i], img[longdesc$=".jpeg" i], img[longdesc$=".png" i], img[longdesc$=".gif" i], img[longdesc$=".svg" i], img[longdesc$=".bmp" i], img[longdesc$=".tif" i], img[longdesc$=".tiff" i], img[longdesc$=".eps" i], img[longdesc$=".avif" i], img[longdesc$=".webp" i] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="450px" height="80px" viewBox="0 0 450 80"><rect class="box" x="4" y="4" width="442" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0015): longdesc attribute cannot</text> <text x="15" y="60">point to an image.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 450px;
  padding-bottom: 80px;
}

img[longdesc*=" "], img[longdesc=""] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="450px" height="80px" viewBox="0 0 450 80"><rect class="box" x="4" y="4" width="442" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0016): longdesc attribute should be</text> <text x="15" y="60">a valid URL instead of plain text.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 450px;
  padding-bottom: 80px;
}

a audio[controls] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0009): Ensure that &lt;audio controls&gt; is</text> <text x="15" y="60">not a child of &lt;a&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

a button::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0009): Ensure that <button> is not a child of <a>." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

a details::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0009): Ensure that <details> is not a child of <a>." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

a embed {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0009): Ensure that &lt;embed&gt; is</text> <text x="15" y="60">not a child of &lt;a&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

a iframe {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0009): Ensure that &lt;iframe&gt; is</text> <text x="15" y="60">not a child of &lt;a&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

a img[usemap] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0009): Ensure that &lt;img usemap&gt; is</text> <text x="15" y="60">not a child of &lt;a&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

a input:not([type=hidden]) {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0009): Ensure that &lt;input type="hidden"&gt; is</text> <text x="15" y="60">not a child of &lt;a&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

a label::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0009): Ensure that <label> is not a child of <a>." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

a object[usemap] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0009): Ensure that &lt;object usemap&gt; is</text> <text x="15" y="60">not a child of &lt;a&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

a select {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0009): Ensure that &lt;select&gt; is</text> <text x="15" y="60">not a child of &lt;a&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

a textarea {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0009): Ensure that &lt;textarea&gt; is</text> <text x="15" y="60">not a child of &lt;a&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

a video[controls] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="550px" height="80px" viewBox="0 0 550 80"><rect class="box" x="4" y="4" width="542" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0009): Ensure that &lt;video controls&gt; is</text> <text x="15" y="60">not a child of &lt;a&gt;.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 550px;
  padding-bottom: 80px;
}

a[href]:not([aria-label], [aria-labelledby]):empty::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0010): Ensure that <a> has meaningful content or is labelled appropriately." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

dl > *:not(dt, dd)::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0012): List markup invalid. Ensure that the only direct children of <dl> are <dt> and <dd>." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

ol > *:not(li, script, template)::after, ul > *:not(li, script, template)::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0011): List markup invalid. Ensure <li>, <script> or <template> are the only direct children of <ul> or <ol>." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

nav:not([aria-label], [aria-labelledby]) ~ nav::after, nav ~ nav:not([aria-label], [aria-labelledby])::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0013): <nav> indicates the primary navigation for the page. In cases where multiple primary navigations exist, an aria-label or aria-labelledby attribute must be present on both <nav> elements." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

a[href][tabindex="-1"]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0014): Ensure that <a> with an href attribute does not have a tab index of -1." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

area[href][tabindex="-1"] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400px" height="80px" viewBox="0 0 400 80"><rect class="box" x="4" y="4" width="392" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0014): Ensure that &lt;area&gt; with an</text> <text x="15" y="60">href attribute does not have a tab index of -1.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 400px;
  padding-bottom: 80px;
}

input:not([disabled])[tabindex="-1"] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400px" height="80px" viewBox="0 0 400 80"><rect class="box" x="4" y="4" width="392" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0014): Ensure that &lt;input&gt; that</text> <text x="15" y="60">is not disabled does not have a tab index of -1.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 400px;
  padding-bottom: 80px;
}

select:not([disabled])[tabindex="-1"] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400px" height="80px" viewBox="0 0 400 80"><rect class="box" x="4" y="4" width="392" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0014): Ensure that &lt;select&gt; that</text> <text x="15" y="60">is not disabled does not have a tab index of -1.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 400px;
  padding-bottom: 80px;
}

textarea:not([disabled])[tabindex="-1"] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400px" height="80px" viewBox="0 0 400 80"><rect class="box" x="4" y="4" width="392" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0014): Ensure that &lt;textarea&gt; that</text> <text x="15" y="60">is not disabled does not have a tab index of -1.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 400px;
  padding-bottom: 80px;
}

button:not([disabled])[tabindex="-1"]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0014): Ensure that <button> that is not disabled does not have a tab index of -1." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}

iframe[tabindex="-1"] {
  border: 0.4rem solid;
  border-color: var(--checka11y-border-error);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400px" height="80px" viewBox="0 0 400 80"><rect class="box" x="4" y="4" width="392" height="72" rx="12" ry="12" fill="rgba(255, 198, 198, 0.999999)" stroke-width="0.4rem" stroke="rgba(255, 0, 0, 0.999999)" /><g fill="rgba(114, 28, 36, 0.999999)" font-size="1rem" font-weight="700" font-family="verdana, geneva, tahoma, sans-serif" font-style="initial" letter-spacing="initial" text-decoration="none" text-transform="initial" text-shadow="none"><text x="15" y="35">ERROR (E0014): Ensure that &lt;iframe&gt;</text> <text x="15" y="60">does not have a tab index of -1.</text></g></svg>');
  background-position: bottom center;
  background-repeat: no-repeat;
  min-width: 400px;
  padding-bottom: 80px;
}

[contentEditable=true][tabindex="-1"]::after {
  display: block;
  font-size: 1rem;
  font-family: verdana, geneva, tahoma, sans-serif;
  font-weight: 700;
  font-style: initial;
  padding: var(--checka11y-space-4) var(--checka11y-space-6);
  border-radius: 0.75rem;
  letter-spacing: initial;
  text-decoration: none;
  text-transform: initial;
  text-shadow: none;
  content: "ERROR (E0014): Ensure that HTML elements with editable content don't have a tab index of -1." !important;
  color: var(--checka11y-text-error);
  border: 0.4rem solid var(--checka11y-border-error);
  background-color: var(--checka11y-bg-error);
}