details.additional-information { padding: var(--padding-half); }
details.additional-information summary {
  font-size: var(--font-m);
}
details.additional-information ul > li {
  font-size: var(--font-m);
  margin: var(--margin-m) 0 var(--margin-m) var(--margin-l);
}
@keyframes fade-out-to-below {
  from { transform: translateY(0); opacity: 1; }
  to { transform: translateY(50%); opacity: 0; }
}
@keyframes fade-in-from-above {
  from { transform: translateY(-50%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

@keyframes fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
#store-badges {
  grid-template-columns: 1fr 1fr;
  gap: var(--grid-gap);
}

#store-badges a {
  justify-content: center;
  align-items: center;
}

#store-badges a img {
  height: 74px;
}
.bank-transfer-in dl > div {

}

div.transfer-field {
  display: grid;
  grid-template-columns: 3fr 1fr;
  padding: var(--padding) 0;
  border-bottom: 1px solid #000;
}

.bank-transfer-in dl div > * {
  grid-column: 1;
}

.bank-transfer-in dt,
.bank-transfer-in dd {
  font-size: var(--font-l);
}

.bank-transfer-in dt.text-s,
.bank-transfer-in dd.text-s {
  font-size: var(--font-s);
}

.bank-transfer-in dl dd {
  margin: 0;
  font-weight: 600;
}

.bank-transfer-in dl div > button {
  grid-column: 2;
  justify-self: flex-end;
  height: min-content;
  width: min-content;
}

.bank-transfer-in dl div > p {
  font-size: var(--font-s);
}
button,
.button,
.button[type="submit"] {
  display: inline-block;
  min-height: 1.2em;
  font-size: var(--font-m);
  padding: 12px 24px;
  border: 0;
  border-radius: 6px;
  background-color: var(--color-main);
  color: #fff;
  cursor: pointer;
  appearance: button;
  -webkit-appearance: none;
  height: var(--input-height);
  box-sizing: border-box;
  text-decoration: none;
}

@supports (-webkit-touch-callout: none) and (not (translate: none)) {
  button,
  .button,
  .button[type="submit"] {
    margin: 5px;
  }
}


button.secondary,
.button.secondary,
.button[type="submit"].secondary {
  padding: 9px 24px;
  box-sizing: unset;
  height: unset;
}

.button.button-l {
  height: 64px;
}
.button.icon.button-l.icon-bg-32 {
  background-size: 23px;
}

.button.icon.button-l.icon-bg-center-15 {
  background-position: center 20%;
}

.button.bottom, .button.icon.bottom {
  display: flex;
  justify-content: center;
  align-items: end;
}
.button.middle, .button.icon.middle {
  display: flex;
  justify-content: center;
  align-items: center;
}

.button:not(.icon):not(.button-component) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.button.icon:not(.button-component) {
  display: inline-block;
  background-position: 17px center;
}

.button.icon:not(.button-component), .button.secondary.icon:not(.button-component) {
  padding-left: 2.5em;
}

.button.linky {
  background-color: unset;
  text-decoration: underline;
  color: var(--color-main);
  font-size: var(--font-m);
}

.button.transparent {
  color: var(--color-main);
  background-color: unset;
  border: 2px solid var(--input-border-color);
}


file-input-with-preview {
  text-align: center;
}

file-input-with-preview.preview-blocked > img,
file-input-with-preview.preview-blocked #actions,
file-input-with-preview > img:not([src]) {
  display: none;
}

file-input-with-preview > img {
  width: 70%;
}

file-input-with-preview input[type='file']:valid {
  display: none;
}

file-input-with-preview input[type='file']:invalid ~ #actions {
  display: none;
}

file-input-with-preview.preview-blocked input[type='file'] {
  display: block;
}
multi-select {
  display: flex;
  flex-direction: column;
}


multi-select input {
  height: var(--input-height);
  border: 2px solid var(--input-border-color);
  border-radius: 6px;
  font-size: var(--font-l);
  box-sizing: border-box;
}

multi-select select[multiple] {
  display: flex;
  min-width: 40vw;
  border: 0; padding: 0; margin: 0;
  font-size: 16px;
  height: 248px;
}
multi-select select[multiple] option:checked {
  flex-basis: 48px;
  height: auto;
  opacity: 1;
}
multi-select select[multiple] option {
  transition: .3s opacity, .3s height, 0s font-size;
}

.remover {
  cursor: pointer;
}

.remover::after {
  content: "X";
  margin-right: 12px;
}

.hidden {
  display: none !important;
}

#selections li {
  list-style: none;
  display: inline-block;
  padding: 6px 12px 6px 12px;
  margin: 6px 12px 6px 0;
  max-width: fit-content;
  border: var(--border-width-m) var(--color-main) solid;
  border-radius: 28px;
  background-color: var(--color-highlight);
}

#selections a {
  text-decoration: none;
}

ul#selections {
  padding-left: 0;
}
.contact h1 {
  margin-bottom: 1.25em;
}

.contact .icon-phone, .contact .icon-mail {
  display: inline-block;
  padding-left: 2.5em;
}

.contact .icon-phone {
  background-position: 17px center;
}

.contact .icon-mail {
  padding-top: 2px;
  padding-bottom: 2px;
  background-position: 0 center;
}
body.theme_red {
  --line-height-s: 1;
  --line-height-m: 1.25;
  --line-height-l: 1.5;

  --font-size-xs: 16px;
  --font-m: 18px;
  --font-l: 24px;
  --font-xl: 36px;
  --font-xxl: 48px;

  --border-width-xs: 1px;
  --border-width-s: 3px;
  --border-width-m: 4px;
  --border-width-l: 8px;

  --border-radius-default: 36px;

  --font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;

  --padding: 24px;
  --padding-half: 12px;
  --padding-s: 18px;

  --margin-s: 6px;
  --margin-m: 12px;
  --margin-l: 24px;
  --margin-xl: 48px;

  --column-gap: 24px;


  /* COLORS */
  --color-default: #ffde00;

  --color-main: var(--color-default);
  --color-disabled: grey;
  --color-background: #B22000;
  --color-background-body: #CE2803;
  --color-background-highlight: #DDAA66;

  --color-highlight: #6a1300;

  --color-emphasize: #6a1300;
  --color-success: #5baf01;
  --color-interactive: #0c6cd9;
  --color-issue: #E02020;
  --color-alert: #f7b500;
  --color-modal-background: #DDDCD7;

  --color-spinner-primary: #000000;
  --color-spinner-secondary: #ffffff;

  --color-old-blue: #0D2240;

  --border-color:#611e0b;
  --color-input-text: var(--color-background);
  --color-input-background: #611d06;
  --text-color: var(--color-emphasize);

  --video-default-width: 1280;
  --video-default-height: 720;

  --input-height: 50px;

  --icon-size: 24px;
/*
  --layout-margin: calc((100vw - var(--content-width)) / 2); */

  --nav-height: 130px;

  --transition-duration: .33s;

  --avatar-bg-image: var(--voima-lion-logo);
  --avatar-bg-repeat: no-repeat;
  --avatar-bg-size: 72px;
  --avatar-bg-pos-y: center;
  --avatar-bg-anim: none;
  --avatar-bg-anim-duration: unset;
}

/* :root, voima-layout {
  --content-width: min(100vw, 1024px);
}  */

/*
@media (prefers-color-scheme: dark) {
  body { */

  /* COLORS */
  /* --color-default: #3333FF;

  --color-main: var(--color-default);
  --color-disabled: grey;
  --color-background: #444444;
  --color-background-highlight: #ffffff;

  --color-highlight: #ffffff;

  --color-emphasize: #ffffff;
  --color-success: #5baf01;
  --color-interactive: #0c6cd9;
  --color-issue: #E02020;
  --color-alert: #f7b500;
  --color-modal-background: #DDDCD7;

  --color-spinner-primary: #000000;
  --color-spinner-secondary: #ffffff;

  --color-old-blue: #0D2240;

  --border-color: #ffffff;
  }
} */
/* direct_uploads.css */

.direct-upload {
  display: inline-block;
  position: relative;
  padding: 2px 4px;
  margin: 0 3px 3px 0;
  border: 1px solid rgba(0, 0, 0, 0.3);
  border-radius: 3px;
  font-size: 11px;
  line-height: 13px;
}

.direct-upload--pending {
  opacity: 0.6;
}

.direct-upload__progress {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  opacity: 0.2;
  background: #0076ff;
  transition: width 120ms ease-out, opacity 60ms 60ms ease-in;
  transform: translate3d(0, 0, 0);
}

.direct-upload--complete .direct-upload__progress {
  opacity: 0.4;
}

.direct-upload--error {
  border-color: red;
}

input[type=file][data-direct-upload-url][disabled] {
  display: none;
}
ul.errors {
  background: var(--color-issue);
  padding: var(--padding);
}

ul.errors li {
  list-style: none;
  color: var(--alert-text-color);
}
body > footer {
  grid-column-start: left;
  grid-column-end: span 3;
  position: relative;
  padding: calc(var(--padding) * 4) var(--padding) var(--padding) var(--padding);
  z-index: 1;
  background-color: var(--color-main);
  font-size: 0;
}

@media (min-width: 1025px) {
  body > footer {
    margin-top: calc(var(--padding) * -3);
    padding: calc(var(--padding) * 8) var(--padding) var(--padding) var(--padding);
  }
}
form.s {
  min-width: 310px;
  max-width: max(310px, 50vw);
  margin:auto;
  display: grid;
  gap: 6px;
}

form.s label {
  margin: unset;
}
.main-grid {
  display: grid;
  grid-template-columns: 0px [content] auto 0px;
  /* take at least icon element space, and at least screen height - top+bottom, and bottom space */
  grid-gap: var(--padding);
  align-items: start;
  grid-template-rows: min-content;
  padding-top: 24px;
}
.main-grid > :not(footer) {

}
footer {

}

.content-grid{
  display: grid;
  grid-template-columns: 0px [content] auto 0px;
  column-gap: 0px;
  row-gap: var(--padding);
}

.main-grid > * {
  grid-column: content;
}

.content-grid > * {
  grid-column: content;
}

.main-grid > .full-width, .full-width {
  grid-column: span 3;
}

.column-gap-m, .tri-section-grid.column-gap-m { column-gap: var(--grid-gap-m); }
.column-gap-s, .tri-section-grid.column-gap-s { column-gap: var(--grid-gap-s); }

.no-row-gap {
  row-gap: 0px;
}

.office-info {
  display: grid;
  align-content: space-between;
}

.office-info p {
  margin: var(--margin-s) 0;
}

/* tri-section-grid */

.tri-section-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-gap: var(--grid-gap);
}

.tri-section-grid > * {
  grid-column: span 2;
}

.tri-section-grid > .full {
  grid-column: span 6;
}

.tri-section-grid > .double {
  grid-column: span 4;
}

.tri-section-grid > .desktop-double {
  grid-column: span 4;
}


@media screen and (max-width: 1024px) {
  .tri-section-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .tri-section-grid > .med-full {
    grid-column: span 4;
  }

  .tri-section-grid > .full { grid-column: span 4; }

  .tri-section-grid > .desktop-double {
    grid-column: span 2;
  }

  .office-info {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(1, 1fr);
  }
}

