﻿@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Raleway:wght@400;600;700&display=swap");
/*	==========================================================================
   	Fonts
   	========================================================================== */
/*	==========================================================================
   	Links
   	========================================================================== */
/*	==========================================================================
   	Buttons
   	========================================================================== */
/*$assetsFolder: "./assets";*/
* {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  margin: 0;
  padding: 0;
  font-style: normal;
  list-style: none;
}

:root {
  font-family: "Raleway", sans-serif;
  font-size: 1px;
  font-feature-settings: "pnum" on, "lnum" on;
}
@media screen and (min-width: 1920px) {
  :root {
    font-size: calc(1px + (1.5 - 1) * (100vw - 1920px) / (3840 - 1920));
  }
}

[id=story--form-controls-dropdown--expanded] {
  min-height: 12vh;
}

p,
div,
li,
h1,
h2,
h3,
h4,
h5,
h6,
span,
a,
button,
input {
  /* Desktop/Paragraph */
  font-style: normal;
  font-weight: 400;
  /* or 141% */
  font-feature-settings: "tnum" on, "lnum" on;
}

p,
div,
span,
a,
p,
li,
span,
a,
button {
  /* Desktop/Paragraph */
  font-size: 20rem;
  line-height: 32rem;
  /* or 141% */
}

em {
  font-style: italic;
}

svg {
  /* stroke: currentColor; */
  fill: currentColor;
  width: 24rem;
  height: 24rem;
}

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

summary {
  display: block;
  /* works in firefox */
  list-style: none;
  /* works in firefox */
}

summary::after {
  display: block;
  list-style: none;
}

summary::-webkit-details-marker {
  display: none;
}

/* Mobile 480px */
@media only screen and (max-width: 768px) {
  p,
  div,
  span,
  li {
    font-size: 16rem;
    line-height: 24rem;
  }
}
.hide {
  display: none !important;
}

.text-content > div,
.text-content p,
.text-content h2,
.text-content .h2,
.text-content h3,
.text-content .h3,
.text-content h4,
.text-content .h4,
.text-content ul:not([class]),
.text-content ol:not([class]) {
  max-width: 780rem;
}
.text-content p + p, .text-content p + ul, .text-content p + ol, .text-content p + address, .text-content p + table, .text-content p + nav,
.text-content ul + p,
.text-content ul + ul,
.text-content ul + ol,
.text-content ul + address,
.text-content ul + table,
.text-content ul + nav,
.text-content ol + p,
.text-content ol + ul,
.text-content ol + ol,
.text-content ol + address,
.text-content ol + table,
.text-content ol + nav,
.text-content address + p,
.text-content address + ul,
.text-content address + ol,
.text-content address + address,
.text-content address + table,
.text-content address + nav,
.text-content table + p,
.text-content table + ul,
.text-content table + ol,
.text-content table + address,
.text-content table + table,
.text-content table + nav,
.text-content nav + p,
.text-content nav + ul,
.text-content nav + ol,
.text-content nav + address,
.text-content nav + table,
.text-content nav + nav {
  margin-top: 12rem;
}
@media only screen and (min-width: 1200px) {
  .text-content p + p, .text-content p + ul, .text-content p + ol, .text-content p + address, .text-content p + table, .text-content p + nav,
  .text-content ul + p,
  .text-content ul + ul,
  .text-content ul + ol,
  .text-content ul + address,
  .text-content ul + table,
  .text-content ul + nav,
  .text-content ol + p,
  .text-content ol + ul,
  .text-content ol + ol,
  .text-content ol + address,
  .text-content ol + table,
  .text-content ol + nav,
  .text-content address + p,
  .text-content address + ul,
  .text-content address + ol,
  .text-content address + address,
  .text-content address + table,
  .text-content address + nav,
  .text-content table + p,
  .text-content table + ul,
  .text-content table + ol,
  .text-content table + address,
  .text-content table + table,
  .text-content table + nav,
  .text-content nav + p,
  .text-content nav + ul,
  .text-content nav + ol,
  .text-content nav + address,
  .text-content nav + table,
  .text-content nav + nav {
    margin-top: 20rem;
  }
}
.text-content p + h2, .text-content p + .h2,
.text-content ul + h2,
.text-content ul + .h2,
.text-content ol + h2,
.text-content ol + .h2,
.text-content address + h2,
.text-content address + .h2,
.text-content table + h2,
.text-content table + .h2,
.text-content nav + h2,
.text-content nav + .h2 {
  margin-top: 40rem;
}
.text-content p + h3, .text-content p + .h3,
.text-content ul + h3,
.text-content ul + .h3,
.text-content ol + h3,
.text-content ol + .h3,
.text-content address + h3,
.text-content address + .h3,
.text-content table + h3,
.text-content table + .h3,
.text-content nav + h3,
.text-content nav + .h3 {
  margin-top: 40rem;
}
.text-content p + h4, .text-content p + .h4,
.text-content ul + h4,
.text-content ul + .h4,
.text-content ol + h4,
.text-content ol + .h4,
.text-content address + h4,
.text-content address + .h4,
.text-content table + h4,
.text-content table + .h4,
.text-content nav + h4,
.text-content nav + .h4 {
  margin-top: 40rem;
}
.text-content h2 + p, .text-content h2 + ul, .text-content h2 + ol, .text-content h2 + address, .text-content h2 + table, .text-content h2 + nav, .text-content .h2 + p, .text-content .h2 + ul, .text-content .h2 + ol, .text-content .h2 + address, .text-content .h2 + table, .text-content .h2 + nav,
.text-content h3 + p,
.text-content h3 + ul,
.text-content h3 + ol,
.text-content h3 + address,
.text-content h3 + table,
.text-content h3 + nav, .text-content .h3 + p, .text-content .h3 + ul, .text-content .h3 + ol, .text-content .h3 + address, .text-content .h3 + table, .text-content .h3 + nav,
.text-content h4 + p,
.text-content h4 + ul,
.text-content h4 + ol,
.text-content h4 + address,
.text-content h4 + table,
.text-content h4 + nav, .text-content .h4 + p, .text-content .h4 + ul, .text-content .h4 + ol, .text-content .h4 + address, .text-content .h4 + table, .text-content .h4 + nav {
  margin-top: 8rem;
  /*  @include screen-lg {
      margin-top: u(20);
  }*/
}
.text-content h2 + h2, .text-content h2 + .h2, .text-content .h2 + h2, .text-content .h2 + .h2,
.text-content h3 + h2,
.text-content h3 + .h2, .text-content .h3 + h2, .text-content .h3 + .h2,
.text-content h4 + h2,
.text-content h4 + .h2, .text-content .h4 + h2, .text-content .h4 + .h2 {
  margin-top: 40rem;
}
.text-content h2 + h3, .text-content h2 + .h3, .text-content .h2 + h3, .text-content .h2 + .h3,
.text-content h3 + h3,
.text-content h3 + .h3, .text-content .h3 + h3, .text-content .h3 + .h3,
.text-content h4 + h3,
.text-content h4 + .h3, .text-content .h4 + h3, .text-content .h4 + .h3 {
  margin-top: 20rem;
}
.text-content h2 + h4, .text-content h2 + .h4, .text-content .h2 + h4, .text-content .h2 + .h4,
.text-content h3 + h4,
.text-content h3 + .h4, .text-content .h3 + h4, .text-content .h3 + .h4,
.text-content h4 + h4,
.text-content h4 + .h4, .text-content .h4 + h4, .text-content .h4 + .h4 {
  margin-top: 20rem;
}
.text-content a {
  font-size: 1em;
  text-underline-offset: 3rem;
  color: black;
}
.text-content a:hover {
  text-decoration: none;
}
.text-content a.link--glossary {
  text-decoration: none;
  border-bottom: 2px dashed #4C00EE;
}
.text-content a.link--glossary:hover {
  border-bottom: none;
}
.text-content ul:not([class]):not([id]),
.text-content ol:not([class]):not([id]) {
  display: flex;
  flex-direction: column;
  gap: 8rem;
  margin-bottom: 30rem;
  list-style-type: none;
}
.text-content ul:not([class]):not([id]) ul:not([class]):not([id]),
.text-content ul:not([class]):not([id]) ol:not([class]):not([id]),
.text-content ol:not([class]):not([id]) ul:not([class]):not([id]),
.text-content ol:not([class]):not([id]) ol:not([class]):not([id]) {
  margin-top: 8rem;
  margin-left: 8rem;
  margin-bottom: 0;
}
.text-content ul:not([class]):not([id]) li {
  padding-left: 17rem;
  position: relative;
}
.text-content ul:not([class]):not([id]) li::before {
  border-radius: 50%;
  width: 4rem;
  height: 4rem;
  background-color: currentColor;
  content: "";
  display: block;
  left: 0;
  position: absolute;
  top: 12rem;
}
.text-content ol:not([class]):not([id]) {
  counter-reset: ol_counter;
}
.text-content ol:not([class]):not([id]) li {
  position: relative;
  padding-left: 30rem;
}
.text-content ol:not([class]):not([id]) li::before {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  counter-increment: ol_counter;
  content: counter(ol_counter) ".";
}
.text-content table {
  border-collapse: collapse;
}
.text-content table *,
.text-content table caption {
  text-align: left;
}
.text-content table caption {
  margin-bottom: 12rem;
  font-size: 28rem;
  line-height: 40rem;
}
.text-content table td,
.text-content table th {
  border: solid 1px;
  padding: 8rem;
}
.text-content address {
  margin-bottom: 12rem;
}
@media only screen and (min-width: 1200px) {
  .text-content address {
    margin-bottom: 20rem;
  }
}

@media only screen and (max-width: 480px) {
  .text-content ul:not([class]):not([id]) li:before {
    top: 8rem;
  }
}
h1, .h1 {
  font-weight: 700;
  font-size: 36rem;
  line-height: 44rem;
}

h2, .h2 {
  font-weight: 700;
  font-size: 30rem;
  line-height: 36rem;
}

h3, .h3 {
  font-weight: 700;
  font-size: 25rem;
  line-height: 32rem;
}

h4, .h4 {
  font-weight: 700;
  font-size: 21rem;
  line-height: 28rem;
}

@media only screen and (min-width: 768px) {
  h1, .h1 {
    font-weight: 700;
    font-size: 64rem;
    line-height: 80rem;
  }
  h2, .h2 {
    font-weight: 700;
    font-size: 48rem;
    line-height: 56rem;
  }
  h3, .h3 {
    font-weight: 700;
    font-size: 36rem;
    line-height: 44rem;
  }
  h4, .h4 {
    font-weight: 700;
    font-size: 24rem;
    line-height: 40rem;
  }
}
.padding-top {
  padding-top: 40rem;
}
.section__text .padding-top:first-child {
  padding-top: 20rem;
}

.padding-bottom {
  padding-bottom: 40rem;
}

.no-padding-bottom + .no-padding-top {
  padding-top: 20rem;
}

@media only screen and (min-width: 992px) {
  .padding-top {
    padding-top: 80rem;
  }
  .section__text .padding-top:first-child {
    padding-top: 40rem;
  }
  .padding-bottom {
    padding-bottom: 80rem;
  }
  .no-padding-bottom + .no-padding-top {
    padding-top: 40rem;
  }
  .no-padding-bottom + .no-padding-top.accordion {
    padding-top: 20rem;
  }
}
@media screen and (max-width: 1199px) {
  .hide-on-mobile {
    display: none !important;
  }
}
@media only screen and (min-width: 1200px) {
  .hide-on-desktop {
    display: none !important;
  }
}
body {
  display: flex;
  flex-direction: column;
  background-color: #EEF3FF;
  overflow-x: hidden;
}
body header,
body main,
body footer {
  padding: 16rem;
}
body.fullscreen-page {
  background-color: #4C00EE;
  width: 100%;
  min-height: 100vh;
}
body .body-bg-image {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  right: 0;
}
body main,
body section {
  width: 100%;
}
body main .section-content.text-content a,
body section .section-content.text-content a {
  font-size: 16rem;
}
body main .section-content a:not(a.text-button):not(a.button),
body section .section-content a:not(a.text-button):not(a.button) {
  font-size: inherit;
  font-weight: normal;
  color: inherit;
  text-underline-offset: 5rem;
}
body main .section-content p .text-button span,
body section .section-content p .text-button span {
  font-size: 16rem;
  line-height: 24rem;
  font-weight: 700;
  color: inherit;
}
body main .section-content p + .button,
body section .section-content p + .button {
  margin-top: 20rem;
}
body main .section-content p + form,
body section .section-content p + form {
  margin-top: 40rem;
  display: inline-flex;
  flex-direction: column;
  gap: 20rem;
}
body main .section-content p + form .button,
body section .section-content p + form .button {
  align-self: flex-start;
}
body main .section-content form,
body section .section-content form {
  width: 100%;
}

@media only screen and (min-width: 992px) {
  body {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
  }
  body header,
  body main,
  body footer {
    padding: 20rem 24rem !important;
  }
  body main {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    z-index: 1;
  }
  body aside {
    max-width: 360rem;
  }
  body section {
    max-width: 1556rem;
    margin: 0 auto;
  }
  body section .section-content h1 + p {
    margin-top: 8rem;
  }
  body section .section-content p .text-button span {
    font-size: 20rem;
    line-height: 32rem;
  }
  body section .section-content h1 + form {
    margin-top: 40rem;
  }
  body section .section-content form {
    display: inline-flex;
    flex-direction: column;
    width: 450rem;
    gap: 40rem;
  }
  body section .section-content form .button {
    align-self: flex-start;
  }
}
a.text-button {
  display: inline-flex;
  align-items: center;
  word-wrap: normal;
  white-space: nowrap;
  position: relative;
  text-decoration: none;
}
a.text-button:hover:not(.state--disabled) span::after {
  content: "";
  position: absolute;
  bottom: 2rem;
  left: 0;
  right: 0;
  width: 100%;
  height: 1rem;
  display: block;
  background-color: currentColor;
}
a.text-button span,
a.text-button svg {
  font-size: 16rem;
  line-height: 24rem;
  fill: currentColor;
  position: relative;
  font-style: normal;
  font-weight: 600;
}
a.text-button.style--primary {
  color: #4C00EE;
}
a.text-button.style--primary-contrast {
  color: white;
}
a.text-button.style--secondary-contrast {
  color: white;
}
a.text-button.style--secondary {
  color: black;
}
a.text-button svg {
  fill: currentColor;
  stroke: none;
  flex-shrink: 0;
}
a.text-button.with-icon.with-icon--right svg {
  margin-left: 8rem;
}
a.text-button.with-icon.with-icon--left svg {
  order: -1;
  margin-right: 8rem;
}
a.text-button.state--disabled, a.text-button.state--disabled:hover {
  color: #aaa;
  opacity: 1;
  cursor: not-allowed;
}
a.text-button.state--destructive, a.text-button.state--destructive:hover {
  color: #DE1C22;
}

