@dso-toolkit/core 55.0.0 → 56.1.0

package/dist/collection/components/annotation-button/annotation-button.css

@@ -1,3 +1,1006 @@
+button {
+  -webkit-appearance: button;
+  color: inherit;
+  cursor: pointer;
+  font: inherit;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+  margin: 0;
+  overflow: visible;
+  text-transform: none;
+}
+button[disabled] {
+  cursor: default;
+}
+button::-moz-focus-inner {
+  border: 0;
+  padding: 0;
+}
+
+.btn {
+  display: inline-block;
+  font-size: 1em;
+  font-weight: 500;
+  margin-bottom: 0;
+  text-decoration: none;
+  touch-action: manipulation;
+  text-align: left;
+  user-select: none;
+  vertical-align: middle;
+}
+.btn:focus, .btn:focus-visible {
+  outline-offset: 2px;
+}
+.btn:active {
+  outline: 0;
+}
+.btn.extern::after, .btn.download::after {
+  content: "";
+  display: inline-block;
+  margin-left: 8px;
+}
+
+.btn-primary {
+  background-color: #39870c;
+  border-color: #39870c;
+  color: #fff;
+  border-width: 1px;
+  border-style: solid;
+  border-radius: 4px;
+  line-height: 1.5;
+  min-width: 56px;
+  padding: 11px 15px;
+  background-color: #b62f41;
+}
+.btn-primary:hover {
+  background-color: #275937;
+  border-color: #275937;
+  color: #fff;
+}
+.btn-primary:active {
+  background-color: #173521;
+  border-color: #173521;
+  color: #fff;
+}
+.btn-primary[disabled], .btn-primary[disabled]:hover {
+  background-color: #afcf9d;
+  border-color: #afcf9d;
+  color: #fff;
+}
+.btn-primary.btn-sm {
+  line-height: 1rem;
+}
+.btn-primary.btn-sm dso-icon,
+.btn-primary.btn-sm svg.di, .btn-primary.btn-sm.extern::after, .btn-primary.btn-sm.download::after, .btn-primary.btn-sm.dso-spinner::before {
+  margin-bottom: -4px;
+  margin-top: -4px;
+}
+.btn-primary.btn-sm.dso-spinner-left::before {
+  height: 16px;
+  width: 16px;
+}
+.btn-primary.btn-sm.dso-spinner-right::after {
+  height: 16px;
+  width: 16px;
+}
+.btn-primary dso-icon,
+.btn-primary svg.di {
+  margin-left: -8px;
+  margin-right: 8px;
+}
+.btn-primary span + dso-icon,
+.btn-primary span + svg.di {
+  margin-left: 8px;
+  margin-right: -8px;
+}
+.btn-primary.dso-spinner-left[disabled], .btn-primary.dso-spinner-right[disabled] {
+  background-color: #39870c;
+  border-color: #39870c;
+  color: #fff;
+}
+.btn-primary.dso-spinner-left::before {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+  margin-right: 8px;
+}
+.btn-primary.dso-spinner-right::after {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+  margin-left: 8px;
+}
+
+a.btn-primary {
+  text-decoration: none;
+  background-color: #b62f41;
+}
+a.btn-primary, a.btn-primary:visited {
+  color: #fff;
+}
+
+.btn-default {
+  background-color: #fff;
+  border-color: #39870c;
+  color: #39870c;
+  border-width: 1px;
+  border-style: solid;
+  border-radius: 4px;
+  line-height: 1.5;
+  min-width: 56px;
+  padding: 11px 15px;
+  background-color: #b62f41;
+}
+.btn-default:hover {
+  background-color: #39870c;
+  border-color: #39870c;
+  color: #fff;
+}
+.btn-default:active {
+  background-color: #275937;
+  border-color: #275937;
+  color: #fff;
+}
+.btn-default[disabled], .btn-default[disabled]:hover {
+  background-color: #fff;
+  border-color: #afcf9d;
+  color: #afcf9d;
+}
+.btn-default.btn-sm {
+  line-height: 1rem;
+}
+.btn-default.btn-sm dso-icon,
+.btn-default.btn-sm svg.di, .btn-default.btn-sm.extern::after, .btn-default.btn-sm.download::after, .btn-default.btn-sm.dso-spinner::before {
+  margin-bottom: -4px;
+  margin-top: -4px;
+}
+.btn-default.btn-sm.dso-spinner-left::before {
+  height: 16px;
+  width: 16px;
+}
+.btn-default.btn-sm.dso-spinner-right::after {
+  height: 16px;
+  width: 16px;
+}
+.btn-default dso-icon,
+.btn-default svg.di {
+  margin-left: -8px;
+  margin-right: 8px;
+}
+.btn-default span + dso-icon,
+.btn-default span + svg.di {
+  margin-left: 8px;
+  margin-right: -8px;
+}
+.btn-default.dso-spinner-left[disabled], .btn-default.dso-spinner-right[disabled] {
+  background-color: #fff;
+  border-color: #39870c;
+  color: #39870c;
+}
+.btn-default.dso-spinner-left::before {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+  margin-right: 8px;
+}
+.btn-default.dso-spinner-left:not([disabled]):hover::before {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+  margin-right: 8px;
+}
+.btn-default.dso-spinner-left:not([disabled]).btn-sm:hover::before {
+  height: 16px;
+  width: 16px;
+}
+.btn-default.dso-spinner-right::after {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+  margin-left: 8px;
+}
+.btn-default.dso-spinner-right:not([disabled]):hover::after {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+  margin-left: 8px;
+}
+.btn-default.dso-spinner-right:not([disabled]).btn-sm:hover::after {
+  height: 16px;
+  width: 16px;
+}
+
+a.btn-default {
+  text-decoration: none;
+  background-color: #b62f41;
+}
+a.btn-default, a.btn-default:visited {
+  color: #39870c;
+}
+a.btn-default:hover, a.btn-default:visited:hover {
+  color: #fff;
+}
+
+.btn-link {
+  border: 0;
+  color: #39870c;
+  line-height: 1;
+  padding: 0;
+  background-color: transparent;
+  background-color: #b62f41;
+}
+.btn-link[disabled] {
+  color: #afcf9d;
+}
+.btn-link[disabled].dso-spinner-left, .btn-link[disabled].dso-spinner-right {
+  color: #39870c;
+}
+.btn-link:not([disabled]):hover {
+  color: #275937;
+  text-decoration: underline;
+  text-underline-position: under;
+}
+.btn-link:not([disabled]):active {
+  color: #173521;
+}
+.btn-link.btn-align {
+  line-height: calc(1.5em - 1px);
+  padding: 11px 0;
+  position: relative;
+}
+.btn-link.dso-spinner-left::before {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: middle;
+  width: 24px;
+  margin-right: 8px;
+}
+.btn-link.dso-spinner-right::after {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: middle;
+  width: 24px;
+  margin-left: 8px;
+}
+.btn-link dso-icon + span:not(.sr-only),
+.btn-link svg.di + span:not(.sr-only),
+.btn-link span:not(.sr-only) + dso-icon,
+.btn-link span:not(.sr-only) + svg.di {
+  margin-left: 8px;
+}
+.btn-link svg.di.di-chevron-down + span:not(.sr-only),
+.btn-link svg.di.di-chevron-up + span:not(.sr-only),
+.btn-link span:not(.sr-only) + svg.di.di-chevron-down,
+.btn-link span:not(.sr-only) + svg.di.di-chevron-up {
+  margin-left: 4px;
+}
+.btn-link dso-icon[icon=chevron-left] + span:not(.sr-only),
+.btn-link dso-icon[icon=chevron-right] + span:not(.sr-only),
+.btn-link svg.di.di-angle-down + span:not(.sr-only),
+.btn-link svg.di.di-angle-up + span:not(.sr-only),
+.btn-link span:not(.sr-only) + svg.di.di-angle-down,
+.btn-link span:not(.sr-only) + svg.di.di-angle-up,
+.btn-link span:not(.sr-only) + dso-icon[icon=chevron-left],
+.btn-link span:not(.sr-only) + dso-icon[icon=chevron-right] {
+  margin-left: 0;
+}
+.btn-link dso-icon,
+.btn-link svg.di,
+.btn-link span {
+  vertical-align: middle;
+}
+
+a.btn-link {
+  text-decoration: none;
+  background-color: #b62f41;
+}
+a.btn-link, a.btn-link:visited {
+  color: #39870c;
+}
+
+.btn-block {
+  display: block;
+  width: 100%;
+}
+.btn-block + .btn-block {
+  margin-top: 5px;
+}
+
+input[type=submit].btn-block,
+input[type=reset].btn-block,
+input[type=button].btn-block {
+  width: 100%;
+}
+
+a.dso-primary,
+button.dso-primary,
+label.dso-primary {
+  display: inline-block;
+  font-size: 1em;
+  font-weight: 500;
+  margin-bottom: 0;
+  text-decoration: none;
+  touch-action: manipulation;
+  text-align: left;
+  user-select: none;
+  vertical-align: middle;
+  background-color: #39870c;
+  border-color: #39870c;
+  color: #fff;
+  border-width: 1px;
+  border-style: solid;
+  border-radius: 4px;
+  line-height: 1.5;
+  min-width: 56px;
+  padding: 11px 15px;
+}
+a.dso-primary:focus, a.dso-primary:focus-visible,
+button.dso-primary:focus,
+button.dso-primary:focus-visible,
+label.dso-primary:focus,
+label.dso-primary:focus-visible {
+  outline-offset: 2px;
+}
+a.dso-primary:active,
+button.dso-primary:active,
+label.dso-primary:active {
+  outline: 0;
+}
+a.dso-primary.extern::after, a.dso-primary.download::after,
+button.dso-primary.extern::after,
+button.dso-primary.download::after,
+label.dso-primary.extern::after,
+label.dso-primary.download::after {
+  content: "";
+  display: inline-block;
+  margin-left: 8px;
+}
+a.dso-primary:hover,
+button.dso-primary:hover,
+label.dso-primary:hover {
+  background-color: #275937;
+  border-color: #275937;
+  color: #fff;
+}
+a.dso-primary:active,
+button.dso-primary:active,
+label.dso-primary:active {
+  background-color: #173521;
+  border-color: #173521;
+  color: #fff;
+}
+a.dso-primary[disabled], a.dso-primary[disabled]:hover,
+button.dso-primary[disabled],
+button.dso-primary[disabled]:hover,
+label.dso-primary[disabled],
+label.dso-primary[disabled]:hover {
+  background-color: #afcf9d;
+  border-color: #afcf9d;
+  color: #fff;
+}
+a.dso-primary.btn-sm,
+button.dso-primary.btn-sm,
+label.dso-primary.btn-sm {
+  line-height: 1rem;
+}
+a.dso-primary.btn-sm dso-icon,
+a.dso-primary.btn-sm svg.di, a.dso-primary.btn-sm.extern::after, a.dso-primary.btn-sm.download::after, a.dso-primary.btn-sm.dso-spinner::before,
+button.dso-primary.btn-sm dso-icon,
+button.dso-primary.btn-sm svg.di,
+button.dso-primary.btn-sm.extern::after,
+button.dso-primary.btn-sm.download::after,
+button.dso-primary.btn-sm.dso-spinner::before,
+label.dso-primary.btn-sm dso-icon,
+label.dso-primary.btn-sm svg.di,
+label.dso-primary.btn-sm.extern::after,
+label.dso-primary.btn-sm.download::after,
+label.dso-primary.btn-sm.dso-spinner::before {
+  margin-bottom: -4px;
+  margin-top: -4px;
+}
+a.dso-primary.btn-sm.dso-spinner-left::before,
+button.dso-primary.btn-sm.dso-spinner-left::before,
+label.dso-primary.btn-sm.dso-spinner-left::before {
+  height: 16px;
+  width: 16px;
+}
+a.dso-primary.btn-sm.dso-spinner-right::after,
+button.dso-primary.btn-sm.dso-spinner-right::after,
+label.dso-primary.btn-sm.dso-spinner-right::after {
+  height: 16px;
+  width: 16px;
+}
+a.dso-primary dso-icon,
+a.dso-primary svg.di,
+button.dso-primary dso-icon,
+button.dso-primary svg.di,
+label.dso-primary dso-icon,
+label.dso-primary svg.di {
+  margin-left: -8px;
+  margin-right: 8px;
+}
+a.dso-primary span + dso-icon,
+a.dso-primary span + svg.di,
+button.dso-primary span + dso-icon,
+button.dso-primary span + svg.di,
+label.dso-primary span + dso-icon,
+label.dso-primary span + svg.di {
+  margin-left: 8px;
+  margin-right: -8px;
+}
+a.dso-primary.dso-spinner-left[disabled], a.dso-primary.dso-spinner-right[disabled],
+button.dso-primary.dso-spinner-left[disabled],
+button.dso-primary.dso-spinner-right[disabled],
+label.dso-primary.dso-spinner-left[disabled],
+label.dso-primary.dso-spinner-right[disabled] {
+  background-color: #39870c;
+  border-color: #39870c;
+  color: #fff;
+}
+a.dso-primary.dso-spinner-left::before,
+button.dso-primary.dso-spinner-left::before,
+label.dso-primary.dso-spinner-left::before {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+  margin-right: 8px;
+}
+a.dso-primary.dso-spinner-right::after,
+button.dso-primary.dso-spinner-right::after,
+label.dso-primary.dso-spinner-right::after {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+  margin-left: 8px;
+}
+a.dso-primary.download::after,
+button.dso-primary.download::after,
+label.dso-primary.download::after {
+  background: url("./dso-icons.svg#img-download-wit") no-repeat;
+  background-position: center;
+  background-size: cover;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+}
+a.dso-primary.extern::after,
+button.dso-primary.extern::after,
+label.dso-primary.extern::after {
+  background: url("./dso-icons.svg#img-external-link-wit") no-repeat;
+  background-position: center;
+  background-size: cover;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+}
+a.dso-secondary,
+button.dso-secondary,
+label.dso-secondary {
+  display: inline-block;
+  font-size: 1em;
+  font-weight: 500;
+  margin-bottom: 0;
+  text-decoration: none;
+  touch-action: manipulation;
+  text-align: left;
+  user-select: none;
+  vertical-align: middle;
+  background-color: #fff;
+  border-color: #39870c;
+  color: #39870c;
+  border-width: 1px;
+  border-style: solid;
+  border-radius: 4px;
+  line-height: 1.5;
+  min-width: 56px;
+  padding: 11px 15px;
+}
+a.dso-secondary:focus, a.dso-secondary:focus-visible,
+button.dso-secondary:focus,
+button.dso-secondary:focus-visible,
+label.dso-secondary:focus,
+label.dso-secondary:focus-visible {
+  outline-offset: 2px;
+}
+a.dso-secondary:active,
+button.dso-secondary:active,
+label.dso-secondary:active {
+  outline: 0;
+}
+a.dso-secondary.extern::after, a.dso-secondary.download::after,
+button.dso-secondary.extern::after,
+button.dso-secondary.download::after,
+label.dso-secondary.extern::after,
+label.dso-secondary.download::after {
+  content: "";
+  display: inline-block;
+  margin-left: 8px;
+}
+a.dso-secondary:hover,
+button.dso-secondary:hover,
+label.dso-secondary:hover {
+  background-color: #39870c;
+  border-color: #39870c;
+  color: #fff;
+}
+a.dso-secondary:active,
+button.dso-secondary:active,
+label.dso-secondary:active {
+  background-color: #275937;
+  border-color: #275937;
+  color: #fff;
+}
+a.dso-secondary[disabled], a.dso-secondary[disabled]:hover,
+button.dso-secondary[disabled],
+button.dso-secondary[disabled]:hover,
+label.dso-secondary[disabled],
+label.dso-secondary[disabled]:hover {
+  background-color: #fff;
+  border-color: #afcf9d;
+  color: #afcf9d;
+}
+a.dso-secondary.btn-sm,
+button.dso-secondary.btn-sm,
+label.dso-secondary.btn-sm {
+  line-height: 1rem;
+}
+a.dso-secondary.btn-sm dso-icon,
+a.dso-secondary.btn-sm svg.di, a.dso-secondary.btn-sm.extern::after, a.dso-secondary.btn-sm.download::after, a.dso-secondary.btn-sm.dso-spinner::before,
+button.dso-secondary.btn-sm dso-icon,
+button.dso-secondary.btn-sm svg.di,
+button.dso-secondary.btn-sm.extern::after,
+button.dso-secondary.btn-sm.download::after,
+button.dso-secondary.btn-sm.dso-spinner::before,
+label.dso-secondary.btn-sm dso-icon,
+label.dso-secondary.btn-sm svg.di,
+label.dso-secondary.btn-sm.extern::after,
+label.dso-secondary.btn-sm.download::after,
+label.dso-secondary.btn-sm.dso-spinner::before {
+  margin-bottom: -4px;
+  margin-top: -4px;
+}
+a.dso-secondary.btn-sm.dso-spinner-left::before,
+button.dso-secondary.btn-sm.dso-spinner-left::before,
+label.dso-secondary.btn-sm.dso-spinner-left::before {
+  height: 16px;
+  width: 16px;
+}
+a.dso-secondary.btn-sm.dso-spinner-right::after,
+button.dso-secondary.btn-sm.dso-spinner-right::after,
+label.dso-secondary.btn-sm.dso-spinner-right::after {
+  height: 16px;
+  width: 16px;
+}
+a.dso-secondary dso-icon,
+a.dso-secondary svg.di,
+button.dso-secondary dso-icon,
+button.dso-secondary svg.di,
+label.dso-secondary dso-icon,
+label.dso-secondary svg.di {
+  margin-left: -8px;
+  margin-right: 8px;
+}
+a.dso-secondary span + dso-icon,
+a.dso-secondary span + svg.di,
+button.dso-secondary span + dso-icon,
+button.dso-secondary span + svg.di,
+label.dso-secondary span + dso-icon,
+label.dso-secondary span + svg.di {
+  margin-left: 8px;
+  margin-right: -8px;
+}
+a.dso-secondary.dso-spinner-left[disabled], a.dso-secondary.dso-spinner-right[disabled],
+button.dso-secondary.dso-spinner-left[disabled],
+button.dso-secondary.dso-spinner-right[disabled],
+label.dso-secondary.dso-spinner-left[disabled],
+label.dso-secondary.dso-spinner-right[disabled] {
+  background-color: #fff;
+  border-color: #39870c;
+  color: #39870c;
+}
+a.dso-secondary.dso-spinner-left::before,
+button.dso-secondary.dso-spinner-left::before,
+label.dso-secondary.dso-spinner-left::before {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+  margin-right: 8px;
+}
+a.dso-secondary.dso-spinner-left:not([disabled]):hover::before,
+button.dso-secondary.dso-spinner-left:not([disabled]):hover::before,
+label.dso-secondary.dso-spinner-left:not([disabled]):hover::before {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+  margin-right: 8px;
+}
+a.dso-secondary.dso-spinner-left:not([disabled]).btn-sm:hover::before,
+button.dso-secondary.dso-spinner-left:not([disabled]).btn-sm:hover::before,
+label.dso-secondary.dso-spinner-left:not([disabled]).btn-sm:hover::before {
+  height: 16px;
+  width: 16px;
+}
+a.dso-secondary.dso-spinner-right::after,
+button.dso-secondary.dso-spinner-right::after,
+label.dso-secondary.dso-spinner-right::after {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+  margin-left: 8px;
+}
+a.dso-secondary.dso-spinner-right:not([disabled]):hover::after,
+button.dso-secondary.dso-spinner-right:not([disabled]):hover::after,
+label.dso-secondary.dso-spinner-right:not([disabled]):hover::after {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+  margin-left: 8px;
+}
+a.dso-secondary.dso-spinner-right:not([disabled]).btn-sm:hover::after,
+button.dso-secondary.dso-spinner-right:not([disabled]).btn-sm:hover::after,
+label.dso-secondary.dso-spinner-right:not([disabled]).btn-sm:hover::after {
+  height: 16px;
+  width: 16px;
+}
+a.dso-secondary.download::after,
+button.dso-secondary.download::after,
+label.dso-secondary.download::after {
+  background: url("./dso-icons.svg#img-download") no-repeat;
+  background-position: center;
+  background-size: cover;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+}
+a.dso-secondary.download:hover::after,
+button.dso-secondary.download:hover::after,
+label.dso-secondary.download:hover::after {
+  background-image: url("./dso-icons.svg#img-download-wit");
+}
+a.dso-secondary.download[disabled]::after,
+button.dso-secondary.download[disabled]::after,
+label.dso-secondary.download[disabled]::after {
+  background-image: url("./dso-icons.svg#img-download-grasgroen-40");
+}
+a.dso-secondary.extern::after,
+button.dso-secondary.extern::after,
+label.dso-secondary.extern::after {
+  background: url("./dso-icons.svg#img-external-link") no-repeat;
+  background-position: center;
+  background-size: cover;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+}
+a.dso-secondary.extern:hover::after,
+button.dso-secondary.extern:hover::after,
+label.dso-secondary.extern:hover::after {
+  background-image: url("./dso-icons.svg#img-external-link-wit");
+}
+a.dso-secondary.extern[disabled]::after,
+button.dso-secondary.extern[disabled]::after,
+label.dso-secondary.extern[disabled]::after {
+  background-image: url("./dso-icons.svg#img-external-link-grasgroen-40");
+}
+a.dso-tertiary,
+button.dso-tertiary,
+label.dso-tertiary {
+  display: inline-block;
+  font-size: 1em;
+  font-weight: 500;
+  margin-bottom: 0;
+  text-decoration: none;
+  touch-action: manipulation;
+  text-align: left;
+  user-select: none;
+  vertical-align: middle;
+  border: 0;
+  color: #39870c;
+  line-height: 1;
+  padding: 0;
+  background-color: transparent;
+}
+a.dso-tertiary:focus, a.dso-tertiary:focus-visible,
+button.dso-tertiary:focus,
+button.dso-tertiary:focus-visible,
+label.dso-tertiary:focus,
+label.dso-tertiary:focus-visible {
+  outline-offset: 2px;
+}
+a.dso-tertiary:active,
+button.dso-tertiary:active,
+label.dso-tertiary:active {
+  outline: 0;
+}
+a.dso-tertiary.extern::after, a.dso-tertiary.download::after,
+button.dso-tertiary.extern::after,
+button.dso-tertiary.download::after,
+label.dso-tertiary.extern::after,
+label.dso-tertiary.download::after {
+  content: "";
+  display: inline-block;
+  margin-left: 8px;
+}
+a.dso-tertiary[disabled],
+button.dso-tertiary[disabled],
+label.dso-tertiary[disabled] {
+  color: #afcf9d;
+}
+a.dso-tertiary[disabled].dso-spinner-left, a.dso-tertiary[disabled].dso-spinner-right,
+button.dso-tertiary[disabled].dso-spinner-left,
+button.dso-tertiary[disabled].dso-spinner-right,
+label.dso-tertiary[disabled].dso-spinner-left,
+label.dso-tertiary[disabled].dso-spinner-right {
+  color: #39870c;
+}
+a.dso-tertiary:not([disabled]):hover,
+button.dso-tertiary:not([disabled]):hover,
+label.dso-tertiary:not([disabled]):hover {
+  color: #275937;
+  text-decoration: underline;
+  text-underline-position: under;
+}
+a.dso-tertiary:not([disabled]):active,
+button.dso-tertiary:not([disabled]):active,
+label.dso-tertiary:not([disabled]):active {
+  color: #173521;
+}
+a.dso-tertiary.btn-align,
+button.dso-tertiary.btn-align,
+label.dso-tertiary.btn-align {
+  line-height: calc(1.5em - 1px);
+  padding: 11px 0;
+  position: relative;
+}
+a.dso-tertiary.dso-spinner-left::before,
+button.dso-tertiary.dso-spinner-left::before,
+label.dso-tertiary.dso-spinner-left::before {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: middle;
+  width: 24px;
+  margin-right: 8px;
+}
+a.dso-tertiary.dso-spinner-right::after,
+button.dso-tertiary.dso-spinner-right::after,
+label.dso-tertiary.dso-spinner-right::after {
+  background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  content: "";
+  display: inline-block;
+  height: 24px;
+  vertical-align: middle;
+  width: 24px;
+  margin-left: 8px;
+}
+a.dso-tertiary dso-icon + span:not(.sr-only),
+a.dso-tertiary svg.di + span:not(.sr-only),
+a.dso-tertiary span:not(.sr-only) + dso-icon,
+a.dso-tertiary span:not(.sr-only) + svg.di,
+button.dso-tertiary dso-icon + span:not(.sr-only),
+button.dso-tertiary svg.di + span:not(.sr-only),
+button.dso-tertiary span:not(.sr-only) + dso-icon,
+button.dso-tertiary span:not(.sr-only) + svg.di,
+label.dso-tertiary dso-icon + span:not(.sr-only),
+label.dso-tertiary svg.di + span:not(.sr-only),
+label.dso-tertiary span:not(.sr-only) + dso-icon,
+label.dso-tertiary span:not(.sr-only) + svg.di {
+  margin-left: 8px;
+}
+a.dso-tertiary svg.di.di-chevron-down + span:not(.sr-only),
+a.dso-tertiary svg.di.di-chevron-up + span:not(.sr-only),
+a.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-down,
+a.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-up,
+button.dso-tertiary svg.di.di-chevron-down + span:not(.sr-only),
+button.dso-tertiary svg.di.di-chevron-up + span:not(.sr-only),
+button.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-down,
+button.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-up,
+label.dso-tertiary svg.di.di-chevron-down + span:not(.sr-only),
+label.dso-tertiary svg.di.di-chevron-up + span:not(.sr-only),
+label.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-down,
+label.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-up {
+  margin-left: 4px;
+}
+a.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),
+a.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),
+a.dso-tertiary svg.di.di-angle-down + span:not(.sr-only),
+a.dso-tertiary svg.di.di-angle-up + span:not(.sr-only),
+a.dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,
+a.dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,
+a.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],
+a.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right],
+button.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),
+button.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),
+button.dso-tertiary svg.di.di-angle-down + span:not(.sr-only),
+button.dso-tertiary svg.di.di-angle-up + span:not(.sr-only),
+button.dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,
+button.dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,
+button.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],
+button.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right],
+label.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),
+label.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),
+label.dso-tertiary svg.di.di-angle-down + span:not(.sr-only),
+label.dso-tertiary svg.di.di-angle-up + span:not(.sr-only),
+label.dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,
+label.dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,
+label.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],
+label.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] {
+  margin-left: 0;
+}
+a.dso-tertiary dso-icon,
+a.dso-tertiary svg.di,
+a.dso-tertiary span,
+button.dso-tertiary dso-icon,
+button.dso-tertiary svg.di,
+button.dso-tertiary span,
+label.dso-tertiary dso-icon,
+label.dso-tertiary svg.di,
+label.dso-tertiary span {
+  vertical-align: middle;
+}
+a.dso-tertiary.extern::after, a.dso-tertiary.download::after,
+button.dso-tertiary.extern::after,
+button.dso-tertiary.download::after,
+label.dso-tertiary.extern::after,
+label.dso-tertiary.download::after {
+  position: relative;
+  top: -2px;
+}
+a.dso-tertiary.download::after,
+button.dso-tertiary.download::after,
+label.dso-tertiary.download::after {
+  background: url("./dso-icons.svg#img-download") no-repeat;
+  background-position: center;
+  background-size: cover;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+}
+a.dso-tertiary.download[disabled]::after,
+button.dso-tertiary.download[disabled]::after,
+label.dso-tertiary.download[disabled]::after {
+  background-image: url("./dso-icons.svg#img-download-grasgroen-40");
+}
+a.dso-tertiary.download:not([disabled]):hover::after, a.dso-tertiary.download:not([disabled]):active::after,
+button.dso-tertiary.download:not([disabled]):hover::after,
+button.dso-tertiary.download:not([disabled]):active::after,
+label.dso-tertiary.download:not([disabled]):hover::after,
+label.dso-tertiary.download:not([disabled]):active::after {
+  background-image: url("./dso-icons.svg#img-download-scampi");
+}
+a.dso-tertiary.extern::after,
+button.dso-tertiary.extern::after,
+label.dso-tertiary.extern::after {
+  background: url("./dso-icons.svg#img-external-link") no-repeat;
+  background-position: center;
+  background-size: cover;
+  height: 24px;
+  vertical-align: top;
+  width: 24px;
+}
+a.dso-tertiary.extern[disabled]::after,
+button.dso-tertiary.extern[disabled]::after,
+label.dso-tertiary.extern[disabled]::after {
+  background-image: url("./dso-icons.svg#img-external-link-grasgroen-40");
+}
+a.dso-tertiary.extern:not([disabled]):hover::after, a.dso-tertiary.extern:not([disabled]):active::after,
+button.dso-tertiary.extern:not([disabled]):hover::after,
+button.dso-tertiary.extern:not([disabled]):active::after,
+label.dso-tertiary.extern:not([disabled]):hover::after,
+label.dso-tertiary.extern:not([disabled]):active::after {
+  background-image: url("./dso-icons.svg#img-external-link-scampi");
+}
+
+a.dso-primary {
+  text-decoration: none;
+}
+a.dso-primary, a.dso-primary:visited {
+  color: #fff;
+}
+a.dso-secondary {
+  text-decoration: none;
+}
+a.dso-secondary, a.dso-secondary:visited {
+  color: #39870c;
+}
+a.dso-secondary:hover, a.dso-secondary:visited:hover {
+  color: #fff;
+}
+a.dso-tertiary {
+  text-decoration: none;
+}
+a.dso-tertiary, a.dso-tertiary:visited {
+  color: #39870c;
+}
+
+.btn:not(.dso-list-button) + .btn:not(.dso-list-button),
+.btn:not(.dso-list-button) + .dso-primary,
+.btn:not(.dso-list-button) + .dso-secondary,
+.btn:not(.dso-list-button) + .dso-tertiary,
+.dso-primary + .btn:not(.dso-list-button),
+.dso-primary + .dso-primary,
+.dso-primary + .dso-secondary,
+.dso-primary + .dso-tertiary,
+.dso-secondary + .btn:not(.dso-list-button),
+.dso-secondary + .dso-primary,
+.dso-secondary + .dso-secondary,
+.dso-secondary + .dso-tertiary,
+.dso-tertiary + .btn:not(.dso-list-button),
+.dso-tertiary + .dso-primary,
+.dso-tertiary + .dso-secondary,
+.dso-tertiary + .dso-tertiary {
+  margin-left: 16px;
+}
+
 dso-annotation-button {
   display: block;
+}
+
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  border: 0;
 }