@media screen and (max-width: 690px) {
  .tri-section-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  @media screen and (max-width: 690px) {
    .tri-section-grid .payment-method-wrapper {
      grid-column: span 1;
    }
  }

  .tri-section-grid > .full { grid-column: span 2; }

  .tri-section-grid > .double { grid-column: span 2; }

  .tri-section-grid > .med-full { grid-column: span 2; }

  .office-info {
    grid-template-columns: 1fr;
  }
}
* {
  --voima-icon-chevron-left:url("data:image/svg+xml,%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3E< small%3C/title%3E%3Cg id='VD' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Multiline_Big_Modal' transform='translate(-18.000000, -24.000000)'%3E%3Cg id='<-small' transform='translate(18.000000, 24.000000)'%3E%3Crect id='Rectangle' fill='none' x='0' y='0' width='24' height='24'%3E%3C/rect%3E%3Cpath d='M16,3 L9.12132034,9.87867966 C7.94974747,11.0502525 7.94974747,12.9497475 9.12132034,14.1213203 L16,21 L16,21' id='Line-2' stroke='%230C6CD9' stroke-width='4'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-chevron-left-black:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24px' height='24px' viewBox='0 0 24 24' version='1.1'%3E%3Ctitle%3EIcon_Arrow_Left_Black__Vector%3C/title%3E%3Cg id='Icon_Arrow_Left_Black_' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='<-small' transform='translate(3.000000, 3.000000)' stroke='%23000000' stroke-width='4'%3E%3Cpath d='M9,0 L2.12132034,6.87867966 C0.949747468,8.05025253 0.949747468,9.94974747 2.12132034,11.1213203 L9,18 L9,18' id='Line-2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-chevron-right:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24px' height='24px' viewBox='0 0 24 24' version='1.1'%3E%3Ctitle%3EIcon_Arrow_Right_Blue__Vector%3C/title%3E%3Cg id='Icon_Arrow_Right_Blue_' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='<-small' transform='translate(16.500000, 12.000000) rotate(180.000000) translate(-16.500000, -12.000000) translate(12.000000, 3.000000)' stroke='%231900FF' stroke-width='4'%3E%3Cpath d='M9,0 L2.12132034,6.87867966 C0.949747468,8.05025253 0.949747468,9.94974747 2.12132034,11.1213203 L9,18 L9,18' id='Line-2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-chevron-right-black:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24px' height='24px' viewBox='0 0 24 24' version='1.1'%3E%3Ctitle%3EIcon_Arrow_Right_Black__Vector%3C/title%3E%3Cg id='Icon_Arrow_Right_Black_' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='<-small' transform='translate(16.500000, 12.000000) rotate(180.000000) translate(-16.500000, -12.000000) translate(12.000000, 3.000000)' stroke='%23000000' stroke-width='4'%3E%3Cpath d='M9,0 L2.12132034,6.87867966 C0.949747468,8.05025253 0.949747468,9.94974747 2.12132034,11.1213203 L9,18 L9,18' id='Line-2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-chevron-down:url("data:image/svg+xml,%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3E< small%3C/title%3E%3Cg id='VD-update' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='<-small' transform='translate(12.000000, 12.000000) rotate(-90.000000) translate(-12.000000, -12.000000) '%3E%3Crect id='Rectangle' fill='none' x='0' y='0' width='24' height='24'%3E%3C/rect%3E%3Cpath d='M16,3 L9.12132034,9.87867966 C7.94974747,11.0502525 7.94974747,12.9497475 9.12132034,14.1213203 L16,21 L16,21' id='Line-2' stroke='%230C6CD9' stroke-width='4'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-checkmark:url("data:image/svg+xml,%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3E< small%3C/title%3E%3Cg id='VD-update' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='<-small' transform='translate(12.000000, 12.000000) rotate(-90.000000) translate(-12.000000, -12.000000) '%3E%3Crect id='Rectangle' fill='none' x='0' y='0' width='24' height='24'%3E%3C/rect%3E%3Cpath d='M13,3 L6.01375748,6.49312126 C4.53182199,7.23408901 3.93114895,9.03610813 4.67211669,10.5180436 C4.93699011,11.0477904 5.35274278,11.4872816 5.86698145,11.7811323 L22,21 L22,21' id='Line-2' stroke='%230C6CD9' stroke-width='4'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-checkmark-green:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='240px' height='240px' viewBox='0 0 240 240' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3Edone%3C/title%3E%3Cg id='VD-update' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='done' stroke='%235BAF01' stroke-width='40'%3E%3Cpath d='M30,106 L64.9221755,174.680279 C72.4318123,189.449231 90.4921773,195.334069 105.26113,187.824432 C110.441431,185.190381 114.745151,181.108405 117.649297,176.074552 L210,16 L210,16' id='Line-2'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-checkmark-white:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='240px' height='240px' viewBox='0 0 240 240' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3Edone%3C/title%3E%3Cg id='VD-update' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='done' stroke='%23FFFFFF' stroke-width='40'%3E%3Cpath d='M30,106 L64.9221755,174.680279 C72.4318123,189.449231 90.4921773,195.334069 105.26113,187.824432 C110.441431,185.190381 114.745151,181.108405 117.649297,176.074552 L210,16 L210,16' id='Line-2'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-checkbox-checked:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3Echeckbox_checkmark%3C/title%3E%3Cg id='VD-update' stroke='none' stroke-width='1' fill='%23ffffff' fill-rule='evenodd'%3E%3Cg id='checkbox_checkmark' stroke='%23000000'%3E%3Crect id='Rectangle' stroke-width='3' x='1.5' y='1.5' width='21' height='21' rx='4'%3E%3C/rect%3E%3Cpath d='M6,11.996582 L9.06935703,16.2957801 C9.71116748,17.1947534 10.9602196,17.4032252 11.8591929,16.7614147 C12.1248137,16.5717782 12.3399903,16.3200194 12.4859467,16.0281066 L18,5 L18,5' id='Line-2' stroke-width='4'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-checkbox:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3Echeckbox%3C/title%3E%3Cg id='VD-update' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='checkbox' stroke='%23000000' stroke-width='3'%3E%3Crect id='Rectangle' fill='%23ffffff' x='1.5' y='1.5' width='21' height='21' rx='4'%3E%3C/rect%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-close:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3Ex small%3C/title%3E%3Cg id='VD-update' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Multiline_Big_Modal' transform='translate(-366.000000, -147.000000)'%3E%3Cg id='x-small' transform='translate(366.000000, 147.000000)'%3E%3Crect id='Rectangle' fill='none' x='0' y='0' width='24' height='24'%3E%3C/rect%3E%3Cpath d='M21,3 L14.1213203,9.87867966 C12.9497475,11.0502525 12.9497475,12.9497475 14.1213203,14.1213203 L21,21 L21,21' id='Line-2' stroke='%231900FF' stroke-width='3'%3E%3C/path%3E%3Cpath d='M21,3 L14.1213203,9.87867966 C12.9497475,11.0502525 11.0502525,11.0502525 9.87867966,9.87867966 L3,3 L3,3' id='Line-2' stroke='%231900FF' stroke-width='3'%3E%3C/path%3E%3Cpath d='M3,21 L9.87867966,14.1213203 C11.0502525,12.9497475 11.0502525,11.0502525 9.87867966,9.87867966 L3,3 L3,3' id='Line-2' stroke='%231900FF' stroke-width='3'%3E%3C/path%3E%3Cpath d='M3,21 L9.87867966,14.1213203 C11.0502525,12.9497475 12.9497475,12.9497475 14.1213203,14.1213203 L21,21 L21,21' id='Line-2' stroke='%231900FF' stroke-width='3'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-owl-close:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3EOwlClosedEyes%3C/title%3E%3Cg id='VD-update' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='OwlClosedEyes'%3E%3Ccircle id='Koppie' fill='%230C6CD9' cx='12' cy='12' r='12'%3E%3C/circle%3E%3Cpath d='M9.96486833,17.5327385 L12,20.7656403 L12,20.7656403 L14.0351317,17.5327385 C14.329355,17.0653509 14.1889777,16.4479434 13.7215902,16.1537201 C13.5620503,16.0532887 13.3773708,16 13.1888517,16 L10.8111483,16 C10.2588635,16 9.81114827,16.4477153 9.81114827,17 C9.81114827,17.1885191 9.86443696,17.3731985 9.96486833,17.5327385 Z' id='Snavel' stroke='%23FFFFFF' stroke-width='2' fill='%23FFFFFF'%3E%3C/path%3E%3Cpath d='M2,11 L3.31671843,11.6583592 C5.00588337,12.5029417 6.99411663,12.5029417 8.68328157,11.6583592 L10,11 L10,11' id='Line-2' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round'%3E%3C/path%3E%3Cpath d='M14,11 L15.3167184,11.6583592 C17.0058834,12.5029417 18.9941166,12.5029417 20.6832816,11.6583592 L22,11 L22,11' id='Line-2' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-owl-open:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3EOwlOpenEyes%3C/title%3E%3Cg id='VD-update' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='OwlOpenEyes'%3E%3Ccircle id='Koppie' fill='%230C6CD9' cx='12' cy='12' r='12'%3E%3C/circle%3E%3Ccircle id='Oog-Links' fill='%23FFFFFF' cx='6' cy='10' r='6'%3E%3C/circle%3E%3Ccircle id='Pupil-Links' fill='%230C6CD9' cx='6' cy='10' r='2'%3E%3C/circle%3E%3Ccircle id='Oog-Rechts' fill='%23FFFFFF' cx='18' cy='10' r='6'%3E%3C/circle%3E%3Ccircle id='Pupil-Rechts' fill='%230C6CD9' cx='18' cy='10' r='2'%3E%3C/circle%3E%3Cpath d='M9.96486833,17.5327385 L12,20.7656403 L12,20.7656403 L14.0351317,17.5327385 C14.329355,17.0653509 14.1889777,16.4479434 13.7215902,16.1537201 C13.5620503,16.0532887 13.3773708,16 13.1888517,16 L10.8111483,16 C10.2588635,16 9.81114827,16.4477153 9.81114827,17 C9.81114827,17.1885191 9.86443696,17.3731985 9.96486833,17.5327385 Z' id='Snavel' stroke='%23FFFFFF' stroke-width='2' fill='%23FFFFFF'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-owl-close-old-style:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3EOwlClosedEyes%3C/title%3E%3Cg id='VD-update' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='OwlClosedEyes'%3E%3Ccircle id='Koppie' fill='%230D2240' cx='12' cy='12' r='12'%3E%3C/circle%3E%3Cpath d='M9.96486833,17.5327385 L12,20.7656403 L12,20.7656403 L14.0351317,17.5327385 C14.329355,17.0653509 14.1889777,16.4479434 13.7215902,16.1537201 C13.5620503,16.0532887 13.3773708,16 13.1888517,16 L10.8111483,16 C10.2588635,16 9.81114827,16.4477153 9.81114827,17 C9.81114827,17.1885191 9.86443696,17.3731985 9.96486833,17.5327385 Z' id='Snavel' stroke='%23FFFFFF' stroke-width='2' fill='%23FFFFFF'%3E%3C/path%3E%3Cpath d='M2,11 L3.31671843,11.6583592 C5.00588337,12.5029417 6.99411663,12.5029417 8.68328157,11.6583592 L10,11 L10,11' id='Line-2' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round'%3E%3C/path%3E%3Cpath d='M14,11 L15.3167184,11.6583592 C17.0058834,12.5029417 18.9941166,12.5029417 20.6832816,11.6583592 L22,11 L22,11' id='Line-2' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-icon-owl-open-old-style:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='24px' height='24px' viewBox='0 0 24 24' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3EOwlOpenEyes%3C/title%3E%3Cg id='VD-update' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='OwlOpenEyes'%3E%3Ccircle id='Koppie' fill='%230D2240' cx='12' cy='12' r='12'%3E%3C/circle%3E%3Ccircle id='Oog-Links' fill='%23FFFFFF' cx='6' cy='10' r='6'%3E%3C/circle%3E%3Ccircle id='Pupil-Links' fill='%230C6CD9' cx='6' cy='10' r='2'%3E%3C/circle%3E%3Ccircle id='Oog-Rechts' fill='%23FFFFFF' cx='18' cy='10' r='6'%3E%3C/circle%3E%3Ccircle id='Pupil-Rechts' fill='%230C6CD9' cx='18' cy='10' r='2'%3E%3C/circle%3E%3Cpath d='M9.96486833,17.5327385 L12,20.7656403 L12,20.7656403 L14.0351317,17.5327385 C14.329355,17.0653509 14.1889777,16.4479434 13.7215902,16.1537201 C13.5620503,16.0532887 13.3773708,16 13.1888517,16 L10.8111483,16 C10.2588635,16 9.81114827,16.4477153 9.81114827,17 C9.81114827,17.1885191 9.86443696,17.3731985 9.96486833,17.5327385 Z' id='Snavel' stroke='%23FFFFFF' stroke-width='2' fill='%23FFFFFF'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --voima-lion-logo: url('data:image/svg+xml;uttf8,<?xml version="1.0" encoding="UTF-8"?><svg version="1.1" viewBox="0 0 460 560" xmlns="http://www.w3.org/2000/svg"><polygon points="210.76 41 232.81 41 253.23 41 253.64 41 275.28 41 275.77 41 296.19 41 318.24 41 329.64 22.058 343 0 320.95 0 307.58 22.058 286.76 22.058 300.12 0 277.99 0 264.7 22.058 264.3 22.058 251.01 0 228.88 0 242.24 22.058 221.42 22.058 208.05 0 186 0 199.36 22.058"/><path d="m456.55 317.28c-0.49854-0.90517-1.0462-1.7823-1.6405-2.6276l-20.178-33.502-2.2147-3.7772 2.2147-0.41056c6.5399-1.6893 12.32-5.5369 16.405-10.921 3.6614-4.7195 5.7809-10.454 6.0699-16.422v-1.3138c0.025774-5.4038-1.4205-10.712-4.1833-15.355l-0.98431-1.6422-41.751-69.139-9.7611-16.422c-5.5174 3.3312-10.473 7.516-14.683 12.399-9.2441 10.73-14.337 24.423-14.354 38.593 0.022398 10.983 3.0585 21.748 8.7767 31.121l20.917 34.569c0.49497 1.0034 1.0711 1.9646 1.7225 2.8739l15.749 26.112 6.5621 10.921 13.944 23.156 0.90228 1.478c0.79116 1.5226 1.2127 3.2105 1.2304 4.9267-0.045066 6.0901-4.9897 11.003-11.073 11.003-3.1664-0.023851-6.1636-1.4341-8.2026-3.8593l-2.2967-3.5308-13.288-22.581-45.934-76.2-0.6562-1.1496c-5.4974-8.6454-15.026-13.879-25.264-13.877-1.716 0.16916-3.4162 0.47114-5.0856 0.90324-7.4437 1.2668-14.129 5.3172-18.702 11.332-7.4871 9.7108-8.2051 23.041-1.8046 33.502l10.335 17.079 0.57418 0.90324 45.688 75.79 13.944 23.074 0.90228 1.5601c0.7816 1.4969 1.2029 3.1558 1.2304 4.8446v1.0675 0.73901 0.98535c0.035255 0.3275 0.035255 0.65785 0 0.98535-0.43774 1.1445-1.0767 2.2013-1.8866 3.1203l-0.73823 0.82112-0.6562 0.57479-0.65621 0.49268-0.82026 0.41056h-1.0663-0.73823-4.5934-1.3944-0.98431l-1.2304-0.41056-0.98431-0.57479-0.90228-0.6569-0.98431-0.90324-0.73823-0.82112c-0.26627-0.35396-0.48676-0.74022-0.6562-1.1496l-13.534-22.335-0.65621-1.0675-10.417-17.244-29.365-48.693-11.976-16.997-0.49215-0.82112-16.405-26.44 9.8431-16.422 1.3124-2.217 4.9215-8.2112 5.3317-8.786 44.868-74.394c0.90228-1.3959 1.8046-2.8739 2.6248-4.352 5.3728-9.669 8.1958-20.549 8.2026-31.613v-2.6276c-1.3667-35.282-30.35-63.171-65.621-63.144h-22.147-3.281c-7.046 0.57748-13.705 3.4634-18.948 8.2113h-25.838c-12.036 0.027057-22.778 7.5672-26.904 18.886h-66.277v14.205c-9.1568 4.7906-14.553 14.609-13.693 24.916s7.8071 19.094 17.631 22.298c2.6469 0.87238 5.4159 1.3159 8.2026 1.3138 2.3592 0.007828 4.7073-0.32402 6.9722-0.98535 3.8531-1.0648 7.3965-3.0354 10.335-5.7479l0.98431-0.82112c4.7855-4.0093 10.821-6.217 17.061-6.2405 5.0234 0.46244 8.8672 4.6804 8.8672 9.7303 0 5.0499-3.8438 9.2679-8.8672 9.7303h-29.693v48.036h10.089l-9.433 15.683-4.3474 2.0528-33.959-55.754-5.4137-8.9502c1.2522-3.2462 2.0794-6.641 2.4608-10.1 1.3424-12.614-3.553-25.089-13.113-33.415-9.5596-8.3265-22.579-11.455-34.872-8.38h-1.6405c-7.5751 2.2531-14.275 6.7821-19.194 12.974v53.045l1.8046 2.8739 10.171 16.833 36.337 60.27h-13.124c-7.0309-11.401-19.426-18.381-32.81-18.475-2.7543 0.006399-5.5015 0.2814-8.2026 0.82112-7.1713 1.5413-13.765 5.0695-19.03 10.182l-1.6405 1.6422c-5.2118 5.7568-8.6077 12.927-9.7611 20.61l26.002 42.37 3.117 5.091h63.324c7.5345 0.35119 13.46 6.5727 13.452 14.123 0.084834 1.0109 0.084834 2.0272 0 3.0382 35.189 0 64.718-23.648 70.87-34.98l4.4294 7.4722c1.2126 2.2651 2.5546 4.4584 4.0193 6.569l7.4643 12.399h-6.316c-36.465 0.085812-70.414 18.623-90.228 49.267-4.4744 6.9879-8.1608 14.451-10.991 22.252 3.6421-2.1815 7.8136-3.3178 12.058-3.2845 3.1008-0.036835 6.1747 0.5786 9.0228 1.8065 8.4883 3.8553 13.918 12.347 13.862 21.678-0.048471 3.8629-1.0038 7.6601-2.7889 11.085l-1.0663 2.0528-6.0699 10.018c-0.49806-0.95848-1.0456-1.8904-1.6405-2.7918-2.8817-4.4429-6.6181-8.267-10.991-11.249-5.4882-3.6495-11.808-5.8526-18.374-6.4048h-3.281-2.6248c-6.4685 0.4758-12.721 2.5341-18.21 5.9942-3.0311 1.7898-5.7929 4.0015-8.2026 6.569-5.2158 5.6897-8.6148 12.809-9.7611 20.446l25.674 42.534 3.117 5.1731h71.69l17.143-28.411 1.0663-1.8065c1.8049-2.4983 4.4594-4.2504 7.4643-4.9267 0.93465-0.26319 1.9-0.40124 2.8709-0.41056 7.0031 0.044797 12.669 5.7169 12.714 12.727 3.4892-2.6303 6.6313-5.6929 9.3509-9.1145 1.8285-2.3326 3.4739-4.8034 4.9215-7.3901 2.7636-5.1234 4.649-10.675 5.5777-16.422v-2.5455-2.2991c0.040714-0.38211 0.040714-0.76747 0-1.1496v-2.8739c0.77264-4.504 2.4467-8.8052 4.9215-12.645-0.70872 0.07864-1.4239 0.07864-2.1327 0-1.7239-0.003372-3.4281-0.36695-5.0036-1.0675-4.1111-1.9186-6.7356-6.0518-6.7261-10.592-0.080685-0.62694-0.080685-1.2616 0-1.8886-0.078397-0.43442-0.078397-0.87938 0-1.3138 1.299-4.3614 5.0143-7.5677 9.515-8.2112h1.8046 34.615l-5.4957 9.1966-1.5585 2.5455c-9.5374 17.213-7.9249 38.457 4.1013 54.03 0 0.49267 0.73823 0.98535 1.1484 1.3959 4.1052 4.9098 9.1184 8.9804 14.765 11.988 7.004 3.6141 14.76 5.5269 22.639 5.5836h20.424l-16.323 29.15c-6.7797-12.653-19.944-20.566-34.287-20.61h-1.8046c-8.2525 0.25264-16.21 3.1286-22.721 8.2112-1.5464 1.2319-2.9994 2.5767-4.3474 4.0235-5.2158 5.6897-8.6148 12.809-9.7611 20.446l25.674 42.534 3.117 5.1731h67.507l2.3787-4.0235 6.0699-10.018 10.089-16.833 1.1484-1.8065c2.8922-4.2078 7.4153-7.0079 12.468-7.7186 0.84567-0.080868 1.6971-0.080868 2.5428 0 5.8915-0.008663 11.423 2.8366 14.847 7.6365 0.37771-0.85643 0.70635-1.7337 0.98431-2.6276 2.0951-5.9003 3.3649-12.062 3.7732-18.311v-4.6804c0.018953-4.1295-0.33797-8.2522-1.0663-12.317-0.52504-2.9515-1.2653-5.8606-2.2147-8.7039-2.0565-10.883-1.7769-22.079 0.82026-32.845 1.5791-6.5816 4.0055-12.93 7.2183-18.886h-28.299c-4.7845-0.30826-8.4365-4.4029-8.2026-9.1966 0.012557-1.6097 0.49746-3.1802 1.3944-4.5162v0.49267l13.78-22.827 0.73823-1.3959 8.2026 14.123v0.41056c5.2858 8.871 14.783 14.37 25.1 14.534 1.6655 0.1253 3.3381 0.1253 5.0036 0 2.8451-0.48109 5.6071-1.3659 8.2026-2.6276 2.8165-1.3856 5.3921-3.2154 7.6284-5.4194 1.0885-0.9963 2.0774-2.0963 2.9529-3.2845 7.1288-9.2764 8.1564-21.877 2.6248-32.188-0.47982-0.94223-1.0281-1.8479-1.6405-2.7097l-55.695-93.033-10.007-16.422-4.3474-7.1438c-1.0308-1.7089-1.5701-3.6695-1.5585-5.6658-0.008675-4.7981 3.1121-9.0399 7.692-10.455 4.5799-1.415 9.546 0.32816 12.24 4.2966l0.65621 1.0675 14.026 23.238 45.032 74.065c0.80322 1.8131 1.8223 3.5225 3.035 5.091 5.6197 7.5984 14.507 12.077 23.951 12.071 1.7072 0.002774 3.4106-0.16224 5.0856-0.49267 14.242-2.5802 24.601-14.99 24.608-29.478-0.008354-4.9252-1.2192-9.7737-3.5271-14.123m-32.81-59.203c-1.887-0.74564-3.513-2.0307-4.6755-3.6951l-1.0663-1.6422-13.78-22.991-7.4643-12.235c-3.9804-6.3768-6.0842-13.748-6.0703-21.267-0.034314-7.4592 2.0417-14.776 5.9883-21.103l26.166 43.355 10.909 18.147 2.5428 4.1056 0.98431 1.7244c1.9685 3.3791 1.9812 7.5542 0.03341 10.945-1.9478 3.3911-5.5587 5.4804-9.4664 5.4772-1.4365 0.022708-2.8617-0.25704-4.1833-0.82112m-138.21 48.446-22.557 37.361-10.171 16.422-2.7889 4.6804c-0.98199-3.1247-1.7763-6.3054-2.3787-9.525v-2.2991c-0.49623-3.7567-0.74285-7.5421-0.73829-11.332-0.001879-3.7347 0.24474-7.4654 0.73829-11.167 0-1.3959 0-2.7918 0.65621-4.1877 1.296-7.3915 3.5862-14.573 6.8081-21.349 1.0173-2.2295 2.1678-4.3957 3.4451-6.4869 0.18637-0.42704 0.40577-0.83885 0.65621-1.2317l10.089-17.326 5.6598 9.3608 10.581 17.079zm3.9372-197.07c0.68086-0.08587 1.3698-0.08587 2.0506 0 3.5467 0.044947 6.398 2.9361 6.398 6.4869v-0.082112c-0.047585 0.68067-0.21416 1.3477-0.49215 1.9707l-0.90228 1.5601-1.3124 2.1349-4.5114 7.5543-6.398 10.592-4.6755 7.6365-6.7261 11.167-2.7068 4.5162-7.1362 11.824-3.8552 6.4048-10.417 17.244-10.909 18.065-24.608 41.056c-1.3944 2.1349-2.7068 4.2698-3.9372 6.4869-4.0483 7.7126-6.8185 16.032-8.2026 24.634l-3.199-5.3373c-1.5903-3.1004-2.802-6.3811-3.6091-9.7714v-0.41056c0.039408-0.65631 0.039408-1.3144 0-1.9707v-0.73901-1.8065-0.82112-1.8065c0.039807-0.24473 0.039807-0.49429 0-0.73901v-2.6276-2.8739-0.82112c-0.040709-0.73845-0.040709-1.4786 0-2.217 0.035224-0.21755 0.035224-0.43935 0-0.6569l0.49215-2.8739c0-0.82112 0-1.5601 0.57418-2.3813-0.028343-0.21805-0.028343-0.43885 0-0.6569l0.82026-2.5455c0-0.90324 0.65621-1.8065 1.0663-2.7097 0-0.73901 0.73823-1.478 1.0663-2.2991 0.63187-1.223 1.3443-2.4025 2.1327-3.5308l0.98431-1.6422 21.819-36.047 3.281-5.4194 11.402-18.968 3.9372-6.4869 4.0193-6.6511 10.171-16.915 1.0663-1.5601h14.108v-29.56h2.6248c4.6966-0.50329 9.2292-2.0158 13.288-4.4341 1.0291-0.61739 2.0156-1.3032 2.9529-2.0528m-125.42 55.754h10.745c11.53-0.016379 21.932-6.9366 26.412-17.572l0.49215-1.3138c1.1611-3.1257 1.7448-6.4367 1.7225-9.7714 0.045468-15.84-12.721-28.731-28.545-28.821h-1.7225c-2.984 0.083932-5.952 0.46907-8.8588 1.1496-6.6528 1.5202-12.877 4.5235-18.21 8.786l-0.49215 0.49267-1.8046 1.5601c-1.2387 1.114-2.8462 1.7284-4.5114 1.7244-3.76 0-6.8081-3.0513-6.8081-6.8153 0-3.764 3.0481-6.8153 6.8081-6.8153h6.8902v-10.757h47.329c3.926 10.935 14.076 18.402 25.674 18.886h14.354v-18.64h-12.96c-0.70834 0.085178-1.4243 0.085178-2.1327 0-4.4097-0.99716-7.5425-4.9173-7.5464-9.4429 0.025978-4.5352 3.1409-8.4669 7.5464-9.525 0.71018-0.044954 1.4225-0.044954 2.1327 0h35.107c2.1893-5.2743 7.3366-8.7094 13.042-8.7039 2.2003 0.0015574 4.3675 0.53688 6.316 1.5601l1.3124 0.73901 0.57418 0.41056c3.4818 2.5059 5.6272 6.4685 5.8244 10.757 0.03371 3.8695-1.5766 7.5712-4.4299 10.182-1.1022 1.0593-2.3786 1.9205-3.7732 2.5455-0.82836 0.42267-1.7119 0.72672-2.6248 0.90324-1.0465 0.26248-2.1202 0.40029-3.199 0.41056h-15.667v27.836h-8.2026l-1.4765 2.4634-0.82026 1.3138-6.8902 11.249-3.4451 5.6658-0.41013 0.73901-11.32 18.804-2.0506 3.3666-4.1013 6.8153h-50.282v-10.182zm-99.743 5.9942-2.1327-3.6129-7.4643-12.317v-39.332c1.886-1.2581 3.9637-2.201 6.1519-2.7918 1.5902-0.35143 3.2113-0.54397 4.8395-0.57479 3.6404 0.011061 7.2107 1.0038 10.335 2.8739l1.3124 0.90324c6.8876 5.0157 9.8497 13.846 7.3823 22.006-0.45089 1.587-1.113 3.106-1.9686 4.5162-0.83032 1.3724-1.8217 2.6405-2.9529 3.7772l6.398 10.346 39.372 65.69c-6.5108 5.2419-12.278 11.347-17.143 18.147h-2.2967l-41.833-69.631zm117.71 57.479c-0.82026 1.3138-1.5585 2.6276-2.2967 4.0235l-0.90228 1.8886c-0.90228 1.9707-1.7225 4.0235-2.4608 6.0763v0.82112c-0.20169 0.56335-0.36609 1.1394-0.49215 1.7244-0.046221 0.2993-0.046221 0.60394 0 0.90324l-0.49215 1.7244c0 1.3959-0.57418 2.7918-0.82026 4.1877-6.1519 22.17-35.845 44.833-54.137 47.789h-0.65621c-5.8516-9.3791-16.025-15.181-27.068-15.437h-53.727l-1.8046-3.0382-17.225-28.493c2.2483-4.7216 6.2519-8.3758 11.155-10.182 2.2009-0.83348 4.5371-1.2511 6.8902-1.2317 2.2019 0.021389 4.3874 0.38141 6.48 1.0675 7.4678 2.6471 12.697 9.4238 13.37 17.326h61.027c3.7919-7.0813 8.7566-13.467 14.683-18.886l1.9686-1.7244c1.5672-1.403 3.2102-2.7188 4.9215-3.9414l3.4451-2.2991c2.3856-1.5716 4.88-2.9711 7.4643-4.1877 3.148-1.5396 6.4117-2.8299 9.7611-3.8593 4.5935-1.4675 9.3185-2.485 14.108-3.0382h7.6284 3.8552l-4.6755 8.786zm8.7767-26.44h-2.5428c-3.1684-0.20482-6.3466-0.20482-9.515 0-2.2147 0-4.2653 0-6.48 0.49267l1.7225-2.7918 3.3631-5.5836h25.592l-5.1676 9.1145-6.7261-0.82112m16.569 164.72h-5.7418c-10.028 0.020471-19.421 4.9207-25.182 13.138-1.2467 1.8247-2.2918 3.7795-3.117 5.83-1.5897 3.709-2.3995 7.7061-2.3787 11.742v2.7097c0.57905 6.9071 3.4691 13.417 8.2026 18.475 0.12289 1.5577 0.12289 3.1227 0 4.6804v1.1496c0.08067 0.98369 0.08067 1.9724 0 2.956-0.35041 2.2424-0.92756 4.4434-1.7225 6.569-2.6446-1.0204-5.3964-1.7367-8.2026-2.1349-1.3658-0.084142-2.7355-0.084142-4.1013 0-10.475 0.020545-20.266 5.2129-26.166 13.877l-1.8046 2.956-2.3787 3.9414-8.8588 14.78h-49.954l-19.03-31.86c1.2427-2.6216 3.0329-4.9456 5.2496-6.8153 5.9529-5.0451 14.299-6.1508 21.358-2.8296 7.059 3.3212 11.534 10.459 11.453 18.267v0.98535c-0.07897 1.4741-0.32667 2.9343-0.73823 4.352h22.967l14.354-23.813 1.4765-2.3813c6.6119-11.993 7.0996-26.427 1.3124-38.839-4.11-8.6391-10.979-15.66-19.522-19.953 20.822-27.36 55.591-40.168 89.162-32.845l5.5777 9.3608 1.1484 1.8886 14.354 23.648-17.718 0.16422zm24.608-59.203c-1.35 4.2716-2.3917 8.6348-3.117 13.056 0 1.8886-0.82026 3.8593-1.0663 5.83l-0.49215 3.9414v3.5308l-1.3124-2.217-1.8046-3.2845c0-0.98535-0.90228-1.8886-1.3124-2.8739-0.41013-0.98535-0.98431-2.3813-1.3944-3.6951-0.57815-1.5595-1.071-3.1494-1.4765-4.7625-1.08-4.3051-1.7393-8.7051-1.9686-13.138v-2.1349c-0.008405-9.7911 2.3858-19.434 6.9722-28.082l28.053-46.804 3.4451-5.6658 9.7611-16.422 14.519-23.895 1.6405-2.7918 9.2689-15.437 6.398-10.51 13.288-22.088c0.65621-0.90324 1.2304-1.8886 1.8046-2.8739 1.7972-3.7044 2.6698-7.7901 2.5428-11.906 0.027296-6.6342-2.5675-13.01-7.2183-17.736-2.3196-2.4289-5.111-4.357-8.2026-5.6658 2.04-6.9464 1.6934-14.377-0.98431-21.103l0.6562-1.1496c9.6245 1.9459 18.4 6.8553 25.1 14.041 2.981 3.2647 5.5184 6.9092 7.5464 10.839 3.1835 6.4616 4.8399 13.57 4.8399 20.774 0.031344 7.7159-1.8874 15.314-5.5781 22.088l-2.4608 4.1056-22.639 37.607-23.049 38.264-3.035 4.8446-7.3003 12.153-4.4294 7.3901-9.433 15.601-2.2147 3.6951-12.55 20.774-3.199 5.2552c-3.8505 6.4372-7.0123 13.263-9.433 20.364m72.839 98.535c-2.2979 4.0015-3.54 8.5229-3.6091 13.138 0.070634 5.955 2.0873 11.723 5.7418 16.422 0.83526 1.0706 1.7395 2.0855 2.7068 3.0382 4.4579 4.3155 10.236 7.0052 16.405 7.6365h4.5934c0 1.0675 0 2.217-0.57418 3.2845-0.49215 3.3666-0.90228 6.7332-1.0663 10.182v4.9267c-0.073139 6.7766 0.5314 13.544 1.8046 20.2 0.65621 2.8739 1.3124 5.7479 2.2147 8.2112 0.32023 2.2866 0.51193 4.5893 0.57418 6.8974h-0.90228c-12.711 0.19921-24.438 6.8898-31.088 17.736l-1.4765 2.4634-12.55 20.774h-46.427l-1.8046-3.0382-17.389-28.411c2.3152-4.7322 6.3725-8.3818 11.32-10.182 6.0614-2.3179 12.873-1.5106 18.226 2.1602s8.5658 9.7376 8.5963 16.233c0.002341 1.8048-0.24612 3.6011-0.73823 5.3373h22.885l31.908-52.88 2.7068-4.5983 0.73823-1.1496-10.335-12.81h-35.599c-8.5789-0.015852-16.737-3.7251-22.393-10.182-4.9266-5.4413-7.6469-12.527-7.6284-19.871-0.00361-4.989 1.2369-9.9 3.6091-14.288l1.5585-2.5455v-0.57479l11.073-18.311 8.2026-12.974 8.2026-13.795 20.917-34.651 29.365 48.693-19.768 32.927z"/></svg>');
  --double-right: url("data:image/svg+xml,%3Csvg width='17' height='16' viewBox='0 0 17 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 1L16 8L9 15M1 1L8 8L1 15' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A")
  --background-matrix:url(/assets/matrix-87a0d86874c07347184dfd19b31f9a594964bb5673efb6b8805fd6d243204c67.png);
}

.icon-button {
  position: relative;
  -webkit-appearance: none
  appearance: none;
  background: transparent;
  border: 0;
  min-width: var(--round-icon-size);
  padding: var(--round-icon-size) 0 0 0;
  text-decoration: none;
}

.icon-button::before {
  content:' ';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  border: 1px solid var(--color-main);
  width:var(--round-icon-size);
  height:var(--round-icon-size);
  border-radius: 50%;
  box-sizing: border-box;
}

.voima-icon{
  width: var(--icon-size);
  height: var(--icon-size);
  display: block;
}

.voima-icon-disabled{
  width: var(--icon-size);
  height: var(--icon-size);
  display: block;
  opacity: 25%;
}

.voima-icon-dynamic{
  background-size: contain;
  background-position: center;
  content: var(--voima-icon-dynamic);
  z-index: 1;
}

.voima-icon-checkmark-confirmed{
  content: var(--voima-icon-checkmark-green);
}

.voima-icon-checkmark-white{
  content: var(--voima-icon-checkmark-white);
}

.voima-icon-chevron-left::before{
  display: block;
  background-size: contain;
  background-position: center;
  height: var(--icon-size);
  content: var(--voima-icon-chevron-left);
  z-index: 1;
}

.voima-icon-chevron-left-black::before{
  display: block;
  background-size: contain;
  background-position: center;
  height: var(--icon-size);
  content: var(--voima-icon-chevron-left-black);
  z-index: 1;
}

.voima-icon-chevron-right::before{
  display: block;
  background-size: contain;
  background-position: center;
  height: var(--icon-size);
  content: var(--voima-icon-chevron-right);
  z-index: 1;
}

.voima-icon-chevron-right-black::before{
  display: block;
  background-size: contain;
  background-position: center;
  height: var(--icon-size);
  content: var(--voima-icon-chevron-right-black);
  z-index: 1;
}


.voima-icon-close {
  float: right;
}

.voima-icon-close::before{
  display: block;
  background-size: contain;
  background-position: center;
  height: var(--icon-size);
  content: var(--voima-icon-close);
  z-index: 1;
}

.voima-icon-checkmark::before{
  background-size: contain;
  background-position: center;
  content: var(--voima-icon-checkmark);
  z-index: 1;
}

.voima-icon-lion {
  width: 84px;
  max-height: 25vw;
  text-align: center;
  content: var(--voima-lion-logo);
}

.voima-icon-lion-white {
  display:block;
  width: 84px;
  height: 120px;
  max-height: 25vw;
  text-align: center;
  background-image:var(--voima-lion-logo);
  filter: invert(1);
  background-repeat: no-repeat;
  margin:auto;
}

.flag {
  font-style: unset;
  height: 24px;
  width: 24px;
  display: block;
  font-size: 26px;
  line-height: 1;
  float: right;
}

.icon {
  background-repeat: no-repeat;
}

.icon-in,
.icon-out,
.icon-exchange,
.icon-euro-transfer-out,
.icon-euro-transfer-in {
  --icon-size: 72px;
}

.icon.full, .icon-settings {
  --icon-size: 48px;
  --icon-gap: 36px;
}

.icon-in       { background-image:url(/assets/icons/in-white-cce93d548dd07b3cee283d08b0db2109fa5b376ed741588ad13e25d181ac914a.svg);       }
.icon-out      { background-image:url(/assets/icons/out-white-e0436c86c05b8d85447b1616f670d67d8e1c35bf0b2afa0277d719854d6b96a8.svg);      }
.icon-exchange { background-image:url(/assets/icons/exchange-white-6aaa72edbb4c7cfc463a89ac60abfabc547136fe10702d17c88f33d600fc1669.svg); }
.icon-settings { background-image:url(/assets/icons/settings-da3e5c7a6a78a470913a6e9b4e7bc8509f5b36918aed8929149c907e5e6c2e62.svg);       }
.icon-user_add { background-image:url(/assets/icons/user_add-a33d0782b9ba71cc4673e0df8bd6f8b98c2ddf5d1dbf175682a10a6fa7c969c4.svg);       }
.icon-language { background-image:url(/assets/icons/language-721439fe9f82d81fa9fbd5b97c5d44d9b2088529ac6bb766d8da3ee1d59ef0e4.svg);       }
.icon-logout   { background-image:url(/assets/icons/logout-605c33bb7507db077c032edea08c88331f86c2e5df1eb53d5d4e97902440ce11.svg);         }
.icon-close    { background-image:url(/assets/icons/close-5d7b843db72133ae9a504d439a259e75d6104b41dce65faf6d8c2f54404871c2.svg);          }
.icon-burger   { background-image:url(/assets/icons/burger-752d328be141af78ca2a9d467dfe9d4bad5533fb9d3284bf8dfee5ad5df97448.svg);         }

.icon-external_link {
  background-image:url(/assets/icons/external_link-d3066f508f23d0d8601500130a393b6bcd47a211df1f62a3942ae7424dc1675f.svg);
  background-position: center right;
  padding: unset;
  padding-right: var(--padding);
}
.icon-document-outline { background-image:url(/assets/icons/document-outline-85d38db89084b6d66e79929199ebe75edad25eb5f3b88a7f2bcc1e6f532a8e88.svg);}

.icon-in.black       { background-image:url(/assets/icons/in-black-9bdfe2816fb9c31def0403baf12ef30ec818336e9a8ab38c87dc19b8ed1131b4.svg);       }
.icon-out.black      { background-image:url(/assets/icons/out-black-9a3c2fce250ea1bd80f3b058992dd3dbc57e2c84b88e42a9ee87ae1d087deaa6.svg);      }
.icon-exchange.black { background-image:url(/assets/icons/exchange-black-19840e9278176f8a395bcceada8cd7b50f7c321e29546d140fbc95fd877ec8d2.svg); }
.icon-euro-transfer-out.black { background-image:url(/assets/icons/arrow-down-tray-black-0101a6ee9479682892691efaa29d355d7a080ba8169ae6fa568b52d858fa926d.svg) }
.icon-euro-transfer-in.black { background-image:url(/assets/icons/arrow-up-tray-black-85304b6ecc0adfb111b10d349c856be8bd930d54dc04e330b07dc06858aac15a.svg) }
.icon-user_add.black { background-image:url(/assets/icons/user_add_black-86d15f9b7fb5f57863fb9168f97a89b4f681a39ee31e11001c6f7d22e0942c5c.svg); }
.icon-logout.black   { background-image:url(/assets/icons/logout-black-954a9aac97161356f448b84d0533fdf975a40b8c7e9618e34d7b8bdda7d6a5c8.svg);   }

.icon-settings.white { background-image:url(/assets/icons/settings_white-848a76b3b7af05c4ab3dd47cacdab932012fe1212131f6bb6ab1d4b59a0714ba.svg); }

.icon-copy    { background-image:url(/assets/icons/copy-82d2a21011a8b8a8866d0f2157eba791e6a51fa75ae6b8d5c4340a551b26c7e2.svg);   }
.icon-expand  { background-image:url(/assets/icons/expand-26e01ece1ca8e47080ad2cc8af4945ad1a7f8d8811ba5f7ba7de1bca8bd917a4.svg); }
.icon-mail    { background-image:url(/assets/icons/mail-706bd9b7c0ce19e3ec4530e162fbaf5643eedddbba6aa309452c58a7dddb995c.svg);   }
.icon-phone   { background-image:url(/assets/icons/phone-a360c06b1d02751e969f262d1220061766b36ac525c4bcd54af2798fa315225b.svg);  }
.icon-upload  { background-image:url(/assets/icons/upload-2e19ee7754957a40cdde68eddb32779f34b276311be0dd800b17997171edad2b.svg); }
.icon-edit    { background-image:url(/assets/icons/edit-bc3debc778b9f0bda4363e4c4586a1f0ee83748a287a461a5bb8d1489bfd6f46.svg);   }
.icon-error   { background-image:url(/assets/icons/exclamation-circle-red-f6a60165e174cc52cfd80de079620ccef28641e10da12008a71b2f6c7b5c848c.svg) }

/* Event status icons */
.icon-completed { background-image:url(/assets/icons/check-circle-solid-green-7eabb571c0015c398384936a66265791c24a111c4b62edbc7f7b5d1fed2541dc.svg) }
.icon-scheduled { background-image:url(/assets/icons/clock-solid-black-ae7d93955e1dacfb678c41a0dad63264d8fa6029b08d03a3999fbac2f44a5197.svg) }
.icon-initiated { background-image:url(/assets/icons/clock-solid-black-ae7d93955e1dacfb678c41a0dad63264d8fa6029b08d03a3999fbac2f44a5197.svg) }

.icon-reveal   { background-image:url(/assets/icons/reveal-6e889705eb9367f2742043f11529adc2b746da022331c7e6c4579b92bf5ab372.svg); }
.icon-unreveal {
  background-image:url(/assets/icons/unreveal-81464bdc6381d0508b35fe077de9c0d9a3105ce79d61321f40bc630381ea9d6e.svg);
  background-size: 24px;
}

* {
  --icon-chevron-down: url(/assets/icons/chevron-down-b78d7439ba90e09ce83108527b6d45da2e58b30aa5ee3c7a96a9e8d269f55d2b.svg);
}

h1.icon {
  background-position: center top;
  padding-top: calc(var(--icon-size) + var(--icon-gap));
  background-size: var(--icon-size);
}


.icon-double-chevron-right { background-repeat: no-repeat; background-image: url(/assets/icons/double-chevron-right-4d24e81dfed5489a7f47c78a1bb9e173f23646b9e642731507adf985403365aa.svg); }
.icon-chevron-right { background-repeat: no-repeat; background-image: url(/assets/icons/chevron-right-cf2cbfa7068dac24e453a72fd0a9b4943d6f334d3f48a81822637a6517ec4548.svg); }
.icon-chevron-left { background-repeat: no-repeat; background-image: url(/assets/icons/chevron-left-9e0d228149022445a9b749847d27c0903350d4360239bd9c7f2df262690f9a82.svg); }
.icon-chevron-down { background-repeat: no-repeat; background-image: url(/assets/icons/chevron-down-b78d7439ba90e09ce83108527b6d45da2e58b30aa5ee3c7a96a9e8d269f55d2b.svg); }
.icon-list-bullet { background-repeat: no-repeat; background-image: url(/assets/icons/list-bullet-7d95b3095ec2c0014fb4702e7033cf4f1c8196ac68389f71462f4735832a916a.svg); }
.icon-rectangle-stack { background-repeat: no-repeat; background-image: url(/assets/icons/rectangle-stack-613be5b0ab10e807816323714bfb76d021ec110412d1fd980ecfa40f1d6f7346.svg); }
.icon-plus { background-repeat: no-repeat; background-image: url(/assets/icons/plus-9322223a0d08766a5298e579b9bd39d1370c88d57674297f2988a842d9e464b5.svg); }
.icon-plus-invert { background-repeat: no-repeat; background-image: url(/assets/icons/plus-invert-b220bd39a06c0de7b6fa9693b16de14ad965b4542351e95cc6b332bf34c268d4.svg); }
.icon-check-circle { background-repeat: no-repeat; background-image: url(/assets/icons/check-circle-3494e8e8845e7fc8578aed61d15c28ad42d20d8ad581f3430fa767155fd7b387.svg); }
.icon-check-circle-solid-green { background-repeat: no-repeat; background-image: url(/assets/icons/check-circle-solid-green-7eabb571c0015c398384936a66265791c24a111c4b62edbc7f7b5d1fed2541dc.svg); }
.icon-clock { background-repeat: no-repeat; background-image: url(/assets/icons/clock-c91b89313067714eccc3268d8b0edaf45d02414df4bced42d175cf362431422b.svg); }
.icon-clock-solid-black { background-repeat: no-repeat; background-image: url(/assets/icons/clock-solid-black-ae7d93955e1dacfb678c41a0dad63264d8fa6029b08d03a3999fbac2f44a5197.svg); }
.icon-document-text { background-repeat: no-repeat; background-image: url(/assets/icons/document-text-83e4802c790ade59261fd82e2c9851e76de54cfd828fd3a47252905315144911.svg); }
.icon-trash { background-repeat: no-repeat; background-image: url(/assets/icons/trash-936284f2f2eee1b8a3bcdca25f4b5f45b4cff02b137b4e5a22dea818d510eb27.svg); }
.icon-information-circle { background-repeat: no-repeat; background-image: url(/assets/icons/information-circle-03d0ddd71562c5264c81fe9066e4ae360abb206e825da8282215c19626630fb1.svg); }
.icon-exclamation-triangle { background-repeat: no-repeat; background-image: url(/assets/icons/exclamation-triangle-f8869da8d574a8c9670dbe89ab788b8dce98fb480ad4bd587483d5670d929990.svg); }
.icon-device-phone-mobile { background-repeat: no-repeat; background-image: url(/assets/icons/device-phone-mobile-30d2bdc423d917206b84ad35e30fac05af01cb5dc2bd87eb1c005512e1867719.svg); }
.icon-device-tablet { background-repeat: no-repeat; background-image: url(/assets/icons/device-tablet-81f8b3cb4869b50ff474af8d1107c517030f2fd93cfd5abb57c6e1ea42cb27e4.svg); }
.icon-computer-desktop { background-repeat: no-repeat; background-image: url(/assets/icons/computer-desktop-aacbf17d96f31040cf2f0115a1a17131d9fc8ae51941b49eabde44563d3e8980.svg); }

.icon-right { padding-right: 24px; background-position: right; }
.icon-left { padding-left: 24px; background-position: left; }
* {
  --input-height: 52px;
  --input-border-color: var(--color-main);
}

input[type="date"],   input[type="datetime-local"], input[type="email"],
input[type="month"],  input[type="number"],         input[type="password"],
input[type="search"], input[type="tel"],            input[type="text"],
input[type="time"],   input[type="url"],            input[type="week"],
input[type="submit"], textarea {
  height: var(--input-height);
  border: 2px solid var(--input-border-color);
  border-radius: 6px;
  width: 100%;
  font-size: var(--font-m);
  box-sizing: border-box;
}

input:disabled {
  background-color: #eee;
}

input:invalid, input:focus:invalid {
  border-color: var(--color-issue);
  outline-color: var(--color-issue);
}
select {
  height: var(--input-height);
  border: 2px solid var(--input-border-color);
  border-radius: 6px;
  font-size: var(--font-l);
  box-sizing: border-box;
  width: 100%;
}

input[type="tel"] {
  width: 50%;
}

select.phone-country-code {
  width: 50%;
}
@media screen and (max-width: 690px) {

  select.phone-country-code {
    width: 100%;
  }

  input[type="tel"], input.otp-input {
    width: 100%;
  }

}

textarea {
  height: auto;
  resize: vertical;
}

/* .field_with_errors {
  flex-grow: 1;
} */

.field_with_errors input {
  --input-border-color: var(--color-issue);
}

input[type="radio"] {
  position: relative;
  top: 2px;
  width: 24px;
  height: 24px;
  margin-right: 1em;
  accent-color: var(--color-main);
}

a + input[type="submit"] {
  margin-left: 12px
}
input[type="submit"] {
  background-color: var(--color-main);
  color: var(--color-highlight);
  /*height: min-content;*/
  padding: 6px 12px;
  border: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: button;
}

input[type="submit"][disabled] {
  opacity: .5;
  cursor: not-allowed;
}

input.width-wrapped {
  width: min-content;
}

input[type="checkbox"] {
  width: 22px;
  height: 22px;
}

input[type="checkbox"]::after {
  content: var(--voima-icon-checkbox);
  display: block;
  width: 24px;
  height: 24px;
  margin: -1px 0 0 -1px;
  cursor: pointer;
}

input[type="checkbox"]:checked::after {
  content: var(--voima-icon-checkbox-checked);
}

.log-out {
  background-color: var(--color-highlight);
  color: var(--color-main);
  border: none;
}

input[type="checkbox"].element-toggle {
  display: none;
}

input[type="checkbox"]:not(:checked).element-toggle + * {
  display: none;
  visibility: none;
}

.form-bottom-actions, .bottom-actions {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: end;
  padding-top: var(--padding);
  column-gap: calc(var(--padding)*2);
  margin-top: 24px;
}

.form-bottom-actions p {
  margin: 0;
}

label, .label {
  display: block;
  margin: var(--padding) 0 calc(var(--padding)/2) 0;
  font-size: var(--font-l);
  font-weight: 500;
  line-height: 1.5;
}

form > label:first-of-type {
  margin-top: 0;
}

.voima-checkbox {
  display: grid;
  grid-template-columns: [checkbox] 24px [label] auto [extraLabel] auto [right] auto;
  grid-template-rows: [checkbox label extraLabel] auto [extraInput] auto;
  align-items: center;
  justify-content: start;
  margin: 24px 0 12px 0;
  width: 100%;
}

.voima-checkbox input[type="checkbox"] {
  grid-column: checkbox;
  grid-row: checkbox;
}

.voima-checkbox label {
  margin: 0 0 0 12px;
  grid-column: label;
  grid-row: label;
}

.voima-checkbox label[data-checked-text] {
  margin: 0;
  grid-column: extraLabel;
  grid-row: extraLabel;
}

.voima-checkbox input:not(:checked) ~ label[data-checked-text] {
  display: none;
}

.voima-checkbox input:not(:checked) ~ input {
  display: none;
}

.voima-checkbox input:not([type="checkbox"]) {
  grid-row: extraInput;
  grid-column-start: 1;
  grid-column-end: end;
}

/* TOGGLE SWITCH */
input[type=checkbox].toggle-switch {
	height: 0;
	width: 0;
	visibility: hidden;
}

label.toggle-switch {
	cursor: pointer;
  margin: 0 0 0 auto;
	text-indent: -9999px;
	width: calc(var(--toggle-switch-height) * 2);
	height: var(--toggle-switch-height);
	background: #000000;
	display: block;
	border-radius: var(--toggle-switch-height);
	position: relative;
  flex-shrink: 0;
}

label.toggle-switch:after {
	content: '';
	position: absolute;
	top: 1px;
	left: 1px;
	width: calc(var(--toggle-switch-height) - 2px);
	height: calc(var(--toggle-switch-height) - 2px);
	background: #fff;
	border-radius: var(--toggle-switch-height);
	transition: 0.1s;
}

input.toggle-switch:checked + label {
	background: var(--color-success);
}
input.toggle-switch:disabled + label {
  background: dimgray;
}

input.toggle-switch:checked + label:after {
	left: calc(100% - 1px);
	transform: translateX(-100%);
}

label.toggle-switch:active:after {
	width: calc(var(--toggle-switch-height) * 1.1);
}


input.otp-input {
  text-align: center;
  font-size: var(--font-l);
}
input.otp-input[type=number] {
  -moz-appearance: textfield;
}
input.otp-input::-webkit-outer-spin-button,
input.otp-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
body .js-hideable { display: none; }
html, body {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  background-color: var(--color-main);
}

body {
  font-family: var(--font-family);
  background-color: var(--color-background);
  color: var(--text-color);
}

@media screen and (min-width: 1024px) {
  body {
    display: grid;
    grid-template-columns: [left] minmax(0, auto) [bodywrap] minmax(0, 1024px) [right] minmax(0, auto);
    background-color: var(--color-background-body);
  }
  body > * {
    grid-column: bodywrap;
    background-color: var(--color-background);
  }

  .wide-screen-hidden {
    visibility: hidden !important;
    display: none !important;
  }
}

@media screen and (max-width: 690px) {
  .wide-screen-only {
    visibility: hidden !important;
    display: none !important;
  }
}


@media (max-width:320px) {
  .main-grid {
    grid-gap: calc(var(--padding)/1.5);
  }
}

main {
  position: relative;
  z-index: 2;
}

.main-grid > h1:first-child {
  margin-bottom: 0;
}

@media (max-width:1024px) {
  main { z-index: unset; }
}

[hidden] {
  display: none !important;
}

.linked-elements > * {
  margin-top: 6px;
  margin-bottom: 6px;
}

.flex-row {
  display: flex;
  flex-direction: row;
}

.flex-col {
  display: flex;
  flex-direction: column;
}

.space-evenly {
  justify-content: space-evenly;
}

.field {
  display: flex;
  flex-direction: column;
}

.checkbox-field {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.checkbox-field > * {
  padding: 0;
  margin: 0 12px 0 0;
}

.checkbox-field label {
  font-size: var(--font-m);
}

#action_buttons {
  display: flex;
  width: 100%;
  justify-content: space-evenly;
}

.copyright {
  border-top: 1px solid var(--color-main);
  margin-top: 24px;
}

.border-top {
  border-top: 1px solid var(--color-main);
}

.no-margin {
  margin: 0;
}

summary {
  cursor: pointer;
}

.float-right {
  float: right;

}
.invert {
  filter: invert(1);
}

.grid { display: grid; }

.flex {
  display: flex;
}
.flex.wrap, .flex-row.wrap, .flex-col.wrap {
  flex-wrap: wrap;
}

.flex.nowrap, .flex-row.nowrap, .flex-col.nowrap {
  flex-wrap: nowrap;
}

[class~="gap/1.5"] {
  gap: calc(var(--grid-gap, 25px) / 1.5);
}

.space-between {
  justify-content: space-between;
}

.section-separator {
  border-bottom: 1px solid var(--color-main);
}

.section-separator-highlight {
  border-bottom: 1px solid var(--color-highlight);
}

p.section-separator {
  padding: var(--padding) 0;
  margin: 0;
}

span.block {
  margin-bottom: 6px;
}
span.block.no-margin {
  margin-bottom: 0;
}

.block.margin {
  margin-top: calc(var(--margin) / 2);
  margin-bottom: 6px;
}

.kids_account_opening_image {
  max-width: 100%;
  background-size: cover;
  background-position: center bottom;
}

.organisational_account_opening_image {
  max-width: 100%;
  background-size: cover;
  background-position: center center;
}

iframe {
  border:none;
}

.gr-2 { grid-column: 2;}
.icon-m { background-size: 24px;}
.mt-xxl {
  margin-top: var(--margin-xxl);
}
.mt-xl {
  margin-top: var(--margin-xl);
}
.mt-l {
  margin-top: var(--margin-l);
}
.mt-m {
  margin-top: var(--margin-m);
}
.mt-s {
  margin-top: var(--margin-s);
}
.mt-auto {
  margin-top: auto
}

.mb-xxl {
  margin-bottom: var(--margin-xxl);
}
.mb-xl {
  margin-bottom: var(--margin-xl);
}
.mb-l {
  margin-bottom: var(--margin-l);
}
.mb, .mb-m {
  margin-bottom: var(--margin-m);
}
.mb-s {
  margin-bottom: var(--margin-s);
}
.mb-auto {
  margin-bottom: auto
}

.ml-auto {
  margin-left: auto
}
.mr-auto {
  margin-right: auto
}

.ai-s { align-items: start; }
.ai-c { align-items: center; }
.ai-e { align-items: end; }
.as-s { align-self: start; }
.as-e { align-self: end; }
.jc-c { justify-content: center; }
.ji-c { justify-items: center; }
.ji-r { justify-items: right; }
.jc-sa { justify-content: space-around; }
.js-s { justify-self: start; }
.js-e { justify-self: end; }

.jc-s, .button:not(.icon).jc-s { justify-content: start; }
.jc-e, .button:not(.icon).jc-e { justify-content: end; }
.jc-sb, .button:not(.icon).jc-sb { justify-content: space-between; }

.hidden {
  display: none !important;
}

.m-0 {
  margin: 0;
}
.m-l {
  margin: var(--margin-l);
}


.w-full { width: 100%; }
.w-24 { width: 24px; }
.w-28 { width: 28px; }

.action-list {
  justify-self: center;
}

@media screen and (max-width: 690px) {
  .dashboard-show h1 {
    margin-top: calc(var(--padding-half) / 2);
  }

  body.dashboard-show .account {
    grid-row-gap: 4px;
  }
}


@media screen and (max-width: 690px) {
  .action-list {
    width: 100%;
  }
}

turbo-cable-stream-source {
  display: none;
}
a {
  color: var(--color-main);
}

.double-chevron::after {
  content: ' »';
}

.clickable {
  cursor: pointer;
}
ul.list-base {
  grid-column: span 6;
  list-style-type: none;
  margin: 0;
  padding: 0;
}
ul.list-base li {
  display: flex;
  font-size: var(--font-m);
  border-bottom: 1px solid black;
}

ul.link-list {
  grid-column: span 6;
  list-style-type: none;
  margin: 0;
  padding: 0;
}
ul.link-list li.icon {
  background-size: 32px;
}
h2.settings {
  font-size: var(--font-l);
  font-weight: 600;
}
ul.link-list li {
  display: flex;
  max-height: 76px;
  flex-direction: column;
  font-size: var(--font-m);
  border-bottom: 1px solid black;
  margin-left: 10px;
}

ul.link-list li:active {
  transform: scale(0.99);
  transition: transform 0.2s
}

ul.link-list li a {
  padding: 27px 24px 27px 4px;
}
.turbo-progress-bar {
  background: #f4c92d;
}
.login-form, .sm-form {
  max-width: max(310px, 50vw);
  margin:auto;
  display: grid;
  gap: 6px;
}

.login-form label, .sm-form label {
  margin: unset;
}

#login-form-actions {
  flex-direction: row;
  align-items: end;
  justify-content: end;
}
#login-form-actions.flex-s-b {
  justify-content: space-between;
}