.accordion-item {
  box-sizing: border-box;
  background-color: #BFD0FD;
}
.accordion-item.accordion-item--collapsed .accordion-item__desc {
  display: none;
}
.accordion-item.accordion-item--expanded {
  max-height: auto;
}
.accordion-item.accordion-item--expanded .accordion-item__heading::before {
  transform: rotate(180deg);
}
.accordion-item .accordion-item__heading {
  padding: 16rem;
  font-weight: 700;
  letter-spacing: 0.2rem;
  transition-duration: 0.2s;
  display: flex;
  justify-items: center;
  align-items: center;
  list-style: none;
}
.accordion-item .accordion-item__desc {
  padding: 32rem 16rem 32rem 60rem;
  word-wrap: break-word;
  background-color: #EEF3FF;
}
.accordion-item .accordion-item__heading,
.accordion-item .accordion-item__heading span {
  position: relative;
  cursor: pointer;
}
.accordion-item .accordion-item__heading::before {
  content: url("/css/storybook/assets/arrow-accordion.svg");
  width: 24rem;
  height: 24rem;
  margin-right: 20rem;
}

.accordion button {
  margin-bottom: 12rem;
}

@media only screen and (min-width: 576px) {
  .accordion button {
    margin-bottom: 20rem;
  }
}
.tooltip {
  background-color: white;
  padding: 16rem;
  display: flex;
  flex-direction: column;
  gap: 20rem;
}
.tooltip h3 {
  margin-bottom: -12rem;
}
.tooltip picture * {
  width: 96rem;
  height: 96rem;
  border-radius: 50%;
}
.tooltip .text-button svg {
  stroke: none;
}

@media only screen and (min-width: 768px) {
  .tooltip {
    padding: 40rem;
  }
  .tooltip picture * {
    width: 128rem;
    height: 128rem;
  }
}
.team-member {
  display: grid;
  grid-template-areas: "thumb" "info" "nav";
  column-gap: 32rem;
  row-gap: 12rem;
}
.team-member picture {
  grid-area: thumb;
  max-width: 96rem;
}
.team-member picture img {
  max-width: 96rem;
  min-width: 96rem;
  height: 96rem;
  border-radius: 50%;
}
.team-member .team-member__info {
  grid-area: info;
  display: grid;
  row-gap: 8rem;
}
.team-member .team-member__info .team-member__name {
  font-size: 22rem;
  line-height: 32rem;
  font-weight: 700;
}
.team-member .team-member__info p {
  font-size: 16rem;
  line-height: 24rem;
  font-weight: 400;
}
.team-member nav {
  grid-area: nav;
}

@media only screen and (min-width: 576px) {
  .team-member {
    grid-template-columns: 128rem auto;
    grid-template-areas: "thumb info" "thumb nav" "thumb .";
  }
  .team-member picture {
    max-width: 128rem;
  }
  .team-member picture img {
    max-width: 128rem;
    min-width: 128rem;
    height: 128rem;
  }
  .team-member .team-member__info .team-member__name {
    font-size: 28px;
    line-height: 36px;
  }
  .team-member .team-member__info p {
    font-size: 20px;
    line-height: 32px;
  }
}
time {
  display: flex;
  gap: 8rem;
}
time *:not(:last-child)::after {
  content: "•";
  margin-left: 8rem;
}

li.tag {
  display: inline-flex;
  flex-direction: row;
  justify-items: center;
  align-items: center;
  list-style: none;
}
li.tag * {
  font-feature-settings: "pnum" on, "lnum" on;
}
li.tag a {
  color: inherit;
  text-decoration: none;
}

.tag-list {
  display: inline-flex;
  column-gap: 16rem;
  flex-wrap: wrap;
  justify-items: center;
  align-items: center;
}
.tag-list li {
  margin-bottom: 0;
}
.tag-list li::before {
  background: none;
  display: none;
}
.tag-list li,
.tag-list a {
  font-size: 16rem;
  line-height: 24rem;
}
.tag-list.tag-list--primary li.tag-delimeter {
  content: "";
  display: block;
  border-radius: 50%;
  background-color: currentColor;
  width: 3rem;
  height: 3rem;
}
.tag-list.tag-list--secondary * {
  color: #4C00EE;
  font-weight: 600;
}
.tag-list.tag-list--secondary *.tag-delimeter::after {
  content: "•";
  color: #FF8C82;
}
.tag-list.tag-list--tertiary {
  column-gap: 20rem;
}
.tag-list.tag-list--tertiary li {
  border-radius: 6rem;
  padding: 8rem 16rem;
}
.tag-list.tag-list--tertiary li,
.tag-list.tag-list--tertiary a {
  font-size: 14rem;
  line-height: 20rem;
  color: black;
  background-color: #D9DADD;
  box-sizing: content-box;
}

@media only screen and (min-width: 576px) {
  .tag-list {
    gap: 32rem;
  }
  .tag-list li,
  .tag-list a {
    font-size: 20rem;
    line-height: 32rem;
  }
  .tag-list.tag-list--secondary {
    column-gap: 32rem;
  }
  .tag-list.tag-list--secondary * {
    font-size: 28rem;
    line-height: 36rem;
  }
  .tag-list.tag-list--tertiary {
    column-gap: 20rem;
  }
  .tag-list.tag-list--tertiary li,
  .tag-list.tag-list--tertiary a {
    font-size: 16rem;
    line-height: 24rem;
  }
}
.quiz {
  padding: 16rem;
  display: flex;
  flex-direction: column;
  row-gap: 40rem;
  border: 1px solid #FF8C82;
  align-items: flex-start;
  margin-bottom: 40rem;
}
.quiz picture, .quiz img {
  width: 100%;
}
.quiz .quiz-form {
  display: inline-flex;
  flex-direction: column;
  gap: 20rem;
  width: 100%;
}
.quiz .quiz-answer {
  width: 100%;
}
.quiz.state--success .quiz-answer.state--checked, .quiz.state--fail .quiz-answer.state--checked {
  background-color: white;
}
.quiz.state--success {
  border-color: #008902;
  background-color: rgba(214, 243, 226, 0.3490196078);
}
.quiz.state--success .form-control--checkbox input[type=checkbox]:checked {
  background-color: #008902;
  border-color: #008902;
}
.quiz.state--fail {
  border-color: #DE1C22;
  background-color: rgba(222, 28, 34, 0.1490196078);
}
.quiz.state--fail .form-control--checkbox input[type=checkbox]:checked {
  background-color: #DE1C22;
  border-color: #DE1C22;
}

@media only screen and (min-width: 992px) {
  .quiz {
    padding: 32rem;
    column-gap: 40rem;
  }
  .quiz .quiz-form {
    gap: 20rem;
  }
  .quiz .quiz-form .button {
    margin-top: 20rem;
  }
}
.quiz-answer {
  padding: 24rem;
  background-color: white;
  border-radius: 16rem;
  column-gap: 16rem;
  row-gap: 0;
  grid-template: "input span" ". div";
  grid-template-columns: auto;
}
.quiz-answer span {
  grid-area: span;
  display: block;
}
.quiz-answer .quiz-hint {
  display: block;
  width: 100%;
  grid-area: div;
}
.quiz-answer .quiz-hint hr {
  margin-top: 20rem;
  margin-bottom: 20rem;
}
.quiz-answer.state--checked {
  background-color: #EEF3FF;
}

@media only screen and (min-width: 992px) {
  .quiz-answer {
    padding: 32rem;
    column-gap: 40rem;
  }
  .quiz-answer:not(state--checked):not(.state--disabled):hover {
    background-color: #EEF3FF;
  }
  .quiz-answer:not(state--checked):not(.state--disabled):hover input[type=checkbox] {
    border-color: #4C00EE;
  }
  .quiz-answer.state--disabled {
    cursor: default;
  }
}
.tabs {
  display: flex;
  width: 100%;
}
.tabs a {
  flex: 1 1 100%;
  padding: 20px;
  width: 100%;
}
.tabs a span > span {
  font-size: 20rem;
  line-height: 32rem;
}
.tabs a span > span.type--mobile {
  display: inline;
}
.tabs a span > span.type--desktop {
  display: none;
}
.tabs a svg {
  stroke: none;
}
.tabs a:hover span::after {
  display: none !important;
}
.tabs a.state--default {
  color: #556080;
  background-color: #EEF3FF;
  border: solid 1rem #EEF3FF;
  border-bottom-color: #FF8C82;
}
.tabs a.state--default:hover {
  background-color: #D7E1FE;
}
.tabs a.state--active {
  color: #4C00EE;
  background-color: transparent;
  border-width: 1px 1px 0px 1px;
  border-style: solid;
  border-color: #FF8C82;
}
.tabs a.state--active svg {
  color: #FF8C82;
}

@media only screen and (min-width: 768px) {
  .tabs a span > span.type--mobile {
    display: none;
  }
  .tabs a span > span.type--desktop {
    display: inline;
  }
}
@media only screen and (min-width: 992px) {
  .page--system .body-bg-image {
    background-image: url("http://realestate-academy.cz.w3.aspify.com/media/tdsixwt1/chyba-bg-desktop.svg");
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 0;
    background-repeat: no-repeat;
    background-position: center 0;
    background-size: 100% auto;
    display: block;
  }
  .page--system header {
    background: #EEF3FF;
  }
  .page--system main {
    min-height: 720rem;
  }
  .page--system main section {
    padding: 160rem 0;
  }
  .page--system main section .section-content {
    max-width: 924rem;
  }
  .page--system main section .section-content .block--right {
    display: inline-flex;
    width: 100%;
    justify-content: flex-end;
    gap: 20rem;
  }
}
.progress-bar {
  border-radius: 5rem;
  background-color: #D7E1FE;
  width: 100%;
}
.progress-bar::before {
  content: "";
  border-radius: 5rem;
  height: 5rem;
  display: block;
  background-color: #FF8C82;
}
.progress-bar[data-value="0"]::before {
  width: 0%;
}
.progress-bar[data-value="1"]::before {
  width: 1%;
}
.progress-bar[data-value="2"]::before {
  width: 2%;
}
.progress-bar[data-value="3"]::before {
  width: 3%;
}
.progress-bar[data-value="4"]::before {
  width: 4%;
}
.progress-bar[data-value="5"]::before {
  width: 5%;
}
.progress-bar[data-value="6"]::before {
  width: 6%;
}
.progress-bar[data-value="7"]::before {
  width: 7%;
}
.progress-bar[data-value="8"]::before {
  width: 8%;
}
.progress-bar[data-value="9"]::before {
  width: 9%;
}
.progress-bar[data-value="10"]::before {
  width: 10%;
}
.progress-bar[data-value="11"]::before {
  width: 11%;
}
.progress-bar[data-value="12"]::before {
  width: 12%;
}
.progress-bar[data-value="13"]::before {
  width: 13%;
}
.progress-bar[data-value="14"]::before {
  width: 14%;
}
.progress-bar[data-value="15"]::before {
  width: 15%;
}
.progress-bar[data-value="16"]::before {
  width: 16%;
}
.progress-bar[data-value="17"]::before {
  width: 17%;
}
.progress-bar[data-value="18"]::before {
  width: 18%;
}
.progress-bar[data-value="19"]::before {
  width: 19%;
}
.progress-bar[data-value="20"]::before {
  width: 20%;
}
.progress-bar[data-value="21"]::before {
  width: 21%;
}
.progress-bar[data-value="22"]::before {
  width: 22%;
}
.progress-bar[data-value="23"]::before {
  width: 23%;
}
.progress-bar[data-value="24"]::before {
  width: 24%;
}
.progress-bar[data-value="25"]::before {
  width: 25%;
}
.progress-bar[data-value="26"]::before {
  width: 26%;
}
.progress-bar[data-value="27"]::before {
  width: 27%;
}
.progress-bar[data-value="28"]::before {
  width: 28%;
}
.progress-bar[data-value="29"]::before {
  width: 29%;
}
.progress-bar[data-value="30"]::before {
  width: 30%;
}
.progress-bar[data-value="31"]::before {
  width: 31%;
}
.progress-bar[data-value="32"]::before {
  width: 32%;
}
.progress-bar[data-value="33"]::before {
  width: 33%;
}
.progress-bar[data-value="34"]::before {
  width: 34%;
}
.progress-bar[data-value="35"]::before {
  width: 35%;
}
.progress-bar[data-value="36"]::before {
  width: 36%;
}
.progress-bar[data-value="37"]::before {
  width: 37%;
}
.progress-bar[data-value="38"]::before {
  width: 38%;
}
.progress-bar[data-value="39"]::before {
  width: 39%;
}
.progress-bar[data-value="40"]::before {
  width: 40%;
}
.progress-bar[data-value="41"]::before {
  width: 41%;
}
.progress-bar[data-value="42"]::before {
  width: 42%;
}
.progress-bar[data-value="43"]::before {
  width: 43%;
}
.progress-bar[data-value="44"]::before {
  width: 44%;
}
.progress-bar[data-value="45"]::before {
  width: 45%;
}
.progress-bar[data-value="46"]::before {
  width: 46%;
}
.progress-bar[data-value="47"]::before {
  width: 47%;
}
.progress-bar[data-value="48"]::before {
  width: 48%;
}
.progress-bar[data-value="49"]::before {
  width: 49%;
}
.progress-bar[data-value="50"]::before {
  width: 50%;
}
.progress-bar[data-value="51"]::before {
  width: 51%;
}
.progress-bar[data-value="52"]::before {
  width: 52%;
}
.progress-bar[data-value="53"]::before {
  width: 53%;
}
.progress-bar[data-value="54"]::before {
  width: 54%;
}
.progress-bar[data-value="55"]::before {
  width: 55%;
}
.progress-bar[data-value="56"]::before {
  width: 56%;
}
.progress-bar[data-value="57"]::before {
  width: 57%;
}
.progress-bar[data-value="58"]::before {
  width: 58%;
}
.progress-bar[data-value="59"]::before {
  width: 59%;
}
.progress-bar[data-value="60"]::before {
  width: 60%;
}
.progress-bar[data-value="61"]::before {
  width: 61%;
}
.progress-bar[data-value="62"]::before {
  width: 62%;
}
.progress-bar[data-value="63"]::before {
  width: 63%;
}
.progress-bar[data-value="64"]::before {
  width: 64%;
}
.progress-bar[data-value="65"]::before {
  width: 65%;
}
.progress-bar[data-value="66"]::before {
  width: 66%;
}
.progress-bar[data-value="67"]::before {
  width: 67%;
}
.progress-bar[data-value="68"]::before {
  width: 68%;
}
.progress-bar[data-value="69"]::before {
  width: 69%;
}
.progress-bar[data-value="70"]::before {
  width: 70%;
}
.progress-bar[data-value="71"]::before {
  width: 71%;
}
.progress-bar[data-value="72"]::before {
  width: 72%;
}
.progress-bar[data-value="73"]::before {
  width: 73%;
}
.progress-bar[data-value="74"]::before {
  width: 74%;
}
.progress-bar[data-value="75"]::before {
  width: 75%;
}
.progress-bar[data-value="76"]::before {
  width: 76%;
}
.progress-bar[data-value="77"]::before {
  width: 77%;
}
.progress-bar[data-value="78"]::before {
  width: 78%;
}
.progress-bar[data-value="79"]::before {
  width: 79%;
}
.progress-bar[data-value="80"]::before {
  width: 80%;
}
.progress-bar[data-value="81"]::before {
  width: 81%;
}
.progress-bar[data-value="82"]::before {
  width: 82%;
}
.progress-bar[data-value="83"]::before {
  width: 83%;
}
.progress-bar[data-value="84"]::before {
  width: 84%;
}
.progress-bar[data-value="85"]::before {
  width: 85%;
}
.progress-bar[data-value="86"]::before {
  width: 86%;
}
.progress-bar[data-value="87"]::before {
  width: 87%;
}
.progress-bar[data-value="88"]::before {
  width: 88%;
}
.progress-bar[data-value="89"]::before {
  width: 89%;
}
.progress-bar[data-value="90"]::before {
  width: 90%;
}
.progress-bar[data-value="91"]::before {
  width: 91%;
}
.progress-bar[data-value="92"]::before {
  width: 92%;
}
.progress-bar[data-value="93"]::before {
  width: 93%;
}
.progress-bar[data-value="94"]::before {
  width: 94%;
}
.progress-bar[data-value="95"]::before {
  width: 95%;
}
.progress-bar[data-value="96"]::before {
  width: 96%;
}
.progress-bar[data-value="97"]::before {
  width: 97%;
}
.progress-bar[data-value="98"]::before {
  width: 98%;
}
.progress-bar[data-value="99"]::before {
  width: 99%;
}

