spec-up-t 1.1.24 → 1.1.26

package/assets/css/index.css

@@ -1,1129 +1,48 @@
-:root {
-
-  --base-theme-color: 207, 71%;
-  --themed-element-bk: hsl(var(--base-theme-color), 40%);
-  --themed-element-text: #fff;
-  --themed-element-border: 1px solid hsl(var(--base-theme-color), 26%);
-  --themed-heading-text: hsl(var(--base-theme-color), 30%);
-
-  --no-color: 255, 255, 255;
-  --faint-color: 245, 245, 245;
-  --dim-color: 225, 225, 225;
-  --low-color: 200, 200, 200;
-  --mid-color: 100, 100, 100;
-  --high-color: 50, 50, 50;
-  --full-color: 0, 0, 0;
-  --active-color: #3aaaff;
-  --visited-color: rgb(188, 129, 255);
-  --green-status: rgb(0, 123, 9);
-  --light-green-status: rgb(0, 194, 13);
-
-
-  --page-bk: rgb(var(--no-color));
-  --page-text: rgb(var(--full-color));
-  --page-text-hover: rgb(var(--full-color));
-
-  --element-bk: rgb(var(--no-color));
-  --element-bk-hover: rgba(var(--low-color), 0.5);
-  --element-bk-transparent: rgba(var(--dim-color), 0.92);
-  --element-border: rgba(var(--high-color), 0.4);
-  --element-border-focus: rgb(var(--full-color), 0.75);
-  --element-border-radius: 3px;
-  --element-shadow-low: 0 1px 3px 0px rgba(0, 0, 0, 0.25);
-  --element-shadow-mid: 0 1px 3px 0px rgba(0, 0, 0, 0.35);
-  --element-shadow-high: 0 1px 5px 0px rgba(0, 0, 0, 0.45);
-
-  --code-bk: #1a1e23;
-
-  --input-bk: rgba(var(--dim-color), 0.6);
-  --input-border: rgba(var(--high-color), 0.4);
-
-  /* --header-height: 3.5em; */
-  --header-height: 48px;
-  --header-bk: rgba(var(--low-color), 0.985);
-  --header-text: rgb(var(--full-color));
-  --header-border: rgba(var(--full-color), 0.1);
-  --header-border-inverse: rgba(var(--no-color), 0.3);
-
-  --text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
-
-  --svg-size: 2vw;
-
-  --font-size: 14px;
-}
-
-/* This CSS code targets any element that is the target of a fragment identifier (i.e., an element with an ID that matches the hash in the URL). It sets the scroll-margin property to ensure that the element is scrolled into view with a margin at the top. The margin is calculated as the value of the custom property --header-height divided by 0.3,
-with no margin on the right, bottom, or left. This is useful for ensuring that the target element is not obscured by a fixed header when scrolled into view. Keyword: anchor */
 *:target {
-  scroll-margin: calc(var(--header-height) / 0.3) 0 0;
+  /* scroll-margin-top: 160px; */
+  scroll-margin-top: calc(50vh);
+  /* Matches sticky header height */
 }
 
 body:not([hashscroll]) *:target {
-  animation: highlight 1.5s 0.25s ease;
-}
-
-body {
-  margin: 0;
-  padding: 0;
-  font-family: Heebo, san-serif;
-  line-height: 1.5em;
-  widows: 2;
-  orphans: 2;
-  word-wrap: break-word;
-  overflow-wrap: break-word;
-  color: black;
-  word-spacing: 1px;
-  counter-reset: h2 toc1;
-}
-
-h1 {
-  font-size: 2em;
-  font-weight: bold;
-  line-height: 1.2em;
-}
-
-h2 {
-  margin: 1.5em 0 1em;
-}
-
-blockquote {
-  position: relative;
-  padding: 0;
-  margin: 1.75em 0.75em;
-  color: rgb(var(--mid-color));
-  background: rgb(var(--faint-color));
-}
-
-blockquote:before,
-blockquote:after {
-  content: "“";
-  position: absolute;
-  top: 0.065em;
-  left: 0.065em;
-  font-size: 3em;
-  height: 0.34em;
-  line-height: 100%;
-  color: rgb(var(--low-color));
-}
-
-blockquote:after {
-  content: "”";
-  top: auto;
-  left: auto;
-  bottom: 0.065em;
-  right: 0.065em;
-  text-align: center;
-}
-
-blockquote>p {
-  padding: 0.6em 1.8em 0.5em 1.8em;
-}
-
-strong strong {
-  font-size: 0.9em;
-  color: #b30032;
-  font-weight: normal;
-  text-transform: uppercase;
-}
-
-main article>ol,
-main article>ul {
-  padding: 0 0 0 2em;
-}
-
-main article h1,
-main article h2,
-main article h3,
-main article h4,
-main article h5,
-main article h6 {
-  color: var(--themed-heading-text);
-}
-
-main article h2,
-main article h3,
-main article h4 {
-  display: flex;
-  font-weight: 500;
-}
-
-main article h2 {
-  counter-reset: h3 h4;
-}
-
-main article h3 {
-  counter-reset: h4;
-}
-
-main article h2:after {
-  counter-increment: h2;
-  content: counter(h2) ".";
-  padding: 0 0.4em 0 0.2em;
-  order: -1;
-}
-
-main article h3:after {
-  counter-increment: h3;
-  content: counter(h2) "." counter(h3);
-  padding: 0 0.45em 0 0.2em;
-  order: -1;
-}
-
-main article h4:after {
-  counter-increment: h4;
-  content: counter(h2) "." counter(h3) "." counter(h4);
-  padding: 0 0.5em 0 0.2em;
-  order: -1;
-}
-
-h1 .toc-anchor {
-  display: none;
-}
-
-.toc-anchor {
-  margin: -0.1em 0 0;
-  font-size: 0.875em;
-  color: inherit;
-  text-decoration: none;
-  opacity: 0.35;
-  order: -1;
-  transition: opacity 0.3s ease;
-}
-
-.toc-anchor:hover {
-  opacity: 1;
-}
-
-pre {
-  overflow: auto;
-}
-
-code {
-  padding: 0.085em 0.3em 0.1em;
-  font-size: 1.075em;
-  color: #c7001c;
-  vertical-align: middle;
-  background: #f0f0f0;
-  border-radius: 4px;
-}
-
-pre code {
-  background: unset;
-  padding: unset;
-  border-radius: unset;
-}
-
-h1 code,
-h2 code,
-h3 code,
-h4 code,
-h5 code,
-h6 code {
-  font-size: 1.25em;
-  margin: -0.11em 0.3em 0 0;
-  border-radius: 3px;
-}
-
-ol,
-ul {
-  margin: 0;
-  padding: 0 0 0 1.2em;
-}
-
-/* START: Definition list for terms */
-dl.terms-and-definitions-list {
-  margin: 0;
-  padding: 0;
-}
-
-dl.terms-and-definitions-list>dt {
-  font-weight: bold;
-  margin: 0;
-  background-color: #f0f0f0;
-  border: 1px solid #ccc;
-  padding: 10px;
-  border-radius: 5px 5px 0 0;
-}
-
-dl.terms-and-definitions-list>dd {
-  margin: 0;
-  background-color: #f9f9f9;
-  border: 1px solid #ccc;
-  border-top: none;
-  padding: 0.5em 2em;
-  /* margin-left: 20px; */
-  border-bottom: none;
-  /* Remove bottom borders for all dd's by default */
-}
-
-dl.terms-and-definitions-list dd p {
-  margin: 0;
+  animation: highlight-target 3.5s 0.25s ease;
 }
 
