:root {
  /* Fonts */
  --font-family: 'Verdana', sans-serif;
  --font-family-secondary: 'Verdana', sans-serif;
  --font-weight-regular: 400;
  --font-weight-semi-bold: 600;
  --font-weight-medium: 500;
  --font-weight-bold: 700;
  --font-size-14: 14px / 16px var(--font-family);
  --font-size-16: 16px / 20px var(--font-family);
  --font-size-18: max(16px, min(2vw, 18px)) / max(22px, min(2vw, 26px)) var(--font-family);
  --font-size-24: max(18px, min(3vw, 24px)) / max(21px, min(3vw, 30px)) var(--font-family);
  --font-size-32: max(18px, min(4vw, 32px)) / max(21px, min(4vw, 38px)) var(--font-family);
  --font-size-48: max(24px, min(5vw, 48px)) / max(30px, min(5vw, 60px)) var(--font-family);
}

/** umb_name:Yvirskrift */

h1 {
  font: max(1.5rem, min(5vw, 3rem)) / max(1.875rem, min(5vw, 3.75rem)) 'Verdana', sans-serif;
  font: var(--font-size-48);
  font-weight: 600;
  font-weight: var(--font-weight-semi-bold);
  font-family: 'Verdana', sans-serif;
  font-family: var(--font-family-secondary);
}

/** umb_name:Undiryvirskrift */

h2 {
  font: max(1.125rem, min(4vw, 2rem)) / max(1.3125rem, min(4vw, 2.375rem)) 'Verdana', sans-serif;
  font: var(--font-size-32);
  font-weight: 600;
  font-weight: var(--font-weight-semi-bold);
  font-size: 1.5rem;
  line-height: 1.8125rem;
}

/** umb_name:Undiryvirskrift 2 */

h3 {
  font: max(1.125rem, min(3vw, 1.5rem)) / max(1.3125rem, min(3vw, 1.875rem)) 'Verdana', sans-serif;
  font: var(--font-size-24);
  font-weight: 700;
  font-weight: var(--font-weight-bold);
  line-height: 1.6875rem;
}

/** umb_name:Tekstur */

p {
  margin: 0;
  font: max(1rem, min(2vw, 1.125rem)) / max(1.375rem, min(2vw, 1.625rem)) 'Verdana', sans-serif;
  font: var(--font-size-18);
  font-weight: 400;
  font-weight: var(--font-weight-regular);
}

p + p {
  padding-top: 40px;
}

.editor h1 {
  margin-bottom: 35px;
}

:not(#tinymce):not(.editor) > h1 {
  margin-top: 0;
}

:not(#tinymce):not(.editor) > h2 {
  margin-top: 0;
}

:not(#tinymce):not(.editor) > h3 {
  margin-top: 0;
}

:not(#tinymce):not(.editor) > h5 {
  margin-top: 0;
}

:not(#tinymce):not(.editor) > h4 {
  margin-top: 0;
}

:not(#tinymce):not(.editor) > h6 {
  margin-top: 0;
}

[data-ani] {
  --delay: 0ms;
  --time: 400ms;
  --timing: ease;
  --distance: 100;

  opacity: 0;
  transition: opacity 400ms ease, transform 400ms ease;
  transition: opacity var(--time) var(--timing), transform var(--time) var(--timing);
  animation-fill-mode: both;
}

[data-ani-init='true'][data-ani][data-ani-run='true'], [data-ani-init='true'][data-ani*='fade'][data-ani-run='true'] {
      transform: translateY(0);
      opacity: 1;
      transition-delay: var(--delay);
    }

[data-ani-init='true'][data-ani='fade-left'] {
    transform: matrix(1, 0, 0, 1, var(--distance), 0);
  }

[data-ani-init='true'][data-ani='fade-right'] {
    transform: matrix(1, 0, 0, 1, calc(-1 * var(--distance)), 0);
  }

[data-ani-init='true'][data-ani='fade-up'] {
    transform: matrix(1, 0, 0, 1, 0, var(--distance));
  }