.login-form a:not(.button) {
  display: block;
  text-decoration: underline;
  margin-top: 0.5em;
}

#session_otp_request:focus {
}

#session_otp_request {
  padding: 0;
  margin: 0;
  margin-top: 0;
  align-self: start;
  padding: 0;
  margin: 0;
  align-self: start;
  opacity: 1;
  font-size: var(--font-s);
  transition: all 0.2s ease-in;
}
#session_otp_request.sent {
  margin-top: -12px;
  opacity: 0;
  font-size: 0;
}


#otp { height: 0; margin: 0; }

.otp-step {
  display: none;
}

#otp:target ~ .otp-step {
  display: block;
}

#otp:target ~ .login-step {
  display: none;
}
.notification-container {
  grid-column-start: 1;
  grid-column-end: span 3;
}

.notification-container .notification {
  display: grid;
  grid-template-columns: auto minmax(auto, 1000px) 24px auto;
}
#flash:empty { display: none; }
#flash i {
  width: 25px;
  height: 25px;
  grid-column: 3;
  align-self: center;
  background-position: left center;
}

.notification-container .notification > * {
  font-size: var(--font-s);
  grid-column: 2;
  padding: 0 var(--padding);
}

.notification p {
  margin: var(--margin-m) 0
}

.notice {
  background-color: var(--color-success);
  color: var(--color-highlight);
  display: block;
}
.notice i {
  filter: invert(100%)
}

