@import url(fontawesome-all.min.css);
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400);
:root {
  --darkblue: #0c4677;
  --lighterblue: #0086fb;
  --turquoise: #19a2bf;
  --lightgrey: #f4f4f4;
  --border_lightgrey: #eee;
  --black: #000;
  --white: #fff;
  --header-height: 64px;
  --anchor-scroll-offset: calc(var(--header-height) + 12px);
  --cr_blue1_1: #0D1B2A;
  --cr_blue1_2: #1B263B;
  --cr_blue1_3: #324A67;
  --cr_blue1_4: #415A77;
  --cr_blue1_5: #778DA9;
  --cr_blue1_6: #E0E1DD;
  --cr_blue2_1: #1E3A5F;
  --cr_blue2_2: #2A628F;
  --cr_blue2_3: #356E9F;
  --cr_blue2_4: #4682B4;
  --cr_blue2_5: #90AFC5;
  --cr_blue2_6: #C9D6DF;
  --cr_green1_1: #1B4332;
  --cr_green1_2: #2D6A4F;
  --cr_green1_3: #35795C;
  --cr_green1_4: #40916C;
  --cr_green1_5: #74C69D;
  --cr_green1_6: #D8F3DC;
  --cr_green2_1: #2F4F4F;
  --cr_green2_2: #3C6E71;
  --cr_green2_3: #4E857E;
  --cr_green2_4: #5A9E8F;
  --cr_green2_5: #8FC1A9;
  --cr_green2_6: #CFE0D6;
  --cr_violet1_1: #2E1A47;
  --cr_violet1_2: #4A3F55;
  --cr_violet1_3: #5B4375;
  --cr_violet1_4: #6A4C93;
  --cr_violet1_5: #927E9F;
  --cr_violet1_6: #CBB6D1;
  --cr_violet2_1: #3C1361;
  --cr_violet2_2: #5E548E;
  --cr_violet2_3: #7D67A5;
  --cr_violet2_4: #9F86C0;
  --cr_violet2_5: #BE95C4;
  --cr_violet2_6: #E0B1CB;
  --cr_brown1_1: #3E2723;
  --cr_brown1_2: #5D4037;
  --cr_brown1_3: #704C3E;
  --cr_brown1_4: #8D6E63;
  --cr_brown1_5: #BCAAA4;
  --cr_brown1_6: #D7CCC8;
  --cr_brown2_1: #4B3832;
  --cr_brown2_2: #6F4E37;
  --cr_brown2_3: #7C6051;
  --cr_brown2_4: #8A716A;
  --cr_brown2_5: #A39887;
  --cr_brown2_6: #D8CFC4;
  --bg: #ffffff;
  --text: #1b2a3a;
  --muted: #6b7b8c;
  --grid: #dfe5ea;
  --group: #eef2f6;
  --pos: #2f9e44;
  --pos-soft: #88c98f;
  --neg: #c92a2a;
  --neg-soft: #d99a9a
}
* {
  box-sizing: border-box
}
body,
html {
  height: 100%
}
section[id] {
  scroll-margin-top: var(--anchor-scroll-offset)
}
body {
  font-family: Tahoma, Helvetica, Arial, system-ui, -apple-system, sans-serif;
  background: var(--white);
  color: var(--darkblue);
  -webkit-text-size-adjust: none;
  -ms-overflow-style: scrollbar;
  margin: 0;
  padding: 0;
}
body.locale-loading {
  visibility: hidden
}
body.locale-ready {
  visibility: visible
}
[hidden] {
  display: none!important
}
body.is-preload #header.alt > * {
  opacity: 1
}
body.is-preload #header.alt .logo {
  -moz-transform: none;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none
}
.hint {
  background-color: var(--lightgrey);
  padding: .5rem;
  border-radius: .5rem
}
.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  width: 100%;
  box-sizing: border-box;
  padding-right: max(12px, env(safe-area-inset-right));
  height: var(--header-height);
  background: var(--darkblue);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 1000;
  border-bottom: 3px solid rgba(0,0,0,.15);
}
.ds-logo {
  margin-left: 16px;
}
.ds-logo > img {
  width: 10rem;
}
h3,
h4 {
  color: var(--lighterblue);
}
.chart-title,
h2 {
  color: #50555a;
}
.chart-title {
  position: relative;
  display: block;
  font-size: 1.3rem;
  margin: 0 0 1rem;
  padding-left: 0;
  overflow: visible;
}
.chart-title-text {
  display: block;
  min-width: 0;
}
.chart-title-share {
  position: absolute;
  left: 0;
  top: .2em;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1rem;
  height: 1rem;
  margin-top: 0;
  padding: 0 .5em 0 0;
  border: 0;
  background: 0 0;
  color: var(--lighterblue);
  cursor: pointer;
  opacity: .72;
  text-decoration: none;
  transform: translateX(calc(-100% - .35rem));
  transition: opacity .16s,color .16s;
  z-index: 2
}
.chart-title-share:focus-visible,
.chart-title-share:hover {
  opacity: 1;
  transform: translateX(calc(-100% - .35rem));
  outline: 0;
  color: var(--darkblue)
}
.chart-title-share i {
  font-size: .78rem;
  line-height: 1;
  pointer-events: none
}
.scroll-progress-indicator {
  position: fixed;
  right: max(10px,env(safe-area-inset-right));
  top: 96px;
  z-index: 1001;
  display: flex;
  align-items: center;
  gap: .55rem;
  max-width: min(22rem,calc(100vw - 4rem));
  padding: .65rem .85rem;
  border: 1px solid rgba(12,70,119,.14);
  border-radius: 14px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 14px 35px rgba(12,70,119,.16);
  color: var(--darkblue);
  opacity: 0;
  pointer-events: none;
  transform: translate3d(10px,-50%,0);
  transition: opacity .18s,transform .18s;
  backdrop-filter: blur(10px)
}
.scroll-progress-indicator.is-visible {
  opacity: 1;
  transform: translate3d(0,-50%,0)
}
.scroll-progress-indicator-icon {
  display: inline-flex;
  flex: 0 0 1.35rem;
  align-self: flex-start;
  align-items: center;
  justify-content: center;
  width: 1.35rem;
  min-width: 1.35rem;
  max-width: 1.35rem;
  height: 1.35rem;
  min-height: 1.35rem;
  max-height: 1.35rem;
  aspect-ratio: 1/1;
  border-radius: 999px;
  border: 2px solid rgba(0,134,251,.34);
  background: rgba(0,134,251,.08);
  position: relative
}
.scroll-progress-indicator-icon::after {
  content: '';
  width: .42rem;
  height: .42rem;
  border-radius: 999px;
  background: var(--lighterblue);
  box-shadow: 0 0 0 .14rem rgba(0,134,251,.12)
}
.scroll-progress-indicator-title {
  display: block;
  font-size: .92rem;
  line-height: 1.3;
  color: #50555a
}
@media screen and (max-width:736px) {
  .chart-title-share {
    transform: translateX(calc(-100% - .25rem))
  }
  .scroll-progress-indicator {
    right: 8px;
    max-width: min(18rem,calc(100vw - 1.25rem));
    padding: .55rem .7rem;
    gap: .45rem
  }
}
@media screen and (max-width:480px) {
  .chart-title-share {
    top: .18em;
    transform: translateX(calc(-100% - .18rem))
  }
  .chart-title-share:focus-visible,
  .chart-title-share:hover {
    transform: translateX(calc(-100% - .18rem))
  }
  .scroll-progress-indicator {
    right: 6px;
    max-width: min(15rem,calc(100vw - .75rem));
    padding: .5rem .65rem
  }
  .scroll-progress-indicator-icon {
    flex-basis: 1.2rem;
    width: 1.2rem;
    min-width: 1.2rem;
    max-width: 1.2rem;
    height: 1.2rem;
    min-height: 1.2rem;
    max-height: 1.2rem
  }
  .scroll-progress-indicator-title {
    font-size: .85rem
  }
}
.header-buttons {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: space-around;
  justify-content: space-between;
  align-items: center;
  gap: .5em;
  height: 100%
}
.language-buttons {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: center;
  align-items: center
}
.language-button {
  width: 2em;
  display: inline-block;
  text-align: center;
  color: #fff;
  text-decoration: none;
  border-bottom: 2px solid transparent;
  padding-bottom: .1rem
}
.language-button.is-active {
  border-bottom-color: #fff;
  font-weight: 700
}
.menu-btn {
  appearance: none;
  border: 0;
  background: 0 0;
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  padding: 6px 8px;
  border-radius: 0;
  min-width: 2em;
  box-shadow: none;
  height: 100%
}
.menu-btn:focus {
  outline: rgba(255,255,255,.6) solid 2px;
  outline-offset: 2px
}
.nav-panel {
  position: fixed;
  left: 0;
  right: 0;
  top: 4rem;
  background: var(--white);
  color: var(--black);
  display: none;
  z-index: 999;
  border-bottom: 3px solid rgba(0,0,0,.1);
  box-shadow: 0 8px 24px rgba(0,0,0,.08)
}
.nav-panel.open {
  display: block
}
.nav-panel > ul {
  margin: 0;
  padding: 12px 16px;
  list-style: none;
  display: flex;
  gap: 16px;
  flex-wrap: wrap
}
.nav-panel li {
  margin: 0;
  position: relative
}
.nav-panel a,
.nav-panel button.submenu-toggle {
  display: flex;
  justify-content: space-between;
  padding: 10px 12px;
  border-radius: 8px;
  text-decoration: none;
  color: #000;
  border: none;
  background: 0 0;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  font-size: inherit;
}
.nav-panel a:hover,
.nav-panel button.submenu-toggle:hover {
  background: #f0f2f5;
}
.submenu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0,0,0,.1);
  padding: 8px 0;
  list-style: none;
  min-width: 250px;
  flex-direction: column
}
.submenu li {
  display: block
}
.submenu a {
  padding: 8px 16px;
  font-weight: 400
}
.submenu a:hover {
  background: #f0f2f5
}
.submenu.open {
  display: flex
}
.submenu-toggle {
  position: relative;
  padding-right: 2em
}
button.submenu-toggle {
  color: #000!important
}
.spacer {
  height: 5rem
}
figure#fig-chart-14 .spacer,
figure#fig-chart-17 .spacer,
figure#fig-chart-28 .spacer,
figure#fig-chart-45 .spacer,
figure#fig-chart-46 .spacer,
figure#fig-chart-47 .spacer,
figure#fig-chart-48 .spacer,
figure#fig-chart-49 .spacer,
figure#fig-chart-50 .spacer,
figure#fig-chart-51 .spacer,
figure#fig-chart-53 .spacer {
  display: none
}
#hint-chart-14,
#hint-chart-17,
#hint-chart-28,
#hint-chart-45,
#hint-chart-46,
#hint-chart-48,
#hint-chart-49,
#hint-chart-50,
#hint-chart-51,
#hint-chart-53 {
  margin-top: 3rem
}
canvas {
  height: 100%;
  width: 100%
}
.chart {
  margin: 2rem 0 0;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--border_lightgrey)
}
.chart canvas {
  width: 100%
}
main {
  background: #fff
}
#scrollTopBtn i {
  font-size: 2em
}
main #content {
  max-width: 1400px;
  padding: .5rem 2rem;
  margin: 2rem auto
}
section {
  border-bottom: 1px solid #eee
}
section.main-section {
  margin-top: 5em;
  padding-top: 0
}
main > section.main-section:first-child {
  margin-top: 0
}
section .chart:last-child,
section section:last-child,
section:last-child {
  border-bottom: 0
}
body main section#intro #bericht-summary,
body main section#table-of-contents {
  background: var(--lightgrey);
  color: var(--darkblue);
  padding: 1.5rem 4rem
}
body main section#table-of-contents ul {
  list-style: disc;
  margin: 0;
  padding: 0;
  font-size: 1.2rem
}
body main section#table-of-contents li {
  margin: 0;
  padding: 0
}
body main section#table-of-contents a {
  color: var(--darkblue);
  text-decoration: none
}
body main section#table-of-contents a:hover {
  text-decoration: underline
}
body main section#intro {
  border-bottom: none;
  margin: 0;
  padding: 0
}
body main section#intro #bericht-intro {
  background: var(--turquoise);
  color: var(--white);
  padding: 1.5rem 4rem;
  align-items: center;
  margin-top: var(--header-height);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: space-around;
  justify-content: space-between;
  align-items: center
}
body main section#intro #bericht-intro h1 {
  margin: 0;
  color: var(--white);
  font-size: 3rem;
  line-height: 1.05;
  letter-spacing: 0;
  white-space: nowrap
}
@media screen and (max-width:1240px) {
  body main section#intro #bericht-intro h1 {
    font-size: 2.5rem
  }
}
@media screen and (max-width:1136px) {
  body main section#intro #bericht-intro h1 {
    font-size: 2rem
  }
}
@media screen and (max-width:1026px) {
  body main section#intro #bericht-intro h1 {
    font-size: 2rem
  }
}
@media screen and (max-width:840px) {
  body main section#intro #bericht-intro h1 {
    font-size: 1.5rem
  }
}
body main section#intro #bericht-intro img {
  display: block;
  width: 20rem;
  max-width: 100%;
  height: auto;
  justify-self: end;
  align-self: end
}
@media screen and (max-width:1240px) {
  body main section#intro #bericht-intro img {
    width: 15rem
  }
}
@media screen and (max-width:1026px) {
  body main section#intro #bericht-intro img {
    width: 10rem
  }
}
@media screen and (max-width:670px) {
  body main section#intro #bericht-intro {
    flex-direction: column-reverse
  }
}
@media screen and (max-width:510px) {
  body main section#intro #bericht-intro h1 {
    font-size: 1.2rem;
    white-space: normal
  }
  body main section#intro #bericht-intro img {
    align-self: center;
    justify-self: center
  }
}
@media screen and (max-width:380px) {
  body main section#intro #bericht-intro,
  body main section#intro #bericht-summary {
    padding: 1.5rem 2rem
  }
}
body main section#intro #bericht-summary > h2 {
  color: #50555a;
  font-weight: 600;
  text-align: left;
  margin: 0 0 1rem;
  font-size: clamp(1.35rem, 2.4vw, 2.1rem);
  line-height: 1.12;
  text-wrap: balance
}
body main section#intro #bericht-summary p {
  margin: 0;
  max-width: 40rem;
  line-height: 1.45
}
@media screen and (max-width:736px) {
  body main section#intro #bericht-summary > h2 {
    max-width: none;
    font-size: 1.25rem
  }
}
footer {
  background: var(--lightgrey);
  color: var(--darkblue);
  text-align: center;
  padding-top: 1em;
}
section#projektteam {
  padding-bottom: 1rem;
  border-bottom: none
}
section#projektteam .projektteam-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 1.5rem
}
section#projektteam .projektteam-card {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  min-width: 0;
  min-height: 152px;
  padding: 1.8rem 1.5rem;
  border: 3px solid #e8e8e8;
  background: var(--white)
}
section#projektteam .projektteam-card__content {
  min-width: 0
}
section#projektteam .projektteam-card h3 {
  margin: 0 0 .35rem;
  color: #2f3337;
  font-size: 1.1rem;
  line-height: 1.2
}
section#projektteam .projektteam-card p {
  margin: 0;
  color: #2f3337;
  line-height: 1.4;
  overflow-wrap: anywhere
}
section#projektteam .projektteam-card a {
  color: inherit;
  text-decoration: none
}
section#projektteam .projektteam-card a:focus-visible,
section#projektteam .projektteam-card a:hover {
  color: var(--lighterblue);
  text-decoration: underline
}
html {
  scroll-behavior: smooth;
  box-sizing: border-box
}
.legend-item {
  display: flex;
  align-items: center;
  font-size: 14px
}
.charts {
  margin: 0 auto;
  position: relative;
  width: 100%;
  max-width: 800px
}
p.no-margin {
  margin: 0
}
section#studiendesign {
  position: relative;
  border-bottom: none
}
section#studiendesign .studiendesign-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 2.5rem 10rem;
  align-items: stretch;
  padding: .5rem 0 0
}
section#studiendesign .studiendesign-grid::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background: #d8e4ea;
  transform: translateX(-50%)
}
section#studiendesign .studiendesign-card {
  position: relative;
  min-width: 0;
  padding: 0 0 1.75rem;
  border-bottom: 1px solid #d8e4ea;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 1rem
}
section#studiendesign .studiendesign-card__icon {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: center
}
section#studiendesign .studiendesign-card__icon img {
  max-width: 50px;
  height: auto
}
section#studiendesign .studiendesign-card__content {
  min-width: 0;
  flex: 1 1 auto
}
section#studiendesign .studiendesign-card h3 {
  margin: 0;
  color: var(--turquoise);
  font-size: 1.6rem;
  line-height: 1.2
}
section#studiendesign .studiendesign-card p {
  margin: 0;
  color: rgba(12,70,119,.84);
  line-height: 1.55
}
section#studiendesign .studiendesign-card--right {
  text-align: right
}
section#studiendesign .studiendesign-card--right .studiendesign-card__icon {
  order: 2
}
section#studiendesign .studiendesign-card--right h3 {
  text-align: right
}
section#studiendesign .studiendesign-card--right p {
  max-width: 34rem;
  margin-left: auto
}
section#studiendesign .studiendesign-grid__lens {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 9.5rem;
  height: auto;
  padding: .5rem;
  background: var(--white);
  transform: translate(-50%,-50%);
  pointer-events: none;
  z-index: 2
}
@media screen and (max-width:980px) {
  #studiendesign .studiendesign-grid {
    display: grid!important;
    grid-template-columns: minmax(0,1fr)!important;
    grid-template-columns: 1fr;
    gap: 1.5rem
  }
  #studiendesign .studiendesign-grid::before,
  #studiendesign .studiendesign-grid__lens {
    display: none!important
  }
  #studiendesign .studiendesign-card,
  #studiendesign .studiendesign-card--right,
  #studiendesign .studiendesign-card--right h3 {
    text-align: left
  }
  #studiendesign .studiendesign-card--right .studiendesign-card__icon {
    order: 0
  }
  #studiendesign .studiendesign-card--right p {
    max-width: none;
    margin-left: 0
  }
  section#projektteam .projektteam-grid {
    grid-template-columns: 1fr
  }
}
@media screen and (max-width:736px) {
  main #content {
    padding: .5rem 1rem;
    margin: 1rem auto 1.5rem
  }
  section {
    margin: 0 1rem
  }
  #studiendesign .studiendesign-grid {
    gap: 1.25rem
  }
  #studiendesign .studiendesign-card,
  #studiendesign .studiendesign-card--right {
    flex-direction: column!important;
    flex-direction: column;
    gap: .75rem;
    padding-bottom: 1.25rem
  }
  #studiendesign .studiendesign-card--right .studiendesign-card__icon,
  #studiendesign .studiendesign-card__icon {
    order: 0
  }
  #studiendesign .studiendesign-card__icon img {
    max-width: 42px
  }
  #studiendesign .studiendesign-card h3 {
    font-size: 1.35rem
  }
  section#projektteam h2 {
    margin-bottom: 1.5rem
  }
  section#projektteam .projektteam-card {
    padding: 1.25rem
  }
}
@media screen and (max-width:480px) {
  body main section#intro #bericht-summary > h2 {
    font-size: 1.1rem
  }
  #studiendesign .studiendesign-card,
  #studiendesign .studiendesign-card--right {
    gap: .5rem
  }
  section#projektteam .projektteam-card {
    flex-direction: column;
    align-items: flex-start
  }
  body,
  html {
    min-width: 320px
  }
}
#scrollTopBtn {
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  bottom: 25px;
  right: 25px;
  z-index: 1000;
  background-color: var(--darkblue);
  color: #fff;
  border: none;
  border-radius: 50%;
  min-width: 50px;
  max-width: 50px;
  width: 50px;
  height: 50px;
  cursor: pointer;
  box-shadow: 0 3px 6px rgba(0,0,0,.25);
  transition: background-color .3s,transform .2s
}
#scrollTopBtn:hover {
  background-color: #005fa3;
  transform: scale(1.1)
}
.chart-container {
  width: 100%;
  max-width: 1200px;
  margin: auto;
  min-width: 0
}
.canvas-wrapper {
  position: relative;
  height: 300px;
  margin-top: 1em;
  width: 100%;
  min-width: 0
}
#fig-chart-2 .canvas-wrapper,
#fig-chart-3 .canvas-wrapper,
#fig-chart-4 .canvas-wrapper,
#fig-chart-5 .canvas-wrapper {
  height: 400px!important
}
#fig-chart-47.canvas-wrapper {
  height: 600px!important
}
#fig-chart-50 .canvas-wrapper {
  height: 500px!important
}
#fig-chart-52 .canvas-wrapper {
  height: 550px!important
}
#fig-chart-54 .canvas-wrapper {
  height: 650px!important
}
section#ergebnisse figure {
  filter: blur(2px);
  opacity: .7;
  overflow: hidden;
  transition: filter .1s,opacity .1s
}
section#ergebnisse figure.chart {
  overflow: visible
}
section#ergebnisse figure.is-active,
section#ergebnisse figure:focus,
section#ergebnisse figure:focus-within,
section#ergebnisse figure:hover {
  filter: blur(0);
  opacity: 1
}
.arrow.transparent {
  opacity: .5
}
.chart-layout {
  display: grid;
  gap: 16px;
  align-items: start
}
#fig-chart-8 .chart-layout {
  grid-template-columns: minmax(0,1fr) 180px
}
#fig-chart-8 .avg-panel .avg-panel-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 8px;
  align-items: start;
  min-height: 6em
}
#fig-chart-8 .avg-title {
  grid-column: 1/-1
}
#fig-chart-8 .avg-subtitle {
  grid-column: 2;
  margin-bottom: 4px
}
#fig-chart-8 .avg-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  grid-column: 1/-1
}
#fig-chart-8 .avg-rows {
  grid-template-rows: repeat(5,minmax(0,1fr));
  height: 200px
}
#fig-chart-8 .avg-cell {
  width: calc((100% / 2) - .7em)
}
#fig-chart-8 .canvas-wrapper {
  height: 300px;
  margin-top: 4em
}
@media (max-width:1093px) {
  #fig-chart-8 .avg-rows {
    height: 170px
  }
}
@media (max-width:952px) {
  #fig-chart-8 .avg-rows {
    height: 145px
  }
}
@media (max-width:900px) {
  #fig-chart-8 .chart-layout {
    grid-template-columns: 1fr
  }
  #fig-chart-8 .avg-panel .avg-panel-header {
    grid-template-columns: minmax(120px,auto) 1fr 1fr
  }
  #fig-chart-8 .avg-title {
    grid-column: 1/-1
  }
  #fig-chart-8 .avg-subtitle {
    grid-column: 3
  }
  #fig-chart-8 .canvas-wrapper {
    margin-top: 0
  }
  #fig-chart-8 .avg-head {
    display: grid;
    grid-template-columns: minmax(120px,auto) 1fr 1fr;
    gap: 8px;
    align-items: center;
    grid-column: 1/-1
  }
  #fig-chart-8 .avg-head::before {
    content: "";
    display: block
  }
  #fig-chart-8 .avg-row {
    display: grid;
    grid-template-columns: minmax(120px,auto) 1fr 1fr;
    gap: 8px;
    align-items: center
  }
  #fig-chart-8 .avg-row::before {
    content: attr(data-label);
    color: #555;
    text-align: left;
    padding-right: 8px
  }
  #fig-chart-8 .avg-cell {
    width: auto
  }
}
@media (max-width:736px) {
  #fig-chart-8 .canvas-wrapper {
    height: 440px
  }
}
@media (max-width:480px) {
  #fig-chart-8 .canvas-wrapper {
    height: 470px
  }
}
#fig-chart-11 .chart-layout {
  grid-template-columns: minmax(0,1fr) 120px
}
#fig-chart-11 .avg-head {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px
}
#fig-chart-11 .avg-panel .avg-panel-header {
  min-height: 6em
}
#fig-chart-11 .avg-rows {
  grid-template-rows: repeat(5,minmax(0,1fr));
  height: 200px
}
#fig-chart-11 .avg-cell {
  width: 100%
}
#fig-chart-11 .canvas-wrapper {
  height: 300px;
  margin-top: 4em
}
@media (max-width:1093px) {
  #fig-chart-11 .avg-rows {
    height: 170px
  }
}
@media (max-width:952px) {
  #fig-chart-11 .avg-rows {
    height: 145px
  }
}
@media (max-width:900px) {
  #fig-chart-11 .chart-layout {
    grid-template-columns: 1fr
  }
  #fig-chart-11 .avg-head {
    display: grid;
    grid-template-columns: minmax(120px,auto) 1fr;
    gap: 8px;
    align-items: center
  }
  #fig-chart-11 .avg-head::before {
    content: "";
    display: block
  }
  #fig-chart-11 .avg-row {
    display: grid;
    grid-template-columns: minmax(120px,auto) 1fr;
    gap: 8px;
    align-items: center
  }
  #fig-chart-11 .avg-row::before {
    content: attr(data-label);
    color: #555;
    text-align: left;
    padding-right: 8px
  }
  #fig-chart-11 .avg-cell {
    width: auto
  }
}
@media (max-width:736px) {
  #fig-chart-11 .canvas-wrapper {
    height: 440px;
    margin-top: 0
  }
}
@media (max-width:480px) {
  #fig-chart-11 .canvas-wrapper {
    height: 470px
  }
}
.chart-area,
.chart-layout,
.chart-pair-grid,
.chart-panel,
figure.chart {
  min-width: 0
}
.avg-panel {
  display: flex;
  flex-direction: column;
  border-left: 1px solid #d9d9d9;
  padding-left: 14px;
  box-sizing: border-box
}
.avg-title {
  text-align: center;
  font-weight: 700;
  font-size: 14px;
  margin-top: 2px;
  margin-bottom: 2px
}
.avg-subtitle {
  text-align: center;
  font-size: 10px;
  line-height: 1.15;
  color: #555;
  margin-bottom: 8px
}
.avg-head div {
  background: #efefef;
  text-align: center;
  font-weight: 700;
  padding: 2px 4px;
  box-sizing: border-box
}
.avg-rows {
  display: grid;
  align-items: stretch
}
.avg-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-content: space-between;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  gap: .7em
}
.avg-cell {
  background: #efefef;
  padding: .2em;
  text-align: center
}
@media (max-width:900px) {
  .chart-layout {
    grid-template-columns: 1fr
  }
  .avg-panel {
    height: auto;
    border-left: 0;
    padding-left: 0;
    margin-top: 14px
  }
  .avg-rows {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    height: auto
  }
  .avg-row {
    margin-bottom: 6px
  }
}
#fig-chart-16 .chart-layout {
  grid-template-columns: minmax(0,1fr) 180px
}
#fig-chart-16 .avg-panel .avg-panel-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 8px;
  align-items: start;
  min-height: 5.7em
}
#fig-chart-16 .avg-title {
  grid-column: 1/-1
}
#fig-chart-16 .avg-subtitle {
  grid-column: 2;
  margin-bottom: 4px
}
#fig-chart-16 .avg-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  grid-column: 1/-1
}
#fig-chart-16 .avg-rows {
  grid-template-rows: repeat(18,minmax(0,1fr));
  height: calc(620px - 6em)
}
#fig-chart-16 .avg-cell {
  width: calc((100% / 2) - .7em)
}
#fig-chart-16 .avg-row.is-spacer .avg-cell {
  background: 0 0;
  color: transparent;
  box-shadow: none
}
#fig-chart-16 .canvas-wrapper {
  height: 620px;
  margin-top: 4em
}
@media (max-width:1167px) {
  #fig-chart-16 .avg-rows {
    height: calc(620px - 8em)
  }
}
@media (max-width:1018px) {
  #fig-chart-16 .avg-rows {
    height: calc(620px - 9.5em)
  }
}
@media (max-width:920px) {
  #fig-chart-16 .avg-rows {
    height: calc(620px - 11em)
  }
}
@media (max-width:900px) {
  #fig-chart-16 .chart-layout {
    grid-template-columns: 1fr
  }
  #fig-chart-16 .avg-panel .avg-panel-header {
    grid-template-columns: minmax(120px,1.2fr) 1fr 1fr
  }
  #fig-chart-16 .avg-title {
    grid-column: 1/-1
  }
  #fig-chart-16 .avg-subtitle {
    grid-column: 3
  }
  #fig-chart-16 .avg-head {
    display: grid;
    grid-template-columns: minmax(120px,1.2fr) 1fr 1fr;
    gap: 8px;
    align-items: center;
    grid-column: 1/-1
  }
  #fig-chart-16 .avg-head::before {
    content: "";
    display: block
  }
  #fig-chart-16 .avg-row {
    display: grid;
    grid-template-columns: minmax(120px,1.2fr) 1fr 1fr;
    gap: 8px;
    align-items: center
  }
  #fig-chart-16 .avg-row::before {
    content: attr(data-label);
    color: #555;
    text-align: left;
    padding-right: 8px
  }
  #fig-chart-16 .avg-cell {
    width: auto
  }
  #fig-chart-16 .avg-row.is-spacer::before {
    content: ""
  }
}
#fig-chart-7 table {
  user-select: none;
  -webkit-user-select: none;
  width: 100%;
  min-width: 1100px;
  border-collapse: separate;
  border-spacing: 0
}
#fig-chart-7 table td,
#fig-chart-7 table th {
  padding: 10px 8px;
  text-align: center;
  vertical-align: middle;
  color: #555
}
#fig-chart-7 table td:first-child,
#fig-chart-7 table th:first-child {
  text-align: left;
  position: sticky;
  left: 0;
  background-color: #fff;
  z-index: 1;
  border-right: 1px solid #dfe2e7;
  box-shadow: 2px 0 5px rgba(0,0,0,.02)
}
#fig-chart-7 table th {
  font-weight: 600;
  background-color: #fff;
  color: #333
}
#fig-chart-7 table thead tr {
  background-color: #fff
}
#fig-chart-7 table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  border-bottom: 1px solid #dfe2e7
}
#fig-chart-7 table thead tr:nth-child(2) th {
  top: 40px
}
#fig-chart-7 table thead th:first-child {
  z-index: 3
}
#drag-scroll-container-7.grabbing {
  cursor: grabbing!important
}
#fig-chart-7 table tr.table-spacer td {
  background-color: #dfe2e7;
  height: 16px;
  border: none;
  border-bottom: 1px solid #dfe2e7
}
#fig-chart-7 table tr.table-spacer td:first-child {
  background-color: #dfe2e7
}
.v-divider {
  border-left: 2px solid #ccc!important
}
.summary-label-with-tooltip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%
}
.summary-label-text {
  min-width: 0
}
.summary-tooltip {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto
}
.summary-tooltip-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #1771b8;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  touch-action: manipulation
}
.summary-tooltip-trigger:hover,
.summary-tooltip-trigger:focus-visible {
  color: #0f4d7d;
  background: rgba(23,113,184,.1);
  outline: none
}
.summary-tooltip-trigger:focus-visible {
  box-shadow: 0 0 0 3px rgba(23,113,184,.22)
}
.summary-tooltip-panel {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 8px);
  z-index: 20;
  width: max-content;
  max-width: min(360px,calc(100vw - 40px));
  padding: 10px 12px;
  border-radius: 6px;
  background: #2f2f2f;
  color: #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  text-align: left;
  white-space: normal;
  pointer-events: none;
  opacity: 0;
  transform: translate(-50%,4px);
  transition: opacity .16s ease,transform .16s ease;
  visibility: hidden
}
.summary-tooltip-panel::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  width: 10px;
  height: 10px;
  background: #2f2f2f;
  transform: translate(-50%,-5px) rotate(45deg)
}
.summary-tooltip:hover .summary-tooltip-panel,
.summary-tooltip:focus-within .summary-tooltip-panel,
.summary-tooltip.is-open .summary-tooltip-panel {
  opacity: 1;
  transform: translate(-50%,0);
  visibility: visible
}
#fig-chart-6 table {
  user-select: none;
  -webkit-user-select: none;
  width: 100%;
  min-width: 1100px;
  border-collapse: separate;
  border-spacing: 0
}
#fig-chart-6 table td,
#fig-chart-6 table th {
  padding: 10px 8px;
  text-align: center;
  vertical-align: middle;
  color: #555
}
#fig-chart-6 table td:first-child,
#fig-chart-6 table th:first-child {
  text-align: left;
  position: sticky;
  left: 0;
  background-color: #fff;
  z-index: 1;
  border-right: 1px solid #eee
}
#fig-chart-6 table th {
  position: sticky;
  top: 0;
  background-color: #fff;
  z-index: 2;
  font-weight: 600;
  color: #333;
  border-bottom: 1px solid #dfe2e7
}
#fig-chart-6 table th:first-child {
  z-index: 3
}
#drag-scroll-container-6.grabbing {
  cursor: grabbing!important
}
#fig-chart-6 table tr.table-spacer td {
  background-color: #dfe2e7;
  height: 16px;
  border: none;
  border-bottom: 1px solid #dfe2e7
}
#fig-chart-6 table tr.table-spacer td:first-child {
  background-color: #dfe2e7
}
#fig-chart-6 table td.values:last-child,
#fig-chart-6 table td.values:nth-last-child(2) {
  text-align: right
}
.drag-scroll-table {
  width: 100%;
  overflow-x: auto;
  overflow-y: auto;
  max-height: 550px;
  cursor: grab;
  padding-right: 15px;
  padding-bottom: 15px;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  touch-action: pan-y;
  scrollbar-gutter: stable both-edges
}
.drag-scroll-table,
.drag-scroll-table * {
  touch-action: pan-y
}
.drag-scroll-table.grabbing {
  cursor: grabbing!important
}
#fig-chart-13 .canvas-wrapper {
  height: auto
}
#fig-chart-13 .chart-scroll {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 8px
}
#fig-chart-13 .chart-inner {
  width: 1200px;
  min-width: 1200px;
  margin: 0 auto
}
#fig-chart-13 .canvas-wrap {
  position: relative;
  height: 520px;
  width: 100%
}
#fig-chart-13 #customLegend_13 {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 1em;
  row-gap: 8px;
  align-items: start;
  margin-bottom: 1em;
  justify-items: center
}
@media (max-width:900px) {
  #fig-chart-13 #customLegend_13 {
    grid-template-columns: 1fr;
    row-gap: 12px
  }
}
#fig-chart-13 .legend-col {
  display: flex;
  flex-direction: column;
  gap: 8px
}
#fig-chart-13 .legend-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  line-height: 1.2;
  cursor: pointer;
  user-select: none
}
#fig-chart-13 .legend-item.is-hidden {
  opacity: .45
}
#fig-chart-13 .legend-line {
  position: relative;
  width: 44px;
  min-width: 44px;
  height: 0;
  border-top-width: 2px;
  border-top-style: solid
}
#fig-chart-13 .legend-line.dashed {
  border-top-style: dotted
}
#fig-chart-13 .legend-point {
  position: absolute;
  left: 50%;
  top: -7px;
  transform: translateX(-50%);
  font-size: 12px;
  line-height: 1;
  background: #fff;
  padding: 0 1px
}
#fig-chart-13 .legend-text {
  display: inline-block
}
@media (max-width:736px) {
  .drag-scroll-table {
    padding-right: 8px;
    padding-bottom: 10px;
    max-height: 60vh
  }
  #fig-chart-6 table td:first-child,
  #fig-chart-6 table th:first-child,
  #fig-chart-7 table td:first-child,
  #fig-chart-7 table th:first-child {
    position: static;
    left: auto;
    z-index: auto;
    box-shadow: none
  }
  #fig-chart-13 .chart-inner {
    width: max(100%,980px);
    min-width: 980px
  }
  #fig-chart-13 .canvas-wrap {
    height: 560px
  }
}
@media (max-width:480px) {
  #fig-chart-13 .chart-inner {
    width: max(100%,920px);
    min-width: 920px
  }
  #fig-chart-13 .canvas-wrap {
    height: 540px
  }
}
#fig-chart-47 > p:not([hidden]) {
  margin: 0 0 .5rem
}
#fig-chart-47 .canvas-wrapper {
  margin-top: 0
}
.chart-pair-grid {
  display: grid;
  grid-template-columns: minmax(220px,280px) minmax(0,1fr) minmax(0,1fr);
  gap: 12px 20px;
  align-items: start
}
.chart-pair-spacer {
  min-height: 1px
}
.chart-panel-title {
  margin: 0 0 .75rem;
  font-size: 1.05rem;
  line-height: 1.2;
  font-weight: 700;
  text-align: center;
  color: #50555a
}
.chart-panel {
  min-width: 0
}
.shared-row-labels {
  display: block;
  position: relative;
  height: 560px;
  box-sizing: border-box;
  min-width: 0;
  grid-column: 1;
  grid-row: 2;
  margin-top: 1em
}
.shared-row-label {
  position: absolute;
  left: 0;
  right: 0;
  top: var(--row-y,0);
  transform: translateY(-50%);
  display: grid;
  align-content: center;
  justify-items: end;
  width: 100%;
  text-align: right;
  color: #444;
  font-size: 11px;
  line-height: 1.2;
  padding-right: 8px
}
#fig-chart-39-40 .chart-container {
  max-width: none
}
#fig-chart-39-40 .canvas-wrapper {
  margin-top: 0
}
.shared-legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 18px;
  margin-top: 1rem;
  color: #555;
  font-size: .95rem
}
.shared-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap
}
.shared-legend-swatch {
  width: 14px;
  height: 14px;
  display: inline-block
}
@media (max-width:1100px) {
  .chart-pair-grid {
    grid-template-columns: 1fr
  }
  .chart-pair-spacer,
  .shared-row-labels {
    display: none
  }
  #fig-chart-39-40 #cap-chart-40 {
    grid-row: 1
  }
  #fig-chart-39-40 .chart-panel[aria-labelledby=cap-chart-40] {
    grid-row: 2
  }
  #fig-chart-39-40 #cap-chart-39 {
    grid-row: 3;
    margin-top: 1rem
  }
  #fig-chart-39-40 .chart-panel[aria-labelledby=cap-chart-39] {
    grid-row: 4
  }
}
@media (max-width:736px) {
  .canvas-wrapper {
    height: 360px;
    margin-top: .75em
  }
  #fig-chart-10 .canvas-wrapper,
  #fig-chart-12 .canvas-wrapper,
  #fig-chart-2 .canvas-wrapper,
  #fig-chart-3 .canvas-wrapper,
  #fig-chart-4 .canvas-wrapper,
  #fig-chart-5 .canvas-wrapper {
    height: 440px;
    margin-top: 0
  }
  .shared-legend {
    gap: 8px 12px;
    font-size: .88rem
  }
  .shared-legend-item {
    white-space: normal
  }
}
@media (max-width:480px) {
  .canvas-wrapper {
    height: 380px
  }
  #fig-chart-10 .canvas-wrapper,
  #fig-chart-12 .canvas-wrapper,
  #fig-chart-2 .canvas-wrapper,
  #fig-chart-3 .canvas-wrapper,
  #fig-chart-4 .canvas-wrapper,
  #fig-chart-5 .canvas-wrapper {
    height: 470px
  }
  .avg-cell,
  .avg-head div {
    font-size: 11px
  }
}
.wrap {
  margin-inline: auto;
  margin: 0 auto
}
table {
  border-spacing: 0;
  line-height: 1.35;
  background: #fff
}
thead th {
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 2;
  text-align: center;
  padding: 12px;
  border-bottom: 2px solid var(--grid);
  font-weight: 700;
  color: #1f3d5a
}
thead th:first-child {
  text-align: left
}
tbody td,
tbody th {
  padding: 10px 12px;
  border-bottom: 1px solid var(--grid)
}
tbody th {
  font-weight: 600;
  text-align: left
}
tbody td {
  white-space: nowrap
}
tbody td.values {
  text-align: center;
  vertical-align: middle
}
tbody tr.table-spacer {
  background-color: #dfe2e7
}
tbody tr.group th {
  background: var(--group);
  border-top: 2px solid var(--grid);
  border-bottom: 2px solid var(--grid);
  font-weight: 700;
  color: #2a5c87
}
tbody tr.group td {
  background: var(--group)
}
.arrow {
  display: inline-flex;
  width: 14px;
  height: 14px
}
.arrow svg {
  width: 100%;
  height: 100%
}
.up {
  transform: rotate(0)
}
.down {
  transform: rotate(180deg)
}
.green path {
  fill: var(--pos)
}
.red path {
  fill: var(--neg)
}
colgroup col:first-child {
  width: 48%
}
colgroup col:nth-child(2),
colgroup col:nth-child(3),
colgroup col:nth-child(4),
colgroup col:nth-child(5) {
  width: 9%
}
colgroup col:nth-child(6),
colgroup col:nth-child(7) {
  width: 8%
}
.legend {
  display: flex;
  gap: 18px;
  align-items: center
}
.legend .item {
  display: flex;
  gap: 8px;
  align-items: center
}
.legend .lbl {
  color: #556
}
.card {
  background: #fff;
  border: 1px solid var(--panel-border);
  border-radius: 10px;
  padding: 10px
}
.legend {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: center;
  margin-top: 10px;
  font-size: 14px;
  color: #345;
  flex-wrap: wrap
}
article,
figcaption,
figure,
footer,
header,
nav,
section {
  display: block
}
table {
  border-collapse: collapse;
  border-spacing: 0;
  margin: 0 0 2em;
  width: 100%
}
input::-moz-focus-inner {
  border: 0;
  padding: 0
}
input,
select,
textarea {
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
  appearance: none
}
@-ms-viewport {
  width: device-width
}
*,
:after,
:before {
  box-sizing: inherit
}
@media screen and (max-width:1680px) {
  body,
  input,
  select,
  textarea {
    font-size: 14pt
  }
}
@media screen and (max-width:1280px) {
  body,
  input,
  select,
  textarea {
    font-size: 12pt
  }
}
@media screen and (max-width:360px) {
  body,
  input,
  select,
  textarea {
    font-size: 11pt
  }
}
a {
  -moz-transition: color .2s,border-bottom .2s;
  -webkit-transition: color .2s,border-bottom .2s;
  -ms-transition: color .2s,border-bottom .2s;
  transition: color .2s,border-bottom .2s;
  text-decoration: none;
  border-bottom: 1px dotted;
  color: inherit
}
a:hover {
  border-bottom-color: transparent
}
b,
strong {
  font-weight: 400
}
i {
  font-style: italic
}
p {
  margin: 0 0 2em
}
p.content {
  -moz-columns: 20em 2;
  -webkit-columns: 20em 2;
  -ms-columns: 20em 2;
  columns: 20em 2;
  -moz-column-gap: 2em;
  -webkit-column-gap: 2em;
  -ms-column-gap: 2em;
  column-gap: 2em;
  text-align: justify
}
h1,
h2,
h3,
h4 {
  font-weight: 300;
  line-height: 1.5;
  margin: 0 0 .7em;
  letter-spacing: -.025em
}
h1 a,
h2 a,
h3 a,
h4 a {
  color: inherit;
  text-decoration: none
}
h1 {
  font-size: 2.5em;
  line-height: 1.2
}
h2 {
  color: var(--darkblue);
  text-align: center;
  font-size: 1.5em
}
h3 {
  font-size: 1.25em
}
h4 {
  font-size: 1.1em
}