[data-ani-init='true'][data-ani='fade-up-right'] {
    transform: matrix(1, 0, 0, 1, calc(-1 * var(--distance)), var(--distance));
  }

[data-ani-init='true'][data-ani='fade-up-left'] {
    transform: matrix(1, 0, 0, 1, var(--distance), var(--distance));
  }

.umbraco-forms-indicator {
  color: red;
}

.umbraco-forms-field {
  margin-bottom: 20;
}

.umbraco-forms-navigation .btn
{
  padding: 5px 10px;
  color: #fff;
  background-color: #000;
  border: 0;
  cursor: pointer;
}

#layout {
  background-color: #fff;
}

#layout > * {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;

  }

#layout > *:first-child {
      margin-top: 40px;
    }

#layout > *:last-child {
      margin-bottom: 40px;
    }

:root {
  /* Colors */
  --color-white: white;
  --color-black: black;

  /* Color intentions */
  --color-background: var(--color-white);
  --color-font: var(--color-black);
  --color-font-reverse: var(--color-white);

  /* Sizes */
  --side-padding: 15px;

  /* Widths */
  --page-width-large: min(1300px, calc(100vw - var(--side-padding) * 2));

  /* Z-Indexes */
  --z-index-header: 1000;
}

body {
  display: grid;
  grid-template-rows: auto 1fr auto;
  max-width: 100vw;

  /* Sticky footer */
  min-height: 100vh;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  color: black;
  color: var(--color-font);
  font-family: 'Verdana', sans-serif;
  font-family: var(--font-family);
  background: white;
  background: var(--color-background);
}