.alert {
  background-color: var(--color-alert);
  color: var(--color-main);
}

.static {
  background-color: var(--color-alert);
  color: var(--color-main);
}

.error {
  background-color: var(--color-issue);
  color: var(--color-main);
}

form .notification {
  display: block;
  margin: 0 calc(var(--padding) * -1) var(--padding);
  padding: 1px var(--padding) var(--padding);
}

.notification h2 {
  border-bottom: 0;
}

.notification ul {
  list-style-type: none;
}

.notification.static.pointer {
  cursor: pointer;
}

/* Form messages */
form .messages {
  background-color: transparent;
  font-size: var(--font-m);
  font-weight: bold;
}
form .messages.error {
  color: var(--color-issue);
}
form .messages li {
  list-style-type: none;
}
form .message.error {
  font-size: var(--font-s);
  background-color: transparent;
  color: var(--color-issue);
}


/* select#identity_identity_document_type:invalid {
  display: block;
}

select#identity_identity_document_type:invalid ~ #input-step {
  display: none;
}

select#identity_identity_document_type:invalid ~ .actions {
  display: none;
}

select#identity_identity_document_type {
  display: none;
}

ul.document-criteria-list {

}


input[type=file]:valid ~ .upload {
  display: none;
}
*/
ul.document-criteria-list > li {
  font-size: var(--font-m);
  margin: var(--margin-m) 0 var(--margin-m) var(--margin-l);
}

