.design-system-page:not(.design-system-index-page) .icon-sofatutor{position:absolute;top:46px;right:35px}.design-system-page:not(.design-system-index-page) .icon-sofatutor path:hover{transition:fill .4s ease;fill:#fff}.design-system-page .page-content{position:relative;padding:128px 0 64px}.design-system-page--overlay{position:fixed;top:0;left:0;display:none;width:100%;height:100%;background-color:rgba(0,0,0,.5);z-index:10000000}.design-system-page .headline-bordered{margin-top:2rem;margin-bottom:2rem;border-bottom:2px solid #9c0;font-weight:bold}.design-system-page .button-examples .cell{padding-top:2rem}.design-system-page .topic-content{color:#999}.design-system-page .code-block{display:block;margin:16px 16px 0;padding:8px;font-size:12px;overflow:auto}.design-system-header{position:fixed;left:0;right:0;z-index:10000002}.design-system-header__content{margin-bottom:64px;padding-top:64px;padding-bottom:64px;background-color:#f8f8f8}.design-system-header__content>.grid-container{position:relative}.design-system-header .title-bar{padding-top:40px;padding-bottom:40px}.design-system-header .title-bar__menu{display:none;position:relative;top:3px;right:0;left:0;margin-right:24px;cursor:pointer}.design-system-header .title-bar .h2{position:relative;margin-bottom:0}.design-system-header .title-bar .beaver-character{position:absolute;bottom:-7px;right:30px;width:30px;transform:rotate(270deg)}.design-system-navigation{position:absolute;top:128px;display:block;width:224px;height:100%;background-color:#f8f8f8;white-space:nowrap;z-index:10000001}.design-system-navigation__menu{position:sticky;top:128px;padding-top:32px}.design-system-navigation .navigation-link{padding-left:12px;color:#666}.design-system-navigation .navigation-link:hover{color:#999}.design-system-navigation .navigation-link.is-current{position:relative;color:#666}.design-system-navigation .navigation-link.is-current:nth-of-type(4){margin-bottom:0}.design-system-navigation .navigation-link.is-current .h4{color:#333;font-weight:bold}.design-system-navigation .navigation-link.is-current .h4~ul{margin-top:16px}.design-system-navigation .navigation-link.is-current .h4::before{position:absolute;top:4px;left:0;display:block;width:4px;height:28px;background:#9c0;content:""}.design-system-navigation .navigation-link.is-current>.navigation-link__text a{color:#666;font-weight:bold}.design-system-navigation .navigation-link .navigation-link__text{font-size:14px}.design-system-navigation .navigation-link .navigation-link__text a{color:#666}.design-system-navigation .navigation-link .navigation-link__text a.is-active{font-weight:bold}.design-system-navigation .navigation-link .navigation-link__text a:hover{color:#999}.design-system-navigation .navigation-link .navigation-link__text--small{padding:4px;font-size:12px}.design-system-navigation .navigation-link .navigation-link__text--small a{color:#666}.design-system-navigation .navigation-link .navigation-link__text--small a.is-active{font-weight:bold}.design-system-navigation .navigation-link .navigation-link__text--small a:hover{color:#999}.design-system-navigation .navigation-link .submenu-toggle{display:none}.design-system-page-intro{text-align:left}.design-system-page-intro__content{font-family:"Open Sans",Helvetica,Arial,sans-serif;margin-bottom:128px;font-size:18px}.design-system-page-intro h1{text-align:left}.design-system-topic-intro__content{margin-bottom:68px}.design-system-components-page .box-panel--green .box-feature-content__headline{padding:20px}.design-system-typography-page h1{text-align:left}.design-system-motion-page .space-128{margin-bottom:128px}.design-system-motion-page .image-float-right{float:right}.design-system-motion-page .image-float-left{float:left}.design-system-motion-page .motion-container{display:flex;align-items:center;height:332px;background-color:#f8f8f8}.design-system-motion-page b{color:#666}.design-system-motion-page__demo--slide{transition-delay:0s;transition-property:background-color;transition-duration:.24s}.design-system-motion-page__demo--swing .progress--swing-demo{width:200px}.design-system-motion-page__demo--swing .progress--swing-demo .progress-meter{transition-delay:0s;transition-property:width;transition-duration:.96s;transition-timing-function:cubic-bezier(0.8, 0, 0.3, 1)}.design-system-motion-page__demo--swing.reset-motion .progress--swing-demo .progress-meter{width:80% !important}.design-system-motion-page__demo--springrocker{font-size:48px}.design-system-motion-page__demo--springrocker.reset-motion{animation-name:springrocker-design-system-demo;animation-timing-function:cubic-bezier(0.4, 0.4, 0.4, 1);animation-delay:0s;animation-duration:.72s}@keyframes springrocker-design-system-demo{0%{transform:scale(1)}16.6%{transform:scale(0.9)}33.3%{transform:scale(1.05)}50%{transform:scale(1)}66.6%{transform:scale(1.05)}100%{transform:scale(1)}}@media screen and (max-width: 1639px){.design-system-navigation{display:none;top:-128px;width:168px;min-width:auto;height:103%}.design-system-header .title-bar__menu{display:block}}.design-system-index-page{background-color:#690}.design-system-index-page .page-content{background-image:linear-gradient(#9c0, #690)}.design-system-index-page .icon-sofatutor{display:block;margin-top:32px;margin-bottom:160px}.design-system-index-page .grid-x{position:relative}.design-system-index-page h1,.design-system-index-page .subheader{color:#fff}.design-system-index-page h1{margin-bottom:0}.design-system-index-page .subheader{max-width:614px;margin:0 auto 32px}.design-system-index-page .text-small{padding-top:5px}.design-system-index-page .koala-character{position:absolute;bottom:-43px;left:-4px;z-index:1}.design-system-index-page .beaver-character{position:absolute;bottom:-10px;right:-58px}@media only screen and (max-width: 959px){.design-system-index-page.is-responsive .icon-sofatutor{margin-bottom:64px}}.design-system-card{position:relative;margin-bottom:1rem;overflow:visible}.design-system-card__headline{padding-top:16px;font-weight:bold;z-index:1}.design-system-card__list{padding:15px 0}.design-system-global-page h3{padding-top:2.5rem}.design-system-global-page .card{margin-bottom:2rem}.design-system-global-page .card.has-tip{border-bottom:1px solid #e1e1e1}.design-system-global-page .card--tints-main{display:block;width:128px;margin-bottom:0}.design-system-global-page .card--tints-main .card-divider{height:96px}.design-system-global-page .card--tints-main .card-divider--green{background-color:#00b500}.design-system-global-page .card--tints-main .card-divider--blue{background-color:#0088b5}.design-system-global-page .card--tints-main .card-divider--indigo{background-color:#004cb5}.design-system-global-page .card--tints-main .card-divider--deep-blue{background-color:#1e00b5}.design-system-global-page .card--tints-main .card-divider--purple{background-color:#7900b5}.design-system-global-page .card--tints-main .card-divider--raspberry{background-color:#c10070}.design-system-global-page .card--tints-main .card-divider--red{background-color:#e30000}.design-system-global-page .card--tints-main .card-divider--deep-orange{background-color:#e35b00}.design-system-global-page .card--tints-main .card-divider--orange{background-color:#e38800}.design-system-global-page .card--tints-main .card-divider--amber{background-color:#e3b500}.design-system-global-page .card--tints-main .card-divider--lime{background-color:#e3e300}.design-system-global-page .card--tints-main .card-divider--yellow{background-color:#fbcd00}.design-system-global-page .card--tints-main .card-section{height:84px}.design-system-global-page .card--tints-shades{display:inline-block;width:96px;margin-bottom:0;border-right:0 solid rgba(0,0,0,0);border-left:0 solid rgba(0,0,0,0);border-radius:0;box-shadow:none}.design-system-global-page .card--tints-shades:first-of-type{border-left:1px solid #e1e1e1;border-top-left-radius:8px;border-bottom-left-radius:8px}.design-system-global-page .card--tints-shades:last-of-type{border-right:1px solid #e1e1e1;border-top-right-radius:8px;border-bottom-right-radius:8px}.design-system-global-page .card--tints-shades .card-section{height:84px}.design-system-global-page .card--tints-shades .card-divider{height:96px}.design-system-global-page .card--tints-shades .card-divider--sofatutor-green-d4{background-color:#4d6600}.design-system-global-page .card--tints-shades .card-divider--sofatutor-green-d3{background-color:#5c7a00}.design-system-global-page .card--tints-shades .card-divider--sofatutor-green-d2{background-color:#6b8f00}.design-system-global-page .card--tints-shades .card-divider--sofatutor-green-d1{background-color:#7aa300}.design-system-global-page .card--tints-shades .card-divider--sofatutor-green-l1{background-color:#add633}.design-system-global-page .card--tints-shades .card-divider--sofatutor-green-l2{background-color:#c2e066}.design-system-global-page .card--tints-shades .card-divider--sofatutor-green-l3{background-color:#d6eb99}.design-system-global-page .card--tints-shades .card-divider--sofatutor-green-l4{background-color:#f5fae6}.design-system-global-page .card--tints-shades .card-divider--sofatutor-dark-green-d4{background-color:#334d00}.design-system-global-page .card--tints-shades .card-divider--sofatutor-dark-green-d3{background-color:#3d5c00}.design-system-global-page .card--tints-shades .card-divider--sofatutor-dark-green-d2{background-color:#476b00}.design-system-global-page .card--tints-shades .card-divider--sofatutor-dark-green-d1{background-color:#527a00}.design-system-global-page .card--tints-shades .card-divider--sofatutor-dark-green-l1{background-color:#85ad33}.design-system-global-page .card--tints-shades .card-divider--sofatutor-dark-green-l2{background-color:#a3c266}.design-system-global-page .card--tints-shades .card-divider--sofatutor-dark-green-l3{background-color:#c2d699}.design-system-global-page .card--tints-shades .card-divider--sofatutor-dark-green-l4{background-color:#f0f5e6}.design-system-global-page .card--tints-shades .card-divider--green-d4{background-color:#005b00}.design-system-global-page .card--tints-shades .card-divider--green-d3{background-color:#006d00}.design-system-global-page .card--tints-shades .card-divider--green-d2{background-color:#007f00}.design-system-global-page .card--tints-shades .card-divider--green-d1{background-color:#009100}.design-system-global-page .card--tints-shades .card-divider--green-l1{background-color:#33c433}.design-system-global-page .card--tints-shades .card-divider--green-l2{background-color:#66d366}.design-system-global-page .card--tints-shades .card-divider--green-l3{background-color:#99e199}.design-system-global-page .card--tints-shades .card-divider--green-l4{background-color:#e6f8e6}.design-system-global-page .card--tints-shades .card-divider--blue-d4{background-color:#00445b}.design-system-global-page .card--tints-shades .card-divider--blue-d3{background-color:#00526d}.design-system-global-page .card--tints-shades .card-divider--blue-d2{background-color:#005f7f}.design-system-global-page .card--tints-shades .card-divider--blue-d1{background-color:#006d91}.design-system-global-page .card--tints-shades .card-divider--blue-l1{background-color:#33a0c4}.design-system-global-page .card--tints-shades .card-divider--blue-l2{background-color:#66b8d2}.design-system-global-page .card--tints-shades .card-divider--blue-l3{background-color:#99cfe1}.design-system-global-page .card--tints-shades .card-divider--blue-l4{background-color:#e6f3f8}.design-system-global-page .card--tints-shades .card-divider--indigo-d4{background-color:#00265b}.design-system-global-page .card--tints-shades .card-divider--indigo-d3{background-color:#002e6d}.design-system-global-page .card--tints-shades .card-divider--indigo-d2{background-color:#00357f}.design-system-global-page .card--tints-shades .card-divider--indigo-d1{background-color:#003d91}.design-system-global-page .card--tints-shades .card-divider--indigo-l1{background-color:#3370c4}.design-system-global-page .card--tints-shades .card-divider--indigo-l2{background-color:#6694d3}.design-system-global-page .card--tints-shades .card-divider--indigo-l3{background-color:#99b7e1}.design-system-global-page .card--tints-shades .card-divider--indigo-l4{background-color:#e6edf8}.design-system-global-page .card--tints-shades .card-divider--deep-blue-d4{background-color:#0f005b}.design-system-global-page .card--tints-shades .card-divider--deep-blue-d3{background-color:#12006d}.design-system-global-page .card--tints-shades .card-divider--deep-blue-d2{background-color:#15007f}.design-system-global-page .card--tints-shades .card-divider--deep-blue-d1{background-color:#180091}.design-system-global-page .card--tints-shades .card-divider--deep-blue-l1{background-color:#4b33c4}.design-system-global-page .card--tints-shades .card-divider--deep-blue-l2{background-color:#7866d3}.design-system-global-page .card--tints-shades .card-divider--deep-blue-l3{background-color:#a599e1}.design-system-global-page .card--tints-shades .card-divider--deep-blue-l4{background-color:#e9e6f8}.design-system-global-page .card--tints-shades .card-divider--purple-d4{background-color:#3d005b}.design-system-global-page .card--tints-shades .card-divider--purple-d3{background-color:#49006d}.design-system-global-page .card--tints-shades .card-divider--purple-d2{background-color:#55007f}.design-system-global-page .card--tints-shades .card-divider--purple-d1{background-color:#610091}.design-system-global-page .card--tints-shades .card-divider--purple-l1{background-color:#9433c4}.design-system-global-page .card--tints-shades .card-divider--purple-l2{background-color:#af66d3}.design-system-global-page .card--tints-shades .card-divider--purple-l3{background-color:#c999e1}.design-system-global-page .card--tints-shades .card-divider--purple-l4{background-color:#f2e6f8}.design-system-global-page .card--tints-shades .card-divider--raspberry-d4{background-color:#610038}.design-system-global-page .card--tints-shades .card-divider--raspberry-d3{background-color:#740043}.design-system-global-page .card--tints-shades .card-divider--raspberry-d2{background-color:#87004e}.design-system-global-page .card--tints-shades .card-divider--raspberry-d1{background-color:#9a005a}.design-system-global-page .card--tints-shades .card-divider--raspberry-l1{background-color:#cd338d}.design-system-global-page .card--tints-shades .card-divider--raspberry-l2{background-color:#da66a9}.design-system-global-page .card--tints-shades .card-divider--raspberry-l3{background-color:#e699c6}.design-system-global-page .card--tints-shades .card-divider--raspberry-l4{background-color:#f9e6f1}.design-system-global-page .card--tints-shades .card-divider--red-d4{background-color:#720000}.design-system-global-page .card--tints-shades .card-divider--red-d3{background-color:#800}.design-system-global-page .card--tints-shades .card-divider--red-d2{background-color:#9f0000}.design-system-global-page .card--tints-shades .card-divider--red-d1{background-color:#b60000}.design-system-global-page .card--tints-shades .card-divider--red-l1{background-color:#e93333}.design-system-global-page .card--tints-shades .card-divider--red-l2{background-color:#e66}.design-system-global-page .card--tints-shades .card-divider--red-l3{background-color:#f49999}.design-system-global-page .card--tints-shades .card-divider--red-l4{background-color:#fce6e6}.design-system-global-page .card--tints-shades .card-divider--deep-orange-d4{background-color:#722e00}.design-system-global-page .card--tints-shades .card-divider--deep-orange-d3{background-color:#883700}.design-system-global-page .card--tints-shades .card-divider--deep-orange-d2{background-color:#9f4000}.design-system-global-page .card--tints-shades .card-divider--deep-orange-d1{background-color:#b64900}.design-system-global-page .card--tints-shades .card-divider--deep-orange-l1{background-color:#e97c33}.design-system-global-page .card--tints-shades .card-divider--deep-orange-l2{background-color:#ee9d66}.design-system-global-page .card--tints-shades .card-divider--deep-orange-l3{background-color:#f4bd99}.design-system-global-page .card--tints-shades .card-divider--deep-orange-l4{background-color:#fcefe6}.design-system-global-page .card--tints-shades .card-divider--orange-d4{background-color:#724400}.design-system-global-page .card--tints-shades .card-divider--orange-d3{background-color:#885200}.design-system-global-page .card--tints-shades .card-divider--orange-d2{background-color:#9f5f00}.design-system-global-page .card--tints-shades .card-divider--orange-d1{background-color:#b66d00}.design-system-global-page .card--tints-shades .card-divider--orange-l1{background-color:#e9a033}.design-system-global-page .card--tints-shades .card-divider--orange-l2{background-color:#eeb866}.design-system-global-page .card--tints-shades .card-divider--orange-l3{background-color:#f4cf99}.design-system-global-page .card--tints-shades .card-divider--orange-l4{background-color:#fcf3e6}.design-system-global-page .card--tints-shades .card-divider--amber-d4{background-color:#725b00}.design-system-global-page .card--tints-shades .card-divider--amber-d3{background-color:#886d00}.design-system-global-page .card--tints-shades .card-divider--amber-d2{background-color:#9f7f00}.design-system-global-page .card--tints-shades .card-divider--amber-d1{background-color:#b69100}.design-system-global-page .card--tints-shades .card-divider--amber-l1{background-color:#e9c433}.design-system-global-page .card--tints-shades .card-divider--amber-l2{background-color:#eed366}.design-system-global-page .card--tints-shades .card-divider--amber-l3{background-color:#f4e199}.design-system-global-page .card--tints-shades .card-divider--amber-l4{background-color:#fcf8e6}.design-system-global-page .card--tints-shades .card-divider--lime-d4{background-color:#727200}.design-system-global-page .card--tints-shades .card-divider--lime-d3{background-color:#880}.design-system-global-page .card--tints-shades .card-divider--lime-d2{background-color:#9f9f00}.design-system-global-page .card--tints-shades .card-divider--lime-d1{background-color:#b6b600}.design-system-global-page .card--tints-shades .card-divider--lime-l1{background-color:#e9e933}.design-system-global-page .card--tints-shades .card-divider--lime-l2{background-color:#ee6}.design-system-global-page .card--tints-shades .card-divider--lime-l3{background-color:#f4f499}.design-system-global-page .card--tints-shades .card-divider--lime-l4{background-color:#fcfce6}.design-system-global-page .card--tints-shades .card-divider--yellow-d4{background-color:#7e6700}.design-system-global-page .card--tints-shades .card-divider--yellow-d3{background-color:#977b00}.design-system-global-page .card--tints-shades .card-divider--yellow-d2{background-color:#b09000}.design-system-global-page .card--tints-shades .card-divider--yellow-d1{background-color:#c9a400}.design-system-global-page .card--tints-shades .card-divider--yellow-l1{background-color:#fcd733}.design-system-global-page .card--tints-shades .card-divider--yellow-l2{background-color:#fde166}.design-system-global-page .card--tints-shades .card-divider--yellow-l3{background-color:#fdeb99}.design-system-global-page .card--tints-shades .card-divider--yellow-l4{background-color:#fffae6}.design-system-global-page .card-divider,.design-system-global-page .card-section{height:8rem}.design-system-global-page .card-divider--sofatutor-green{background-color:#9c0}.design-system-global-page .card-divider--sofatutor-dark-green{background-color:#690}.design-system-global-page .card-divider--primary{background-color:#06c}.design-system-global-page .card-divider--primary-bright{background-color:#09f}.design-system-global-page .card-divider--secondary{background-color:#ccc}.design-system-global-page .card-divider--success{background-color:#d6eb99}.design-system-global-page .card-divider--warning{background-color:#fdeb99}.design-system-global-page .card-divider--alert{background-color:#fce3e3}.design-system-global-page .card-divider--white{background-color:#fff}.design-system-global-page .card-divider--light-gray{background-color:#f8f8f8}.design-system-global-page .card-divider--medium-gray{background-color:#e6e8e5}.design-system-global-page .card-divider--dark-gray{background-color:#666}.design-system-global-page .card-divider--gray{background-color:#999}.design-system-global-page .card-divider--black{background-color:#333}.design-system-global-page .card-divider--hover-20{opacity:.2}.design-system-global-page .card-divider--hover-40{opacity:.4}.tints-and-shades .grid-x.cell.shrink{box-shadow:0 8px 24px -12px rgba(0,0,0,.25)}.tints-and-shades .card{cursor:pointer}.design-system-grid-page .beaver-character{position:absolute;bottom:-215px;right:100px;transform:rotate(-90.5deg)}.design-system-table-grid{width:784px}.design-system-table-grid__header{background-color:#e6e8e5}.design-system-table-grid__header h4{margin-bottom:0}.design-system-table-grid__data-highlight{background-color:#f8f8f8}@media only screen and (max-width: 959px){.design-system-table-grid{width:auto}}.design-system-components-page .text-small{display:block}.design-system-components-page .text-small--green{color:#9c0}.design-system-components-page .callout{margin-bottom:8px}.design-system-components-page .callout .info-close{right:20px}.design-system-components-page .page-banner--campaign .page-banner__icon{background:url(/packs/static/images/geschenk-042cea08f1ff2661891b267724b2f7a1.svg) center center no-repeat;background-size:contain}.design-system-components-page .page-banner__countdown,.design-system-components-page .page-banner__countdown-title{display:block}.design-system-components-page .progress{margin-bottom:8px}.design-system-components-page .close-button{position:relative}.design-system-components-page .input-hover{border:1px solid #999}.design-system-components-page .input-focus,.design-system-components-page .select-focus{background-color:#f8f8f8}.design-system-components-page .input-focus{border:1px solid #ccc}.design-system-components-page .select-hover{background-color:#d6eb99}.design-system-components-page .input-group{margin-bottom:32px}.design-system-components-page .snippet-button{cursor:pointer}.design-system-components-page .snippet-button .icon{position:relative;top:-1px}.design-system-components-page .form-checkbox__input.input-hover+.form-checkbox__label::before{background:url(/packs/static/images/form/checkbox_hover-1089006cdaa4fb4413e6818fe44e6033.svg) center center no-repeat;background-size:contain}.design-system-components-page .form-checkbox__input.input-focus+.form-checkbox__label::before{background:url(/packs/static/images/form/checkbox_focus-7f9105c06e1a086e7b6bb4e735efd529.svg) center center no-repeat;background-size:contain}.design-system-components-page .form-checkbox__input.input-selected+.form-checkbox__label::before{background:url(/packs/static/images/form/checkbox_selected-a368f6a56cd3ea417b1f303ee85eeb3e.svg) center center no-repeat;background-size:contain}.design-system-components-page .form-radio.is-hovered .form-radio__label::before{background:url(/packs/static/images/form/radio_hover-43208941cddba73b45644b845105bde8.svg) center center no-repeat;background-size:contain}.design-system-components-page .form-radio.is-focused .form-radio__label::before{background:url(/packs/static/images/form/radio_focus-771b9a1023e91b27bee0d053f0a85794.svg) center center no-repeat;background-size:contain}.design-system-components-page .form-radio.is-focused.form-radio--outlined{background-color:#f8f8f8}.design-system-components-page .form-radio.is-selected .form-radio__label::before{background:url(/packs/static/images/form/radio_selected-a644b305e6372a6398f745a2e9e19917.svg) center center no-repeat;background-size:contain}.design-system-components-page .form-checkbox-slide{display:inline-block;margin-right:16px}.design-system-components-page .slider-on-hover+.form-checkbox-slide__label::before{background:url(/packs/static/images/form/checkbox_slide_off_hover-4aa688a9dfc49d517f884c0d8a06547e.svg) center center no-repeat;background-size:contain}.design-system-components-page .slider-on-hover:checked+.form-checkbox-slide__label::before{background:url(/packs/static/images/form/checkbox_slide_on_hover-46ba23be952b4c404ef3cf5da7e848a1.svg) center center no-repeat;background-size:contain}.design-system-form-sections{margin-bottom:64px}.design-system-component:not(:last-of-type){margin-bottom:96px}.seperated-progressbar-text{margin-top:-8px;float:left}.design-system-card-sections .is-hovered .card__image-wrapper::after{display:block}.design-system-card-sections .is-hovered .sprites-content-structure-play{display:block}.design-system-card-sections .card-section--min-height{min-height:200px}.design-system-card-sections .is-tablet-version .gamification-postcard{overflow:inherit}.design-system-card-sections .is-tablet-version .gamification-postcard.is-minimized .gamification-postcard__text,.design-system-card-sections .is-tablet-version .gamification-postcard.is-minimized .is-opened{display:none}.design-system-card-sections .is-tablet-version .gamification-postcard.is-minimized .is-closed{display:inline-block}.design-system-card-sections .is-tablet-version .gamification-postcard__adress-field,.design-system-card-sections .is-tablet-version .gamification-postcard__hint{margin-top:10px}.design-system-card-sections .is-tablet-version .gamification-postcard__text-area{display:flex;flex-direction:column-reverse;padding-right:0;border-right:0}.design-system-card-sections .is-tablet-version .gamification-postcard__stamp{display:block;margin-right:auto;margin-left:auto}.design-system-card-sections .is-tablet-version .gamification-postcard__text{margin-top:20px}.design-system-card-sections .is-tablet-version .gamification-postcard__hint{width:auto}.design-system-card-sections .is-tablet-version .gamification-postcard__title{padding-top:30px}.design-system-card-sections .is-phone-version .card{-webkit-tap-highlight-color:rgba(0,0,0,0);flex-direction:row}.design-system-card-sections .is-phone-version .card.on-touch-hover{background:#f8f8f8}.design-system-card-sections .is-phone-version .card:hover .card__image-wrapper::after{border-top-right-radius:0}.design-system-card-sections .is-phone-version .card-section{display:inline-block;width:calc(100% - 126px);height:80px;padding:8px;padding-right:40px}.design-system-card-sections .is-phone-version .card__image{display:inline-block;width:126px;height:80px;border-top-right-radius:0;border-bottom-left-radius:8px}.design-system-card-sections .is-phone-version .card__image-wrapper{display:inline-block;border-top-right-radius:0;border-bottom-left-radius:8px}.design-system-card-sections .is-phone-version .icon--arrow-simple{display:inline-block}.design-system-reveal-sections{min-height:500px;margin-bottom:64px;background-color:#333;text-align:center}.design-system-reveal-sections .reveal{display:block}.design-system-reveal-sections .reveal.tiny{top:50px}.design-system-reveal-sections .reveal.tiny .button.primary{margin-top:138px}.design-system-reveal-sections .reveal.tiny svg{position:absolute;left:50%;transform:translateX(-50%)}.design-system-reveal-sections .reveal.small{top:25px}.design-system-reveal-sections .reveal.small .button.primary{width:200px;margin-top:-4px}.design-system-reveal-sections .reveal.large{padding-top:0;overflow:visible}.design-system-reveal-sections .reveal.large .primary{width:200px}.design-system-reveal-sections .reveal.large .h3{margin-top:96px}.design-system-reveal-sections .reveal.large svg{position:absolute;top:-48px;left:50%;transform:translateX(-50%)}.design-system-reveal-sections .reveal.full{height:auto;height:initial;min-height:0;border:2px dotted #e30000}.design-system-reveal-sections .reveal.full .primary{width:300px;margin:8px auto}.design-system-reveal-sections .reveal-link{display:block}.design-system-reveal-sections .button{width:100%}.design-system-reveal-sections .character-image{display:block;width:240px;height:175px;margin:-90px auto 16px}.design-system-icons-page .icons-list__item{margin-bottom:16px}.design-system-icons-page .icons-list__item .icon{margin-bottom:8px;padding:8px;border-radius:4px}.design-system-icons-page .action-icons .icon{cursor:pointer}.design-system-icons-page .action-icons .icon:hover{background:#d6eb99;color:#9c0}.design-system-logos-page .space-128{margin-bottom:128px}.design-system-logos-page h3{padding-top:2.5rem}.design-system-logos-page__content{font-family:"Open Sans",Helvetica,Arial,sans-serif;margin-bottom:16px;font-size:18px}.design-system-logos-page__background-black{display:flex;align-items:center;width:448px;height:256px;background-color:#333}.design-system-logos-page__background-green{display:flex;align-items:center;width:448px;height:256px;background-color:#9c0}.design-system-logos-page__background-small-gray{align-items:center;width:448px;height:256px;padding-top:32px;padding-left:32px;background-color:#f8f8f8}.design-system-logos-page__background-small-black{align-items:center;width:448px;height:256px;margin-right:45px;padding-top:32px;padding-left:32px;background-color:#333}.design-system-logos-page__background-medium-black{align-items:center;width:448px;height:256px;padding-top:32px;padding-left:32px;background-color:#333}.design-system-logos-page__background-large-gray{display:flex;align-items:center;width:928px;height:512px;background-color:#f8f8f8}.design-system-logos-page__background-international{display:flex;align-items:center;width:448px;height:256px;background-color:#333}.design-system-logos-page__logo-crimes{position:relative;max-width:1024px;grid-gap:16px 16px}.design-system-logos-page__logo-crimes .icon--circle-close{position:absolute;top:15px;right:100px;color:#e66}.design-system-logos-page__logo-crimes p{max-width:288px}.design-system-logos-page__background-small-black-sofa{display:flex;align-items:center;width:448px;height:256px;margin-right:35px;background-color:#333}.design-system-logos-page__background-small-dark-green-sofa{display:flex;align-items:center;width:448px;height:256px;margin-right:45px;background-color:#690}.design-system-logos-page .card{width:208px;height:256px;margin-bottom:2rem}.design-system-logos-page .card .card-divider{height:8rem}.design-system-logos-page .card .card-divider--green{background-color:#00b500}.design-system-logos-page .card .card-section{position:relative;height:8rem;padding:16px}.design-system-logos-page .card .card-section .card-section{height:84px}.design-system-logos-page .card .card-section .card-divider{height:96px}.design-system-logos-page .card-divider,.design-system-logos-page .card-section{height:8rem}.design-system-logos-page .card-divider--sofatutor-green{background-color:#9c0}.design-system-logos-page .card-divider--sofatutor-dark-green{background-color:#690}.design-system-logos-page .card-divider--primary{background-color:#06c}.design-system-logos-page .card-divider--primary-bright{background-color:#09f}.design-system-logos-page .card-divider--secondary{background-color:#ccc}.design-system-logos-page .card-divider--success{background-color:#d6eb99}.design-system-logos-page .card-divider--warning{background-color:#fdeb99}.design-system-logos-page .card-divider--alert{background-color:#fce3e3}.design-system-logos-page .card-divider--black{background-color:#333}.toast{position:relative}.toast__content{position:relative;width:323px;padding:32px;border-radius:24px;background-image:linear-gradient(230deg, #fdeb99 25%, #fcd733 100%)}.toast__image{position:absolute;top:-64px;left:50%;transform:translateX(-50%)}.toast__close{position:absolute;top:12px;right:12px}.toast__close:hover{cursor:pointer}.toast__icon{position:absolute;bottom:0;left:0;width:60px;height:60px;border-radius:24px;background-color:#329423}.toast__icon:hover{cursor:pointer}@media only screen and (max-width: 639px){.toast__content{width:222px;padding:32px 16px}.toast__text{font-size:12px}}.tassel{position:relative;display:block;width:auto;width:initial;max-width:417px;margin:16px auto;background-color:#e35b00;text-align:center}.tassel--weekly-price{padding:2px 12px;background-color:#fdeb99;color:#333}.tassel--weekly-price.tassel::before,.tassel--weekly-price.tassel::after{border-top:14px solid #fdeb99;border-bottom:14px solid #fdeb99}.tassel--weekly-price.tassel::before{border-right:12px solid #fdeb99;border-left:12px solid rgba(0,0,0,0)}.tassel--weekly-price.tassel::after{border-right:12px solid rgba(0,0,0,0);border-left:12px solid #fdeb99}.tassel::before,.tassel::after{display:block;width:0;height:0;padding-top:0;transform:translateY(-50%);border-top:20px solid #e35b00;border-bottom:20px solid #e35b00;content:""}.tassel::before{position:absolute;top:50%;left:-20px;border-right:15px solid #e35b00;border-left:15px solid rgba(0,0,0,0)}.tassel::after{position:absolute;top:50%;right:-20px;border-right:15px solid rgba(0,0,0,0);border-left:15px solid #e35b00}.tassel__text{padding:8px 16px;color:#fff;font-size:16px;font-weight:300;line-height:1.5}@media only screen and (max-width: 639px){.tassel{width:90%}.tassel::before,.tassel::after{border-top-width:17px;border-bottom-width:17px}.tassel::before{position:absolute;top:50%;left:-10px;border-right:10px solid #e35b00;border-left:10px solid rgba(0,0,0,0)}.tassel::after{position:absolute;top:50%;right:-10px;border-right:10px solid rgba(0,0,0,0);border-left:10px solid #e35b00}.tassel .tassel__text{font-size:11.4px;line-height:1.6}.tassel .tassel{margin-bottom:16px}}.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{position:relative;display:flex;justify-content:center;text-align:center}.features-module__item{position:relative;left:0;display:flex;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}}.features-module-small{position:relative;padding-bottom:32px}.features-module-small__headline{margin-bottom:24px;line-height:1.4;text-align:left}.features-module-small__image{position:absolute;bottom:0;left:-40px;width:141px;height:131px}.features-module-small__button{margin:24px 0 0 24px}.features-module-small__button-text{margin-left:24px;font-size:10px}.features-module-small__list{position:relative;display:flex;justify-content:center;text-align:center}.features-module-small__item{position:relative;left:0;display:flex;flex-direction:column;justify-content:flex-start;width:120px;height:120px;z-index:1;mix-blend-mode:multiply}.features-module-small__item:not(:first-of-type){margin-left:-15px}.features-module-small__item:last-of-type{margin-right:0}.features-module-small__item::before{position:absolute;top:0;bottom:0;left:0;right:0;border-radius:50%;content:"";z-index:-1}.features-module-small__item--sofaheld::before{background-color:#e6edf8}.features-module-small__item--sofaheld .features-module-small__quantity{color:#283f91}.features-module-small__item--vocabulary_trainer::before{background-color:#f2e6f8}.features-module-small__item--vocabulary_trainer .features-module-small__quantity{color:#af66d3}.features-module-small__item--videos::before{background-color:#e6f8e6}.features-module-small__item--videos .features-module-small__quantity{color:#690}.features-module-small__item--exercises::before{background-color:#fffae6}.features-module-small__item--exercises .features-module-small__quantity{color:#e1b800}.features-module-small__item--worksheet::before{background-color:#fce6e6}.features-module-small__item--worksheet .features-module-small__quantity{color:#ee6f6f}.features-module-small__item--chat::before{background-color:#e6f3f8}.features-module-small__item--chat .features-module-small__quantity{color:#0088b5}.features-module-small__quantity{font-family:"Open Sans",Helvetica,Arial,sans-serif;margin-top:20px;font-size:28px;font-weight:300}.features-module-small__text{font-family:"Open Sans",Helvetica,Arial,sans-serif;margin-top:-4px;color:#333;font-size:12px;font-weight:bold}@media only screen and (max-width: 959px){.features-module-small__image{position:absolute;bottom:0;left:60px}.features-module-small__button-text{color:#333;text-align:center}.features-module-small__list{display:flex;grid-template-columns:repeat(3, auto);grid-gap:10px}.features-module-small__item{width:80px;height:80px;margin:16px 8px 0 0}.features-module-small__quantity{margin-top:15px;font-size:14px}.features-module-small__text{font-size:8px}}@media only screen and (max-width: 639px){.features-module-small__headline{text-align:center}.features-module-small__image{position:absolute;bottom:-28px;left:-60px}.features-module-small__button-text{font-size:12px}.features-module-small__list{display:grid}.features-module-small__item{width:80px;height:80px;margin:0}.features-module-small__item:not(:first-of-type){margin-left:0}.features-module-small__quantity{font-size:14px}.features-module-small__text{font-size:8px}}