.page--sign-in main {
  z-index: 1;
}
.page--sign-in main section .section-content > * {
  width: 100%;
}
.page--sign-in main section .section-content > *:not(form) {
  color: white;
  text-align: center;
}
.page--sign-in main section .section-content {
  display: flex;
  flex-direction: column;
  row-gap: 20rem;
}
.page--sign-in main section .section-content form {
  background-color: white;
  padding: 40rem 16rem;
  display: flex;
  flex-direction: column;
  row-gap: 20rem;
}
.page--sign-in main section .section-content form .form-control--input input {
  box-shadow: 0 0 0 1rem #BEC0C5;
}
.page--sign-in main section .section-content form .button {
  align-self: inherit;
}
.page--sign-in main section .section-content form .button.style--secondary {
  border-color: #AFAFAF;
  color: black;
}
.page--sign-in main section .section-content form .button.style--secondary svg {
  width: 18rem;
  height: 18rem;
}
.page--sign-in main section .section-content form .or-separator {
  display: flex;
  align-items: center;
  gap: 12rem;
  white-space: nowrap;
  color: #686868;
}
.page--sign-in main section .section-content form .or-separator::before, .page--sign-in main section .section-content form .or-separator::after {
  content: "";
  height: 1rem;
  background-color: #D9DADD;
  width: 100%;
}
.page--sign-in footer nav * {
  color: white;
}

@media only screen and (min-width: 992px) {
  .page--sign-in .body-bg-image {
    background-image: url("http://realestate-academy.cz.w3.aspify.com/media/tdsixwt1/chyba-bg-desktop.svg");
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 0;
    opacity: 0.1;
    background-repeat: no-repeat;
    background-position: center 0;
    background-size: 100% auto;
    display: block;
  }
  .page--sign-in main {
    justify-content: center;
    min-height: 720rem;
  }
  .page--sign-in main section {
    max-width: 474rem;
  }
  .page--sign-in main section .section-content {
    row-gap: 40rem;
    max-height: max-content;
  }
  .page--sign-in main section .section-content form {
    padding: 40rem;
  }
}
.page--sign-up main {
  z-index: 1;
}
.page--sign-up main section .section-content > * {
  width: 100%;
}
.page--sign-up main section .section-content > *:not(form) {
  color: white;
  text-align: center;
}
.page--sign-up main section .section-content {
  display: flex;
  flex-direction: column;
  row-gap: 20rem;
}
.page--sign-up main section .section-content form {
  background-color: white;
  padding: 40rem 16rem;
  display: flex;
  flex-direction: column;
  row-gap: 20rem;
}
.page--sign-up main section .section-content form .form-control--input input {
  box-shadow: 0 0 0 1rem #BEC0C5;
}
.page--sign-up main section .section-content form .button {
  align-self: inherit;
}
.page--sign-up main section .section-content form .button.style--secondary {
  border-color: #AFAFAF;
  color: black;
}
.page--sign-up main section .section-content form .button.style--secondary svg {
  width: 18rem;
  height: 18rem;
}
.page--sign-up main section .section-content form .or-separator {
  display: flex;
  align-items: center;
  gap: 12rem;
  white-space: nowrap;
  color: #686868;
}
.page--sign-up main section .section-content form .or-separator::before, .page--sign-up main section .section-content form .or-separator::after {
  content: "";
  height: 1rem;
  background-color: #D9DADD;
  width: 100%;
}
.page--sign-up footer nav * {
  color: white;
}

@media only screen and (min-width: 992px) {
  .page--sign-up .body-bg-image {
    background-image: url("http://realestate-academy.cz.w3.aspify.com/media/tdsixwt1/chyba-bg-desktop.svg");
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 0;
    opacity: 0.1;
    background-repeat: no-repeat;
    background-position: center 0;
    background-size: 100% auto;
    display: block;
  }
  .page--sign-up main {
    justify-content: center;
    min-height: 720rem;
  }
  .page--sign-up main section {
    max-width: 474rem;
  }
  .page--sign-up main section .section-content {
    row-gap: 40rem;
    max-height: max-content;
  }
  .page--sign-up main section .section-content form {
    padding: 40rem;
  }
}
.page--course-modules main .header {
  margin-top: 40rem;
}
.page--course-modules main .module-list,
.page--course-modules main .member-list {
  display: grid;
  gap: 20rem;
}
.page--course-modules main .member-list {
  gap: 56rem;
}
.page--course-modules main .member-list h2 {
  margin-bottom: -36rem;
}
.page--course-modules main > section {
  margin-bottom: 80rem;
}
.page--course-modules main > section hr {
  display: none;
}

@media only screen and (min-width: 768px) {
  .page--course-modules .body-bg-image {
    background-image: url("http://realestate-academy.cz.w3.aspify.com/media/tdsixwt1/chyba-bg-desktop.svg");
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 0;
    background-repeat: no-repeat;
    background-position: center 0;
    background-size: 100% auto;
    display: block;
  }
  .page--course-modules header {
    background: #EEF3FF;
  }
  .page--course-modules main {
    min-height: 720rem;
  }
  .page--course-modules main .header {
    margin-top: 80rem;
  }
  .page--course-modules main .header hr {
    display: block;
    margin-bottom: 0;
  }
  .page--course-modules main .module-list {
    gap: 40rem;
    grid-template-columns: repeat(2, 1fr);
  }
  .page--course-modules main .module-list article {
    height: auto;
  }
  .page--course-modules main .module-list h2:first-child {
    grid-column: span 2;
    margin-bottom: -20rem;
    max-height: max-content;
  }
  .page--course-modules main .member-list {
    column-gap: 40rem;
    row-gap: 40rem;
    grid-template-columns: repeat(1, 1fr);
    margin-top: 48rem;
    margin-bottom: 0;
  }
  .page--course-modules main .member-list h2:first-child {
    max-height: max-content;
    margin-bottom: 40rem;
  }
  .page--course-modules main > section hr {
    display: block;
    margin-top: 80rem;
  }
}
@media only screen and (min-width: 1440px) {
  .page--course-modules main .module-list {
    grid-template-columns: repeat(3, 1fr);
  }
  .page--course-modules main .module-list article {
    height: 381rem;
  }
  .page--course-modules main .module-list h2:first-child {
    grid-column: span 3;
  }
  .page--course-modules main .member-list {
    grid-template-columns: repeat(2, 1fr);
  }
  .page--course-modules main .member-list h2:first-child {
    grid-column: span 2;
  }
}
.page--my-courses main .header {
  margin: 40rem auto;
}
.page--my-courses main .header hr {
  display: none;
}
.page--my-courses main .course-list {
  display: grid;
  gap: 40rem;
}