.files-wrapper {
  display: flex;
  gap: var(--padding-half);
  justify-content: space-evenly;
  flex-wrap: wrap;
}
label.file-input-wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--padding);
  justify-content: space-evenly;
  text-align-last: center;
  flex: 0 1 25%;
}

.or {
  align-self: center;
  font-size: var(--font-xl);
  opacity: .2;
  text-align: center;
  flex: 0 1 auto;
}

@media screen and (min-width: 1024px) {
  .files-wrapper { flex-wrap: nowrap; }
}

@media screen and (max-width: 1024px) {
  .files-wrapper { flex-wrap: wrap; }
  .or { flex: 1 0 100%; }
}

img.file-input-preview[src] {
  max-height: 50vh;
  max-width: 100%;
  object-fit: cover;
  margin: auto;
}
img.file-input-preview[src=""] {
  display: none;
}


.file-input-wrapper:focus ~ .file-input-wrapper, .file-input-wrapper:active ~ file-input-wrapper, .file-input-wrapper:focus-within ~ .file-input-wrapper {
  opacity: .1;
}

.onboarding-form input:invalid {
  border-color: unset;
}

input[type=file]::file-selector-button {
  display: block;
  min-height: 1.2em;
  font-size: var(--font-m);
  padding: 12px 24px;
  border: 0;
  border-radius: 6px;
  background-color: var(--color-main);
  color: #fff;
  cursor: pointer;
  margin: auto;
}

.try-again {
  width: 100%;
  margin: 12px 0;
  padding: 12px 0;
}

.pep-details {
  margin-bottom: var(--margin-l);
}

.pep-details[open] summary {
  display: none;
}
.payment-method {
  text-align: center;
}
label.payment-method img {
  max-width: 75%;
}

label.payment-method {
  font-size: var(--font-l);
  justify-content: space-evenly;
  align-items: center;
  color: black;
  height: 100%;
  border-radius: 6px;
  text-overflow: ellipsis;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.payment-method {
  border: 1px solid #CFCDC4;
}
.payment-method-card {
  position: relative;
  min-height: 15vh;
}
.payment-methods-cards input[type="radio"]:checked {
  border-radius: 6px;
  box-shadow: 0px 0px 6px #0085ff;
}
.payment-methods-cards input[type="radio"] {
  padding: 0;
  margin: 0;
  -webkit-appearance: none;
  appearance: none;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  border: none;
  /* position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  cursor: pointer;
  margin: unset;
  width: unset;
  height: unset; */
}

.payment-method input[type="radio"]:checked {
  border: 2px solid #000000
}


/* media queries for mobile, tablet, desktop */
.payment-methods-cards {
  grid-template-columns: repeat(5, minmax(0, 20%));
}

@media screen and (max-width: 1024px) {
  .payment-methods-cards {
    grid-template-columns: repeat(4, minmax(0, 25%));
  }
}

@media screen and (max-width: 690px) {
  .payment-methods-cards {
    grid-template-columns: repeat(3, minmax(0, 33%));
  }
  label.payment-method {
    font-size: var(--font-m);
  }
}
@media screen and (max-width: 480px) {
  .payment-methods-cards {
    grid-template-columns: repeat(2, minmax(0, 50%));
  }
  label.payment-method {
    font-size: var(--font-m);
  }
}
@media screen and (max-width: 430px) {

  .payment-methods-cards {
    grid-template-columns: repeat(1, minmax(0, 100%));
  }
  .payment-methods-cards label.payment-method {
    font-size: var(--font-m);
  }
  .payment-methods-cards label.payment-method img {
    max-height: 5vh;
  }

  .payment-methods-cards .payment-method-card {
    min-height: 10vh;
  }
}
@keyframes pleaseWait {
  from {
    background-color: var(--color-spinner-primary);
  }
  to {
    background-color: var(--color-spinner-secondary);
  }
}

.spinnerWrapper {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  backdrop-filter: blur(1px);
  -webkit-backdrop-filter: blur(1px);
  background-color: rgba(238, 238, 238, .75);
  z-index: 1000;
}

body.spinner-blocked {
  cursor: wait;
  overflow:hidden;
}
body.spinner-blocked:before {
  content: " ";
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  backdrop-filter: blur(.5px);
  background: rgba(0, 0, 0, 0.5);
  user-select: none;
  pointer-events: none;
}
#spinner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: 99;
  background-color: transparent;
}