body > main, body > .main {
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

.skip-link {
  position: absolute;
  top: -3em;
  background: #fff;
}

.skip-link:focus {
  top: 0;
}

:focus-visible {
  outline: 1px solid currentcolor;
}

/* Helper rules */

.max-lines {
  --max-lines: 3;

  /* stylelint-disable-next-line value-no-vendor-prefix */
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  -webkit-line-clamp: var(--max-lines);
}

.visually-hidden:not(:focus):not(:active) {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  white-space: nowrap;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
          clip-path: inset(50%);
}

/* Icons */

.c-icon {
  --icon-url: url('');
  --icon-color: currentcolor;
  --icon-size: 16px;

  display: block;
  width: 16px;
  width: var(--icon-size);
  min-width: 16px;
  min-width: var(--icon-size);
  height: 16px;
  height: var(--icon-size);
  min-height: 16px;
  min-height: var(--icon-size);
  background-color: currentcolor;
  background-color: var(--icon-color);
  -webkit-mask-image: url('');
          mask-image: url('');
  -webkit-mask-image: var(--icon-url);
          mask-image: var(--icon-url);
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
}

.c-icon.example {
    --icon-url: url('/images/icons/example.svg');
  }

.c-popup {
  --outside-padding: 5vw;
  --max-card-width: 1098px;
  --max-card-height: calc(100vh - 100px);
  --card-padding-vertical: var(--gap-64, 64px);
  --card-padding-horizontal: var(--gap-64, 64px);

  position: fixed;
  z-index: 99999;
  display: grid;
  width: 100vw;
  height: 100vh;
  padding: 5vw;
  padding: var(--outside-padding);
  background-color: rgba(0, 0, 0, 0.75);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 1;
}

.c-popup .wrapper {
    width: calc(100vw - (var(--outside-padding) * 2));
    width: calc(100vw - calc(var(--outside-padding) * 2));
    max-width: var(--max-card-width);
    max-height: var(--max-card-height);
    padding: var(--card-padding-vertical) var(--card-padding-horizontal);
    overflow: auto;
    background-color: white;
    border-radius: 13px;
    transform: scale(1);
    align-self: center;
    justify-self: center;
    place-self: center;
  }

.c-popup.closed {
    animation: fade-out 500ms cubic-bezier(0.5, 0, 0.14, 1.32) 1 forwards;
    pointer-events: none;
  }

.c-popup.closed > .wrapper {
      animation: scale-down 500ms cubic-bezier(0.5, 0, 0.14, 1.32) 1 forwards;
    }

.c-popup:not(.c-popup.closed) {
    animation: fade-in 500ms cubic-bezier(0.5, 0, 0.14, 1.32) 1 forwards;
  }

.c-popup:not(.c-popup.closed) > .wrapper {
      animation: scale-up 500ms cubic-bezier(0.5, 0, 0.14, 1.32) 1 forwards;
    }

@keyframes fade-out {

  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes fade-in {

  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes scale-up {

  0% {
    transform: scale(25%);
  }

  100% {
    transform: scale(100%);
  }
}

@keyframes scale-down {

  0% {
    transform: scale(100%);
  }

  100% {
    transform: scale(50%);
  }
}

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

.editor * { margin: 0; margin: initial; }

html, body { scroll-behavior: smooth; }

html {
  -webkit-text-size-adjust: none;
     -moz-text-size-adjust: none;
          text-size-adjust: none;
  line-height: normal;
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  background-color: #000;
}

img, svg, video, canvas, audio, iframe, embed, object {
  display: block;
  max-width: 100%;
}

img, svg, video, canvas { height: auto; }

picture { display: contents; }

source { display: none; }

img {
  -o-object-fit: cover;
     object-fit: cover;
  border-style: none;
}

audio:not([controls]) { display: none; }

audio { width: 100%; }

input, button, textarea, select { font: inherit; }

p, h1, h2, h3, h4, h5, h6 { word-wrap: break-word; }

h1 {
  margin: 0.67em 0;
  font-size: 2rem;
}

h2 { font-size: 1.5rem; }

h3 { font-size: 1.17rem; }

h4 { font-size: 1rem; }

h5 { font-size: 0.83rem; }

h6 { font-size: 0.67rem; }

pre { white-space: pre-wrap; }

hr {
  height: 0;
  overflow: visible;
  color: inherit;
  border-style: solid;
  border-width: 1px 0 0;
}

[hidden] {
  display: none !important;
}

/* Browser fixes */

summary::-webkit-details-marker {
  display: none;
  width: 0;
  height: 0;
  margin-right: 0;
}

[data-slider-init] {
  --button-width: 40px;
  --button-height: 40px;
  --previous-arrow-color: white;
  --next-arrow-color: white;

  position: relative;
  width: inherit;
}

[data-slider-init] .slides {
    display: flex;
    height: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    scrollbar-width: none; /* Firefox */
  }

[data-slider-init] .slides::-webkit-scrollbar {
      display: none; /* Chrome, Safari, Opera */
    }

[data-slider-init] .slides, [data-slider-init] .slides > .slide {
      width: inherit;
      margin: 0;
      padding: 0;
      list-style-type: none;
    }

[data-slider-init] .slides .slide {
      flex: 0 0 100%;
      width: 100%;
      height: 100%;
      scroll-snap-align: center;
      scroll-snap-stop: always;
    }

.c-block-grid {
  display: grid;
  grid-auto-rows: minmax(50px, min-content);
  grid-auto-flow: row;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  grid-template-columns: repeat(var(--c-block-grid-columns, 1), minmax(0, 1fr));
  width: 80vw;
  max-width: 100%;
  margin: auto;
  grid-column-gap: 0;
  grid-column-gap: var(--c-block-grid-column-gap, 0);
  -moz-column-gap: 0;
       column-gap: 0;
  -moz-column-gap: var(--c-block-grid-column-gap, 0);
       column-gap: var(--c-block-grid-column-gap, 0);
  grid-row-gap: 0;
  grid-row-gap: var(--c-block-grid-row-gap, 0);
  row-gap: 0;
  row-gap: var(--c-block-grid-row-gap, 0);
}

nav.breadcrumbs {
  margin-bottom: 20px;
  color: gray;
  font-size: 0.75rem;
  line-height: 0.625rem;
  background: none;
  border: 0;
}

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

nav.breadcrumbs li {
    display: inline;
  }

nav.breadcrumbs li a {
      color: inherit;
      font-family: 'Verdana', sans-serif;
      font-family: var(--font-family);
      -webkit-text-decoration: none;
      text-decoration: none;
    }

nav.breadcrumbs li a:hover {
        -webkit-text-decoration: underline;
        text-decoration: underline;
      }

nav.breadcrumbs li + li::before {
      display: inline-block;
      height: 0.8em;
      margin: 0 0.25em;
      border-right: 0.1em solid currentcolor;
      transform: rotate(15deg);
      content: '';
    }

nav.breadcrumbs a[aria-current='page'] {
    font-weight: 700;
    font-weight: var(--font-weight-bold);
  }

body > footer {
  display: flex;
  justify-content: space-evenly;
  height: 100vh;
  min-height: 250px;
  max-height: max(30vh, 250px);
  padding: 40px var(--margin-medium);
  color: white;
  color: var(--color-font-reverse);
  background: #000;
  padding-top: 30px;
}

body > footer > div {
    box-sizing: border-box;
    max-width: 1200px;
    padding: 0 20px;
    width: 100%;
  }

.c-404-not-found {
  margin: 40px auto;
  padding: 0 20px;
}

body > header {
  display: flex;
  align-items: center;
  width: 100vw;
  height: 100px;
  background-color: #fff;
}

body > header div.wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 1200px;
    max-width: var(--width-max, 1200px);
    height: 100%;
    margin: auto;
    padding: 0 20px;
  }

body > header div.wrapper nav {
      z-index: 1000;
    }

body > header .logo {
    color: #000;
    font-weight: bold;
    font-size: 1.875rem;
    -webkit-text-decoration: none;
    text-decoration: none;
  }

body > header .sections-picker {
    position: absolute;
    top: 0;
    right: 20px;
    display: flex;
    margin-top: 5px;
  }

body > header .sections-picker a {
      color: inherit;
      font-weight: bold;
      font-size: 0.75rem;
      line-height: 0.75rem;
      -webkit-text-decoration: none;
      text-decoration: none;
    }

body > header .sections-picker a.active {
        -webkit-text-decoration: underline;
        text-decoration: underline;
      }

body > header .sections-picker a + a {
        margin-left: 10px;
        padding-left: 10px;
        border-left: solid 1px #000;
      }

button[type='button'].hamburger-icon {
  display: none;
}

/* Narrow viewport specific styles */

@media screen and (max-width: 1050px) {
  /* Hamburger button */
  button[type='button'].hamburger-icon {
    position: relative;
    display: inline;
    display: initial;
    width: 40px;
    height: 40px;
    font-size: 0;
    background: transparent;
    border: 0;
    cursor: pointer;
  }

    button.hamburger-icon[type='button'] .hamburger {
      position: absolute;
      top: 0;
      left: 0;
      display: inline-block;
      width: 40px;
      height: 40px;
      color: #fff;
      background-repeat: no-repeat;
      background-position: center center;
      background-size: 40px;
      opacity: 0;
      transition: opacity 200ms ease-out;
    }

    button.hamburger-icon[type='button'] .passive {
      background-image: url('/images/icons/hamburger.svg');
    }

    button.hamburger-icon[type='button']:not(.active) .passive {
      opacity: 1;
    }

    button.hamburger-icon[type='button'] .open {
      background-image: url('/images/icons/hamburger.svg');
    }

    button.hamburger-icon.active[type='button'] .open {
      opacity: 1;
    }
}

.c-menu {
  list-style-type: none;

  /* Narrow-viewport specific styles */
}

@media screen and (max-width: 1050px) {

.c-menu {
    --top-spacing: 100px;
    --background-color: #000;
    --link-font: var(--font-size-24);
    --link-color: #fff;
    --item-padding: 24px;
    --item-inset: 25px;
    --item-bottom-border: 1px solid #fff;
    --show-more-icon: url('/images/icons/arrow.svg');
    --show-more-icon-size: 15px;
    --show-more-icon-click-size: 40px;
    --show-more-icon-inset: 18px;
    --show-more-border-left: 1px solid #fff;
    --current-page-background: #000;
    --active-background: #000;
}

    .c-menu, .c-menu * {
      opacity: 1;
      transition: all 200ms ease-in-out /* Transition everything */
    }

    .c-menu.main {
      position: absolute;
      top: var(--top-spacing);
      left: 0;
      display: flex;
      flex-direction: column;
      width: 100vw;
      min-height: 100vh;
      background-color: var(--background-color);
      transform-origin: top;
    }

      .c-menu.main ol {
        height: 100%;
        max-height: 100%;
      }

    .c-menu li {
      color: var(--link-color);
      font: var(--link-font);
      list-style: none;
    }

      .c-menu li div {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        height: 100%;
        border-bottom: var(--item-bottom-border);
      }

        .c-menu li div a {
          display: block;
          width: inherit;
          padding: var(--item-padding);
          color: inherit;
          font: inherit;
          font-weight: bold;
          text-decoration: inherit;
        }

          .c-menu li div a[aria-current='page'] {
            background-color: var(--current-page-background);
          }

        .c-menu li div button {
          position: relative;
          width: var(--show-more-icon-click-size);
          height: var(--show-more-icon-click-size);
          margin: 0 var(--show-more-icon-inset) 0 0;
          padding: var(--item-padding);
          padding-right: var(--show-more-icon-inset);
          padding-bottom: 0;
          padding-left: var(--show-more-icon-inset);
          padding-left: 40px;
          font-size: 0;
          background: transparent;
          border: 0;
          border-left: var(--show-more-border-left);
        }

          .c-menu li div button .triangle {
            position: absolute;
            top: 0;
            left: 0;
            display: inline-block;
            width: calc(var(--show-more-icon-click-size) - var(--show-more-icon-inset));
            height: calc(var(--show-more-icon-click-size) - var(--show-more-icon-inset));
            margin: calc(var(--show-more-icon-inset) / 2);
            margin-left: 25px;
            color: #fff;
            background-image: var(--show-more-icon);
            background-repeat: no-repeat;
            background-position: center center;
            background-size: var(--show-more-icon-size);
            transition: all 200ms ease-out;
          }

      .c-menu li li > div > a { padding-left: calc(var(--item-inset) * 2); }

      .c-menu li li li > div > a { padding-left: calc(var(--item-inset) * 3); }

      .c-menu li li li li > div > a { padding-left: calc(var(--item-inset) * 4); }

      .c-menu li li li li li > div > a { padding-left: calc(var(--item-inset) * 5); }

      .c-menu li li li li li li > div > a { padding-left: calc(var(--item-inset) * 6); }

      .c-menu li.active > div > button.triangle-icon .triangle {
        transform: rotate(90deg);
        transform-origin: center;
      }

      .c-menu li.active:not(.pactive) {
        background-color: var(--active-background);
      }

        .c-menu li.active:not(.pactive) > div > a {
          -webkit-text-decoration: underline;
          text-decoration: underline;
        }

        .c-menu li:not(.c-menu li.active) ol {
          max-width: none;
          max-width: initial;
          max-height: 0;
          transform: scaleY(0%);
          transform-origin: top;
        }

          .c-menu li:not(.c-menu li.active) ol > li {
            background-color: transparent;
            transform: scaleY(0%);
            transform-origin: top;
            opacity: 0;
          }

            .c-menu li:not(.c-menu li.active) ol > li > div {
              background: transparent;
            }

              .c-menu li:not(.c-menu li.active) ol > li > div > * {
                height: 0;
                padding: 0;
                opacity: 0;
              }

    .c-menu.main:not(.c-menu.main.active) {
      transform: scaleY(0%);
      transform-origin: top;
      opacity: 0;
    }

      .c-menu.main:not(.c-menu.main.active) ol {
        height: 0;
      }

      .c-menu.main:not(.c-menu.main.active) li {
        display: none;
        padding: 0;
        background-color: transparent;
        opacity: 0;
      }
  }

@media screen and (min-width: 1051px) {

.c-menu {
    display: flex;
    gap: 50px;
}

      .c-menu li > div a {
        display: block;
        width: inherit;
        color: inherit;
        font: inherit;
        font-weight: bold;
        text-decoration: inherit;
      }

        .c-menu li > div a:hover {
          -webkit-text-decoration: underline;
          text-decoration: underline;
        }

      .c-menu li button {
        display: none;
      }

      .c-menu li ol {
        display: none;
      }
  }

.c-pager {
  width: 100%;
  max-width: min(1300px, calc(100vw - 15px * 2));
  max-width: var(--page-width-large);
  margin: max(15px, min(8vw, 107px)) auto 50px;
}

.c-pager > .items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(345px, min(1300px, calc(100vw - 15px * 2))), 393px));
    grid-template-columns: repeat(auto-fit, minmax(min(345px, var(--page-width-large)), 393px));
    grid-gap: max(30px, min(6vw, 43px)) 60px;
    gap: max(30px, min(6vw, 43px)) 60px;
    justify-content: center;
    width: 100%;
    margin-bottom: 66px;
  }