-/* Remove borders between consecutive <dd> elements */
-dl.terms-and-definitions-list dd+dd {
-  border-bottom: none;
-}
-
-/* Add a margin between the last <dd> and the next <dt> */
-dl.terms-and-definitions-list dd+dt {
-  margin-top: 2em;
-}
-
-dl.terms-and-definitions-list dd.last-dd {
-  border-radius: 0 0 5px 5px;
-  border-bottom: 1px solid #ccc;
-}
-
-/* END: Definition list for terms */
-
-
-main {
-  box-sizing: border-box;
-  float: right;
-  width: 75%;
-  min-width: calc(100% - 325px);
-  max-width: calc(100% - 275px);
-  padding: 0.5em 2em 1.5em 2em;
-  background: #fff;
-  box-shadow: 0px 0px 5px -1px rgba(0, 0, 0, 0.3);
-}
-
-table {
-  display: block;
-  width: -webkit-fill-available;
-  width: fit-content;
-  max-width: 100%;
-  margin: 1.5em 0 1.75em;
-  border-spacing: 0;
-  border-collapse: collapse;
-  overflow-x: auto;
-  word-wrap: normal;
-  overflow-wrap: normal;
-  hyphens: manual;
-}
-
-thead tr th {
-  color: var(--themed-element-text);
-  background: var(--themed-element-bk);
-  border: var(--themed-element-border);
-  text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
-}
-
-tr {
-  border-top: 1px solid #cccccc;
-  background-color: white;
-  margin: 0;
-  padding: 0;
-}
-
-tr:nth-child(2n) {
-  background-color: #f0f0f0;
-}
-
-tr th {
-  font-weight: normal;
-  border: 1px solid #cccccc;
-  text-align: left;
-  margin: 0;
-  padding: 6px 13px;
-}
-
-td,
-th {
-  padding: 9px 13px;
-  border: 1px solid #d8d8d8;
-}
-
-tr td {
-  border: 1px solid #ccc;
-  text-align: left;
-  margin: 0;
-  padding: 0.55em 0.75em 0.55em;
-}
-
-tr th :first-child,
-tr td :first-child {
-  margin-top: 0;
-}
-
-tr th :last-child,
-tr td :last-child {
-  margin-bottom: 0;
-}
-
-table pre[class*="language-"] {
-  border: none;
-  border-radius: 0;
-}
-
-table pre[class*="language-"]:before {
-  display: none;
+body:not([hashscroll]) dt:has(:target) {
+  animation: highlight-target-parent-dt 3.5s 0.25s ease;
 }
 
 svg[icon] {
   width: 1.25em;
   height: 1.25em;
   vertical-align: text-top;
-  pointer-events: none;
-}
-
-article p>img {
-  max-width: 100%;
-  margin: 0 auto;
-}
-
-article li {
-  margin-top: 0.4em;
-}
-
-/* Custom Elements */
-
-slide-panel>*:not(header):not(footer) {
-  flex: 1;
-}
-
-/* Code Examples */
-
-:not(pre)>code[class*="language-"],
-pre[class*="language-"] {
-  padding: 0.65em 0.8em 0.8em;
-  background: var(--code-bk);
-}
-
-/* Tooltips */
-
-.tippy-box {
-  box-shadow: var(--element-shadow-mid);
-}
-
-.tippy-box a {
-  color: var(--active-color);
-}
-
-.tippy-box a:visited {
-  color: var(--visited-color);
-}
-
-.tippy-content {
-  padding: 0.55em 0.55em 0.5em;
-}
-
-.tippy-content header {
-  margin: 0 0 0.4em;
-  padding: 0.15em 0.3em 0.1em;
-  border-radius: 2px;
-  background: rgba(255, 255, 255, 0.1);
-  text-shadow: 0 1px rgba(0, 0, 0, 0.9);
-}
-
-.tippy-content table,
-.tippy-content tbody,
-.tippy-content tr,
-.tippy-content td {
-  margin: 0;
-  padding: 0;
-  border: none;
-  border-spacing: 0;
-  border-collapse: collapse;
-  background: none !important;
-  background-color: transparent !important;
-}
-
-.tippy-content table {
-  margin: 0 0.3em;
-}
-
-.tippy-content td {
-  font-size: 0.9em;
-  padding: 0.2em 0 0;
-}
-
-.tippy-content td:first-child {
-  padding-right: 0.5em;
-}
-
-
-/*******************/
-
-a[path-0$="github.com"]:before {
-  content: "\f09b";
-  color: var(--page-text);
-  margin: 0 0.25em 0 0;
-  font-family: 'FontAwesome';
-  text-decoration: none;
-  display: inline-block;
-  vertical-align: bottom;
-}
-
-a[path-0$="github.com"][path-3="issues"][path-4],
-a[path-0$="github.com"][path-3="projects"],
-a[path-0$="github.com"][path-3="releases"],
-a[path-0$="github.com"][path-3="pull"] {
-  text-decoration: none;
-}
-
-a[path-0$="github.com"][path-3="issues"][path-4] span,
-a[path-0$="github.com"][path-3="projects"] span,
-a[path-0$="github.com"][path-3="releases"] span,
-a[path-0$="github.com"][path-3="pull"] span {
-  display: none;
-}
-
-a[path-0$="github.com"][path-3="issues"][path-4]:after {
-  content: "Issue #" attr(path-4);
-}
-
-a[path-0$="github.com"][path-3="pull"]:after {
-  content: "Pull Request #" attr(path-4);
-}
-
-a[path-0$="github.com"][path-3="releases"][path-5]:after {
-  content: "Release " attr(path-5);
-}
-
-a[path-0$="github.com"][path-3="projects"]:after {
-  content: "Project #" attr(path-4);
-}
-
-[issue-count]:after {
-  content: "Issues (" attr(issue-count) ")";
-  margin: 0 0 0 0.3em;
-  padding: 0.1em 0 0;
-}
-
-[issue-count=""][animate] {
-  display: none;
-  opacity: 0;
-}
-
-[issue-count][animate]:not([issue-count=""]) {
-  animation: display-show 1s;
-}
-
-[panel-toggle] {
-  cursor: pointer;
-}
-
-.panel-header {
-  display: flex;
-  align-items: center;
-  height: var(--header-height);
-}
-
-.panel-header>* {
-  display: flex;
-  height: 100%;
-  padding: 0.1em 0.8em 0;
-  align-items: center;
-}
-
-
-.slide-panel {
-  width: calc(100% - 1em);
-  max-width: 475px;
-  transition: transform 0.35s ease;
-}
-
-.slide-panel[panel-open] {
-  transform: translateX(0%);
-}
-
-.notice {
-  margin: 1em 0;
-  padding: 0.5em 0.9em 0.55em 0.65em;
-  border-left: .5em solid;
-}
-
-.notice p {
-  margin: 0.4em 0 0;
-}
-
-.note {
-  background: #E9FBE9;
-  border-color: #52E052;
-}
-
-.note .notice-link {
-  display: block;
-  color: #178217;
-}
-
-.issue {
-  background: rgb(233, 240, 251);
-  border-color: rgb(82, 127, 224);
-}
-
-.issue .notice-link:before {
-  display: block;
-  color: rgb(30, 76, 174);
-}
-
-.warning {
-  background: #FBE9E9;
-  border-color: #E05252;
-}
-
-.warning .notice-link {
-  display: block;
-  color: #AE1E1E;
-}
-
-.example {
-  color: #cebe00;
-  background: #1a1e23;
-  border-left: 0.5em solid;
-}
-
-.example .notice-link {
-  display: block;
-  color: inherit;
-  font-size: 1.1em;
-  font-family: Heebo, san-serif;
-}
-
-.example pre[class*="language-"] {
-  padding: 0;
-  border-radius: 0;
-}
-
-.todo {
-  background: #fbe4ff;
-  border-color: #9700e2;
-}
-
-.todo .notice-link {
-  display: block;
-  color: #6d00a2;
-}
-
-.mermaid {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  margin: 1.5em 0 1.75em;
-}
-
-/* Spec References */
-
-.reference-list {
-  margin: 0;
-  padding: 0;
-  list-style: none;
-}
-
-.reference-list dd a,
-.reference-status {
-  font-style: italic;
-}
-
-.reference-status {
-  color: var(--green-status);
-}
-
-.tippy-box .reference-status {
-  color: var(--light-green-status);
-}
-
-/* Terminology References */
-
-pre,
-code[class*="language-"],
-pre[class*="language-"] {
-  font-size: 0.9em;
-  margin: 1em 0 1.5em;
-  border-radius: 3px;
-}
-
-.example pre,
-.example code[class*="language-"],
-.example pre[class*="language-"] {
-  margin: 0;
-}
-
-#svg {
-  display: none;
-}
-
-#header {
-  position: sticky;
-  position: -webkit-sticky;
-  padding: 0;
-  top: 0;
-  margin: -0.5em -2em 0em -2em;
-  background: rgba(255, 255, 255, 0.9);
-  border-bottom: 1px solid rgba(0, 0, 0, 0.175);
-  box-shadow: 0px 1px 3px 1px rgba(0, 0, 0, 0.1);
-  z-index: 2;
-}
-
-#logo {
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  height: 100%;
-  padding: 0.5em;
-}
-
-#logo+span {
-  margin-left: auto;
-}
-
-#logo img {
-  width: 100px;
-}
-
-/* Small devices (landscape phones, 576px and up) */
-@media (min-width: 576px) {
-  /* Keep this and use when more items are added to this header */
-  /* .panel-header#header {
-    flex-wrap: nowrap;
-    height: var(--header-height);
-  } */
-
-  #logo {
-    width: auto;
-  }
-}
-
-#header #toc_toggle {
-  display: none;
-  padding: 0 1em;
-  border-right: 1px solid rgba(0, 0, 0, 0.15);
-}
-
-#content {
-  max-width: 800px;
-}
-
-#content h1:first-of-type {
-  margin: 1em 0 0.5em;
-}
-
-#content h1:first-of-type .markdownIt-Anchor {
-  display: none;
-}
-
-#repo_issues {
-  width: calc(100% - 1.5em);
-  max-width: 450px;
-  border-left: 1px solid rgba(0, 0, 0, 0.15);
-}
-
-#repo_issues>header {
-  background: #eee;
-  border-bottom: 1px solid #ddd;
-}
-
-#repo_issues>header span:first-of-type {
-  font-weight: bold;
-  padding-top: 0.1em;
-}
-
-#repo_issues>header .repo-issue-toggle {
-  margin-left: auto;
-  color: inherit;
-  font-weight: bold;
-  text-decoration: none;
-}
-
-#repo_issue_list {
-  list-style: none;
-  margin: 0;
-  padding: 0 1.25em 1.25em;
-  font-size: 0.85em;
-  overflow: auto;
-  -ms-overflow-style: none;
-  /* Internet Explorer 10+ */
-  scrollbar-width: none;
-  /* Firefox */
-}
-
-#repo_issue_list::-webkit-scrollbar {
-  display: none;
-  /* Safari and Chrome */
-}
-
-#repo_issue_list:empty:before {
-  content: "No issues found";
-  display: block;
-  text-align: center;
-  font-size: 1.1em;
-  color: #aaa;
-  margin: 1em 0 0;
-}
-
-.repo-issue detail-box {
-  display: flex;
-  flex-direction: column;
-  padding: 1em 0;
-  border-bottom: 1px solid #ddd;
-}
-
-.repo-issue detail-box>section {
-  order: 1;
-}
-
-.repo-issue detail-box>section:empty+.repo-issue-title [detail-box-toggle] {
-  display: none;
-}
-
-.repo-issue-title {
-  display: flex;
-  align-items: center;
-}
-
-.repo-issue-link {
-  flex: 1;
-  margin: 0 0 0 0.5em;
-}
-
-.repo-issue-number {
-  height: 1em;
-  margin: 0 0.4em 0 0;
-  padding: 0.3em 0.25em 0;
-  border-radius: 3px;
-  font-weight: bold;
-  background: #eee;
-  border: 1px solid #ddd;
-  text-align: center;
-  line-height: 1em;
-}
-
-.repo-issue-number:before {
-  content: "#";
-  font-weight: normal;
-  margin: 0 0.1em 0 0;
-}
-
-.repo-issue [detail-box-toggle] {
-  margin: 0 0 0 1em;
-  opacity: 0.35;
-  transition: opacity 0.4s;
-}
-
-.repo-issue [detail-box-toggle]:hover,
-.repo-issue detail-box[open] [detail-box-toggle] {
-  opacity: 1;
-}
-
-#toc {
-  display: flex;
-  flex-direction: column;
-  width: 25%;
-  max-width: 325px;
-  min-width: 275px;
-  background: #eceff1;
-}
-
-#toc header {
-  color: var(--themed-element-text);
-  background: var(--themed-element-bk);
-  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
-  border: var(--themed-element-border);
-  border-top: none;
-  border-left: none;
-}
-
-#toc header [panel-toggle] {
-  display: none;
-  height: var(--header-height);
-  line-height: var(--header-height);
-  margin-left: auto;
-  padding: 0 1em;
-  color: inherit;
-  font-weight: bold;
-  text-decoration: none;
-}
-
-#toc_list {
-  flex: 1;
-  padding: 1em 0.8em;
-  overflow: auto;
-}
-
-.toc {
-  padding: 0 0 1.75em;
-  font-size: 0.85em;
-}
-
-.toc,
-.toc ul {
-  margin: 0;
-  list-style: none;
 }
 