.button,
button,
input[type=button] {
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
  appearance: none;
  -moz-transition: background-color .2s ease-in-out,color .2s ease-in-out;
  -webkit-transition: background-color .2s ease-in-out,color .2s ease-in-out;
  -ms-transition: background-color .2s ease-in-out,color .2s ease-in-out;
  transition: background-color .2s ease-in-out,color .2s ease-in-out;
  border-radius: 8px;
  border: 0;
  cursor: pointer;
  display: inline-block;
  font-weight: 300;
  padding: 0 1.5em;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
  color: #fff;
}
.button.icon,
button.icon,
input[type=button].icon {
  padding-left: 1.35em;
}
.button.icon:before,
button.icon:before,
input[type=button].icon:before {
  margin-right: .5em;
  color: rgba(255,255,255,.5);
}
.button:disabled,
button:disabled,
input[type=button]:disabled {
  pointer-events: none;
  opacity: .25;
}
@media screen and (max-width:736px) {
  h1 {
    font-size: 2em;
  }
  .button,
  button,
  input[type=button] {
    min-width: 0;
  }
}
.button:hover,
button:hover,
input[type=button]:hover {
  background-color: rgba(255,255,255,.075);
}
.button:active,
button:active,
input[type=button]:active {
  background-color: rgba(255,255,255,.2);
}
.button.primary,
button.primary,
input[type=button].primary {
  background-color: #8cc9f0;
  color: #fff!important;
  box-shadow: none;
}
.button.primary:hover,
button.primary:hover,
input[type=button].primary:hover {
  background-color: #9acff2;
}
.button.primary:active,
button.primary:active,
input[type=button].primary:active {
  background-color: #7ec3ee;
}
.button.primary.icon:before,
button.primary.icon:before,
input[type=button].primary.icon:before {
  color: #fff;
}
label {
  display: block;
  font-size: .9em;
  font-weight: 400;
  margin: 0 0 1em;
  color: #fff;
}
input[type=email],
input[type=text],
select,
textarea {
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
  appearance: none;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.35);
  color: inherit;
  display: block;
  outline: 0;
  padding: 0 1em;
  text-decoration: none;
  width: 100%;
  background-color: rgba(255,255,255,.075);
}
input[type=email]:invalid,
input[type=text]:invalid,
select:invalid,
textarea:invalid {
  box-shadow: none;
}
select {
  background-size: 1.25rem;
  background-repeat: no-repeat;
  background-position: calc(100% - 1rem) center;
  text-overflow: ellipsis;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' preserveAspectRatio='none' viewBox='0 0 40 40'%3E%3Cpath d='M9.4,12.3l10.4,10.4l10.4-10.4c0.2-0.2,0.5-0.4,0.9-0.4c0.3,0,0.6,0.1,0.9,0.4l3.3,3.3c0.2,0.2,0.4,0.5,0.4,0.9 c0,0.4-0.1,0.6-0.4,0.9L20.7,31.9c-0.2,0.2-0.5,0.4-0.9,0.4c-0.3,0-0.6-0.1-0.9-0.4L4.3,17.3c-0.2-0.2-0.4-0.5-0.4-0.9 c0-0.4,0.1-0.6,0.4-0.9l3.3-3.3c0.2-0.2,0.5-0.4,0.9-0.4S9.1,12.1,9.4,12.3z' fill='rgba(255, 255, 255, 0.35)' /%3E%3C/svg%3E")
}
select:focus::-ms-value {
  background-color: transparent;
}
select::-ms-expand {
  display: none;
}
textarea {
  padding: .75em 1em;
}
::-webkit-input-placeholder {
  opacity: 1;
  color: rgba(255,255,255,.5)!important
}
::-moz-placeholder {
  opacity: 1;
  color: rgba(255,255,255,.5)!important
}
input[type=email]:focus,
input[type=text]:focus,
select:focus,
textarea:focus {
  border-color: #8cc9f0;
  box-shadow: 0 0 0 1px #8cc9f0
}
select option {
  color: #fff;
  background: #935d8c
}
ul {
  list-style: disc;
  margin: 0 0 2em;
  padding-left: 1em
}
ul li {
  padding-left: .5em
}
ul.alt {
  list-style: none;
  padding-left: 0
}
ul.alt li {
  border-top: 1px solid rgba(255,255,255,.35);
  padding: .5em 0
}
ul.alt li:first-child {
  border-top: 0;
  padding-top: 0
}
table tbody tr {
  border: 1px solid;
  border-left: 0;
  border-right: 0
}
table td {
  padding: .75em
}
table th {
  font-size: .9em;
  font-weight: 400;
  padding: 0 .75em .75em;
  text-align: left;
  color: #fff
}
table thead {
  border-bottom: 2px solid
}
table.alt {
  border-collapse: separate
}
table.alt tbody tr td {
  border: 1px solid;
  border-left-width: 0;
  border-top-width: 0
}
table.alt tbody tr td:first-child {
  border-left-width: 1px
}
table.alt tbody tr:first-child td {
  border-top-width: 1px
}
table.alt thead {
  border-bottom: 0
}
table tbody tr,
table.alt tbody tr td {
  border-color: rgba(255,255,255,.35)
}
table tbody tr:nth-child(odd) {
  background-color: rgba(255,255,255,.075)
}
table thead {
  border-bottom-color: rgba(255,255,255,.35)
}