#spinner::after {
  content: ' ';
  width: 86px;
  height: 86px;
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;

  mask-image: var(--voima-lion-logo);
  mask-repeat: no-repeat;
  mask-position: center;

  -webkit-mask-image: var(--voima-lion-logo);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;

  animation-name: pleaseWait;
  animation-duration: 0.809s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

#spinner::before {
  content: ' ' attr(data-spinner-text);
  width: 184px;
  height: 176px;
  background: rgba(255,255,255,.98);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 25px;
  display: flex;
  justify-content: center;
  align-items: end;
  padding-bottom: 14px;
}
.spinner:not(#spinner)::after {
  content: ' ' attr(data-spinner-text);
}

.small-spinner {
  flex: 1;
  align-self: center;
  justify-content: center;
  width: 86px;
  height: 86px;
  mask-image: var(--voima-lion-logo);
  mask-repeat: no-repeat;
  mask-position: center;

  -webkit-mask-image: var(--voima-lion-logo);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;

  animation-name: pleaseWait;
  animation-duration: 0.809s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
body.theme_matrix::before {
  content: "";
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  z-index: -1;
  /* background-color: rgba(0,200,150,0.5); */
}

body.theme_matrix {
  background-image: var(--background-matrix);

  --line-height-s: 1;
  --line-height-m: 1.25;
  --line-height-l: 1.5;

  --font-size-xs: 16px;
  --font-m: 18px;
  --font-l: 24px;
  --font-xl: 36px;
  --font-xxl: 48px;

  --border-width-xs: 1px;
  --border-width-s: 3px;
  --border-width-m: 4px;
  --border-width-l: 8px;

  --border-radius-default: 2px;

  --font-family: Arial, "Courier New", sans-serif;

  --padding: 24px;
  --padding-half: 12px;
  --padding-s: 18px;

  --margin-s: 6px;
  --margin-m: 12px;
  --margin-l: 24px;
  --margin-xl: 48px;

  --column-gap: 24px;

  /* COLORS */
  --color-default: rgba(100,217,53, .7);

  --color-main: var(--color-default);
  --color-disabled: rgba(0,0,0,0.15);
  --color-background: #CFCDC4;
  --color-background-body: rgba(87,188,50,.6);
  --color-background-highlight: #ffffff;

  --color-highlight: #000000;

  --color-emphasize: #000000;
  --color-success: #5baf01;
  --color-interactive: #0c6cd9;
  --color-issue: #E02020;
  --color-alert: #f7b500;
  --color-modal-background: #DDDCD7;

  --color-spinner-primary: #000000;
  --color-spinner-secondary: #ffffff;

  --color-old-blue: #0D2240;

  --border-color: #000000;
  --color-input-text: var(--color-main);
  --color-input-background: var(--color-emphasize);
  --text-color: var(--color-emphasize);

  --video-default-width: 1280;
  --video-default-height: 720;

  --input-height: 50px;

  --icon-size: 24px;
/*
  --layout-margin: calc((100vw - var(--content-width)) / 2); */

  --nav-height: 130px;

  --transition-duration: .33s;

  --avatar-bg-image: var(--background-matrix);
  --avatar-bg-repeat: unset;
  --avatar-bg-size: 550px;
  --avatar-bg-pos-y: 0px;
  --avatar-bg-anim: matrix-code;
  --avatar-bg-anim-duration: 3s;
}

@keyframes matrix-code {
  10% {--avatar-bg-pos-y: 10px ;}
  20% {--avatar-bg-pos-y: 20px ;}
  30% {--avatar-bg-pos-y: 30px ;}
  40% {--avatar-bg-pos-y: 40px ;}
  50% {--avatar-bg-pos-y: 50px ;}
  60% {--avatar-bg-pos-y: 60px ;}
  70% {--avatar-bg-pos-y: 70px ;}
  80% {--avatar-bg-pos-y: 80px ;}
  90% {--avatar-bg-pos-y: 90px ;}
}

body.theme_matrix a, body.theme_matrix button{
  text-shadow: 0px 0px 12px black, 0px 0px 18px black;
}

body.theme_matrix .btn-transaction {
  text-shadow: none;
}

/* :root, voima-layout {
  --content-width: min(100vw, 1024px);
}  */

/* @media (prefers-color-scheme: dark) {
  body { */

  /* COLORS */
  /* --color-default: #3333FF;

  --color-main: var(--color-default);
  --color-disabled: grey;
  --color-background: #444444;
  --color-background-highlight: #ffffff;

  --color-highlight: #ffffff;

  --color-emphasize: #ffffff;
  --color-success: #5baf01;
  --color-interactive: #0c6cd9;
  --color-issue: #E02020;
  --color-alert: #f7b500;
  --color-modal-background: #DDDCD7;

  --color-spinner-primary: #000000;
  --color-spinner-secondary: #ffffff;

  --color-old-blue: #0D2240;

  --border-color: #ffffff;
  }
} */
* {
  --font-ridiculous: 96px;
  --font-xxxl: 70px;
  --font-xxl:  48px;
  --font-xl:   36px;
  --font-l:    24px;
  --font-m:    18px;
  --font-s:    12px;
}


@media (max-width:690px) {
  * {
    --font-ridiculous: var(--font-xxl);
    --font-xxxl: var(--font-xl);
  }
}

body {
  font-size: var(--font-s);
}

h1, h2, h3, h4, h5, h6 {
  padding-bottom: 5px;
}
h1 {
  font-weight: normal;
  font-size: var(--font-xl);
  padding-bottom: 5px;
}

section h1:first-child, h2:first-child {
  margin-bottom: 0.5em;
}


section h1, h2 {
  border-bottom: 4px solid #000;
  margin-top: var(--padding);
  margin-bottom: 0;
  font-size: var(--font-m);
  font-weight: 600;
}

h1.huge {
  font-size: 42px;
}

h3, .h3 {
  font-size: var(--font-xl);
}

h4, .h4 {
  font-size: var(--font-l);
}

.h3, .h4 {
  font-weight: normal;
  border-bottom: none;
}

.text-center { text-align: center; }
.text-right  { text-align: right;  }
.text-left   { text-align: left;   }

.text-xxl { font-size: var(--font-xxl); }
.text-xl  { font-size: var(--font-xl);  }
.text-l   { font-size: var(--font-l);   }
.text-m   { font-size: var(--font-m);   }
.text-s   { font-size: var(--font-s);   }

.text-bold { font-weight: 700; }
.text-slim { font-weight: 300; }

.text-xxl, .text-xl, .text-l, .text-m, .text-s {
  transition: font-size 0.3s ease-in-out;
}

.bold {
  font-weight: 600;
}

.block {
  display: block;
}

.white-space-pre {
  white-space: pre;
}

/*@media (min-width: 691px) {*/
  .white-space-pre-wide {
    white-space: pre;
  }
/*}*/

a {
  text-decoration: none;
}

.underline {
  text-decoration: underline;
}

.record-list h2 {
  margin-top: 0;
}

.record-list h3, .record-list p {
  font-size: var(--font-m);
  margin: var(--margin-m) 0;

}

.record-list h3 {
  margin-bottom: 0;
}

@media (max-width:320px) { /* iPhone 4 */
  * {
    --font-ridiculous: 48px;
    --font-xxxl: 36px;
    --font-xxl:  36px;
    --font-xl:   24px;
    --font-l:    22px;
    --font-m:    18px;
    --font-s:    12px;
  }
}


.reserved-balance {
  margin-top: -18px;
}
.parenthesize:before { content: "(" }
.parenthesize:after { content: ")" }
ul {
  margin-block-start: 0;
  margin-block-end: 0;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 0px;
}

p {
  margin: var(--margin-l) 0;
}

button {
  font-family: var(--font-family);
}

input {
  font-family: var(--font-family);
}
@font-face {
  font-family: "Roboto Light";
  src: url(/assets/Roboto-Light-2ad2b3958b10fead7e6b8acda5108d09d59192eac6e8a6c4837dad70b105c1fd.ttf);
}

html {
  background-image: none;
  background-size: none;

  --line-height-s: 1;
  --line-height-m: 1.25;
  --line-height-l: 1.5;

  --border-width-xs: 1px;
  --border-width-s: 3px;
  --border-width-m: 4px;
  --border-width-l: 8px;

  --border-radius-default: 6px;
  --border-radius-card: 24px;
  --border-radius-double: 48px;

  --font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
  --font-roboto: "Roboto Light", sans-serif;

  --padding: 24px;
  --padding-half: 12px;
  --padding-s: 18px;

  --margin-s: 6px;
  --margin-m: 12px;
  --margin-l: 24px;
  --margin-xl: 48px;
  --margin-xxl: 96px;

  --content-grid: [left] minmax(1px, auto) [content] auto [right] minmax(1px, auto);

  --grid-gap: 24px;
  --grid-gap-m: calc(var(--grid-gap) / 2);
  --grid-gap-s: calc(var(--grid-gap-m) / 2);

  --column-gap: var(--grid-gap);
  --column-gap-m: calc(var(--grid-gap) / 2);
  --column-gap-s: calc(var(--grid-gap-m) / 2);

  --row-gap: var(--grid-gap);
  --row-gap-m: calc(var(--row-gap) / 2);
  --row-gap-s: calc(var(--row-gap-m) / 2);

  --avatar-height: 120px;

  --voima-logo-height: 36px;
  --round-icon-size: 52px;

  /* COLORS */
  --color-default: #000000;

  --color-main: var(--color-default);
  --color-disabled: rgba(0,0,0,0.15);
  --color-background: #ffffff;
  --color-background-body: #d5d5d5;
  --color-panel-selected: #f2f2f2;
  --color-panel: #d9d9d9;
  --color-background-highlight: #ffffff;

  --color-highlight: #ffffff;

  --color-section-separator: #868686;

  --color-emphasize: #000000;
  --color-success: #00AD00;
  --color-interactive: #0c6cd9;
  --color-issue: #FF2E00;
  --color-alert: #FFDE00;
  --color-modal-background: #DDDCD7;

  --color-spinner-primary: #000000;
  --color-spinner-secondary: #ffffff;

  --color-old-blue: #0D2240;

  --border-color: #000000;
  --color-input-text: var(--color-emphasize);
  --color-input-background: var(--color-background-highlight);
  --text-color: var(--color-emphasize);
  --alert-text-color: var(--color-emphasize);

  --video-default-width: 1280;
  --video-default-height: 720;

  --input-height: 50px;
  --toggle-switch-height: 24px;

  --icon-size: 24px;
/*
  --layout-margin: calc((100vw - var(--content-width)) / 2); */

  --header-height: 137px;

  --transition-duration: .33s;

  --avatar-image-height: 120px;
  --avatar-image-width: 120px;
  --avatar-bg-image: var(--voima-lion-logo);
  --avatar-bg-repeat: no-repeat;
  --avatar-bg-size: 72px;
  --avatar-bg-pos-y: center;
  --avatar-bg-anim: none;
  --avatar-bg-anim-duration: unset;

  --settings-remote-link-width: 100px;
}

@media (max-width: 690px) {
  * {
    --voima-logo-height: 24px;
  }
}
/* :root, voima-layout {
  --content-width: min(100vw, 1024px);
}  */

/* @media (prefers-color-scheme: dark) {
  html { */

  /* COLORS */
  /* --color-default: #509AFF;

  --color-main: var(--color-default);
  --color-disabled: grey;
  --color-background: #0B0C0F;
  --color-background-body: #222328;
  --color-background-panel: #45464F;
  --color-background-highlight: #7a7a7a;

  --color-highlight: #000000;

  --color-emphasize: #ffffff;
  --color-success: #009D00;
  --color-interactive: #509AFF;
  --color-issue: #DF2E00;
  --color-alert: #EFCE00;
  --color-modal-background: #30323B;

  --color-spinner-primary: #000000;
  --color-spinner-secondary: #ffffff;

  --color-old-blue: #0D2240;

  --border-color: var(--color-emphasize);
  --text-color: var(--color-emphasize);
  --alert-text-color: var(--color-highlight);
  }

  .voima-icon-lion > i {
    filter: invert(1);
  }
} */
::view-transition-old(root),
::view-transition-new(root) {
  opacity: 1;
}
.identities_edit {
  grid-gap: 0;
}

.identities_edit input:disabled {
  border: 0;
  color: #000;
  font-weight: 600;
  padding: 0;
}

.identities_edit form {
  grid-gap: 0;
}

.identities_edit span {
  text-overflow: ellipsis;
  overflow: hidden;
}

.identities_edit .avatar_image_input {
  margin: var(--padding) 0 calc(var(--padding) * 2) 0;
}
form.withdrawal label {
  margin-bottom: 0;
  margin-top: var(--padding);
}

form.withdrawal h2:not(:first-of-type) {
  margin-top: calc(var(--padding) * 2);
}

form.withdrawal label[for="withdrawal_amount"] {
  display: block;
  max-width: 280px;
}

.custom-withdraw-message {
  font-size: 14px;
    line-height: 24px;
    max-width: 600px;
    width: 100%;
    margin: 100px auto;
    text-align: center;
}
data.value {
  font-weight: bold;
}

.account data.value::after,
.account data.value::before {
  font-weight: normal;
  font-size: var(--font-xl);
}
data.value[data-format='%u %n']::before {
  content: attr(data-unit) " "
}
data.value[data-format='%n %u']::after {
  content: " " attr(data-unit)
}
data.value[data-format='%u%n']::before {
  content: attr(data-unit)
}
data.value[data-format='%n%u']::after {
  content: attr(data-unit)
}


.account .reserved-balance data.value, .account .reserved-balance data.value::before, .reserved-balance data.value::after {
  font-weight: normal !important;
  font-size: var(--font-s) !important;
}
.account .reserved-balance::before {
  content: "("
}
.account .reserved-balance::after {
  content: ")"
}
.account {
  flex: 1;
  display: grid;
  grid-template-columns: 1fr;
  grid-row-gap: var(--row-gap);
  align-items: center;
}

.account.wrapper-navigate { cursor: pointer; }

/* grid gaps used for layout so remove all possible margins / paddings */
.account h1, .account h2, .account h3, .account h4, .account h5, .account h6, .account p {
  margin: 0;
  padding: 0;
}
.account p { font-size: var(--font-s); }


.account a.wrapper-link {
  border-top: 1px solid #000;
  font-size: var(--font-m);
  line-height: 2.5;
}

.account data { height: var(--font-m); font-size: var(--font-m) }
.account data[size="0"], .account data[size="1"], .account data[size="2"], .account data[size="3"],
.account data[size="4"], .account data[size="5"], .account data[size="6"], .account data[size="7"],
.account data[size="8"], .account data[size="9"] {
  font-size: var(--font-xxl);
  height: var(--font-xxl);
}
.account data[size="10"], .account data[size="11"] {
  font-size: var(--font-xl);
  height: var(--font-xl);
}
.account data[size="12"] {
  font-size: var(--font-l);
  height: var(--font-l);
}

.account .account_action_link_collection {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-gap: 1px;
  overflow: hidden;
  border-radius: 10px;
  font-size: var(--font-s);
}

.account .account_action_link_collection a.account_action_link {
  text-align: center;
  background-color: var(--color-main);
  color: var(--color-highlight);
  border-radius: 3px;
}

.account .account_action_link_collection a.account_action_link.icon {
  background-position: center calc(var(--padding) / 2);
  padding-top: calc(var(--padding) * 2);
  padding-bottom: calc(var(--padding) / 2);
}

.account .account_action_link_collection a.account_action_link.disabled {
  pointer-events: none;
  user-select: none;
  opacity: .5;
}

.account .account_action_link_collection a {
  grid-column-end: span 2;
}

.account .account_action_link_collection a.half {
  grid-column-end: span 3;
}

.account .account_action_link_collection a.full {
  grid-column-end: span 6;
}

.account .account-header .white-space-pre-wide {
  white-space: initial;
}

@media (max-width: 690px) {
  body.dashboard-show #accounts > .account {
    border-bottom: 1px solid black;
  }
  body.dashboard-show .account {
    grid-template-columns: 1fr 2fr;
  }
  body.dashboard-show .account > .title:first-child {
    grid-row: 1;
    grid-column: 1;
  }

  body.dashboard-show .account data {
    grid-row: 1;
    grid-column: 2;
  }
  body.dashboard-show .account p.account-valuation-subtitle {
    grid-row: 2;
    grid-column: span 2;
  }

  body.dashboard-show .account a.wrapper-link {
    grid-row: 3;
    grid-column: span 2;
    margin-top: 0;
    border-top: none;
  }

  body.dashboard-show  .account h1:first-child, .account h2:first-child, .account h3:first-child {
    justify-self: left;
  }


  body.dashboard-show .account data { height: var(--font-m); font-size: var(--font-m) }
  body.dashboard-show .account data[size="0"],
  body.dashboard-show .account data[size="1"],
  body.dashboard-show .account data[size="2"],
  body.dashboard-show .account data[size="3"],
  body.dashboard-show .account data[size="4"],
  body.dashboard-show .account data[size="5"],
  body.dashboard-show .account data[size="6"],
  body.dashboard-show .account data[size="7"],
  body.dashboard-show .account data[size="8"] { font-size: var(--font-xl); height: var(--font-xl); }
  body.dashboard-show .account data[size="9"] { font-size: var(--font-xl); height: var(--font-l); }
  body.dashboard-show .account data[size="10"],
  body.dashboard-show .account data[size="11"],
  body.dashboard-show .account data[size="12"] { font-size: var(--font-l); height: var(--font-m); }

  body.dashboard-show .account data { height: var(--font-m); font-size: var(--font-m); }
}
#accounts .account .value {
  white-space: nowrap;
}