-.toc ul {
-  padding: 0 0 0 1em;
-}
-
-.toc a {
-  display: block;
-  padding: 0.4em 0.3em 0.225em;
-  text-decoration: none;
-  border-radius: 3px;
-  color: #333;
-}
-
-.toc a:before {
-  color: #000;
-  font-weight: bold;
-}
-
-.toc a:hover {
-  text-shadow: 0px 1px 1px #fff;
-  background: rgba(0, 0, 0, 0.1);
-}
-
-.toc>li a:before {
-  counter-increment: toc1;
-  content: counter(toc1) ".";
-  padding: 0 0.4em 0 0.2em;
-}
-
-.toc>li>ul {
-  counter-reset: toc2;
-}
-
-.toc>li>ul>li a:before {
-  counter-increment: toc2;
-  content: counter(toc1) "." counter(toc2);
-  padding: 0 0.45em 0 0.2em;
-}
-
-.toc>li>ul ul {
-  counter-reset: toc3;
-}
-
-.toc>li>ul ul li a:before {
-  counter-increment: toc3;
-  content: counter(toc1) "." counter(toc2) "." counter(toc3);
-  padding: 0 0.5em 0 0.2em;
-}
-
-@media (min-width: 900px) {
-
-  slide-panel {
-    z-index: 2;
-  }
-
-  #slidepanels[open="sidebar"]:before {
-    opacity: 0;
-    transition: none;
-    pointer-events: none;
-  }
-
-  #slidepanels:before {
-    z-index: 1;
-  }
-
-  #toc {
-    transition: none;
-    transform: translate3d(0%, 0%, 0);
-    box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.15) inset;
-    z-index: 0;
-  }
-}
-
-@media (max-width: 900px) {
-
-  main {
-    width: 100%;
-    min-width: auto;
-    max-width: none;
-    padding: 0.5em 1.25em 1.5em 1.25em;
-  }
-
-  #header {
-    margin: -0.5em -1.25em 0em -1.25em;
-  }
-
-  #toc header [panel-toggle] {
-    display: block;
-  }
-
-  #header #toc_toggle {
-    display: flex;
-  }
-}
-
-@media (max-width: 550px) {
-
-  td {
-    font-size: 0.8em;
-  }
-
-}
-
-@keyframes display-show {
-  0% {
-    display: none;
-    opacity: 0;
-  }
-
-  1% {
-    display: block;
-  }
-
-  100% {
-    opacity: 1;
+@keyframes highlight-target {
+  50% {
+    background-color: yellow;
   }
 }
-
-@keyframes highlight {
+@keyframes highlight-target-parent-dt {
   50% {
     background-color: yellow;
+    border: 1px solid rgb(0, 200, 255);
   }
 }
 
-/**
-* External Links
-  https://christianoliff.com/blog/styling-external-links-with-an-icon-in-css/
-*/
-article a[href^="http"]:not(.btn)::after,
-article a[href^="https://"]:not(.btn)::after {
-  content: '';
-  width: 12px;
-  height: 12px;
-  margin-left: 4px;
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z'/%3E%3Cpath fill-rule='evenodd' d='M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'/%3E%3C/svg%3E");
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: contain;
-  display: inline-block;
-}
-
-/**
-* End External Links
-*/
-
-.btn,
-.no-xref-found-message {
-  font-variant: small-caps;
-  text-transform: uppercase;
-}
-
-.no-xref-found-message {
-  background: #f8c481 !important;
-  color: #03365f !important;
-  margin: 0 0.5em;
-  padding: 0 0.8em;
-  border-radius: 0.25rem;
-  font-size: 0.8rem;
-}
-
-.snapshots,
-.powered-by {
-  /* padding: 1em 0.8em 0.5em; */
-  margin: 0;
-  padding: 0;
-  flex: none;
-}
-
-.powered-by {
-  /* margin: 0;
-  padding: 0; */
-  text-align: center;
-  font-size: 0.7em;
-}
-
-
-.snapshots a {
-  display: block;
-  margin: 0.5em;
-  padding: 0.5em 0.8em;
-  border-radius: 0.25rem;
-  background: #A9DDE0;
-  color: #03365f;
-  text-decoration: none;
-  font-size: 1rem;
-}
-
-/* Transclusions */
-
-.transcluded-xref-term {
-  background: #a9dde03b !important;
-  padding: 0.5em;
-  margin: 1em 0;
-}
-
-.transclusion-heading {
-  font-size: 1.3em;
-  font-weight: bold;
-  margin: 1em 0 0.5em;
-}
-
-dl img {
-  max-width: 15px;
-  vertical-align: middle;
-}
-
-
-dd table {
-  margin: 0;
-  font-size: 0.9em;
-}
-
-dd table th {
+#svg {
   display: none;
 }
 
-dd table td, dd table th {
-  padding: 0.2em;
-}
-
-
-/* End Transclusions */
-
-
-
-/* Loader styling */
-.loader {
-  width: 20px;
-  height: 20px;
-  margin: auto;
-  display: block;
-  text-align: center;
-  border: 8px solid #ccc;
-  border-top-color: #3498db;
-  border-radius: 50%;
-  animation: spin 1s linear infinite;
-}
 
-.loadertext {
-  text-align: center;
-  margin: 0.5em 0;
-}
-
-/* Animation keyframes */
-@keyframes spin {
-  0% {
-    transform: rotate(0deg);
-  }
-
-  100% {
-    transform: rotate(360deg);
-  }
-}
-
-/* End Loader styling */
-
-/* Search and Alphabet index */
-#terminology-section-utility-container {
-  background: #ffffff84;
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-  margin: 1em auto;
-  padding: 0;
-  width: 100%;
+main * {
+  word-break: break-all;
+  /* Breaks at any character */
+  /* OR */
+  overflow-wrap: break-word;
+  /* Breaks only at allowed break points, more browser support */
 }
 
-/* Small devices (landscape phones, 576px and up) */
-@media (min-width: 576px) {
-  #terminology-section-utility-container {
-    position: sticky;
-    top: 3em;
-  }
-}
-/* End Search and Alphabet index */
+dd td img {
+  max-width: 30px;
+}