@media only screen and (min-width: 992px) {
  .page--my-courses .body-bg-image {
    background-image: url("http://realestate-academy.cz.w3.aspify.com/media/tdsixwt1/chyba-bg-desktop.svg");
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 0;
    background-repeat: no-repeat;
    background-position: center 0;
    background-size: 100% auto;
    display: block;
  }
  .page--my-courses header {
    background: #EEF3FF;
  }
  .page--my-courses main {
    min-height: 720rem;
  }
  .page--my-courses main .header {
    margin: 80rem auto;
  }
  .page--my-courses main .course-list {
    column-gap: 64rem;
    row-gap: 64rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (min-width: 1440px) {
  .page--my-courses main .course-list {
    column-gap: 80rem;
    row-gap: 80rem;
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 1920px) {
  .page--my-courses main .course-list {
    column-gap: 140rem;
    row-gap: 100rem;
    grid-template-columns: repeat(3, 425rem);
  }
}
.header--main {
  height: 80rem;
  align-items: center;
  padding: 0;
  position: relative;
  display: flex;
  justify-content: space-between;
}
.header--main * {
  color: #556080;
}
.header--main ul {
  display: flex;
}
.header--main .nav--logo {
  height: 48rem;
  width: 161rem;
}
.header--main .nav--logo svg {
  height: 48rem;
  width: 161rem;
}
.header--main .nav--main-desktop {
  display: none;
}
.header--main .nav--main-mobile {
  display: block;
}
.header--main .nav--main-mobile .icon-button:hover {
  background-color: transparent;
}

@media only screen and (min-width: 576px) {
  .header--main .nav--main-desktop {
    display: flex;
  }
  .header--main .nav--main-desktop ul {
    gap: 24rem;
  }
  .header--main .nav--main-desktop ul li {
    position: relative;
    display: flex;
  }
  .header--main .nav--main-desktop ul li:not(:last-child)::after {
    content: "";
    margin-left: 24rem;
    width: 2rem;
    height: 24rem;
    background-color: #FF8C82;
  }
  .header--main .nav--main-mobile {
    display: none;
  }
}
.page--account-settings main section .section-content {
  max-width: 460rem;
}
.page--account-settings main section .section-content nav.desktop {
  display: none;
}
.page--account-settings main section .section-content nav.mobile {
  display: flex;
  align-items: center;
  margin-right: 60rem;
  gap: 20rem;
  margin-bottom: 48rem;
}
.page--account-settings main section .section-content nav.mobile h1 {
  color: #556080;
  font-size: 16rem;
  line-height: 24rem;
  text-align: center;
  flex-grow: 1;
}
.page--account-settings main section .section-content .section__body,
.page--account-settings main section .section-content .section__body > form {
  display: flex;
  flex-direction: column;
  gap: 20rem;
}
.page--account-settings main section .section-content .section__body .block--right,
.page--account-settings main section .section-content .section__body > form .block--right {
  display: inline-flex;
  width: 100%;
  justify-content: flex-end;
  gap: 20rem;
}
.page--account-settings main section .section-content .section__body hr,
.page--account-settings main section .section-content .section__body > form hr {
  border-color: #202532;
  border-width: 1rem;
  max-width: 100%;
  margin: 20rem 0;
}
.page--account-settings main section .section-content .section__body h1,
.page--account-settings main section .section-content .section__body > form h1 {
  display: none;
}

@media only screen and (min-width: 992px) {
  .page--account-settings main {
    min-height: 1300rem;
  }
  .page--account-settings main section .section-content {
    max-width: 460rem;
  }
  .page--account-settings main section .section-content nav.desktop {
    display: block;
  }
  .page--account-settings main section .section-content nav.mobile {
    display: none;
  }
  .page--account-settings main section .section-content .section__body h1,
  .page--account-settings main section .section-content .section__body > form h1 {
    margin: 80rem 0;
    display: block;
  }
  .page--account-settings main section .section-content .section__body h2,
  .page--account-settings main section .section-content .section__body > form h2 {
    font-size: 28rem;
    line-height: 40rem;
    font-weight: 700;
  }
  .page--account-settings main section .section-content .section__body hr,
  .page--account-settings main section .section-content .section__body > form hr {
    margin: 40rem 0;
  }
  .page--account-settings main section .section-content .section__body .button,
  .page--account-settings main section .section-content .section__body .text-button,
  .page--account-settings main section .section-content .section__body > form .button,
  .page--account-settings main section .section-content .section__body > form .text-button {
    align-self: flex-end;
  }
}
.page--course-detail {
  background-color: white;
}
.page--course-detail header {
  grid-area: navigation;
}
.page--course-detail main {
  grid-area: main;
  padding: 0;
}
.page--course-detail main .course-detail__body {
  display: flex;
  flex-direction: column;
  row-gap: 40rem;
}
.page--course-detail main .course-detail__body .header__content {
  padding: 0 16rem 20rem 16rem;
  margin-top: 20rem;
  margin-bottom: -40rem;
  min-width: 100%;
}
.page--course-detail main .course-detail__body .header__content hr {
  display: none;
}
.page--course-detail main .course-detail__body .tabs {
  margin: 0rem auto;
}
.page--course-detail main .course-detail__body .section__text {
  padding-bottom: 40rem;
}
.page--course-detail main .course-detail__body .section__text * {
  max-width: 100%;
}
.page--course-detail main .course-detail__body .section__text > *:not(img, .box) {
  padding-left: 16rem;
  padding-right: 16rem;
}
.page--course-detail main .course-detail__body .section__text h2 + *,
.page--course-detail main .course-detail__body .section__text h3 + * {
  margin-top: 20rem;
}
.page--course-detail main .course-detail__body .section__text picture + *,
.page--course-detail main .course-detail__body .section__text figure + *,
.page--course-detail main .course-detail__body .section__text * + picture,
.page--course-detail main .course-detail__body .section__text * + figure,
.page--course-detail main .course-detail__body .section__text * + picture img,
.page--course-detail main .course-detail__body .section__text * + div,
.page--course-detail main .course-detail__body .section__text div + *,
.page--course-detail main .course-detail__body .section__text * + h2,
.page--course-detail main .course-detail__body .section__text * + h3 {
  margin-top: 40rem;
}
.page--course-detail main .course-detail__body .section__audio {
  padding: 20rem;
}
.page--course-detail .basis {
  display: none;
  grid-area: basis;
}
.page--course-detail .basis.is-open {
  background-color: #EEF3FF;
  position: absolute;
  left: 0;
  right: 0;
  min-height: 100%;
  z-index: 999;
  display: flex;
}
.page--course-detail .glossary {
  /*display: none;*/
  grid-area: glossary;
  background-color: #EEF3FF;
  position: absolute;
  left: 0;
  right: 0;
  top: 80rem;
  min-height: calc(100% - 80rem);
  z-index: 998;
  transition-duration: 0.25s;
  transform: translateX(100%);
}
.page--course-detail .glossary.is-open {
  transform: translateX(0);
}
.page--course-detail .glossary-detail {
  background-color: #EEF3FF;
  position: absolute;
  left: 0;
  right: 0;
  top: 80rem;
  min-height: calc(100% - 80rem);
  z-index: 999;
  transition-duration: 0.25s;
  transform: translateX(100%);
}
.page--course-detail .glossary-detail.is-open {
  transform: translateX(0);
}

@media only screen and (min-width: 992px) {
  .page--course-detail {
    background-color: #EEF3FF;
    display: grid;
    grid-template: "navigation navigation navigation" "basis main glossary";
    grid-template-columns: 300rem 1fr max-content;
    grid-template-rows: auto 1fr auto;
    height: 100vh;
  }
  .page--course-detail .basis {
    display: flex;
    /*width: 20vw;*/
    width: 100%;
  }
  .page--course-detail .basis.is-open {
    position: relative;
  }
  .page--course-detail .glossary {
    display: flex;
    width: 360rem;
    left: auto;
  }
  .page--course-detail .glossary-detail {
    width: 360rem;
    left: auto;
  }
  .page--course-detail main,
  .page--course-detail aside {
    overflow-y: auto;
  }
  .page--course-detail main .course-detail__body {
    background: #FFFFFF;
    box-shadow: 0px 4px 35px rgba(32, 56, 115, 0.1), 0px 0px 8px rgba(32, 56, 115, 0.11);
    flex-grow: 1;
    padding: 0 40rem;
  }
  .page--course-detail main .course-detail__body .header__content {
    padding: 0;
    padding-top: 40rem;
    margin-bottom: -80rem;
  }
  .page--course-detail main .course-detail__body .header__content hr {
    display: inherit;
  }
  .page--course-detail main .course-detail__body .tabs {
    margin: 0rem auto;
  }
  .page--course-detail main .course-detail__body > * {
    margin: 0 auto;
    max-width: 960rem;
  }
  .page--course-detail main .course-detail__body .section__text picture + *,
  .page--course-detail main .course-detail__body .section__text figure + *,
  .page--course-detail main .course-detail__body .section__text * + picture,
  .page--course-detail main .course-detail__body .section__text * + figure,
  .page--course-detail main .course-detail__body .section__text * + picture img,
  .page--course-detail main .course-detail__body .section__text * + div,
  .page--course-detail main .course-detail__body .section__text div + *,
  .page--course-detail main .course-detail__body .section__text * + h2,
  .page--course-detail main .course-detail__body .section__text * + h3 {
    margin-top: 80rem;
  }
  .page--course-detail main .course-detail__body .section__text > *:not(img, .box) {
    padding-left: inherit;
    padding-right: inherit;
  }
}
@media only screen and (min-width: 1440px) {
  .page--course-detail {
    grid-template-columns: 360rem 1fr max-content;
  }
  .page--course-detail .glossary {
    display: flex;
    width: 360rem;
  }
  .page--course-detail .glossary.is-open {
    position: static;
    left: auto;
    min-height: 0;
  }
}
@media only screen and (min-width: 1920px) {
  .page--course-detail main .course-detail__body {
    row-gap: 80rem;
    padding: 80rem;
  }
  .page--course-detail .basis,
  .page--course-detail .glossary {
    width: 360rem;
  }
}
body {
  display: flex;
  flex-direction: column;
  background-color: #EEF3FF;
  overflow-x: hidden;
}
body header,
body main,
body footer {
  padding: 16rem;
}
body.fullscreen-page {
  background-color: #4C00EE;
  width: 100%;
  min-height: 100vh;
}
body .body-bg-image {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  right: 0;
}
body main,
body section {
  width: 100%;
}
body main .section-content.text-content a,
body section .section-content.text-content a {
  font-size: 16rem;
}
body main .section-content a:not(a.text-button):not(a.button),
body section .section-content a:not(a.text-button):not(a.button) {
  font-size: inherit;
  font-weight: normal;
  color: inherit;
  text-underline-offset: 5rem;
}
body main .section-content p .text-button span,
body section .section-content p .text-button span {
  font-size: 16rem;
  line-height: 24rem;
  font-weight: 700;
  color: inherit;
}
body main .section-content p + .button,
body section .section-content p + .button {
  margin-top: 20rem;
}
body main .section-content p + form,
body section .section-content p + form {
  margin-top: 40rem;
  display: inline-flex;
  flex-direction: column;
  gap: 20rem;
}
body main .section-content p + form .button,
body section .section-content p + form .button {
  align-self: flex-start;
}
body main .section-content form,
body section .section-content form {
  width: 100%;
}

@media only screen and (min-width: 992px) {
  body {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
  }
  body header,
  body main,
  body footer {
    padding: 20rem 24rem !important;
  }
  body main {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    z-index: 1;
  }
  body aside {
    max-width: 360rem;
  }
  body section {
    max-width: 1556rem;
    margin: 0 auto;
  }
  body section .section-content h1 + p {
    margin-top: 8rem;
  }
  body section .section-content p .text-button span {
    font-size: 20rem;
    line-height: 32rem;
  }
  body section .section-content h1 + form {
    margin-top: 40rem;
  }
  body section .section-content form {
    display: inline-flex;
    flex-direction: column;
    width: 450rem;
    gap: 40rem;
  }
  body section .section-content form .button {
    align-self: flex-start;
  }
}
.page--default {
  background-color: white;
}
.page--default main {
  max-width: 100%;
  display: flex;
  flex-direction: column;
}
.page--default main .text-content h2,
.page--default main .text-content h3 {
  margin-bottom: 8rem;
}
.page--default main .text-content p + h2, .page--default main .text-content p + h3,
.page--default main .text-content h2 + h2,
.page--default main .text-content h2 + h3,
.page--default main .text-content h3 + h2,
.page--default main .text-content h3 + h3 {
  margin-top: 40rem;
}
.page--default main .text-content .accordion {
  margin-top: 20rem;
  margin-bottom: 40rem;
}

@media only screen and (min-width: 992px) {
  .page--default main {
    max-width: 1554rem;
    margin: 0 auto;
  }
  .page--default main .text-content p + h2, .page--default main .text-content p + h3,
  .page--default main .text-content h2 + h2,
  .page--default main .text-content h2 + h3,
  .page--default main .text-content h3 + h2,
  .page--default main .text-content h3 + h3 {
    margin-top: 80rem;
  }
  .page--default main .text-content .accordion {
    margin-top: 40rem;
    margin-bottom: 80rem;
  }
}
hr {
  border: 0;
  margin: 80rem 0;
  border-top-color: #FF8C82;
  border-top-style: solid;
  border-width: 5rem;
  max-width: 128rem;
}

.header--course {
  height: 80rem;
  align-items: center;
  padding: 0;
  position: relative;
  display: flex;
  justify-content: space-between;
}
.header--course * {
  color: #556080;
}
.header--course nav {
  width: 100%;
  display: block;
}
.header--course .breadcrumb {
  align-items: center;
}
.header--course .nav--desktop {
  display: none;
}
.header--course .nav--mobile {
  display: inherit;
}
.header--course .nav--mobile .breadcrumb {
  width: 50%;
  margin: 0 auto;
  align-items: center;
}
.header--course .nav--mobile .breadcrumb li {
  width: 100%;
}
.header--course .nav--mobile .breadcrumb li .text-button span {
  white-space: normal;
}
.header--course .nav--mobile .breadcrumb li .text-button:hover span {
  white-space: normal;
}
.header--course .nav--mobile .breadcrumb li .text-button:hover span::after {
  display: none;
}
.header--course .nav--mobile .breadcrumb li:not(:last-child) {
  display: none;
}
.header--course .icon-button:hover {
  background-color: transparent !important;
}
.header--course .button {
  min-width: max-content;
  margin-left: auto;
}
.header--course .button.style--tertiary.state--active svg, .header--course .button.style--tertiary.state--active path {
  color: white;
}

@media only screen and (min-width: 992px) {
  .header--course .nav--desktop {
    display: inherit;
  }
  .header--course .nav--mobile {
    display: none;
  }
  .header--course .breadcrumb {
    align-items: center;
  }
}
.course-bottom-navigation {
  display: flex;
  flex-direction: column;
  row-gap: 20rem;
  align-items: center;
  width: 100%;
  padding-left: 16rem;
  padding-right: 16rem;
  padding-bottom: 40rem;
}
.course-bottom-navigation * {
  font-size: 16rem;
  line-height: 24rem;
}
.course-bottom-navigation .course-bottom-navigation__label {
  font-weight: 700;
  text-align: center;
}
.course-bottom-navigation nav {
  width: 100%;
  display: block;
  margin-top: 0 !important;
}
.course-bottom-navigation nav > * {
  width: 100%;
}

@media only screen and (min-width: 576px) {
  .course-bottom-navigation {
    padding: 0;
  }
  .course-bottom-navigation nav {
    width: max-content;
  }
}
/*@include screen-xxl {
    .course-bottom-navigation {
        padding-bottom: u(80);
    }
}*/
.header--login-screen {
  height: 80rem;
  align-items: center;
  position: relative;
  display: flex;
  justify-content: space-between;
}
.header--login-screen .nav--logo {
  height: 32rem;
  width: 113rem;
}
.header--login-screen .nav--logo svg {
  height: 32rem;
  width: 113rem;
}

@media only screen and (min-width: 576px) {
  .header--login-screen .nav--logo {
    height: 48rem;
    width: 150rem;
  }
  .header--login-screen .nav--logo svg {
    height: 48rem;
    width: 150rem;
  }
}
.image, picture {
  margin: 0;
}
.image img, picture img {
  width: 100%;
}
.image figcaption, picture figcaption {
  margin-top: 12rem;
}
.image figcaption.figcaption--right, picture figcaption.figcaption--right {
  text-align: right;
}
.image.with-border img, picture.with-border img {
  border: 1px #d0d0cf solid;
}

.form-control--input {
  display: flex;
  flex-direction: column;
  gap: 8rem;
  align-items: center;
  flex-wrap: nowrap;
  outline: none;
}
.form-control--input, .form-control--input > * {
  border-radius: 6rem;
}
.form-control--input label,
.form-control--input input,
.form-control--input p {
  font-size: 16rem;
  line-height: 24rem;
  display: block;
  width: 100%;
}
.form-control--input label {
  font-weight: 600;
}
.form-control--input input {
  border: 0;
  margin: 0;
  box-sizing: border-box;
  height: 40rem;
  flex-grow: 1;
  padding: 12px 16px;
  display: block;
  background-color: white;
  box-shadow: 0 0 0 1rem #D9DADD;
}
.form-control--input input:not(state--disabled):focus {
  outline: 0;
  box-shadow: 0 0 0 3rem #4C00EE;
}
.form-control--input input::placeholder {
  color: #838791;
}
.form-control--input.input--error input {
  box-shadow: 0 0 0 3rem #DE1C22;
  background-image: url(assets/error.svg);
  background-repeat: no-repeat;
  background-position: calc(100% - 10rem) center;
  background-size: 20rem;
}
.form-control--input.input--success input {
  background-image: url(assets/success.svg);
  background-repeat: no-repeat;
  background-position: calc(100% - 10rem) center;
  background-size: 20rem;
}
.form-control--input.input--glossary-search {
  position: relative;
  height: 40rem;
}
.form-control--input.input--glossary-search input {
  background-color: transparent;
  box-shadow: 0 0 0 1rem #556080;
  font-size: 14rem;
  line-height: 20rem;
  padding: 10rem 16rem;
}
.form-control--input.input--glossary-search .icon-button {
  display: none;
}
.form-control--input.input--glossary-search.state--filled .icon-button,
.form-control--input.input--glossary-search input:focus .icon-button {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  padding: 10rem;
  z-index: 99;
}
.form-control--input.input--glossary-search.state--filled .icon-button:hover,
.form-control--input.input--glossary-search input:focus .icon-button:hover {
  background-color: transparent;
  color: #4C00EE;
}
.form-control--input.input--glossary-search input:focus, .form-control--input.input--glossary-search.state--filled input {
  box-shadow: 0 0 0 1rem #4C00EE;
  background-color: white;
}
.form-control--input.state--disabled::placeholder {
  color: #6E727C;
}
.form-control--input.state--disabled input {
  background-color: #EAEAEB;
  border-color: #BEC0C5;
}
.form-control--input.state--disabled input:focus {
  box-shadow: 0 0 0 1rem #D9DADD;
}
.form-control--input p[class^=description--] {
  color: black;
}
.form-control--input p[class^=description--].description--bottom {
  color: #50545E;
}

p.error {
  font-weight: 500;
  color: #DE1C22;
  margin-top: 0 !important;
}

@media only screen and (min-width: 576px) {
  .form-control--input label,
  .form-control--input p {
    font-size: 16rem;
    line-height: 24rem;
  }
  .form-control--input input {
    font-size: 20rem;
    line-height: 32rem;
    height: 56rem;
  }
  .form-control--input input:focus {
    box-shadow: 0 0 0 5rem #4C00EE;
  }
  .form-control--input.input--error input {
    box-shadow: 0 0 0 5rem #DE1C22;
  }
  .form-control--input.input--success input, .form-control--input.input--error input {
    background-position: calc(100% - 16rem) center;
    background-size: 24rem;
  }
}
.header {
  display: flex;
  flex-direction: column;
  gap: 20rem;
}
.header h1 {
  margin-bottom: 8rem;
}
.header hr {
  margin: 40rem 0;
}
.header .header__content nav {
  display: flex;
  gap: 20rem;
  margin-top: 20rem;
}
.header .header__thumb {
  order: -1;
}

@media only screen and (min-width: 992px) {
  .header {
    gap: 80rem;
    align-items: center;
    flex-direction: row;
  }
  .header .header__content {
    max-width: 604rem;
    display: flex;
    flex-direction: column;
  }
  .header .header__content nav {
    gap: 40rem;
    margin-top: 32rem;
  }
  .header .header__thumb {
    order: 1;
  }
  .header hr {
    margin: 80rem 0;
  }
}
.icon-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 12rem;
  margin: 0;
  max-width: 48rem;
  max-height: 48rem;
  border: none;
  border-radius: 6rem;
  cursor: pointer;
  transition: all 0.3s;
}
.icon-button.style--primary {
  color: #4C00EE;
  background-color: transparent;
}
.icon-button.style--primary:hover:not(.state--disabled) {
  color: white;
  background-color: #4C00EE;
}
.icon-button.style--primary.state--disabled {
  color: #aaa;
}
.icon-button.style--secondary {
  color: #4C00EE;
  border: #4C00EE solid 1rem;
  background-color: transparent;
}
.icon-button.style--secondary:hover(.state--disabled) {
  color: #4000C7;
  border-color: #4000C7;
}
.icon-button.style--secondary.state--disabled {
  color: #aaa;
  border-color: #aaa;
}
.icon-button.style--primary-contrast {
  color: #A4CFD3;
}
.icon-button.style--primary-contrast:hover:not(.state--disabled) {
  color: white;
  background-color: #A4CFD3;
}
.icon-button.style--secondary-contrast {
  color: #A4CFD3;
  border: #A4CFD3 solid 1rem;
  background-color: transparent;
}
.icon-button.state--disabled {
  cursor: not-allowed;
  color: white;
}

.glossary-detail {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 24rem 24rem 0rem;
  gap: 40rem;
  isolation: isolate;
}
.glossary-detail nav {
  width: 100%;
  display: flex;
  align-items: center;
  margin-left: -16rem;
}
.glossary-detail nav .glossary-detail__title {
  text-align: center;
  margin-right: 16rem;
  width: 100%;
  font-weight: 600;
  font-size: 16rem;
  line-height: 24rem;
}
.glossary-detail nav .icon-button.style--primary:hover {
  background-color: transparent;
  color: inherit;
}
.glossary-detail .glossary-detail__body.text-content {
  width: 100%;
}
.glossary-detail .glossary-detail__body.text-content * {
  max-width: 100%;
}
.glossary-detail .glossary-detail__body.text-content p,
.glossary-detail .glossary-detail__body.text-content div,
.glossary-detail .glossary-detail__body.text-content span,
.glossary-detail .glossary-detail__body.text-content a,
.glossary-detail .glossary-detail__body.text-content p,
.glossary-detail .glossary-detail__body.text-content ul,
.glossary-detail .glossary-detail__body.text-content ol,
.glossary-detail .glossary-detail__body.text-content li {
  font-size: 16rem;
  line-height: 24rem;
}
.glossary-detail .glossary-detail__body.text-content ul:not([class]):not([id]) li::before {
  top: 9rem;
}
.glossary-detail .glossary-detail__body.text-content h3 {
  font-size: 22rem;
  line-height: 32rem;
}
.glossary-detail .glossary-detail__body.text-content h3 + ul {
  margin-top: 8rem;
}

.text-button.style--glossary-item {
  display: flex;
  justify-content: space-between;
  padding: 20rem 16rem;
  gap: 12rem;
  width: 100%;
}
.text-button.style--glossary-item * {
  color: #556080;
}
.text-button.style--glossary-item span {
  white-space: break-spaces;
}
.text-button.style--glossary-item svg {
  min-width: 24rem;
  min-height: 24rem;
}
.text-button.style--glossary-item:hover {
  background: #D7E1FE;
}
.text-button.style--glossary-item:hover * {
  color: #202532;
}
.text-button.style--glossary-item:hover span {
  display: inline;
  text-decoration: underline;
  text-underline-offset: 4rem;
}
.text-button.style--glossary-item:hover span::after {
  display: none !important;
}

.glossary {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 24rem 24rem 0rem;
  gap: 20rem;
  isolation: isolate;
}
.glossary .input--glossary-search {
  width: 100%;
}
.glossary nav {
  width: 100%;
}
.glossary nav ul > li:not(:last-child) {
  border-bottom: solid 1rem #BFD0FD;
}

.filler {
  display: inline-flex;
  align-items: flex-start;
  flex-direction: column;
  row-gap: 20rem;
  padding: 40rem 16rem;
  background-color: #EEF3FF;
  margin-bottom: 40rem;
}
.filler p {
  line-height: 40rem;
}
.filler .link--filler {
  font-weight: 700;
  letter-spacing: 0.2rem;
  color: #4C00EE;
}
.filler .link--filler.link--filler--correct {
  color: #008902;
}
.filler .link--filler.link--filler--wrong {
  color: #DE1C22;
}

@media only screen and (min-width: 576px) {
  .filler {
    padding: 40rem;
  }
  .filler a.link--filler {
    font-size: 20rem;
    line-height: 32rem;
  }
}
@media only screen and (min-width: 992px) {
  .filler {
    margin-bottom: 80rem;
  }
}
footer {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  row-gap: 80rem;
  padding: 0;
}
footer nav ul {
  display: flex;
  flex-direction: column;
}
footer nav ul li {
  line-height: 48rem;
  min-height: 48rem;
}
footer nav ul li .text-button {
  min-height: 48rem;
}
footer nav .text-button {
  color: #4C00EE;
}

@media only screen and (min-width: 992px) {
  footer {
    padding: 40rem 24rem;
    flex-direction: row;
  }
  footer nav ul {
    flex-direction: row;
    column-gap: 80rem;
  }
  footer nav ul li .text-button {
    height: 24rem;
  }
}
.course-module {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 40rem 16rem;
  gap: 20rem;
  background-color: white;
  box-shadow: 0 16rem 38rem -2rem rgba(32, 56, 115, 0.15);
  position: relative;
  border: 10rem solid transparent outset;
}
.course-module:hover {
  box-shadow: 0rem 0rem 0rem 10rem #BFD0FD;
}
.course-module .course-module__body {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  gap: 20rem;
}
.course-module .course-module__body h3 {
  flex-grow: 1;
}
.course-module .course-module__body h3 a {
  color: black;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  text-decoration: none;
}
.course-module .course-module__body .progress-bar__label {
  margin-top: 20rem;
}
.course-module .course-module__body .progress-bar {
  margin-top: -8rem;
  margin-bottom: 20rem;
}
.course-module .course-module__actions {
  width: 100%;
  display: flex;
  justify-content: stretch;
  align-content: stretch;
}
.course-module .course-module__actions .text-button {
  position: static;
}
.course-module .course-module__actions .text-button::after {
  display: block;
  content: "";
  position: absolute;
  z-index: 99;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

@media only screen and (min-width: 992px) {
  .course-module {
    padding: 60rem 40rem;
    min-height: 381rem;
  }
}
.download-button {
  display: grid;
  width: 100%;
  column-gap: 20rem;
  row-gap: 0;
  align-items: center;
  padding: 20rem;
  border: 1rem solid #BFD0FD;
  border-radius: 8rem;
  grid-template: "icon filename filesize" "icon button filesize";
  grid-template-columns: 40rem auto max-content;
  grid-template-rows: auto auto;
  position: relative;
}
.download-button svg {
  width: 40rem;
  height: 40rem;
  margin-right: -12rem;
  flex-basis: 48rem;
  grid-area: icon;
}
.download-button .text-button {
  position: static;
  grid-area: button;
}
.download-button .text-button::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  display: block;
  z-index: 99;
  width: 100%;
}
.download-button .download-button__filename {
  grid-area: filename;
  flex: 1 1 auto;
}
.download-button .download-button__filesize {
  grid-area: filesize;
}
.download-button * {
  font-size: 16rem;
  line-height: 24rem;
  font-weight: 400;
}

@media only screen and (min-width: 768px) {
  .download-button {
    grid-template: "icon filename filesize button";
    grid-template-columns: 48rem auto max-content max-content;
  }
  .download-button svg {
    width: 48rem;
    height: 48rem;
  }
}
.button {
  display: inline-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 12rem 24rem;
  margin: 0;
  max-height: 48rem;
  border: none;
  cursor: pointer;
  border-radius: 6rem;
  font-weight: 600;
  font-size: 16rem;
  font-feature-settings: "pnum" on, "lnum" on;
  line-height: 24rem;
  text-decoration: none;
  transition: all 0.3s;
}
.button.style--primary {
  color: white;
  background-color: #4C00EE;
}
.button.style--primary:hover {
  background-color: #4000C7;
}
.button.style--primary.state--disabled {
  background-color: #aaa;
}
.button.style--primary.state--destructive {
  background-color: #DE1C22;
}
.button.style--secondary {
  color: #4C00EE;
  border: #4C00EE solid 1rem;
  background-color: transparent;
}
.button.style--secondary:hover.state--normal {
  background-color: #EEF3FF;
}
.button.style--secondary.state--disabled {
  color: #aaa;
  border-color: #aaa;
}
.button.style--secondary.state--destructive {
  color: #DE1C22;
  border-color: #DE1C22;
}
.button.style--primary-contrast {
  background-color: white;
  color: #4C00EE;
}
.button.style--secondary-contrast {
  color: white;
  border: white solid 1rem;
  background-color: transparent;
}
.button.style--secondary-contrast:hover {
  background: rgba(255, 255, 255, 0.25);
}
.button.style--tertiary {
  color: #556080;
  background-color: transparent;
}
.button.style--tertiary:hover {
  color: #202532;
  background-color: #D7E1FE;
}
.button.style--tertiary.state--active {
  color: white;
  background-color: #4C00EE;
}
.button.state--disabled {
  cursor: not-allowed;
}
.button.with-icon.with-icon--right {
  padding: 12rem 20rem 12rem 24rem;
}
.button.with-icon.with-icon--right svg {
  margin-left: 12rem;
}
.button.with-icon.with-icon--left {
  padding: 12rem 24rem 12rem 20rem;
}
.button.with-icon.with-icon--left svg {
  order: -1;
  margin-right: 12rem;
}

.course-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 40rem 16rem;
  gap: 20rem;
  background-color: white;
  box-shadow: 0 16rem 38rem -2rem rgba(32, 56, 115, 0.15);
  position: relative;
}
.course-item .course-item__body {
  display: flex;
  flex-direction: column;
  gap: 20rem;
}
.course-item .course-item__body h2 {
  font-size: 22rem;
  line-height: 32rem;
}
.course-item .course-item__body h2 a {
  color: black;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  text-decoration: none;
}
.course-item .course-item__body .course-item__avatars {
  display: flex;
  gap: 8rem;
}
.course-item .course-item__body .course-item__avatars picture * {
  width: 56rem;
  height: 56rem;
  border-radius: 50%;
}
.course-item .course-item__body .progress-bar__label {
  margin-top: 20rem;
}
.course-item .course-item__body .progress-bar {
  margin-top: -8rem;
  margin-bottom: 20rem;
}
.course-item .course-item__body .tag-list.tag-list--secondary {
  column-gap: 16rem;
}
.course-item .course-item__body .tag-list .tag {
  font-size: 16rem;
  line-height: 24rem;
}
.course-item .course-item__actions {
  width: 100%;
  display: flex;
  justify-content: stretch;
  align-content: stretch;
}
.course-item .course-item__actions .button {
  flex: 1 0 auto;
}
.course-item .course-item__actions .button::after {
  display: block;
  content: "";
  position: absolute;
  z-index: 99;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.course-item.state--expired h2 a,
.course-item.state--expired p,
.course-item.state--expired .tag,
.course-item.state--expired .tag-delimeter::after {
  color: #838791 !important;
}
.course-item.state--expired .progress-bar {
  background-color: #D9DADD;
}
.course-item.state--expired .progress-bar::before {
  background-color: #838791;
}
.course-item.state--expired .course-item__avatars img {
  filter: grayscale(1);
}
.course-item.state--expired time, .course-item.state--expired .term {
  color: #DE1C22;
}

@media only screen and (min-width: 992px) {
  .course-item {
    padding: 60rem 40rem;
  }
  .course-item .course-item__body {
    flex-grow: 1;
  }
  .course-item .course-item__body .tag-list .tag {
    font-size: 20rem;
    line-height: 32rem;
  }
  .course-item .course-item__body h2 {
    flex-grow: 1;
    font-size: 28rem;
    line-height: 40rem;
  }
}
.form-control--checkbox {
  display: grid;
  grid-template-columns: 32rem auto !important;
  align-items: baseline;
  gap: 16rem;
  line-height: 32rem;
  cursor: pointer;
  transition: 120ms all ease-in-out;
}
.form-control--checkbox input[type=checkbox] {
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
  font: inherit;
  color: currentColor;
  width: 32rem;
  height: 32rem;
  justify-items: center;
  border: 2rem solid #BEC0C5;
  border-radius: 6rem;
  display: grid;
  place-content: center;
  padding-bottom: 2rem;
}
.form-control--checkbox input[type=checkbox]::before {
  content: url('data:image/svg+xml,<svg width="14" height="10" viewBox="0 0 14 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.4882 0.488155L5 5.97631L2.84518 3.82149C2.1943 3.17061 1.13903 3.17061 0.488155 3.82149C-0.162718 4.47236 -0.162718 5.52764 0.488155 6.17851L3.82149 9.51184C4.47236 10.1627 5.52764 10.1627 6.17851 9.51184L12.8452 2.84518C13.4961 2.1943 13.4961 1.13903 12.8452 0.488155C12.1943 -0.162718 11.139 -0.162718 10.4882 0.488155Z" fill="white"/></svg>');
  transform: scale(0);
  transition: 120ms transform ease-in-out;
  margin-top: 2rem;
}
.form-control--checkbox input[type=checkbox]:checked {
  background-color: #4C00EE;
  border: 2rem solid #4C00EE;
}
.form-control--checkbox input[type=checkbox]:checked::before {
  transform: scale(1);
}
.form-control--checkbox input[type=checkbox]:focus {
  outline: max(2rem, 0.15em) solid currentColor;
  outline-offset: max(2rem, 0.15em);
}
.form-control--checkbox:focus-within {
  color: var(--form-control-color);
}
.form-control--checkbox a {
  text-underline-offset: 3rem;
  color: #4C00EE;
  font-size: inherit;
  line-height: inherit;
}
@media only screen and (min-width: 576px) {
  .form-control--checkbox .form-control--checkbox:hover input[type=checkbox] {
    border: 2rem solid #4C00EE;
  }
}

.box {
  padding: 24rem;
  /* display: flex;
   flex-direction: column;*/
}
.box * {
  margin: 0;
}
.box svg {
  width: 48rem;
  height: 48rem;
  margin-bottom: 20rem;
}
.box ul > li strong {
  font-weight: 600;
}
.box.type--highlight {
  background-color: #FBD3D0;
}
.box.type--legal {
  background-color: #DDD1FA;
}
.box.type--interest {
  background-color: #FBEAD0;
}
.box.type--example {
  background-color: #D1FAF0;
}
.box.type--bonus {
  background-color: transparent;
  box-shadow: 0 0 1rem 0 #BEC0C5;
}
.box p + p, .box p + ul, .box p + ol, .box p + address, .box p + table, .box p + nav,
.box ul + p,
.box ul + ul,
.box ul + ol,
.box ul + address,
.box ul + table,
.box ul + nav,
.box ol + p,
.box ol + ul,
.box ol + ol,
.box ol + address,
.box ol + table,
.box ol + nav,
.box address + p,
.box address + ul,
.box address + ol,
.box address + address,
.box address + table,
.box address + nav,
.box table + p,
.box table + ul,
.box table + ol,
.box table + address,
.box table + table,
.box table + nav,
.box nav + p,
.box nav + ul,
.box nav + ol,
.box nav + address,
.box nav + table,
.box nav + nav {
  margin-top: 12rem;
}
@media only screen and (min-width: 1200px) {
  .box p + p, .box p + ul, .box p + ol, .box p + address, .box p + table, .box p + nav,
  .box ul + p,
  .box ul + ul,
  .box ul + ol,
  .box ul + address,
  .box ul + table,
  .box ul + nav,
  .box ol + p,
  .box ol + ul,
  .box ol + ol,
  .box ol + address,
  .box ol + table,
  .box ol + nav,
  .box address + p,
  .box address + ul,
  .box address + ol,
  .box address + address,
  .box address + table,
  .box address + nav,
  .box table + p,
  .box table + ul,
  .box table + ol,
  .box table + address,
  .box table + table,
  .box table + nav,
  .box nav + p,
  .box nav + ul,
  .box nav + ol,
  .box nav + address,
  .box nav + table,
  .box nav + nav {
    margin-top: 20rem;
  }
}
.box p + h2, .box p + .h2,
.box ul + h2,
.box ul + .h2,
.box ol + h2,
.box ol + .h2,
.box address + h2,
.box address + .h2,
.box table + h2,
.box table + .h2,
.box nav + h2,
.box nav + .h2 {
  margin-top: 40rem;
}
.box p + h3, .box p + .h3,
.box ul + h3,
.box ul + .h3,
.box ol + h3,
.box ol + .h3,
.box address + h3,
.box address + .h3,
.box table + h3,
.box table + .h3,
.box nav + h3,
.box nav + .h3 {
  margin-top: 40rem;
}

@media only screen and (min-width: 768px) {
  .box {
    padding: 40rem;
  }
}
.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  column-gap: 24rem;
  row-gap: 12rem;
}
.breadcrumb li {
  height: 24rem;
  display: flex;
  position: relative;
  column-gap: 24rem;
}
.breadcrumb li:not(:last-child):after {
  content: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M7.99975 21C8.25575 21 8.51175 20.902 8.70675 20.707L16.7068 12.707C17.0978 12.316 17.0978 11.684 16.7068 11.293L8.70675 3.29301C8.31575 2.90201 7.68375 2.90201 7.29275 3.29301C6.90175 3.68401 6.90175 4.31601 7.29275 4.70701L14.5858 12L7.29275 19.293C6.90175 19.684 6.90175 20.316 7.29275 20.707C7.48775 20.902 7.74375 21 7.99975 21" fill="%23556080"/></svg>');
}
.breadcrumb li .text-button svg {
  stroke: none;
}

.text-button.style--basis-chapter {
  display: flex;
  justify-content: space-between;
  width: 312rem;
  padding: 10rem 8rem;
  padding-left: var(--padding-left);
  align-items: center;
  gap: 8rem;
  width: 100%;
  text-decoration: none;
  color: var(--color);
  --color: #202532;
  --padding-left: 8rem;
}
.text-button.style--basis-chapter svg {
  width: 16rem;
  height: 16rem;
}
.text-button.style--basis-chapter span {
  white-space: break-spaces;
}
.text-button.style--basis-chapter span::after {
  display: none !important;
}
.text-button.style--basis-chapter + ul {
  display: none;
}
.text-button.style--basis-chapter:hover, .text-button.style--basis-chapter.is-opened {
  --color: #4000C7;
}
.text-button.style--basis-chapter.is-opened svg {
  transform: rotate(90deg);
}
.text-button.style--basis-chapter.is-opened + ul {
  display: flex;
}

.text-button.style--basis-lesson {
  display: flex;
  justify-content: space-between;
  width: 312rem;
  padding: 10rem 8rem;
  padding-left: var(--padding-left);
  align-items: center;
  gap: 8rem;
  width: 100%;
  text-decoration: none;
  --color: #202532;
  --padding-left: 8rem;
}
.text-button.style--basis-lesson svg {
  width: 16rem;
  height: 16rem;
}
.text-button.style--basis-lesson * {
  color: var(--color);
}
.text-button.style--basis-lesson span {
  white-space: break-spaces;
}
.text-button.style--basis-lesson span::after {
  display: none !important;
}
.text-button.style--basis-lesson:hover, .text-button.style--basis-lesson.is-active {
  --color: #4000C7;
}

.text-button.style--basis-module {
  display: flex;
  justify-content: space-between;
  width: 312rem;
  padding: 10rem 8rem;
  align-items: center;
  gap: 8rem;
  width: 100%;
  text-decoration: none;
  color: var(--color);
  --color: #202532;
  --padding-left: u(8);
}
.text-button.style--basis-module svg {
  width: 16rem;
  height: 16rem;
}
.text-button.style--basis-module span {
  white-space: break-spaces;
}
.text-button.style--basis-module span::after {
  display: none !important;
}
.text-button.style--basis-module + ul {
  display: none;
}
.text-button.style--basis-module:hover, .text-button.style--basis-module.is-opened {
  --color: #4000C7;
  border-radius: 6px;
  background: #D7E1FE;
}
.text-button.style--basis-module.is-opened svg {
  transform: rotate(90deg);
}
.text-button.style--basis-module.is-opened + ul {
  display: flex;
}

.basis {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-top: 24rem;
  padding-left: 24rem;
  gap: 40rem;
  isolation: isolate;
}
.basis nav {
  width: 100%;
}
.basis nav ul {
  display: flex;
  flex-direction: column;
  row-gap: 4rem;
}
.basis nav ul > li > ul,
.basis nav ul > li > ul > li > ul {
  margin-block: 4rem;
}
.basis nav ul > li .text-button {
  --padding-left: 8rem;
}
.basis nav ul > li > ul > li .text-button {
  --padding-left: 16rem;
  --color: #556080;
}
.basis nav ul > li > ul > li > ul > li .text-button {
  --padding-left: 24rem;
}
.basis .progress-bar {
  margin-top: -28rem;
}
.basis .basis__progress-label {
  font-size: 16rem;
  line-height: 24rem;
}

.content-block {
  width: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-areas: "image" "content";
  grid-template-columns: 100%;
  grid-template-rows: auto;
  row-gap: 20rem;
  align-items: center;
  background-color: transparent;
  align-items: start;
}
.content-block .content-block__content,
.content-block .content-block__image {
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 !important;
}
.content-block .content-block__content {
  grid-area: content;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 8rem;
}
.content-block .content-block__content .link {
  width: auto;
}
.content-block .content-block__content p + p {
  margin-top: 20rem;
}
.content-block nav {
  margin-top: 20rem;
}

@media only screen and (min-width: 992px) {
  .content-block {
    column-gap: 40rem;
  }
  .content-block.content-block--right {
    grid-template-columns: auto 50%;
    grid-template-areas: "content image";
  }
  .content-block.content-block--left {
    grid-template-columns: 50% auto;
    grid-template-areas: "image content";
  }
  .content-block.has-content-aligned-to-top {
    align-items: start;
  }
  .content-block.has-content-aligned-to-center {
    align-items: center;
  }
  .content-block.has-content-aligned-to-bottom {
    align-items: end;
  }
}
@media only screen and (min-width: 1200px) {
  .content-block {
    max-width: 1556rem;
  }
}
.gallery.gallery--basic {
  display: flex;
  flex-direction: column;
}
.gallery.gallery--basic .gallery__images {
  gap: 8rem;
  display: flex;
  overflow: hidden;
  flex-wrap: wrap;
}
.gallery.gallery--basic .gallery__images::after {
  content: "";
  flex-grow: 999999999;
  min-width: 300px;
  height: 0;
}
.gallery.gallery--basic .gallery__images > article {
  position: relative;
  display: block;
  height: 300px;
  flex-grow: 1;
}
.gallery.gallery--basic .gallery__images > article picture,
.gallery.gallery--basic .gallery__images > article picture > img {
  height: 300px;
  object-fit: cover;
  max-width: 100%;
  min-width: 100%;
  vertical-align: bottom;
}
@media (max-width: 980px) {
  .gallery.gallery--basic .gallery__images {
    display: flex;
    overflow: hidden;
    flex-wrap: wrap;
  }
  .gallery.gallery--basic .gallery__images::after {
    content: "";
    flex-grow: 999999999;
    min-width: 150px;
    height: 0;
  }
  .gallery.gallery--basic .gallery__images > article {
    position: relative;
    display: block;
    height: 150px;
    flex-grow: 1;
  }
  .gallery.gallery--basic .gallery__images > article picture,
  .gallery.gallery--basic .gallery__images > article picture > img {
    height: 150px;
    object-fit: cover;
    max-width: 100%;
    min-width: 100%;
    vertical-align: bottom;
  }
}
@media (max-width: 400px) {
  .gallery.gallery--basic .gallery__images {
    display: flex;
    overflow: hidden;
    flex-wrap: wrap;
  }
  .gallery.gallery--basic .gallery__images::after {
    content: "";
    flex-grow: 999999999;
    min-width: 100px;
    height: 0;
  }
  .gallery.gallery--basic .gallery__images > article {
    position: relative;
    display: block;
    height: 100px;
    flex-grow: 1;
  }
  .gallery.gallery--basic .gallery__images > article picture,
  .gallery.gallery--basic .gallery__images > article picture > img {
    height: 100px;
    object-fit: cover;
    max-width: 100%;
    min-width: 100%;
    vertical-align: bottom;
  }
}
.gallery.gallery--grid {
  display: flex;
  flex-direction: column;
}

@media only screen and (min-width: 992px) {
  .gallery {
    gap: 20rem;
  }
  .gallery .gallery__images {
    gap: 12rem;
  }
  .gallery.gallery--column-gap--small .gallery__images {
    column-gap: 12rem;
  }
  .gallery.gallery--row-gap--small .gallery__images {
    row-gap: 12rem;
  }
  .gallery.gallery--column-gap--middle .gallery__images {
    column-gap: 40rem;
  }
  .gallery.gallery--row-gap--middle .gallery__images {
    row-gap: 40rem;
  }
  .gallery.gallery--column-gap--large .gallery__images {
    column-gap: 80rem;
  }
  .gallery.gallery--row-gap--large .gallery__images {
    row-gap: 80rem;
  }
  .gallery.gallery--grid .gallery__images {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media only screen and (min-width: 1200px) {
  .gallery.gallery--grid .gallery__images {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
div.video_container, div.video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30rem;
  height: 0;
  overflow: hidden;
}

div.video_container iframe, div.video_container object, div.video_container embed, div.video-container iframe, div.video-container object, div.video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-height: 95vh;
}

audio {
  width: 100%;
}

.quote {
  display: grid;
  grid-template-rows: max-content max-content;
}
.quote blockquote {
  display: inline-flex;
}
.quote blockquote > p {
  font-size: 22rem;
  line-height: 32rem;
  font-weight: 700;
}
.quote blockquote p:last-child {
  margin-bottom: 0;
}
.quote figcaption {
  margin-top: 8rem;
}
.quote figcaption::before {
  content: "— ";
}
.quote cite::before {
  content: ", ";
}

@media only screen and (min-width: 1200px) {
  .quote {
    padding: 40rem 80rem;
  }
  .quote blockquote > p {
    font-size: 40rem;
    line-height: 56rem;
  }
}
body.is-cookies-settings-open {
  background-image: none !important;
  background: #FFF;
}
body.is-cookies-settings-open header, body.is-cookies-settings-open main, body.is-cookies-settings-open footer, body.is-cookies-settings-open aside, body.is-cookies-settings-open .page-content-container, body.is-cookies-settings-open .body-bg-image, body.is-cookies-settings-open .page-container, body.is-cookies-settings-open .background-image {
  display: none;
}

.cookie-settings {
  display: none;
}
.cookie-settings p,
.cookie-settings div,
.cookie-settings a,
.cookie-settings span {
  font-size: 17rem;
  line-height: 28rem;
}
.is-cookies-settings-open .cookie-settings {
  display: flex;
  min-height: 100vh;
  margin: 0 auto;
}

.cookie-banner-wrap {
  display: none;
}
.cookie-banner-wrap.cookie-banner-wrap--active {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1001;
  display: block;
}

.cookie-banner {
  display: flex;
  position: relative;
  background-color: #FFFFFF;
}
.cookie-banner svg {
  fill: none;
}
.cookie-banner p,
.cookie-banner div,
.cookie-banner a,
.cookie-banner span {
  font-size: 17rem;
  line-height: 28rem;
}
.cookie-banner .text-content {
  max-width: 100%;
  flex: 1;
}
.cookie-banner nav.with-gap {
  gap: 12rem;
}
@media only screen and (max-width: 575px) {
  .cookie-banner {
    flex-direction: column;
    gap: 16rem;
    margin: 32rem 16rem;
    box-shadow: 0rem 4rem 6rem -2rem rgba(16, 24, 40, 0.03), 0rem 12rem 16rem -4rem rgba(16, 24, 40, 0.08);
    border-radius: 12rem;
    border: 1rem solid #F1F2F4;
    padding: 16rem;
  }
  .cookie-banner .text-content > .is-body-md,
  .cookie-banner .text-content > p {
    margin: 0;
    margin-bottom: 6rem;
  }
  .cookie-banner nav.with-gap {
    margin-top: 8rem;
    flex-direction: column;
  }
  .cookie-banner nav.with-gap > [class*=box-button].is-small {
    width: 100%;
    justify-content: center;
  }
  .cookie-banner .icon-button {
    position: absolute;
    right: 16rem;
    top: 16rem;
  }
}
@media only screen and (min-width: 576px) {
  .cookie-banner {
    flex-direction: column;
    gap: 16rem;
    margin: 32rem 16rem;
    box-shadow: 0rem 4rem 6rem -2rem rgba(16, 24, 40, 0.03), 0rem 12rem 16rem -4rem rgba(16, 24, 40, 0.08);
    border-radius: 12rem;
    border: 1rem solid #F1F2F4;
    padding: 16rem;
  }
  .cookie-banner .text-content > .is-body-md,
  .cookie-banner .text-content > p {
    margin: 0;
    margin-bottom: 6rem;
  }
  .cookie-banner nav.with-gap {
    margin-top: 8rem;
    flex-direction: row;
  }
  .cookie-banner nav.with-gap > [class*=box-button].is-small {
    width: auto;
    justify-content: center;
  }
  .cookie-banner .icon-button {
    position: absolute;
    right: 16rem;
    top: 16rem;
  }
}
@media only screen and (min-width: 992px) {
  .cookie-banner {
    flex-direction: row;
    align-items: center;
  }
  .cookie-banner nav.with-gap {
    margin-top: 0;
  }
  .cookie-banner .icon-button {
    position: initial;
  }
}
@media only screen and (min-width: 1366px) {
  .cookie-banner {
    margin-inline: auto;
    max-width: 1280rem;
  }
}
.button-set {
  display: flex;
}

p.is-bold {
  font-weight: bold;
}
p.is-body-lg {
  font-size: 18rem;
  line-height: 28rem;
}
p.is-body-md {
  font-size: 17rem;
  line-height: 28rem;
}
p.is-body-sm {
  font-size: 14rem;
  line-height: 20rem;
}

.cookie-settings {
  width: 100%;
  min-height: 100%;
  background-color: #FFFFFF;
}
.cookie-settings p {
  margin-top: 0;
  margin-bottom: 0;
}
.cookie-settings > .wrapper {
  display: flex;
  flex-direction: column;
  row-gap: 32rem;
  padding: 32rem 16rem 48rem 16rem;
  max-width: 800rem;
  margin-inline: auto;
}
.cookie-settings nav.with-gap {
  gap: 12rem;
}
.cookie-settings hr.is-large {
  margin-block: 0rem;
  border: 0;
  border-bottom-width: 1rem;
  border-bottom-style: solid;
  border-bottom-color: #DCDFE4;
  outline: none;
}
.cookie-settings .cookie-type {
  display: flex;
  padding: 12rem;
  flex-direction: column;
  align-items: flex-start;
  gap: 16rem;
  align-self: stretch;
  border-radius: 12rem;
}
.cookie-settings .cookie-type[aria-required=true] {
  background: #F7F8F9;
}
.cookie-settings .cookie-type > div {
  display: flex;
  flex-direction: column;
  row-gap: 4rem;
}
.cookie-settings .cookie-type > div > p:first-child {
  color: #626F86;
}
.cookie-settings .accordion-item {
  background-color: transparent;
  border: 0;
  border-bottom: 1rem solid #F1F2F4;
  padding: 0;
  /*        .accordion-item__heading:after {
      right: auto;
      top: 30%;
      margin-left: u(12);
  }*/
}
.cookie-settings .accordion-item .accordion-item__heading {
  font-size: 16rem;
  line-height: 24rem;
  padding: 0;
  padding-bottom: 16rem;
  grid-template-columns: max-content max-content;
  align-items: center;
  column-gap: 8rem;
  background: transparent;
}
.cookie-settings .accordion-item .accordion-item__heading svg {
  position: static;
}
.cookie-settings .accordion-item .accordion-item__body, .cookie-settings .accordion-item .accordion-item__desc {
  max-width: 100%;
  display: none;
  flex-direction: column;
  gap: 12rem;
  padding-bottom: 20rem;
  padding-left: 0;
  padding-right: 0;
  background: transparent;
}
.cookie-settings .accordion-item .accordion-item__body .accordion-cookies-list, .cookie-settings .accordion-item .accordion-item__desc .accordion-cookies-list {
  display: flex;
  gap: 12rem;
  flex-direction: column;
}
.cookie-settings .accordion-item .accordion-item__body dl, .cookie-settings .accordion-item .accordion-item__desc dl {
  background-color: #F7F8F9;
  padding: 12rem;
  border-radius: 12rem;
  margin: 0;
  display: flex;
  flex-direction: column;
  row-gap: 4rem;
}
.cookie-settings .accordion-item .accordion-item__body dl > *,
.cookie-settings .accordion-item .accordion-item__body dl > * p, .cookie-settings .accordion-item .accordion-item__desc dl > *,
.cookie-settings .accordion-item .accordion-item__desc dl > * p {
  margin: 0;
  font-size: inherit;
  line-height: inherit;
}
.cookie-settings .accordion-item .accordion-item__body dl dt, .cookie-settings .accordion-item .accordion-item__desc dl dt {
  font-weight: 600;
}
.cookie-settings .accordion-item .accordion-item__body dl dd, .cookie-settings .accordion-item .accordion-item__desc dl dd {
  display: flex;
  flex-direction: column;
  row-gap: 4rem;
}
.cookie-settings .accordion-item[aria-expanded=true] .accordion-item__body, .cookie-settings .accordion-item[aria-expanded=true] .accordion-item__desc, .cookie-settings .accordion-item.is-expanded .accordion-item__body, .cookie-settings .accordion-item.is-expanded .accordion-item__desc, .cookie-settings .accordion-item.is-open .accordion-item__body, .cookie-settings .accordion-item.is-open .accordion-item__desc, .cookie-settings .accordion-item.accordion-item--expanded .accordion-item__body, .cookie-settings .accordion-item.accordion-item--expanded .accordion-item__desc {
  display: flex !important;
}
.cookie-settings.cookies-info-button .accordion-item {
  border-bottom: none;
}
@media only screen and (max-width: 575px) {
  .cookie-settings nav:last-child {
    flex-direction: column;
  }
  .cookie-settings nav:last-child > * {
    width: 100%;
    justify-content: center;
  }
  .cookie-settings nav:last-child > *.box-button.is-tertiary {
    order: 5;
  }
}
@media only screen and (min-width: 576px) {
  .cookie-settings nav:last-child {
    flex-direction: column;
  }
  .cookie-settings nav:last-child > * {
    width: 100%;
    justify-content: center;
  }
  .cookie-settings nav:last-child > *.box-button.is-tertiary {
    order: 5;
  }
}
@media only screen and (min-width: 768px) {
  .cookie-settings > .wrapper > .cookie-type {
    width: 100%;
    display: grid;
    grid-template-columns: max-content auto;
    grid-template-areas: "switch info" "switch accordion";
    column-gap: 24rem;
    row-gap: 32rem;
    max-width: 800rem;
    margin-inline: auto;
  }
  .cookie-settings > .wrapper > .cookie-type[aria-required=true] {
    grid-template-areas: "switch info";
  }
  .cookie-settings > .wrapper > .cookie-type label {
    grid-area: switch;
  }
  .cookie-settings > .wrapper > .cookie-type .info {
    grid-area: info;
  }
  .cookie-settings > .wrapper > .cookie-type .accordion {
    grid-area: accordion;
  }
  .cookie-settings nav:last-child {
    flex-direction: row;
    justify-content: flex-end;
  }
  .cookie-settings nav:last-child > * {
    width: auto;
  }
  .cookie-settings nav:last-child > *.box-button.is-tertiary {
    order: initial;
    margin-left: auto;
  }
}

.form-control--switch {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 10rem;
}
.form-control--switch [type=checkbox],
.form-control--switch [type=radio] {
  position: absolute;
  left: -9999rem;
}
.form-control--switch .ch-bg {
  background: rgba(0, 0, 0, 0.15);
  border-radius: 30rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 44rem;
  height: 24rem;
  padding: 0 2rem;
  min-height: 0;
  transition-duration: 0.2s;
}
.form-control--switch .ch-btn {
  background: white;
  border-radius: 20px;
  width: 20px;
  height: 20px;
}
.form-control--switch .checkbox:checked + .ch-bg {
  justify-content: flex-end;
  background: #4C00EE;
}

.filler-answer-popup {
  position: absolute;
  background: rgba(0, 0, 0, 0.5);
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.filler-answer-popup .filler-answer-popup--inner {
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
}
.filler-answer-popup .filler-answer-popup--form {
  width: 500rem;
  background: #FFF;
  padding: 40rem;
}

.open-video-lightbox, .video-button {
  display: flex;
  align-items: center;
  /*text-decoration: none;*/
  /*    svg{
          width: u(44);
          height: u(44);
          margin-right: u(15);
      }*/
  /* &.open-video-lightbox-img{
       position: relative;
       &:after{
           display: block;
           content: "";
           position: absolute;
           left: 0;
           top: 0;
           right: 0;
           bottom: 0;
     //      background: rgba(0, 0, 0, 0.5);
           transition-duration: 0.2s;
        //   .page-homepage &, .page-concert-detail &, .page-serial-succession-detail &{
               background: transparent;
        //   }

       }
       svg{
           width: u(80);
           height: u(80);
           position: absolute;
           left: 0;
           right: 0;
           top: 0;
           bottom: 0;
           margin: auto;
           z-index: 1;
       } 
       &:hover{
           &:after{
             //  background: rgba(0, 0, 0, 0.4);
             //  .page-homepage &, .page-concert-detail &, .page-serial-succession-detail &{
                   background: rgba(255,255,255, 0.1);
             //  }
           }
       }
   }*/
}

.lightbox-is-open--image .arrow-left-wrap, .lightbox-is-open--image .arrow-right-wrap {
  display: none !important;
}

.black-lightbox-loading {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  min-height: 100vh;
  z-index: 2000;
}

.lightbox-is-open {
  padding-bottom: 0;
  border: 0 !important;
}
.lightbox-is-open .content-container, .lightbox-is-open header, .lightbox-is-open footer, .lightbox-is-open .share-affix-box, .lightbox-is-open .newsletter-block-wrap {
  display: none !important;
}

.black-lightbox {
  display: none;
  background: #141414;
  color: #FFF;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  /*  left: u(-8);
    right: u(-8);
    top: u(-8);*/
  min-height: 100vh;
  z-index: 1000;
  color: #FFF;
  /* @include screen-xs {
       left: u(-10);
       right: u(-10);
       top: u(-10);
   }
   // >= 768px
   @include screen-sm {
       left: u(-12);
       right: u(-12);
       top: u(-12);
   }
   // >= 1200px
   @include screen-lg {
       left: u(-16);
       right: u(-16);
       top: u(-16);
   }
   // >= 1400px
   @include screen-xl {
       left: u(-20);
       right: u(-20);
       top: u(-20);
   }

   @include screen-xxl {
       left: u(-24);
       right: u(-24);
       top: u(-24);
   }*/
}
.black-lightbox a {
  color: #FFF;
}
.black-lightbox .owl-dots {
  display: none;
}

.owl-carousel .owl-item img {
  width: auto !important;
}

.black-lightbox-inner {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  min-height: 100vh;
}
.black-lightbox-inner.with-video .lightbox-prev-image, .black-lightbox-inner.with-video .lightbox-next-image {
  display: none !important;
}
.black-lightbox-inner.with-video .content {
  width: 100%;
}
.black-lightbox-inner .circle-icon {
  border: 1px #3b3b3b solid;
  display: inline-block;
  border-radius: 35rem;
  width: 35rem;
  height: 35rem;
  text-align: center;
  transition-duration: 0.25s;
  transition-timing-function: linear;
  transform-origin: 50% 50%;
  transition-property: all;
}
.black-lightbox-inner .light-icon {
  display: inline-block;
  transition-duration: 0.25s;
  transition-timing-function: linear;
}
.black-lightbox-inner .top {
  padding: 30rem;
  padding-top: 25rem;
  height: 80rem;
  text-align: right;
}
.black-lightbox-inner .top .lightbox-close {
  width: 19rem;
  height: 19rem;
}
.black-lightbox-inner .top .lightbox-close .light-icon {
  margin-top: 11rem;
  background-image: url("/images/icons/icon-close-white.svg");
  background-repeat: no-repeat;
  background-size: cover;
  width: 19rem;
  height: 19rem;
}
.black-lightbox-inner .top .lightbox-close:hover .light-icon {
  transform: scale(1.25);
}
.black-lightbox-inner .bottom {
  height: 80rem;
}
.black-lightbox-inner .content {
  position: relative;
}
.black-lightbox-inner .content .arrow-left-wrap, .black-lightbox-inner .content .arrow-right-wrap {
  text-align: center;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 95rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.black-lightbox-inner .content .arrow-right-wrap {
  right: 0;
}
.black-lightbox-inner .content .lightbox-prev-image, .black-lightbox-inner .content .lightbox-next-image {
  font-size: 8rem;
  width: 50rem;
  height: 50rem;
  border-radius: 50rem;
  transition-duration: 0.25s;
}
.black-lightbox-inner .content .lightbox-prev-image .light-icon, .black-lightbox-inner .content .lightbox-next-image .light-icon {
  margin-top: 19rem;
  transition-duration: 0.25s;
}
.black-lightbox-inner .content .lightbox-prev-image .light-icon, .black-lightbox-inner .content .lightbox-next-image .light-icon {
  margin-top: 19rem;
  background-repeat: no-repeat;
  background-size: contain;
  width: 32rem;
  height: 32rem;
}
.black-lightbox-inner .content .lightbox-prev-image .light-icon-arrow-left, .black-lightbox-inner .content .lightbox-next-image .light-icon-arrow-left {
  background-image: url("/images/icons/ic24-arrow-left.svg");
}
.black-lightbox-inner .content .lightbox-prev-image .light-icon-arrow-right, .black-lightbox-inner .content .lightbox-next-image .light-icon-arrow-right {
  background-image: url("/images/icons/ic24-arrow-right.svg");
}
.black-lightbox-inner .content .lightbox-prev-image:hover .light-icon, .black-lightbox-inner .content .lightbox-next-image:hover .light-icon {
  transform: scale(1.25);
}
.black-lightbox-inner .content .image-and-text {
  width: 100%;
  max-width: calc(100% - 190rem);
  margin: auto;
}
.black-lightbox-inner .content .image-and-text .item {
  display: flex;
  justify-content: center;
}
.black-lightbox-inner .content .image-and-text .image-wrap {
  display: inline-block;
  max-width: calc(100% - 300rem);
  position: relative;
  vertical-align: top;
}
.black-lightbox-inner .content .image-and-text .image-wrap.with-video {
  width: calc(100% - 300rem);
}
.black-lightbox-inner .content .image-and-text .image-wrap img, .black-lightbox-inner .content .image-and-text .image-wrap .image-container {
  max-height: 80vh;
  max-height: calc(100vh - 160rem);
}
.black-lightbox-inner .content .image-and-text .text {
  display: inline-block;
  width: 250rem;
  margin-left: 25rem;
}
.black-lightbox-inner .content .image-and-text .text .title {
  font-weight: bold;
  font-size: 17rem;
  line-height: 30rem;
  margin-bottom: 15rem;
  color: #FFF;
}
.black-lightbox-inner .content .image-and-text .text .author {
  font-size: 16rem;
  color: #FFF;
  margin-bottom: 15rem;
}
.black-lightbox-inner .content .image-and-text .text .description, .black-lightbox-inner .content .image-and-text .text .description p, .black-lightbox-inner .content .image-and-text .text .description p span {
  font-size: 16rem;
  line-height: 25rem;
  color: #FFF;
}
.black-lightbox-inner .counter {
  margin-top: 25rem;
  font-size: 15rem;
  color: #FFF;
  left: 0;
}
.black-lightbox-inner .counter .counter-number, .black-lightbox-inner .counter .counter-total {
  color: #FFF;
}

@media only screen and (min-width: 992px) {
  .black-lightbox-inner.active-scale .content .image-and-text {
    /*      display: flex;
          @include flex-grow(2);
          @include justify-content(center);
          */
  }
  .black-lightbox-inner.active-scale .content .image-and-text .image-wrap {
    flex-grow: 2;
    max-width: 1200rem;
  }
  .black-lightbox-inner.active-scale .content .image-and-text .image-wrap img {
    width: 100%;
    max-width: 1200rem;
    object-fit: contain;
  }
}
@media only screen and (min-width: 1440px) {
  .black-lightbox-inner .top {
    padding: 30rem;
    padding-top: 25rem;
    text-align: right;
  }
  .black-lightbox-inner .top .lightbox-close {
    width: 55rem;
    height: 55rem;
    border-radius: 55rem;
    margin-right: 30rem;
  }
  .black-lightbox-inner .top .lightbox-close .light-icon {
    margin-top: 18rem;
    width: 32rem;
    height: 32rem;
  }
  .black-lightbox-inner .content .arrow-left-wrap, .black-lightbox-inner .content .arrow-right-wrap {
    text-align: center;
    width: 170rem;
  }
  .black-lightbox-inner .content .arrow-left-wrap {
    padding-right: 30rem;
    justify-content: flex-end;
  }
  .black-lightbox-inner .content .arrow-right-wrap {
    padding-left: 30rem;
    justify-content: flex-start;
  }
  .black-lightbox-inner .content .lightbox-prev-image, .black-lightbox-inner .content .lightbox-next-image {
    width: 80rem;
    height: 80rem;
    border-radius: 80rem;
  }
  .black-lightbox-inner .content .lightbox-prev-image .light-icon, .black-lightbox-inner .content .lightbox-next-image .light-icon {
    margin-top: 32rem;
    width: 32rem;
    height: 32rem;
  }
  .black-lightbox-inner .content .image-and-text {
    max-width: calc(100% - 340rem);
  }
  .black-lightbox-inner .content .image-and-text .image-wrap {
    position: relative;
    vertical-align: top;
  }
  .black-lightbox-inner .content .image-and-text .image-wrap img {
    max-height: 90vh;
    max-height: calc(100vh - 230rem);
  }
  .black-lightbox-inner .content .image-and-text .text {
    width: 250rem;
    margin-left: 25rem;
  }
  .black-lightbox-inner .content .image-and-text .text .title {
    font-size: 18rem;
  }
  .black-lightbox-inner .counter {
    left: 0;
  }
}
@media screen and (max-width: 1200px) {
  .black-lightbox-inner .content .arrow-left-wrap, .black-lightbox-inner .content .arrow-right-wrap {
    width: 12%;
  }
  .black-lightbox-inner .content .image-and-text {
    max-width: 75%;
  }
  .black-lightbox-inner .content .image-and-text .item {
    display: block;
  }
  .black-lightbox-inner .content .image-and-text .image-wrap {
    display: block;
    max-width: 100%;
    position: relative;
    vertical-align: top;
    margin-left: auto;
    margin-right: auto;
  }
  .black-lightbox-inner .content .image-and-text .image-wrap img {
    max-height: 90vh;
    max-height: calc(100vh - 100rem);
  }
  .black-lightbox-inner .content .image-and-text .image-wrap.with-video {
    width: 100%;
  }
  .black-lightbox-inner .content .image-and-text .text {
    display: block;
    width: auto;
    margin-left: 0;
    margin-top: 20rem;
  }
  .black-lightbox-inner .counter {
    position: static;
    margin: 20rem;
    margin-right: 0;
    float: right;
  }
}
.grid__layout-container {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--umb-block-grid--grid-columns, 1), minmax(0, 1fr));
  column-gap: 80px;
  row-gap: 0px;
  grid-auto-flow: row;
  grid-auto-rows: minmax(50px, -webkit-min-content);
  grid-auto-rows: minmax(50px, min-content);
}

.grid__layout-item {
  position: relative;
  /* For small devices we scale columnSpan by three, to make everything bigger than 1/3 take full width: */
  grid-column-end: span min(var(--umb-block-grid--item-column-span, 1) * 3, var(--umb-block-grid--grid-columns));
  grid-row: span var(--umb-block-grid--item-row-span, 1);
  margin: 0 !important;
}

.grid__layout-item[data-force-left] {
  grid-column-start: 1;
}

.grid__layout-item[data-force-right] {
  grid-column-start: calc(1 + var(--umb-block-grid--grid-columns) - var(--umb-block-grid--item-column-span));
}

.grid__area-container,
.grid__block--view::part(area-container) {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--umb-block-grid--area-grid-columns, var(--umb-block-grid--grid-columns, 1)), minmax(0, 1fr));
  grid-gap: 0px;
  grid-auto-flow: row;
  grid-auto-rows: minmax(50px, -webkit-min-content);
  grid-auto-rows: minmax(50px, min-content);
  width: 100%;
}

.grid__area {
  position: relative;
  /* For small devices we scale columnSpan by three, to make everything bigger than 1/3 take full width: */
  grid-column-end: span min(var(--umb-block-grid--item-column-span, 1) * 3, var(--umb-block-grid--grid-columns));
  grid-row: span var(--umb-block-grid--area-row-span, 1);
}

@media (min-width: 1024px) {
  .grid__layout-item {
    grid-column-end: span var(--umb-block-grid--item-column-span, 1);
  }
  .grid__area {
    grid-column-end: span var(--umb-block-grid--area-column-span, 1);
  }
}
.vertical-align--top {
  align-self: baseline !important;
}

.vertical-align--center {
  align-self: center !important;
}

.vertical-align--bottom {
  align-self: end !important;
}

.cite-anchor {
  font-family: "Courier New", Courier, monospace;
  line-height: normal;
  color: #666;
  max-width: 750px;
  background: #FFF;
}

.cite-anchor-link {
  position: relative;
  top: -0.5em;
  font-style: normal;
  font-size: 13px !important;
  text-decoration: none;
  border-bottom: 0 !important;
}
.cite-anchor-link:after {
  display: none;
}
.accordion-item__desc ol {
  margin-left: 16rem;
}
.accordion-item__desc ol li {
  padding-left: 20rem;
  margin-bottom: 32rem;
  /*  &::marker {
      color: $color-secondary-100;
  }*/
}

.citations-list {
  list-style: none;
}
.citations-list li {
  margin-bottom: 32rem;
  padding-left: 26rem;
  position: relative;
  font-size: 20rem;
  line-height: 36rem;
  /*
  a {
      //     @include anchor-underlined($text-color, 3px, 2px, $color-gold, 2px);
      //    line-height: 40px;
      border-bottom: 2Px transparent solid;

      &:hover, &.is-active {
          border-bottom: 2px $color-gold solid;
      }
  }
  */
}
.citations-list li:last-child {
  margin-bottom: 0;
}
.citations-list li a.number {
  position: absolute;
  left: 0;
  font-size: 20rem;
  line-height: 36rem;
  color: #FF8C82;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 5rem;
}
.citations-list li a.number .arrow {
  width: 24rem;
  height: 24rem;
}
.citations-list li a.number:after {
  display: none;
}

.accordion-item__heading.accordion-item__heading--citations-list {
  font-size: 28rem;
  line-height: 40rem;
  font-weight: 600;
}

.citations-list-wrap:before {
  content: "";
  height: 1px;
  background: #666666;
  max-width: 751px;
  width: 100%;
  margin-bottom: 40rem;
  display: block;
}

.white-popup {
  position: relative;
  background: #FFF;
  color: black !important;
  padding: 40rem;
  padding-top: 50rem;
  width: auto;
  margin: 2rem auto;
  -webkit-box-shadow: 0 5px 5px 0px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0 5px 5px 0px rgba(0, 0, 0, 0.25);
  box-shadow: 0 5px 5px 0px rgba(0, 0, 0, 0.25);
  border: 0.1rem #d1d1d1 solid;
  display: block;
  max-width: 600rem;
}

.white-popup-map {
  max-width: 1000rem;
}

/*
.white-popup {
    position: relative;
    background: #FFF;
    padding: 40px;
    padding-top: 75px;
    width: auto;

    margin: 20px auto;
}*/
.white-popup {
  position: relative;
  background: #FFF;
  padding: 20px 50px;
  width: auto;
  max-width: 675px;
  margin: 20px auto;
  font-style: italic;
  border-radius: 3px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.1);
  position: relative;
}
.white-popup a {
  text-decoration: underline;
}
.white-popup a:hover {
  text-decoration: none;
}
.white-popup .number {
  color: #FF8C82;
  position: absolute;
  left: 25px;
  top: 20px;
}

.form-control {
  position: relative;
}

.toggle-password {
  position: absolute;
  right: 16rem;
  top: 47rem;
  width: 24rem;
  height: 24rem;
  cursor: pointer;
}

.quiz-hint {
  margin-top: 0 !important;
}