body.dashboard-show .account {
  text-align: right;
}

body.dashboard-show .account > .title:first-child { text-align: left; }

body.accounts-show p.account-valuation-subtitle {
  white-space: initial;
}

body.accounts-show .account {
  text-align: center;
}
body.accounts-show.avatar-shown .account {
  margin-top: 24px;
}


body.accounts-show .account nav.account_action_link_collection {
  justify-self: center;
  min-width: 300px;
  max-width: 480px;
}

.account-balances {
  display: flex;
  overflow: hidden;
}

.account-balances > span {
  flex: 1;
}
.avatar-label {
  grid-column-end: first;
  font-weight: 400;
  font-size: var(--font-s);
  padding-right: calc(var(--padding));
  margin: 0;
  align-self: center;
  cursor: pointer;
  /*margin-top: var(--margin-m);
  line-height: 1.9; */
}

[for="accountable_menu_toggle"] .avatar-label {
  background-image: var(--icon-chevron-down);
  background-position: center right;
  background-repeat: no-repeat;
}

.avatar-image {
  height: var(--avatar-height);
  width: var(--avatar-height);
  border-radius: 50%;
  border: 4px solid var(--color-highlight);
  box-sizing: border-box;
  background-color: var(--color-main);
  object-fit: cover;
}

.avatar-actions-wrapper {
  position: relative;
  display: flex;
  justify-content: center;
  grid-column: last;
  align-self: center;
  grid-row: span 2;
}

@media screen and (min-width: 691px) {
  .avatar-wrapper {
    text-align: center;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr)
  }
  .avatar-wrapper p {
    white-space: nowrap;
  }
}

@media screen and (max-width: 690px) {
  .avatar-wrapper {
    position: relative;
    display: grid;
    grid-template-columns: [left] auto [avatar] min-content [right] auto;
    grid-template-rows: 46px 46px;
  }


  .avatar-wrapper .avatar-actions-wrapper {
    grid-column: avatar;
  }

  .avatar-wrapper p {
    position: absolute;
    bottom: 25%;
    grid-column: right;
    left: calc(var(--padding-half) * -1);
  }
}
.avatar_image_input {
  margin-bottom: calc(var(--padding) * 1.2);
}

.avatar_image_input [type="file"] {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}

.avatar_image_input span {
  display: block;
  margin-bottom: calc(var(--padding) / 4)
}

.avatar_image_input img {
  float: left;
  margin-right: var(--padding);
  border: 2px solid var(--color-main);
  object-fit: cover;
}

.avatar_image_input_confirmation_container {
  display: none;
}

.avatar_image_input_confirmation_container button:first-of-type {
  margin-right: var(--padding);
  margin-bottom: var(--padding)
}
.biometric-actions.missing-current-state a {
  display: none;
}
.biometric-actions.is-enabled #biometric-enable {
  display: none;
}
.biometric-actions.is-enabled #biometric-disable {
  display: block;
}
.biometric-actions span {
  align-self: center;
}
.button-component, .button-component.cta {
  --btn-bg: var(--color-main);
  --btn-color: var(--color-background);
}

.button-component {
  display: grid;
  align-content: center;
  background-color: var(--btn-bg);
  color: var(--btn-color);
  border-radius: 6px;
  cursor: pointer;
  appearance: button;
  -webkit-appearance: none;
  cursor: pointer;
  text-decoration: none;
}

.button-component, .button-component.m {
  margin: 0;
  height: unset;
  font-size: var(--font-m);
  padding: 12px 18px;
}
.button-component.icon :first-child {
  grid-column: span 2;
}
.button-component.icon {
  grid-template-columns: 0fr 1fr 24px;
}

.button-component.outline {
  --btn-bg: var(--color-background);
  --btn-color: var(--color-main);
  border: 2px solid var(--input-border-color);
}
.button-group-component {
  display: grid;
  gap: var(--row-gap);
  grid-template-columns: 1fr 1fr 1fr;
}

.button-group-component .button-component.left { grid-area: 1; }
.button-group-component .button-component.center { grid-column: 2; }
.button-group-component .button-component.right { grid-column: 3; }

@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 690px) {
  .button-group-component { grid-template-rows: repeat(1fr); }
  .button-group-component .button-component.left { grid-column: span 3; }
  .button-group-component .button-component.center { grid-column: span 3; }
  .button-group-component .button-component.right { grid-column: span 3; }

  .button-group-component .button-component:first-child + .button-component:last-child { grid-row: 2; }
  .button-group-component .button-component + .button_component + .button-component.right { grid-row: 1; }
  .button-group-component .button-component + .button-component.center { grid-row: 2; }
  .button-group-component .button-component.left { grid-row: 3; }

  .button-group-component .button-component.center:first-child { grid-row: 1; }
  .button-group-component .button-component.right:first-child { grid-row: 1; }

}
@media screen and (max-width: 480px) {
}
.cart-component form > .actions > svg:first-child {
  grid-column: 1;
  grid-row: 1;
}

.cart-component ul.cart-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-bottom: 36px;
}
.cart-component ul.cart-list li {
  gap: 8px;
  align-items: center;
}
.cart-component ul.cart-list li.cart-product {
  display: grid;
  grid-template-columns: 100px 1fr min-content;
  padding: 4px;
}
.cart-component ul.cart-list li.cart-product .thumbnail {
  grid-column: 1;
  background-color: var(--color-panel);
}
.cart-component .details data.value {
  font-weight: unset;
}

.cart-component ul.cart-list li.cart-product .details {
  grid-column: 2;
  grid-column: 2;
  display: flex;
  flex-direction: column;
  align-self: start;
    text-align: left;

}
.cart-component ul.cart-list li.cart-product .actions {
  grid-column: 3;
}

.cart-component ul li {
  border-bottom: none;
}
.cart-component ul.cart-list li.cart-product + li.cart-product  {
  padding-bottom: 8px;
  border-top: none;
}
.cart-component ul.cart-list li .details {
}
.cart-component ul.cart-list li .details .description {
  margin-bottom: var(--margin-s);
}
.cart-component ul.cart-list li img.thumbnail {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 4px;
  align-self: start;
}
.cart-component ul.cart-list li.cart-product .details .amounts, .cart-component ul.cart-list li.cart-product .details .description {
  flex: 1;
}
.cart-component ul li .actions {
  display: grid;
  grid-template-areas:  "qty add"
                        "qty sub";
  gap: 4px;
  align-items: center;
  align-self: start;
}
.cart-component ul li .actions .sub, .cart-component ul li .actions .add {
  width: 42px;
  height: 42px;
}
.cart-component ul li .actions .add { grid-column: add; grid-row: add;}
.cart-component ul li .actions .qty { grid-column: qty; grid-row: qty; }
.cart-component ul li .actions .sub { grid-column: sub; grid-row: sub;}

.cart-component ul li .actions > label { display: unset; margin: unset; }
.cart-component ul li .actions .field_with_errors input {
  border: 1px solid red;
}

.cart-component label[disabled="disabled"] {
  opacity: 0.5;
  pointer-events: none;
}

.cart-component ul li .actions input {
  border: none;
}
.cart-component ul li .actions input:not([type=submit]) {
  max-width: 88px;
  min-width: 64px;
  padding-right: var(--padding);
  text-align: right;
}

.cart-component .actions input[type="number"] {
    -webkit-appearance: textfield;
       -moz-appearance: textfield;
            appearance: textfield;
  }
.cart-component .actions input[type=number]::-webkit-inner-spin-button,
.cart-component .actions input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

.cart-component .checkbox-field label {
  user-select: none;
  cursor: pointer;
}


.cart-component ul.cart-list li.summary-row {
  display: grid;
}
.cart-component ul.cart-list li.config-row {
  display: grid;
  margin-top: 20px;
  justify-content: end;
}
.cart-component ul.cart-list li.summary-row ul.summary-total-price li.err { color: red; }

.cart-component ul.cart-list li.summary-row .summary-title {
  grid-row: 1;
  grid-column: span 3;
}
.cart-component ul.cart-list li.summary-row .summary-total-price {
  grid-row: 2;
  grid-column: span 3;
  margin-bottom: var(--margin-l);
  text-align: end;
  display: flex;
  flex-direction: column;
  gap: var(--margin-m);
}
.cart-component ul.cart-list li.summary-row .summary-total-price li div:first-child {
  text-align: left;
}

.cart-component ul.cart-list li.summary-row .summary-total-price li {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid #e0e0e0;
}

.cart-component ul.cart-list li.cart-product {
  transition: all 0.5s;
}


@media screen and (max-width: 690px) {
  .cart-component ul.cart-list li.cart-product .actions {
    grid-template-areas:  "qty add"
                          "qty sub";
  }
}
@media screen and (max-width: 480px) {
  .cart-component ul.cart-list li.cart-product .actions {
    grid-template-areas:  "qty add"
                          "qty sub";
    max-width: max-content;
    justify-self: end;
  }
  .cart-component ul.cart-list li.cart-product .details {
    grid-row: 2;
    grid-column: 1 / span 2;
  }
  .cart-component ul.cart-list li.cart-product .actions {
    grid-column: 2 / span 2;
  }
  .cart-component ul.cart-list li.cart-product {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: min-content 1fr;
  }

}
.copy-button {
  position: relative;
  transform-style: preserve-3d;
  padding-left: 2.5em;
  background-position: 17px center;
}

@keyframes notify {
  0% {
    top: 0;
  }
  25%, 50% {
    top: -1.25em;
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.copy-button > .button-notification {
  position: absolute;
  top: -1.25em;
  animation-name: notify;
  animation-duration: 2s;
  left: 50%;
  transform: translateX(-50%) translateZ(-10px);
  color: #000;
}
.current_exchange_rate.inline {
  display: inline;
}
.dashboard_accounts #accounts {
  display: flex;
  justify-content: space-between;
  gap: var(--column-gap);
}


.dashboard_accounts #accounts { flex-direction: column; }


@media (min-width: 691px) {
  .dashboard_accounts #accounts { flex-direction: row; }
}
table.activities tr {
  padding: var(--padding-half) 0;
  column-gap: var(--column-gap);
}

table.activities data {
  font-weight: 600;
}

table.activities td {
  text-overflow: ellipsis;
  padding: calc(var(--grid-gap) / 2) calc(var(--grid-gap) / 10);
}

table.activities td.icon {
  padding-left: var(--padding);
  background-size: 18px;
  background-position: left center;
  background-repeat: no-repeat;
}

table.activities td.icon.status {
  padding-left: 20px;
}

table.activities .balance-wrapper {
  white-space: nowrap;
}
.details {
  text-align: right;
}

table.activities td.attachment-link a svg {
  height: 15px;
}

table.activities td.attachment-link .icon {
  background-position: right top;
  background-size: 18px;
  height: 20px;
  width: 20px;
  display: block;
  margin: 0;
  float: right;
}

@media (max-width: 1024px) {
  table.activities .time {
    font-size: var(--font-s);
  }

}

@media (min-width: 1025px) {
  table.activities .subject {
    font-weight: 600;
  }
}

@media (max-width: 580px) {
  table.activities tr {
    column-gap: calc(var(--column-gap)/2);
  }

  table.activities td.icon.status {
    font-size: 0;
  }
}
form[data-controller="exchange-component"] {
}

form[data-controller="exchange-component"] input[readonly] {
  border-color: silver;
}

.exchange-rate-card {
  text-align: right;
}

.exchange-rate-card .flex span {
  flex-grow: 1;
}

form[data-controller="exchange-component"] input[type="submit"][name="update"] {
  grid-column: 2 / 4;
  text-align: center;
}

@media screen and (max-width: 1024px) {
  .exchange-rate-card {
    text-align: left;
    padding-top: calc(var(--padding)/2);
    border-top: 1px solid var(--color-main);
  }

  .exchange-rate-card.tablet-align-right {
    text-align: right;
  }

  .exchange-rate-card.tablet-no-border {
    border: none;
  }
  .exchange-rate-card .flex span {
    flex-grow: 0;
  }
}

@media screen and (max-width: 690px) {
  .exchange-rate-card {
    text-align: left;
  }

  .exchange-rate-card.tablet-align-right {
    text-align: left;
  }

  .exchange-rate-card.tablet-no-border {
    border-top: 1px solid var(--color-main);
  }
  form[data-controller="exchange-component"] input[type="submit"][name="update"] {
    grid-column: 1 / 3;
  }
}
body.withdrawals-new {

}
.funnel-page-component.icon-label {
  grid-column: content;
}
ul.funnel-page-component {
  grid-column: content;
  list-style: none;
}
ul.funnel-page-component a > svg {
  max-width: 30px;
  vertical-align: middle;
  margin-right: 8px;
}
data.gold_price:not([value]),
data.gold_price[value="0"] {
  opacity: 0;
}

data.gold_price {
  margin-top: var(--padding);
  font-size: var(--font-xl);
}

data.gold_price strong {
  font-size: var(--font-xxl);
}
header.top-navigation {
  transition: height 0.3s ease-in-out
}

header.top-navigation .header-top {
  transition: 0.3s ease-in-out;
}


.top-navigation,
.top-navigation .hamburger-menu {
  grid-template-columns: [left] minmax(0, auto) [content] minmax(0, 1024px) [right] minmax(0, auto);
  grid-column-start: left;
  grid-column-end: span 3;
}

.top-navigation {
  display: grid;
  position: relative;
  background-color: var(--color-main);
}

.top-navigation .hamburger-menu {
  display: none;
  padding-bottom: var(--padding);
}

.top-navigation .hamburger-menu button {
  color: var(--color-main);
}

#hamburger_menu_toggle:checked ~ .hamburger-menu {
  display: grid;
}
#accountable_menu_toggle:checked ~ .accountable-menu {
  display: block;
}