.c-pagination {
  display: flex;
  margin: 80px auto 0;
  align-content: center;
  justify-content: center;
  place-content: center;
}

.c-pagination a, .c-pagination button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 29px;
    height: 29px;
    color: inherit;
    font: 1rem / 1.25rem 'Verdana', sans-serif;
    font: var(--font-size-16);
    font-weight: 400;
    font-weight: var(--font-weight-regular);
    text-align: center;
    -webkit-text-decoration: none;
    text-decoration: none;
    background-color: transparent;
    border: none;
    cursor: pointer;
    transition: 100ms ease-in;
    transition-property: color background-color;
  }

.c-pagination a:first-child, .c-pagination button:first-child, .c-pagination a:last-child, .c-pagination button:last-child {
      display: inline-flex;
      font-size: 0;
    }

.c-pagination a:first-child .c-icon, .c-pagination button:first-child .c-icon, .c-pagination a:last-child .c-icon, .c-pagination button:last-child .c-icon {
        --size: 16px;
        --url: url('/images/icons/arrow.svg');

        margin: auto;
        background-color: black;
        background-color: var(--color-black);
        transition: 100ms ease-in;
        transition-property: color background-color;
      }

.c-pagination a:first-child .c-icon, .c-pagination button:first-child .c-icon {
        transform: rotate(180deg);
      }

