html {
  font-family: "Inter var", sans-serif;
  font-size: 62.5%;
  height: -webkit-fill-available;
}

body {
  min-height: 100vh;
  min-height: -webkit-fill-available;
  min-width: 32rem;
  scroll-behavior: smooth;
  text-rendering: optimizeSpeed;
}

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

ul,
ol {
  padding: 0;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
figure,
figcaption,
blockquote,
dl,
dd,
input,
select,
textarea {
  margin: 0;
}

ul[class],
ol[class] {
  list-style: none;
}

a {
  text-decoration: none;
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}

img {
  max-width: 100%;
  display: block;
}

input,
button,
textarea,
select {
  font: inherit;
  border-radius: 0;
}
input:active, input:focus,
button:active,
button:focus,
textarea:active,
textarea:focus,
select:active,
select:focus {
  border-radius: 0;
}

.is-displayed--block {
  display: block;
}

.is-displayed--flex {
  display: flex;
}

.is-dispayed--grid {
  display: grid;
}

.page-wrapper {
  min-height: 100vh;
  min-width: 100vw;
  background: #f9f8f7;
}
@media (min-width: 64em) and (min-height: 40em) {
  .page-wrapper {
    display: flex;
    flex-direction: row;
  }
}

@media only screen and (prefers-color-scheme: dark) {
  .page-wrapper {
    background: #242220;
  }
}
.page-header {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100vw;
  background: #192b5a;
}
@media (min-width: 64em) and (min-height: 40em) {
  .page-header {
    position: fixed;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: space-between;
    width: 6.4rem;
    height: 100vh;
    min-height: 64rem;
    transition: height 0.16s ease-in-out, width 0.24s ease-in-out 0.24s;
  }
  .page-header.is-expanded {
    width: 25.6rem;
  }
}

.branding {
  padding: 1.6rem 0 0 1.6rem;
}
.branding .brand--mark {
  width: 3.68rem;
  fill: #d090c2;
}
.branding .brand--logotype {
  display: none;
  width: 13.736rem;
  fill: #ffffff;
}
.branding a {
  display: inline-block;
}
.branding a:hover .brand--mark {
  fill: #ffffff;
}
@media (min-width: 48em) {
  .branding .brand--mark {
    margin-right: 0.6rem;
  }
  .branding .brand--logotype {
    display: inline;
  }
}
@media (min-width: 64em) and (min-height: 40em) {
  .branding {
    overflow-x: hidden;
    margin-left: -3.7rem;
    padding-left: 0;
    text-align: center;
    transition: margin-left 0.24s ease-in-out 0.24s, padding-top 0.24s ease-in-out 0.24s;
  }
  .branding .brand--mark, .branding .brand--logotype {
    transition: width 0.24s ease-in-out 0.24s, height 0.24s ease-in-out 0.24s, opacity 0.16s ease-in-out 0.32s;
  }
  .branding .brand--mark {
    width: 3.6rem;
    margin: 0 0 1.3rem;
  }
  .branding .brand--logotype {
    display: block;
    opacity: 0;
  }
  .page-header.is-expanded .branding {
    margin-left: 0;
    padding-top: 2.4rem;
  }
  .page-header.is-expanded .branding .brand--mark {
    width: 4.53rem;
  }
  .page-header.is-expanded .branding .brand--logotype {
    width: 14.4rem;
    opacity: 1;
  }
}
@media (min-width: 64em) and (min-height: 48em) {
  .branding {
    padding-top: 2.4rem;
  }
  .page-header.is-expanded .branding {
    padding-top: 7.5rem;
  }
}
@media (min-width: 64em) and (min-height: 64em) {
  .branding {
    padding-top: 3.2rem;
  }
  .page-header.is-expanded .branding {
    padding-top: 8.9rem;
  }
}

.global-navigation {
  display: flex;
  flex-direction: row;
}
.global-navigation .navigation__item {
  height: 6.4rem;
  overflow-y: hidden;
}
.global-navigation .navigation__item--library, .global-navigation .navigation__item--events, .global-navigation .navigation__item--institutions, .global-navigation .navigation__item--measurement, .global-navigation .navigation__item--user {
  display: none;
}
.global-navigation .navigation__item > a, .has-hover .global-navigation .navigation__item > a:hover.is-selected {
  color: rgba(255, 255, 255, 0);
  padding: 3.2rem 0 0;
}
.global-navigation .navigation__item > a {
  display: block;
  width: 6.4rem;
  font-size: 1rem;
  font-weight: 560;
  line-height: 1.6rem;
  text-align: center;
  transition: color 0.24s ease-in-out 0.16s, padding 0.24s ease-out 0.16s, background-color 0.24s ease-in-out;
}
.global-navigation .navigation__item .icon {
  display: block;
  margin: 0 auto 0.4rem;
  fill: #cdd5ff;
}
.global-navigation .navigation__item .top-bun,
.global-navigation .navigation__item .bottom-bun {
  transition: all 0.32s ease-in-out 0s;
}
.global-navigation .navigation__item .filling {
  transition: opacity 0.16s ease-in-out 0s;
}
.global-navigation .navigation__item .top-bun {
  transform-origin: 0.1rem 0.4rem;
}
.global-navigation .navigation__item .bottom-bun {
  transform-origin: 0.1rem 1.2rem;
}
.has-hover .global-navigation .navigation__item > a:hover {
  color: #ffffff;
  padding: 1.6rem 0 1.2rem;
  background-color: #5a6bad;
}
.has-hover .global-navigation .navigation__item > a:hover .icon {
  fill: #e5eaff;
}
.global-navigation .navigation__item > a.is-selected .icon,
.global-navigation .navigation__item > a.is-selected-open .icon {
  fill: #f5f7ff;
}
.global-navigation .navigation__item > a.is-selected {
  background-color: #394b84;
}
.global-navigation .navigation__item > a.is-selected-open {
  background-color: #273560;
}
.global-navigation .navigation__item > a.is-selected-open .top-bun {
  transform: rotate(45deg) scale(1.1);
}
.global-navigation .navigation__item > a.is-selected-open .filling {
  opacity: 0;
}
.global-navigation .navigation__item > a.is-selected-open .bottom-bun {
  transform: rotate(-45deg) scale(1.1);
}
.global-navigation .navigation__item > a > span {
  display: none;
}
.global-navigation .navigation__item--user .head,
.global-navigation .navigation__item--user .body {
  transition: all 0.32s ease-in-out 0s;
}
.global-navigation .navigation__item--user .top-bun,
.global-navigation .navigation__item--user .bottom-bun {
  opacity: 0;
  transition: opacity 0.16s ease-in-out 0s, all 0.32s ease-in-out 0s;
}
.global-navigation .navigation__item--user .head {
  transform-origin: top left;
}
.global-navigation .navigation__item--user .body {
  transform-origin: bottom left;
}
.global-navigation .navigation__item--user .bottom-bun {
  transform-origin: 0.1rem 1.2rem;
}
.global-navigation .navigation__item--user > a.is-selected-open .head {
  opacity: 0;
  transform: rotate(-45deg);
}
.global-navigation .navigation__item--user > a.is-selected-open .body {
  opacity: 0;
  transform: rotate(45deg);
}
.global-navigation .navigation__item--user > a.is-selected-open .top-bun {
  opacity: 1;
  transform: rotate(45deg) scale(1.1);
}
.global-navigation .navigation__item--user > a.is-selected-open .bottom-bun {
  opacity: 1;
  transform: rotate(-45deg) scale(1.1);
}
@media (min-width: 25em) {
  .global-navigation .navigation__item--library {
    display: block;
  }
}
@media (min-width: 30em) {
  .global-navigation .navigation__item--events {
    display: block;
  }
}
@media (min-width: 34.375em) {
  .global-navigation .navigation__item--institutions {
    display: block;
  }
}
@media (min-width: 37.5em) {
  .global-navigation .navigation__item--institutions, .global-navigation .navigation__item--measurement, .global-navigation .navigation__item--user {
    display: block;
  }
  .global-navigation .navigation__item--menu {
    display: none;
  }
}
@media (min-width: 64em) and (min-height: 40em) {
  .global-navigation {
    flex-direction: column;
    height: calc((527/640) * 100vh);
  }
  .global-navigation .navigation__item {
    height: auto;
  }
  .global-navigation .navigation__item > a, .has-hover .global-navigation .navigation__item > a:hover,
.global-navigation .navigation__item > a:hover.is-selected {
    padding: 2.4rem 0 2.4rem 2.4rem;
  }
  .global-navigation .navigation__item > a, .has-hover .global-navigation .navigation__item > a:hover.is-selected {
    display: block;
    width: auto;
    height: auto;
    overflow-x: hidden;
    font-size: 1.4rem;
    text-align: left;
    color: #ffffff;
  }
  .global-navigation .navigation__item > a {
    width: 25.6rem;
  }
  .global-navigation .navigation__item .icon {
    display: inline;
    vertical-align: top;
    margin: 0 2.4rem 0 0;
  }
  .global-navigation .navigation__item > a > span {
    display: inline;
  }
}
@media (min-width: 64em) and (min-height: 48em) {
  .global-navigation {
    height: calc(100vh - 22.4rem);
  }
}
@media (min-width: 64em) and (min-height: 64em) {
  .global-navigation {
    height: calc(100vh - 25.6rem);
  }
}

.navigation--primary,
.navigation--secondary,
.navigation--tertiary {
  display: flex;
  flex-direction: row;
  margin-left: 3.2rem;
}
@media (min-width: 64em) and (min-height: 40em) {
  .navigation--primary,
.navigation--secondary,
.navigation--tertiary {
    flex-direction: column;
    margin-bottom: 2.4rem;
    margin-left: 0;
  }
}
@media (min-width: 64em) and (min-height: 48em) {
  .navigation--primary,
.navigation--secondary,
.navigation--tertiary {
    flex-direction: column;
    margin-bottom: 3.2rem;
  }
}

.navigation--secondary {
  display: none;
}
@media (min-width: 30em) {
  .navigation--secondary {
    display: flex;
  }
}

.navigation-dropdown {
  order: 9999;
  width: 100%;
  overflow: hidden;
  background-color: #273560;
  transition: max-height 0.48s ease-in-out;
}
.navigation-dropdown.is-open {
  max-height: 83.2rem;
}
.navigation-dropdown.is-closed {
  max-height: 0;
}
.navigation-dropdown .dropdown__navigation + .dropdown__navigation {
  margin-top: 1.6rem;
}
.navigation-dropdown .navigation__item {
  height: auto;
}
.navigation-dropdown .navigation__item--settings, .navigation-dropdown .navigation__item--logout {
  margin-top: 0.8rem;
}
.navigation-dropdown .navigation__item--user,
.navigation-dropdown .navigation__item > a, .has-hover .navigation-dropdown .navigation__item > a:hover, .has-hover .navigation-dropdown .navigation__item > a:hover.is-selected {
  padding: 1.6rem 0 1.6rem 1.6rem;
}
.navigation-dropdown .navigation__item--experts > a, .navigation-dropdown .navigation__item--sosv > a, .navigation-dropdown .navigation__item--library > a, .navigation-dropdown .navigation__item--events > a, .navigation-dropdown .navigation__item--institutions > a, .navigation-dropdown .navigation__item--measurement > a {
  font-weight: 560;
}
.navigation-dropdown .navigation__item--searches > a, .has-hover .navigation-dropdown .navigation__item--searches > a:hover, .has-hover .navigation-dropdown .navigation__item--searches > a:hover.is-selected, .navigation-dropdown .navigation__item--lists > a, .has-hover .navigation-dropdown .navigation__item--lists > a:hover, .has-hover .navigation-dropdown .navigation__item--lists > a:hover.is-selected, .navigation-dropdown .navigation__item--settings > a, .has-hover .navigation-dropdown .navigation__item--settings > a:hover, .has-hover .navigation-dropdown .navigation__item--settings > a:hover.is-selected, .navigation-dropdown .navigation__item--help > a, .has-hover .navigation-dropdown .navigation__item--help > a:hover, .has-hover .navigation-dropdown .navigation__item--help > a:hover.is-selected, .navigation-dropdown .navigation__item--logout > a, .has-hover .navigation-dropdown .navigation__item--logout > a:hover, .has-hover .navigation-dropdown .navigation__item--logout > a:hover.is-selected {
  padding-left: 4.8rem;
}
.navigation-dropdown .navigation__item--searches > a, .navigation-dropdown .navigation__item--lists > a, .navigation-dropdown .navigation__item--settings > a, .navigation-dropdown .navigation__item--help > a, .navigation-dropdown .navigation__item--logout > a {
  font-weight: 400;
}
.navigation-dropdown .navigation__item--user,
.navigation-dropdown .navigation__item > a, .has-hover .navigation-dropdown .navigation__item > a:hover.is-selected {
  display: block;
  width: auto;
  height: auto;
  overflow-x: hidden;
  font-size: 1.4rem;
  text-align: left;
  color: #ffffff;
}
.navigation-dropdown .navigation__item--user {
  font-weight: 600;
  color: #cdd5ff;
}
.navigation-dropdown .navigation__item > a:hover {
  background-color: #5a6bad;
}
.navigation-dropdown .navigation__item .icon {
  display: inline;
  vertical-align: top;
  margin: 0 1.6rem 0 0;
  fill: #cdd5ff;
}
@media (min-width: 37.5em) {
  .navigation-dropdown {
    display: block;
    position: absolute;
    z-index: 99;
    top: 6.4rem;
    right: 0;
    width: 25.6rem;
  }
  .navigation-dropdown .dropdown__navigation + .dropdown__navigation {
    margin-top: 0;
  }
  .navigation-dropdown .dropdown__navigation--primary,
.navigation-dropdown .dropdown__navigation--secondary {
    display: none;
  }
}
@media (min-width: 64em) and (min-height: 40em) {
  .navigation-dropdown {
    top: auto;
    right: auto;
    left: 25.6rem;
  }
  .navigation-dropdown .navigation__item--settings, .navigation-dropdown .navigation__item--logout {
    margin-top: 1.6rem;
  }
  .navigation-dropdown .navigation__item--user,
.navigation-dropdown .navigation__item > a, .has-hover .navigation-dropdown .navigation__item > a:hover, .has-hover .navigation-dropdown .navigation__item > a:hover.is-selected {
    padding: 2.4rem 0 2.4rem 2.4rem;
  }
  .navigation-dropdown .navigation__item--searches > a, .has-hover .navigation-dropdown .navigation__item--searches > a:hover, .has-hover .navigation-dropdown .navigation__item--searches > a:hover.is-selected, .navigation-dropdown .navigation__item--lists > a, .has-hover .navigation-dropdown .navigation__item--lists > a:hover, .has-hover .navigation-dropdown .navigation__item--lists > a:hover.is-selected, .navigation-dropdown .navigation__item--settings > a, .has-hover .navigation-dropdown .navigation__item--settings > a:hover, .has-hover .navigation-dropdown .navigation__item--settings > a:hover.is-selected, .navigation-dropdown .navigation__item--help > a, .has-hover .navigation-dropdown .navigation__item--help > a:hover, .has-hover .navigation-dropdown .navigation__item--help > a:hover.is-selected, .navigation-dropdown .navigation__item--logout > a, .has-hover .navigation-dropdown .navigation__item--logout > a:hover, .has-hover .navigation-dropdown .navigation__item--logout > a:hover.is-selected {
    padding-left: 6.4rem;
  }
  .navigation-dropdown .navigation__item .icon {
    margin-right: 2.4rem;
  }
}
@media (min-width: 64em) and (min-height: 48em) {
  .navigation-dropdown {
    bottom: calc(100vh - 73.7rem);
  }
}
@media (min-width: 64em) and (min-height: 64em) {
  .navigation-dropdown {
    bottom: calc(100vh - 76.8rem);
  }
}

.navigation__animation {
  display: none;
  opacity: 0;
  position: absolute;
  bottom: 3.2rem;
  left: 0;
  width: 100%;
  transition: opacity 0.64s ease-in-out;
  stroke: #781863;
}
@media (min-width: 64em) and (min-height: 64em) {
  .navigation__animation {
    bottom: 4.8rem;
  }
  .navigation__animation.is-displayed--block {
    display: block;
  }
  .navigation__animation.fade-in-out {
    opacity: 1;
  }
}
@media (min-width: 64em) and (min-height: 80em) {
  .navigation__animation {
    bottom: 7.2rem;
  }
}

@media only screen and (prefers-color-scheme: dark) {
  .page-header {
    background-color: #131211;
  }

  .global-navigation .navigation__item > a.is-selected-open,
.navigation-dropdown {
    background-color: #3d3b37;
  }

  .global-navigation .navigation__item > a.is-selected .icon,
.global-navigation .navigation__item > a.is-selected-open .icon {
    fill: #f9f8f7;
  }

  .navigation__animation {
    stroke: #501042;
  }
}
.page-content {
  width: 100vw;
  min-height: calc(100vh - 6.4rem);
  min-width: 32rem;
}
@media (min-width: 64em) and (min-height: 40em) {
  .page-content {
    width: calc(100vw - 6.4rem);
    margin-left: 6.4rem;
  }
}

.page-content-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  -moz-column-gap: 1.6rem;
       column-gap: 1.6rem;
  row-gap: 1.6rem;
  padding: 1.6rem;
}
@media (min-width: 40em) {
  .page-content-grid {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media (min-width: 40em) {
  .page-content-grid {
    -moz-column-gap: 2.4rem;
         column-gap: 2.4rem;
    padding: 2.4rem;
  }
}
@media (min-width: 60em) {
  .page-content-grid {
    grid-template-columns: repeat(12, 1fr);
  }
}
@media (min-width: 100em) {
  .page-content-grid {
    row-gap: 2.4rem;
  }
}
@media (min-width: 120em) {
  .page-content-grid {
    padding: 3.2rem;
  }
}

.global-search {
  padding: 1.6rem;
  height: 9.6rem;
  background: #eeece9;
  border-bottom: 1px solid #ddd9d4;
  transition: height 0.24s ease-in-out 0.24s;
}

@media only screen and (prefers-color-scheme: dark) {
  .global-search {
    color: #bab2a8;
    background: #3d3b37;
    border-bottom: 1px solid #67625d;
  }
}
.component {
  height: 25.6rem;
  padding: 1.6rem;
  background-color: #ffffff;
  border: 1px solid #ddd9d4;
}
.component--narrow {
  grid-column: span 4;
}
@media (min-width: 40em) {
  .component--narrow {
    grid-column: span 3;
  }
}
@media (min-width: 60em) {
  .component--narrow {
    grid-column: span 4;
  }
}
@media (min-width: 100em) {
  .component--narrow {
    grid-column: span 3;
  }
}
@media (min-width: 120em) {
  .component--narrow {
    grid-column: span 2;
  }
}
.component--wide {
  grid-column: span 4;
}
@media (min-width: 40em) {
  .component--wide {
    grid-column: span 6;
  }
}
@media (min-width: 60em) {
  .component--wide {
    grid-column: span 8;
  }
}
@media (min-width: 100em) {
  .component--wide {
    grid-column: span 6;
  }
}
.component--wider {
  grid-column: span 4;
}
@media (min-width: 40em) {
  .component--wider {
    grid-column: span 6;
  }
}
@media (min-width: 60em) {
  .component--wider {
    grid-column: span 8;
  }
}
.component--widest {
  grid-column: span 4;
}
@media (min-width: 40em) {
  .component--widest {
    grid-column: span 6;
  }
}
@media (min-width: 60em) {
  .component--widest {
    grid-column: span 12;
  }
}
@media (min-width: 40em) {
  .component--tall {
    height: auto;
    grid-row: span 2;
  }
}

@media only screen and (prefers-color-scheme: dark) {
  .component {
    background-color: #131211;
    border-color: #3d3b37;
  }
}