.backdrop-menu-toggle {
  display: none;
  position: fixed;
  z-index: 3;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

#hamburger_menu_toggle:checked ~ .backdrop-menu-toggle,
#accountable_menu_toggle:checked ~ .backdrop-menu-toggle {
  display: block;
}

.top-navigation > *,
.top-navigation .hamburger-menu > * {
  grid-column: content;
}

.header-top form {

}

.top-navigation label.icon,
.top-navigation button.icon {
  display: flex;
  align-items: center;
  grid-row: 2;
  font-size: var(--font-s);
  line-height: 1;
  cursor: pointer;
  height: 18px;
  box-sizing: border-box;
  align-self: center;
  font-weight: 300;
}

.top-navigation label {
  margin: 0;
}

.top-navigation input {
  display: none;
}

.top-navigation ul {
  list-style-type: none;
}

.top-navigation li li {
  margin: calc(var(--padding) * 1.5) 0 calc(var(--padding) * 1.5) 0;
}

.top-navigation .icon {
  padding: calc(var(--padding) / 6) 0 calc(var(--padding) / 6) calc(var(--padding) * 1.5);
  background-size: contain;
}

.top-navigation .icon-burger,
.top-navigation .icon-close,
.top-navigation .icon-chevron-left {
  padding: calc(var(--padding) / 6) 0 calc(var(--padding) / 6) calc(var(--padding));
  background-size: 18px;
  background-position: center left;
}

@media (max-width:690px) {
  .top-navigation .icon.icon-burger,
  .top-navigation .icon.icon-close,
  .top-navigation button.icon.icon-chevron-left {
    font-size: 0;
    height: 18px;
  }

  .top-navigation .hamburger-menu > ul > .hamburger-menu-toggle-container {
    grid-column-end: span 1;
    display: flex;
  }
  .top-navigation .icon-close {
    height: 18px;
  }
}

.top-navigation .icon.icon-external_link {
  padding: 0 var(--padding) 0 0;
}

.top-navigation .icon-logout {
  font-size: var(--font-s);
  background-color: transparent;
}

.top-navigation .header-top {
  display: grid;
  position: relative;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: 1fr 1fr 1fr;
  padding: 0 var(--padding);
  background-color: var(--color-main);
  color: var(--color-background);
}

.top-navigation .accountable-menu {
  display: none;
  position: absolute;
  z-index: 3;
  top: 100%;
  right: 10px;
  box-sizing: border-box;
  width: 33%;
  padding: calc(var(--padding) * 2.5) var(--padding) var(--padding);
  border-radius: 10px;
  background-color: var(--color-main);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.top-navigation [for="accountable_menu_toggle"] {
  grid-row: 3;
  position: absolute;
  z-index: 4;
  right: 0;
  top: calc(var(--header-height) / 3 - (var(--avatar-height) / 3 * 1.75));
  padding-right: calc(var(--padding) + 10px);
  color: var(--color-main);
}

@media (max-width: 1024px) {
  .top-navigation .accountable-menu {
    width: calc(50% - 10px);
  }
}

@media (max-width:690px) {
  .main-grid {
    padding-top: 24px;
  }
  .dashboard-show .main-grid {
    grid-row-gap: 48px;
  }
  .top-navigation [for="accountable_menu_toggle"] {
    position: absolute;
    right: initial;
    grid-row: 2;
    grid-column-start: 1;
    grid-column-end: 4;
    grid-row: 3;
    top: calc(var(--half-padding) * -1);
    padding-right: 0;
    width: 100%;
  }

  .top-navigation .accountable-menu {
    /*padding-top: calc(var(--header-height) + var(--avatar-height) * 0.75);*/

    left: 0;
    right: 0;
    width: 100%;
    box-sizing: border-box;
  }

  .top-navigation .hamburger-menu {
    /* padding-top: var(--padding); */
  }
}

.top-navigation .accountable-menu .avatar-label,
.top-navigation label[for="hamburger-menu-open"],
.top-navigation .accountable-menu a,
#accountable_menu_toggle:checked ~ [for="accountable_menu_toggle"] {
  color: var(--color-background);
}

.top-navigation .hamburger-menu {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 99;
  box-shadow: 0px 0px 120px rgba(0, 0, 0, 0.1);
  background-color: var(--color-background);
  color: var(--color-main);
  --color-highlight: #000;
}

.top-navigation .hamburger-menu .euro {
  order: 3;
}

.top-navigation .hamburger-menu span {
  display: block;
  border-bottom: 3px solid var(--color-main);
  font-size: var(--font-m);
  font-weight: 600;
}

.top-navigation .hamburger-menu > ul {
  display: grid;
  grid-template-columns:
    1fr 1fr
    1fr 1fr
    [user] 1fr 1fr;
  grid-template-rows: auto auto auto;
  grid-gap: var(--padding);
  padding: calc(var(--header-height) / 2.5) var(--padding) var(--padding);
}

.top-navigation .hamburger-menu > ul > * {
  grid-column-end: span 2;
}

.top-navigation .hamburger-menu .user-menu {
  grid-column-start: user;
  grid-row-start: 1;
  grid-row-end: 4;
  margin-top: 0;
  padding-right: 10px;
}

@media (max-width:1024px) {
  .top-navigation .hamburger-menu > ul {
    grid-template-columns:
      1fr 1fr 1fr
      [user] 1fr 1fr 1fr
  }
  .top-navigation .hamburger-menu > ul > .hamburger-menu-toggle-container {
    display: flex;
    grid-column-end: span 2;
    grid-row-start: 1;
  }
  .top-navigation .hamburger-menu > ul > .logo {
    grid-column-end: span 2;
    grid-row-start: 1;
    grid-column-start: 3;
  }
  .top-navigation .hamburger-menu .user-menu {
    grid-row-start: 1;
    grid-row-end: 5;
  }
  .top-navigation .hamburger-menu > ul > * {
    grid-column-end: span 3;
  }
}

@media (max-width:690px) {
  .top-navigation .hamburger-menu > ul {
    grid-template-columns: repeat(6, 1fr);
  }
  .top-navigation .hamburger-menu > ul > *,
  .top-navigation .hamburger-menu .user-menu {
    grid-column-start: 1;
    grid-column-end: 7;
    grid-row: initial;
  }
  .top-navigation .hamburger-menu .user-menu {
    border-top: 1px solid black;
    padding-top: var(--row-gap);
  }
  .top-navigation .hamburger-menu .euro {
    order: initial;
  }
  .top-navigation .hamburger-menu > ul > .hamburger-menu-toggle-container {
    grid-column-end: span 2;
  }
  .top-navigation .hamburger-menu > ul > .logo {
    grid-column-start: 2;
    grid-column-end: span 4;
  }
}

.top-navigation .hamburger-menu .user-menu li:first-of-type {
  margin-top: 0;
}

.logo_wrapper {
  display: flex;
  justify-content: center;
  grid-column: 2;
  grid-row: 2;
}

.logo_wrapper > a {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
}

.voima-logo {
  transition: height 0.3s ease-in-out;
}
.voima-logo {
  height: var(--voima-logo-height);
}

.top-navigation .locale {
  margin: auto;
}

.top-navigation .locale li {
  display: inline-block;
  margin: 0 3px 0 0;
  padding: 0 8px 0 0;
  border-right: 1px solid var(--color-background);
}

.top-navigation .locale li:last-of-type {
  border-right: 0;
  margin: 0;
  padding: 0;
}

.top-navigation .locale a {
  color: #fff;
  text-decoration: underline;
}

.top-navigation .locale .selected {
  text-decoration: none;
}
body:not(.context-accountable) .top-navigation .header-top .logo_wrapper {
  grid-column: 2;
}
body:not(.context-accountable) .top-navigation .header-top .button_to {
  align-self: center;
  grid-column: 1;
}
body:not(.context-accountable) .top-navigation .header-top .locale {
  grid-column: 3;
}
body .top-navigation .header-top .button_to,
body:not(.context-accountable) .top-navigation .header-top .logo_wrapper,
body:not(.context-accountable) .top-navigation .header-top .locale {
  align-self: center;
  grid-row: 2;
}

@media (max-width: 690px) {
  .top-navigation {
    margin-top: -24px;
    /*top: -24px;*/
  }
  .notification-container:not(:empty) + .top-navigation {
    margin-top: 0;
  }
  body:not(.context-accountable) .top-navigation {
    /* padding-bottom: var(--padding); */
    margin-bottom: 0;
  }
  /* body:not(.context-accountable) .top-navigation .header-top {
    grid-template-rows: 1fr 1fr 1fr;
    grid-template-columns: 1fr 2fr 1fr;
  } */
  body:not(.context-accountable) .top-navigation .header-top .locale {
    grid-column: span 3;
    grid-row: 3;
  }
  .top-navigation .locale {
    grid-column: 1;
    grid-row: 3;
    /* margin: var(--padding) auto 0 auto; */
  }
  .top-navigation .avatar-image { transform: scale(0.75); }
}

header.top-navigation {
  height: var(--header-height);
}

header.top-navigation .icon-logout {
  font-weight: unset;
}
.icon-label {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.icon-label svg {
  height: 52px;
  min-width: 52px;
}

.icon-label p {
  margin: 0;
  padding: 0;
}

.icon-label.top-label{
  flex-direction: column-reverse;
}

.icon-label.left-label {
  flex-direction: row-reverse;
}

.icon-label.right-label {
  flex-direction: row;
}

.icon-label.icon-border svg{
  border: 1px solid var(--color-main);
}

.icon-label.icon-border.round svg{
  border-radius: 50%;
}

.icon-label.icon-s svg {
  height: 24px;
  min-width: 24px;
}

.icon-label.icon-xs svg {
  height: 18px;
  max-width: 18px;
}

.icon-label.icon-m svg {
  height: 36px;
  max-width: 36px;
}

.icon-label.icon-l svg {
  height: 54px;
  max-width: 54px;
}

@media screen and (max-width: 690px) {
  .narrow-label-hidden p {
    visibility: hidden;
    display: none;
  }
  .icon-label p {
    text-align: center;
  }
}

@media screen and (max-width: 320px) {
  .icon-label p {
    text-align: center;
  }
}

.justify-left {
  justify-content: left;
}
.icon-link {
  text-decoration: none;
}
.input-behind-edit-button > label {
  display: grid;
  grid-template-columns: [input] auto [button] 10em;
  grid-template-rows: [label-text] auto [inputs] auto;
  grid-column-gap: var(--padding);
}

.input-behind-edit-button > label > span {
  grid-column: input / span 2;
  grid-row: label-text;
}

.input-behind-edit-button input,
.input-behind-edit-button button {
  grid-row: inputs;
}

.input-behind-edit-button input {
  grid-column: input;
}

.input-behind-edit-button button, 
.input-behind-edit-button .button {
  text-align: center;
  grid-column: button;
  height: var(--input-height);
  box-sizing: border-box;
}

.input-behind-edit-button input:disabled {
  border: 0;
  color: #000;
  font-weight: 600;
  padding: 0;
}
label[data-controller="password-field-component"] {
  position: relative;
}

label[data-controller="password-field-component"] > input {
  padding-right: var(--input-height);
}

label[data-controller="password-field-component"] > button {
  position: absolute;
  right: 0;
  margin: 0;
  height: var(--input-height);
  width: var(--input-height);
  background-color: transparent;
  background-position: center;
}

label[data-controller="password-field-component"] > a {
  font-size: var(--font-s);
}

ul.attributes {
  font-size: var(--font-s);
  list-style: none;
}

ul.attributes {
  --title-value-margin: var(--margin-s);
  --attribute-pair-margin: var(--margin-l);
  --last-item-bottom-padding: var(--grid-gap-m);
}

ul.attributes li:before {
  content: attr(title);
  display: block;
  margin-bottom: var(--title-value-margin);
}

ul.attributes li  {
  margin-bottom: var(--attribute-pair-margin);
}
ul.attributes li:last-child  {
  padding-bottom: var(--last-item-bottom-padding);
}
.summary-component {
  font-size: var(--font-m);
}

.summary-component {
  display: grid;
  grid-gap: 8px;
}
.summary-component ul {
  display: grid;
  grid-gap: 8px;
}
.summary-component ul li {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid #e0e0e0;
}

.summary-component ul li div:first-child {
  justify-self: start;
}
.summary-component ul li div:last-child {
  justify-self: end;
}
table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: var(--padding-half);
}

tr {
  border-bottom: 1px solid #000; 
}

tr:not(table.not_last_row tr):last-child {
  border-bottom: 2px solid #000;
}

td {
  padding: var(--padding-half)
}

.activities th {
  text-align: left;
}
input.unit-input {
  text-align: right;
}
voima-select {
  display: grid;
  position: relative;
  min-height: var(--font-l);
  padding: calc(var(--padding) / 2) 60px calc(var(--padding) / 2) calc(var(--padding) / 2);
  user-select: none;
  background-color: var(--color-highlight);
  font-size: var(--font-m);
  cursor: pointer;
}

voima-select:hover {
  background-color: #ddd;
}

voima-select > div {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

voima-select dialog {
  position: absolute;
  padding: 0;
  margin: 0;
  left: -2px;
  top: -2px;
  max-height: calc(var(--padding) * 2 * 8);
  width: 100%;
  overflow-y: auto;
  z-index: 101;
}

voima-select dialog:modal {
  position: absolute;
  z-index: 101;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
}

@media (max-width: 690px) {
  voima-select dialog {
    position: fixed;
    z-index: 101;
    top: 50%;
    transform: translateY(-50%);
    right: var(--padding);
    bottom: var(--padding);
    left: var(--padding);
    max-height: calc(100% - (var(--padding) * 2));
    width: unset;
    box-shadow: 0px 0px 120px 0px rgba(0, 0, 0, 0.1);
  }
}

voima-select,
voima-select dialog {
  border: 2px solid var(--color-main);
  border-radius: 6px;
}

voima-select > voima-select-option:not(:first-of-type) {
  display: none;
}

voima-select > voima-select-option:first-of-type {
  padding: 0;
  margin: 0;
}

voima-select::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 60px;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-color: var(--color-main);
  color: var(--color-highlight);
  cursor: pointer;
}

voima-select[open]::after {
  display: none;
}

voima-select voima-select-option {
  padding-right: 60px;
}

voima-select voima-select-option[selected]::after {
  content: '✓';
  position: absolute;
  right: 25px;
  top: 50%;
  transform: translateY(-50%);
}
voima-select-option {
  position: relative;
  display: block;
  min-height: var(--font-l);
  padding: calc(var(--padding) / 2);
  user-select: none;
  cursor: pointer;
  background-color: var(--color-highlight);
  font-size: var(--font-m)
}

voima-select-option:hover {
  background-color: #ddd;
}

voima-select-option > * {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
* vendor/assets/stylesheets directory can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the bottom of the
* compiled file so the styles you add here take precedence over styles defined in any other CSS
* files in this directory. Styles in this file should be added after the last require_* statement.
* It is generally better to create a new file per style scope.
*



*/