.c-pagination a:hover, .c-pagination button:hover {
      color: white;
      color: var(--color-white);
      background-color: black;
      background-color: var(--color-black);
    }

.c-pagination a:hover .c-icon, .c-pagination button:hover .c-icon {
        background-color: white;
        background-color: var(--color-white);
      }

.c-pagination a[aria-current='page'], .c-pagination button[aria-current='page'], .c-pagination a[aria-current='current'], .c-pagination button[aria-current='current'], .c-pagination a[aria-current='active'], .c-pagination button[aria-current='active'] {
      color: white;
      color: var(--color-white);
      background-color: var(--color-blue);
    }

.c-pagination a.inactive, .c-pagination button.inactive {
      opacity: 0;
      pointer-events: none;
    }

.c-tabs {
  margin-bottom: 80px;

}

.c-tabs [role='tablist'] {
    display: flex;
    flex-wrap: wrap;
  }

.c-tabs [role='tab'] {
    padding: max(16px, min(3vw, 22px)) max(22px, min(3vw, 30px)) max(16px, min(3vw, 24px)) max(22px, min(3vw, 30px));
    font-weight: 600;
    font-weight: var(--font-weight-semi-bold, 600);
    font-size: max(1.125rem, min(3vw, 1.5rem));
    text-align: left;
    background-color: #e8eaf0;
    border: none;
    cursor: pointer;
    transition: background-color 150ms ease;
  }

