/*!********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./app/javascript/application/content_structure/content_structure.sass ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
.content-structure .accordion-container {
  margin-bottom: 56px;
}
.content-structure-knowledge-foundation {
  padding-top: 40px;
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-structure-knowledge-foundation .box-content-area {
    margin-right: -16px;
    margin-left: -16px;
  }
}
.is-foreign-lang .content-structure-topics {
  padding-bottom: 32px;
}
.is-foreign-lang .content-structure-topics__headline {
  display: none;
}
.content-page-meta {
  position: absolute;
  top: 13px;
  right: 0;
  padding-right: 10px;
}
.content-page-video-count {
  position: relative;
  display: inline-block;
  margin-right: 10px;
  padding-left: 25px;
  color: #666;
  font-size: 13px;
}
.content-page-video-count::before {
  position: absolute;
  top: -1px;
  left: 0;
  width: 16px;
  height: 16px;
  background-image: url("/assets/application/content_pages/video_count.png");
  content: "";
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-page-video-count {
    display: none;
  }
}
.content-subect-selector,
.content-structure-learning-years-selector {
  min-height: calc(100vh - 60px);
  padding-top: 64px;
  background-image: url("/assets/application/content_pages/lernjahr_selector.png");
  background-repeat: no-repeat;
  background-position: bottom center;
}
.content-subect-selector__text b:first-of-type,
.content-structure-learning-years-selector__text b:first-of-type {
  color: #3370c4;
}
.content-subect-selector__text b:last-of-type,
.content-structure-learning-years-selector__text b:last-of-type {
  color: #9c0;
}
.content-subect-selector .level-cards-list,
.content-structure-learning-years-selector .level-cards-list {
  justify-content: center;
}
.content-subect-selector .level-cards-list .level-cards-list__link,
.content-structure-learning-years-selector .level-cards-list .level-cards-list__link {
  color: #3370c4;
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-subect-selector,
  body.is-responsive .content-structure-learning-years-selector {
    padding-top: 32px;
    background-size: contain;
  }
}
body.is-mobile-app .content-subect-selector,
body.is-mobile-app .content-structure-learning-years-selector {
  min-height: 100vh;
}
.promotional-card {
  display: flex;
  position: relative;
  padding: 16px;
  border-radius: 8px;
  background-color: #fcf8e6;
  overflow: hidden;
}
.promotional-card:hover {
  cursor: pointer;
}
.promotional-card__image-container {
  position: relative;
}
.promotional-card__image {
  width: 100%;
  height: 100%;
}
.promotional-card__content {
  color: #333;
}
.content-structure-breadcrumbs {
  font-family: Helvetica, Arial, sans-serif;
  padding-top: 8px;
  padding-bottom: 8px;
  transition: box-shadow 0.225s ease-in-out;
  border-bottom: 1px solid #e6e8e5;
  background: #fff;
}
.content-structure-breadcrumbs.is-stuck {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  z-index: 5;
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-structure-breadcrumbs {
    display: none;
  }
}
.content-structure-breadcrumbs-item {
  position: relative;
  font-size: 14px;
  line-height: 1.7;
}
.content-structure-breadcrumbs-item a {
  color: #666;
}
.content-structure-breadcrumbs-item a:hover {
  color: #333;
}
.content-structure-breadcrumbs-item:not(:last-child) {
  padding-right: 4px;
}
.content-structure-breadcrumbs-item:not(:last-child)::after {
  padding-left: 4px;
  color: #999;
  content: "→";
}
.content-structure-breadcrumbs-item:last-child {
  display: inline-block;
  padding-right: 4px;
  padding-left: 4px;
  border-radius: 4px;
  background: #9c0;
  color: #333;
  font-weight: bold;
}
.content-structure-class-levels__headline {
  margin-bottom: 24px;
  color: #333;
}
.content-structure-class-levels__headline:not(:first-child) {
  padding-top: 64px;
}
.content-structure-class-levels--filtered {
  padding-bottom: 64px;
}
.content-structure-class-levels--featured .content-structure-class-levels__levels {
  padding: 32px;
  border-radius: 8px;
  background-color: #d6eb99;
}
.content-structure-class-levels--colored {
  background: #d6eb99;
}
.content-structure-class-levels--featured .level-cards-list__item, .content-structure-class-levels--colored .level-cards-list__item {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  border: 0;
}
.content-structure-class-levels--featured .level-cards-list__item.on-touch-hover, .content-structure-class-levels--colored .level-cards-list__item.on-touch-hover {
  background: #9c0;
}
.content-structure-class-levels--featured .level-cards-list__item.on-touch-hover .level-cards-list__link,
.content-structure-class-levels--featured .level-cards-list__item.on-touch-hover .level-cards-list__link span, .content-structure-class-levels--colored .level-cards-list__item.on-touch-hover .level-cards-list__link,
.content-structure-class-levels--colored .level-cards-list__item.on-touch-hover .level-cards-list__link span {
  color: #fff;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-structure-class-levels__headline {
    margin-bottom: 16px;
  }
  body.is-responsive .content-structure-class-levels__headline:not(:first-child) {
    padding-top: 32px;
  }
  body.is-responsive .content-structure-class-levels--filtered {
    padding-bottom: 24px;
  }
  body.is-responsive .content-structure-class-levels--featured .content-structure-class-levels__levels {
    padding: 16px;
  }
}
.content-accordion h3 {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  margin-bottom: 0;
  color: #666;
  font-size: 22px;
}
.content-accordion .accordion {
  padding-bottom: 0;
  border-bottom: 0;
}
.content-accordion .accordion .accordion-item {
  border-top: 0;
}
.content-accordion .accordion .accordion-item.is-active .accordion-title > .icon {
  transform: rotate(270deg);
}
.content-accordion .accordion .accordion-item .accordion-title {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  height: 96px;
  padding: 0 24px 0 32px;
  border: 1px solid #e6e8e5;
  border-radius: 8px;
}
.content-accordion .accordion .accordion-item .accordion-title::before {
  display: none;
}
.content-accordion .accordion .accordion-item .accordion-title .icon {
  transition: transform 0.3s linear 0s;
  color: #ccc;
}
.content-accordion .accordion .accordion-item .accordion-content {
  padding-bottom: 24px;
  padding-left: 16px;
}
.content-accordion .accordion .accordion-item .markdown {
  margin-top: 8px;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-accordion {
    padding-top: 0;
  }
  body.is-responsive .content-accordion .accordion-title h3 {
    width: 218px;
    color: #333;
    font-size: 16px;
    font-weight: 500;
  }
  body.is-responsive .content-accordion .markdown {
    margin-top: 0;
    padding-top: 0;
  }
  body.is-responsive .content-accordion .markdown h2:first-child {
    padding-top: 0;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-accordion {
    margin-bottom: 8px;
  }
  body.is-responsive .content-accordion .accordion-title h3 {
    width: 218px;
    color: #333;
    font-size: 16px;
    font-weight: 500;
  }
  body.is-responsive .content-accordion .markdown {
    margin-top: 0;
    padding-top: 0;
  }
  body.is-responsive .content-accordion .markdown h2:first-child {
    padding-top: 0;
  }
}
.content-structure-areas,
.content-structure-topics {
  padding-top: 64px;
}
@media only screen and (max-width: 959px) {
  .content-structure-areas,
  .content-structure-topics {
    padding-top: 32px;
  }
}
.content-structure-areas,
.content-structure-topics,
.content-structure-class-tests-sheets {
  padding-bottom: 64px;
}
.content-structure-areas__headline,
.content-structure-topics__headline,
.content-structure-class-tests-sheets__headline {
  margin-bottom: 32px;
}
.content-structure-class-levels--filtered + .content-structure-areas,
.content-structure-class-levels--filtered + .content-structure-topics,
.content-structure-class-levels--filtered + .content-structure-class-tests-sheets {
  padding-top: 0;
}
@media only screen and (max-width: 959px) {
  .content-structure-areas,
  .content-structure-topics,
  .content-structure-class-tests-sheets {
    padding-bottom: 32px;
  }
  .content-structure-areas__headline,
  .content-structure-topics__headline,
  .content-structure-class-tests-sheets__headline {
    margin-bottom: 16px;
  }
  .content-structure-class-levels--filtered + .content-structure-areas,
  .content-structure-class-levels--filtered + .content-structure-topics,
  .content-structure-class-levels--filtered + .content-structure-class-tests-sheets {
    padding-top: 0;
  }
}
.content-structure-areas .card-section {
  min-height: 112px;
}
.content-structure-class-tests-sheets .card-section {
  min-height: 80px;
}
.content-structure-class-tests-sheets .card-section-level-range {
  display: flex;
  justify-content: flex-end;
  margin: 8px;
}
.content-structure-areas .card, .content-structure-class-tests-sheets .card {
  height: 100%;
}
.content-structure-areas .card .card-image img, .content-structure-class-tests-sheets .card .card-image img {
  aspect-ratio: 9/5;
}
.content-structure-areas .card-section, .content-structure-class-tests-sheets .card-section {
  justify-content: space-between;
}
.content-structure-areas .card-section__title, .content-structure-class-tests-sheets .card-section__title {
  font-weight: 700;
}
.content-structure-topics__item.has-one-label .list-highlighted-box__title {
  padding-right: 192px;
}
.content-structure-topics__item.has-two-labels .list-highlighted-box__title {
  padding-right: 272px;
}
.content-structure-topics__item-pills {
  position: absolute;
  top: 50%;
  right: 48px;
  display: flex;
  margin-top: -16px;
}
.content-structure-topics__item-pills .pill:not(:last-child) {
  margin-right: 16px;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-structure-topics {
    padding-top: 32px;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-structure-topics__item .list-highlighted-box__title {
    padding-right: 40px;
  }
}
.content-topic {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.5rem 1rem 0.5rem;
  border-bottom: 1px solid #e1e1e1;
  transition: background-color 0.2s ease;
}
.content-topic:hover {
  background-color: #f8f8f8;
}
.content-topic__thumbnail {
  flex-shrink: 0;
  width: 5rem;
  height: 2.8125rem;
  border-radius: 0.25rem;
  overflow: hidden;
}
.content-topic__thumbnail-image {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.content-topic__content {
  flex: 1 1;
  min-width: 0;
}
.content-topic__title {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: #3c3c3c;
  font-weight: 600;
}
.content-topic__counts {
  display: flex;
  gap: 1rem;
}
.content-topic__count {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.75rem;
  color: #666;
}
.content-topic__count-icon {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}
@media only screen and (max-width: 959px) {
  .content-topic {
    padding: 1rem 0;
  }
}
.content-topics-list__hidden-item {
  display: none;
}
.content-topics-list__toggle-button {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.5rem 1rem;
  border: none;
  background: transparent;
  color: #06c;
  font-size: 1rem;
  font-weight: 400;
  cursor: pointer;
  transition: color 0.2s ease;
  text-decoration: underline;
}
.content-topics-list__toggle-button:hover {
  color: #09f;
}
.content-topics-list__toggle-button .icon--arrow-simple {
  transition: transform 0.2s ease;
}
.content-topics-list__toggle-button .icon--arrow-simple.icon--rotate-180 {
  transform: rotate(-90deg);
}
.content-area__area-title {
  font-size: 1.375rem;
  font-weight: bold;
}
.content-structure-areas-level-bucket-list {
  padding-bottom: 4rem;
}
.content-structure-areas-level-bucket-list .content-areas-accordion .accordion-item {
  border: 1px solid #e6e8e5;
  border-radius: 8px;
  border-left: 8px solid #9c0;
}
.content-structure-areas-level-bucket-list .content-areas-accordion .accordion-item.is-active {
  border-left: 8px solid #7aa300;
}
.content-structure-areas-level-bucket-list .content-areas-accordion .accordion-item.is-active .accordion-title,
.content-structure-areas-level-bucket-list .content-areas-accordion .accordion-item.is-active .accordion-content {
  background-color: #f8f8f8;
}
.content-structure-areas-level-bucket-list .content-areas-accordion .accordion-item.is-active .accordion-title h3 {
  font-weight: bold;
  color: #333;
}
.content-structure-areas-level-bucket-list .content-areas-accordion .accordion-item.is-active .accordion-title i {
  color: #666;
}
.content-structure-areas-level-bucket-list .content-areas-accordion .accordion-item.is-active .accordion-title:focus {
  outline: none;
}
.content-structure-areas-level-bucket-list .content-areas-accordion .accordion-title,
.content-structure-areas-level-bucket-list .content-areas-accordion .accordion-content {
  border: none !important;
}
.content-structure-areas-level-bucket-list .content-areas-accordion .accordion-title:focus,
.content-structure-areas-level-bucket-list .content-areas-accordion .accordion-content:focus {
  outline: 2px solid #9c0;
}
.content-structure-areas-level-bucket-list .card {
  height: 100%;
}
.content-structure-areas-level-bucket-list .card .card-image img {
  aspect-ratio: 9/5;
}
.content-structure-areas-level-bucket-list .card:focus {
  outline: 2px solid #9c0;
}
.content-structure-areas-level-bucket-list .card-section__title {
  font-size: 1rem;
  font-weight: 300;
}
.featured-videos .cards-list__item {
  width: calc(20% - 10px);
}
.featured-videos .cards-list__item:not(:first-child) {
  margin-left: 12px;
}
@media only screen and (max-width: 639px) {
  body.is-responsive .featured-videos .card__title {
    max-height: 4em;
    font-size: 12px;
  }
}
.content-structure-featured-videos {
  padding-top: 64px;
  padding-bottom: 64px;
  background: #527a00;
}
.content-structure-featured-videos__headline {
  color: #fff;
}
.content-structure-featured-videos__subheadline, .content-structure-featured-videos__instruction {
  color: #fff;
  font-weight: bold;
}
@media only screen and (max-width: 959px) {
  .content-structure-featured-videos {
    padding-top: 32px;
    padding-bottom: 32px;
  }
}
.content-structure-featured-videos .card__link {
  position: absolute;
  top: -100px;
  left: 0;
  right: 0;
  height: 256px;
  padding: 116px 16px 35px;
  z-index: 2;
}
.content-structure-featured-videos .card__show-video-button {
  position: absolute;
  bottom: 48px;
  left: 50%;
  transform: translateX(-50%);
}
.content-structure-featured-videos .card-section {
  height: 156px;
}
.content-structure-featured-videos .card-video-bookmark {
  position: absolute;
  bottom: 8px;
  right: 8px;
  z-index: 3;
}
.content-structure-featured-videos .card-video-bookmark .video-bookmark-button__text {
  display: none;
}
.content-structure-featured-videos .card-video-bookmark .video-bookmark-button .icon {
  margin-right: -4px;
}
.content-structure-featured-videos .rating-stars {
  position: absolute;
  bottom: 16px;
  left: 16px;
}
.content-structure-featured-videos .rating-stars__icon {
  font-size: 16px;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-structure-featured-videos .card__link {
    top: 0;
    left: -126px;
    height: 80px;
    padding: 8px 160px 27px 134px;
  }
  body.is-responsive .content-structure-featured-videos .card__show-video-button {
    right: 16px;
    bottom: auto;
    bottom: initial;
    left: auto;
    left: initial;
    top: 50%;
    transform: translateY(-50%);
  }
  body.is-responsive .content-structure-featured-videos .card-section {
    padding-right: 160px;
  }
  body.is-responsive .content-structure-featured-videos .card-video-bookmark {
    top: 50%;
    right: 48px;
    bottom: auto;
    margin-top: -12px;
  }
  body.is-responsive .content-structure-featured-videos .card-video-bookmark .video-bookmark-button__text {
    display: inline-block;
  }
  body.is-responsive .content-structure-featured-videos .card-video-bookmark .video-bookmark-button--navigate .icon {
    display: none;
  }
  body.is-responsive .content-structure-featured-videos .card-video-bookmark .video-bookmark-button .icon {
    margin-right: 4px;
  }
  body.is-responsive .content-structure-featured-videos .rating-stars {
    bottom: 8px;
    left: 8px;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-structure-featured-videos .card__link,
  body.is-responsive .content-structure-featured-videos .card-section {
    padding-right: 64px;
  }
  body.is-responsive .content-structure-featured-videos .card-video-bookmark {
    right: 32px;
  }
  body.is-responsive .content-structure-featured-videos .card-video-bookmark .video-bookmark-button__text {
    display: none;
  }
  body.is-responsive .content-structure-featured-videos .card-video-bookmark .video-bookmark-button--navigate .icon {
    display: inline-block;
  }
  body.is-responsive .content-structure-featured-videos .card-video-bookmark .video-bookmark-button .icon {
    margin-right: -4px;
  }
}
.content-video-cta {
  padding-top: 24px;
  color: #fff;
  text-align: center;
}
.content-video-cta__headline {
  margin-bottom: 0;
  font-weight: bold;
}
.content-video-cta__subheadline {
  margin-bottom: 16px;
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-video-cta {
    padding-top: 16px;
  }
  body.is-responsive .content-video-cta__headline {
    font-size: 16px;
  }
  body.is-responsive .content-video-cta__subheadline {
    font-size: 14px;
  }
}
.videos-card {
  position: relative;
  height: 184px;
  border: 0;
}
.videos-card img {
  width: 100%;
  height: 80px;
  -o-object-fit: cover;
     object-fit: cover;
}
.videos-card .card-image {
  position: relative;
}
.videos-card .card-section {
  padding: 16px 8px 8px;
}
.videos-card .card-section__title {
  max-height: 5em;
}
.videos-card--current {
  border: 4px solid #06c;
}
.videos-card--exercise-solved::after {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(173, 214, 51, 0.3);
  content: "";
  z-index: 1;
}
.videos-label {
  position: absolute;
  top: -46px;
  right: -46px;
  width: 91px;
  height: 91px;
  transform: rotate(45deg);
}
.videos-label__text {
  position: relative;
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  display: block;
  top: 57px;
  left: 18px;
  width: 56px;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.3;
  text-align: center;
  text-transform: uppercase;
}
.videos-label .icon {
  position: relative;
  transform: rotate(-45deg);
  color: #fff;
}
.videos-label--level {
  background-color: #e38800;
}
.videos-stamp {
  position: absolute;
  bottom: -16px;
  right: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  z-index: 2;
}
.videos-stamp .icon {
  color: #fff;
}
.videos-stamp--video-watched {
  background-color: #fbcd00;
}
.videos-stamp--exercise-solved {
  background-color: #add633;
}
.recommended-videos-section {
  padding-top: 0;
  background: none;
}
.recommended-videos-section .rating-stars {
  position: static;
  position: initial;
}
.recommended-videos-section .button.tiny {
  font-size: 0.875rem;
}
.recommended-videos-section .card__show-video-button {
  bottom: 1rem;
  width: 80%;
}
.recommended-videos-section .card__image-wrapper .card__image--watched {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: block;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  background: rgba(51, 51, 51, 0.9);
  color: #fff;
  content: "";
}
.recommended-videos-section .card-section {
  height: 177px;
  padding-top: 0.5rem;
}
.recommended-videos-section .card-section span {
  margin-top: 0.5rem;
}
.recommended-videos-section .card-section .label {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 6rem;
  height: 1.5rem;
  margin-bottom: 0.5rem;
  border-radius: 0.5rem;
  color: #333;
  font-size: 0.75rem;
}
.recommended-videos-section .card-section .label--german {
  background-color: rgba(244, 189, 153, 0.4);
}
.recommended-videos-section .card-section .label--maths {
  background-color: rgba(153, 207, 225, 0.4);
}
@media only screen and (max-width: 959px) {
  body.is-responsive .recommended-videos-section .card__show-video-button {
    max-width: -moz-fit-content;
    max-width: fit-content;
    padding: 0.5rem 1rem;
  }
  body.is-responsive .recommended-videos-section .card-section .label {
    margin-right: 0.5rem;
    margin-bottom: 0;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .recommended-videos-section {
    margin-top: 1.5rem;
  }
  body.is-responsive .recommended-videos-section .card__image {
    width: 133px;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  body.is-responsive .recommended-videos-section .card-section {
    height: -moz-fit-content;
    height: fit-content;
    width: calc(100% - 133px);
  }
  body.is-responsive .recommended-videos-section .card-section .label {
    margin-bottom: 0.5rem;
  }
}
.content-structure-header__content {
  position: relative;
  padding-top: 32px;
  padding-bottom: 32px;
}
.content-structure-header__content .subheader {
  margin-bottom: 0;
}
.content-structure-header__headline {
  display: flex;
  align-items: flex-start;
}
.content-structure-header__headline .h1 {
  margin-bottom: 0;
  text-align: left;
}
.content-structure-header__headline .sprites-subjects-64 {
  flex-shrink: 0;
  margin-right: 16px;
}
.content-structure-header__headline .info-island-pill {
  margin-top: 16px;
  margin-left: 16px;
}
.content-structure-header__dropdown {
  position: absolute;
  top: 40px;
  right: 16px;
  width: 160px;
  padding: 15px;
  border: solid 1px #9c0;
  border-radius: 4px;
  background: #fff;
  line-height: 1;
  cursor: pointer;
}
.content-structure-header__dropdown i {
  margin-top: 5px;
  float: right;
}
.locale-at .content-structure-header__dropdown, .locale-ch .content-structure-header__dropdown {
  width: 220px;
}
.content-structure-header__dropdown:hover {
  background: #d6eb99;
}
.content-structure-header--colored {
  background: #d6eb99;
}
.content-structure-header--colored .content-structure-header__dropdown:hover {
  background: #c2e066;
}
.content-structure-header.has-level-filter .content-structure-header__headline {
  padding-right: 176px;
}
.locale-at .content-structure-header.has-level-filter .content-structure-header__headline, .locale-ch .content-structure-header.has-level-filter .content-structure-header__headline {
  padding-right: 236px;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-structure-header__content {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  body.is-responsive .content-structure-header__headline .h1 {
    line-height: 1;
  }
  body.is-responsive .content-structure-header__headline .sprites-subjects-64 {
    width: 32px;
    height: 32px;
    margin-right: 8px;
  }
  body.is-responsive .content-structure-header__headline .info-island-pill {
    margin-top: 0;
  }
  body.is-responsive .content-structure-header__dropdown {
    position: static;
    position: initial;
    width: 100%;
    margin-top: 16px;
  }
  body.is-responsive .content-structure-header.has-level-filter .content-structure-header__headline {
    padding-right: 0;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-structure-header__headline {
    align-items: center;
  }
  body.is-responsive .content-structure-header__headline .sprites-subjects-64 {
    display: none;
  }
  body.is-responsive .content-structure-header__headline .info-island-pill {
    margin-top: 0;
  }
}
body.is-mobile-app .content-structure-header__dropdown {
  position: static;
  position: initial;
  width: auto;
  width: initial;
  margin-top: 16px;
}
.content-structure-search {
  padding-bottom: 32px;
}
.content-structure-search .autocomplete-suggestions {
  width: 100%;
  margin-top: 0;
  font-size: 16px;
}
.content-structure-search .autocomplete-suggestion {
  height: 48px;
}
.content-structure-search .autocomplete-suggestion::before {
  margin-bottom: 0;
  vertical-align: text-top;
}
.content-structure-search .autocomplete-suggestion::after {
  margin-top: 4px;
}
.content-structure-search .search-form__form {
  position: relative;
}
.content-structure-search .search-form__input {
  height: 64px;
  max-height: 64px;
}
.content-structure-search .search-form__input:focus + .search-form__submit {
  display: inline-block;
}
.content-structure-search .search-form__submit {
  height: 64px;
  width: 64px;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-structure-search .search-form__input {
    height: 48px;
  }
  body.is-responsive .content-structure-search .search-form__submit {
    height: 48px;
    width: 48px;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-structure-search .search-form__input {
    padding-right: 40px;
    padding-left: 10px;
    font-size: 12px;
  }
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-structure-search .autocomplete-suggestions {
    width: 100%;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-structure-search .autocomplete-suggestions {
    margin-top: 0;
    border-radius: 4px;
    font-size: 12px;
  }
  body.is-responsive .content-structure-search .autocomplete-suggestion {
    padding: 15px 20px;
  }
}
.content-structure-search-divider {
  padding-top: 32px;
  border-top: solid 4px #9c0;
}
/* stylelint-disable unit-no-unknown */
.subjects-index-page .page-content {
  padding-bottom: 240px;
  background: url("/assets/application/account/activity/subjects-cropped.svg") center bottom no-repeat;
}
@media only screen and (max-width: 959px) {
  .subjects-index-page .page-content {
    padding-bottom: 32px;
    background-image: none;
  }
}
@media only screen and (max-width: 639px) {
  .subjects-index-page .page-content {
    padding-bottom: 16px;
  }
}
.nav-subjects {
  padding-top: 32px;
  padding-bottom: 64px;
}
.nav-subjects .h2 b {
  vertical-align: baseline;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .nav-subjects {
    padding-top: 32px;
    padding-bottom: 32px;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .nav-subjects {
    padding-top: 16px;
    padding-bottom: 16px;
  }
}
.nav-subjects-banner {
  padding-top: 48px;
  padding-bottom: 48px;
}
.nav-subjects-banner__banner-wrapper {
  padding-right: 8px;
}
.nav-subjects-banner__banner-wrapper:last-child {
  padding-right: 0;
}
@media only screen and (max-width: 959px) {
  .nav-subjects-banner__banner-wrapper {
    padding-right: 0;
    padding-bottom: 8px;
  }
}
.nav-subjects-banner--winter-theme {
  background-image: url("/assets/application/content_structure/winter_banner.svg");
  background-repeat: no-repeat;
  background-position: right;
  background-size: cover;
}
.nav-subjects-banner--spring-theme {
  background-image: url("/assets/application/content_structure/spring_banner.svg");
  background-repeat: no-repeat;
  background-position: right;
  background-size: cover;
}
@media only screen and (max-width: 639px) {
  .nav-subjects-banner--spring-theme {
    background-position: 70%;
  }
}
.nav-subjects-banner__headline {
  display: block;
  margin-bottom: 0;
}
.nav-subjects-banner__icon-container {
  margin-right: -30px;
}
.nav-subjects-banner h1,
.nav-subjects-banner p {
  margin: 0;
  text-align: left;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .nav-subjects-banner {
    padding-top: 32px;
    padding-bottom: 32px;
  }
  body.is-responsive .nav-subjects-banner__icon-container {
    margin-right: 16px;
  }
  body.is-responsive .nav-subjects-banner.winter {
    background: url("/assets/application/content_structure/winter_theme/winter_header_background.svg") #8ED6E4 no-repeat center bottom/contain;
  }
  body.is-responsive .nav-subjects-banner.spring {
    background: url("/assets/application/content_structure/spring_theme/spring_header_background.svg") #8ED6E4 no-repeat center bottom/contain;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .nav-subjects-banner {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  body.is-responsive .nav-subjects-banner__icon {
    margin-top: 8px;
    transform: scale(1.4);
  }
}
.nav-subjects-banner--interactive-workbook, .nav-subjects-banner--videos {
  padding: 32px 0px 16px;
}
.nav-subjects-banner--interactive-workbook {
  background-color: #e6f3f8;
}
.nav-subjects-banner--videos {
  background-color: #e6f8e6;
}
.content-subjects-cards {
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  gap: 16px;
}
.content-subjects-cards .content-subject-card {
  flex-basis: 31%;
  flex-grow: 1;
}
.content-subjects-cards .content-subject-card__image-container {
  min-width: 120px;
  min-height: 120px;
}
.content-subjects-cards .content-subject-card__content {
  margin-left: 16px;
}
.content-subjects-cards .content-subject-card__description {
  margin-top: 8px;
  color: #333;
  font-weight: 300;
}
@media only screen and (max-width: 639px) {
  .content-subjects-cards .content-subject-card__image-container {
    min-width: 95px;
    min-height: 95px;
  }
  .content-subjects-cards .content-subject-card__description {
    font-size: 14px;
    font-weight: normal;
  }
}
.content-subjects-cards--two-columns-layout .content-subject-card {
  flex-basis: 34%;
}
@media only screen and (max-width: 959px) {
  .content-subjects-cards .content-subject-card {
    flex-basis: 100%;
  }
}
.content-structure-text__headline {
  margin-bottom: 64px;
}
.content-structure-text__headline span {
  display: block;
}
.content-structure-text__box {
  box-shadow: 0 8px 24px -12px rgba(0, 0, 0, 0.25);
  position: relative;
  padding: 64px 72px;
  border: solid 1px #ddd;
  background: #fff;
  z-index: auto;
}
.content-structure-text__box::before, .content-structure-text__box::after {
  position: absolute;
  top: 0;
  left: 0;
  box-shadow: 0 8px 24px -12px rgba(0, 0, 0, 0.25);
  display: block;
  width: 100%;
  height: 100%;
  border: solid 1px #ddd;
  content: "";
}
.content-structure-text__box::before {
  transform: rotate(-0.8deg);
  z-index: -2;
}
.content-structure-text__box::after {
  transform: rotate(0.8deg);
  z-index: -1;
}
.content-structure-text__ribbon {
  position: absolute;
  top: -1px;
  right: 64px;
  background: rgba(1, 1, 1, 0) url("/assets/application/content_structure/ribbon.svg") center center no-repeat;
  width: 48px;
  height: 96px;
  background-size: contain;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-structure-text {
    padding-bottom: 32px;
  }
  body.is-responsive .content-structure-text__headline {
    margin-bottom: 0;
    font-size: 20px;
    line-height: 1.5;
  }
  body.is-responsive .content-structure-text__box {
    margin: 0 28px;
    padding: 32px;
  }
  body.is-responsive .content-structure-text__box::before {
    transform: rotate(-0.6deg);
  }
  body.is-responsive .content-structure-text__box::after {
    transform: rotate(0.6deg);
  }
  body.is-responsive .content-structure-text__box h2 {
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto;
  }
  body.is-responsive .content-structure-text__ribbon {
    right: 32px;
    width: 32px;
    height: 64px;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-structure-text {
    padding-top: 0;
    padding-bottom: 0;
  }
  body.is-responsive .content-structure-text__box {
    margin: 0 -16px;
    padding-right: 16px;
    padding-left: 16px;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    box-shadow: none;
  }
  body.is-responsive .content-structure-text__box::before, body.is-responsive .content-structure-text__box::after {
    display: none;
  }
  body.is-responsive .content-structure-text__ribbon {
    right: 24px;
  }
}
.content-structure-topic-cards-list {
  display: flex;
  flex-flow: row wrap;
  margin: -16px -12px;
}
.content-structure-topic-cards-list__item {
  width: 25%;
  padding: 16px 12px;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-structure-topic-cards-list__item {
    width: 33.3333%;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-structure-topic-cards-list {
    margin: -8px;
  }
  body.is-responsive .content-structure-topic-cards-list__item {
    width: 100%;
    padding: 8px;
  }
}
.content-structure-topic-card {
  height: 100%;
}
.content-structure-topic-card__thumbnail {
  position: relative;
  flex-grow: 0;
  padding-top: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.content-structure-topic-card__video-count {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  display: flex;
  align-items: flex-end;
  padding: 16px;
  background: linear-gradient(transparent 40%, #666);
  color: #fff;
  line-height: 1;
}
.content-structure-topic-card__video-count .icon {
  margin-right: 4px;
}
.content-structure-topic-card__video-count .icon--learning-text {
  margin-left: 8px;
}
.content-structure-topic-card__title {
  display: inline-block;
  max-height: 7em;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-structure-topic-card__title {
    max-height: 5em;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-structure-topic-card__video-count span {
    line-height: 1.1;
  }
}
.content-topic-page-content {
  padding-bottom: 64px;
  background-color: #fff;
}
.content-topic-page-content .info-bullet-list {
  margin-top: 2rem;
  padding-left: 0;
}
.content-topic-page-content .info-bullet-list a {
  text-decoration: none !important;
}
.content-topic-page-content .info-bullet-list li ul {
  margin-top: 0.75rem;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-topic-page-content {
    padding-bottom: 48px;
  }
}
.content-topic-featured-videos {
  margin-bottom: 32px;
  padding-bottom: 32px;
  background-color: #527a00;
}
.content-topic-featured-videos .nav-screenshot__headline,
.content-topic-featured-videos .nav-screenshot__title {
  color: #fff;
}
.content-topic-featured-videos .button-medium {
  display: inline-block;
  width: 300px;
  margin: 20px 8px 0;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-topic-featured-videos .grid-column-4 {
    padding: 0 10px;
  }
  body.is-responsive .content-topic-featured-videos .button-medium {
    display: block;
    width: 332px;
    margin-top: 10px;
    margin-right: auto;
    margin-left: auto;
  }
  body.is-responsive .content-topic-featured-videos .button-medium:first-of-type {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-topic-featured-videos .is-centered {
    padding-right: 10px;
    padding-left: 10px;
  }
  body.is-responsive .content-topic-featured-videos .button-medium {
    width: 100%;
    font-size: 16px;
  }
}
.content-topic-video-gallery {
  position: relative;
  padding: 16px 0 32px;
  background: #f8f8f8;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-topic-video-gallery {
    padding: 24px 0;
  }
}
.content-topic-description {
  margin-top: 64px;
  margin-bottom: 64px;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .content-topic-description {
    margin-top: 0;
  }
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-topic-description {
    margin-bottom: 32px;
  }
}
.content-topic-lists .box-feature-content .h4 {
  margin-bottom: 0;
  padding-left: 9px;
}
.content-topic-lists .box-feature-content__subheadline {
  right: 235px;
  font-size: 14px;
}
.content-topic-lists .box-feature-content:not(:first-child) {
  margin-top: 32px;
}
.content-topic-lists .list-video-meta__item:hover .video-levels__text {
  background: #999;
  color: #fff;
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-topic-lists .list-video-meta__title {
    min-height: auto;
  }
  body.is-responsive .content-topic-lists .list-video-meta .icons-meta-nav {
    display: flex;
  }
  body.is-responsive .content-topic-lists .video-levels {
    margin-right: 8px;
  }
}
/* stylelint-disable max-nesting-depth */
.content-page-use-case-selector__container {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.content-page-use-case-selector--elementary-school p:lang(de) {
  font-family: "Grundschrift", "Open Sans", Helvetica, Arial, sans-serif;
}
.content-page-use-case-selector--elementary-school p:lang(en) {
  font-family: "Grundschrift-EN", "Open Sans", Helvetica, Arial, sans-serif;
}
.content-page-use-case-selector--middle-school p {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
}
.content-page-use-case-selector__header {
  position: relative;
  padding-top: 32px;
  padding-bottom: 100px;
  background: #9bd0e2 url("/assets/application/content_structure/background.svg") no-repeat center bottom/contain;
}
.content-page-use-case-selector .card {
  height: 100%;
  padding: 16px;
}
.content-page-use-case-selector .card--bookr {
  background-color: #f2e6f8;
}
.content-page-use-case-selector .card--videos {
  background-color: #f7f8a9;
}
.content-page-use-case-selector .card--sofa-held {
  background-color: #d5ffc6;
}
.content-page-use-case-selector .card--vocabulary-trainer {
  background-color: #e6edf8;
}
.content-page-use-case-selector .card--verb-trainer {
  height: auto;
  background-color: #f5fae6;
}
.content-page-use-case-selector .card--assessment-test {
  background-color: #fcf3e6;
}
.content-page-use-case-selector .card--spelling-trainer {
  background-color: #f7e7fb;
}
.content-page-use-case-selector .card .card-sections {
  display: flex;
  flex: 1 0 auto;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0;
}
.content-page-use-case-selector .card__variation {
  padding: 0;
  background-color: #fff;
}
.content-page-use-case-selector .card .card-image {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: auto;
  height: 211px;
}
.content-page-use-case-selector .card .card-section {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0 24px 16px;
}
.content-page-use-case-selector .card.card--videos .card-image {
  background-color: #f7f8a9;
}
.content-page-use-case-selector .card.card--sofa-held-middle-school img {
  height: 190px;
}
.content-page-use-case-selector .card.card--sofa-held-middle-school .card-image {
  background: url("/assets/application/practice-app/middle_school_use_case_bg.svg") no-repeat center center/cover;
}
.content-page-use-case-selector .card.card--verb-trainer .card-image {
  background-color: #f5fae6;
}
.content-page-use-case-selector .card.card--vocabulary-trainer .card-image {
  background-color: #e7eef8;
}
.content-page-use-case-selector .card.card--vocabulary-trainer-englisch .card-image {
  background-color: #e6edf8;
}
.content-page-use-case-selector .card.card--vocabulary-trainer-englisch img {
  height: 165px;
}
.content-page-use-case-selector .card.card--vocabulary-trainer-franzoesisch .card-image {
  background-color: #f2e6f8;
}
.content-page-use-case-selector .card.card--vocabulary-trainer-spanisch .card-image {
  background-color: #fcefe6;
}
.content-page-use-case-selector .card__icon {
  position: relative;
  margin: 0 auto -2px;
  z-index: 1;
}
.content-page-use-case-selector .card__icon--video {
  width: 155px;
  height: 91px;
  background: url("/assets/application/content_structure/chr1.png") no-repeat center center/cover;
}
.content-page-use-case-selector .card__icon--sofa-held {
  width: 155px;
  height: 91px;
  background: url("/assets/application/practice-app/pommes.png") no-repeat center center/cover;
}
.content-page-use-case-selector .card__icon--vocabulary-trainer, .content-page-use-case-selector .card__icon--verb-trainer {
  width: 100%;
  height: 100%;
}
.content-page-use-case-selector .card__icon--vocabulary-trainer {
  background: url("/assets/application/content_structure/blobby_vocabulary.svg") no-repeat center/contain;
}
.content-page-use-case-selector .card__icon--verb-trainer {
  background: url("/assets/application/content_structure/globby.svg") no-repeat center/contain;
}
.content-page-use-case-selector .card__icon--bookr {
  width: 155px;
  height: 91px;
  background: url(/packs/static/assets/images/bookr/bookr_usecase-f79cca7237736b5f04c7.svg) no-repeat center center/cover;
}
.content-page-use-case-selector .card__icon--assessment {
  width: 76px;
  height: 91px;
  margin: 0;
  background: url("/assets/application/practice-app/niko.svg") no-repeat center center/cover;
}
.content-page-use-case-selector .card__icon--spelling-trainer {
  width: 110px;
  height: 91px;
  background: url("/assets/application/practice-app/bee.svg") no-repeat center center/cover;
}
.content-page-use-case-selector .card .button {
  min-width: 140px;
  max-width: 100%;
  margin: 0 auto;
  white-space: nowrap;
  z-index: 2;
}
.content-page-use-case-selector .card__case-card {
  flex-direction: row;
  margin-right: 45%;
  background-color: #fcf3e6;
  background-repeat: no-repeat;
  background-size: cover;
  text-align: center;
}
.content-page-use-case-selector .card__case-card img {
  max-width: none;
  max-width: initial;
  height: 185px;
  margin-bottom: -32px;
}
.content-page-use-case-selector__footer-image {
  text-align: center;
}
.content-page-use-case-selector__footer-image i {
  width: 106px;
  height: 138px;
  margin-right: auto;
  margin-left: auto;
  background: url("/assets/application/content_structure/kapu.png") no-repeat center center/contain;
}
@media only screen and (max-width: 959px) {
  .content-page-use-case-selector .card__variation .card-image {
    height: 165px;
  }
  .content-page-use-case-selector .card__variation .card-image img {
    height: 130px;
  }
  .content-page-use-case-selector .card__case-card {
    margin-right: 20%;
  }
}
@media only screen and (max-width: 639px) {
  .content-page-use-case-selector__header {
    padding-right: 1rem;
    padding-bottom: 50px;
    padding-left: 1rem;
  }
  .content-page-use-case-selector__header .grid-container {
    padding: 0;
  }
  .content-page-use-case-selector__header li {
    margin-top: 16px;
  }
  .content-page-use-case-selector__horizontal-cards {
    margin-bottom: 0;
  }
  .content-page-use-case-selector .card {
    flex-direction: row;
    padding: 16px;
  }
  .content-page-use-case-selector .card .card-text {
    margin-bottom: 12px;
  }
  .content-page-use-case-selector .card .card-sections {
    align-items: flex-end;
    justify-content: flex-end;
  }
  .content-page-use-case-selector .card p {
    margin: 0;
    padding-right: 8px;
    text-align: left;
  }
  .content-page-use-case-selector .card h2 {
    margin: 0;
    font-size: 22px;
    text-align: left;
  }
  .content-page-use-case-selector .card .button {
    min-width: 111px;
    margin: 0 0 10px;
    padding: 12px 0.5rem;
  }
  .content-page-use-case-selector .card--verb-trainer .cell.auto, .content-page-use-case-selector .card--vocabulary-trainer .cell.auto {
    display: flex;
  }
  .content-page-use-case-selector .card__variation {
    flex-direction: column;
    padding: 0;
  }
  .content-page-use-case-selector .card__variation .card-image {
    height: 69px;
  }
  .content-page-use-case-selector .card__variation .card-image img {
    height: 66px;
  }
  .content-page-use-case-selector .card__variation .card-section {
    padding: 0 24px 24px;
  }
  .content-page-use-case-selector .card__variation h2, .content-page-use-case-selector .card__variation p {
    padding: 0;
    text-align: center;
  }
  .content-page-use-case-selector .card__variation .button {
    width: 114px;
    margin: 0 auto;
  }
  .content-page-use-case-selector .card__variation.card--verb-trainer .card-image img {
    height: 58px;
  }
  .content-page-use-case-selector .card__icon {
    margin-left: 0;
  }
  .content-page-use-case-selector .card__icon--video {
    width: 114px;
    height: 67px;
    margin-right: 0;
  }
  .content-page-use-case-selector .card__icon--sofa-held {
    width: 80px;
    height: 72px;
    margin-right: 14px;
  }
  .content-page-use-case-selector .card__icon--bookr {
    width: 80px;
    height: 72px;
    margin-right: 14px;
  }
  .content-page-use-case-selector .card__icon--spelling-trainer {
    margin-right: 18px;
    width: 80px;
    height: 67px;
  }
  .content-page-use-case-selector .card__icon--vocabulary-trainer-phone {
    width: 80px;
    height: 72px;
    margin-right: 14px;
    background: url("/assets/application/content_structure/blobby.svg") no-repeat bottom center/contain;
  }
  .content-page-use-case-selector .card__icon--verb-trainer-phone {
    width: 100px;
    height: 72px;
    margin-right: 4px;
    background: url("/assets/application/content_structure/cropped_globby.svg") no-repeat bottom center/contain;
  }
}
.content-page-use-case-selector--christmas-theme .content-page-use-case-selector__header {
  background-color: #3183a3;
  background-image: url("/assets/application/content_structure/background_christmas.svg");
  background-repeat: no-repeat;
}
.content-page-use-case-selector--christmas-theme .content-page-use-case-selector__header .h1 {
  color: #fff;
  font-weight: bold;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5019607843);
}
.content-page-use-case-selector--christmas-theme.content-page-use-case-selector .card--videos .card-image {
  background-image: url("/assets/application/content_structure/char1_christmas.svg");
  background-repeat: no-repeat;
  background-position: bottom -20px center;
  background-size: contain;
}
@media only screen and (max-width: 639px) {
  .content-page-use-case-selector--christmas-theme.content-page-use-case-selector .card--videos .card-image {
    background-position: bottom -10px center;
  }
}
.content-page-use-case-selector--christmas-theme.content-page-use-case-selector .card--vocabulary-trainer .card-image {
  background-repeat: no-repeat;
  background-position: bottom -40px center;
  background-size: contain;
}
@media only screen and (max-width: 639px) {
  .content-page-use-case-selector--christmas-theme.content-page-use-case-selector .card--vocabulary-trainer .card-image {
    background-position: bottom -10px center;
  }
}
.content-page-use-case-selector--christmas-theme.content-page-use-case-selector .card--vocabulary-trainer-englisch .card-image {
  background-image: url("/assets/application/vocabulary_trainer/cropped_englisch_christmas.svg");
}
.content-page-use-case-selector--christmas-theme.content-page-use-case-selector .card--vocabulary-trainer-franzoesisch .card-image {
  background-image: url("/assets/application/vocabulary_trainer/cropped_franzoesisch_christmas.svg");
}
.content-page-use-case-selector--christmas-theme.content-page-use-case-selector .card--vocabulary-trainer-spanisch .card-image {
  background-image: url("/assets/application/vocabulary_trainer/cropped_spanisch_christmas.svg");
}
.content-page-use-case-selector--christmas-theme.content-page-use-case-selector .card--verb-trainer .card-image {
  background-image: url("/assets/application/content_structure/globby_christmas.svg");
  background-repeat: no-repeat;
  background-position: bottom -40px center;
  background-size: contain;
}
@media only screen and (max-width: 639px) {
  .content-page-use-case-selector--christmas-theme.content-page-use-case-selector .card--verb-trainer .card-image {
    background-position: bottom -10px center;
  }
}
.content-page-use-case-selector--christmas-theme.content-page-use-case-selector .card--sofa-held-middle-school .card-image {
  background-color: #e5e0ff;
  background-image: url("/assets/application/characters/pommes_with_star_christmas.svg");
  background-repeat: no-repeat;
  background-position: bottom -40px center;
  background-size: contain;
}
@media only screen and (max-width: 639px) {
  .content-page-use-case-selector--christmas-theme.content-page-use-case-selector .card--sofa-held-middle-school .card-image {
    background-position: bottom -10px center;
  }
}
.content-page-use-case-selector--spring-theme .content-page-use-case-selector__header {
  background-color: #98E5FF;
  background-image: url("/assets/application/content_structure/background_spring.svg");
  background-repeat: no-repeat;
}
.content-page-use-case-selector--spring-theme .content-page-use-case-selector__header .h1 {
  color: #fff;
  font-weight: bold;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5019607843);
}
.content-page-use-case-selector--spring-theme.content-page-use-case-selector .card--videos .card-image {
  background-image: url("/assets/application/content_structure/char1_spring.svg");
  background-repeat: no-repeat;
  background-position: bottom -20px center;
  background-size: contain;
}
@media only screen and (max-width: 639px) {
  .content-page-use-case-selector--spring-theme.content-page-use-case-selector .card--videos .card-image {
    background-position: bottom -10px center;
  }
}
.content-page-use-case-selector--spring-theme.content-page-use-case-selector .card--vocabulary-trainer .card-image {
  background-repeat: no-repeat;
  background-position: bottom -40px center;
  background-size: contain;
}
@media only screen and (max-width: 639px) {
  .content-page-use-case-selector--spring-theme.content-page-use-case-selector .card--vocabulary-trainer .card-image {
    background-position: bottom -10px center;
  }
}
.content-page-use-case-selector--spring-theme.content-page-use-case-selector .card--vocabulary-trainer-englisch .card-image {
  background-image: url("/assets/application/vocabulary_trainer/cropped_english_spring.svg");
}
.content-page-use-case-selector--spring-theme.content-page-use-case-selector .card--vocabulary-trainer-franzoesisch .card-image {
  background-image: url("/assets/application/vocabulary_trainer/cropped_french_spring.svg");
}
.content-page-use-case-selector--spring-theme.content-page-use-case-selector .card--vocabulary-trainer-spanisch .card-image {
  background-image: url("/assets/application/vocabulary_trainer/cropped_spanish_spring.svg");
}
.content-page-use-case-selector--spring-theme.content-page-use-case-selector .card--verb-trainer .card-image {
  background-image: url("/assets/application/content_structure/globby_spring.svg");
  background-repeat: no-repeat;
  background-position: bottom -40px center;
  background-size: contain;
}
@media only screen and (max-width: 639px) {
  .content-page-use-case-selector--spring-theme.content-page-use-case-selector .card--verb-trainer .card-image {
    background-position: bottom -10px center;
  }
}
.content-page-use-case-selector--spring-theme.content-page-use-case-selector .card--sofa-held-middle-school .card-image {
  background-color: #e5e0ff;
  background-image: url("/assets/application/characters/pommes_with_star_spring.svg");
  background-repeat: no-repeat;
  background-position: bottom -20px center;
  background-size: contain;
}
@media only screen and (max-width: 639px) {
  .content-page-use-case-selector--spring-theme.content-page-use-case-selector .card--sofa-held-middle-school .card-image {
    background-position: bottom -10px center;
  }
}
.use-case-selector-card {
  display: flex;
  position: relative;
  width: 48%;
  height: 260px;
  border-radius: 8px;
  overflow: hidden;
}
.use-case-selector-card__ribbon {
  position: absolute;
  top: 20px;
  left: -70px;
  width: 220px;
  padding: 8px 63px;
  transform: rotate(-45deg);
  background-color: #e35b00;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
}
.use-case-selector-card__icon {
  flex: 2 1;
}
.use-case-selector-card__icon-phone {
  width: 111px;
  height: 90px;
}
.use-case-selector-card__content {
  display: flex;
  flex: 3 1;
  flex-direction: column;
  padding: 16px 16px 16px 0;
}
.use-case-selector-card__title {
  font-size: 1.6em;
}
.use-case-selector-card__button {
  margin-top: auto;
}
.use-case-selector-card--vocabulary-trainer {
  background-color: #e6edf8;
}
.use-case-selector-card--vocabulary-trainer .icon {
  background: url("/assets/application/content_structure/blobby_vocabulary.svg") no-repeat;
  background-position: center;
}
.use-case-selector-card--vocabulary-trainer .icon-phone {
  background: url("/assets/application/content_structure/blobby.svg") no-repeat;
  background-position: bottom center;
  background-size: 80px;
}
.use-case-selector-card--verb-trainer {
  background-color: #f5fae6;
}
.use-case-selector-card--verb-trainer .icon, .use-case-selector-card--verb-trainer .icon-phone {
  background: url("/assets/application/content_structure/globby.svg") no-repeat;
}
.use-case-selector-card--verb-trainer .icon {
  background-position: center;
}
.use-case-selector-card--verb-trainer .icon-phone {
  background-position: bottom -25px center;
  background-size: contain;
}
.use-case-selector-card--sofa-held {
  background-color: #d5ffc6;
}
.use-case-selector-card--sofa-held .icon {
  background: url("/assets/application/characters/pommes_with_star.svg") no-repeat;
  background-position: bottom right;
  background-size: 320px;
}
.use-case-selector-card--sofa-held .icon-phone {
  background: url("/assets/application/practice-app/pommes.png") no-repeat;
  background-position: bottom center;
  background-size: contain;
}
.use-case-selector-card--videos {
  background-color: #f7f8a9;
}
.use-case-selector-card--videos .icon, .use-case-selector-card--videos .icon-phone {
  background: url("/assets/application/characters/zazie_with_laptop.svg") no-repeat;
}
.use-case-selector-card--videos .icon {
  background-position: bottom center;
}
.use-case-selector-card--videos .icon-phone {
  background-position: center;
  background-size: contain;
}
.use-case-selector-card--sofaheld-printables {
  background-color: #e6edf8;
}
.use-case-selector-card--sofaheld-printables .icon-phone {
  background: url(/packs/static/content_structure/sofaheld_printables_use_case_selector_phone-c6c1ea997ddf9b145135.svg) no-repeat;
  background-position: bottom center;
  background-size: 100px;
}
.use-case-selector-card--sofaheld-printables .icon {
  background: url(/packs/static/content_structure/sofaheld_printables_use_case_selector-92d25b247cf772e4b725.svg) no-repeat;
  background-position: bottom center;
  background-size: contain;
}
.use-case-selector-card--spelling-trainer {
  background-color: #f4e7fb;
}
.use-case-selector-card--spelling-trainer .icon, .use-case-selector-card--spelling-trainer .icon-phone {
  background: url("/assets/application/characters/bee_writing.svg") no-repeat;
}
.use-case-selector-card--spelling-trainer .icon {
  background-position: bottom -30px left;
  background-size: 210px;
}
.use-case-selector-card--spelling-trainer .icon-phone {
  background-position: center bottom -20px;
  background-size: contain;
}
.use-case-selector-card--spelling-trainer h2 {
  margin-bottom: 0;
}
.use-case-selector-card--assessment-test {
  background-color: #fcf3e6;
}
.use-case-selector-card--assessment-test .icon, .use-case-selector-card--assessment-test .icon-phone {
  background: url("/assets/application/practice-app/niko.svg") no-repeat;
}
.use-case-selector-card--assessment-test .icon {
  background-position: bottom center;
  background-size: 180px;
}
.use-case-selector-card--assessment-test .icon-phone {
  background-position: center;
  background-size: contain;
}
.use-case-selector-card--bookr {
  background-color: #f2e6f8;
}
.use-case-selector-card--bookr .icon, .use-case-selector-card--bookr .icon-phone {
  background: url(/packs/static/assets/images/bookr/bookr_usecase-f79cca7237736b5f04c7.svg) no-repeat;
  background-position: bottom center;
}
.use-case-selector-card--bookr .icon {
  background-size: 400px;
}
.use-case-selector-card--bookr .icon-phone {
  background-size: 150px;
}
.use-case-selector-card--schoolbook-mapping {
  background-color: #fcf8e6;
}
.use-case-selector-card--schoolbook-mapping .icon, .use-case-selector-card--schoolbook-mapping .icon-phone {
  background: url(/packs/static/assets/images/application/content_structure/schoolbook_mapping-a245a4be32c7cc084cc2.svg) no-repeat;
  background-position: center center;
}
.use-case-selector-card--schoolbook-mapping .icon {
  background-size: 10rem;
}
.use-case-selector-card--schoolbook-mapping .icon-phone {
  background-position: center bottom -32px;
  background-size: 5.5rem;
}
.use-case-selector-card__winter-calendar .icon, .use-case-selector-card__winter-calendar .icon-phone {
  background: url(/packs/static/content_structure/mikka_small-70d47b736cf46777b2b0.svg) no-repeat;
  background-position: bottom center;
}
.use-case-selector-card__winter-calendar .icon {
  background-size: 150px;
}
.use-case-selector-card__winter-calendar .icon-phone {
  background-size: 60px;
}
.use-case-selector-card__winter-calendar--v2 {
  background-color: #e6f3f8;
}
.use-case-selector-card__winter-calendar--v1 {
  background-color: #f5fae6;
}
@media only screen and (max-width: 959px) {
  .use-case-selector-card {
    width: 80%;
    height: auto;
  }
  .use-case-selector-card--schoolbook-mapping .icon {
    background-size: 8rem;
  }
}
@media only screen and (max-width: 639px) {
  .use-case-selector-card {
    flex: 1 1;
    width: 100%;
    padding: 16px;
    text-align: left;
  }
  .use-case-selector-card__icon {
    display: none;
  }
  .use-case-selector-card__content {
    flex-direction: row;
    justify-content: space-between;
    min-height: 120px;
    padding: 0;
  }
  .use-case-selector-card__text h2 {
    font-size: 22px;
    margin-bottom: 0;
  }
  .use-case-selector-card__button {
    display: flex;
    flex-direction: column;
  }
  .use-case-selector-card__button .button {
    width: 111px;
    padding: 12px 8px;
  }
  .use-case-selector-card__icon-phone {
    align-self: center;
  }
}
.use-case-selector-card__spring-calendar {
  background-color: #e6f3f8;
}
.use-case-selector-card__spring-calendar .icon, .use-case-selector-card__spring-calendar .icon-phone {
  background: url(/packs/static/content_structure/pommes_airballoon_spring-04f5837cefd93f6db3f5.svg) no-repeat;
  background-position: center;
}
.use-case-selector-card__spring-calendar .icon {
  background-size: 140px;
}
.use-case-selector-card__spring-calendar .icon-phone {
  height: 120px;
  background-position: center bottom;
  background-size: 80px;
}
@media only screen and (max-width: 959px) {
  .use-case-selector-card {
    width: 80%;
    height: auto;
  }
  .use-case-selector-card--schoolbook-mapping .icon {
    background-size: 8rem;
  }
}
@media only screen and (max-width: 639px) {
  .use-case-selector-card {
    flex: 1 1;
    width: 100%;
    padding: 16px;
    text-align: left;
  }
  .use-case-selector-card__icon {
    display: none;
  }
  .use-case-selector-card__content {
    flex-direction: row;
    justify-content: space-between;
    min-height: 120px;
    padding: 0;
  }
  .use-case-selector-card__text h2 {
    font-size: 22px;
    margin-bottom: 0;
  }
  .use-case-selector-card__button {
    display: flex;
    flex-direction: column;
  }
  .use-case-selector-card__button .button {
    width: 111px;
    padding: 12px 8px;
  }
  .use-case-selector-card__icon-phone {
    align-self: center;
  }
}
.use-case-selector-cards--christmas-theme .use-case-selector-card--videos .icon,
.use-case-selector-cards--christmas-theme .use-case-selector-card--videos .icon-phone {
  background: url("/assets/application/characters/zazie_with_laptop_christmas.svg") no-repeat;
  background-position: bottom center;
  background-size: contain;
}
.use-case-selector-cards--christmas-theme .use-case-selector-card--assessment-test .icon,
.use-case-selector-cards--christmas-theme .use-case-selector-card--assessment-test .icon-phone {
  background: url("/assets/application/content_structure/niko_christmas.svg") no-repeat;
  background-position: bottom center;
  background-size: 70%;
}
@media only screen and (max-width: 959px) {
  .use-case-selector-cards--christmas-theme .use-case-selector-card--assessment-test .icon,
  .use-case-selector-cards--christmas-theme .use-case-selector-card--assessment-test .icon-phone {
    background-size: 45%;
  }
}
.use-case-selector-cards--christmas-theme .use-case-selector-card--sofa-held .icon,
.use-case-selector-cards--christmas-theme .use-case-selector-card--sofa-held .icon-phone {
  background: url("/assets/application/characters/pommes_with_star_christmas.svg") no-repeat;
  background-position: bottom left;
  background-size: contain;
}
@media only screen and (max-width: 639px) {
  .use-case-selector-cards--christmas-theme .use-case-selector-card--sofa-held .icon,
  .use-case-selector-cards--christmas-theme .use-case-selector-card--sofa-held .icon-phone {
    background-position: bottom center;
  }
}
.use-case-selector-cards--christmas-theme .use-case-selector-card--spelling-trainer .icon,
.use-case-selector-cards--christmas-theme .use-case-selector-card--spelling-trainer .icon-phone {
  background: url("/assets/application/characters/bee_writing_christmas.svg") no-repeat;
  background-position: center;
  background-size: 83%;
}
@media only screen and (max-width: 959px) {
  .use-case-selector-cards--christmas-theme .use-case-selector-card--spelling-trainer .icon,
  .use-case-selector-cards--christmas-theme .use-case-selector-card--spelling-trainer .icon-phone {
    background-size: 70%;
  }
}
@media only screen and (max-width: 639px) {
  .use-case-selector-cards--christmas-theme .use-case-selector-card--spelling-trainer .icon,
  .use-case-selector-cards--christmas-theme .use-case-selector-card--spelling-trainer .icon-phone {
    background-size: 65%;
    background-position: bottom -10px center;
  }
}
.use-case-selector-cards--christmas-theme .use-case-selector-card--vocabulary-trainer .icon,
.use-case-selector-cards--christmas-theme .use-case-selector-card--vocabulary-trainer .icon-phone {
  background: url("/assets/application/content_structure/blobby_vocabulary_christmas.svg") no-repeat;
  background-position: bottom center;
  background-size: contain;
}
@media only screen and (max-width: 639px) {
  .use-case-selector-cards--christmas-theme .use-case-selector-card--vocabulary-trainer .icon,
  .use-case-selector-cards--christmas-theme .use-case-selector-card--vocabulary-trainer .icon-phone {
    background-position: bottom -10px center;
  }
}
.use-case-selector-cards--christmas-theme .use-case-selector-card--verb-trainer .icon,
.use-case-selector-cards--christmas-theme .use-case-selector-card--verb-trainer .icon-phone {
  background: url("/assets/application/content_structure/globby_christmas.svg") no-repeat;
  background-position: center;
  background-size: 80%;
}
@media only screen and (max-width: 959px) {
  .use-case-selector-cards--christmas-theme .use-case-selector-card--verb-trainer .icon,
  .use-case-selector-cards--christmas-theme .use-case-selector-card--verb-trainer .icon-phone {
    background-size: 60%;
  }
}
@media only screen and (max-width: 639px) {
  .use-case-selector-cards--christmas-theme .use-case-selector-card--verb-trainer .icon,
  .use-case-selector-cards--christmas-theme .use-case-selector-card--verb-trainer .icon-phone {
    background-size: 80%;
    background-position: bottom -10px center;
  }
}
.use-case-selector-cards--spring-theme .use-case-selector-card--videos .icon,
.use-case-selector-cards--spring-theme .use-case-selector-card--videos .icon-phone {
  background: url("/assets/application/characters/zazie_with_laptop_spring.svg") no-repeat;
  background-position: 65%;
  background-size: cover;
}
.use-case-selector-cards--spring-theme .use-case-selector-card--assessment-test .icon,
.use-case-selector-cards--spring-theme .use-case-selector-card--assessment-test .icon-phone {
  background: url("/assets/application/content_structure/niko_spring.svg") no-repeat;
  background-position: bottom center;
  background-size: contain;
}
@media only screen and (max-width: 959px) {
  .use-case-selector-cards--spring-theme .use-case-selector-card--assessment-test .icon,
  .use-case-selector-cards--spring-theme .use-case-selector-card--assessment-test .icon-phone {
    background-size: contain;
  }
}
.use-case-selector-cards--spring-theme .use-case-selector-card--sofa-held .icon,
.use-case-selector-cards--spring-theme .use-case-selector-card--sofa-held .icon-phone {
  background: url("/assets/application/characters/pommes_with_star_spring.svg") no-repeat;
  background-position: 66%;
  background-size: cover;
}
@media only screen and (max-width: 639px) {
  .use-case-selector-cards--spring-theme .use-case-selector-card--sofa-held .icon,
  .use-case-selector-cards--spring-theme .use-case-selector-card--sofa-held .icon-phone {
    background-position: bottom center;
  }
}
.use-case-selector-cards--spring-theme .use-case-selector-card--spelling-trainer .icon,
.use-case-selector-cards--spring-theme .use-case-selector-card--spelling-trainer .icon-phone {
  background: url("/assets/application/characters/bee_writing_spring.svg") no-repeat;
  background-position: center 78%;
  background-size: 83%;
}
@media only screen and (max-width: 959px) {
  .use-case-selector-cards--spring-theme .use-case-selector-card--spelling-trainer .icon,
  .use-case-selector-cards--spring-theme .use-case-selector-card--spelling-trainer .icon-phone {
    background-size: 70%;
  }
}
@media only screen and (max-width: 639px) {
  .use-case-selector-cards--spring-theme .use-case-selector-card--spelling-trainer .icon,
  .use-case-selector-cards--spring-theme .use-case-selector-card--spelling-trainer .icon-phone {
    background-size: 65%;
    background-position: bottom -10px center;
  }
}
.use-case-selector-cards--spring-theme .use-case-selector-card--vocabulary-trainer .icon,
.use-case-selector-cards--spring-theme .use-case-selector-card--vocabulary-trainer .icon-phone {
  background: url("/assets/application/content_structure/blobby_vocabulary_spring.svg") no-repeat;
  background-position: center;
  background-size: 140%;
}
@media only screen and (max-width: 959px) {
  .use-case-selector-cards--spring-theme .use-case-selector-card--vocabulary-trainer .icon,
  .use-case-selector-cards--spring-theme .use-case-selector-card--vocabulary-trainer .icon-phone {
    background-size: contain;
  }
}
@media only screen and (max-width: 639px) {
  .use-case-selector-cards--spring-theme .use-case-selector-card--vocabulary-trainer .icon,
  .use-case-selector-cards--spring-theme .use-case-selector-card--vocabulary-trainer .icon-phone {
    background-position: bottom -10px center;
  }
}
.use-case-selector-cards--spring-theme .use-case-selector-card--verb-trainer .icon,
.use-case-selector-cards--spring-theme .use-case-selector-card--verb-trainer .icon-phone {
  background: url("/assets/application/content_structure/globby_spring.svg") no-repeat;
  background-position: center;
  background-size: 80%;
}
@media only screen and (max-width: 959px) {
  .use-case-selector-cards--spring-theme .use-case-selector-card--verb-trainer .icon,
  .use-case-selector-cards--spring-theme .use-case-selector-card--verb-trainer .icon-phone {
    background-size: 60%;
  }
}
@media only screen and (max-width: 639px) {
  .use-case-selector-cards--spring-theme .use-case-selector-card--verb-trainer .icon,
  .use-case-selector-cards--spring-theme .use-case-selector-card--verb-trainer .icon-phone {
    background-size: 80%;
    background-position: bottom -10px center;
  }
}
.use-case-selector-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
@media only screen and (max-width: 959px) {
  .use-case-selector-cards {
    flex-direction: column;
    align-items: center;
    gap: 16px;
  }
}
.use-case-selector-interactive-workbook {
  min-height: 90vh;
  padding-top: 32px;
  padding-bottom: 100px;
  background: #99b7e1;
}
.use-case-selector-interactive-workbook__headline {
  font-weight: bold;
}
.use-case-selector-interactive-workbook__paywall-card {
  background-color: #fdeb99;
  cursor: pointer;
}
.use-case-selector-interactive-workbook__paywall-card .card-title {
  text-indent: -32px;
}
.use-case-selector-interactive-workbook .card {
  width: 493px;
  min-height: 348px;
  margin: 16px;
  border: 0;
  border-radius: 8px;
}
.use-case-selector-interactive-workbook .card .card-image-wrapper {
  position: relative;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.use-case-selector-interactive-workbook .card .card-image-wrapper .card__image {
  height: 150px;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 9/5;
}
.use-case-selector-interactive-workbook .card .card-image-wrapper .card__image--video {
  width: 100%;
}
.use-case-selector-interactive-workbook .card__icon {
  position: absolute;
  top: 133px;
  left: 16px;
  z-index: 1;
}
.use-case-selector-interactive-workbook .card__icon--video-test {
  left: 56px;
  z-index: 0;
}
.use-case-selector-interactive-workbook .card__icon--lernstand {
  left: 56px;
  z-index: 0;
}
.use-case-selector-interactive-workbook .card__new-label {
  position: absolute;
  bottom: 16px;
  right: 16px;
  width: 60px;
  border-radius: 20px;
  background-color: #e35b00;
  color: #fff;
  font-weight: bold;
}
.use-case-selector-interactive-workbook .card .teacher-premium-label {
  position: absolute;
  bottom: 16px;
  right: 16px;
}
.use-case-selector-interactive-workbook .card .card-title {
  font-weight: bold;
}
@media only screen and (max-width: 639px) {
  .use-case-selector-interactive-workbook .card {
    width: 358px;
    min-height: 258px;
    margin-right: 0;
    margin-left: 0;
  }
  .use-case-selector-interactive-workbook .card__icon {
    width: 32px;
    height: 32px;
  }
  .use-case-selector-interactive-workbook .card__icon--video-test {
    top: 144px;
    left: 40px;
  }
  .use-case-selector-interactive-workbook .card__icon--lernstand {
    top: 144px;
    left: 40px;
  }
  .use-case-selector-interactive-workbook .card .teacher-premium-label {
    position: absolute;
    bottom: 8px;
    right: 8px;
  }
}
.content-structure-user-topics {
  padding-top: 64px;
  padding-bottom: 64px;
}
.content-structure-user-topics__item.is-active h3 {
  font-weight: 600;
}
.content-structure-user-topics__item.is-active .icon--arrow-simple {
  transform: rotate(270deg);
}
.content-structure-user-topics__item:not(:last-child) {
  margin-bottom: 16px;
}
.content-structure-user-topics__item-header {
  display: flex;
  align-items: center;
  padding: 24px 32px;
  border-radius: 8px;
  background: #f8f8f8;
  color: #333;
}
.content-structure-user-topics__item-header h3 {
  margin-right: auto;
  margin-bottom: 0;
}
.content-structure-user-topics__item-header > .icon {
  margin-left: 16px;
  transition: transform 0.3s ease;
}
.content-structure-user-topics__item-header:hover {
  color: #333;
}
.content-structure-user-topics__item-content {
  display: none;
  padding: 32px 0 16px;
}
.content-structure-user-topics__item-class-label {
  padding: 4px 12px;
  border-radius: 8px;
  background: #fff;
  color: #999;
  font-size: 14px;
  line-height: 2;
  text-transform: uppercase;
}
.content-structure-user-topics__item-class-label b {
  font-weight: normal;
}
@media only screen and (max-width: 639px) {
  body.is-responsive .content-structure-user-topics {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  body.is-responsive .content-structure-user-topics__item-header {
    padding: 20px 16px 20px 24px;
  }
  body.is-responsive .content-structure-user-topics__item-content {
    padding: 16px 0 0;
  }
}
.sofaheld-for-visitors {
  padding-top: 64px;
  padding-bottom: 64px;
  background: #e6f3f8 url("/assets/application/content_pages/ice.svg") center bottom no-repeat;
  background-size: auto;
}
.sofaheld-for-visitors--margin-bottom {
  margin-bottom: 96px;
}
.sofaheld-for-visitors .card {
  min-height: 306px;
  padding-top: 32px;
  padding-bottom: 32px;
}
.sofaheld-for-visitors__icon {
  display: block;
  width: 168px;
  height: 142px;
  margin: 0 auto;
  margin-bottom: -2px;
  background: url("/assets/application/characters/pommes-with-stars.svg") center center no-repeat;
  background-size: contain;
}
.sofaheld-for-visitors__greeting {
  color: #690;
  font-size: 20px;
}
@media only screen and (max-width: 959px) {
  body.is-responsive .sofaheld-for-visitors {
    background-size: contain;
  }
  body.is-responsive .sofaheld-for-visitors .card {
    min-height: 0;
    min-height: initial;
    margin-bottom: 32px;
  }
  body.is-responsive .sofaheld-for-visitors__greeting {
    font-size: 16px;
  }
}
.interactive-workbook-promotion {
  position: relative;
  display: block;
  width: 891px;
  padding-top: 32px;
  padding-bottom: 40px;
  padding-left: 264px;
  border-radius: 8px;
  background-color: #e6edf8;
}
.interactive-workbook-promotion__image {
  position: absolute;
  top: 55%;
  left: 24px;
  height: 128px;
  transform: translateY(-50%);
}
.interactive-workbook-promotion--free-teacher {
  background-color: #fcf8e6;
}
.interactive-workbook-promotion .h4 {
  color: #333;
  font-size: 1rem;
  font-weight: bold;
}
.interactive-workbook-promotion .h5 {
  color: #333;
  font-size: 1rem;
  font-weight: bold;
}
@media only screen and (max-width: 959px) {
  .interactive-workbook-promotion {
    width: auto;
    padding-right: 16px;
  }
}
@media only screen and (max-width: 639px) {
  .interactive-workbook-promotion {
    margin-top: 32px;
    width: 100%;
    padding: 32px 20px 20px;
    border-radius: 8px;
    text-align: center;
  }
  .interactive-workbook-promotion .h6 {
    color: #333;
    font-weight: bold;
  }
  .interactive-workbook-promotion__image {
    position: absolute;
    top: -64px;
    left: 50%;
    width: 41px;
    transform: translateX(-50%);
  }
}
.sofaheld-teacher-level-selection .page-content {
  min-height: 100vh;
}
.sofaheld-teacher-level-selection__list {
  padding: 32px;
  border-radius: 8px;
  background-color: #d6eb99;
}
.sofaheld-teacher-level-selection__list-item {
  margin: 8px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.sofaheld-teacher-level-selection__list-item.on-touch-hover {
  background: #9c0;
}
.sofaheld-teacher-level-selection__list-item.on-touch-hover .level-cards-list__link,
.sofaheld-teacher-level-selection__list-item.on-touch-hover .level-cards-list__link span {
  color: #fff;
}
.sofaheld-teacher-level-selection__list-item span {
  font-size: 48px;
}
@media only screen and (max-width: 639px) {
  body.is-responsive .sofaheld-teacher-level-selection__list .level-cards-list__link {
    font-size: 16px;
  }
  body.is-responsive .sofaheld-teacher-level-selection__list .level-cards-list__link span {
    font-size: 48px;
  }
}
a.dictation-card {
  color: inherit;
}
a.dictation-card:link, a.dictation-card:visited, a.dictation-card:hover, a.dictation-card:active {
  color: inherit;
}
.dictation-card {
  background-color: #f4e7fb;
}
.dictation-card .card-ribbon {
  position: absolute;
  top: 8px;
  left: -70px;
}
.dictation-card__image {
  background: url("/assets/application/characters/bee_writing.svg") no-repeat;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.dictation-card__subheading {
  color: #333;
  font-size: 14px;
  font-weight: bold;
}
.dictation-card--us-uk {
  height: 140px;
}
.dictation-card--us-uk.content-subject-card {
  flex-basis: 50%;
  flex-grow: 0;
}
.dictation-card--us-uk .dictation-card__headline {
  margin-bottom: 16px;
}
.dictation-card--us-uk .dictation-card__description {
  line-height: 1.5;
}
.dictation-card--winter-theme .dictation-card__image {
  background-image: url("/assets/application/characters/bee_writing_christmas.svg");
}
.dictation-card--spring-theme .dictation-card__image {
  background-image: url("/assets/application/characters/bee_writing_spring.svg");
}
a.kursinsel-banner {
  color: inherit;
}
a.kursinsel-banner:link, a.kursinsel-banner:visited, a.kursinsel-banner:hover, a.kursinsel-banner:active {
  color: inherit;
}
.kursinsel-banner {
  background-color: #e6f3f8;
  overflow: hidden;
}
.kursinsel-banner .card-ribbon {
  position: absolute;
  top: 8px;
  left: -70px;
}
.kursinsel-banner__image {
  background: url(/packs/static/content_structure/kursinsel_card-2f86a092d0af9997a72c.svg) no-repeat;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.practice-topics-paid-teacher-header {
  height: 261px;
  background-color: #e6edf8;
  background-image: url(/packs/static/assets/images/application/practice-app/interactive_workbook_header_desktop-2dc44a20b45472504298.png);
  background-repeat: no-repeat;
  background-position: center;
}
.practice-topics-paid-teacher-header__container {
  position: relative;
}
.practice-topics-paid-teacher-header__navigation-box-container {
  position: absolute;
  top: 24px;
  left: 0;
  width: 313px;
  padding: 24px;
  border-radius: 4px;
  background-color: #006d91;
}
.practice-topics-paid-teacher-header__navigation-box-headline {
  color: #fff;
  font-size: 14px;
  text-transform: uppercase;
}
.practice-topics-paid-teacher-header__dropdown-item {
  display: inline-block;
  width: 100%;
  padding-left: 8px;
  color: #666;
}
.practice-topics-paid-teacher-header__dropdown li:hover {
  border-radius: 4px;
  background-color: #06c;
}
.practice-topics-paid-teacher-header__dropdown li:hover a {
  color: #fff;
}
.practice-topics-paid-teacher-header button {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.practice-topics-paid-teacher-header .dropdown-pane {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  width: 265px;
  font-weight: normal;
}
.practice-topics-paid-teacher-header .dropdown-pane--first {
  top: 103px !important;
  left: 24px !important;
}
.practice-topics-paid-teacher-header .dropdown-pane--last {
  top: 158px !important;
  left: 24px !important;
}
.practice-topics-paid-teacher-header .dropdown-item:hover {
  background-color: #006d91;
  color: #fff;
}
@media only screen and (max-width: 959px) {
  .practice-topics-paid-teacher-header {
    height: 380px;
    margin-top: -80px;
    margin-bottom: 16px;
    background-image: url(/packs/static/assets/images/application/practice-app/interactive_workbook_header_tablet-8ad6e5ecffd0f549e7e3.png);
  }
  .practice-topics-paid-teacher-header__navigation-box-container {
    top: 260px;
    left: 388px;
  }
}
@media only screen and (max-width: 639px) {
  .practice-topics-paid-teacher-header {
    height: 365px;
    margin-top: -15px;
    margin-bottom: 120px;
    background-image: url(/packs/static/assets/images/application/practice-app/interactive_workbook_header_phone-faeafc17a05a794b8d92.png);
  }
  .practice-topics-paid-teacher-header__navigation-box-container {
    top: 290px;
    left: 30px;
  }
}
.practice-topics-teacher-header {
  background-color: #e6edf8;
  overflow: hidden;
}
.practice-topics-teacher-header .grid-container {
  position: relative;
}
.practice-topics-teacher-header .grid-container::before {
  position: absolute;
  top: 0;
  left: -116px;
  content: "";
  height: 72px;
  width: 166px;
  background-image: url(/packs/static/assets/images/application/practice-app/interactive_workbook/header_confetti_1-03f0a0e27a3f7142e363.png);
  background-size: contain;
  background-repeat: no-repeat;
}
.practice-topics-teacher-header .grid-container::after {
  position: absolute;
  top: -54px;
  right: -120px;
  content: "";
  height: 144px;
  width: 318px;
  background-image: url(/packs/static/assets/images/application/practice-app/interactive_workbook/header_confetti_2-2a46471dc1ae57021e7f.png);
  background-size: contain;
  background-repeat: no-repeat;
}
.practice-topics-teacher-header__illustration {
  margin-top: 8px;
  height: 114px;
}
.practice-topics-teacher-header .h1 {
  padding: 32px;
  text-align: left;
  margin-bottom: 0;
}
@media only screen and (max-width: 639px) {
  .practice-topics-teacher-header .h1 {
    padding: 16px;
    font-size: 16px;
    font-weight: bold;
  }
  .practice-topics-teacher-header__illustration {
    height: 64px;
  }
}
.practice-topics-level-selection-header {
  position: relative;
  padding: 16px 0;
  margin-bottom: 60px;
  text-align: center;
  background-color: #99b7e1;
}
.practice-topics-level-selection-header__dropdown-container {
  position: relative;
  display: inline-block;
}
.practice-topics-level-selection-header__dropdown-container button {
  min-height: 56px;
}
.practice-topics-level-selection-header__dropdown-container button span {
  font-weight: bold;
  margin: 0 12px;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-biologie {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/biologie_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #00b500;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-chemie {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/chemie_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #c10070;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-deutsch {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/deutsch_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #e97c33;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-deutsch-als-zweitsprache {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/deutsch-als-zweitsprache_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #99e199;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-geographie {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/geographie_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #e30000;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-geschichte {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/geschichte_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #e38800;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-lern-und-arbeitstechniken {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/lern-und-arbeitstechniken_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #e3e300;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-kreativitaet-und-bewegung {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/kreativitaet-und-bewegung_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #e9a033;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-mathematik {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/mathematik_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #3370c4;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-musik {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/musik_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #e38800;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-physik {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/physik_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #7900b5;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-sachunterricht {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/sachunterricht_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #00b500;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-englisch {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/englisch_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #e93333;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-franzoesisch {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/franzoesisch_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #e3e300;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-latein {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/latein_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #e35b00;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-spanisch {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/spanisch_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #004cb5;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-english-language-arts {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/english-language-arts_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #e97c33;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown-container .sprites-subjects-social-studies {
  background: rgba(1, 1, 1, 0) url("/assets/application/subject_icons/64_new/social-studies_white.svg") center center no-repeat;
  border-radius: 4px;
  background-color: #e30000;
  background-size: contain;
}
.practice-topics-level-selection-header__dropdown li:not(:last-of-type) {
  margin-bottom: 8px;
}
.practice-topics-level-selection-header__dropdown li:hover {
  color: #06c;
}
.practice-topics-level-selection-header__dropdown li:hover a {
  font-weight: bold;
}
.practice-topics-level-selection-header__dropdown i {
  margin-right: 8px;
}
.practice-topics-level-selection-header__dropdown-item {
  display: inline-block;
  width: 100%;
  padding-left: 8px;
  color: #666;
}
.practice-topics-level-selection-header .dropdown-pane {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  width: 100%;
  text-align: left;
  font-weight: normal;
}
.practice-topics-level-selection-header .dropdown-pane--first {
  top: 56px !important;
  left: 0 !important;
  min-width: 206px;
}
.practice-topics-level-selection-header .dropdown-pane--last {
  top: 56px !important;
  left: 0 !important;
}
@media only screen and (max-width: 639px) {
  .practice-topics-level-selection-header {
    margin-bottom: 24px;
  }
  .practice-topics-level-selection-header .dropdown-pane {
    top: 46px !important;
  }
  .practice-topics-level-selection-header .dropdown-pane--first {
    min-width: 198px;
  }
  .practice-topics-level-selection-header__dropdown-container button {
    min-height: 48px;
    padding: 6px 4px;
  }
  .practice-topics-level-selection-header__dropdown-item-icon {
    height: 24px;
    width: 24px;
  }
}
.chatbot-consent-banner {
  max-width: 64rem;
  margin: 2.5rem;
  padding: 2rem 2.5rem;
  border-radius: 1rem;
  background-color: #4b33c4;
  color: #fff;
}
.chatbot-consent-banner__character-container {
  flex-shrink: 0;
  width: 4.5rem;
}
.chatbot-consent-banner__character-container img {
  position: relative;
  transform: translate(-1.5rem, 2rem);
  scale: 2;
}
.chatbot-consent-banner__label {
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.25rem 0.25rem 0;
  border-radius: 0.25rem;
  background-color: #ee9d66;
  color: #333;
  font-weight: 700;
  text-transform: uppercase;
}
.chatbot-consent-banner__headline span {
  font-weight: 400;
}
.chatbot-consent-banner__benefits {
  margin-bottom: 1rem;
}
.chatbot-consent-banner__benefits li {
  margin-left: 1.5rem;
  list-style: disc;
}
.chatbot-consent-banner__text {
  font-family: Helvetica, Arial, sans-serif;
  color: #fff;
  max-width: 95%;
  margin-bottom: 1rem;
  line-height: 1.75rem;
}
.chatbot-consent-banner__text a {
  color: #fde166;
  text-decoration: underline;
}
.chatbot-consent-banner__buttons .white {
  margin-right: 0.75rem;
}
.chatbot-consent-banner__buttons a {
  margin-left: 31rem;
  color: #fff;
  font-weight: 700;
  text-decoration: underline;
}
.chatbot-consent-banner__text a:hover {
  color: #fbcd00;
}
.chatbot-consent-banner__text-small {
  margin-bottom: 1.5rem;
}
@media only screen and (max-width: 959px) {
  .chatbot-consent-banner {
    margin: 1.5rem;
    padding: 1.5rem;
  }
  .chatbot-consent-banner__character-container {
    width: 3.5rem;
  }
  .chatbot-consent-banner__character-container img {
    transform: translate(-1rem, 2rem);
  }
  .chatbot-consent-banner__label {
    font-size: 0.875rem;
    padding: 0.25rem;
    margin-bottom: 0.5rem;
  }
  .chatbot-consent-banner__headline {
    font-size: 1rem;
    line-height: 1.375rem;
  }
  .chatbot-consent-banner__benefits {
    font-size: 0.875rem;
  }
  .chatbot-consent-banner__text {
    width: 100%;
    margin-bottom: 1rem;
    line-height: 1.5rem;
    font-size: 0.875rem;
  }
}
@media only screen and (max-width: 639px) {
  .chatbot-consent-banner {
    margin: 1.5rem 0;
    padding: 1.5rem 1rem;
  }
  .chatbot-consent-banner__benefits {
    margin-bottom: 0.5rem;
  }
  .chatbot-consent-banner__text-small {
    margin-bottom: 1.5rem;
  }
  .chatbot-consent-banner__buttons .yellow {
    margin-bottom: 1rem;
  }
}
.content-subect-selector .subject-cards-list {
  display: flex;
  flex-wrap: wrap;
  width: 860px;
}
.content-subect-selector .subject-cards-list__card {
  width: 200px;
}
.chatbot-feedback-form-popup {
  overflow-y: visible;
  width: 32rem;
}
.chatbot-feedback-form-popup__textarea::-moz-placeholder {
  font-size: 0.875rem;
}
.chatbot-feedback-form-popup__textarea::placeholder {
  font-size: 0.875rem;
}
.chatbot-feedback-form-popup__confirmation-checkmark {
  font-size: 46px;
  color: #9c0;
  border-radius: 48px;
  background-color: #fff;
  margin-top: -3.75rem;
  margin-bottom: 1.5rem;
}
.chatbot-feedback-form-popup__sofabuddy-image {
  width: 10.625rem;
}
@media only screen and (max-width: 639px) {
  .chatbot-feedback-form-popup {
    width: 100%;
  }
  .chatbot-feedback-form-popup__headline {
    font-size: 1.5rem;
  }
  .chatbot-feedback-form-popup__confirmation-checkmark {
    margin-top: 1.5rem;
  }
}
.assessment-test-banner {
  background-color: #fcf8e6;
}
.assessment-test-banner__image-container {
  background-image: url(/packs/static/content_structure/assessment_test_banner_background-7d79054ef1be85abd6ac.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.assessment-test-banner__image {
  background-image: url(/packs/static/content_structure/niko_reading_small-e8bb02a7e1957fdb458f.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.assessment-test-banner--winter-theme .assessment-test-banner__image {
  background-image: url("/assets/application/content_structure/niko_christmas.svg");
  background-size: 80px;
}
.assessment-test-banner--spring-theme .assessment-test-banner__image {
  background-image: url("/assets/application/content_structure/niko_spring.svg");
  background-size: 80px;
}
@media only screen and (max-width: 639px) {
  .assessment-test-banner__image-container {
    background-image: url("/assets/application/content_structure/assessment_test_banner_phone_background.svg");
    background-repeat: no-repeat;
    background-size: contain;
  }
}
.sofaheld-worksheets-banner {
  background-color: #e6edf8;
}
.sofaheld-worksheets-banner__image {
  background-image: url(/packs/static/content_structure/pommes_with_paper-66afdb860cf3338f4019.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.advent-calendar-banner--one {
  background-color: #f5fae6;
}
.advent-calendar-banner--two {
  background-color: #e6f3f8;
}
.advent-calendar-banner__image {
  background: url(/packs/static/content_structure/mikka_small-70d47b736cf46777b2b0.svg) no-repeat;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.spring-calendar-banner {
  background-color: #e6f3f8;
}
.spring-calendar-banner__image {
  background: url(/packs/static/content_structure/pommes_airballoon_spring-04f5837cefd93f6db3f5.svg) no-repeat;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.sofabuddy-card {
  container: sofabuddy-card/inline-size;
  background-color: #fcf3e6;
}
.sofabuddy-card__image {
  position: absolute;
  top: -1.5rem;
  left: -5rem;
  width: 148px;
  height: 192px;
  transform: rotate(90deg);
  background-image: url(/packs/static/assets/images/application/characters/sofabuddy_hands_up-8e06504a5d37832e64ab.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.sofabuddy-card__content-container {
  height: 100%;
}
.sofabuddy-card__button-container {
  display: flex;
  margin-left: 9.25rem;
}
@container sofabuddy-card (max-width: 580px) {
  .sofabuddy-card__button-container {
    display: none;
  }
}
@media only screen and (max-width: 639px) {
  .sofabuddy-card__image {
    height: 162px;
  }
}
.schoolbook-selection-popup__subject-container {
  display: flex;
  gap: 1rem;
}
.schoolbook-selection-popup__subject {
  margin: 0;
}
.schoolbook-selection-popup__info-box-container {
  border-radius: 0.5rem;
  background-color: #e6f3f8;
  padding: 0.75rem;
}
@media only screen and (max-width: 959px) {
  .schoolbook-selection-popup__button {
    align-self: flex-end;
  }
}
@media only screen and (max-width: 639px) {
  .schoolbook-selection-popup {
    display: flex;
    flex-direction: column;
  }
  .schoolbook-selection-popup__button {
    width: 100%;
  }
}
.schoolbook-search-dropdown {
  position: relative;
  display: inline-block;
  width: 100%;
  z-index: 1;
}
.schoolbook-search-dropdown button {
  padding: 1rem;
  border: 1px solid #999;
  text-align: left;
  cursor: pointer;
}
.schoolbook-search-dropdown__search-field {
  position: relative;
  box-sizing: border-box;
  background-image: url(/packs/static/svgs/search-6fe5b12351e9207fec80.svg);
  background-repeat: no-repeat;
  background-position: 97% 7px;
  font-size: 16px;
}
.schoolbook-search-dropdown__options {
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  box-shadow: 0 8px 24px -12px rgba(0, 0, 0, 0.25);
  display: none;
  width: 100%;
  max-height: 224px;
  background-color: #fff;
  overflow-y: auto;
}
.schoolbook-search-dropdown__option {
  padding: 16px;
  font-weight: bold;
  text-decoration: none;
  cursor: pointer;
  color: #666;
}
.schoolbook-search-dropdown__option span {
  color: #666;
}
.schoolbook-search-dropdown__option:hover, .schoolbook-search-dropdown__option:focus {
  background-color: #d6eb99;
}
.schoolbook-search-dropdown__option:last-of-type {
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
}
@media only screen and (max-width: 639px) {
  .schoolbook-search-dropdown__search-field {
    width: 100%;
  }
}
.learning-groups-info-box,
.school-directory-classes-show-info-box {
  display: flex;
  align-items: center;
  margin-top: 40px;
  padding: 24px 40px;
  border-radius: 24px;
  background-color: #fcf8e6;
}
.learning-groups-info-box__image,
.school-directory-classes-show-info-box__image {
  margin-right: 24px;
}
.learning-groups-info-box__image img,
.school-directory-classes-show-info-box__image img {
  width: 80px;
}
.learning-groups-info-box__download-button .button,
.school-directory-classes-show-info-box__download-button .button {
  margin-left: 24px;
}
@media only screen and (max-width: 959px) {
  .learning-groups-info-box,
  .school-directory-classes-show-info-box {
    padding: 16px 40px;
  }
  .learning-groups-info-box__headline .h4,
  .school-directory-classes-show-info-box__headline .h4 {
    margin: 0;
  }
  .learning-groups-info-box__download-button .button,
  .school-directory-classes-show-info-box__download-button .button {
    height: 32px;
    margin-left: 16px;
    padding: 8px 16px;
    font-size: 14px;
  }
}
@media only screen and (max-width: 639px) {
  .learning-groups-info-box,
  .school-directory-classes-show-info-box {
    flex-wrap: wrap;
    margin-top: 16px;
    text-align: center;
  }
  .learning-groups-info-box__headline,
  .school-directory-classes-show-info-box__headline {
    margin: 0;
  }
  .learning-groups-info-box__download-button,
  .school-directory-classes-show-info-box__download-button {
    margin: 16px auto 0;
  }
}
.features-module {
  position: relative;
  padding: 64px 0;
  text-align: center;
}
.features-module h3 {
  font-size: 32px;
}
.features-module__image {
  position: absolute;
  bottom: 0;
  left: -80px;
  width: 288px;
  height: 262px;
  margin-right: 16px;
  margin-left: -56px;
}
.features-module__button {
  width: 258px;
  height: 50px;
  margin-top: 24px;
  padding: 12px 15px;
  font-size: 18px;
}
.features-module__list {
  display: flex;
  position: relative;
  justify-content: center;
  text-align: center;
}
.features-module__item {
  display: flex;
  position: relative;
  left: 0;
  flex-direction: column;
  justify-content: flex-start;
  width: 150px;
  height: 150px;
  z-index: 1;
  mix-blend-mode: multiply;
}
.features-module__item:not(:first-of-type) {
  margin-left: -15px;
}
.features-module__item:last-of-type {
  margin-right: 0;
}
.features-module__item::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  border-radius: 50%;
  content: "";
  z-index: -1;
}
.features-module__item--sofaheld::before {
  background-color: #e6edf8;
}
.features-module__item--sofaheld .features-module__quantity {
  color: #283f91;
}
.features-module__item--vocabulary_trainer::before {
  background-color: #f2e6f8;
}
.features-module__item--vocabulary_trainer .features-module__quantity {
  color: #7900b5;
}
.features-module__item--videos::before {
  background-color: #e6f8e6;
}
.features-module__item--videos .features-module__quantity {
  color: #009100;
}
.features-module__item--exercises::before {
  background-color: #fffae6;
}
.features-module__item--exercises .features-module__quantity {
  color: #e3b500;
}
.features-module__item--worksheet::before {
  background-color: #fce6e6;
}
.features-module__item--worksheet .features-module__quantity {
  color: #b60000;
}
.features-module__item--chat::before {
  background-color: #e6f3f8;
}
.features-module__item--chat .features-module__quantity {
  color: #006d91;
}
.features-module__quantity {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  margin-top: 20px;
  font-size: 32px;
  font-weight: 600;
}
.features-module__text {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  margin-top: -4px;
  color: #333;
  font-size: 16px;
  font-weight: bold;
}
@media only screen and (max-width: 959px) {
  .features-module {
    position: relative;
    padding-top: 24px;
    padding-bottom: 24px;
    text-align: center;
  }
  .features-module h4 {
    font-size: 18px;
    text-align: center;
  }
  .features-module__image {
    position: relative;
    bottom: -26px;
    left: 0;
    width: 108px;
    height: 98px;
    margin-right: 16px;
    margin-left: -56px;
  }
  .features-module__button {
    width: 219px;
    margin-top: 24px;
    padding: 12px 15px;
    font-size: 16px;
  }
  .features-module__list {
    display: grid;
    grid-template-columns: repeat(3, auto);
    grid-gap: 10px;
  }
  .features-module__item {
    width: 120px;
    height: 120px;
  }
  .features-module__item:not(:first-of-type) {
    margin-left: auto;
  }
  .features-module__item:last-of-type {
    margin-right: auto;
  }
  .features-module__quantity {
    margin-top: 15px;
    font-size: 28px;
  }
  .features-module__text {
    font-size: 12px;
  }
  .features-module__subtext {
    margin-top: 8px;
  }
}
@media only screen and (max-width: 639px) {
  .features-module h3 {
    text-align: center;
  }
  .features-module__image {
    position: relative;
    bottom: -24px;
    width: 108px;
    height: 98px;
    margin-right: 8px;
    margin-left: -56px;
  }
  .features-module__button {
    width: 219px;
    margin-top: 8px;
    padding: 11px 15px;
  }
  .features-module__subtext {
    margin-top: 8px;
  }
  .features-module__item {
    width: 80px;
    height: 80px;
  }
  .features-module__quantity {
    font-size: 14px;
  }
  .features-module__text {
    font-size: 8px;
  }
}
.card-ribbon {
  width: 192px;
  padding: 8px 62px;
  transform: rotate(-45deg);
  background-color: #e35b00;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
}
/*!**************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./app/javascript/application/layouts/_neon_blink_animation.sass ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************/
.neon-blink-green {
  color: #add633;
  animation: neon-blink-green 2s ease-in-out infinite;
}

.neon-blink-raspberry {
  color: #c10070;
  animation: neon-blink-raspberry 2s ease-in-out infinite;
}

.neon-blink-white {
  color: #fff;
  animation: neon-blink-white 2s ease-in-out infinite;
}

@keyframes neon-blink-green {
  0% {
    text-shadow: none;
  }
  50% {
    text-shadow: 5px 0 20px #02b111, 5px 5px 20px #02b111, 5px -5px 20px #02b111, -5px 5px 20px #02b111, -5px -5px 20px #02b111;
  }
  100% {
    text-shadow: none;
  }
}

@keyframes neon-blink-raspberry {
  0% {
    text-shadow: none;
  }
  50% {
    text-shadow: 5px 0 20px #c10070, 5px 5px 20px #c10070, 5px -5px 20px #c10070, -5px 5px 20px #c10070, -5px -5px 20px #c10070;
  }
  100% {
    text-shadow: none;
  }
}

@keyframes neon-blink-white {
  0% {
    text-shadow: none;
  }
  50% {
    text-shadow: 0 0 10px #fff;
  }
  100% {
    text-shadow: none;
  }
}

/*# sourceMappingURL=content_structure-2f3c8f21.css.map*/