.c-tabs [role='tab'] .label span {
      word-wrap: anywhere;
    }

.c-tabs [role='tab'][aria-selected='true'] {
      background-color: white;
      background-color: var(--color-white, #fff);
    }

.c-tabs .panels-wrapper {
    display: grid;
    grid-template: 'panels' 100%;
  }

.c-tabs [role='tabpanel'] {
    grid-area: panels;
    height: max-content;
    background-color: white;
    background-color: var(--color-white, #fff);
    transition: opacity 150ms ease;
  }

.c-tabs [role='tabpanel'][aria-hidden='true'] {
      opacity: 0;
      pointer-events: none;

    }

.c-tabs [role='tabpanel'] .content {
      /* For the example */
      width: 100%;
      height: 500px;
      background-color: grey;
    }

.c-block-grid-item {
  grid-row: span 1;
  grid-row: span var(--c-block-grid-item-row-span, 1);
  grid-column:
    span min(
      calc(1 * 3),
      var(--c-block-grid-columns)
    );
  grid-column:
    span min(
      calc(var(--c-block-grid-item-column-span, 1) * 3),
      var(--c-block-grid-columns)
    );
  min-height: 100px;

  background-color: bisque;
  border: solid 2px pink;
}

@media screen and (min-width: 1024px) {

.c-block-grid-item {
    grid-column:
      span min(
        1,
        var(--c-block-grid-columns)
      );
    grid-column:
      span min(
        var(--c-block-grid-item-column-span, 1),
        var(--c-block-grid-columns)
      );
}
  }

.c-member-login {
  max-width: 450px;
  margin: 40px auto;
    padding: 20px;
}

.c-member-login p {
    margin-bottom: 20px;
    font-size: 1rem;
  }

.c-member-login label {
    display: block;
    margin-bottom: 15px;
    font-weight: bold;
  }

.c-member-login input[type=email] {
    display: block;
    box-sizing: border-box;
    width: 100%;
    max-width: 300px;
    height: 40px;
    margin: 0.5em 0;
    margin-right: 0;
    padding: 0 10px;
    font-weight: normal;
    font-size: 1rem;
    font-family: inherit;
    line-height: 2.5rem;
    border: 1px solid #bbb;
  }

.c-member-login .code {
    margin-top: 8px;
    overflow: hidden;
    width: 340px;
  }

.c-member-login .code div {
      position: sticky;
      left: 0;
    }

.c-member-login .code input {
      border: none !important;
      outline: none !important;
    }

.c-member-login .code input {
      position: relative;
      z-index: 1;
      width: 420px;
      min-width: 420px;
      height: 50px;
      line-height: 3.0625rem;
      padding-left: 16px;
      margin: 0;
      box-sizing: border-box;
      background: transparent;
      letter-spacing: 3.02rem;
      font-size: 1rem;

      background-image: linear-gradient(to left, aliceblue 70%, rgba(255, 255, 255, 0) 0%);
      background-position: bottom;
      background-size: 58px 50px;
      background-repeat: repeat-x;
      background-position-x: 40px;

      font-family: monospace;
      text-transform: uppercase;
    }

.c-member-login button {
    width: 100%;
    max-width: 100px;
    margin-top: 10px;
    padding: 10px 20px;
    color: #fff;
    font-weight: bold;
    border: 0;
    cursor: pointer;
    background-color: #000;
  }

.c-member-login button:disabled {
      opacity: 0.3;
    }

.c-member-login .errors {
    display: none;
  }

.c-member-login .errors.active {
      display: block;
      margin-bottom: 15px;
      padding: 8px 15px;
      color: #721c24;
      font-size: 1rem;
      line-height: 1.375rem;
      text-indent: 0;
      background-color: #f8d7da;
      border: solid 1px #f5c6cb;
      border-radius: 5px;
    }