@media screen {
  /*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
  /* Document
     ========================================================================== */
  /**
   * 1. Correct the line height in all browsers.
   * 2. Prevent adjustments of font size after orientation changes in
   *    IE on Windows Phone and in iOS.
   */
  html {
    line-height: 1.15; /* 1 */
    -ms-text-size-adjust: 100%; /* 2 */
    -webkit-text-size-adjust: 100%; /* 2 */
  }
  /* Sections
     ========================================================================== */
  /**
   * Remove the margin in all browsers (opinionated).
   */
  body {
    margin: 0;
  }
  /**
   * Add the correct display in IE 9-.
   */
  article,
aside,
footer,
header,
nav,
section {
    display: block;
  }
  /**
   * Correct the font size and margin on `h1` elements within `section` and
   * `article` contexts in Chrome, Firefox, and Safari.
   */
  h1 {
    font-size: 2em;
    margin: 0.67em 0;
  }
  /* Grouping content
     ========================================================================== */
  /**
   * Add the correct display in IE 9-.
   * 1. Add the correct display in IE.
   */
  figcaption,
figure,
main { /* 1 */
    display: block;
  }
  /**
   * Add the correct margin in IE 8.
   */
  figure {
    margin: 1em 40px;
  }
  /**
   * 1. Add the correct box sizing in Firefox.
   * 2. Show the overflow in Edge and IE.
   */
  hr {
    box-sizing: content-box; /* 1 */
    height: 0; /* 1 */
    overflow: visible; /* 2 */
  }
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  pre {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  /* Text-level semantics
     ========================================================================== */
  /**
   * 1. Remove the gray background on active links in IE 10.
   * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
   */
  a {
    background-color: transparent; /* 1 */
    -webkit-text-decoration-skip: objects; /* 2 */
  }
  /**
   * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
   */
  abbr[title] {
    border-bottom: none; /* 1 */
    text-decoration: underline; /* 2 */
    text-decoration: underline dotted; /* 2 */
  }
  /**
   * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
   */
  b,
strong {
    font-weight: inherit;
  }
  /**
   * Add the correct font weight in Chrome, Edge, and Safari.
   */
  b,
strong {
    font-weight: bolder;
  }
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  code,
kbd,
samp {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  /**
   * Add the correct font style in Android 4.3-.
   */
  dfn {
    font-style: italic;
  }
  /**
   * Add the correct background and color in IE 9-.
   */
  mark {
    background-color: #ff0;
    color: #000;
  }
  /**
   * Add the correct font size in all browsers.
   */
  small {
    font-size: 80%;
  }
  /**
   * Prevent `sub` and `sup` elements from affecting the line height in
   * all browsers.
   */
  sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  /* Embedded content
     ========================================================================== */
  /**
   * Add the correct display in IE 9-.
   */
  audio,
video {
    display: inline-block;
  }
  /**
   * Add the correct display in iOS 4-7.
   */
  audio:not([controls]) {
    display: none;
    height: 0;
  }
  /**
   * Remove the border on images inside links in IE 10-.
   */
  img {
    border-style: none;
  }
  /**
   * Hide the overflow in IE.
   */
  svg:not(:root) {
    overflow: hidden;
  }
  /* Forms
     ========================================================================== */
  /**
   * 1. Change the font styles in all browsers (opinionated).
   * 2. Remove the margin in Firefox and Safari.
   */
  button,
input,
optgroup,
select,
textarea {
    font-family: sans-serif; /* 1 */
    font-size: 100%; /* 1 */
    line-height: 1.15; /* 1 */
    margin: 0; /* 2 */
  }
  /**
   * Show the overflow in IE.
   * 1. Show the overflow in Edge.
   */
  button,
input { /* 1 */
    overflow: visible;
  }
  /**
   * Remove the inheritance of text transform in Edge, Firefox, and IE.
   * 1. Remove the inheritance of text transform in Firefox.
   */
  button,
select { /* 1 */
    text-transform: none;
  }
  /**
   * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
   *    controls in Android 4.
   * 2. Correct the inability to style clickable types in iOS and Safari.
   */
  button,
html [type=button],
[type=reset],
[type=submit] {
    -webkit-appearance: button; /* 2 */
  }
  /**
   * Remove the inner border and padding in Firefox.
   */
  button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
    border-style: none;
    padding: 0;
  }
  /**
   * Restore the focus styles unset by the previous rule.
   */
  button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
    outline: 1px dotted ButtonText;
  }
  /**
   * Correct the padding in Firefox.
   */
  fieldset {
    padding: 0.35em 0.75em 0.625em;
  }
  /**
   * 1. Correct the text wrapping in Edge and IE.
   * 2. Correct the color inheritance from `fieldset` elements in IE.
   * 3. Remove the padding so developers are not caught out when they zero out
   *    `fieldset` elements in all browsers.
   */
  legend {
    box-sizing: border-box; /* 1 */
    color: inherit; /* 2 */
    display: table; /* 1 */
    max-width: 100%; /* 1 */
    padding: 0; /* 3 */
    white-space: normal; /* 1 */
  }
  /**
   * 1. Add the correct display in IE 9-.
   * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
   */
  progress {
    display: inline-block; /* 1 */
    vertical-align: baseline; /* 2 */
  }
  /**
   * Remove the default vertical scrollbar in IE.
   */
  textarea {
    overflow: auto;
  }
  /**
   * 1. Add the correct box sizing in IE 10-.
   * 2. Remove the padding in IE 10-.
   */
  [type=checkbox],
[type=radio] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
  }
  /**
   * Correct the cursor style of increment and decrement buttons in Chrome.
   */
  [type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
    height: auto;
  }
  /**
   * 1. Correct the odd appearance in Chrome and Safari.
   * 2. Correct the outline style in Safari.
   */
  [type=search] {
    -webkit-appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
  }
  /**
   * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
   */
  [type=search]::-webkit-search-cancel-button,
[type=search]::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  /**
   * 1. Correct the inability to style clickable types in iOS and Safari.
   * 2. Change font properties to `inherit` in Safari.
   */
  ::-webkit-file-upload-button {
    -webkit-appearance: button; /* 1 */
    font: inherit; /* 2 */
  }
  /* Interactive
     ========================================================================== */
  /*
   * Add the correct display in IE 9-.
   * 1. Add the correct display in Edge, IE, and Firefox.
   */
  details,
menu {
    display: block;
  }
  /*
   * Add the correct display in all browsers.
   */
  summary {
    display: list-item;
  }
  /* Scripting
     ========================================================================== */
  /**
   * Add the correct display in IE 9-.
   */
  canvas {
    display: inline-block;
  }
  /**
   * Add the correct display in IE.
   */
  template {
    display: none;
  }
  /* Hidden
     ========================================================================== */
  /**
   * Add the correct display in IE 10-.
   */
  [hidden] {
    display: none;
  }
  /**
  * Animations
  *
  * Keyframes from animate.css
  *
  * Inline the animation name with the CSS
  *
  * 1. Base - Use for inline HTML animations
  *
  * 2. a-fade-in
  *
  * 3. a-fade-in-up
  *
  * 4. a-slide-in-right
  *
  * 5. a-zoom-in
  *
  * 6. a-slide-in-up
  *
  * 7. a-slide-out-down
  *
  * 8. a-slight-fade-in-up
  *
  * 9. a-fade-in-up-20
  *
  * 10. scale-in
  *
  */
  /* ==========================================================================
    1. Base
    ========================================================================== */
  html:not([data-turbo-preview]) .animated {
    animation-duration: 1s;
    animation-fill-mode: both;
  }
  .animated--half {
    animation-duration: 0.5s;
  }
  /* ==========================================================================
     2. a-fade-in
     ========================================================================== */
  @keyframes a-fade-in {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
  /* ==========================================================================
     3. a-fade-in-up
     ========================================================================== */
  @keyframes a-fade-in-up {
    from {
      opacity: 0;
      transform: translate3d(0, 100%, 0);
    }
    to {
      opacity: 1;
      transform: none;
    }
  }
  /* ==========================================================================
     4. a-slide-in-right
     ========================================================================== */
  @keyframes a-slide-in-right {
    from {
      transform: translate3d(100%, 0, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
  }
  .a-slide-in-right-05 {
    animation: a-slide-in-right 0.5s;
  }
  /* ==========================================================================
  4. a-slide-in-right-320
  ========================================================================== */
  @keyframes a-slide-in-right-320 {
    from {
      transform: translateX(-320px);
      visibility: visible;
    }
    to {
      transform: translateX(0);
    }
  }
  /* ==========================================================================
  4. a-slide-in-right-360
  ========================================================================== */
  @keyframes a-slide-in-right-360 {
    from {
      transform: translateX(360px);
      visibility: visible;
    }
    to {
      transform: translateX(0);
    }
  }
  .c-library-filters {
    animation: a-slide-in-right-360 0.5s;
  }
  /* ==========================================================================
     5. a-zoom-in
     ========================================================================== */
  @keyframes a-zoom-in {
    from {
      opacity: 0;
      transform: scale3d(0.3, 0.3, 0.3);
    }
    50% {
      opacity: 1;
    }
  }
  /* ==========================================================================
     6. a-slide-in-up
     ========================================================================== */
  @keyframes a-slide-in-up {
    from {
      transform: translate3d(0, 100%, 0);
      visibility: visible;
    }
    to {
      transform: translate3d(0, 0, 0);
    }
    100% {
      display: none;
    }
  }
  .a-slide-in-up {
    animation-name: a-slide-in-up;
  }
  /* ==========================================================================
     7q. a-slide-out-down
     ========================================================================== */
  @keyframes a-slide-out-down {
    from {
      transform: translate3d(0, 0, 0);
    }
    to {
      visibility: hidden;
      transform: translate3d(0, 100%, 0);
    }
  }
  .a-slide-out-down {
    animation-name: a-slide-out-down;
  }
  /* ==========================================================================
     7b. a-slide-in-down
     ========================================================================== */
  @keyframes a-slide-in-down {
    from {
      transform: translateY(-1000px);
    }
    to {
      transform: translateY(0);
    }
  }
  .a-slide-in-down {
    animation-name: a-slide-in-down;
  }
  /* ==========================================================================
     8. a-slight-fade-in-up
     ========================================================================== */
  @keyframes a-slight-fade-in-up {
    from {
      opacity: 0;
      transform: translateY(5px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  .c-library-filters .dropdown-menu, .l-newsletter-hero .o-tooltip, .o-dropdown-menu {
    animation: a-slight-fade-in-up 0.25s;
  }
  /* ==========================================================================
  9. a-fade-in-up--10
  ========================================================================== */
  @keyframes a-fade-in-up--10 {
    from {
      opacity: 0;
      transform: translateY(10px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  section.home-hero .home-hero__testimonial, section.home-hero .home-hero__wrapper {
    animation: a-fade-in-up-20 1s;
  }
  .a-fade-in-up--10 {
    animation: a-fade-in-up-20 1s;
  }
  /* ==========================================================================
  9. a-fade-in-up-20
  ========================================================================== */
  @keyframes a-fade-in-up-20 {
    from {
      opacity: 0;
      transform: translateY(20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  article.c-written-tutorial .c-written-tutorial__content, article.c-written-tutorial header, .l-newsletter-hero:before, .l-collection-hero .l-collection-hero__copy {
    animation: a-fade-in-up-20 2s;
  }
  .a-fade-in-up-20 {
    animation: a-fade-in-up-20 2s;
  }
  /* ==========================================================================
  9. a-fade-in-down-20
  ========================================================================== */
  @keyframes a-fade-in-down-20 {
    from {
      opacity: 0;
      transform: translateY(-20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  section.home-hero:after, .l-newsletter-hero:after {
    animation: a-fade-in-down-20 2s;
  }
  .a-fade-in-down-20 {
    animation: a-fade-in-down-20 2s;
  }
  /* ==========================================================================
  9. a-fade-in-down-80
  ========================================================================== */
  @keyframes a-fade-in-down-80 {
    from {
      opacity: 0;
      transform: translateY(-80px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  .a-fade-in-down-80 {
    animation: a-fade-in-down-80 2s;
  }
  /* ==========================================================================
  9. a-scale-in
  ========================================================================== */
  @keyframes a-scale-in {
    from {
      opacity: 0;
      transform: scale(0.9);
    }
    to {
      opacity: 1;
      transform: scale(1);
    }
  }
  article.c-written-tutorial header .c-written-tutorial__artwork, .c-video-player__paywall .c-video-player__paywall-wrapper, .c-video-player__complete .c-video-player__complete-wrapper, .c-video-player .c-video-player__video .c-video-player__preloader, .c-price-card, section.home-hero .home-hero__action, .l-newsletter-hero > div, .l-collection-hero .l-collection-hero__artwork, .l-path-hero .l-path-hero__wrapper .l-path-hero__artwork {
    animation: a-scale-in 1.5s;
  }
  /* ==========================================================================
  10. a-scale-in-plain
  ========================================================================== */
  @keyframes a-scale-in-plain {
    from {
      transform: scale(0.9);
    }
    to {
      transform: scale(1);
    }
  }
  article.c-written-tutorial header .c-written-tutorial__artwork, .c-video-player__paywall .c-video-player__paywall-wrapper, .c-video-player__complete .c-video-player__complete-wrapper, .c-video-player .c-video-player__video .c-video-player__preloader, .c-price-card, section.home-hero .home-hero__action, .l-newsletter-hero > div, .l-collection-hero .l-collection-hero__artwork, .l-path-hero .l-path-hero__wrapper .l-path-hero__artwork {
    animation: a-scale-in-plain 1.5s;
  }
  /* ==========================================================================
  11a. a-scale-in
  ========================================================================== */
  @keyframes a-scale-in-small {
    from {
      opacity: 0;
      transform: scale(0.99);
    }
    to {
      opacity: 1;
      transform: scale(1);
    }
  }
  .c-empty-state, .c-search__no-results, .c-search__loading, .c-global-search .c-global-search__input input, html:not([data-turbo-preview]) .c-tutorial-item {
    animation: a-scale-in-small 0.75s;
  }
  .a-scale-in-small {
    animation: a-scale-in-small 0.75s;
  }
  /* ==========================================================================
  11b. a-scale-in--large
  ========================================================================== */
  @keyframes a-scale-in-large {
    from {
      opacity: 0;
      transform: scale(0.1);
    }
    to {
      opacity: 1;
      transform: scale(1);
    }
  }
  .a-scale-in-large {
    animation: a-scale-in-large 0.75s;
  }
  /* ==========================================================================
  12. File rotate 30
  ========================================================================== */
  @keyframes a-file-rotate {
    0% {
      transform: translateX(0) translateY(0);
    }
    25% {
      transform: translateX(30px);
    }
    50% {
      transform: translateX(30px) translateY(30px);
    }
    75% {
      transform: translateX(0px) translateY(30px);
    }
    100% {
      transform: translateX(0) translateY(0);
    }
  }
  .c-search__loading .c-search__loading-animate img {
    animation: a-file-rotate 3s infinite;
  }
  .a-file-rotate {
    animation: a-file-rotate 3s infinite;
  }
  /* ==========================================================================
  12. File rotate 5
  ========================================================================== */
  @keyframes a-file-rotate--5 {
    0% {
      transform: translateX(0) translateY(0);
    }
    25% {
      transform: translateX(5px);
    }
    50% {
      transform: translateX(5px) translateY(5px);
    }
    75% {
      transform: translateX(0px) translateY(5px);
    }
    100% {
      transform: translateX(0) translateY(0);
    }
  }
  .a-file-rotate--5 {
    animation: a-file-rotate--5 3s infinite;
  }
  /* ==========================================================================
  13. a-fade-out
  ========================================================================== */
  @keyframes a-fade-out {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
    }
  }
  /* ==========================================================================
  14. pulse
  ========================================================================== */
  @keyframes a-pulse {
    0% {
      background-color: rgba(33, 33, 33, 0.75);
    }
    50% {
      background-color: rgb(21, 132, 67);
    }
    100% {
      background-color: rgba(33, 33, 33, 0.75);
    }
  }
  .a-pulse {
    animation: a-pulse 3s infinite;
  }
  /* ==========================================================================
  14. a-background-gradient
  ========================================================================== */
  @keyframes a-background-gradient {
    0% {
      background-position: 0% 50%;
    }
    50% {
      background-position: 100% 50%;
    }
    100% {
      background-position: 0% 50%;
    }
  }
  /**
   * This file contains all application-wide Sass variables.
   *
   * 1. Fonts
   *
   * 2a. Colors
   *
   * 2b. Highlighter Colors
   *
   * 3. Elements
   */
  /* ==========================================================================
     1. Fonts
     ========================================================================== */
  /**
   * This file contains the font-face definitions for the fonts used across the site
   *
   * It was generated using http://google-webfonts-helper.herokuapp.com/fonts
   *
   * Remember to include latin-ext, primarily for names.
   *
   * 1. Bitter
   * 2. IBM Plex Sans
   * 3. IBM Plex Serif
   */
  /* NOTE
   *
   * Creating these fonts (Bitter) was somewhat challenging, because they were updated in
   * Google Fonts with different spacing and weight. It was then very hard to find the
   * original font with the appropriate character set.
   * This directory contains the OTF files that we need.
   * You can use https://everythingfonts.com/subsetter to extract the appropriate subset
   * (Latin Extended) and then https://kombu.kanejaku.org to create the WOFF and WOFF2 versions
   * Current settings on the subset generator:
   *
   * - Basic Latin
   * - Latin-1 Supplement
   * - Advanced Punctuation
   * - Uppercase
   * - Lowercase
   * - Numerals
   * - Basic Punctuation
   * - Currency Symbols
   * - Latin Extended-A
   * - Latin Extended-B
   */
  /* ==========================================================================
     1. Bitter
     ========================================================================== */
  /* bitter-regular - latin-ext_latin */
  @font-face {
    font-family: "Bitter";
    font-style: normal;
    font-weight: 400;
    src: url(/assets/bitter-1.300-latin_ext-regular-ea79c0f752f7656ce3694dca8312fcb969f83cbe92ca5298c5920ccffb126c5d.woff2) format("woff2"), url(/assets/bitter-1.300-latin_ext-regular-eecfd6c3af651231104ba7ae58079c215e1d4c00b80b2ff0e95ae0cbec63452c.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* bitter-italic - latin-ext_latin */
  @font-face {
    font-family: "Bitter";
    font-style: italic;
    font-weight: 400;
    src: url(/assets/bitter-1.002-latin_ext-italic-f4a1b872a93d98cd9f7865f20340e22e936f3634fb142e2372b4598c98def35a.woff2) format("woff2"), url(/assets/bitter-1.002-latin_ext-italic-a6485dae55bfcf03d80c0b42c15a8555767d700b3be2db1a24bcbff003d2c606.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* bitter-700 - latin-ext_latin */
  @font-face {
    font-family: "Bitter";
    font-style: normal;
    font-weight: 700;
    src: url(/assets/bitter-2.110-latin_ext-700-041b7c53b2f3ed8e2378eaef2841cfad596a7cf6af87bd91f96c9c3b26eec206.woff2) format("woff2"), url(/assets/bitter-2.110-latin_ext-700-57857445d4419a791376b73c9bdb14606d59d2aa09a947120d1b6a1e58965e42.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ==========================================================================
     2. IBM Plex Sans
     ========================================================================== */
  /* ibm-plex-sans-regular - latin-ext_latin */
  @font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 400;
    src: url(/assets/ibm-plex-sans-v3-latin-ext_latin-regular-4126890a77928150a6f3be017f23c93df16f56e6940a72f231823ba29d2ee998.woff2) format("woff2"), url(/assets/ibm-plex-sans-v3-latin-ext_latin-regular-3213dca28efc701a797f1a261a9377b0c530a9ae3cfb72b187d1194f3bd196d3.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ibm-plex-sans-500 - latin-ext_latin */
  @font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 500;
    src: url(/assets/ibm-plex-sans-v3-latin-ext_latin-500-04aba1eb9b084332715891b2a764459df24188e66731279bad286bbe1447e5e8.woff2) format("woff2"), url(/assets/ibm-plex-sans-v3-latin-ext_latin-500-2827cf78c931acdac08d21fb21e3c1531fda43e342b49055f9a312cf336f366c.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ibm-plex-sans-700 - latin-ext_latin */
  @font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 700;
    src: url(/assets/ibm-plex-sans-v3-latin-ext_latin-700-946ed95688a6677fb113b84ac50ef140b42971e05e4da335a3ead116a7c9886b.woff2) format("woff2"), url(/assets/ibm-plex-sans-v3-latin-ext_latin-700-7dbcb16e805e3c4e19b6afc0fbe96a730c7229f129c00e1b239eda58b12f6063.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ==========================================================================
     3. IBM Plex Serif
     ========================================================================== */
  /* ibm-plex-serif-regular - latin-ext_latin */
  @font-face {
    font-family: "IBM Plex Serif";
    font-style: normal;
    font-weight: 400;
    src: url(/assets/ibm-plex-serif-v4-latin-ext_latin-regular-e4f826dc262e20e2114e3637d5cab104d4851dee74421c968a6e29d6be2d8b0b.woff2) format("woff2"), url(/assets/ibm-plex-serif-v4-latin-ext_latin-regular-98933eb8c158bbfc91428e8e37644e6f906422073f220313353a4ae476c3bbfd.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ibm-plex-serif-500 - latin-ext_latin */
  @font-face {
    font-family: "IBM Plex Serif";
    font-style: normal;
    font-weight: 500;
    src: url(/assets/ibm-plex-serif-v4-latin-ext_latin-500-dcab0f62c8194ccb39b97113223f99f294112e0d173b18918c31f3494c203456.woff2) format("woff2"), url(/assets/ibm-plex-serif-v4-latin-ext_latin-500-ae2864b567a0cfaee3af57d9a8a800a374db2a8aee962b54bbcbf83d1c90fa15.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ibm-plex-serif-700 - latin-ext_latin */
  @font-face {
    font-family: "IBM Plex Serif";
    font-style: normal;
    font-weight: 700;
    src: url(/assets/ibm-plex-serif-v4-latin-ext_latin-700-ec4d87dbc9136c02618bd6878955a63e40207541c72e5109137d56e28ea65b3f.woff2) format("woff2"), url(/assets/ibm-plex-serif-v4-latin-ext_latin-700-cf316807d947f5b6ef4492a9ce6ec4a2f348ec1acf64a481cd6f0fbecb846ad0.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ==========================================================================
     4. IBM Plex Mono
     ========================================================================== */
  /* ibm-plex-mono-medium */
  @font-face {
    font-family: "IBM Plex Mono";
    font-style: normal;
    font-weight: 500;
    src: url(/assets/ibm-plex-mono-v1-500-ba9db195c954509bda2236e0303e51b261b85aef320cb28134ed97155de85914.woff2) format("woff2"), url(/assets/ibm-plex-mono-v1-500-37d084bbe45275af60e08db241605f8a7949a8ebc76074954fd9b02b72aa4857.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ==========================================================================
     2a. Colors
     ========================================================================== */
  /* Blacks */
  /* Greys */
  /* Greens */
  /* Blues */
  /* Reds */
  /* Purples */
  /* Teals */
  /* Yellows */
  /* Brands */
  /* Gradients */
  /* ==========================================================================
     2b. Highlighter Colors
     ========================================================================== */
  /* ==========================================================================
     3. Elements
     ========================================================================== */
  /**
   * Consult bourbon.io for a comprehensive list of available mixins before adding one here
   *
   * 1. Card - Used for nearly every container as a background
   *
   * 2. Breakpoints - Powerful mixin with five presets for common screen sizes
   *
   * 3. Position Absolute - A full width/height pseudo element fill
   *
   * 4. Border Hover
   *
   * 5. Mobile scroll - Make overflow scroll springy on mobile
   *
   */
  /* ==========================================================================
    1. Card
    ========================================================================== */
  /* ==========================================================================
   2. Breakpoints
   ========================================================================== */
  /* ==========================================================================
     3. Pseudo element absolute
     ========================================================================== */
  /* ==========================================================================
    4. Border Hover
    ========================================================================== */
  /* ==========================================================================
  5. Mobile scroll
  ========================================================================== */
  /* ==========================================================================
  6. Hide Scrollbar
  ========================================================================== */
  /**
   * A thin layer on top of normalize.css
   */
  html {
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  }
  *,
*::before,
*::after {
    box-sizing: inherit;
  }
  blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
figure,
p,
pre {
    margin: 0;
  }
  a, button {
    transition: all 0.3s ease-out;
  }
  button {
    background: transparent;
    border: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  }
  input:focus, button:focus, li:focus, a:focus, span:focus {
    outline: 0;
  }
  fieldset {
    border: 0;
    margin: 0;
    padding: 0;
  }
  iframe {
    border: 0;
  }
  ol,
ul {
    list-style: none;
    margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  }
  ol {
    list-style: decimal;
  }
  ol li {
    margin-top: 10px;
  }
  ol li:first-child {
    margin-top: 0;
  }
  input,
textarea,
select {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    -webkit-appearance: none;
  }
  /**
   * Suppress the focus outline on elements that cannot be accessed via keyboard.
   * This prevents an unwanted focus outline from appearing around elements that
   * might still respond to pointer events.
   */
  [tabindex="-1"]:focus {
    outline: none !important;
  }
  /**
   * Standardise SVG rendering
   */
  svg g, svg path {
    fill: inherit;
  }
  svg.icon {
    width: 32px;
    height: 32px;
  }
  /**
   * Sets some base rules for typography
   */
  body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-display: auto;
    font-size: 1rem;
    font-weight: normal;
    line-height: 1.45;
    color: #333333;
    -webkit-backface-visibility: hidden;
    text-shadow: 0 -1px 1px rgba(255, 255, 255, 0.01);
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }
  h1, h2, h3, h4, h5 {
    font-family: "Bitter", serif;
    font-display: auto;
    font-weight: 700;
    letter-spacing: -0.5px;
  }
  h1 {
    font-size: 3rem;
    line-height: 1.125;
  }
  /**
   *
   *
   *
   * Base styles for common menu elements
   *
   * To modify use custom -l classes on html element
   *
   *
   * 1. Dropdown
   *
   * 2. Dropdown (Dark)
   *
   * 3. Dropdown Actions
   *
   *
   */
  /* ==========================================================================
    1. Dropdown
    ========================================================================== */
  /* ==========================================================================
     3. Dropdown Actions
     ========================================================================== */
  /**
   *
   * DO NOT EDIT BASE
   *
   * Add additional color classes if required
   *
   * Every button you'll ever need can be created from these o-button classes
   *
   * To modify use custom -l classes on html element
   *
   * Can be used for 'a' and 'button' html tags
   *
   * 1. Base button
   *
   * 2. Colors
   *
   * 3a. Size
   *
   * 3b. Shape
   *
   * 4. Icons within buttons with text - customise the icon color and background
   *
   * 5. Loaders within buttons -
   *
   * 6. Single button icons no text - eg. menu, close
   *
   * 7. Video
   *
   * 8. Badge / Button - Eg. Copy
   *
   * 9. Mobile menu
   *
   * 10. Bookmark
   *
   * Custom layouts
   *
   */
  /* ==========================================================================
     Base
     ========================================================================== */
  /* ==========================================================================
     Colors
     ========================================================================== */
  /* ==========================================================================
     3a. Size
     ========================================================================== */
  /* ==========================================================================
     3b. Shape
     ========================================================================== */
  /* ==========================================================================
     4. Icons
     ========================================================================== */
  /* ==========================================================================
     Loaders
     ========================================================================== */
  /* ==========================================================================
     Single button icons no text
     ========================================================================== */
  /* ==========================================================================
  Text buttons with no background
  ========================================================================== */
  /* Apply to inside label span only */
  /* ==========================================================================
  Text buttons with background on hover
  ========================================================================== */
  /* ==========================================================================
     Buttons inside input elements eg. password show
     ========================================================================== */
  /* ==========================================================================
     7. Video
     ========================================================================== */
  /* ==========================================================================
  8. Badge / Button - Eg. Copy
  ========================================================================== */
  /* ==========================================================================
  8. Button for Code Blocks
  ========================================================================== */
  /* ==========================================================================
  9. Mobile menu
  ========================================================================== */
  /* ==========================================================================
  10. Close
  ========================================================================== */
  /* ==========================================================================
  11. Bookmarks
  ========================================================================== */
  /* ==========================================================================
  12. Share Buttons
  ========================================================================== */
  /* ==========================================================================
  13. How to
  ========================================================================== */
  /* ==========================================================================
  14. Start of content
  ========================================================================== */
  /* ==========================================================================
  15. Chapter buttons
  ========================================================================== */
  /* ==========================================================================
  15. Disclose
  ========================================================================== */
  /* ==========================================================================
  Custom layouts for buttons
  ========================================================================== */
  /* A hack for buttons that need to wrap their children in a span */
  /* ==========================================================================
  Custom layouts for button icons
  ========================================================================== */
  /* Misc */
  /* Arrows */
  /* Search */
  /* Social */
  /**
  *
  * DO NOT EDIT BASE
  *
  * Add additional color classes if required
  *
  * Every badge you'll ever need can be created from these o-button classes
  *
  *
  * Can be used for span html tags
  *
  * 1. Base badge
  *
  * 2. Video badge
  *
  * 3. Tutorial badge // Can be used to display author profile, number or checkmark
  *
  */
  /* ==========================================================================
  Base
  ========================================================================== */
  /* ==========================================================================
  Video badge
  ========================================================================== */
  /* ==========================================================================
  Tutorial badge
  ========================================================================== */
  /* ==========================================================================
  Product badge
  ========================================================================== */
  /* ==========================================================================
  Pro badge
  ========================================================================== */
  /* ==========================================================================
  New badge
  ========================================================================== */
  /* ==========================================================================
  Completed badge
  ========================================================================== */
  /**
   * Form inputs
   *
   * Generic styles for form inputs always used on a white background
   *
   * Can build any form using the following objects
   *
   * To modify layout eg. width use custom -l classes on html element
   *
   * 1. Form label
   *
   * 2. Input and textarea
   *
   * 3a. Checkbox (Simple)
   * 
   * 3b. Checkbox (Toggle)
   *
   * 4. Validation
   *
   */
  /* ==========================================================================
     1. Form label
     ========================================================================== */
  /* ==========================================================================
     2. Regular input and textarea
     ========================================================================== */
  /* ==========================================================================
     3a. Checkbox (Simple)
     ========================================================================== */
  /* ==========================================================================
     3b. Checkbox (Toggle)
     ========================================================================== */
  /* ==========================================================================
     4. Validation
     ========================================================================== */
  /* ==========================================================================
  5. Dropdown
  ========================================================================== */
  /**
   * Loading Animations
   *
   * DO NOT EDIT
   *
   * To change size color use layout classes
   *
   * 1. Pulse
   *
   * 2. Circle
   *
   * 3. Dots
   *
   */
  /* ==========================================================================
  1. Pulse
  ========================================================================== */
  /* ==========================================================================
  2. Circle
  ========================================================================== */
  /* ==========================================================================
  3. Dots
  ========================================================================== */
  /**
   * Images
   *
   * 1. Logo
   *
   * 2. Rounded - Adds rounded border to image or figure wrapper
   *
   * 3. Profile - Common sizes for avatars and profile photos
   *
   * 4. Screenshot
   */
  /* ==========================================================================
  1. Logo
  ========================================================================== */
  /* ==========================================================================
  2. Rounded
  ========================================================================== */
  /* ==========================================================================
  3. Profile
  ========================================================================== */
  /* ==========================================================================
  4. Screenshot
  ========================================================================== */
  /**
   * Custom tables
   *
   * For tables that have multiple columns add a custom class for the column width and flexbox will do the rest
   *
   * Styles for tables are found in components/lists.scss 
   *
   * 1. Receipts table
   *
   */
  /* ==========================================================================
     1. Receipts table  
     ========================================================================== */
  /**
   * Feedback banners and messages
   *
   * Notify the user when they've made a change via a form or to highlight news and announcements
   *
   * 1. Base DO NOT EDIT
   *
   * 2. Class Modifiers for success, warning, danger and info messages
   *
   * X. Custom layout classes
   */
  /* ==========================================================================
    1. Base
    ========================================================================== */
  /* ==========================================================================
    2. Class Modifiers for success, warning, danger and info messages
    ========================================================================== */
  /* ==========================================================================
    X. Custom layout classes
    ========================================================================== */
  /**
   * 
   * DO NOT EDIT BASE
   *
   * Add additional color classes if required
   *
   * To modify use custom -l classes on html element
   *
   * 1. Progress Indicator
   * 
   * 2. Progress Indicator (HTML)
   *
   *	
   **/
  /* ==========================================================================
    1. Progress Indicator
    ========================================================================== */
  /* ==========================================================================
     2. Progress Indicator (HTML)
     ========================================================================== */
  /**
   *
   * DO NOT EDIT BASE
   *
   * Add additional color classes if required
   *
   * Every tag you'll ever need can be created from these o-tag classes
   *
   * To modify use custom -l classes on html element
   *
   * Can be used for 'a' and 'button' html tags
   *
   * 1. Base tag
   *
   *
   */
  /* ==========================================================================
     Base
     ========================================================================== */
  /**
   *
   * DO NOT EDIT BASE
   *
   * Add additional color classes if required
   *
   * Every tooltip you'll ever need can be created from these o-tooltip class
   *
   * To modify use custom -l classes on html element
   *
   * 1. Base
   *
   * 2. Data tooltip
   *
   * 3. HTML tooltip
   *
   * 4x. Modifiers
   *
   * 5. Note Taking
   *
   * Z. Custom Layouts
   *
   */
  /* ==========================================================================
  1. Base
  ========================================================================== */
  /* ==========================================================================
  2. Data tooltip
  ========================================================================== */
  /* ==========================================================================
  * 3. HTML tooltip
  ========================================================================== */
  /* ==========================================================================
  4a. Top Left
  ========================================================================== */
  /* ==========================================================================
  4b. Top Right
  ========================================================================== */
  /* ==========================================================================
  5. Note Taking
  ========================================================================== */
  /* ==========================================================================
  Z. Custom Layouts
  ========================================================================== */
  /**
   *
   * Add additional color classes if required
   *
   * Every link you'll ever need can be created from these o-link classes
   *
   *
   * Can be used for a tags
   *
   * 1. Green
   *
   */
  /* ==========================================================================
    Green
    ========================================================================== */
  /* ==========================================================================
  Variables
  ========================================================================== */
  /* ==========================================================================
  Mixins
  ========================================================================== */
  /**
  *
  *
  * 1. Content Counter
  *
  *
  */
  /* ==========================================================================
  1. Content Counter
  ========================================================================== */
  /**
   *
   * Layouts
   *
   * For use everywhere - saves you adding margin, widths to components objects
   *
   * 1. Wrappers
   *
   * 2. Columns
   *
   * 3. Margins
   *
   * 4. Padding
   *
   * 5. Flex
   *
   * 6. Position
   *
   * 7. Text
   *
   * 8. Fonts
   *
   * 9. Grid
   *
   * 10. Background
   *
   * 11. Overlay
   *
   * 12. Borders
   *
   * 13. Z-index
   *
   */
  /* ==========================================================================
  1. Wrappers
  ========================================================================== */
  /* ==========================================================================
    2. Columns
    ========================================================================== */
  /* ==========================================================================
    3. Margins
    ========================================================================== */
  /* Responsive margins */
  /* ==========================================================================
     7. Padding
     ========================================================================== */
  /* ==========================================================================
    5. Flex
    ========================================================================== */
  /* ==========================================================================
  6. Position
  ========================================================================== */
  /* ==========================================================================
  7. Text
  ========================================================================== */
  /* ==========================================================================
  8. Fonts
  ========================================================================== */
  /* ==========================================================================
  9. Grid
  ========================================================================== */
  /* ==========================================================================
  10. Background
  ========================================================================== */
  /* ==========================================================================
  11. Overflow
  ========================================================================== */
  /* ==========================================================================
  12. Borders
  ========================================================================== */
  /* ==========================================================================
  13. Block
  ========================================================================== */
  /* ==========================================================================
  14. Cursor
  ========================================================================== */
  /* ==========================================================================
  14. Z-index
  ========================================================================== */
  /* ==========================================================================
  14. Borders
  ========================================================================== */
  /* ==========================================================================
  15. States
  ========================================================================== */
  /* ==========================================================================
  16. Floats
  ========================================================================== */
  /* ==========================================================================
  17. Visibility
  ========================================================================== */
  /* ==========================================================================
  18. Transform
  ========================================================================== */
  /**
  * Admin Layouts
  *
  * Custom classes for widths, margins, padding, font-sizes etc. for accounts.rw.com
  *
  * 1. Wrappers, Text
  *
  * 2. Sidebar
  *
  */
  /* ==========================================================================
  1. Wrappers, Text
  ========================================================================== */
  /* ==========================================================================
  2. Sidebar
  ========================================================================== */
  /**
   *
   * Layouts
   *
   * For use on video components
   *
   * 1. Overlay
   *
   **/
  /* ==========================================================================
  1. Overlay
  ========================================================================== */
  /**
   *
   * Layouts
   *
   * For use on tutorial components
   *
   * 1. Collection - Tutorial group layout
   *
   * 2. Container - Scroll tutorials horizontally
   *
   * 3. Hero - Homepage
   *
   * 4. Library - Dark mode
   * 
   * 5. Up Next
   *
   *
   **/
  /* ==========================================================================
  1. Collection - Tutorial group layout
  ========================================================================== */
  /* ==========================================================================
  2. Container - Scroll tutorials horizontally
  ========================================================================== */
  /* ==========================================================================
  3. Hero - Homepage
  ========================================================================== */
  /* ==========================================================================
  3. Follow pillars
  ========================================================================== */
  /* ==========================================================================
  4. Library - Dark mode layout fixes
  ========================================================================== */
  /* ==========================================================================
  5. Up Next Fixes/Hacks
  ========================================================================== */
  /**
   *
   * Books
   *
   * For use on book sales and chapters pages
   *
   * 1. Sidebar
   *
   * 2. End of chapter message
   *
   * 3. Materials
   *
   * 4. Chapter font style
   *
   * 5. Chapter page color
   *
   * 6. Chapter font size
   *
   * 7. Chapter page size
   *
   * 8. Chapter image size
   *
   * 9. Book hero
   *
   * 10. Book sales
   *
   **/
  /* ==========================================================================
  1. Sidebar
  ========================================================================== */
  /* ==========================================================================
  2. End of chapter message
  ========================================================================== */
  /* ==========================================================================
  3. Materials
  ========================================================================== */
  /* ==========================================================================
  4. Chapter font style
  ========================================================================== */
  /* ==========================================================================
  6. Chapter text size
  ========================================================================== */
  /* ==========================================================================
  7. Chapter page size
  ========================================================================== */
  /* ==========================================================================
  8. Chapter image size
  ========================================================================== */
  /* ==========================================================================
  9. Book Hero
  ========================================================================== */
  /* ==========================================================================
  10. Book Sales
  ========================================================================== */
  /**
   *
   * Layouts
   *
   * For use on path pages
   *
   * 1. Hero
   *
   * 2. Popular
   *
   * 3. List
   *
   * 4. Collection of Paths
   *
   **/
  /* ==========================================================================
  1. Hero
  ========================================================================== */
  /* ==========================================================================
  2. Popular
  ========================================================================== */
  /* ==========================================================================
  3. List
  ========================================================================== */
  /* ==========================================================================
  4. Collection of Paths
  ========================================================================== */
  /**
   *
   * Domains
   *
   *
   *
   * 1. Collection of tutorials
   *
   *
   **/
  /* ==========================================================================
  1. Collection of tutorials
  ========================================================================== */
  /**
   *
   * Collections
   *
   *
   *
   * 1. Hero
   *
   * 1a. Trailer modifier
   *
   * 2. Collection
   *
   * 3. Modules & Videos
   *
   * 4. Book hero
   *
   *
   *
   **/
  /* ==========================================================================
  1. Hero
  ========================================================================== */
  /* ==========================================================================
  1a. Trailer modifier
  ========================================================================== */
  /* ==========================================================================
  2. Collection
  ========================================================================== */
  /* ==========================================================================
  3. Modules & Videos
  ========================================================================== */
  /**
   * Achievements
   *
   *
   * 1. Achievements / Badge Layout page
   *
   *
   */
  /* ==========================================================================
  1. Achievements / Badge Layout page
  ========================================================================== */
  /**
   *
   * Events
   *
   *
   *
   * 1a. Black Friday 2021 Variables
   * 
   * 1b. Black Friday 2021 Global & Pattern
   *
   * 1c. Black Friday 2021 Top Advert
   * 
   * 1d. Black Friday 2021 Related Advert
   * 
   * 1e. Black Friday 2021 End of Page Advert
   * 
   * 1f. Black Friday 2021 Sticky Banner
   * 
   * 1g. Black Friday 2021 Video Paywall
   *
   *
   **/
  /* ==========================================================================
  1a. Black Friday 2021 Variables
  ========================================================================== */
  /* ==========================================================================
  1b. Black Friday 2021 Global & Pattern
  ========================================================================== */
  /* ==========================================================================
  1c. Black Friday 2021 Top Advert
  ========================================================================== */
  /* ==========================================================================
  1d. Black Friday 2021 Related Advert
  ========================================================================== */
  /* ==========================================================================
  1e. Black Friday 2021 End of Page Advert
  ========================================================================== */
  /* ==========================================================================
  1f. Black Friday 2021 Sticky Banner
  ========================================================================== */
  /* ==========================================================================
  1g. Black Friday 2021 Video Paywall
  ========================================================================== */
  /**
   *
   * Newsletter
   *
   * Custom layouts for the newsletter page
   *
   *
   * 1. Hero
   *
   * 2. Benefits
   *
   *
   **/
  /* ==========================================================================
  1. Hero
  ========================================================================== */
  /* ==========================================================================
  1. Benefits
  ========================================================================== */
  /**
   *
   * Home
   *
   *
   *
   * 1. Hero
   *
   * 2. Pillars
   *
   * 3. Top Tutorials
   *
   * 4. Our Community
   *
   * 5. Wrapper
   *
   * 6. Getting Started
   *
   **/
  /* ==========================================================================
  1. Hero
  ========================================================================== */
  /* ==========================================================================
  2. Pillars
  ========================================================================== */
  /* Adjustments for beta pillars */
  /* Designs for each pillar */
  /* ==========================================================================
  3. Top Tutorials
  ========================================================================== */
  /* ==========================================================================
  4. Our Community
  ========================================================================== */
  /* ==========================================================================
  5. Tutorials
  ========================================================================== */
  /* ==========================================================================
  6. Logged in homepage
  ========================================================================== */
  /* ==========================================================================
  6. Getting Started
  ========================================================================== */
  /* ==========================================================================
  7. Videos & Screencasts
  ========================================================================== */
  /* ==========================================================================
  7. Continue Watching
  ========================================================================== */
  /* ==========================================================================
  9. Upcoming
  ========================================================================== */
  /* ==========================================================================
  8. New Tutorials w/ Sidebar
  ========================================================================== */
  /* ==========================================================================
  9. Announcements
  ========================================================================== */
  /* ==========================================================================
  10. Books
  ========================================================================== */
  /* ==========================================================================
  11. Recommendations/ Top Picks for You
  ========================================================================== */
  /* ==========================================================================
  5. Container
  ========================================================================== */
  /**
   *
   * Home (Teaspoon Launch)
   *
   *
   * a. Wrapper
   *
   * 1a. Hero (Top)
   *
   * 1b. Hero (Bottom)
   *
   * 2. Promo Video
   *
   * 3. Platforms
   *
   * 4. Our Community
   *
   * 5. Tutorials
   *
   * 6. Why choose
   *
   **/
  /* ==========================================================================
  a. Wrapper
  ========================================================================== */
  /* ==========================================================================
  1a. Hero (Top)
  ========================================================================== */
  /* ==========================================================================
  1b. Hero (Bottom)
  ========================================================================== */
  /* ==========================================================================
  2. Promo Video
  ========================================================================== */
  /* ==========================================================================
  3. Platforms
  ========================================================================== */
  /* ==========================================================================
  4. Our Community
  ========================================================================== */
  /* ==========================================================================
  5. Tutorials
  ========================================================================== */
  /* ==========================================================================
  6. Why Choose
  ========================================================================== */
  /**
   *
   * Home (2022)
   *
   * 1. Layout Grid
   *
   * 2. Scrollable Contianers (Mobile)
   * 
   * 3. Popular Searches
   * 
   * 4. New Content
   * 
   * 5. Recommended
   * 
   * 6. My Books
   *
   **/
  /* ==========================================================================
  1. Layout Grid
  ========================================================================== */
  /* ==========================================================================
  2. Scrollable Containers (Mobile)
  ========================================================================== */
  /* ==========================================================================
  3. Popular Searches
  ========================================================================== */
  /* ==========================================================================
  4. New Content
  ========================================================================== */
  /* ==========================================================================
  5. Recommended
  ========================================================================== */
  /* ==========================================================================
  6. My Books
  ========================================================================== */
  /**
  *
  * Onboarding
  *
  * Layouts for onboarding views
  *
  * X. Illustration Background (Deprecated)
  *
  * X. Interest Cards (Deprecated)
  *
  * X. Skills Cards (Deprecated)
  *
  * X. Payment Cards (Deprecated)
  *
  * X. Black Friday Payment Cards (Deprecated)
  *
  * X. Flourish (Deprecated)
  * 
  * 1. Hello
  * 
  * 2. Topics
  * 
  * 3. Questions
  * 
  * 4. Reasons
  * 
  * 5. Header
  *
  **/
  /* ==========================================================================
  a. Illustration Background (Deprecated)
  ========================================================================== */
  /* ==========================================================================
  1. Interest Cards (Deprecated)
  ========================================================================== */
  /* ==========================================================================
  2. Skill Cards (Deprecated)
  ========================================================================== */
  /* ==========================================================================
  3a. Payment (Deprecated)
  ========================================================================== */
  /* ==========================================================================
  3b. Payment (Black Friday) (Deprecated)
  ========================================================================== */
  /* ==========================================================================
  X. Flourish (Deprecated)
  ========================================================================== */
  /* ==========================================================================
  1. Hello
  ========================================================================== */
  /* ==========================================================================
  2. Topics
  ========================================================================== */
  /* ==========================================================================
  3. Questions
  ========================================================================== */
  /* ==========================================================================
  4. Reason
  ========================================================================== */
  /* ==========================================================================
  5. Header
  ========================================================================== */
  /**
   *
   * About
   *
   *
   *
   * 1. Hero
   *
   * 2. Stats
   *
   * 3. Team
   *
   *
   **/
  /* ==========================================================================
  1. Hero
  ========================================================================== */
  /* ==========================================================================
  2. Stats
  ========================================================================== */
  /* ==========================================================================
  3. Team
  ========================================================================== */
  /* ==========================================================================
  4. Join Team
  ========================================================================== */
  /**
   *
   * Library
   *
   * Custom layouts for the library page
   *
   *
   * 1. Wrapper
   *
   * 2. Added Filters
   *
   *
   **/
  /* ==========================================================================
  1. Wrapper
  ========================================================================== */
  /* ==========================================================================
  2. Added Filters
  ========================================================================== */
  /**
  * Article Layouts
  *
  * Custom classes for articles
  *
  * 1. Contributors
  *
  * 2. Community Care
  *
  * 3. Article profile
  *
  */
  /* ==========================================================================
  1. Contributors
  ========================================================================== */
  /* ==========================================================================
  2. Community Care
  ========================================================================== */
  /* ==========================================================================
  * 3. Article profile
  ========================================================================== */
  /**
   *
   * Menu Layouts
   *
   * For use on menu objects
   *
   * 1. Layouts for menus (dropdowns etc.)
   *
   *
   **/
  /* ==========================================================================
  1. Custom Layouts
  ========================================================================== */
  /**
   *
   * Bookmarks
   *
   * For use on bookmark objects, components and pages
   *
   * 1. Buttons on mobile
   *
   * 2. Remove button on mobile
   *
   *
   **/
  /* ==========================================================================
  1. Buttons on mobile
  ========================================================================== */
  /* A hacky approach to convert bookmark buttons to icons on mobile*/
  /* ==========================================================================
  1a. Button as icon (same as above without media query)
  ========================================================================== */
  /* ==========================================================================
  2. Remove button position on mobile
  ========================================================================== */
  /**
   *
   * Rating Layouts
   *
   * For use on rating components
   *
   * 1. Video
   *
   **/
  /* ==========================================================================
  1. Video (Footer)
  ========================================================================== */
  /* ==========================================================================
  X. Collection (Footer)
  ========================================================================== */
  /* ==========================================================================
  X. Article (Footer)
  ========================================================================== */
  /* ==========================================================================
  X. Books
  ========================================================================== */
  /**
   *
   * Grids
   *
   *
   *
   * 1. Bookshelf (5 books)
   * 
   * 2. New content (Homepage)
   *
   *
   **/
  /* ==========================================================================
  1. Bookshelf (5 books)
  ========================================================================== */
  /* ==========================================================================
  2. New content (Homepage)
  ========================================================================== */
  /**
   *
   * Night Mode
   *
   *
   * 1. Global
   *
   * 2. Skeletons
   *
   * 3. Authors
   *
   * 4a. Tutorials
   *
   * 4b. Platforms
   *
   * 5. Videos
   *
   * 6. Homepage (Logged In)
   *
   * 7. Homepage (Logged Out)
   *
   * 8. Domains
   *
   * 9. Library
   *
   * 10. Paths
   *
   * 11. Article
   *
   * 12. About
   *
   * 13. Onboarding
   *
   * 14. Testimonials
   *
   * 15. Ratings
   *
   * 16. Newsletter
   *
   * 17. Video Collection Home Custom
   *
   * 18. FAQ
   *
   * 19. Homepage (Sections)
   *
   * 20. Profile
   *
   * 21. Book Chapters
   *
   * 22. Book Home
   *
   * 23. Pagination
   *
   * 24. Adverts
   *
   * 25. Sidebars
   *
   * 25. Mobile Navigator
   *
   * 27. Empty States
   *
   * 28. Dropdowns
   *
   * 29. Modals
   *
   * 30. Carbon Ads
   *
   * 31. Achievements
   *
   * 32. Ratings & Reviews
   *
   * 33. Cards
   *
   * 34. Counters
   *
   * 35. Checklists
   *
   * 36. Checkbox (Toggle)
   *
   * 37. Progress Indicator (HTML)
   *
   * 38. Upcoming for Subscribers Cards
   *
   * X. Apply to CSS
   *
   **/
  /* ==========================================================================
  1. Dark styles as a placeholder to use for JS and OS with single stylesheet
  ========================================================================== */
  /* ==========================================================================
  Apply to CSS with class
  ========================================================================== */
  /**
   *
   * SVG
   *
   *
   *
   * 1. Custom Sizes
   *
   * 2. Colors
   *
   *
   **/
  /* ==========================================================================
  1. Custom sizes
  ========================================================================== */
  /* ==========================================================================
  2. Colors
  ========================================================================== */
  /**
   *
   * Carbon ads custom CSS classes to fix layout, display and positioning 
   *
   * 1. Content
   * 
   * 2. Sidebar
   * 
   * 3. Footer
   *
   *
   *
   **/
  /* ==========================================================================
  1. Content
  ========================================================================== */
  /* ==========================================================================
  2. Sidebar
  ========================================================================== */
  /* ==========================================================================
  3. Footer
  ========================================================================== */
  /**
   * Navigation components
   *
   * 1. Sidebar - Branded sidebar can be used anywhere as alternative navigation to horizontal use layout modifiers to change width
   *
   * 1a. Sidebar Article
   *
   * 1b. Sidebar Article (White)
   *
   * 1c. My Interests - Logged in homepage
   *
   * 1d. Sidebar (Book)
   *
   * 2. Toggle States for Mobile Menus
   *
   * 3. Main Navigation
   *
   * 4. Explore: Dropdown Menu
   *
   * 5. User: Dropdown Menu
   *
   * 6. Pillar Navigation
   *
   * 7. Footer
   *
   * 8. Tabs
   *
   * 9. Mobile Navigator
   *
   * 10. Book Navigation
   *
   * 11. Paginator
   *
   */
  /* ==========================================================================
    1. Sidebar
    ========================================================================== */
  /* ==========================================================================
  1a. Sidebar Article
  ========================================================================== */
  /* ==========================================================================
  1b. Sidebar Article (White)
  ========================================================================== */
  /* ==========================================================================
  1b. Sidebar Article Navigation
  ========================================================================== */
  /* ==========================================================================
  1c. Sidebar My Interests
  ========================================================================== */
  /* ==========================================================================
  1b. Sidebar Admin (Open)
  ========================================================================== */
  /* ==========================================================================
  1d. Sidebar Book
  ========================================================================== */
  /* ==========================================================================
     2. Toggle States for Mobile Menus
     ========================================================================== */
  /* ==========================================================================
     3. Main Navigation
     ========================================================================== */
  /* ==========================================================================
     4. Explore: Dropdown Menu
     ========================================================================== */
  /* ==========================================================================
  5. User: Dropdown Menu
  ========================================================================== */
  /* ==========================================================================
  6. Pillar Navigation
  ========================================================================== */
  /* ==========================================================================
  6. Footer
  ========================================================================== */
  /* ==========================================================================
  8. Tabs (Content)
  ========================================================================== */
  /* ==========================================================================
  8b. Tabs (Navigation)
  ========================================================================== */
  /* ==========================================================================
     9. Mobile Navigator
     ========================================================================== */
  /* ==========================================================================
     10. Book Navigation
     ========================================================================== */
  /* ==========================================================================
     11. Paginator
     ========================================================================== */
  /**
   * Notifications
   *
   * Notify the user via a modal/popup when they earn a badge for example
   * 
   * 1. Badge/Achievements Notifications
   *
   */
  /* ==========================================================================
     1. Badge/Achievements Notifications
     ========================================================================== */
  /**
  * Form Components
  *
  * Used with objects/inputs.scss
  *
  * 1. Title - Adds a title to group form inputs by context
  *
  * 2. Paragraph and CTA
  *
  * 3. Image/File Upload
  *
  * 4. Sign In / Sign Up Form
  *
  * 5. Single input and CTA
  *
  */
  /* ==========================================================================
  1. Title
  ========================================================================== */
  /* ==========================================================================
  2. Paragraph and CTA
  ========================================================================== */
  /* ==========================================================================
  3. Image/File Upload
  ========================================================================== */
  /* ==========================================================================
  4. Sign In / Sign Up Form
  ========================================================================== */
  /* ==========================================================================
  5. Single input and CTA
  ========================================================================== */
  /*
   * Lists
   *
   * Powerful components you can use to create tables, lists
   *
   * 1. Wrapper - Gives the list item or table a background.
   *
   * 2. Table row - Can be used to create floating lists of content.
   *
   * 3. Table - Modifies the table row component to create a seamless list/table of connected content.
   *
   * 4. Table of Contents
   *
   * 5. Custom layout classes
   *
   * 6a. Onboarding Progress (Square)
   *
   * 6b. Onboarding Progress (Circular)
   *
   * 7. Item list with icons
   *
   * 8. Filter list
   *
   * 9. Version history
   *
   * 10. Onboarding Checklist
   *
   * 
   */
  /* ==========================================================================
    1. Wrapper
    ========================================================================== */
  /* ==========================================================================
    2. Table row
    ========================================================================== */
  /* ==========================================================================
    3. Table
    ========================================================================== */
  /* ==========================================================================
   4. Box list - Checkbox style list
   ========================================================================== */
  /* ==========================================================================
  5. Custom layout classes
  ========================================================================== */
  /* ==========================================================================
  6a. Onboarding Progress (Square)
  ========================================================================== */
  /* ==========================================================================
  6b. Onboarding Progress (Circular)
  ========================================================================== */
  /* ==========================================================================
  7. Item list with icons
  ========================================================================== */
  /* ==========================================================================
     8. Filter list
     ========================================================================== */
  /* ==========================================================================
     9. Version history
     ========================================================================== */
  /* ==========================================================================
     10. Activity Checklist
     ========================================================================== */
  /**
   * drapers
   *
   * Floating card drapers containing title, paragraph, graphic and link
   *
   * 1. Admin drapers
   *
   * 2. Custom layout classes
   *
   * 3. Banner draper - Base component for common drapers
   *
   * 4. Banner draper - Pillar variations
   *
   * 5. Banner draper - User variations (create account, newsletter)
   *
   * 6. Related - Products at the end of tutorials
   *
   * 7. Bottom Sticky - A banner that's fixed to bottom of the page
   *
   * 8. Pricing cards
   *
   * 9. Single Line Banner
   *
   * 10. Sales promotions
   *
   */
  /* ==========================================================================
   1. Admin drapers
   ========================================================================== */
  /* ==========================================================================
     2. Custom layout classes
     ========================================================================== */
  /* ==========================================================================
     3. Banner draper - Used for drapers and pillar heros
     ========================================================================== */
  /* ==========================================================================
     4. Banner draper - Pillar variations (iOS, Android, Unity, Unreal)
     ========================================================================== */
  /* iOS */
  /* Android */
  /* Server Side Swift */
  /* Unity */
  /* Flutter */
  /* Unreal Engine */
  /* macOS */
  /* archive */
  /* archive */
  /* mobile app */
  /* ==========================================================================
  5. Banner draper - Campaign variations
  ========================================================================== */
  /* Create Account */
  /* Newsletter */
  /* Subscription */
  /* Learning Path Android */
  /* ==========================================================================
  6. Related
  ========================================================================== */
  /* Related banner design */
  /* Related content banner design */
  /* ==========================================================================
  7. Bottom banner
  ========================================================================== */
  /* ==========================================================================
  8. Pricing cards
  ========================================================================== */
  /* ==========================================================================
     10a. Sales Promotions (Teaspoon)
     ========================================================================== */
  /* ==========================================================================
     10a. Sales Promotions (Black Friday 2020)
     ========================================================================== */
  /* ==========================================================================
  10b. Sales Promotions (Spring Ahead 2021)
  ========================================================================== */
  /* ==========================================================================
    11a. Community Header
    ========================================================================== */
  /* ==========================================================================
    11b. Community Hack (Change widths of tutorial layouts)
    ========================================================================== */
  /* ==========================================================================
    11c. Community Adverts
    ========================================================================== */
  /**
  * Modal component
  *
  * Customisable to have header, content, form inputs and CTA
  *
  * Use c-modal__description--scroll class on content to limit height.
  *
  * 1. Modal
  *
  * 2. Account Sign Up
  *
  * 3. Subscribe
  *
  * 4. Highlighting
  *
  * 5. Video Trailer
  *
  * 6. Video Tutorial
  *
  */
  /* ==========================================================================
    1. Modal
    ========================================================================== */
  /* ==========================================================================
  2. Account Sign Up
  ========================================================================== */
  /* ==========================================================================
  3. Subscribe
  ========================================================================== */
  /* ==========================================================================
  4. Highlighting
  ========================================================================== */
  /* ==========================================================================
  5. Video Trailer
  ========================================================================== */
  /* ==========================================================================
  6. Video Tutorial
  ========================================================================== */
  /**
   * Skeleton components
   *
   */
  /* ==========================================================================
     1. Base
     ========================================================================== */
  /* ==========================================================================
     2. Objects
     ========================================================================== */
  /* ==========================================================================
     3. Component - Admin Sidebar
     ========================================================================== */
  /* ==========================================================================
    4. Component - Admin Main
    ========================================================================== */
  /**
   * Tutorials
   *
   * Tutorial cards form the base of all tutorials advertisements around the site
   *
   * NOTE - All modifiers should be added to the wrapper/container not the tutorial itself
   *
   * 1. Base: The most common tutorial card items
   *
   * 2. Card modifier
   *
   * 3. List modifier
   *
   * 3d. Progress List modifier
   *
   * 5. Featured modifier
   *
   * 6. Badge modifier (Author, Number, Checkmark)
   *
   * 7. Contributor modifier (Role in tutorial)
   *
   * 8. Mini modifier
   *
   * 9. Episode
   *
   * 10. Large Card modifier
   *
   * 11. Dark modifier
   *
   * 12. Mason modifier
   *
   * 13. Artwork size modifier for mason
   *
   * 14. Mason bookmark
   *
   * 15. Mark as complete
   *
   * 16. White backgroudn modifier
   *
   * 17. Floating button
   *
   * 18. Book
   *
   * 19. Editable
   *
   * 20. No Margin
   *
   * 21. CTA-Card for Community Page (Large image modifier)
   *
   */
  /* ==========================================================================
   1. Base
   ========================================================================== */
  /* ==========================================================================
   2. Card modifier (add to container not the tutorial)
   ========================================================================== */
  /* ==========================================================================
   3a. List modifier (add to container not the tutorial)
   ========================================================================== */
  /* ==========================================================================
   3b. Basic list modifier (add to container not the tutorial)
   ========================================================================== */
  /* ==========================================================================
   3c. Complex list modifier (add to container not the tutorial)
   ========================================================================== */
  /* ==========================================================================
   3d. Progress list modifier (list of in progress tutorial)
   ========================================================================== */
  /* ==========================================================================
   5. Featured modifier (add to container not the tutorial)
   ========================================================================== */
  /* ==========================================================================
   6. Number modifier (add to container not the tutorial)
   ========================================================================== */
  /* ==========================================================================
   7. Contributor modifier (role)
   ========================================================================== */
  /* ==========================================================================
   8. Mini modifier
   ========================================================================== */
  /* ==========================================================================
  9. Episode
  ========================================================================== */
  /* ==========================================================================
  10. Advert
  ========================================================================== */
  /* ==========================================================================
  10. Learning Path Modifiers
  ========================================================================== */
  /* ==========================================================================
  11. Dark Modifier
  ========================================================================== */
  /* ==========================================================================
  12. Mason Modifier
  ========================================================================== */
  /* ==========================================================================
  12a. Artwork size modifier for mason
  ========================================================================== */
  /* ==========================================================================
  12b. Mason Large Modifier
  ========================================================================== */
  /* ==========================================================================
  12c. Mason Art Modifier
  ========================================================================== */
  /* ==========================================================================
  12c. Mason Modifier Small
  ========================================================================== */
  /* ==========================================================================
  14. If user is signed make room for the bookmark on mason
  ========================================================================== */
  /* ==========================================================================
   3. Number modifier (add to list view to fix layout)
   ========================================================================== */
  /* ==========================================================================
  15. Mark as complete button
  ========================================================================== */
  /* ==========================================================================
  16. White background modifier
  ========================================================================== */
  /* ==========================================================================
  17. Floating button
  ========================================================================== */
  /* ==========================================================================
  18. Book
  ========================================================================== */
  /* ==========================================================================
  19. Editable
  ========================================================================== */
  /* ==========================================================================
  20. No Margins
  ========================================================================== */
  /* ==========================================================================
  21. CTA Card
  ========================================================================== */
  /**
   * Video
   *
   *
   * 1. Player
   *
   * 2. Navigation
   *
   * 3a. Complete / Autoplay
   *
   * 3b. Complete / Up Next
   *
   * 4. Paywall
   *
   * 5. Black Friday Paywall
   *
   * 6. Video Information
   *
   * 7. Promo Video
   *
   * 8. Preview
   *
   * 9. Cinema Mode
   *
   * 10. Controls (Subheader)
   *
   * 11. Authors
   *
   * 12. Comments
   *
   */
  /* ==========================================================================
   1. Player
   ========================================================================== */
  /* ==========================================================================
   2. Navigation
   ========================================================================== */
  /* ==========================================================================
   3a. Complete - Autoplay
   ========================================================================== */
  /* ==========================================================================
   3b. Complete - Up Next
   ========================================================================== */
  /* ==========================================================================
  4. Paywall
  ========================================================================== */
  /* Need a different layout when the sidebar is open */
  /* ==========================================================================
  5. Black Friday Paywall
  ========================================================================== */
  /* Layout adjustments for tablet devices */
  /* Layout adjustments for open lesson navigation */
  /* ==========================================================================
  6. Spring Free Weekend
  ========================================================================== */
  /* ==========================================================================
  5. Spring Free Weekend
  ========================================================================== */
  /* ==========================================================================
  5b. Spring Ahead 2021
  ========================================================================== */
  /* ==========================================================================
  6. Video Information
  ========================================================================== */
  /* ==========================================================================
  7. Promo Video
  ========================================================================== */
  /* ==========================================================================
  8. Preview
  ========================================================================== */
  /* ==========================================================================
  9. Cinema Mode
  ========================================================================== */
  /* ==========================================================================
  10. Controls (Subheader)
  ========================================================================== */
  /* ==========================================================================
  11a. Metadata
  ========================================================================== */
  /* ==========================================================================
  11a. Transcripts
  ========================================================================== */
  /* ==========================================================================
  11b. Authors
  ========================================================================== */
  /* ==========================================================================
  11c. Comments
  ========================================================================== */
  /**
   * Content
   *
   * Components for written tutorials, videos and screencasts
   *
   * 1. Written Tutorial
   *
   * 1a. Written Tutorial (Dark)
   *
   * 1b. Written Tutorial (Event)
   *
   * 2. Light code blocks
   *
   * 3. Admin Edit Banner
   *
   * 4. Sticky Options Banner
   *
   * 5. Book Chapter
   *
   * 5a. Book Chapter (Dedications)
   *
   */
  /* ==========================================================================
   1. Written Tutorial
   ========================================================================== */
  /* ==========================================================================
   1b. Written Tutorial (Event)
   ========================================================================== */
  /* ==========================================================================
   2. Code block modifier to light
   ========================================================================== */
  /* ==========================================================================
   3. Admin Edit Banner
   ========================================================================== */
  /* ==========================================================================
   4. Sticky Options Banner
   ========================================================================== */
  /* ==========================================================================
   5. Book Chapter
   ========================================================================== */
  /* ==========================================================================
   5a. Book Chapter (Dedications)
   ========================================================================== */
  /* ==========================================================================
   5b. Book Chapter (Team)
   ========================================================================== */
  /**
   * Search
   *
   * Search component styles
   *
   * 1. Search box
   *
   * 2. Search box overlay
   *
   * 3. Library - Platform filter
   *
   * 4. Library - Filters
   *
   * 5. Library - Controls
   *
   * 6. Loading Results
   *
   * 7. No Results
   *
   * 8. Book Search
   *
   *
   */
  /* ==========================================================================
   1. Search box
   ========================================================================== */
  /* ==========================================================================
   2. Search box overlay
   ========================================================================== */
  /* ==========================================================================
   3. Library - Platform filter
   ========================================================================== */
  /* ==========================================================================
   4. Library - Filters
   ========================================================================== */
  /* ==========================================================================
  5. Library - Filters Open
  ========================================================================== */
  /* ==========================================================================
  5. Library - Controls
  ========================================================================== */
  /* ==========================================================================
  6. Loading Results
  ========================================================================== */
  /* ==========================================================================
  7. No Results
  ========================================================================== */
  /* ==========================================================================
  8. Book Search
  ========================================================================== */
  /**
   * Authors
   *
   *
   * 1a. Content Author
   *
   * 1b. Content Author (Dark)
   *
   * 2. Card Style Alternative
   *
   * 3. Testimonial modifier
   *
   */
  /* ==========================================================================
  1a. Content Author
  ========================================================================== */
  /* ==========================================================================
  1b. Content Author (Dark)
  ========================================================================== */
  /* ==========================================================================
  2. Content Author (Card Style)
  ========================================================================== */
  /* ==========================================================================
  3. Add quote flourish to card
  ========================================================================== */
  /**
   * Users
   *
   *
   * 1. Profile grid
   *
   * 2. Profile sidebar
   *
   * 3. Empty
   *
   * 4. Tutorials
   *
   */
  /* ==========================================================================
  1. Profile grid
  ========================================================================== */
  /* ==========================================================================
  2. Profile sidebar
  ========================================================================== */
  /* ==========================================================================
  3. Profile empty
  ========================================================================== */
  /* ==========================================================================
  4. Tutorials
  ========================================================================== */
  /**
   * Social
   *
   * 1. Forum Comments
   *
   *
   */
  /* ==========================================================================
   1. Forum Comments
   ========================================================================== */
  /**
   * Empty State Components
   *
   *
   * 1. Basic empty state
   *
   * 2. Android
   *
   * 3. File Loader
   *
   * 4. Following
   *
   * 5. Suggestions
   *
   */
  /* ==========================================================================
   1. Basic
   ========================================================================== */
  /* ==========================================================================
   2. Android
   ========================================================================== */
  /* ==========================================================================
   3. File Loader
   ========================================================================== */
  /* ==========================================================================
   4. Following
   ========================================================================== */
  /* ==========================================================================
   5. Suggestions
   ========================================================================== */
  /* ==========================================================================
   6. Illustration + Messaging
   ========================================================================== */
  /**
   * Testimonials
   *
   * 1. Testimonial component to use everywhere
   *
   * 2. Testimonials (Twitter Version)
   *
   */
  /* A common wrapper for displaying a grid of testimonials */
  /* A single testimonial */
  /* ==========================================================================
  2. Testimonials (Twitter Version)
  ========================================================================== */
  /* A single testimonial */
  /**
  * Cards
  *
  * Designs for card style components
  *
  * 1. Follow Pillar Card
  *
  * 2. Skill Level Card
  *
  * 3. Plan Card
  *
  * 4a. Card Platform
  *
  * 4b. Card Platform Variations
  * 
  * 5. Option Card
  * 
  * 6. Simple Card
  * 
  * 7. Path Progress Card
  *
  *
  */
  /* ==========================================================================
  1. Follow Pillar Card
  ========================================================================== */
  /* ==========================================================================
  2. Skill Level Card
  ========================================================================== */
  /* ==========================================================================
  3. Plan Card
  ========================================================================== */
  /* ==========================================================================
  3. Plan Card (Neon)
  ========================================================================== */
  /* ==========================================================================
  4a. Card Platform
  ========================================================================== */
  /* ==========================================================================
  4b. Card Platform Variations
  ========================================================================== */
  /* ==========================================================================
  5. Option card
  ========================================================================== */
  /* ==========================================================================
  6. Simple card
  ========================================================================== */
  /* ==========================================================================
  7. Path Progress card
  ========================================================================== */
  /**
   * <noscript /> components
   *
   * 1. Body insert
   *
   */
  /* ==========================================================================
    1. body
    ========================================================================== */
  /**
  * FAQ component
  *
  * Styles for Q & A's
  *
  * 1. FAQ
  *
  */
  /* ==========================================================================
     1. FAQ
     ========================================================================== */
  /**
  * Rating components
  *
  * 1. Review Module (Invert colors for books and articles)
  *
  * 2. Review Module
  *
  * 3. Star Rating
  *
  * 4. Review Card
  *
  * 5. Review Questions
  *
  */
  /* ==========================================================================
  1. Review Module (Invert colors for books and articles)
  ========================================================================== */
  /* ==========================================================================
  2. Review Module
  ========================================================================== */
  /* ==========================================================================
  3. Star Rating
  ========================================================================== */
  /* ==========================================================================
  4. Review Card
  ========================================================================== */
  /* ==========================================================================
  5. Review Questions
  ========================================================================== */
  /* ==========================================================================
  6. Modal
  ========================================================================== */
  /**
  * Reading Experience Tools
  *
  * 1a. Notebook & Highlighting
  *
  * 1b. Highlighter Colors
  *
  * 2. Reading Experience Widget
  *
  */
  /* ==========================================================================
     1a. Notebook & Highlighting
     ========================================================================== */
  /* ==========================================================================
     1b. Highlighter Colors
     ========================================================================== */
  /* ==========================================================================
     2. Reading Experience Widget
     ========================================================================== */
  /* ==========================================================================
    2a. Cross browser range track styles
    ========================================================================== */
  /* ==========================================================================
     2b. Cross browser range thumb styles
     ========================================================================== */
  /**
   * Books
   *
   *
   * 1. Book List 
   *
   *
   */
  /* ==========================================================================
   1. Book List
   ========================================================================== */
  /**
   * Drawer: Off-screen component for filters, controls and anythign else (show/hide with JS)
   *
   * 1. Drawer 
   *
   */
  /* ==========================================================================
  1. Drawer
  ========================================================================== */
  /**
   * Utility classes are helper classes that perform one thing extremely well.
   *
   * They do it so well, they override everything else.
   *
   * As such, they often only contain one property, and they include the !important declaration.
   *
   * 1. Show/Hide states for mobile screens
   *
   */
  /* ==========================================================================
    1. Show/Hide states for mobile screens
    ========================================================================== */
  /* ==========================================================================
    2. Toggle dropdown menu on hover
    ========================================================================== */
  /* ==========================================================================
  3. Show / Hide
  ========================================================================== */
  /**
   * A reserved place for nasty CSS hacks.
   *
   * If you need to add a quick fix for a live bug, constrained by time or something else. Add it here.
   *
   * This keeps the ‘main’ codebase clean and ensures these hacks don’t go unnoticed and unresolved.
   *
   */
  /*** Text Size ***/
  /* Community Page Double Banner Image */
  /* Add/Remove highlighted transcripts background */
  /* ==========================================================================
  X. Typography
  ========================================================================== */
  @import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500&family=IBM+Plex+Sans:wght@500&display=swap");
  /* ==========================================================================
  X. Arrows
  ========================================================================== */
  /* ==========================================================================
  X. Night Mode
  ========================================================================== */
  /**
   * Code Blocks
   *
   * Components for written tutorials, videos and screencasts
   *
   * 1. Dark (Default) No class needed
   *
   * 2. Lite Add class .l-written-tutorial--light to the parent
   *
   */
  /* ==========================================================================
   1. Dark (Default) Code Blocks
   ========================================================================== */
  /* Comment */
  /* Red */
  /* Orange */
  /* Yellow */
  /* Green */
  /* Aqua */
  /* Blue */
  /* Purple */
  /* ==========================================================================
   2. Light Code Blocks add class .l-written-tutorial--light to parent
   ========================================================================== */
  /* Comment */
  /* Red */
  /* Orange */
  /* Yellow */
  /* Green */
  /* Aqua */
  /* Blue */
  /* Purple */
}
@media screen and (max-width: 600px) {
  h1 {
    font-size: 1.875rem;
  }
}
@media screen {
  h2 {
    font-size: 1.875rem;
    line-height: 1.25;
  }
}
@media screen {
  h3 {
    font-size: 1.5rem;
    line-height: 1.35;
  }
}
@media screen {
  h4 {
    font-size: 1.3125rem; /* 21/16 */
    line-height: 1.35;
  }
}
@media screen {
  p {
    font-size: 1.0625rem;
  }
}
@media screen and (max-width: 600px) {
  p {
    font-size: 0.9375rem;
  }
}
@media screen {
  .o-dropdown-menu {
    background: #ffffff;
    border-radius: 0.5625rem;
    box-shadow: 0 2px 4px 0px rgba(0, 0, 0, 0.1);
    padding: 12px 0;
    width: 320px;
    position: absolute;
    z-index: 99999;
    display: none;
  }
  .o-dropdown-menu:before {
    content: "";
    position: absolute;
    background: #ffffff;
    top: -6px;
    left: 50%;
    width: 18px;
    height: 18px;
    margin-left: -6px;
    transform: rotate(45deg);
    border-radius: 3px;
  }
  .o-dropdown-menu:after {
    content: "";
    position: absolute;
    top: -20px;
    left: 0;
    width: 100%;
    height: 20px;
  }
  .o-dropdown-menu li {
    display: flex;
    align-items: center;
    height: 54px;
    font-family: "Bitter", serif;
    padding: 0 24px;
  }
  .o-dropdown-menu li > a, .o-dropdown-menu li > div > button {
    font-size: 1.0625rem !important; /* 17/16 */
    margin-left: 0 !important;
    width: 100%;
    color: #333333 !important;
  }
  .o-dropdown-menu li > a:hover, .o-dropdown-menu li > div > button:hover {
    color: #158443 !important;
  }
  .o-dropdown-menu li i {
    min-width: 34px;
    height: 34px;
    margin-right: 15px;
  }
}
@media screen {
  .o-dropdown-menu--accessible {
    display: block;
  }
}
@media screen {
  .o-dropdown-menu--actions {
    width: 240px;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
  }
  .o-dropdown-menu--actions li {
    height: 40px;
    padding: 0 18px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.875rem; /* 14/16 */
  }
  .o-dropdown-menu--actions li a {
    font-size: 0.875rem !important; /* 14/16 */
    cursor: pointer;
  }
  .o-dropdown-menu--actions li button {
    font-size: 0.875rem !important; /* 14/16 */
    cursor: pointer;
  }
}
@media screen {
  .o-dropdown-menu--actions-left {
    top: 48px;
    left: -30px;
  }
  .o-dropdown-menu--actions-left:before {
    top: -3px;
    left: 45px;
  }
}
@media screen {
  .o-dropdown-menu--actions-right {
    top: 48px;
    right: -30px;
  }
  .o-dropdown-menu--actions-right:before {
    top: -3px;
    right: 39px;
    left: auto;
  }
}
@media screen {
  .o-button {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
  }
}
@media screen {
  .o-button--green {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #158443;
  }
  .o-button--green:hover {
    background: #17914a;
  }
}
@media screen {
  .o-button--blue {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #157CB8;
  }
  .o-button--blue:hover {
    background: #1785c6;
  }
}
@media screen {
  .o-button--grey {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #6E7687;
  }
  .o-button--grey:hover {
    background: #757e8f;
  }
}
@media screen {
  .o-button--red {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #CF3B2B;
  }
  .o-button--red:hover {
    background: #d54434;
  }
}
@media screen {
  .o-button--orange {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #FD7401;
  }
  .o-button--orange:hover {
    background: #fe7c0f;
  }
}
@media screen {
  .o-button--dark {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #3B4048;
  }
  .o-button--dark:hover {
    background: #424750;
  }
}
@media screen {
  .o-button--black {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #333333;
  }
}
@media screen {
  .o-button--dark-outline {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #333333;
    border: 2px solid #3B4048;
  }
  .o-button--dark-outline:hover {
    border: 2px solid #73859F;
    background: #424750;
  }
}
@media screen {
  .o-button--green-outline {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: none;
    border: 2px solid #158443;
    color: #158443;
  }
}
@media screen {
  .o-button--white-outline {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: none;
    border: 2px solid #ffffff;
    color: #ffffff;
  }
}
@media screen {
  .o-button--light-green-with-outline {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #e3f0e8;
    border: 2px solid #158443;
    color: #158443;
  }
}
@media screen {
  .o-button--yellow {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #FCB526;
    color: #333333;
  }
  .o-button--yellow:hover {
    background: #fcba35;
  }
}
@media screen {
  .o-button--white-green {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #ffffff;
    color: #158443;
  }
}
@media screen {
  .o-button--white-blue {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #ffffff;
    color: #157CB8;
  }
}
@media screen {
  .o-button--white-black-slate {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #ffffff;
    color: #2F4F4F !important;
  }
}
@media screen {
  .o-button--twitter {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #1D83D1;
  }
  .o-button--twitter:hover {
    background: #1f8bde;
  }
}
@media screen {
  .o-button--neon-green {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #158443;
    box-shadow: 0 0 1vw #158443, 0 0 1vw #158443, 0 0 1vw #158443, 0 0 0.4vw #F9D91D;
    border: 2px solid #199E50;
  }
}
@media screen and (max-width: 600px) {
  .o-button--neon-green {
    border: 1px solid #199E50;
  }
}
@media screen {
  .o-button--neon-green:hover {
    background: #17914a;
  }
}
@media screen {
  .o-button--background-yellow {
    background: #F3B36A !important;
  }
  .o-button--background-yellow:hover {
    background: #f4ba78;
  }
}
@media screen {
  .o-button--background-blue {
    background: #157CB8 !important;
  }
  .o-button--background-blue:hover {
    background: #1785c6;
  }
}
@media screen {
  .o-button--disabled {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #DBDDE0;
    cursor: not-allowed;
  }
  .o-button--disabled:hover {
    background: #DBDDE0 !important;
  }
}
@media screen {
  .o-button--disabled-svg {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: #DBDDE0;
    cursor: not-allowed;
  }
  .o-button--disabled-svg:hover {
    background: #DBDDE0 !important;
  }
  .o-button--disabled-svg svg {
    fill: #DBDDE0 !important;
  }
}
@media screen {
  .o-button--full-col {
    display: block;
    width: 100%;
  }
}
@media screen {
  .o-button--huge {
    height: 66px;
    line-height: 66px;
    padding: 0 18px;
  }
}
@media screen {
  .o-button--large {
    height: 50px;
    padding: 0 18px;
  }
}
@media screen {
  .o-button--small {
    height: 42px;
  }
}
@media screen {
  .o-button--smaller {
    height: 40px;
    line-height: 40px;
    font-size: 0.875rem;
    padding: 0 12px;
  }
}
@media screen {
  .o-button--mini {
    height: 36px;
    line-height: 36px;
    padding: 0 13px;
    font-size: 0.875rem;
  }
}
@media screen {
  .o-button--nano {
    height: 32px;
    line-height: 32px;
    padding: 0 13px;
    font-size: 0.75rem; /* 12/16 */
  }
}
@media screen and (max-width: 600px) {
  .o-button--shrink {
    height: 36px;
    line-height: 36px;
    padding: 0 12px;
    font-size: 0.875rem;
  }
  .o-button--shrink i {
    display: none;
  }
}
@media screen {
  .o-button-round {
    display: inline-flex;
    justify-content: center;
    height: 46px;
    line-height: 46px;
    font-family: "Bitter", serif;
    color: #ffffff;
    font-weight: 700;
    border-radius: 100px;
    font-size: 1.0625rem; /* 17/16 */
    padding: 0 30px;
    cursor: pointer;
  }
}
@media screen {
  .o-button-round--blue {
    background: #157CB8;
  }
}
@media screen {
  .o-button-round--green {
    background: #158443;
  }
}
@media screen {
  .o-button-round--disabled {
    background: #DBDDE0;
    color: #959DA5;
  }
}
@media screen {
  .o-button__icon--large {
    height: 27px !important;
    width: 27px !important;
  }
}
@media screen {
  .o-button__svg {
    position: absolute;
    top: 50%;
    left: 50%;
  }
}
@media screen {
  .o-button__svg--grey {
    fill: #6E7687;
  }
}
@media screen {
  .o-button__svg--medium-grey {
    fill: #CACED2;
  }
}
@media screen {
  .o-button__svg--grey-mako {
    fill: #434A53;
  }
}
@media screen {
  .o-button__svg--grey-chateau {
    fill: #A7ADB4;
  }
}
@media screen {
  .o-button__svg--grey-regent {
    fill: #959DA5;
  }
}
@media screen {
  .o-button__svg--light-grey {
    fill: #F2F6FA;
  }
}
@media screen {
  .o-button__svg--white {
    fill: #ffffff;
  }
}
@media screen {
  .o-button__svg--black {
    fill: #333333;
  }
}
@media screen {
  .o-button__svg--black-force {
    fill: #333333 !important;
  }
}
@media screen {
  .o-button__svg--green {
    fill: #158443;
  }
}
@media screen {
  .o-button__svg--red {
    fill: #CF3B2B;
  }
}
@media screen {
  .o-button__svg--orange {
    fill: #FD7401;
  }
}
@media screen {
  .o-button__svg--twitter {
    fill: #1D83D1;
  }
}
@media screen {
  .o-button__svg--highlighter-yellow {
    fill: #FFE242;
  }
}
@media screen {
  .o-button__svg--highlighter-orange {
    fill: #FBBC5D;
  }
}
@media screen {
  .o-button__svg--highlighter-red {
    fill: #E58A8A;
  }
}
@media screen {
  .o-button__svg--highlighter-purple {
    fill: #A0AEF2;
  }
}
@media screen {
  .o-button__svg--highlighter-blue {
    fill: #85DDE9;
  }
}
@media screen {
  .o-button__svg--highlighter-green {
    fill: #90DE9C;
  }
}
@media screen {
  .o-button__icon--white {
    background: #ffffff;
  }
}
@media screen {
  .o-button__icon--yellow {
    background: #FCB526;
  }
}
@media screen {
  .o-button__icon--black {
    background: #333333;
  }
}
@media screen {
  .o-button__icon--grey {
    background: #6E7687;
  }
}
@media screen {
  .o-button__icon--medium-grey {
    background: #CACED2;
  }
}
@media screen {
  .o-button__icon--green {
    background: #158443;
  }
}
@media screen {
  .o-button__icon--blue {
    background: #157CB8;
  }
}
@media screen {
  .o-button__icon--black-slate {
    background: #2F4F4F;
  }
}
@media screen {
  .o-button__icon--light-green {
    background: #e3f0e8;
  }
}
@media screen {
  .o-button__icon--input {
    border: 2px solid #ffffff;
  }
}
@media screen {
  .o-button__icon {
    display: inline-block;
    vertical-align: middle;
    height: 24px;
    width: 24px;
    border-radius: 0.5625rem;
    position: relative;
  }
}
@media screen {
  .o-button__icon--only {
    display: inline-block;
    vertical-align: middle;
    height: 24px;
    width: 24px;
    border-radius: 0.5625rem;
    position: relative;
  }
}
@media screen {
  .o-button__icon--left {
    display: inline-block;
    vertical-align: middle;
    height: 24px;
    width: 24px;
    border-radius: 0.5625rem;
    position: relative;
    margin-right: 10px;
  }
}
@media screen {
  .o-button__icon--right {
    display: inline-block;
    vertical-align: middle;
    height: 24px;
    width: 24px;
    border-radius: 0.5625rem;
    position: relative;
    margin-right: -2px;
    margin-left: 10px;
  }
}
@media screen {
  .o-button__icon--right-small {
    display: inline-block;
    vertical-align: middle;
    height: 15px;
    width: 15px;
    position: relative;
    margin-right: -2px;
    margin-left: 6px;
  }
}
@media screen {
  .o-button__icon--left-small {
    display: inline-block;
    vertical-align: middle;
    height: 15px;
    width: 15px;
    position: relative;
    margin-left: -2px;
    margin-right: 6px;
  }
}
@media screen {
  .o-button__loader-text {
    padding-left: 36px;
  }
}
@media screen {
  .o-button__loader-text--center {
    position: relative;
  }
  .o-button__loader-text--center .l-button__loader-pulse {
    left: -40px;
  }
}
@media screen {
  .l-button__loader-pulse {
    width: 32px;
    height: 32px;
    position: absolute;
    top: 50%;
    left: 10px;
    margin-top: -16px;
  }
}
@media screen {
  .o-icon-button {
    display: flex;
    align-items: center;
    width: 36px;
    height: 36px;
    background: #ffffff;
    border-radius: 0.5625rem;
    cursor: pointer;
  }
  .o-icon-button svg {
    display: block;
    margin: 0 auto;
  }
}
@media screen {
  .o-icon-button--small {
    width: 27px;
    height: 27px;
  }
}
@media screen {
  .o-icon-button--tiny {
    width: 24px;
    height: 24px;
  }
}
@media screen {
  .o-button__icon--dark-blue svg {
    fill: #3B4048;
  }
}
@media screen {
  .o-text-button {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    padding-left: 0;
    padding-right: 0;
    height: 24px;
    line-height: 24px;
    border-radius: 0;
  }
  .o-text-button:hover .o-button__label {
    text-decoration: underline;
  }
  .o-text-button .o-button__icon--right {
    margin-left: 8px;
    margin-top: 1px;
  }
}
@media screen {
  .o-text-button--green {
    color: #158443;
  }
}
@media screen {
  .o-text-button--black {
    color: #333333;
  }
}
@media screen {
  .o-text-button--clear:hover .o-button__label {
    text-decoration: none;
  }
}
@media screen {
  .o-text-button--label {
    position: relative;
  }
  .o-text-button--label:hover {
    text-decoration: none !important;
  }
  .o-text-button--label:hover:before {
    content: "";
    width: 100%;
    height: 2px;
    background: #6E7687;
    position: absolute;
    bottom: 0;
    left: 0;
  }
}
@media screen {
  .o-text-button--hover {
    position: relative;
    z-index: 0;
  }
  .o-text-button--hover:before {
    content: "";
    position: absolute;
    width: 130%;
    height: 140%;
    background: #EFF3F6;
    z-index: -1;
    border-radius: 0.5625rem;
    left: -12%;
    opacity: 0;
    transition: opacity all 0.3s ease-out;
  }
  .o-text-button--hover:hover:before {
    opacity: 1;
  }
}
@media screen {
  .o-input-button {
    background: #DCE0E7;
    text-transform: uppercase;
    font-size: 0.6875em; /* 11/16 */
    font-weight: 700;
    letter-spacing: 0.5px;
    border-radius: 0.5625rem;
    color: #ffffff;
    padding: 6px 10px 4px;
    cursor: pointer;
  }
  .o-input-button:hover {
    background: #B9C2CF;
  }
}
@media screen {
  .o-button-video {
    width: 96px;
    height: 96px;
    background: #333333;
    border: 6px solid #ffffff;
    border-radius: 21px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -48px 0 0 -48px;
    cursor: pointer;
    color: #ffffff;
  }
  .o-button-video:hover {
    background: #158443;
  }
  .o-button-video svg {
    position: absolute;
    width: 38px;
    height: 42px;
    fill: #ffffff;
    top: 50%;
    left: 50%;
    margin-top: -21px;
    margin-left: -17px;
  }
}
@media screen {
  .o-button-video-small {
    width: 60px;
    height: 60px;
    background: #333333;
    border: 4px solid #ffffff;
    border-radius: 16px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -30px 0 0 -30px;
    cursor: pointer;
    color: #ffffff;
  }
  .o-button-video-small:hover {
    background: #158443;
  }
  .o-button-video-small svg {
    position: absolute;
    width: 21px;
    height: 24px;
    fill: #ffffff;
    top: 50%;
    left: 50%;
    margin-top: -12px;
    margin-left: -10px;
  }
}
@media screen {
  .o-button-video-start {
    height: 76px;
    background: #333333;
    border: 6px solid #ffffff;
    border-radius: 12px;
    font-size: 1rem;
    padding: 0 27px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -38px 0 0 -103px;
  }
  .o-button-video-start:hover {
    background: #158443;
  }
  .o-button-video-start svg {
    width: 40px;
    height: 30px;
    fill: #ffffff;
    margin-left: -6px;
    margin-right: 6px;
  }
}
@media screen {
  .o-button-copy {
    width: 52px;
    height: 24px;
    background: rgba(86, 98, 115, 0.5);
    font-size: 0.6875rem; /* 11/16 */
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #ffffff;
    padding: 5px 9px 5px;
    border-radius: 0.5625rem;
    cursor: pointer;
    position: absolute;
    top: 12px;
    right: 45px;
    white-space: nowrap;
  }
  .o-button-copy:before {
    content: "Copy";
  }
  .o-button-copy:hover {
    background: #647388;
  }
}
@media screen {
  .o-button-code {
    width: 24px;
    height: 24px;
    background: rgba(86, 98, 115, 0.5);
    position: absolute;
    top: 12px;
    right: 15px;
    border-radius: 0.5625rem;
    cursor: pointer;
    background-image: url(/assets/svg-icons/light-0d5837a4fcf134d5de69d367f5d3b717ec4e8a54a1e903d337257d330836cbef.png);
    background-size: cover;
  }
  .o-button-code:hover {
    background: #647388;
    background-image: url(/assets/svg-icons/light-0d5837a4fcf134d5de69d367f5d3b717ec4e8a54a1e903d337257d330836cbef.png);
    background-size: cover;
  }
}
@media screen {
  .o-button-menu {
    width: 48px;
    height: 48px;
    z-index: 9999;
    position: absolute;
    left: 80px;
    z-index: 9999;
    background: #434A53;
    border-radius: 120px;
    display: none;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }
  .o-button-menu svg {
    width: 20px;
    height: 20px;
    fill: #ffffff;
  }
}
@media screen {
  .o-button-more {
    width: 48px;
    height: 48px;
    background: #434A53;
    border-radius: 120px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .o-button-more svg {
    width: 20px;
    height: 20px;
    fill: #ffffff;
  }
}
@media screen {
  .o-button-sidebar {
    width: 36px;
    height: 36px;
  }
}
@media screen {
  .o-alert__close {
    order: 10;
    height: 16px;
    cursor: pointer;
  }
  .o-alert__close svg {
    width: 16px;
    height: 16px;
    fill: #ffffff;
  }
}
@media screen {
  .o-button-close {
    display: flex;
    width: 16px;
    height: 16px;
    cursor: pointer;
  }
  .o-button-close svg {
    width: 16px;
    height: 16px;
    transform: rotate(45deg);
  }
}
@media screen {
  .o-button--bookmark {
    display: inline-flex;
    align-items: center;
    float: right;
    height: 46px;
    line-height: 46px;
    padding: 0 5px;
    font-size: 0.9375rem;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
  }
  .o-button--bookmark:focus {
    outline: none;
  }
}
@media screen {
  .o-button--share {
    cursor: pointer;
  }
  .o-button--share i {
    transition: all 0.3s ease-out;
  }
  .o-button--share:hover i {
    background: rgba(202, 206, 210, 0.85);
  }
}
@media screen {
  .o-button--how-to .o-button__highlight {
    width: 90px;
    height: 90px;
    border-radius: 100%;
    border: 3px solid #158443;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -55px;
    margin-left: -45px;
    z-index: 999;
  }
  .o-button--how-to .o-tooltip {
    opacity: 1;
    visibility: visible;
    width: 300px;
    top: 70px;
    left: -90px;
  }
  .o-button--how-to .o-tooltip:after {
    right: 35px;
    left: auto;
  }
}
@media screen {
  .o-button-start-content {
    position: absolute;
    top: -1000px;
    left: -1000px;
    height: 1px;
    width: 1px;
    text-align: left;
    overflow: hidden;
    color: #ffffff;
    text-decoration: none;
  }
  .o-button-start-content:focus {
    top: 0;
    left: 0;
    z-index: 9999999999;
    width: auto;
    height: 72px;
    line-height: 72px;
    padding: 0 15px;
    background-color: #157CB8;
  }
}
@media screen {
  .o-button-chapter {
    width: 90px;
    height: 100vh;
    background: #F5F8FB;
    position: fixed;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
  }
}
@media screen and (max-width: 992px) {
  .o-button-chapter {
    width: 60px;
  }
}
@media screen and (max-width: 768px) {
  .o-button-chapter {
    display: none;
  }
}
@media screen {
  .o-button-chapter:hover {
    opacity: 1;
  }
}
@media screen {
  .o-button-chapter svg {
    width: 17px;
    height: 15px;
    fill: #A7ADB4;
  }
}
@media screen {
  .o-button-chapter--left {
    left: 0;
    transform: rotate(180deg);
  }
}
@media screen {
  .o-button-chapter--right {
    right: 0;
  }
}
@media screen {
  .o-button-disclose--small {
    display: flex;
    width: 15px;
    height: 9px;
    cursor: pointer;
  }
  .o-button-disclose--small svg {
    width: 15px;
    height: 9px;
  }
}
@media screen {
  .o-button-disclose--grey svg {
    fill: #798494;
  }
}
@media screen {
  .o-button-disclose--rotate svg {
    transform: rotate(180deg);
  }
}
@media screen {
  .o-button__wrapper {
    display: flex;
    align-items: center;
  }
}
@media screen {
  .o-button--center .o-button__label, .o-button--center i {
    margin-left: auto;
  }
}
@media screen {
  .o-button--center-left .o-button__label, .o-button--center-left i {
    margin-right: auto;
  }
}
@media screen {
  .o-button--long-label {
    justify-content: center;
    white-space: normal;
    line-height: 1.25;
  }
}
@media screen {
  .l-button-accessible-hover .l-button__nub {
    transition: opacity 0.3s;
  }
  .l-button-accessible-hover:hover .l-button__nub {
    opacity: 0.75;
  }
}
@media screen {
  .l-button__svg-checkmark {
    width: 14px;
    height: 11px;
    margin-top: -5px;
    margin-left: -7px;
  }
}
@media screen {
  .l-button__svg-plus {
    width: 12px;
    height: 12px;
    margin-top: -6px;
    margin-left: -6px;
  }
}
@media screen {
  .l-button__svg-question {
    width: 13px;
    position: relative;
    left: 3px;
    top: -1px;
  }
}
@media screen {
  .l-button__svg-question--tooltip {
    opacity: 1;
  }
}
@media screen {
  .l-button__svg-close {
    width: 18px;
    transform: rotate(45deg);
  }
}
@media screen {
  .l-button__svg-close--button {
    width: 14px;
    height: 14px;
    margin: -7px 0 0 -7px;
    transform: rotate(45deg);
  }
}
@media screen {
  .l-button-inside-input {
    position: absolute;
    top: 40px;
    right: 15px;
  }
}
@media screen {
  .l-button__svg-hamburger {
    width: 12px;
    height: 12px;
    margin-top: -6px;
    margin-left: -6px;
  }
}
@media screen {
  .l-button__svg-filter {
    width: 16px;
    height: 16px;
    margin-right: 6px;
  }
}
@media screen {
  .l-button__svg-grid {
    width: 18px;
    height: 18px;
    margin-right: 9px;
  }
}
@media screen {
  .l-button__svg-clear {
    width: 20px;
    height: 20px;
    margin-right: 6px;
  }
}
@media screen {
  .l-button__svg-clear--button {
    width: 16px;
    height: 16px;
    margin-top: -8px;
    margin-left: -8px;
  }
}
@media screen {
  .l-button__svg-bookmark-icon {
    width: 20px;
    height: 20px;
    margin-top: -20px;
    margin-left: -10px;
  }
}
@media screen {
  .l-button__svg-bookmark-icon-nav {
    width: 20px;
    height: 20px;
  }
}
@media screen {
  .l-button__svg-arrow {
    width: 14px;
    height: 14px;
    margin-top: -7px;
    margin-left: -7px;
  }
}
@media screen {
  .l-button__svg-arrow-45 {
    width: 14px;
    height: 14px;
    margin-top: -7px;
    margin-left: -7px;
    transform: rotate(-45deg);
  }
}
@media screen {
  .l-button__svg-arrow-90 {
    width: 14px;
    height: 14px;
    margin-top: -7px;
    margin-left: -7px;
    transform: rotate(90deg);
  }
}
@media screen {
  .l-button__nub {
    width: 10px;
    height: 10px;
    margin-top: -6px;
    margin-left: -6px;
    position: relative;
    top: -15.5px;
  }
}
@media screen {
  .l-button__grid-nub {
    width: 10px;
    height: 10px;
    margin-top: -5px;
    margin-left: -5px;
    position: relative;
    top: -16px;
  }
}
@media screen {
  .l-button__search {
    width: 18px;
    height: 20px;
    top: 1px;
    margin-right: 8px;
  }
  .l-button__search svg {
    width: 18px;
    height: 18px;
  }
}
@media screen {
  .l-button__svg-facebook {
    width: 11px;
    position: relative;
    top: 4px;
    left: -1px;
  }
}
@media screen {
  .l-button__svg-facebook-share {
    width: 12px;
    height: 22px;
    position: absolute;
    top: 6px;
    left: 6px;
  }
}
@media screen {
  .l-button__svg-twitter {
    width: 17px;
  }
}
@media screen {
  .l-button__svg-twitter-share {
    width: 17px;
    height: 13px;
    position: absolute;
    top: 7px;
    left: 5px;
  }
}
@media screen {
  .l-button__svg-follow-twitter {
    width: 17px;
    height: 17px;
    margin-left: -8.5px;
    margin-top: -8.5px;
  }
}
@media screen {
  .l-button__svg-speech-bubble {
    width: 22px;
    height: 22px;
    opacity: 0.5;
  }
}
@media screen {
  .l-button__svg-star {
    width: 15px;
    height: 15px;
  }
}
@media screen {
  .l-button__svg-empty-star {
    width: 15px;
    height: 15px;
  }
}
@media screen {
  .l-button__svg-half-star {
    width: 8px;
    height: 15px;
    z-index: 1;
  }
}
@media screen {
  .l-button-newsletter-icon {
    position: absolute;
    right: 15px;
    top: 13px;
  }
}
@media screen {
  .l-button__svg-cog {
    width: 25px;
    height: 25px;
  }
}
@media screen {
  .l-button__svg-search-navigator {
    width: 23px;
    height: 23px;
  }
}
@media screen {
  .l-button__svg-bookmark-navigator {
    width: 22px;
    height: 22px;
  }
}
@media screen {
  .l-button__svg-22 {
    width: 22px;
    height: 22px;
  }
}
@media screen {
  .l-button__svg-watch-offline {
    width: 16px;
    height: 16px;
    margin-top: -8px;
    margin-left: -8px;
  }
}
@media screen {
  .l-button__svg-notepad-icon-nav {
    width: 24px;
    height: 23px;
  }
}
@media screen {
  .l-button__svg-lettering-icon-nav {
    width: 30px;
    height: 17px;
  }
}
@media screen {
  .l-button__svg-toc-icon-nav {
    width: 24px;
    height: 21px;
    margin-top: 4px;
    margin-right: -6px;
    stroke: white;
  }
}
@media screen {
  .l-button__search-nav {
    width: 18px;
    height: 20px;
    top: 1px;
    margin-right: 8px;
  }
  .l-button__search-nav svg {
    width: 21px;
    height: 21px;
  }
}
@media screen {
  .l-button__svg-arrow-nav {
    transition: 0.25s all;
    width: 12px;
    height: 12px;
    margin-left: 3px;
  }
}
@media screen {
  .l-button__svg-arrow-to-nav {
    width: 10px;
    height: 10px;
    margin-right: 8px;
    opacity: 0.5;
    transform: rotate(270deg);
  }
}
@media screen {
  .o-badge {
    background: #ffffff;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.6875rem; /* 11/16 */
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #333333;
    padding: 5px 9px;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    white-space: nowrap;
  }
}
@media screen {
  .o-badge-video {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background: #333333;
    border: 3px solid #ffffff;
    border-radius: 12px;
    position: relative;
  }
  .o-badge-video .o-badge-video__video-icon {
    position: relative;
    left: 1px;
    width: 16px;
  }
  .o-badge-video .o-badge-video__route-icon {
    position: relative;
    width: 23px;
  }
}
@media screen {
  .o-badge-tutorial {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 58px;
    height: 58px;
    background: #333333;
    border: 4px solid #ffffff;
    border-radius: 12px;
    font-family: "Bitter", serif;
    font-size: 1.5em; /* 24/16 */
    font-weight: 700;
    color: #ffffff;
    overflow: hidden;
  }
  .o-badge-tutorial img {
    width: 100%;
    height: 100%;
  }
}
@media screen {
  .o-badge-tutorial--checkmark {
    background: #158443;
  }
  .o-badge-tutorial--checkmark svg {
    width: 18px;
    height: 18px;
    fill: #ffffff;
  }
}
@media screen {
  .o-badge-tutorial--locked svg {
    width: 16px;
    fill: #ffffff;
    display: block !important;
  }
}
@media screen {
  .o-badge-tutorial--recording svg {
    width: 22px;
    fill: #ffffff;
    display: block !important;
  }
}
@media screen {
  .o-badge-product {
    color: #ffffff;
    border-radius: 9px 3px 9px 9px;
    padding: 5px 12px;
    box-shadow: none;
  }
}
@media screen {
  .o-badge-product--new {
    background: #157CB8;
  }
}
@media screen {
  .o-badge-product--update {
    background: #41AEA4;
  }
}
@media screen {
  .o-badge-product--sale {
    background: #CF3B2B;
  }
}
@media screen {
  .o-badge-product--highlight {
    background: none;
    color: #ffffff;
  }
}
@media screen {
  .o-badge-product--preorder {
    background: #3B4048;
  }
}
@media screen {
  .o-badge--pro {
    width: auto;
    height: auto;
    background: #157CB8;
    border-radius: 0.5625rem; /* 9/16 */
    border: 2px solid #ffffff;
    color: #ffffff;
    padding: 3px 7px;
    position: relative;
  }
}
@media screen {
  .o-badge--new {
    background: #9668B0;
    color: #ffffff;
    box-shadow: none;
    border-radius: 9px 3px 9px 9px;
  }
}
@media screen {
  .o-badge--completed {
    width: 108px;
    display: inline-flex;
    color: #ffffff;
    background: #158443;
    align-items: center;
    border-radius: 0.5625rem;
    justify-content: center;
    padding: 5px 9px;
  }
  .o-badge--completed .c-tutorial-item__complete-text {
    position: relative;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    white-space: nowrap;
  }
  .o-badge--completed i {
    display: flex;
    justify-content: center;
    align-content: center;
    width: 15px;
    height: 20px;
    margin-right: 6px;
  }
  .o-badge--completed i svg {
    width: 11px;
    fill: #ffffff;
  }
}
@media screen {
  .o-label {
    display: block;
    font-size: 0.9375rem;
    font-weight: 500;
    color: #333333;
  }
  .o-label .o-label__info {
    font-size: 0.6875rem;
    color: #959DA5;
  }
}
@media screen {
  .o-input {
    height: 50px;
    padding: 0 15px;
    background: #ffffff;
    border: 2px solid #D6E0EF;
    border-radius: 0.5625rem; /* 9/16 */
    transition: all 0.25s;
    margin-top: 6px;
    margin-bottom: 20px;
    font-size: 1rem;
  }
  .o-input:focus {
    background: rgba(29, 131, 209, 0.05);
    border: 2px solid #73859F;
    box-shadow: 0px 5px 10px rgba(55, 55, 55, 0.05);
    outline: none;
  }
}
@media screen {
  .o-input--large {
    height: 54px;
    padding: 0 15px;
    background: #ffffff;
    border: 2px solid #D6E0EF;
    border-radius: 0.5625rem; /* 9/16 */
    transition: all 0.25s;
    margin-top: 6px;
    margin-bottom: 20px;
    font-size: 1rem;
  }
  .o-input--large:focus {
    background: rgba(29, 131, 209, 0.05);
    border: 2px solid #73859F;
    box-shadow: 0px 5px 10px rgba(55, 55, 55, 0.05);
    outline: none;
  }
}
@media screen {
  .o-input--larger {
    height: 56px;
    padding: 0 15px;
    background: #ffffff;
    border: 2px solid #D6E0EF;
    border-radius: 0.5625rem; /* 9/16 */
    transition: all 0.25s;
    margin-top: 6px;
    margin-bottom: 20px;
    font-size: 1rem;
  }
  .o-input--larger:focus {
    background: rgba(29, 131, 209, 0.05);
    border: 2px solid #73859F;
    box-shadow: 0px 5px 10px rgba(55, 55, 55, 0.05);
    outline: none;
  }
}
@media screen {
  .o-input--dark {
    height: 50px;
    padding: 0 15px;
    background: #ffffff;
    border: 2px solid #D6E0EF;
    border-radius: 0.5625rem; /* 9/16 */
    transition: all 0.25s;
    margin-top: 6px;
    margin-bottom: 20px;
    font-size: 1rem;
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
  .o-input--dark:focus {
    background: rgba(29, 131, 209, 0.05);
    border: 2px solid #73859F;
    box-shadow: 0px 5px 10px rgba(55, 55, 55, 0.05);
    outline: none;
  }
  .o-input--dark::placeholder {
    color: #959DA5;
  }
}
@media screen {
  .o-textarea {
    padding: 15px;
    background: #ffffff;
    border: 2px solid #D6E0EF;
    border-radius: 0.5625rem; /* 9/16 */
    transition: all 0.25s;
    margin-top: 6px;
    margin-bottom: 20px;
    font-size: 1rem;
    line-height: 1.45;
    min-width: 100%;
    max-width: 100%;
  }
  .o-textarea:focus {
    background: rgba(29, 131, 209, 0.05);
    border: 2px solid #73859F;
    box-shadow: 0px 5px 10px rgba(55, 55, 55, 0.05);
    outline: none;
  }
}
@media screen {
  .o-textarea--dark {
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
}
@media screen {
  .input__group {
    position: relative;
  }
  .input__group .input__icon {
    position: absolute;
    width: 0;
    height: 50px;
    line-height: 48px;
    text-align: center;
    margin-top: 8px;
  }
  .input__group .input__icon-svg--twitter {
    width: 15px;
    height: 15px;
    position: absolute;
    left: 17px;
    top: 50%;
    margin-top: -7px;
    fill: #73859F;
  }
  .input__group .input__icon-svg--search {
    width: 18px;
    height: 18px;
    position: absolute;
    left: 16px;
    top: 50%;
    margin-top: -11px;
    fill: #ffffff;
  }
  .input__group .o-input {
    padding-left: 42px;
  }
}
@media screen {
  .o-checkbox__wrapper {
    position: relative;
  }
}
@media screen {
  .o-checkbox {
    position: absolute;
    cursor: pointer;
    width: 27px;
    height: 27px;
    text-indent: -9999px;
  }
  .o-checkbox:hover .checkbox__indicator {
    background: rgba(29, 131, 209, 0.05);
  }
  .o-checkbox .checkbox__input {
    position: absolute;
    z-index: -1;
    opacity: 0;
  }
  .o-checkbox .checkbox__input:focus ~ .checkbox__indicator:focus:not(:focus-visible) {
    outline: 2px solid rgba(255, 255, 255, 0.5) !important;
    box-shadow: 0 0 4px 4px rgba(255, 255, 255, 0.25);
  }
  .o-checkbox .checkbox__input:focus-visible ~ .checkbox__indicator {
    outline: 2px solid rgba(255, 255, 255, 0.5) !important;
    box-shadow: 0 0 4px 4px rgba(255, 255, 255, 0.25);
  }
  .o-checkbox .checkbox__input:checked ~ .checkbox__indicator {
    background: #158443 !important;
    border: 3px solid #158443 !important;
    border: none;
  }
  .o-checkbox .checkbox__input:checked ~ .checkbox__indicator svg {
    display: block;
  }
  .o-checkbox .checkbox__input:checked:focus ~ span.checkbox__indicator:focus:not(:focus-visible) {
    outline: 2px solid rgba(255, 255, 255, 0.5) !important;
    box-shadow: 0 0 4px 4px rgba(255, 255, 255, 0.25);
  }
  .o-checkbox .checkbox__input:checked:focus ~ span.checkbox__indicator svg {
    display: block;
  }
  .o-checkbox .checkbox__input:checked:focus-visible ~ span.checkbox__indicator {
    outline: 3px solid rgba(255, 255, 255, 0.5) !important;
    box-shadow: 0 0 4px 4px rgba(255, 255, 255, 0.25);
  }
  .o-checkbox .checkbox__input:checked:focus-visible ~ span.checkbox__indicator svg {
    display: block;
  }
  .o-checkbox .checkbox__indicator {
    position: absolute;
    left: 0;
    width: 27px;
    height: 27px;
    background: #ffffff;
    border-radius: 0.5625rem;
    border: 2px solid rgba(115, 133, 159, 0.5);
    transition: all 0.3s;
  }
  .o-checkbox .checkbox__indicator svg {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    fill: #ffffff;
    width: 15px;
    height: 12px;
    margin: -5.5px 0 0 -7.5px;
  }
}
@media screen {
  .o-checkbox__title {
    display: inline-block;
    padding-top: 2px;
    padding-left: 36px;
  }
}
@media screen {
  .o-checkbox--dark .checkbox__indicator {
    background: none;
    border: 2px solid rgba(115, 133, 159, 0.75);
  }
}
@media screen {
  .o-checkbox--small {
    width: 24px;
    height: 24px;
  }
  .o-checkbox--small .checkbox__indicator {
    width: 24px;
    height: 24px;
  }
  .o-checkbox--small .checkbox__indicator svg {
    width: 13px;
    height: 10px;
    margin: -5px 0 0 -6.5px;
  }
}
@media screen {
  .o-checkbox-toggle {
    position: absolute;
    cursor: pointer;
    width: 44px;
    height: 24px;
  }
  .o-checkbox-toggle .o-tooltip {
    top: -50px;
  }
  .o-checkbox-toggle .o-checkbox-toggle__input {
    position: absolute;
    z-index: 1;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
  }
  .o-checkbox-toggle .o-checkbox-toggle__input:checked ~ .o-checkbox-toggle__indicator {
    background-color: #158443;
  }
  .o-checkbox-toggle .o-checkbox-toggle__input:checked ~ .o-checkbox-toggle__indicator:before {
    transform: translateX(19px);
  }
  .o-checkbox-toggle .o-checkbox-toggle__indicator {
    position: relative;
    display: flex;
    background-color: #DBDDE0;
    width: 100%;
    height: 100%;
    border-radius: 100px;
  }
  .o-checkbox-toggle .o-checkbox-toggle__indicator:before {
    content: "";
    width: 18px;
    height: 18px;
    border-radius: 100px;
    background-color: #ffffff;
    position: absolute;
    left: 3px;
    top: 3px;
    transform: translateX(0);
    transition: transform 0.3s;
  }
}
@media screen {
  .o-checkbox-toggle--dark .o-checkbox-toggle__indicator {
    background-color: rgba(219, 221, 224, 0.2);
  }
}
@media screen {
  .form__validation {
    position: absolute;
    left: 0;
    top: 82px;
    font-size: 0.75em; /* 12/16 */
  }
}
@media screen and (max-width: 600px) {
  .form__validation {
    position: relative;
    top: -15px;
  }
}
@media screen {
  .form__validation--error {
    font-weight: 600;
    color: #CF3B2B;
  }
}
@media screen {
  .o-dropdown {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
    font-size: 0.9375rem;
    font-weight: 700;
    border-radius: 0.5625rem;
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.5s;
    white-space: nowrap;
    background: white;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    color: #333333;
    position: relative;
  }
  .o-dropdown > span {
    display: flex;
    align-items: center;
  }
  .o-dropdown > span svg {
    width: 10px;
    margin-left: 10px;
  }
  .o-dropdown ul.o-dropdown-menu {
    width: 100%;
    top: 52px;
    left: 0;
  }
  .o-dropdown ul.o-dropdown-menu li a {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.9375rem !important;
    text-decoration: none;
  }
}
@media screen {
  @keyframes loader-pulse {
    0%, 100% {
      transform: scale(0);
    }
    50% {
      transform: scale(1);
    }
  }
}
@media screen {
  .o-loader-pulse__bounce-1, .o-loader-pulse__bounce-2 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #ffffff;
    opacity: 0.6;
    position: absolute;
    top: 0;
    left: 0;
    animation: loader-pulse 2s infinite ease-in-out;
  }
}
@media screen {
  .o-loader-pulse__bounce-2 {
    animation-delay: -1s;
  }
}
@media screen {
  @keyframes rotate {
    100% {
      transform: rotate(360deg);
    }
  }
}
@media screen {
  .o-loader-circle {
    width: 100px;
    height: 100px;
    position: relative;
  }
  .o-loader-circle .o-loader-circle__arc {
    position: absolute;
    width: 100%;
    height: 100%;
  }
  .o-loader-circle .o-loader-circle__arc::before, .o-loader-circle .o-loader-circle__arc::after {
    content: "";
    position: absolute;
    top: 32%;
    left: 32%;
    border: 2px solid;
    border-radius: 50%;
    width: 36%;
    height: 36%;
  }
  .o-loader-circle .o-loader-circle__arc::before {
    border-color: #158443;
    opacity: 0.3;
  }
  .o-loader-circle .o-loader-circle__arc::after {
    border-color: transparent;
    border-bottom-color: #158443;
    animation: rotate 0.75s infinite linear;
  }
}
@media screen {
  @keyframes a-dot-loader {
    0% {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
}
@media screen {
  .c-dot-loader .a-dot-loader--1 {
    animation: a-dot-loader 1.5s infinite;
  }
  .c-dot-loader .a-dot-loader--2 {
    animation: a-dot-loader 1.5s infinite;
    animation-delay: 0.1s;
  }
  .c-dot-loader .a-dot-loader--3 {
    animation: a-dot-loader 1.5s infinite;
    animation-delay: 0.2s;
  }
}
@media screen {
  div.o-header-logo {
    width: 100%;
    position: relative;
  }
}
@media screen and (max-width: 992px) {
  div.o-header-logo {
    width: 48px;
    height: 48px;
  }
}
@media screen {
  div.o-header-logo svg.o-header-logo__text {
    width: 100%;
    fill: #ffffff;
  }
}
@media screen {
  div.o-header-logo svg.o-header-logo__mark {
    width: 50px;
    fill: #158443;
    position: absolute;
    top: 0;
    left: 0;
    transition: fill 0.3s;
  }
}
@media screen and (max-width: 992px) {
  div.o-header-logo svg.o-header-logo__mark {
    width: 48px;
    position: relative;
  }
}
@media screen {
  div.o-header-logo a.o-header-logo__link {
    display: block;
  }
  div.o-header-logo a.o-header-logo__link:hover svg.o-header-logo__mark {
    fill: #ffffff;
  }
}
@media screen {
  .o-rounded-image {
    border-radius: 0.5625rem;
  }
}
@media screen {
  .o-profile-pic--small, .o-profile-pic--medium, .o-profile-pic--large, .o-profile-pic--largest {
    background: #ffffff;
    border-radius: 0.5625rem;
    overflow: hidden;
  }
  .o-profile-pic--small img, .o-profile-pic--medium img, .o-profile-pic--large img, .o-profile-pic--largest img {
    width: 100%;
    height: auto;
  }
}
@media screen {
  .o-profile-pic--largest {
    width: 120px;
    height: 120px;
  }
}
@media screen {
  .o-profile-pic--large {
    width: 90px;
    height: 90px;
  }
}
@media screen {
  .o-profile-pic--medium {
    width: 54px;
    height: 54px;
  }
}
@media screen {
  .o-profile-pic--small {
    width: 40px;
    height: 40px;
  }
}
@media screen {
  .o-screenshot {
    border: 12px solid #ffffff;
    border-radius: 0.5625rem;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
  }
}
@media screen {
  .o-screenshot--large {
    border: 24px solid #ffffff;
  }
}
@media screen {
  .receipt-date {
    width: 100px;
  }
}
@media screen {
  .receipt-products {
    width: 400px;
  }
}
@media screen {
  .receipt-tax {
    width: 150px;
  }
}
@media screen {
  .receipt-order-total {
    width: 150px;
  }
}
@media screen {
  .o-alert {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 0.5625rem;
    min-height: 48px;
    color: #ffffff;
    padding: 14px 15px;
    position: relative;
    font-size: 0.9375em;
    margin-top: 10px;
  }
  .o-alert a {
    color: #ffffff;
  }
}
@media screen and (max-width: 600px) {
  .o-alert {
    font-size: 0.875rem;
  }
}
@media screen {
  .o-alert .o-alert__close {
    order: 10;
    width: 16px;
    height: 16px;
    cursor: pointer;
    position: relative;
  }
  .o-alert .o-alert__close svg {
    width: 16px;
    height: 16px;
    fill: #ffffff;
    margin: -8px 0 0 -8px;
  }
}
@media screen {
  .o-alert--success {
    background: #158443;
    padding-left: 94px;
  }
  .o-alert--success:before {
    content: "success";
    color: #158443;
    position: absolute;
    left: 15px;
    top: 12px;
    border-radius: 0.5625rem;
    background: #ffffff;
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.33px;
    padding: 5px 8px 4px;
  }
}
@media screen {
  .o-alert--danger {
    background: #CF3B2B;
    padding-left: 78px;
  }
  .o-alert--danger:before {
    content: "error";
    color: #CF3B2B;
    position: absolute;
    left: 15px;
    top: 12px;
    border-radius: 0.5625rem;
    background: #ffffff;
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.33px;
    padding: 5px 8px 4px;
  }
}
@media screen {
  .o-alert--warning {
    background: #FCB526;
    padding-left: 94px;
  }
  .o-alert--warning:before {
    content: "warning";
    color: #FCB526;
    position: absolute;
    left: 15px;
    top: 12px;
    border-radius: 0.5625rem;
    background: #ffffff;
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.33px;
    padding: 5px 8px 4px;
  }
}
@media screen {
  .o-alert--tip {
    background: #2F4F4F;
    padding-left: 58px;
  }
  .o-alert--tip:before {
    content: "tip";
    color: #2F4F4F;
    position: absolute;
    left: 15px;
    top: 12px;
    border-radius: 0.5625rem;
    background: #ffffff;
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.33px;
    padding: 5px 8px 4px;
  }
}
@media screen {
  .o-alert--info {
    background: #2F4F4F;
    padding-left: 68px;
  }
  .o-alert--info:before {
    content: "info";
    color: #2F4F4F;
    position: absolute;
    left: 15px;
    top: 12px;
    border-radius: 0.5625rem;
    background: #ffffff;
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.33px;
    padding: 5px 8px 4px;
  }
}
@media screen {
  .o-alert--archive {
    background: #CF3B2B;
    padding-left: 90px;
  }
  .o-alert--archive:before {
    content: "archive";
    color: #CF3B2B;
    position: absolute;
    left: 15px;
    top: 12px;
    border-radius: 0.5625rem;
    background: #ffffff;
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.33px;
    padding: 5px 8px 4px;
  }
}
@media screen {
  .o-alert--announce {
    background: #6767A8;
    padding-left: 138px;
  }
  .o-alert--announce:before {
    content: "announcement";
    color: #6767A8;
    position: absolute;
    left: 15px;
    top: 12px;
    border-radius: 0.5625rem;
    background: #ffffff;
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.33px;
    padding: 5px 8px 4px;
  }
}
@media screen {
  .o-alert--subscription {
    background: #FDCF74;
    color: #333333;
    padding-left: 68px;
  }
  .o-alert--subscription:before {
    content: "info";
    color: #FDCF74;
    position: absolute;
    left: 15px;
    top: 12px;
    border-radius: 0.5625rem;
    background: #ffffff;
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.33px;
    padding: 5px 8px 4px;
    background: #333333;
  }
}
@media screen {
  .o-alert--pro {
    background: #157CB8;
    padding-left: 68px;
  }
  .o-alert--pro:before {
    content: "pro";
    position: absolute;
    left: 15px;
    top: 12px;
    border-radius: 0.5625rem;
    background: #ffffff;
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.33px;
    padding: 5px 8px 4px;
    background: #157CB8;
    border-radius: 0.5625rem; /* 9/16 */
    border: 2px solid #ffffff;
    color: #ffffff;
    padding: 2px 7px;
    top: 13px;
  }
}
@media screen {
  .l-alert-admin-top {
    margin-bottom: 27px;
  }
}
@media screen {
  .l-alert-sticky {
    position: fixed;
    z-index: 999999;
    bottom: 0;
    width: 100%;
    border-radius: 0;
  }
}
@media screen and (max-width: 992px) {
  .l-alert-sticky {
    left: 0;
    width: 100%;
  }
}
@media screen {
  .l-alert-banner {
    border-radius: 0;
    margin-top: 0;
  }
}
@media screen {
  .o-progress-indicator {
    display: block;
    position: relative;
    height: 6px;
    border-radius: 50px;
    background: #D6E0EF;
  }
  .o-progress-indicator .o-progress-indicator__fill {
    position: absolute;
    left: 0;
    top: 0;
    height: 6px;
    border-radius: 50px;
    transition: all 0.3s ease-out;
  }
  .o-progress-indicator .o-progress-indicator__fill--green {
    background: #158443;
  }
  .o-progress-indicator .o-progress-indicator__fill--yellow {
    background: #FCB526;
  }
  .o-progress-indicator .o-progress-indicator__fill--red {
    background: #CF3B2B;
  }
}
@media screen {
  .o-progress-indicator-html {
    display: flex;
    height: 6px;
    border-radius: 12px;
    overflow: hidden;
  }
  .o-progress-indicator-html progress {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 6px;
    background-color: #D6E0EF;
    border-radius: 100px;
    border: none;
  }
  .o-progress-indicator-html ::-webkit-progress-bar {
    background-color: #D6E0EF;
  }
  .o-progress-indicator-html ::-webkit-progress-bar-value {
    background-color: #158443;
  }
  .o-progress-indicator-html ::-moz-progress-bar {
    background-color: #158443;
  }
}
@media screen {
  .o-tag {
    display: inline-block;
    background: #ffffff;
    height: 40px;
    line-height: 36px;
    padding: 0 12px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #333333;
    border-radius: 0.5625rem;
    text-decoration: none;
    border: 2px solid #D6E0EF;
    margin-right: 2px;
    margin-bottom: 8px;
    cursor: pointer;
  }
  .o-tag button {
    cursor: pointer;
    vertical-align: middle;
  }
  .o-tag button svg {
    width: 12px;
    height: 12px;
    transform: rotate(45deg);
    margin-left: 5px;
  }
}
@media screen {
  .o-tag--black {
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
}
@media screen {
  .o-tag--grey-mini {
    height: 36px;
    font-size: 0.8125rem; /* 13/16 */
    font-weight: 600;
    background-color: rgba(219, 221, 224, 0.4);
    border: none;
    margin-bottom: 0;
  }
}
@media screen {
  .o-fragment--tooltip, .o-tooltip, [data-tooltip]:before {
    background: linear-gradient(to right bottom, #333333, #363638, #38393d, #3a3c43, #3b4048);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.875rem; /* 14/16 */
    font-weight: 600;
    border-radius: 0.5625rem;
    padding: 9px 18px;
    position: absolute;
    top: 26px;
    left: 50%;
    transform: translateX(-50%);
    visibility: hidden;
    opacity: 0;
    color: #ffffff;
    z-index: 99999;
    width: auto;
    white-space: nowrap;
    text-transform: none !important;
    letter-spacing: 0 !important;
  }
}
@media screen {
  [data-tooltip] {
    position: relative;
  }
}
@media screen {
  [data-tooltip]:before {
    content: attr(data-tooltip);
  }
}
@media screen {
  [data-tooltip]:after {
    content: "";
    position: absolute;
    background: linear-gradient(to right bottom, #333333, #363638, #38393d, #3a3c43, #3b4048);
    top: 22px;
    left: 50%;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    transform: rotate(45deg);
    border-radius: 3px;
    opacity: 0;
  }
}
@media screen {
  [data-tooltip]:hover:before, [data-tooltip]:hover:after {
    visibility: visible;
    opacity: 1;
  }
}
@media screen {
  .o-button-tooltip:hover .o-tooltip {
    visibility: visible;
    opacity: 1;
  }
}
@media screen {
  .o-tooltip {
    height: 40px;
    line-height: 24px;
  }
  .o-tooltip:after {
    content: "";
    position: absolute;
    background: linear-gradient(to right bottom, #333333, #363638, #38393d, #3a3c43, #3b4048);
    top: 24px;
    left: 50%;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    transform: rotate(45deg);
    border-radius: 3px;
    opacity: 1;
    z-index: -1;
  }
}
@media screen {
  .o-tooltip--slim {
    padding: 6px 14px;
    height: 36px;
    line-height: 24px;
  }
}
@media screen {
  .o-tooltip--arrow-top:after {
    top: -3px;
    transform: rotate(45deg);
    border-radius: 3px;
  }
}
@media screen {
  .o-tooltip--arrow-top-left:after {
    left: 20px;
    top: -3px;
    transform: rotate(45deg);
    border-radius: 3px;
  }
}
@media screen {
  .o-tooltip--arrow-top-right:after {
    left: auto;
    right: 20px;
    top: -3px;
    transform: rotate(45deg);
    border-radius: 3px;
  }
}
@media screen {
  .o-tooltip--white {
    background: #ffffff;
    color: #333333;
  }
  .o-tooltip--white:after {
    background: #ffffff;
  }
}
@media screen {
  .o-tooltip--dark {
    background: #3B4048;
    color: #ffffff;
  }
  .o-tooltip--dark:after {
    background: #3B4048;
  }
}
@media screen {
  .o-tooltip--dark-small {
    border: 2px solid #959DA5;
    line-height: 1;
    padding: 10px 13px;
    font-size: 0.8125rem; /* 13/16 */
  }
  .o-tooltip--dark-small:before {
    content: "";
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #3B4048;
    position: absolute;
    top: auto;
    bottom: -5px;
    left: 50%;
    margin-left: -6px;
    z-index: 1;
    border-radius: 2px;
  }
  .o-tooltip--dark-small:after {
    content: "";
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #959DA5;
    position: absolute;
    bottom: -8px;
    top: auto;
    left: 50%;
    margin-left: -6px;
    z-index: 0;
    border-radius: 2px;
    transform: none;
  }
}
@media screen {
  .o-tooltip--green {
    background: #158443;
  }
  .o-tooltip--green:after {
    background: #158443;
  }
}
@media screen {
  .o-tooltip--top {
    top: -54px !important;
  }
}
@media screen {
  .o-tooltip--top-42 {
    top: -42px !important;
  }
}
@media screen {
  .o-tooltip--align-bottom {
    top: auto !important;
    bottom: 36px;
  }
  .o-tooltip--align-bottom:after {
    top: auto;
    bottom: -3px;
  }
}
@media screen {
  .o-tooltip--paragraph {
    height: auto;
    text-align: left;
    white-space: normal;
    line-height: 1.45;
    padding: 12px 18px;
  }
}
@media screen {
  .data-tooltip--top-left {
    position: unset !important;
  }
}
@media screen {
  .data-tooltip--top-left:before {
    top: -52px;
    left: 82px;
  }
  .data-tooltip--top-left:after {
    top: -30px;
    left: 24px;
  }
}
@media screen {
  .data-tooltip--top-right:before {
    top: -48px;
    left: auto;
    right: -90px;
  }
  .data-tooltip--top-right:after {
    top: -25px;
    left: auto;
    right: 5px;
  }
}
@media screen {
  .o-fragment--tooltip {
    opacity: 1;
    visibility: visible;
    display: flex;
    background: #333333 !important;
    height: 48px;
    padding: 0 12px 0 2px !important;
    min-width: max-content;
    user-select: none;
  }
  .o-fragment--tooltip span {
    cursor: pointer;
  }
  .o-fragment--tooltip:after {
    content: "";
    position: absolute;
    background: #333333 !important;
    top: 34px !important;
    left: 50%;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    transform: rotate(45deg);
    border-radius: 3px;
    opacity: 1;
    z-index: -1;
  }
  .o-fragment--tooltip > span {
    display: flex;
    align-items: center;
    line-height: 1;
  }
  .o-fragment--tooltip > div {
    display: flex;
    align-items: center;
    line-height: 1;
  }
  .o-fragment--tooltip > div > button {
    display: flex;
    align-items: center;
    line-height: 1;
  }
  .o-fragment--tooltip svg {
    max-width: 24px;
    max-height: 24px;
  }
  .o-fragment--tooltip .o-tooltip__color {
    /* These are needed because Safari thinks it's ok to "select" a span. But we use
       the concept of selection to determine whether or not the tooltip for a fragment
       should be shown. Since only one thing can be selected at once, if the colour box
       can be selected then the text selection is lost, and hence the annotation.
    */
    user-select: none;
    -webkit-user-select: none;
    display: block;
    width: 24px;
    height: 24px;
    border-radius: 0.375rem; /* 6/16 */
    position: relative;
    margin-left: 10px;
  }
  .o-fragment--tooltip .o-tooltip__color--selected {
    width: 28px;
    height: 28px;
  }
  .o-fragment--tooltip .o-tooltip__color--selected:before {
    content: "";
    width: 24px;
    height: 24px;
    border-radius: 4px;
    border: 3px solid #333333;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -12px 0 0 -12px;
  }
  .o-fragment--tooltip .o-tooltip__color--yellow {
    background: #FFE242;
  }
  .o-fragment--tooltip .o-tooltip__color--orange {
    background: #FBBC5D;
  }
  .o-fragment--tooltip .o-tooltip__color--red {
    background: #E58A8A;
  }
  .o-fragment--tooltip .o-tooltip__color--purple {
    background: #A0AEF2;
  }
  .o-fragment--tooltip .o-tooltip__color--blue {
    background: #85DDE9;
  }
  .o-fragment--tooltip .o-tooltip__color--green {
    background: #90DE9C;
  }
  .o-fragment--tooltip .o-tooltip__action {
    padding: 0 10px;
    border-left: 1px solid #434A53;
  }
}
@media screen {
  .l-tooltip-book-chapters {
    left: 45px;
    top: 35px;
  }
}
@media screen {
  .l-tooltip-book-tools {
    top: 35px;
  }
}
@media screen {
  .l-tooltip-erase-notebook {
    left: auto;
    right: 0;
    right: -78px;
    top: 32px;
  }
  .l-tooltip-erase-notebook:after {
    right: 10px;
  }
}
@media screen {
  .o-link--green {
    color: #158443;
  }
}
@media screen {
  .o-circular--progress {
    height: 5.625em;
    width: 5.625em;
    float: left;
    position: relative;
  }
  .o-circular--progress:nth-child(3n+1) {
    clear: both;
  }
  .o-circular--progress .o-circular--progress__container {
    height: 100%;
    width: 100%;
    clip: rect(0, 5.625em, 5.625em, 2.8125em);
    left: 0;
    position: absolute;
    top: 0;
  }
  .o-circular--progress .o-circular--progress__container .o-progress--half-circle {
    height: 100%;
    width: 100%;
    border: 4px solid #158443;
    border-radius: 50%;
    clip: rect(0, 2.8125em, 5.625em, 0);
    left: 0;
    position: absolute;
    top: 0;
  }
  .o-circular--progress .o-circular-progress--label {
    background: #333333;
    border-radius: 50%;
    bottom: 1em;
    color: #333333;
    cursor: default;
    display: block;
    font-size: 1.40625em;
    left: 1em;
    position: absolute;
    right: 1em;
    text-align: center;
    top: 1em;
    padding: 9px;
  }
  .o-circular--progress .o-circular-progress--label .o-circluar--percent__text {
    color: #333333;
    font-size: 0.45em;
    padding-bottom: 20px;
    vertical-align: super;
  }
  .o-circular--progress .o-progress--no-progress {
    height: 100%;
    width: 100%;
    border: 4px solid #DBDDE0;
    border-radius: 50%;
  }
  .o-circular--progress.o-progress--style-2 .o-circular-progress--label {
    background: none;
    display: flex;
    font-family: "Bitter", serif;
    font-weight: bold;
    font-size: 1.25rem; /* 20/16 */
    color: #333333;
    letter-spacing: -0.5px;
  }
  .o-circular--progress.o-progress--style-2 .o-circular-progress--label .o-circluar--percent__text {
    font-family: "Bitter", serif;
    font-weight: bold;
    font-size: 1.25rem; /* 20/16 */
    color: #333333;
  }
  .o-circular--progress.o-progress--0 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--0 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(0deg);
  }
  .o-circular--progress.o-progress--0 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--1 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--1 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(3.6deg);
  }
  .o-circular--progress.o-progress--1 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--2 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--2 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(7.2deg);
  }
  .o-circular--progress.o-progress--2 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--3 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--3 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(10.8deg);
  }
  .o-circular--progress.o-progress--3 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--4 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--4 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(14.4deg);
  }
  .o-circular--progress.o-progress--4 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--5 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--5 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(18deg);
  }
  .o-circular--progress.o-progress--5 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--6 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--6 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(21.6deg);
  }
  .o-circular--progress.o-progress--6 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--7 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--7 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(25.2deg);
  }
  .o-circular--progress.o-progress--7 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--8 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--8 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(28.8deg);
  }
  .o-circular--progress.o-progress--8 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--9 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--9 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(32.4deg);
  }
  .o-circular--progress.o-progress--9 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--10 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--10 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(36deg);
  }
  .o-circular--progress.o-progress--10 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--11 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--11 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(39.6deg);
  }
  .o-circular--progress.o-progress--11 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--12 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--12 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(43.2deg);
  }
  .o-circular--progress.o-progress--12 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--13 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--13 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(46.8deg);
  }
  .o-circular--progress.o-progress--13 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--14 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--14 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(50.4deg);
  }
  .o-circular--progress.o-progress--14 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--15 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--15 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(54deg);
  }
  .o-circular--progress.o-progress--15 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--16 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--16 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(57.6deg);
  }
  .o-circular--progress.o-progress--16 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--17 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--17 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(61.2deg);
  }
  .o-circular--progress.o-progress--17 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--18 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--18 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(64.8deg);
  }
  .o-circular--progress.o-progress--18 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--19 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--19 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(68.4deg);
  }
  .o-circular--progress.o-progress--19 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--20 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--20 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(72deg);
  }
  .o-circular--progress.o-progress--20 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--21 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--21 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(75.6deg);
  }
  .o-circular--progress.o-progress--21 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--22 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--22 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(79.2deg);
  }
  .o-circular--progress.o-progress--22 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--23 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--23 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(82.8deg);
  }
  .o-circular--progress.o-progress--23 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--24 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--24 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(86.4deg);
  }
  .o-circular--progress.o-progress--24 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--25 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--25 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(90deg);
  }
  .o-circular--progress.o-progress--25 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--26 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--26 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(93.6deg);
  }
  .o-circular--progress.o-progress--26 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--27 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--27 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(97.2deg);
  }
  .o-circular--progress.o-progress--27 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--28 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--28 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(100.8deg);
  }
  .o-circular--progress.o-progress--28 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--29 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--29 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(104.4deg);
  }
  .o-circular--progress.o-progress--29 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--30 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--30 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(108deg);
  }
  .o-circular--progress.o-progress--30 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--31 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--31 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(111.6deg);
  }
  .o-circular--progress.o-progress--31 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--32 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--32 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(115.2deg);
  }
  .o-circular--progress.o-progress--32 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--33 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--33 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(118.8deg);
  }
  .o-circular--progress.o-progress--33 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--34 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--34 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(122.4deg);
  }
  .o-circular--progress.o-progress--34 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--35 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--35 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(126deg);
  }
  .o-circular--progress.o-progress--35 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--36 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--36 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(129.6deg);
  }
  .o-circular--progress.o-progress--36 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--37 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--37 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(133.2deg);
  }
  .o-circular--progress.o-progress--37 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--38 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--38 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(136.8deg);
  }
  .o-circular--progress.o-progress--38 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--39 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--39 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(140.4deg);
  }
  .o-circular--progress.o-progress--39 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--40 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--40 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(144deg);
  }
  .o-circular--progress.o-progress--40 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--41 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--41 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(147.6deg);
  }
  .o-circular--progress.o-progress--41 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--42 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--42 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(151.2deg);
  }
  .o-circular--progress.o-progress--42 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--43 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--43 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(154.8deg);
  }
  .o-circular--progress.o-progress--43 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--44 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--44 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(158.4deg);
  }
  .o-circular--progress.o-progress--44 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--45 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--45 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(162deg);
  }
  .o-circular--progress.o-progress--45 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--46 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--46 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(165.6deg);
  }
  .o-circular--progress.o-progress--46 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--47 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--47 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(169.2deg);
  }
  .o-circular--progress.o-progress--47 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--48 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--48 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(172.8deg);
  }
  .o-circular--progress.o-progress--48 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--49 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--49 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(176.4deg);
  }
  .o-circular--progress.o-progress--49 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--50 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--50 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--50 .o-circular--progress__container .o-circular--progress__container-right {
    display: none;
  }
  .o-circular--progress.o-progress--51 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--51 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--51 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(183.6deg);
  }
  .o-circular--progress.o-progress--51 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--52 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--52 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--52 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(187.2deg);
  }
  .o-circular--progress.o-progress--52 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--53 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--53 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--53 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(190.8deg);
  }
  .o-circular--progress.o-progress--53 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--54 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--54 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--54 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(194.4deg);
  }
  .o-circular--progress.o-progress--54 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--55 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--55 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--55 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(198deg);
  }
  .o-circular--progress.o-progress--55 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--56 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--56 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--56 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(201.6deg);
  }
  .o-circular--progress.o-progress--56 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--57 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--57 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--57 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(205.2deg);
  }
  .o-circular--progress.o-progress--57 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--58 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--58 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--58 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(208.8deg);
  }
  .o-circular--progress.o-progress--58 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--59 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--59 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--59 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(212.4deg);
  }
  .o-circular--progress.o-progress--59 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--60 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--60 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--60 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(216deg);
  }
  .o-circular--progress.o-progress--60 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--61 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--61 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--61 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(219.6deg);
  }
  .o-circular--progress.o-progress--61 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--62 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--62 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--62 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(223.2deg);
  }
  .o-circular--progress.o-progress--62 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--63 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--63 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--63 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(226.8deg);
  }
  .o-circular--progress.o-progress--63 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--64 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--64 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--64 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(230.4deg);
  }
  .o-circular--progress.o-progress--64 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--65 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--65 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--65 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(234deg);
  }
  .o-circular--progress.o-progress--65 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--66 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--66 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--66 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(237.6deg);
  }
  .o-circular--progress.o-progress--66 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--67 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--67 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--67 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(241.2deg);
  }
  .o-circular--progress.o-progress--67 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--68 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--68 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--68 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(244.8deg);
  }
  .o-circular--progress.o-progress--68 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--69 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--69 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--69 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(248.4deg);
  }
  .o-circular--progress.o-progress--69 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--70 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--70 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--70 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(252deg);
  }
  .o-circular--progress.o-progress--70 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--71 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--71 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--71 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(255.6deg);
  }
  .o-circular--progress.o-progress--71 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--72 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--72 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--72 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(259.2deg);
  }
  .o-circular--progress.o-progress--72 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--73 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--73 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--73 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(262.8deg);
  }
  .o-circular--progress.o-progress--73 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--74 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--74 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--74 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(266.4deg);
  }
  .o-circular--progress.o-progress--74 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--75 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--75 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--75 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(270deg);
  }
  .o-circular--progress.o-progress--75 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--76 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--76 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--76 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(273.6deg);
  }
  .o-circular--progress.o-progress--76 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--77 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--77 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--77 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(277.2deg);
  }
  .o-circular--progress.o-progress--77 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--78 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--78 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--78 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(280.8deg);
  }
  .o-circular--progress.o-progress--78 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--79 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--79 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--79 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(284.4deg);
  }
  .o-circular--progress.o-progress--79 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--80 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--80 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--80 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(288deg);
  }
  .o-circular--progress.o-progress--80 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--81 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--81 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--81 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(291.6deg);
  }
  .o-circular--progress.o-progress--81 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--82 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--82 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--82 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(295.2deg);
  }
  .o-circular--progress.o-progress--82 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--83 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--83 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--83 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(298.8deg);
  }
  .o-circular--progress.o-progress--83 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--84 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--84 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--84 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(302.4deg);
  }
  .o-circular--progress.o-progress--84 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--85 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--85 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--85 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(306deg);
  }
  .o-circular--progress.o-progress--85 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--86 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--86 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--86 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(309.6deg);
  }
  .o-circular--progress.o-progress--86 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--87 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--87 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--87 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(313.2deg);
  }
  .o-circular--progress.o-progress--87 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--88 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--88 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--88 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(316.8deg);
  }
  .o-circular--progress.o-progress--88 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--89 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--89 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--89 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(320.4deg);
  }
  .o-circular--progress.o-progress--89 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--90 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--90 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--90 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(324deg);
  }
  .o-circular--progress.o-progress--90 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--91 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--91 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--91 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(327.6deg);
  }
  .o-circular--progress.o-progress--91 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--92 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--92 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--92 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(331.2deg);
  }
  .o-circular--progress.o-progress--92 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--93 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--93 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--93 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(334.8deg);
  }
  .o-circular--progress.o-progress--93 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--94 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--94 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--94 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(338.4deg);
  }
  .o-circular--progress.o-progress--94 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--95 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--95 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--95 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(342deg);
  }
  .o-circular--progress.o-progress--95 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--96 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--96 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--96 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(345.6deg);
  }
  .o-circular--progress.o-progress--96 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--97 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--97 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--97 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(349.2deg);
  }
  .o-circular--progress.o-progress--97 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--98 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--98 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--98 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(352.8deg);
  }
  .o-circular--progress.o-progress--98 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--99 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--99 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--99 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(356.4deg);
  }
  .o-circular--progress.o-progress--99 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
  .o-circular--progress.o-progress--100 .o-circular--progress__container {
    clip: rect(auto, auto, auto, auto);
  }
  .o-circular--progress.o-progress--100 .o-circular--progress__container .o-progress--half-circle {
    border-color: #158443;
  }
  .o-circular--progress.o-progress--100 .o-circular--progress__container .o-circular--progress__container-left {
    transform: rotate(360deg);
  }
  .o-circular--progress.o-progress--100 .o-circular--progress__container .o-circular--progress__container-right {
    transform: rotate(180deg);
  }
}
@media screen {
  .o-circular--progress .o-circluar--bg-none {
    background: none;
  }
}
@media screen {
  .o-content-counter {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
  }
  .o-content-counter:hover .o-content-counter__image {
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.075);
  }
  .o-content-counter > button {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
  }
  .o-content-counter .o-content-counter__image {
    width: 90px;
    height: 90px;
    border: 2px solid #DBDDE0;
    border-radius: 0.5625rem;
    padding: 4px;
    transition: box-shadow 0.5s;
  }
  .o-content-counter .o-content-counter__title {
    font-size: 0.875rem; /* 14/16 */
    font-weight: 600;
    margin-top: 9px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    width: 90px;
    text-align: center;
  }
  .o-content-counter .o-content-counter__count {
    position: absolute;
    top: -14px;
    right: -14px;
    width: 30px;
    height: 30px;
    justify-content: center;
    align-items: center;
    font-size: 0.8125rem; /* 13/16 */
    background-color: #158443;
    border-radius: 100%;
    font-family: "Bitter", serif;
    font-weight: bold;
    color: #ffffff;
    border: 3px solid #ffffff;
    display: none;
  }
}
@media screen {
  .is-highlighted-border .o-content-counter .o-content-counter__image {
    border: 4px solid #158443;
  }
  .is-highlighted-border .o-content-counter .o-content-counter__count {
    display: flex;
  }
}
@media screen {
  .l-block {
    margin: 0 auto;
  }
}
@media screen and (max-width: 768px) {
  .l-block {
    max-width: none;
    padding: 0 20px;
  }
}
@media screen {
  .l-block-padding-early {
    margin: 0 auto;
  }
}
@media screen and (max-width: 1280px) {
  .l-block-padding-early {
    max-width: none;
    padding: 0 20px;
  }
}
@media screen {
  .l-block-no-padding-mobile {
    margin: 0 auto;
  }
}
@media screen and (max-width: 768px) {
  .l-block-no-padding-mobile {
    padding: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-block-padding-mobile-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}
@media screen and (max-width: 1200px) {
  .l-block-padding-1200 {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}
@media screen and (max-width: 768px) {
  .l-block-padding-mobile-24 {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}
@media screen {
  .l-block-wrapper {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 30px;
  }
}
@media screen {
  .l-height-0 {
    height: 0 !important;
  }
}
@media screen {
  .l-height-100-percent {
    height: 100%;
  }
}
@media screen {
  .l-height-100 {
    height: 100vh;
  }
}
@media screen {
  .l-height-20 {
    height: 20px;
  }
}
@media screen {
  .l-height-52 {
    height: 52px;
  }
}
@media screen {
  .l-height-52--force {
    height: 52px !important;
  }
}
@media screen {
  .l-height-72--force {
    height: 72px !important;
  }
}
@media screen {
  .l-height-90--force {
    height: 90px !important;
  }
}
@media screen {
  .l-height-120--force {
    height: 120px !important;
  }
}
@media screen {
  .l-height-144--force {
    height: 144px !important;
  }
}
@media screen {
  .l-height-200--force {
    height: 200px !important;
  }
}
@media screen {
  .l-height-280--force {
    height: 280px !important;
  }
}
@media screen {
  .l-height-200 {
    height: 200px;
  }
}
@media screen {
  .l-width--90 {
    width: 90px !important;
  }
}
@media screen {
  .l-block--170 {
    max-width: 170px;
  }
}
@media screen {
  .l-block--224 {
    max-width: 224px;
  }
}
@media screen {
  .l-block--275 {
    max-width: 275px;
  }
}
@media screen {
  .l-min-height-100 {
    min-height: 100vh;
  }
}
@media screen {
  .l-block--card-320 {
    max-width: 320px;
  }
}
@media screen {
  .l-block--card-360 {
    max-width: 360px;
  }
}
@media screen {
  .l-block--card-420 {
    max-width: 420px;
  }
}
@media screen {
  .l-block--card-small {
    max-width: 640px;
  }
}
@media screen {
  .l-block--484 {
    max-width: 484px;
  }
}
@media screen {
  .l-block--686 {
    max-width: 686px;
  }
}
@media screen {
  .l-block--688 {
    max-width: 688px;
  }
}
@media screen {
  .l-block--696 {
    max-width: 696px;
  }
}
@media screen {
  .l-block--card-medium {
    max-width: 720px;
  }
}
@media screen {
  .l-block--806 {
    max-width: 806px;
  }
}
@media screen {
  .l-block--906 {
    max-width: 906px;
  }
}
@media screen {
  .l-block--912 {
    max-width: 912px;
  }
}
@media screen {
  .l-block--920 {
    max-width: 920px;
  }
}
@media screen {
  .l-block--968 {
    max-width: 968px;
  }
}
@media screen {
  .l-block--1080 {
    max-width: 1080px;
  }
}
@media screen {
  .l-block--1152 {
    max-width: 1152px;
  }
}
@media screen {
  .l-block--1200 {
    max-width: 1215px;
  }
}
@media screen {
  .l-block--1300 {
    max-width: 1300px;
  }
}
@media screen {
  .l-block--100 {
    max-width: 100%;
  }
}
@media screen {
  .l-block-wide {
    margin: 0;
    max-width: 1500px;
    padding: 0 0 0 30px;
  }
}
@media screen and (min-width: 1440px) {
  .l-block-wide {
    margin: 0 auto;
  }
}
@media screen and (max-width: 768px) {
  .l-block-wide {
    max-width: none;
    padding: 0 20px;
  }
}
@media screen {
  .l-block-wide-padding {
    padding: 0 30px;
  }
}
@media screen and (max-width: 768px) {
  .l-block-wide-padding {
    padding: 0 20px;
  }
}
@media screen {
  .l-full-col {
    width: 100%;
  }
}
@media screen {
  .l-half-col {
    width: 50%;
  }
}
@media screen {
  .l-width-max-120 {
    max-width: 120px;
  }
}
@media screen {
  .l-width-min-100 {
    min-width: 100%;
  }
}
@media screen {
  .l-margin-auto {
    margin: 0 auto;
  }
}
@media screen {
  .l-margin-0 {
    margin-top: 0 !important;
  }
}
@media screen and (max-width: 992px) {
  .l-margin-0-tablet {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-margin-all-0 {
    margin: 0 !important;
  }
}
@media screen {
  .l-margin-1 {
    margin-top: 1px;
  }
}
@media screen {
  .l-margin-2 {
    margin-top: 2px;
  }
}
@media screen {
  .l-margin-3 {
    margin-top: 3px;
  }
}
@media screen {
  .l-margin-4 {
    margin-top: 4px;
  }
}
@media screen {
  .l-margin-6 {
    margin-top: 6px;
  }
}
@media screen {
  .l-margin-9 {
    margin-top: 9px;
  }
}
@media screen {
  .l-margin-9--force {
    margin-top: 9px !important;
  }
}
@media screen {
  .l-margin-10 {
    margin-top: 10px;
  }
}
@media screen {
  .l-margin-12 {
    margin-top: 12px;
  }
}
@media screen {
  .l-margin-12--force {
    margin-top: 12px !important;
  }
}
@media screen {
  .l-margin-15 {
    margin-top: 15px;
  }
}
@media screen {
  .l-margin-18 {
    margin-top: 18px;
  }
}
@media screen {
  .l-margin-18--i {
    margin-top: 18px !important;
  }
}
@media screen {
  .l-margin-20 {
    margin-top: 20px;
  }
}
@media screen {
  .l-margin-21 {
    margin-top: 21px;
  }
}
@media screen {
  .l-margin-21--force {
    margin-top: 21px !important;
  }
}
@media screen {
  .l-margin-24 {
    margin-top: 24px;
  }
}
@media screen {
  .l-margin-27 {
    margin-top: 27px;
  }
}
@media screen {
  .l-margin-30 {
    margin-top: 30px;
  }
}
@media screen {
  .l-margin-30--force {
    margin-top: 30px !important;
  }
}
@media screen {
  .l-margin-36 {
    margin-top: 36px;
  }
}
@media screen {
  .l-margin-40 {
    margin-top: 40px;
  }
}
@media screen {
  .l-margin-42 {
    margin-top: 42px;
  }
}
@media screen {
  .l-margin-45 {
    margin-top: 45px;
  }
}
@media screen {
  .l-margin-50 {
    margin-top: 50px;
  }
}
@media screen {
  .l-margin-60 {
    margin-top: 60px;
  }
}
@media screen {
  .l-margin-72 {
    margin-top: 72px;
  }
}
@media screen {
  .l-margin-90 {
    margin-top: 90px;
  }
}
@media screen {
  .l-margin-120 {
    margin-top: 120px;
  }
}
@media screen {
  .l-margin-145 {
    margin-top: 145px;
  }
}
@media screen {
  .l-margin-180 {
    margin-top: 180px;
  }
}
@media screen {
  .l-margin-240 {
    margin-top: 240px;
  }
}
@media screen and (max-width: 768px) {
  .l-margin-240 {
    margin-top: 180px;
  }
}
@media screen {
  .l-margin-left-6 {
    margin-left: 6px;
  }
}
@media screen {
  .l-margin-left-9 {
    margin-left: 9px;
  }
}
@media screen {
  .l-margin-left-10 {
    margin-left: 10px;
  }
}
@media screen {
  .l-margin-left-6 {
    margin-left: 6px;
  }
}
@media screen {
  .l-margin-sides-0 {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}
@media screen {
  .l-margin-sides-2 {
    margin-left: 2px;
    margin-right: 2px;
  }
}
@media screen {
  .l-margin-sides-3 {
    margin-left: 3px;
    margin-right: 3px;
  }
}
@media screen {
  .l-margin-sides-8 {
    margin-left: 8px;
    margin-right: 8px;
  }
}
@media screen {
  .l-margin-n-9 {
    margin-top: -9px;
  }
}
@media screen {
  .l-margin-n-18 {
    margin-top: -18px;
  }
}
@media screen {
  .l-margin-n-20 {
    margin-top: -20px;
  }
}
@media screen {
  .l-margin-left-6 {
    margin-left: 6px;
  }
}
@media screen {
  .l-margin-left-9 {
    margin-left: 9px;
  }
}
@media screen {
  .l-margin-left-15 {
    margin-left: 15px;
  }
}
@media screen {
  .l-margin-left-18 {
    margin-left: 18px;
  }
}
@media screen {
  .l-margin-left-29 {
    margin-left: 29px;
  }
}
@media screen {
  .l-margin-right-0 {
    margin-right: 0 !important;
  }
}
@media screen {
  .l-margin-right-3 {
    margin-right: 3px;
  }
}
@media screen {
  .l-margin-right-4 {
    margin-right: 4px;
  }
}
@media screen {
  .l-margin-right-6 {
    margin-right: 6px;
  }
}
@media screen {
  .l-margin-right-8 {
    margin-right: 8px !important;
  }
}
@media screen {
  .l-margin-right-9 {
    margin-right: 9px !important;
  }
}
@media screen {
  .l-margin-right-10 {
    margin-right: 10px !important;
  }
}
@media screen {
  .l-margin-right-12 {
    margin-right: 12px !important;
  }
}
@media screen {
  .l-margin-right-15 {
    margin-right: 15px !important;
  }
}
@media screen {
  .l-margin-right-16 {
    margin-right: 16px !important;
  }
}
@media screen {
  .l-margin-right-18 {
    margin-right: 18px !important;
  }
}
@media screen {
  .l-margin-right-21 {
    margin-right: 21px !important;
  }
}
@media screen {
  .l-margin-right-24 {
    margin-right: 24px !important;
  }
}
@media screen {
  .l-margin-right-30 {
    margin-right: 30px !important;
  }
}
@media screen {
  .l-margin-left-auto {
    margin-left: auto !important;
  }
}
@media screen {
  .l-margin-right-auto {
    margin-right: auto !important;
  }
}
@media screen {
  .l-margin-bottom-n-10 {
    margin-bottom: -10px;
  }
}
@media screen {
  .l-margin-bottom-n-12 {
    margin-bottom: -12px;
  }
}
@media screen {
  .l-margin-bottom-n-18 {
    margin-bottom: -18px;
  }
}
@media screen {
  .l-margin-bottom-12 {
    margin-bottom: 12px !important;
  }
}
@media screen {
  .l-margin-bottom-18 {
    margin-bottom: 18px !important;
  }
}
@media screen {
  .l-margin-right-n-24 {
    margin-right: -24px;
  }
}
@media screen {
  .l-margin-left-n-24 {
    margin-left: -24px;
  }
}
@media screen {
  .l-margin-bottom-20 {
    margin-bottom: 20px !important;
  }
}
@media screen {
  .l-margin-bottom-27 {
    margin-bottom: 27px !important;
  }
}
@media screen {
  .l-margin-bottom-45 {
    margin-bottom: 45px !important;
  }
}
@media screen {
  .l-margin-bottom-60 {
    margin-bottom: 60px !important;
  }
}
@media screen and (max-width: 768px) {
  .l-margin-mobile-0 {
    margin-top: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .l-margin-mobile-9 {
    margin-top: 9px;
  }
}
@media screen and (max-width: 768px) {
  .l-margin-mobile-large-12 {
    margin-top: 12px;
  }
}
@media screen and (max-width: 768px) {
  .l-margin-mobile-large-15 {
    margin-top: 15px;
  }
}
@media screen and (max-width: 768px) {
  .l-margin-mobile-large-18 {
    margin-top: 18px;
  }
}
@media screen and (max-width: 768px) {
  .l-margin-left-0--mobile-large {
    margin-left: 0 !important;
  }
}
@media screen and (max-width: 600px) {
  .l-margin-mobile-large-40 {
    margin-top: 40px;
  }
}
@media screen and (max-width: 600px) {
  .l-margin-mobile-18 {
    margin-top: 18px;
  }
}
@media screen and (max-width: 600px) {
  .l-margin-mobile-30 {
    margin-top: 30px;
  }
}
@media screen and (max-width: 768px) {
  .l-margin-mobile-large-30 {
    margin-top: 30px;
  }
}
@media screen and (max-width: 992px) {
  .l-margin-tablet-60 {
    margin-top: 60px;
  }
}
@media screen and (max-width: 992px) {
  .l-margin-tablet-30 {
    margin-top: 30px;
  }
}
@media screen and (max-width: 768px) {
  .l-margin-mobile-large-60 {
    margin-top: 60px;
  }
}
@media screen and (max-width: 768px) {
  .l-margin-mobile-large-90 {
    margin-top: 90px;
  }
}
@media screen and (max-width: 768px) {
  .l-margin-mobile-large-left-20 {
    margin-left: 20px;
  }
}
@media screen {
  .l-padding-wrapper {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media screen and (max-width: 768px) {
  .l-padding-wrapper {
    padding-left: 0;
    padding-right: 0;
  }
}
@media screen {
  .l-padding-right-15 {
    padding-right: 15px;
  }
}
@media screen {
  .l-padding-sides-0 {
    padding: 0 !important;
  }
}
@media screen {
  .l-padding-sides-20 {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen {
  .l-padding-sides-45 {
    padding-left: 45px;
    padding-right: 45px;
  }
}
@media screen {
  .l-padding-0 {
    padding-top: 0 !important;
  }
}
@media screen {
  .l-padding-3 {
    padding-top: 3px;
  }
}
@media screen {
  .l-padding-6 {
    padding-top: 6px;
  }
}
@media screen {
  .l-padding-9 {
    padding-top: 9px;
  }
}
@media screen {
  .l-padding-15 {
    padding-top: 15px;
  }
}
@media screen {
  .l-padding-20 {
    padding-top: 20px;
  }
}
@media screen {
  .l-padding-24 {
    padding-top: 24px;
  }
}
@media screen {
  .l-padding-30 {
    padding-top: 30px;
  }
}
@media screen {
  .l-padding-42 {
    padding-top: 42px;
  }
}
@media screen {
  .l-padding-45 {
    padding-top: 45px;
  }
}
@media screen {
  .l-padding-48 {
    padding-top: 48px;
  }
}
@media screen {
  .l-padding-60 {
    padding-top: 60px;
  }
}
@media screen {
  .l-padding-72 {
    padding-top: 72px;
  }
}
@media screen {
  .l-padding-90 {
    padding-top: 90px;
  }
}
@media screen {
  .l-padding-120 {
    padding-top: 120px;
  }
}
@media screen and (max-width: 992px) {
  .l-padding-0--tablet {
    padding-top: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .l-padding-0--mobile-large {
    padding-top: 0 !important;
  }
}
@media screen {
  .l-padding-bottom-18 {
    padding-bottom: 18px;
  }
}
@media screen {
  .l-padding-bottom-30 {
    padding-bottom: 30px;
  }
}
@media screen {
  .l-padding-bottom-60 {
    padding-bottom: 60px;
  }
}
@media screen {
  .l-padding-bottom-90 {
    padding-bottom: 90px;
  }
}
@media screen {
  .l-padding-bottom-120 {
    padding-bottom: 120px;
  }
}
@media screen and (max-width: 768px) {
  .l-padding-bottom-30--mobile-large {
    padding-bottom: 30px !important;
  }
}
@media screen {
  .l-padding-bottom-120--force {
    padding-bottom: 120px !important;
  }
}
@media screen {
  .l-padding-right-0 {
    padding-right: 0 !important;
  }
}
@media screen {
  .l-padding-right-20 {
    padding-right: 20px;
  }
}
@media screen {
  .l-padding-right-30 {
    padding-right: 30px;
  }
}
@media screen {
  .l-padding-right-45 {
    padding-right: 45px;
  }
}
@media screen and (max-width: 768px) {
  .l-no-padding-right {
    padding-right: 0;
  }
}
@media screen {
  .l-padding-left-20 {
    padding-left: 20px;
  }
}
@media screen {
  .l-padding-left-86 {
    padding-left: 86px;
  }
}
@media screen and (max-width: 992px) {
  .l-no-padding-left--tablet {
    padding-left: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-padding-sides-30--mobile-large {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
}
@media screen and (max-width: 992px) {
  .l-padding-sides-24--tablet {
    padding-left: 24px;
    padding-right: 24px;
  }
}
@media screen and (max-width: 1200px) {
  .l-padding-sides-60--temporary {
    padding-left: 60px;
    padding-right: 60px;
  }
}
@media screen and (max-width: 768px) {
  .l-padding-sides-60--temporary {
    padding-left: 0;
    padding-right: 0;
  }
}
@media screen {
  .l-padding-all-15 {
    padding: 15px;
  }
}
@media screen {
  .l-padding-all-20 {
    padding: 20px;
  }
}
@media screen {
  .l-padding-all-24 {
    padding: 24px;
  }
}
@media screen {
  .l-flex {
    display: flex;
  }
}
@media screen and (max-width: 768px) {
  .l-flex-column--mobile {
    flex-direction: column;
  }
}
@media screen {
  .l-flex-wrap {
    display: flex;
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 768px) {
  .l-flex-wrap--mobile-large {
    display: flex;
    flex-wrap: wrap;
  }
}
@media screen {
  .l-flex-nowrap {
    display: flex;
    flex-wrap: nowrap;
  }
}
@media screen {
  .l-flex-wrap-justify {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
@media screen {
  .l-flex-nowrap-justify {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
  }
}
@media screen {
  .l-flex-align-center {
    display: flex;
    align-items: center;
  }
}
@media screen and (max-width: 768px) {
  .l-flex-align-center--mobile-large {
    align-items: center !important;
  }
}
@media screen {
  .l-flex-align-center--force {
    display: flex !important;
    align-items: center;
  }
}
@media screen {
  .l-flex-align-start {
    display: flex;
    align-items: flex-start;
  }
}
@media screen {
  .l-flex-align-end {
    display: flex;
    align-items: flex-end;
  }
}
@media screen {
  .l-flex-align-stretch {
    display: flex;
    align-items: stretch;
  }
}
@media screen {
  .l-flex-justify-center {
    display: flex;
    justify-content: center;
  }
}
@media screen {
  .l-flex-justify-right {
    display: flex;
    justify-content: flex-end;
  }
}
@media screen {
  .l-flex-justify-space-between {
    display: flex;
    justify-content: space-between;
  }
}
@media screen {
  .l-flex-align-content--center {
    align-content: center;
  }
}
@media screen {
  .l-align-items-start {
    align-items: flex-start;
  }
}
@media screen {
  .l-relative {
    position: relative;
  }
}
@media screen {
  .l-absolute {
    position: absolute;
    top: 0;
  }
}
@media screen {
  .l-absolute-right {
    position: absolute;
    top: 0;
    right: 0;
  }
}
@media screen {
  .l-top-13 {
    top: 13px;
  }
}
@media screen {
  .l-right-0 {
    right: 0;
  }
}
@media screen {
  .l-bottom-0 {
    bottom: 0;
  }
}
@media screen {
  .l-text-align-left {
    text-align: left;
  }
}
@media screen {
  .l-text-align-left--force {
    text-align: left !important;
  }
}
@media screen {
  .l-text-align-center {
    text-align: center;
  }
}
@media screen {
  .l-text-align-right {
    text-align: right;
  }
}
@media screen and (max-width: 768px) {
  .l-text-align-left--mobile {
    text-align: left;
  }
}
@media screen and (max-width: 992px) {
  .l-text-align-center--tablet {
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .l-text-align-center--mobile {
    text-align: center;
  }
}
@media screen {
  .l-text-overflow {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
}
@media screen and (max-width: 768px) {
  .l-font-header--mobile {
    font-size: 1.5em !important;
    line-height: 1.35;
  }
}
@media screen and (max-width: 768px) {
  .l-font-header--mobile-27 {
    font-size: 1.7rem !important; /* 36/16 */
    line-height: 1.35;
  }
}
@media screen and (max-width: 768px) {
  .l-font-header--mobile-27-1125 {
    font-size: 1.7rem !important;
    line-height: 1.125;
  }
}
@media screen {
  .l-font-body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
  }
}
@media screen {
  .l-font-header {
    font-family: "Bitter", serif;
  }
  .l-font-header ul {
    font-family: "Bitter", serif;
  }
}
@media screen {
  .l-font-header--force {
    font-family: "Bitter", serif !important;
  }
}
@media screen {
  .l-font-normal {
    font-weight: normal;
  }
}
@media screen {
  .l-font-semibold {
    font-weight: 600;
  }
}
@media screen {
  .l-font-bold {
    font-weight: 700;
  }
}
@media screen {
  .l-font-italic {
    font-style: italic;
  }
}
@media screen {
  .l-font-no-decor {
    text-decoration: none;
  }
}
@media screen {
  .l-font-no-decor--hover:hover {
    text-decoration: none !important;
  }
  .l-font-no-decor--hover:hover .o-button__label {
    text-decoration: none !important;
  }
}
@media screen {
  .l-font-underline {
    text-decoration: underline;
  }
}
@media screen {
  .l-font-underline--force {
    text-decoration: underline !important;
  }
}
@media screen {
  .l-font-line {
    text-decoration: line-through;
  }
}
@media screen {
  .l-line-height-1 {
    line-height: 1;
  }
}
@media screen {
  .l-line-height-1125 {
    line-height: 1.125;
  }
}
@media screen {
  .l-line-height-1125--force {
    line-height: 1.125 !important;
  }
}
@media screen {
  .l-line-height-12 {
    line-height: 1.2;
  }
}
@media screen {
  .l-line-height-125 {
    line-height: 1.25;
  }
}
@media screen and (max-width: 768px) {
  .l-line-height-125--mobile-large {
    line-height: 1.25 !important;
  }
}
@media screen {
  .l-font-12 {
    font-size: 0.75rem; /* 12/16 */
  }
}
@media screen {
  .l-font-13 {
    font-size: 0.8125rem; /* 13/16 */
  }
}
@media screen {
  .l-font-14 {
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen {
  .l-font-15 {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .l-font-15--force {
    font-size: 0.9375rem !important; /* 15/16 */
  }
}
@media screen {
  .l-font-16 {
    font-size: 1rem; /* 15/16 */
  }
}
@media screen {
  .l-font-17 {
    font-size: 1.0625rem; /* 24/16 */
  }
}
@media screen {
  .l-font-18 {
    font-size: 1.125em;
  }
}
@media screen {
  .l-font-19 {
    font-size: 1.1875rem; /* 19/16 */
  }
}
@media screen {
  .l-font-20 {
    font-size: 1.25rem; /* 20/16 */
  }
}
@media screen {
  .l-font-21 {
    font-size: 1.3125rem; /* 21/16 */
  }
}
@media screen {
  .l-font-24 {
    font-size: 1.5rem; /* 24/16 */
  }
}
@media screen {
  .l-font-27 {
    font-size: 1.6875rem;
  }
}
@media screen {
  .l-font-30 {
    font-size: 1.875rem; /* 30/16 */
  }
}
@media screen {
  .l-font-36 {
    font-size: 2.25rem; /* 36/16 */
  }
}
@media screen {
  .l-font-42 {
    font-size: 2.625rem; /* 42/16 */
  }
}
@media screen {
  .l-font-60 {
    font-size: 3.75rem; /* 60/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-font-15--mobile {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-font-15--mobile-force {
    font-size: 0.9375rem !important; /* 15/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-font-16--mobile {
    font-size: 1rem !important; /* 17/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-font-17--mobile {
    font-size: 1.0625rem !important; /* 17/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-font-22--mobile {
    font-size: 1.375rem; /* 22/16 */
    line-height: 1.25;
  }
}
@media screen and (max-width: 768px) {
  .l-font-24--mobile {
    font-size: 1.5rem; /* 24/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-font-27--mobile {
    font-size: 1.6875rem; /* 27/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-font-30--mobile {
    font-size: 1.875rem !important; /* 30/16 */
  }
}
@media screen {
  .l-font-36--mobile {
    font-size: 2.25rem; /* 36/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-font-36--mobile {
    font-size: 1.5em;
  }
}
@media screen {
  .l-color-grey {
    color: #6E7687 !important;
  }
}
@media screen {
  .l-color-grey-regent {
    color: #959DA5;
  }
}
@media screen {
  .l-color-grey-cadet {
    color: #ACB6BF;
  }
}
@media screen {
  .l-color-grey-chateau {
    color: #A7ADB4;
  }
}
@media screen {
  .l-color-white {
    color: #ffffff;
  }
}
@media screen {
  .l-color-white--force {
    color: #ffffff !important;
  }
}
@media screen {
  .l-color-white-hover:hover {
    color: #ffffff !important;
  }
}
@media screen {
  .l-color-black {
    color: #333333 !important;
  }
}
@media screen {
  .l-color-green {
    color: #158443;
  }
}
@media screen {
  .l-color-red {
    color: #CF3B2B;
  }
}
@media screen {
  .l-color-green--force {
    color: #158443 !important;
  }
}
@media screen {
  .l-color-neon--red {
    color: transparent !important;
    paint-order: fill stroke markers;
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #FED128;
    text-shadow: 0 0 1vw #FA1C16, 0 0 3vw #FA1C16, 0 0 3vw #FA1C16, 0 0 0.4vw #FED128;
  }
}
@media screen and (max-width: 600px) {
  .l-color-neon--red {
    -webkit-text-stroke-width: 1px;
  }
}
@media screen {
  .l-color-neon--blue {
    color: transparent !important;
    paint-order: fill stroke markers;
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #28D7FE;
    text-shadow: 0 0 1vw #1041FF, 0 0 3vw #1041FF, 0 0 10vw #1041FF, 0 0 10vw #1041FF, 0 0 0.4vw #8BFDFE;
  }
}
@media screen and (max-width: 600px) {
  .l-color-neon--blue {
    -webkit-text-stroke-width: 1px;
  }
}
@media screen {
  .l-font-label {
    font-size: 0.75rem; /* 12/16 */
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #959DA5;
  }
}
@media screen {
  .l-whitespace {
    white-space: nowrap;
  }
}
@media screen {
  .l-whitespace-reset {
    white-space: normal !important;
  }
}
@media screen {
  .l-whitespace--desktop {
    white-space: nowrap;
  }
}
@media screen and (max-width: 600px) {
  .l-whitespace--desktop {
    white-space: normal;
  }
}
@media screen {
  .l-font-spacing {
    letter-spacing: -0.5px;
  }
}
@media screen {
  .l-no-font-spacing {
    letter-spacing: 0px;
  }
}
@media screen {
  .l-grid {
    display: grid;
  }
}
@media screen {
  .l-grid-2-fr {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
@media screen {
  .l-grid-3-fr {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media screen {
  .l-grid-3-auto {
    display: grid;
    grid-template-columns: auto auto auto;
  }
}
@media screen {
  .l-grid-2 {
    display: grid;
    grid-template-columns: auto auto;
  }
}
@media screen {
  .l-grid-3 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-grid-3 {
    display: block;
  }
}
@media screen {
  .l-grid-4 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 600px) {
  .l-grid-4 {
    display: block;
  }
}
@media screen {
  .l-grid-5 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important;
  }
}
@media screen {
  .l-grid-6-3-fr {
    display: grid;
    grid-template-columns: 6fr 3fr;
  }
}
@media screen {
  .l-grid-col-gap-8 {
    grid-column-gap: 8px;
  }
}
@media screen {
  .l-grid-col-gap-12 {
    grid-column-gap: 12px;
  }
}
@media screen {
  .l-grid-col-gap-16 {
    grid-column-gap: 16px;
  }
}
@media screen {
  .l-grid-col-gap-18 {
    grid-column-gap: 18px;
  }
}
@media screen {
  .l-grid-col-gap-20 {
    grid-column-gap: 20px;
  }
}
@media screen {
  .l-grid-col-gap-24 {
    grid-column-gap: 24px;
  }
}
@media screen {
  .l-grid-col-gap-25 {
    grid-column-gap: 25px;
  }
}
@media screen {
  .l-grid-col-gap-26 {
    grid-column-gap: 26px;
  }
}
@media screen {
  .l-grid-col-gap-30 {
    grid-column-gap: 30px;
  }
}
@media screen {
  .l-grid-col-gap-36 {
    grid-column-gap: 36px;
  }
}
@media screen {
  .l-grid-col-gap-40 {
    grid-column-gap: 40px;
  }
}
@media screen {
  .l-grid-col-gap-45 {
    grid-column-gap: 45px;
  }
}
@media screen {
  .l-grid-col-gap-142 {
    grid-column-gap: 142px;
  }
}
@media screen {
  .l-grid-row-gap-15 {
    grid-row-gap: 15px;
  }
}
@media screen {
  .l-grid-row-gap-18 {
    grid-row-gap: 18px;
  }
}
@media screen {
  .l-grid-row-gap-20 {
    grid-row-gap: 20px;
  }
}
@media screen {
  .l-grid-row-gap-25 {
    grid-row-gap: 25px;
  }
}
@media screen {
  .l-grid-row-gap-26 {
    grid-row-gap: 26px;
  }
}
@media screen {
  .l-grid-row-gap-30 {
    grid-row-gap: 30px;
  }
}
@media screen {
  .l-grid-row-gap-36 {
    grid-row-gap: 36px;
  }
}
@media screen {
  .l-grid-col-gap-60 {
    grid-column-gap: 60px;
  }
}
@media screen {
  .l-grid-row-gap-40 {
    grid-row-gap: 40px;
  }
}
@media screen {
  .l-grid-row-gap-50 {
    grid-row-gap: 50px;
  }
}
@media screen {
  .l-grid-row-gap-60 {
    grid-row-gap: 60px;
  }
}
@media screen and (max-width: 1080px) {
  .l-grid-2fr-1080 {
    display: grid;
    grid-template-columns: 1fr 1fr !important;
  }
}
@media screen and (max-width: 992px) {
  .l-grid-2fr-tablet {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 992px) {
  .l-grid-4fr-tablet {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 992px) {
  .l-grid-tablet {
    display: grid;
    grid-template-columns: 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-grid-mobile {
    display: grid;
    grid-template-columns: 1fr;
  }
}
@media screen and (max-width: 600px) {
  .l-grid-1fr-mobile {
    display: grid;
    grid-template-columns: 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-grid-mobile--force {
    display: grid;
    grid-template-columns: 1fr !important;
  }
}
@media screen {
  .l-mason-grid {
    display: grid;
    grid-column-gap: 26px;
    grid-row-gap: 26px;
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 1080px) {
  .l-mason-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-mason-grid {
    grid-template-columns: 1fr;
  }
}
@media screen {
  .l-mason-grid .c-tutorial-item {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-background--none {
    background: none;
  }
}
@media screen {
  .l-background--white {
    background: #ffffff;
  }
}
@media screen {
  .l-background--grey {
    background: #F2F6FA;
  }
}
@media screen {
  .l-background--blue-grey {
    background: #E2E6F7;
  }
}
@media screen {
  .l-background--black {
    background: #333333;
  }
}
@media screen {
  .l-background--black-slate {
    background: #2F4F4F !important;
  }
}
@media screen {
  .l-background--dark-black {
    background: #222222 !important;
  }
}
@media screen {
  .l-background--yellow {
    background: #F3B36A !important;
  }
}
@media screen {
  .l-background--yellow-grandis {
    background: #FDCF74 !important;
  }
}
@media screen {
  .l-background--blue {
    background: #157CB8 !important;
  }
}
@media screen {
  .l-overflow-x {
    overflow: hidden;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}
@media screen {
  .l-overflow-hidden {
    overflow: hidden;
  }
}
@media screen and (max-width: 768px) {
  .l-overflow-hidden--mobile {
    overflow: hidden;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .l-overflow-hidden--mobile::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media screen {
  .l-no-border {
    border: none !important;
  }
}
@media screen {
  .l-border-top-grey {
    border-top: 1px solid #DBDDE0;
  }
}
@media screen {
  .l-border-top-grey-catskill {
    border-top: 1px solid #DFE7F0;
  }
}
@media screen {
  .l-border-bottom-grey {
    border-bottom: 1px solid #DBDDE0;
  }
}
@media screen {
  .l-border-bottom-grey-aqua-haze {
    border-bottom: 1px solid #EFF3F6;
  }
}
@media screen {
  .l-border-bottom-grey-mako {
    border-bottom: 1px solid #434A53;
  }
}
@media screen {
  .l-border-radius {
    border-radius: 0.5625rem;
  }
}
@media screen {
  .l-display-block {
    display: block;
  }
}
@media screen {
  .l-display-block--force {
    display: block !important;
  }
}
@media screen {
  .l-inline-block {
    display: inline-block;
  }
}
@media screen {
  .l-inline-flex {
    display: inline-flex;
  }
}
@media screen and (max-width: 768px) {
  .l-block-mobile-large {
    display: block;
  }
}
@media screen and (max-width: 600px) {
  .l-block-mobile {
    display: block;
  }
}
@media screen {
  .l-cursor-pointer {
    cursor: pointer;
  }
}
@media screen {
  .l-z-index-1 {
    z-index: 1;
  }
}
@media screen {
  .l-border-top {
    border-top: 1px solid #DFE7F0;
  }
}
@media screen {
  .l-border-bottom {
    border-bottom: 1px solid #DFE7F0;
  }
}
@media screen {
  .l-no-focus:focus {
    box-shadow: none !important;
    outline: 0 !important;
  }
}
@media screen {
  .l-image-float-left {
    float: left;
    margin-right: 30px;
  }
  .l-image-float-left img {
    margin-top: 0 !important;
    margin-bottom: 18px !important;
  }
}
@media screen {
  .l-image-float-right {
    float: right;
    margin-left: 30px;
  }
  .l-image-float-right img {
    margin-top: 0 !important;
    margin-bottom: 18px !important;
  }
}
@media screen {
  .l-visibility-hidden {
    visibility: hidden;
  }
}
@media screen {
  .l-rotate-180 {
    transform: rotate(180deg);
  }
}
@media screen {
  .l-admin {
    padding-left: 80px;
  }
}
@media screen and (max-width: 992px) {
  .l-admin {
    padding-left: 0;
  }
}
@media screen {
  .l-admin .container {
    padding-top: 36px;
    padding-bottom: 90px;
  }
}
@media screen {
  .l-admin-big-container {
    margin: 0 -40px;
  }
}
@media screen and (max-width: 1200px) {
  .l-admin-big-container {
    margin: 0;
  }
}
@media screen {
  .admin__subtitle {
    font-size: 1rem;
    color: #6E7687;
    margin-top: 15px;
  }
}
@media screen and (max-width: 600px) {
  .admin__subtitle {
    font-size: 0.9375em;
  }
}
@media screen {
  .l-admin--sidebar-open {
    padding-left: 320px;
  }
}
@media screen and (max-width: 1080px) {
  .l-admin--sidebar-open {
    padding-left: 270px;
  }
}
@media screen and (max-width: 992px) {
  .l-admin--sidebar-open {
    padding-left: 0;
    padding-right: 0;
  }
}
@media screen {
  .l-admin--sidebar-open .c-banner-draper .c-banner-draper__copy p {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .l-admin--sidebar-open .c-banner-draper .c-banner-draper__copy p {
    display: block;
  }
}
@media screen {
  .l-admin--sidebar-open .c-nav-sidebar--article {
    width: 320px !important;
  }
  .l-admin--sidebar-open .c-nav-sidebar--article .c-sidebar-navigator, .l-admin--sidebar-open .c-nav-sidebar--article .c-nav-sidebar__title {
    display: block;
  }
}
@media screen and (max-width: 1080px) {
  .l-admin--sidebar-open .c-nav-sidebar--article {
    width: 270px !important;
  }
}
@media screen and (max-width: 1200px) {
  .l-admin--sidebar-open .c-written-tutorial {
    padding-left: 60px;
    padding-right: 60px;
  }
}
@media screen and (max-width: 992px) {
  .l-admin--sidebar-open .c-written-tutorial {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen {
  .l-admin--sidebar-open .c-nav-sidebar__nav-action .o-button__label--open {
    display: inline-flex !important;
  }
  .l-admin--sidebar-open .c-nav-sidebar__nav-action .o-button__label--close {
    display: none;
  }
  .l-admin--sidebar-open .c-nav-sidebar__nav-action i {
    margin-right: 10px !important;
  }
}
@media screen {
  .l-admin--sidebar-open .c-global-header__logo .o-header-logo__text {
    opacity: 1 !important;
  }
}
@media screen {
  .l-video-overlay {
    background: linear-gradient(to right bottom, #333333, #363638, #38393d, #3a3c43, #3b4048);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
  }
  .l-video-overlay h3 {
    font-size: 2.25rem; /* 42/16 */
    text-align: center;
    color: #ffffff;
  }
}
@media screen {
  .l-video-overlay--start {
    align-items: flex-start;
  }
}
@media screen {
  .l-tutorial-collection {
    padding-top: 42px;
  }
  .l-tutorial-collection .l-margin-24 {
    margin-top: 24px !important;
  }
}
@media screen {
  .l-block-tutorials {
    margin: 0;
    max-width: 1500px;
  }
}
@media screen and (min-width: 1440px) {
  .l-block-tutorials {
    margin: 0 auto;
  }
}
@media screen and (max-width: 768px) {
  .l-block-tutorials {
    max-width: none;
  }
}
@media screen {
  .l-block-tutorials .c-tutorial-item__metadata {
    display: none !important;
  }
}
@media screen {
  .l-block-tutorials .c-tutorial-item__metadata-short {
    color: #333333;
  }
}
@media screen {
  .l-block-tutorials .c-tutorial-item__metadata-short, .l-block-tutorials .c-tutorial-item__type {
    display: block !important;
    margin-top: 6px;
  }
}
@media screen {
  .l-tutorial-container {
    margin: 0 auto;
  }
}
@media screen and (max-width: 1280px) {
  .l-tutorial-container {
    padding-right: 0;
  }
}
@media screen {
  .l-tutorial-container:hover .o-button__icon {
    opacity: 1;
  }
}
@media screen {
  .l-tutorial-container .c-tutorial-item {
    width: 300px;
    min-width: 300px;
  }
}
@media screen and (max-width: 992px) {
  .l-tutorial-container .c-tutorial-item {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-tutorial-container--slider {
    position: relative;
  }
  .l-tutorial-container--slider .c-tutorial-item {
    margin: 0 9px;
  }
  .l-tutorial-container--slider .o-button__icon--prev {
    position: absolute;
    top: 0;
    width: 50px;
    height: 100%;
    cursor: pointer;
    opacity: 0;
    transition: all 0.5s;
    left: 10px;
  }
}
@media screen and (max-width: 992px) {
  .l-tutorial-container--slider .o-button__icon--prev {
    opacity: 1;
  }
}
@media screen {
  .l-tutorial-container--slider .o-button__icon--prev span {
    position: absolute;
    top: 50%;
    width: 50px;
    height: 50px;
    background: rgba(51, 51, 51, 0.5);
    transition: all 0.5s;
    margin-top: -25px;
    border-radius: 0.5625rem;
  }
  .l-tutorial-container--slider .o-button__icon--prev span:hover {
    background: rgba(51, 51, 51, 0.9);
  }
}
@media screen {
  .l-tutorial-container--slider .o-button__icon--prev svg {
    transform: rotate(180deg);
  }
}
@media screen {
  .l-tutorial-container--slider .o-button__icon--next {
    position: absolute;
    top: 0;
    width: 50px;
    height: 100%;
    cursor: pointer;
    opacity: 0;
    transition: all 0.5s;
    right: 10px;
  }
}
@media screen and (max-width: 992px) {
  .l-tutorial-container--slider .o-button__icon--next {
    opacity: 1;
  }
}
@media screen {
  .l-tutorial-container--slider .o-button__icon--next span {
    position: absolute;
    top: 50%;
    width: 50px;
    height: 50px;
    background: rgba(51, 51, 51, 0.5);
    transition: all 0.5s;
    margin-top: -25px;
    border-radius: 0.5625rem;
  }
  .l-tutorial-container--slider .o-button__icon--next span:hover {
    background: rgba(51, 51, 51, 0.9);
  }
}
@media screen {
  .l-home-hero {
    display: grid;
    grid-template-columns: 1fr 400px;
    grid-column-gap: 54px;
  }
}
@media screen and (max-width: 1280px) {
  .l-home-hero {
    padding: 0 30px;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-hero {
    grid-template-columns: 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-home-hero {
    grid-template-columns: 1fr;
    padding: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-home-hero .l-home-hero__controls {
    display: block;
    text-align: center;
  }
  .l-home-hero .l-home-hero__controls .c-tabs {
    justify-content: center;
  }
}
@media screen {
  .l-home-hero .l-home-hero__video-wrapper .c-tutorial-item {
    margin-top: 0;
  }
  .l-home-hero .l-home-hero__video-wrapper .c-tutorial-item a {
    border-radius: 0 0 0.5625rem 0.5625rem !important;
  }
}
@media screen and (max-width: 768px) {
  .l-home-hero .l-home-hero__video-wrapper .c-tutorial-item .c-tutorial-item__art {
    display: none;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-hero .l-home-hero__new {
    margin-top: 30px;
  }
}
@media screen {
  .l-home-hero .l-video-overlay {
    background: #ffffff;
  }
}
@media screen {
  .l-home-hero .l-home-hero__video-player {
    width: 100%;
    padding-top: 56.25%;
    background: #ffffff;
    border-radius: 0.5625rem 0.5625rem 0 0;
    position: relative;
    overflow: hidden;
  }
}
@media screen and (max-width: 768px) {
  .l-home-hero .l-home-hero__video-player {
    border-radius: 0.5625rem;
  }
}
@media screen {
  .l-home-hero .l-home-hero__video-player img {
    width: 100%;
  }
}
@media screen {
  .l-follow-pillars {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0px rgba(0, 0, 0, 0.05);
    overflow: hidden;
  }
}
@media screen and (max-width: 1280px) {
  .l-follow-pillars {
    padding: 0 0 0 30px;
  }
}
@media screen and (max-width: 768px) {
  .l-follow-pillars {
    padding: 0;
  }
}
@media screen {
  .l-follow-pillars > div {
    height: 90px;
    white-space: nowrap;
    overflow-x: auto;
    touch-action: none;
    -webkit-overflow-scrolling: touch;
  }
}
@media screen {
  .l-follow-pillars h3 {
    margin-right: -146px;
  }
}
@media screen and (max-width: 992px) {
  .l-follow-pillars h3 {
    margin-right: 15px;
  }
}
@media screen {
  .l-follow-pillars ul {
    margin-left: auto;
    margin-right: auto;
  }
  .l-follow-pillars ul li {
    margin: 0 6px;
  }
}
@media screen {
  .l-library.l-background--black h3 {
    color: #ffffff;
  }
  .l-library.l-background--black .c-search__no-results h3, .l-library.l-background--black .c-search__no-results h4, .l-library.l-background--black .c-search__no-results p {
    color: #ffffff;
  }
  .l-library.l-background--black .c-search__no-results .o-tag {
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
  .l-library.l-background--black .c-search__loading__title, .l-library.l-background--black .l-library__results {
    color: #ffffff;
  }
  .l-library.l-background--black .c-library-controls div.o-text-button span {
    color: #ffffff;
  }
  .l-library.l-background--black .c-library-controls div.o-text-button svg {
    fill: #ffffff;
  }
  .l-library.l-background--black .o-button__icon span {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    background: #ffffff;
  }
  .l-library.l-background--black .o-button__icon svg {
    fill: #333333;
  }
}
@media screen {
  .l-tutorial-next-course .c-tutorial-item__in-progress {
    display: none !important;
  }
}
@media screen and (max-width: 768px) {
  .l-tutorial-next-course .c-tutorial-item__metadata-short {
    display: flex !important;
  }
}
@media screen and (max-width: 768px) {
  .l-tutorial-next-course .c-tutorial-item__art {
    display: none !important;
  }
}
@media screen {
  .l-book-chapter .l-admin {
    padding-left: 0;
  }
  .l-book-chapter .l-admin--sidebar-open {
    padding-left: 320px;
  }
}
@media screen and (max-width: 1080px) {
  .l-book-chapter .l-admin--sidebar-open {
    padding-left: 270px;
  }
}
@media screen and (max-width: 992px) {
  .l-book-chapter .l-admin--sidebar-open {
    padding-left: 0;
    padding-right: 0;
  }
}
@media screen {
  .l-book-chapter .l-admin--sidebar-open .c-nav-sidebar--article {
    width: 320px !important;
  }
  .l-book-chapter .l-admin--sidebar-open .c-nav-sidebar--article .c-sidebar-navigator, .l-book-chapter .l-admin--sidebar-open .c-nav-sidebar--article .c-nav-sidebar__title {
    display: block;
  }
}
@media screen and (max-width: 1080px) {
  .l-book-chapter .l-admin--sidebar-open .c-nav-sidebar--article {
    width: 270px !important;
  }
}
@media screen {
  .l-book-chapter .l-admin--sidebar-open .o-button-chapter {
    display: none;
  }
}
@media screen and (max-width: 1200px) {
  .l-book-chapter .l-admin--sidebar-open .c-written-tutorial {
    padding-left: 48px;
    padding-right: 48px;
  }
}
@media screen and (max-width: 992px) {
  .l-book-chapter .l-admin--sidebar-open .c-written-tutorial {
    padding-left: 24px;
    padding-right: 24px;
  }
}
@media screen {
  .l-book-chapter .l-admin--sidebar-open .c-nav-sidebar__nav-action .o-button__label--open {
    display: inline-flex !important;
  }
  .l-book-chapter .l-admin--sidebar-open .c-nav-sidebar__nav-action .o-button__label--close {
    display: none;
  }
  .l-book-chapter .l-admin--sidebar-open .c-nav-sidebar__nav-action i {
    margin-right: 10px !important;
  }
}
@media screen {
  .l-book-chapter .c-written-tutorial__introduction h1 {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
  }
  .l-book-chapter .c-written-tutorial__introduction h1 > span:first-child {
    font-size: 5.2rem; /* 90/16 */
    margin-right: 15px;
    letter-spacing: -5px;
  }
  .l-book-chapter .c-written-tutorial__introduction h1 span {
    display: block;
  }
  .l-book-chapter .c-written-tutorial__introduction > div span:first-child {
    font-size: 2.5rem;
  }
}
@media screen and (max-width: 768px) {
  .l-book-chapter .c-written-tutorial__content {
    margin-top: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .l-book-chapter .c-written-tutorial__content h1, .l-book-chapter .c-written-tutorial__content h2, .l-book-chapter .c-written-tutorial__content h3, .l-book-chapter .c-written-tutorial__content h4, .l-book-chapter .c-written-tutorial__content h5 {
    margin-top: 30px !important;
  }
}
@media screen {
  .l-book-chapter .l-book-header--hide {
    display: none !important;
  }
  .l-book-chapter .l-book-header--margin {
    margin-left: -3px !important;
  }
}
@media screen {
  .l-book-chapter-end-message {
    padding: 60px 24px 60px;
    border-top: 1px solid #DFE7F0;
    margin-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-book-chapter-end-message {
    padding: 60px 0;
  }
}
@media screen {
  .l-book-chapter-end-message p {
    font-size: 0.9375rem !important; /* 15/16 */
    color: #6E7687;
  }
}
@media screen {
  .l-book-materials-download a, .l-book-materials-download button {
    background: #3B4048 !important;
  }
  .l-book-materials-download a:hover, .l-book-materials-download button:hover {
    background: #424750 !important;
  }
  .l-book-materials-download a svg, .l-book-materials-download button svg {
    fill: #333333 !important;
  }
  .l-book-materials-download .c-modal .c-modal__close {
    background: none !important;
  }
}
@media screen and (max-width: 800px) {
  .l-book-materials-download .c-modal .c-modal__close {
    width: 36px !important;
  }
}
@media screen {
  .l-book-materials-download .c-modal .c-modal__description a {
    background: none !important;
  }
}
@media screen {
  .l-book-materials-download .c-modal .o-button--green {
    background: #158443 !important;
  }
}
@media screen and (max-width: 800px) {
  .l-book-materials-download .c-modal .o-button--green {
    width: auto !important;
  }
}
@media screen and (max-width: 800px) {
  .l-book-materials-download .c-modal .o-button--green .o-button__icon--right {
    margin-left: 10px !important;
  }
}
@media screen {
  .l-book-materials-download .c-modal .o-button--green svg {
    fill: #158443 !important;
  }
}
@media screen {
  .l-chapter-font-serif .c-book-chapter .c-written-tutorial__content p, .l-chapter-font-serif .c-book-chapter .c-written-tutorial__content ul, .l-chapter-font-serif .c-book-chapter .c-written-tutorial__content ol, .l-chapter-font-serif .c-book-chapter .c-written-tutorial__content .note, .l-chapter-font-serif .c-book-chapter .c-written-tutorial__content figcaption {
    font-family: "IBM Plex Serif", serif !important;
  }
}
@media screen {
  .c-reading-experience-selector .l-chapter-font-serif label {
    font-family: "IBM Plex Serif", serif !important;
  }
}
@media screen {
  .l-chapter-font-sans-serif .c-book-chapter .c-written-tutorial__content p, .l-chapter-font-sans-serif .c-book-chapter .c-written-tutorial__content ul, .l-chapter-font-sans-serif .c-book-chapter .c-written-tutorial__content ol, .l-chapter-font-sans-serif .c-book-chapter .c-written-tutorial__content .note, .l-chapter-font-sans-serif .c-book-chapter .c-written-tutorial__content figcaption {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
  }
}
@media screen {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content h1, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content h2 {
    font-size: 1.875em;
  }
}
@media screen and (max-width: 768px) {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content h1, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content h2 {
    font-size: 1.5em; /* 24/16 */
  }
}
@media screen {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content h3 {
    font-size: 1.5em;
  }
}
@media screen and (max-width: 768px) {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content h3 {
    font-size: 1.25em; /* 21/16 */
  }
}
@media screen {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content h4 {
    font-size: 1.188em;
  }
}
@media screen and (max-width: 768px) {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content h4 {
    font-size: 1.0625em;
  }
}
@media screen {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content ul, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content ol, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content p, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content blockquote {
    font-size: 1.0625em;
  }
}
@media screen and (max-width: 768px) {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content ul, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content ol, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content p, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content blockquote {
    font-size: 0.9375em; /* 15/16 */
    margin-top: 18px;
  }
}
@media screen {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content ul p, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content ol p, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content p p, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content blockquote p {
    font-size: 1em;
  }
}
@media screen {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content ul li p, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content ol li p, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content p li p, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content blockquote li p {
    margin-top: 0.5rem;
    font-size: 1em;
    display: inherit;
  }
}
@media screen {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content ul ul, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content ul ol, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content ol ul, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content ol ol, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content p ul, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content p ol, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content blockquote ul, .l-book-chapter article.c-written-tutorial .c-written-tutorial__content blockquote ol {
    font-size: 1em;
  }
}
@media screen {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content pre {
    font-size: 0.8125em;
  }
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content pre code {
    font-size: 1em;
  }
}
@media screen {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content code {
    font-size: 0.875em;
  }
}
@media screen {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content blockquote {
    font-size: 1em;
  }
}
@media screen and (max-width: 768px) {
  .l-book-chapter article.c-written-tutorial .c-written-tutorial__content blockquote {
    font-size: 0.9375em; /* 15/16 */
  }
}
@media screen {
  .l-chapter-text-size-75 .c-book-chapter .c-written-tutorial__content {
    font-size: 75%;
  }
  .l-chapter-text-size-75 .c-book-chapter .c-written-tutorial__content h1, .l-chapter-text-size-75 .c-book-chapter .c-written-tutorial__content h2, .l-chapter-text-size-75 .c-book-chapter .c-written-tutorial__content h3, .l-chapter-text-size-75 .c-book-chapter .c-written-tutorial__content h4, .l-chapter-text-size-75 .c-book-chapter .c-written-tutorial__content h5 {
    margin-top: 30px;
  }
  .l-chapter-text-size-75 .c-book-chapter .c-written-tutorial__content ul, .l-chapter-text-size-75 .c-book-chapter .c-written-tutorial__content ol, .l-chapter-text-size-75 .c-book-chapter .c-written-tutorial__content p, .l-chapter-text-size-75 .c-book-chapter .c-written-tutorial__content blockquote {
    margin-top: 18px;
  }
  .l-chapter-text-size-75 .c-book-chapter .c-written-tutorial__content blockquote p:first-child {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-chapter-text-size-80 .c-book-chapter .c-written-tutorial__content {
    font-size: 80%;
  }
  .l-chapter-text-size-80 .c-book-chapter .c-written-tutorial__content h1, .l-chapter-text-size-80 .c-book-chapter .c-written-tutorial__content h2, .l-chapter-text-size-80 .c-book-chapter .c-written-tutorial__content h3, .l-chapter-text-size-80 .c-book-chapter .c-written-tutorial__content h4, .l-chapter-text-size-80 .c-book-chapter .c-written-tutorial__content h5 {
    margin-top: 30px;
  }
  .l-chapter-text-size-80 .c-book-chapter .c-written-tutorial__content ul, .l-chapter-text-size-80 .c-book-chapter .c-written-tutorial__content ol, .l-chapter-text-size-80 .c-book-chapter .c-written-tutorial__content p, .l-chapter-text-size-80 .c-book-chapter .c-written-tutorial__content blockquote {
    margin-top: 18px;
  }
  .l-chapter-text-size-80 .c-book-chapter .c-written-tutorial__content blockquote p:first-child {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-chapter-text-size-85 .c-book-chapter .c-written-tutorial__content {
    font-size: 85%;
  }
}
@media screen {
  .l-chapter-text-size-90 .c-book-chapter .c-written-tutorial__content {
    font-size: 90%;
  }
}
@media screen {
  .l-chapter-text-size-100 .c-book-chapter .c-written-tutorial__content {
    font-size: 100%;
  }
}
@media screen {
  .l-chapter-text-size-110 .c-book-chapter .c-written-tutorial__content {
    font-size: 110%;
  }
}
@media screen {
  .l-chapter-text-size-120 .c-book-chapter .c-written-tutorial__content {
    font-size: 120%;
  }
}
@media screen {
  .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content {
    font-size: 130%;
  }
  .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content h1, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content h2, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content h3, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content h4, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content h5 {
    margin-top: 42px;
  }
}
@media screen and (max-width: 768px) {
  .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content h1, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content h2, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content h3, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content h4, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content h5 {
    margin-top: 30px !important;
  }
}
@media screen {
  .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content ul, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content ol, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content p, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content blockquote {
    margin-top: 30px;
  }
}
@media screen and (max-width: 768px) {
  .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content ul, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content ol, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content p, .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content blockquote {
    margin-top: 24px !important;
  }
}
@media screen {
  .l-chapter-text-size-130 .c-book-chapter .c-written-tutorial__content blockquote p:first-child {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content {
    font-size: 140%;
  }
  .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content h1, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content h2, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content h3, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content h4, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content h5 {
    margin-top: 42px;
  }
}
@media screen and (max-width: 768px) {
  .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content h1, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content h2, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content h3, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content h4, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content h5 {
    margin-top: 30px !important;
  }
}
@media screen {
  .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content ul, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content ol, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content p, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content blockquote {
    margin-top: 30px;
  }
}
@media screen and (max-width: 768px) {
  .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content ul, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content ol, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content p, .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content blockquote {
    margin-top: 24px !important;
  }
}
@media screen {
  .l-chapter-text-size-140 .c-book-chapter .c-written-tutorial__content blockquote p:first-child {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-page-size-456 .c-book-chapter, .l-page-size-456 .c-written-tutorial__content {
    max-width: 456px;
  }
}
@media screen {
  .l-page-size-572 .c-book-chapter, .l-page-size-572 .c-written-tutorial__content {
    max-width: 572px;
  }
}
@media screen {
  .l-page-size-688 .c-book-chapter, .l-page-size-688 .c-written-tutorial__content {
    max-width: 688px;
  }
}
@media screen {
  .l-page-size-920 .l-admin--sidebar-open .c-book-chapter, .l-page-size-920 .l-admin--sidebar-open .c-written-tutorial__content {
    max-width: 820px !important;
  }
}
@media screen and (min-width: 1440px) {
  .l-page-size-920 .l-admin--sidebar-open .c-book-chapter, .l-page-size-920 .l-admin--sidebar-open .c-written-tutorial__content {
    max-width: 920px !important;
  }
}
@media screen {
  .l-page-size-920 .c-book-chapter, .l-page-size-920 .c-written-tutorial__content {
    max-width: 920px;
  }
}
@media screen and (max-width: 1280px) {
  .l-page-size-920 .o-button-chapter {
    width: 60px;
  }
}
@media screen and (max-width: 1120px) {
  .l-page-size-920 .o-button-chapter {
    display: none;
  }
}
@media screen {
  .l-page-size-1036 .l-admin--sidebar-open {
    padding-left: 320px;
  }
}
@media screen and (max-width: 1080px) {
  .l-page-size-1036 .l-admin--sidebar-open {
    padding-left: 270px;
  }
}
@media screen and (max-width: 992px) {
  .l-page-size-1036 .l-admin--sidebar-open {
    padding-left: 0;
  }
}
@media screen {
  .l-page-size-1036 .l-admin--sidebar-open .c-book-chapter, .l-page-size-1036 .l-admin--sidebar-open .c-written-tutorial__content {
    max-width: 820px !important;
  }
}
@media screen and (min-width: 1440px) {
  .l-page-size-1036 .l-admin--sidebar-open .c-book-chapter, .l-page-size-1036 .l-admin--sidebar-open .c-written-tutorial__content {
    max-width: 1036px !important;
  }
}
@media screen {
  .l-page-size-1036 .c-book-chapter, .l-page-size-1036 .c-written-tutorial__content {
    max-width: 1036px;
  }
}
@media screen and (max-width: 1120px) {
  .l-page-size-1036 .c-book-chapter {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media screen and (max-width: 1350px) {
  .l-page-size-1036 .o-button-chapter {
    width: 60px;
  }
}
@media screen and (max-width: 1280px) {
  .l-page-size-1036 .o-button-chapter {
    display: none;
  }
}
@media screen {
  .c-book-chapter .l-image-100 img {
    max-width: 100% !important;
  }
  .c-book-chapter .l-image-90 img {
    max-width: 90% !important;
  }
  .c-book-chapter .l-image-80 img {
    max-width: 80% !important;
  }
  .c-book-chapter .l-image-70 img {
    max-width: 70% !important;
  }
  .c-book-chapter .l-image-60 img {
    max-width: 60% !important;
  }
  .c-book-chapter .l-image-50 img {
    max-width: 50% !important;
  }
  .c-book-chapter .l-image-40 img {
    max-width: 40% !important;
  }
  .c-book-chapter .l-image-30 img {
    max-width: 30% !important;
  }
  .c-book-chapter .l-image-20 img {
    max-width: 20% !important;
  }
  .c-book-chapter .l-image-10 img {
    max-width: 10% !important;
  }
}
@media screen {
  .l-book-hero {
    padding-bottom: 0 !important;
  }
}
@media screen and (max-width: 992px) {
  .l-book-hero {
    padding-bottom: 45px !important;
  }
}
@media screen and (max-width: 768px) {
  .l-book-hero {
    padding-top: 45px !important;
  }
}
@media screen and (max-width: 600px) {
  .l-book-hero {
    padding-top: 30px !important;
    padding-bottom: 15px !important;
  }
}
@media screen {
  .l-book-hero .l-collection-hero__wrapper {
    grid-template-columns: 300px 1fr !important;
    align-items: flex-start !important;
  }
}
@media screen and (max-width: 992px) {
  .l-book-hero .l-collection-hero__wrapper {
    grid-column-gap: 0 !important;
    grid-template-columns: 285px 1fr !important;
  }
}
@media screen and (max-width: 768px) {
  .l-book-hero .l-collection-hero__wrapper {
    grid-template-columns: 1fr !important;
  }
}
@media screen and (max-width: 768px) {
  .l-book-hero .l-collection-hero__artwork {
    width: 100% !important;
    margin-left: 0 !important;
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .l-book-hero .l-collection-hero__copy {
    background: none !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
    padding: 0 !important;
  }
  .l-book-hero .l-collection-hero__copy h1, .l-book-hero .l-collection-hero__copy > span {
    text-align: center;
  }
}
@media screen {
  .l-book-hero .l-collection-hero__copy .rating {
    color: #333333 !important;
  }
  .l-book-hero .l-collection-hero__copy .rating .l-button__svg-empty-star {
    fill: #CACED2;
  }
}
@media screen {
  .l-book-hero .l-collection-hero__copy-markdown {
    font-size: 1.1875em !important; /* 21/16 */ /* 19/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-book-hero .l-collection-hero__copy-markdown {
    font-size: 1rem !important; /* 17/16 */
  }
}
@media screen and (max-width: 992px) {
  .l-book-hero .l-collection-hero__artwork img {
    max-width: 240px !important;
  }
}
@media screen and (max-width: 768px) {
  .l-book-hero .l-collection-hero__artwork img {
    max-width: 180px !important;
  }
}
@media screen and (max-width: 800px) {
  .l-book-hero .l-book-hero__buttons {
    display: flex;
    flex-wrap: wrap;
  }
  .l-book-hero .l-book-hero__buttons > div {
    width: 100%;
  }
  .l-book-hero .l-book-hero__buttons .l-margin-right-9 {
    margin-right: 0 !important;
  }
  .l-book-hero .l-book-hero__buttons a, .l-book-hero .l-book-hero__buttons button {
    width: 100%;
  }
  .l-book-hero .l-book-hero__buttons a .o-button__label, .l-book-hero .l-book-hero__buttons button .o-button__label {
    margin-left: auto;
    margin-right: auto;
  }
  .l-book-hero .l-book-hero__buttons a .o-button__icon--left, .l-book-hero .l-book-hero__buttons button .o-button__icon--left {
    margin-right: -24px;
  }
  .l-book-hero .l-book-hero__buttons a .o-button__icon--right, .l-book-hero .l-book-hero__buttons button .o-button__icon--right {
    margin-left: -24px;
  }
  .l-book-hero .l-book-hero__buttons .l-book-materials-download {
    order: 2;
    margin-top: 15px;
  }
}
@media screen and (max-width: 600px) {
  .l-book-hero .l-book-hero__buttons .l-book-materials-download .u-hide-mobile {
    display: inline-block !important;
  }
}
@media screen {
  .l-book-modules .l-collection-modules__module {
    grid-template-columns: 300px 1fr !important;
    grid-column-gap: 90px !important;
  }
}
@media screen and (max-width: 992px) {
  .l-book-modules .l-collection-modules__module {
    grid-template-columns: 1fr !important;
  }
}
@media screen and (max-width: 992px) {
  .l-book-modules .l-collection-modules__pitch-cards {
    order: 2;
  }
}
@media screen {
  .l-book-sales-grid {
    max-width: 1152px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 6fr 4fr;
    grid-column-gap: 16px;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-grid {
    grid-template-columns: 1fr;
  }
}
@media screen {
  .l-book-sales-left {
    padding-right: 50px;
  }
}
@media screen and (max-width: 1200px) {
  .l-book-sales-left {
    padding-right: 24px;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-left {
    padding-right: 0;
  }
}
@media screen {
  .l-book-sales-left-top {
    display: grid;
    grid-template-columns: 0.25fr 0.75fr;
    grid-column-gap: 8px;
  }
}
@media screen and (max-width: 1200px) {
  .l-book-sales-left-top {
    grid-column-gap: 24px;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-left-top {
    grid-template-columns: 2fr 8fr;
  }
}
@media screen and (max-width: 992px) {
  .l-collection-hero__copy-markdown {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero__copy-markdown {
    display: none;
  }
}
@media screen {
  .l-book-meta > div {
    margin-top: 30px;
  }
  .l-book-meta > div:first-child {
    margin-top: 0;
  }
  .l-book-meta span {
    display: block;
    font-size: 0.9375rem; /* 15/16 */
    text-align: right;
  }
}
@media screen and (max-width: 768px) {
  .l-book-meta span {
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen {
  .l-book-meta span:last-child {
    font-weight: 700;
    margin-top: 3px;
  }
}
@media screen {
  .l-book-art {
    text-align: right;
  }
}
@media screen and (max-width: 768px) {
  .l-book-art {
    text-align: left;
  }
}
@media screen {
  .l-book-art img {
    max-width: 396px;
    width: 100%;
    border-radius: 0.9375rem; /* 15/16 */
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
  }
}
@media screen and (max-width: 768px) {
  .l-book-art img {
    max-width: 324px;
  }
}
@media screen {
  .l-book-art .l-button-look-inside {
    margin: -38px 0 0 -96px;
  }
  .l-book-art .l-button-look-inside .o-button__icon--left {
    width: 32px;
    height: 32px;
    margin-right: 12px;
  }
}
@media screen {
  .l-book-sales-copy h2 {
    font-size: 1.5rem; /* 24/16 */
    margin-top: 18px;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-copy h2 {
    font-size: 1.375rem; /* 22/16 */
  }
}
@media screen {
  .l-book-sales-copy h2:first-child {
    margin-top: 0;
  }
}
@media screen {
  .l-book-sales-copy h3 {
    font-size: 1.25rem; /* 20/16 */
    margin-top: 15px;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-copy h3 {
    font-size: 1.1875rem; /* 19/16 */
  }
}
@media screen {
  .l-book-sales-copy h4 {
    font-size: 1.0625rem; /* 17/16 */
    margin-top: 12px;
  }
}
@media screen {
  .l-book-sales-copy p {
    margin-top: 18px;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-copy p {
    font-size: 1rem; /* 15/16 */
  }
}
@media screen {
  .l-book-sales-copy ul, .l-book-sales-copy ol {
    margin-top: 18px;
    list-style: inherit;
    padding-left: 18px;
  }
  .l-book-sales-copy ul li, .l-book-sales-copy ol li {
    margin-top: 10px;
  }
}
@media screen {
  .l-book-sales-copy ul {
    list-style: disc;
  }
}
@media screen {
  .l-book-sales-copy ol {
    list-style: decimal;
  }
}
@media screen {
  .l-book-sales-copy a {
    color: #158443;
  }
}
@media screen {
  .l-book-toc h2 {
    margin-top: 45px;
  }
}
@media screen and (max-width: 768px) {
  .l-book-toc h2 {
    font-size: 1.375rem; /* 22/16 */
  }
}
@media screen {
  .l-book-toc h2:first-child {
    margin-top: 0;
  }
}
@media screen {
  .l-book-toc h4 {
    line-height: 1.25;
  }
}
@media screen and (max-width: 768px) {
  .l-book-toc h4 {
    font-size: 1.1875rem !important; /* 19/16 */
  }
}
@media screen {
  .l-book-toc .c-tutorial-episode {
    margin-top: 20px;
  }
  .l-book-toc .c-tutorial-episode:before {
    height: calc(100% - 33px);
  }
}
@media screen {
  .l-book-toc .c-tutorial-episode p {
    margin-top: 6px;
    font-size: 0.9375em; /* 15/16 */
  }
}
@media screen {
  .l-book-toc .l-book-toc-section-description {
    position: relative;
    padding-left: 64px;
    margin-top: 20px;
  }
  .l-book-toc .l-book-toc-section-description:before {
    content: "";
    position: absolute;
    left: 20px;
    top: 0;
    width: 6px;
    height: 100%;
    background: #DFE7F0;
    border-radius: 100px;
    transition: 0.75s all;
  }
  .l-book-toc .l-book-toc-section-description h1, .l-book-toc .l-book-toc-section-description h2, .l-book-toc .l-book-toc-section-description h3, .l-book-toc .l-book-toc-section-description h4, .l-book-toc .l-book-toc-section-description h5 {
    margin-top: 15px;
  }
  .l-book-toc .l-book-toc-section-description p, .l-book-toc .l-book-toc-section-description ul, .l-book-toc .l-book-toc-section-description ol {
    font-size: 0.9375em;
    margin-top: 15px;
  }
  .l-book-toc .l-book-toc-section-description p:first-child, .l-book-toc .l-book-toc-section-description ul:first-child, .l-book-toc .l-book-toc-section-description ol:first-child {
    margin-top: 0;
  }
  .l-book-toc .l-book-toc-section-description p em, .l-book-toc .l-book-toc-section-description ul em, .l-book-toc .l-book-toc-section-description ol em {
    font-style: italic;
    font-weight: 400;
  }
  .l-book-toc .l-book-toc-section-description p strong, .l-book-toc .l-book-toc-section-description ul strong, .l-book-toc .l-book-toc-section-description ol strong {
    font-weight: 700;
  }
  .l-book-toc .l-book-toc-section-description p em strong, .l-book-toc .l-book-toc-section-description ul em strong, .l-book-toc .l-book-toc-section-description ol em strong {
    font-style: italic;
    font-weight: 700;
  }
  .l-book-toc .l-book-toc-section-description p strong em, .l-book-toc .l-book-toc-section-description ul strong em, .l-book-toc .l-book-toc-section-description ol strong em {
    font-style: italic;
    font-weight: 700;
  }
  .l-book-toc .l-book-toc-section-description ul, .l-book-toc .l-book-toc-section-description ol {
    padding-left: 20px;
  }
  .l-book-toc .l-book-toc-section-description ul li, .l-book-toc .l-book-toc-section-description ol li {
    margin-top: 3px;
  }
  .l-book-toc .l-book-toc-section-description ul {
    list-style: disc;
  }
  .l-book-toc .l-book-toc-section-description ol {
    list-style: lower-roman;
  }
}
@media screen {
  .l-book-contributors .l-grid-3 {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-book-contributors .l-grid-3 {
    grid-template-columns: 1fr;
    grid-row-gap: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-book-contributors .c-content-author:first-child {
    margin-top: 0;
  }
}
@media screen {
  .l-book-contributors h3 {
    display: none;
  }
}
@media screen {
  .l-book-contributors .c-authors {
    background: none;
    padding: 0;
  }
}
@media screen {
  .l-book-contributors .l-block-wrapper {
    padding: 0;
  }
}
@media screen {
  .l-book-contributors .c-content-author p {
    display: none;
  }
}
@media screen {
  .l-book-contributors .c-content-author__title {
    font-size: 21px !important;
    line-height: 1.125;
    max-width: 96px;
  }
}
@media screen and (max-width: 768px) {
  .l-book-contributors .c-content-author__title {
    max-width: none;
    font-size: 1.1875rem !important; /* 19/16 */
  }
}
@media screen {
  .l-book-contributors .c-content-author img {
    width: 90px;
    height: 90px;
    border-radius: 0.5625rem; /* 9/16 */
    border: 0;
    box-shadow: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-book-contributors .c-content-author img {
    width: 72px;
    height: 72px;
  }
}
@media screen {
  .l-book-sales-right {
    margin-top: -24px;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right {
    position: fixed;
    z-index: 99999999;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 18px 24px;
    background: #ffffff;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
  }
}
@media screen {
  .l-book-sales-right .l-book-sales-right--container:hover {
    overflow-y: auto;
  }
}
@media screen {
  .l-book-sales-right .l-book-sales-right--container {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    padding-top: 24px;
    height: 100vh;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .l-book-sales-right .l-book-sales-right--container::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right .l-book-sales-right--container {
    padding-top: 0;
    height: auto;
  }
}
@media screen {
  .l-book-sales-right .l-book-sales-right--container .c-rating-count {
    margin-top: 6px !important;
  }
  .l-book-sales-right .l-book-sales-right--container .c-rating-count > div {
    margin-top: 0;
  }
}
@media screen and (max-width: 992px) {
  .l-book-sales-right .l-book-sales-right--container .c-rating-count {
    padding-bottom: 24px;
  }
}
@media screen and (max-width: 992px) {
  .l-book-sales-right .l-book-sales-right--container .c-rating-count a {
    position: absolute;
    bottom: 0;
    left: 0;
    margin: 0;
  }
}
@media screen {
  .l-book-sales-right .l-book-sales-right--container .c-rating-count--empty {
    margin-top: 3px !important;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right .l-book-sales-right--container .c-rating-count--empty {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-book-sales-right .l-book-sales-right--container .c-rating-count--empty a {
    color: #158443;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right .l-book-sales-right--container .c-rating-count--empty a {
    font-size: 0.875rem;
  }
}
@media screen {
  .l-book-sales-right .l-book-sales-right--container .o-button-close {
    display: none;
    position: absolute;
    right: 0;
    top: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right .l-book-sales-right--container .o-button-close {
    display: flex;
  }
}
@media screen {
  .l-book-sales-right .l-book-sales-right--container .l-button-book-meta-open {
    display: none;
  }
}
@media screen {
  .l-book-sales-right .l-book-sales-right--container-minify .l-button-book-meta-open {
    display: flex;
  }
}
@media screen and (min-width: 768px) {
  .l-book-sales-right .l-book-sales-right--container-minify .l-button-book-meta-open {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right .l-book-sales-right--container-minify h1, .l-book-sales-right .l-book-sales-right--container-minify p, .l-book-sales-right .l-book-sales-right--container-minify .l-book-sales-cta, .l-book-sales-right .l-book-sales-right--container-minify .o-button-close {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right .l-book-sales-right--container-minify > .l-flex {
    display: none;
  }
}
@media screen {
  .l-book-sales-right h1 {
    line-height: 1;
  }
}
@media screen and (max-width: 992px) {
  .l-book-sales-right h1 {
    font-size: 2.5rem;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right h1 {
    font-size: 1.375rem; /* 22/16 */
  }
}
@media screen {
  .l-book-sales-right .o-badge--pro {
    border-color: #157CB8;
    margin-right: 5px;
  }
}
@media screen {
  .l-book-sales-right a.rating {
    flex-wrap: wrap;
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right a.rating {
    display: none;
  }
}
@media screen {
  .l-book-sales-right a.rating .l-font-17 {
    font-size: 1.5rem; /* 24/16 */
    top: 2px;
    position: relative;
  }
}
@media screen and (max-width: 992px) {
  .l-book-sales-right a.rating .l-font-17 {
    font-size: 1.1875rem; /* 19/16 */
  }
}
@media screen {
  .l-book-sales-right a.rating svg {
    width: 20px;
    height: 19px;
  }
}
@media screen and (max-width: 992px) {
  .l-book-sales-right a.rating svg {
    width: 16px;
  }
}
@media screen {
  .l-book-sales-right a.rating .l-font-15 {
    display: block;
    white-space: nowrap;
    width: 100%;
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    color: #158443;
    letter-spacing: 0;
  }
}
@media screen and (max-width: 992px) {
  .l-book-sales-right .l-book-sales-right-authors {
    font-size: 1rem;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right .l-book-sales-right-authors {
    font-size: 0.875rem !important; /* 14/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right--show {
    overflow-y: scroll;
    height: 100%;
  }
}
@media screen {
  .l-book-sales-right--show .o-button-close {
    display: none !important;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right--show .l-book-sales-cta-secondary {
    display: block !important;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right--show .l-book-sales-cta-tertiary {
    display: none !important;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right--show .l-book-sales-cta-close {
    display: block !important;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right--show .l-no-border {
    border-bottom: 1px solid #DFE7F0 !important;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-right--show .o-button--huge {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }
}
@media screen {
  .l-book-sales-cta {
    border-bottom: 1px solid #DFE7F0;
    margin-top: 15px;
    padding-bottom: 15px;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-cta {
    margin-top: 10px;
    padding-bottom: 10px;
  }
}
@media screen {
  .l-book-sales-cta:last-child {
    border-bottom: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-cta .o-button--huge {
    height: auto;
    line-height: 1.25;
    padding-top: 10px;
    padding-bottom: 10px;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-cta.l-book-sales-cta-secondary {
    display: none;
  }
}
@media screen {
  .l-book-sales-cta.l-book-sales-cta-tertiary {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-cta.l-book-sales-cta-tertiary {
    display: block;
  }
}
@media screen {
  .l-book-sales-cta.l-book-sales-cta-open {
    padding-bottom: 0;
  }
}
@media screen {
  .l-book-sales-cta.l-book-sales-cta-close {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-cta .l-book-sales-right-info {
    font-size: 0.8125rem; /* 13/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-cta .o-button {
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen {
  .l-book-sales-related {
    max-width: 1152px;
    margin: 0 auto;
  }
}
@media screen and (max-width: 992px) {
  .l-book-sales-related .l-grid-4 {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-book-sales-related .l-grid-4 {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 600px) {
  .l-book-sales-related .l-grid-4 {
    display: grid;
    grid-template-columns: 1fr;
  }
}
@media screen {
  .l-path-grid {
    display: grid;
    grid-template-columns: 3.33fr 6.66fr;
    grid-column-gap: 26px;
  }
}
@media screen and (max-width: 992px) {
  .l-path-grid {
    grid-template-columns: 1fr;
  }
}
@media screen {
  .l-path-hero {
    padding-top: 40px;
    position: relative;
  }
  .l-path-hero .l-path-hero__wrapper {
    display: grid;
    grid-template-columns: 1fr;
    text-align: center;
  }
  .l-path-hero .l-path-hero__wrapper .l-path-hero__copy .o-button--continue {
    max-width: 360px;
    text-overflow: ellipsis;
    overflow: hidden;
  }
}
@media screen and (max-width: 768px) {
  .l-path-hero .l-path-hero__wrapper .l-path-hero__copy .o-button--continue .o-button__label {
    max-width: 200px;
  }
}
@media screen {
  .l-path-hero .l-path-hero__wrapper .l-path-hero__copy .o-progress-indicator {
    background: rgba(0, 0, 0, 0.125);
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    border-radius: 0 !important;
  }
  .l-path-hero .l-path-hero__wrapper .l-path-hero__copy .o-progress-indicator .o-progress-indicator__fill {
    width: 33.33%;
    border-radius: 0 20px 20px 0;
  }
}
@media screen and (max-width: 1080px) {
  .l-path-hero .l-path-hero__wrapper .l-path-hero__video {
    margin-right: -100px;
  }
}
@media screen and (max-width: 992px) {
  .l-path-hero .l-path-hero__wrapper .l-path-hero__video {
    order: 1;
  }
}
@media screen and (max-width: 768px) {
  .l-path-hero .l-path-hero__wrapper .l-path-hero__video {
    margin-right: 0;
  }
}
@media screen {
  .l-path-hero .l-path-hero__wrapper .l-path-hero__artwork {
    position: relative;
    width: 100%;
    width: 300px;
    height: 300px;
    margin: 0 auto;
  }
  .l-path-hero .l-path-hero__wrapper .l-path-hero__artwork figure {
    text-align: center;
    height: 100%;
  }
  .l-path-hero .l-path-hero__wrapper .l-path-hero__artwork figure .o-button-video-start {
    z-index: 1;
  }
  .l-path-hero .l-path-hero__wrapper .l-path-hero__artwork img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
  }
}
@media screen and (max-width: 992px) {
  .l-path-hero .l-path-hero__wrapper .l-path-hero__artwork--feature {
    width: 300px;
  }
}
@media screen and (max-width: 600px) {
  .l-path-hero .l-path-hero__wrapper .l-path-hero__artwork--feature {
    margin: 0 auto;
  }
}
@media screen {
  .l-path-hero h1 {
    font-size: 2rem;
    line-height: 1.125;
  }
}
@media screen {
  .l-path-hero p {
    font-family: "Bitter", serif;
    font-size: 1.0625rem; /* 17/16 */
    margin-top: 15px;
  }
}
@media screen and (max-width: 768px) {
  .l-path-hero p {
    font-size: 1rem;
  }
}
@media screen {
  .l-path-hero p:first-child {
    margin-top: 0;
  }
}
@media screen {
  .l-path-hero .c-video-player__video {
    width: 480px;
    border-radius: 0.5625rem;
    overflow: hidden;
    padding-top: 56.25%;
    background: #333333;
  }
}
@media screen and (min-width: 1080px) {
  .l-path-hero .c-video-player__video {
    width: 720px;
  }
}
@media screen and (max-width: 768px) {
  .l-path-hero .c-video-player__video {
    width: 100%;
  }
}
@media screen {
  .l-path-hero .c-video-player__video img {
    width: 100%;
  }
}
@media screen {
  .l-path-hero .c-box-list {
    position: absolute;
    top: 10px;
    left: 180px;
  }
}
@media screen and (max-width: 768px) {
  .l-path-hero .c-box-list {
    left: 10px;
    top: 70px;
  }
}
@media screen {
  .l-path-hero .c-box-list li {
    cursor: inherit;
  }
  .l-path-hero .c-box-list li:nth-of-type(1) {
    opacity: 0.9;
  }
  .l-path-hero .c-box-list li:nth-of-type(2) {
    opacity: 0.8;
  }
  .l-path-hero .c-box-list li:nth-of-type(3) {
    opacity: 0.7;
  }
  .l-path-hero .c-box-list li:nth-of-type(4) {
    opacity: 0.6;
  }
  .l-path-hero .c-box-list li:nth-of-type(5) {
    opacity: 0.5;
  }
  .l-path-hero .c-box-list li:nth-of-type(6) {
    opacity: 0.4;
  }
  .l-path-hero .c-box-list li:nth-of-type(7) {
    opacity: 0.3;
  }
  .l-path-hero .c-box-list li:nth-of-type(8) {
    opacity: 0.2;
  }
  .l-path-hero .c-box-list li:nth-of-type(9) {
    opacity: 0.1;
  }
}
@media screen and (max-width: 768px) {
  .l-popular-paths {
    grid-template-columns: 1fr;
    grid-row-gap: 30px;
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item:before {
    top: 68px;
  }
}
@media screen and (max-width: 768px) {
  #learning-path .learning-path-list .c-tutorial-item:before {
    top: 66px;
    left: 19px;
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item a {
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.075);
    padding: 21px;
  }
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__upper {
    grid-template-columns: 1fr 150px;
    grid-column-gap: 26px;
  }
}
@media screen and (max-width: 768px) {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__upper {
    grid-template-columns: 1fr !important;
  }
}
@media screen and (max-width: 768px) {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__upper .c-tutorial-item__title {
    font-size: 1.3125rem;
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__lower {
    display: none !important;
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__metadata-short {
    display: flex;
    align-items: center;
    margin-top: 15px;
  }
}
@media screen and (max-width: 768px) {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__metadata-short {
    display: none;
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__metadata-short .o-badge-video {
    width: 38px;
    min-width: 38px;
    height: 38px;
    margin-right: 9px;
  }
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__metadata-short .o-badge-video svg {
    width: 13px;
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__metadata-short .o-badge--pro {
    margin-right: 6px;
    margin-top: 0;
    display: block;
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__text {
    margin-left: 0;
    display: block;
  }
}
@media screen and (max-width: 768px) {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__text {
    margin-left: 0;
    margin-top: 0 !important;
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__text .c-tutorial-item__description {
    padding-right: 0;
  }
}
@media screen and (max-width: 768px) {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__text .c-tutorial-item__description {
    padding-right: 20px;
  }
}
@media screen and (max-width: 768px) {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__text .c-tutorial-item__description p, #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__text .c-tutorial-item__description ul, #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__text .c-tutorial-item__description ol {
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__title {
    font-size: 1.5rem; /* 24/16 */
    line-height: 1.2;
    padding-right: 0;
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__platform {
    display: none;
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__art {
    order: 4;
    width: 150px;
    height: 150px;
    background: none;
    align-self: center;
  }
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__art img {
    display: block;
    transform: scale(1);
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__icon {
    right: -96px;
    position: relative;
    display: none;
  }
}
@media screen {
  #learning-path .learning-path-list .c-tutorial-item a .c-tutorial-item__number-badge .o-badge-tutorial {
    top: 6px;
  }
}
@media screen and (max-width: 992px) {
  .l-collection-paths {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-paths {
    grid-template-columns: 1fr;
  }
}
@media screen {
  .l-collection-paths .c-tutorial-item {
    margin-top: 0 !important;
  }
  .l-collection-paths .c-tutorial-item .c-tutorial-item__platform .o-badge--pro {
    margin-right: 6px;
  }
}
@media screen and (max-width: 768px) {
  .l-domain-collection .c-tutorial--list.c-tutorial--number .c-tutorial-item .c-tutorial-item__text {
    margin-top: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .l-domain-collection .c-tutorial--list.c-tutorial--number .c-tutorial-item__number-badge .o-badge-tutorial {
    left: auto !important;
  }
}
@media screen and (max-width: 768px) {
  .l-domain-collection .c-tutorial--list .c-tutorial-item {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-domain-collection .c-tutorial-item .c-tutorial-item__title {
    word-break: break-word;
  }
  .l-domain-collection .c-tutorial-item .c-tutorial-item__platform {
    display: none;
  }
  .l-domain-collection .c-tutorial-item .c-tutorial-item__parent {
    display: block !important;
  }
  .l-domain-collection .c-tutorial-item .c-tutorial-item__description p {
    height: 44px;
    overflow: hidden;
  }
  .l-domain-collection .c-tutorial-item .c-tutorial-item__description ul, .l-domain-collection .c-tutorial-item .c-tutorial-item__description ol {
    display: none;
  }
}
@media screen {
  .l-domain-collection .c-tutorial--number .c-tutorial-item {
    padding-left: 0 !important;
  }
  .l-domain-collection .c-tutorial--number .c-tutorial-item:before {
    display: none !important;
  }
}
@media screen and (max-width: 768px) {
  .l-domain-collection .c-tutorial--number .c-tutorial-item .c-tutorial-item__text {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-domain-collection .c-tutorial--number .c-tutorial-item .o-badge-tutorial {
    top: 28px !important;
    right: 28px !important;
    left: auto !important;
  }
}
@media screen and (max-width: 768px) {
  .l-domain-collection .c-tutorial--number .c-tutorial-item .o-badge-tutorial {
    right: 21px !important;
    font-size: 1rem;
    left: auto !important;
  }
}
@media screen and (max-width: 768px) {
  .l-domain-collection .c-tutorial--number .c-tutorial-item .c-tutorial-item__text {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-collection-hero {
    padding-top: 72px;
    padding-bottom: 72px;
    padding-left: 30px;
    padding-right: 30px;
    overflow: hidden;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero {
    padding-top: 0;
    padding-bottom: 54px;
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen {
  .l-collection-hero .l-collection-hero__wrapper {
    display: grid;
    grid-template-columns: 1fr 500px;
    grid-column-gap: 90px;
    align-items: center;
  }
}
@media screen and (max-width: 992px) {
  .l-collection-hero .l-collection-hero__wrapper {
    grid-template-columns: 1fr 300px;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero .l-collection-hero__wrapper {
    grid-template-columns: 1fr;
  }
}
@media screen {
  .l-collection-hero h1 {
    line-height: 1.125;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero .l-collection-hero__copy {
    order: 2;
    margin-left: -20px;
    padding: 20px 20px 0 20px;
    background: #333333;
    margin-top: -60px;
    animation: none;
  }
}
@media screen {
  .l-collection-hero .l-collection-hero__copy .l-collection-hero__copy-markdown ul, .l-collection-hero .l-collection-hero__copy .l-collection-hero__copy-markdown ol, .l-collection-hero .l-collection-hero__copy .l-collection-hero__copy-markdown p {
    font-size: 1.0625rem;
    font-family: "Bitter", serif;
    margin-top: 15px;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero .l-collection-hero__copy .l-collection-hero__copy-markdown ul, .l-collection-hero .l-collection-hero__copy .l-collection-hero__copy-markdown ol, .l-collection-hero .l-collection-hero__copy .l-collection-hero__copy-markdown p {
    font-size: 0.9375rem;
  }
}
@media screen {
  .l-collection-hero .l-collection-hero__copy .l-collection-hero__copy-markdown ul, .l-collection-hero .l-collection-hero__copy .l-collection-hero__copy-markdown ol {
    list-style: inherit;
    padding-left: 10px;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero .l-collection-hero__artwork {
    order: 1;
    width: calc(100% + 40px);
    margin-left: -20px;
    margin-bottom: 10px;
    animation: none;
  }
}
@media screen {
  .l-collection-hero .l-collection-hero__artwork img {
    max-width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero .l-collection-hero__artwork img {
    width: 100%;
  }
}
@media screen {
  .l-collection-hero .c-rating-count span {
    color: #ffffff;
  }
  .l-collection-hero .c-rating-count a {
    color: #ffffff;
  }
  .l-collection-hero .c-rating-count .l-button__svg-empty-star {
    fill: #CACED2;
    opacity: 0.5;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero .l-collection-hero__artwork--desktop {
    display: none;
  }
}
@media screen {
  .l-collection-hero .l-collection-hero__artwork--mobile {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero .l-collection-hero__artwork--mobile {
    display: block;
  }
}
@media screen {
  .l-collection-hero--trailer {
    overflow: hidden;
  }
  .l-collection-hero--trailer .l-collection-hero__wrapper {
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 60px;
    align-items: flex-start;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero--trailer .l-collection-hero__wrapper {
    display: flex;
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero--trailer .l-collection-hero__copy {
    margin-top: 0;
  }
}
@media screen {
  .l-collection-hero--trailer .l-collection-hero__trailer {
    width: 120%;
    padding-bottom: 67.5%;
    border-radius: 0.5625rem;
    position: relative;
    overflow: hidden;
    background: #434A53;
  }
}
@media screen and (min-width: 1200px) {
  .l-collection-hero--trailer .l-collection-hero__trailer {
    width: 100%;
    padding-bottom: 56.25%;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero--trailer .l-collection-hero__trailer {
    width: 100%;
    padding-bottom: 56.25%;
    margin-top: 15px;
    border: none;
  }
}
@media screen {
  .l-collection-hero--trailer .l-collection-hero__trailer .o-button-video {
    position: absolute;
    z-index: 1;
  }
}
@media screen {
  .l-collection-hero--trailer .l-collection-hero__trailer img, .l-collection-hero--trailer .l-collection-hero__trailer iframe {
    width: 100%;
    max-width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-hero--trailer .l-collection-hero__trailer img, .l-collection-hero--trailer .l-collection-hero__trailer iframe {
    height: 100%;
  }
}
@media screen {
  .l-collection-episodes .l-collection-episodes__wrapper {
    max-width: 685px;
  }
  .l-collection-episodes h2 {
    font-size: 1.5rem; /* 24/16 */
    margin-top: 50px;
  }
  .l-collection-episodes h2:first-child {
    margin-top: 0;
  }
}
@media screen {
  .l-collection-modules .l-collection-modules__module {
    display: grid;
    grid-template-columns: 1fr 360px;
    grid-column-gap: 120px;
  }
}
@media screen and (max-width: 1080px) {
  .l-collection-modules .l-collection-modules__module {
    grid-template-columns: 1fr 360px;
  }
}
@media screen and (max-width: 992px) {
  .l-collection-modules .l-collection-modules__module {
    grid-template-columns: 1fr;
  }
}
@media screen {
  .l-collection-modules .l-collection-modules__module-episodes h2 {
    margin-top: 50px;
  }
}
@media screen and (max-width: 768px) {
  .l-collection-modules .l-collection-modules__module-episodes h2 {
    font-size: 1.5rem;
  }
}
@media screen {
  .l-collection-modules .l-collection-modules__module-episodes h2:first-child {
    margin-top: 0;
  }
}
@media screen and (max-width: 992px) {
  .l-collection-modules .l-collection-modules__pitch-cards {
    margin-top: 60px;
  }
}
@media screen {
  .l-collection-modules .l-collection-modules__pitch-cards h2 {
    font-size: 1.5rem; /* 24/16 */
  }
}
@media screen {
  .l-collection-modules .l-collection-modules__pitch-cards a {
    color: #158443;
  }
}
@media screen {
  .l-collection-modules .l-collection-modules__pitch-cards p, .l-collection-modules .l-collection-modules__pitch-cards ul, .l-collection-modules .l-collection-modules__pitch-cards ol {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .l-collection-modules .l-collection-modules__pitch-cards p {
    margin-top: 18px;
  }
}
@media screen {
  .l-collection-modules .l-collection-modules__pitch-cards ul {
    display: grid;
    grid-template-columns: 1fr;
  }
  .l-collection-modules .l-collection-modules__pitch-cards ul li {
    padding-left: 33px;
    font-family: "Bitter", serif;
    font-weight: 700;
    margin-top: 15px;
    position: relative;
  }
  .l-collection-modules .l-collection-modules__pitch-cards ul li:first-child {
    margin-top: 15px;
  }
  .l-collection-modules .l-collection-modules__pitch-cards ul li:before {
    content: "";
    width: 24px;
    height: 24px;
    position: absolute;
    left: 0;
    background-image: url(/assets/svg-icons/checkmark--clear-green-e7cb550028b55997c9619c790965bfe6f3cbd9a1b6f6593a4c8e7d9cd9cbdb84.png);
    background-size: cover;
  }
}
@media screen {
  .l-collection-modules .l-collection-modules__pitch-cards .l-collection-modules__trailer {
    width: 100%;
    padding-bottom: 56.25%;
    border-radius: 0.5625rem;
    position: relative;
    overflow: hidden;
  }
  .l-collection-modules .l-collection-modules__pitch-cards .l-collection-modules__trailer iframe {
    width: 100%;
    max-width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
  }
}
@media screen {
  .l-achievements-grid > div {
    position: relative;
  }
  .l-achievements-grid > div > div:first-of-type {
    width: 100%;
    padding-top: 100%;
    position: relative;
  }
  .l-achievements-grid > div img {
    width: 100%;
    padding: 10px;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
  }
  .l-achievements-grid > div span {
    display: block;
    text-align: center;
  }
  .l-achievements-grid > div span:first-of-type {
    font-family: "Bitter", serif;
    font-size: 1.0625rem !important; /* 17/16 */
    line-height: 1.25;
    font-weight: 700;
    color: #333333 !important;
    margin-top: 2px !important;
  }
  .l-achievements-grid > div span:last-of-type {
    color: #6E7687;
    font-size: 0.875rem; /* 14/16 */
    margin-top: 6px;
  }
}
@media screen {
  .l-black-friday-ui-sales-2021 {
    background: #0d0d0d !important;
  }
  .l-black-friday-ui-sales-2021 h1, .l-black-friday-ui-sales-2021 h2, .l-black-friday-ui-sales-2021 h3, .l-black-friday-ui-sales-2021 h4 {
    color: #ffffff !important;
  }
  .l-black-friday-ui-sales-2021 p {
    color: #A7ADB4 !important;
  }
  .l-black-friday-ui-sales-2021 .o-button--green {
    background: #ffffff;
  }
  .l-black-friday-ui-sales-2021 .o-button--green .o-button__label {
    color: #0d0d0d;
  }
  .l-black-friday-ui-sales-2021 .o-button--green i {
    background: #0d0d0d;
  }
  .l-black-friday-ui-sales-2021 .o-button--green i svg {
    fill: #ffffff;
  }
}
@media screen {
  .l-black-friday-ui-pattern-2021 {
    position: relative;
  }
  .l-black-friday-ui-pattern-2021:before {
    content: "";
    position: absolute;
    top: -40px;
    left: 0;
    width: 100%;
    height: 120px;
    background-image: url(/assets/patterns/black-friday-2021-hero-pattern-style-1-aad4f39f6af8bd547f5e1cda523dc4aecc476aeca0340d78984c32e242ac88ae.png);
    background-repeat: repeat-x;
    background-size: 1480px;
  }
  .l-black-friday-ui-pattern-2021:after {
    content: "";
    position: absolute;
    bottom: -90px;
    left: 0;
    width: 100%;
    height: 120px;
    background-image: url(/assets/patterns/black-friday-2021-hero-pattern-style-2-cbf4df08a1a98cb35dbaf7d2149956f0dffe854767702da9245960bee1a4c304.png);
    background-repeat: repeat-x;
    background-size: 1480px;
  }
}
@media screen {
  .c-banner-draper.l-black-friday-ui-sales-2021 {
    position: relative;
    padding: 70px 0;
  }
  .c-banner-draper.l-black-friday-ui-sales-2021:before {
    content: "";
    position: absolute;
    top: -40px;
    left: 0;
    width: 100%;
    height: 120px;
    background-image: url(/assets/patterns/black-friday-2021-hero-pattern-style-1-aad4f39f6af8bd547f5e1cda523dc4aecc476aeca0340d78984c32e242ac88ae.png);
    background-repeat: repeat-x;
    background-size: 1480px;
  }
  .c-banner-draper.l-black-friday-ui-sales-2021:after {
    content: "";
    position: absolute;
    bottom: -90px;
    left: 0;
    width: 100%;
    height: 120px;
    background-image: url(/assets/patterns/black-friday-2021-hero-pattern-style-2-cbf4df08a1a98cb35dbaf7d2149956f0dffe854767702da9245960bee1a4c304.png);
    background-repeat: repeat-x;
    background-size: 1480px;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper.l-black-friday-ui-sales-2021 .c-banner-draper__copy {
    text-align: center;
    margin-bottom: 20px;
    margin-right: 0 !important;
  }
}
@media screen {
  .c-banner-related.l-black-friday-ui-sales-2021 {
    padding: 60px 0;
  }
  .c-banner-related.l-black-friday-ui-sales-2021:before {
    top: -40px !important;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related.l-black-friday-ui-sales-2021 .c-banner-related__artwork {
    margin-bottom: -10px;
  }
}
@media screen {
  .l-black-friday-ui-sales-2021.c-banner-draper--subscription h2 {
    color: #ffffff !important;
  }
}
@media screen {
  .l-black-friday-ui-sales-2021.c-banner-draper--subscription p {
    color: #A7ADB4 !important;
  }
}
@media screen {
  .l-black-friday-ui-sales-2021.c-banner-draper--subscription .c-banner-draper__copy {
    text-align: left;
  }
}
@media screen and (max-width: 1080px) {
  .l-black-friday-ui-sales-2021.c-banner-draper--subscription .c-banner-draper__copy {
    text-align: center;
  }
}
@media screen and (max-width: 1080px) {
  .l-black-friday-ui-sales-2021.c-banner-draper--subscription .c-banner-draper__art {
    margin-bottom: -10px;
  }
}
@media screen {
  .c-banner-draper-sticky.l-black-friday-ui-sales-2021 {
    min-height: 80px;
    height: auto;
  }
  .c-banner-draper-sticky.l-black-friday-ui-sales-2021 .c-banner-draper-sticky__wrapper {
    padding: 0;
  }
}
@media screen and (max-width: 985px) {
  .c-banner-draper-sticky.l-black-friday-ui-sales-2021 .c-banner-draper-sticky__wrapper {
    padding: 10px 60px 15px 20px;
  }
}
@media screen {
  .c-banner-draper-sticky.l-black-friday-ui-sales-2021 p {
    color: #ffffff !important;
  }
}
@media screen {
  .c-banner-draper-sticky.l-black-friday-ui-sales-2021 img {
    width: 240px;
    max-width: none !important;
    margin-bottom: -30px;
    margin-top: -10px;
  }
}
@media screen {
  .c-video-player__paywall.l-black-friday-ui-sales-2021 {
    position: absolute !important;
  }
}
@media screen {
  .l-newsletter-hero {
    position: relative;
    z-index: 1;
    padding-top: 180px;
    padding-bottom: 270px;
  }
}
@media screen and (max-width: 768px) {
  .l-newsletter-hero {
    padding-top: 120px;
    padding-bottom: 210px;
  }
}
@media screen {
  .l-newsletter-hero:before {
    content: "";
    width: 100%;
    height: 250px;
    position: absolute;
    bottom: 0;
    background-image: url(/assets/artwork/email-layout-5c66378ba17dbdc8384f6b79ae61aa08dd27d10c93fe921cb208f56275d2a301.svg);
    background-size: 1350px;
    background-repeat: no-repeat;
    background-position: top -480px center;
    z-index: -1;
  }
}
@media screen and (max-width: 768px) {
  .l-newsletter-hero:before {
    background-size: 750px;
    background-position: center -170px;
  }
}
@media screen {
  .l-newsletter-hero:after {
    content: "";
    width: 100%;
    height: 380px;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(/assets/artwork/keyboard-coffee-layout-36bdbb5a6a5d1d866dc718a91684ab28dee288fca8efdd615e1f8f4b6e36a93c.svg);
    background-size: 1440px;
    background-repeat: no-repeat;
    background-position: 110px -180px;
    z-index: -1;
  }
}
@media screen and (min-width: 1440px) {
  .l-newsletter-hero:after {
    display: none;
  }
}
@media screen and (max-width: 1200px) {
  .l-newsletter-hero:after {
    background-position: 0 -180px;
  }
}
@media screen and (max-width: 992px) {
  .l-newsletter-hero:after {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .l-newsletter-hero h1 {
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 768px) {
  .l-newsletter-hero .l-block--card-medium {
    padding: 0 !important;
  }
}
@media screen {
  .l-newsletter-hero .o-tooltip {
    top: -50px;
    opacity: 0;
    visibility: visible;
    animation-delay: 3s;
    animation-fill-mode: forwards;
    margin-left: -100px;
  }
}
@media screen and (max-width: 992px) {
  .l-newsletter-hero .o-tooltip {
    display: none;
  }
}
@media screen {
  .l-newsletter-benefits {
    overflow: hidden;
    margin-bottom: 90px;
  }
}
@media screen and (max-width: 600px) {
  .l-newsletter-benefits > div {
    padding: 0 20px !important;
  }
}
@media screen {
  .l-newsletter-benefits .l-newsletter-benefits__copy {
    padding-right: 150px;
  }
}
@media screen and (max-width: 1200px) {
  .l-newsletter-benefits .l-newsletter-benefits__copy {
    padding-right: 90px;
  }
}
@media screen and (max-width: 992px) {
  .l-newsletter-benefits .l-newsletter-benefits__copy {
    padding-right: 30px;
  }
}
@media screen and (max-width: 768px) {
  .l-newsletter-benefits .l-newsletter-benefits__copy {
    padding-right: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-newsletter-benefits h2 {
    font-size: 1.5rem;
  }
}
@media screen {
  .l-newsletter-benefits ul, .l-newsletter-benefits p {
    font-family: "Bitter", serif;
  }
}
@media screen {
  .l-newsletter-benefits ul li {
    position: relative;
    font-size: 1.125rem; /* 18/16 */
    padding-left: 40px;
    margin-top: 15px;
  }
}
@media screen and (max-width: 600px) {
  .l-newsletter-benefits ul li {
    font-size: 1rem;
  }
}
@media screen {
  .l-newsletter-benefits ul li:first-child {
    margin-top: 0;
  }
}
@media screen {
  .l-newsletter-benefits ul li:before {
    content: "";
    background-image: url(/assets/svg-icons/checkmark--green-1e096ae45df68feb9ffcc548c7c6510565f7f0d4098690d0121fe6739a2a7e76.png);
    background-size: 100%;
    width: 24px;
    height: 24px;
    position: absolute;
    left: 0;
  }
}
@media screen {
  .l-newsletter-benefits p {
    font-size: 1.125rem;
    margin-top: 15px;
  }
}
@media screen and (max-width: 600px) {
  .l-newsletter-benefits p {
    font-size: 1rem;
  }
}
@media screen {
  .l-newsletter-benefits .l-newsletter-benefits__artwork {
    position: relative;
  }
}
@media screen and (max-width: 768px) {
  .l-newsletter-benefits .l-newsletter-benefits__artwork {
    display: none;
  }
}
@media screen {
  .l-newsletter-benefits .l-newsletter-benefits__artwork-top {
    width: 380px;
    margin-right: 120px;
    position: relative;
    z-index: 1;
  }
}
@media screen and (max-width: 992px) {
  .l-newsletter-benefits .l-newsletter-benefits__artwork-top {
    width: 300px;
    margin-right: 30px;
  }
}
@media screen {
  .l-newsletter-benefits .l-newsletter-benefits__artwork-bottom {
    width: 380px;
    position: absolute;
    right: -240px;
    top: 0;
    transform: rotate(10deg);
    z-index: 0;
  }
}
@media screen and (max-width: 992px) {
  .l-newsletter-benefits .l-newsletter-benefits__artwork-bottom {
    width: 300px;
  }
}
@media screen {
  .home-pattern {
    background-size: 2000px;
    background-position-x: -500px;
  }
}
@media screen {
  section.home-hero {
    background: #333333;
    background-size: cover;
    padding-top: 100px;
    position: relative;
    z-index: 0;
  }
}
@media screen and (max-width: 768px) {
  section.home-hero {
    padding-top: 60px;
  }
}
@media screen {
  section.home-hero:after {
    content: "";
    width: 100%;
    height: 380px;
    position: absolute;
    top: 0;
    left: 0;
    background-size: 640px;
    background-repeat: no-repeat;
    background-position: 960px -240px;
    z-index: -1;
  }
}
@media screen {
  section.home-hero .home-hero__wrapper {
    display: grid;
    grid-template-columns: 1fr 465px;
    grid-column-gap: 100px;
  }
}
@media screen and (max-width: 992px) {
  section.home-hero .home-hero__wrapper {
    display: block;
  }
}
@media screen {
  section.home-hero h1, section.home-hero p {
    color: #ffffff;
  }
}
@media screen {
  section.home-hero h1 {
    font-size: 4rem; /* 64/16 */
  }
}
@media screen and (max-width: 1080px) {
  section.home-hero h1 {
    font-size: 3.5rem;
  }
}
@media screen and (max-width: 768px) {
  section.home-hero h1 {
    font-size: 1.875rem;
  }
}
@media screen {
  section.home-hero p {
    font-family: "Bitter", serif;
    font-size: 1.5rem; /* 24/16 */
  }
}
@media screen and (max-width: 768px) {
  section.home-hero p {
    font-size: 1rem;
  }
}
@media screen {
  section.home-hero .home-hero__testimonial {
    margin-bottom: 90px;
  }
}
@media screen and (max-width: 992px) {
  section.home-hero .home-hero__testimonial {
    display: none;
  }
}
@media screen {
  section.home-hero .home-hero__testimonial p {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 1.0625rem; /* 17/16 */
  }
}
@media screen {
  section.home-hero .home-hero__testimonial span {
    display: block;
    font-family: "Bitter", serif;
    font-weight: 700;
    font-size: 1.125rem; /* 18/16 */
    color: #ffffff;
    margin-top: 18px;
  }
}
@media screen {
  section.home-hero .home-hero__action {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    padding: 24px;
  }
}
@media screen and (max-width: 992px) {
  section.home-hero .home-hero__action {
    background: none;
    padding: 0;
    box-shadow: 0;
    border-radius: 0;
    padding-top: 18px;
    padding-bottom: 90px;
  }
}
@media screen {
  section.home-hero .home-hero__action h4 {
    text-align: center;
    font-size: 1.5rem; /* 24/16 */
    padding: 0 60px;
    margin-bottom: 27px;
  }
}
@media screen and (max-width: 992px) {
  section.home-hero .home-hero__action h4 {
    display: none;
  }
}
@media screen {
  section.home-hero .home-hero__action h5 {
    text-align: center;
    font-size: 1.1875rem; /* 19/16 */
  }
}
@media screen and (max-width: 992px) {
  section.home-hero .home-hero__action h5 {
    display: none;
  }
}
@media screen {
  section.home-hero .home-hero__action ul {
    padding-left: 8px;
  }
  section.home-hero .home-hero__action ul li {
    font-family: "Bitter", serif;
    font-size: 1.125rem; /* 18/16 */
    font-weight: 700;
    margin-top: 15px;
    position: relative;
    padding-left: 40px;
  }
}
@media screen and (max-width: 992px) {
  section.home-hero .home-hero__action ul li {
    color: #ffffff;
  }
}
@media screen and (max-width: 768px) {
  section.home-hero .home-hero__action ul li {
    font-size: 1rem;
  }
}
@media screen {
  section.home-hero .home-hero__action ul li:before {
    content: "";
    width: 24px;
    height: 24px;
    background-image: url(/assets/svg-icons/checkmark--green-1e096ae45df68feb9ffcc548c7c6510565f7f0d4098690d0121fe6739a2a7e76.png);
    background-size: cover;
    position: absolute;
    left: 0;
    top: 1px;
  }
}
@media screen and (max-width: 992px) {
  section.home-hero .home-hero__action ul li:before {
    background-image: url(/assets/svg-icons/checkmark-c892a399ec5e7c73a6cac886b1baac93a78bf5eab341469fd7de45c61c674ec0.png);
  }
}
@media screen {
  section.home-hero .home-hero__action .o-button--green {
    width: 100%;
  }
  section.home-hero .home-hero__action .o-button--green span {
    width: 100%;
    margin-right: -20px;
    text-align: center;
  }
  section.home-hero .home-hero__action .o-button--green i {
    margin-left: auto;
  }
}
@media screen {
  section.home-pillars {
    position: relative;
  }
  section.home-pillars .home-pillars--adjust {
    margin-top: -50px;
  }
}
@media screen and (max-width: 992px) {
  section.home-pillars .home-pillars--adjust {
    margin-top: 0;
  }
}
@media screen and (max-width: 992px) {
  section.home-pillars .l-flex {
    display: block;
  }
}
@media screen {
  section.home-pillars h2 {
    color: #ffffff;
    font-size: 3rem; /* 48/16 */
    line-height: 1.125;
  }
}
@media screen and (max-width: 768px) {
  section.home-pillars h2 {
    font-size: 1.875rem; /* 15/16 */
  }
}
@media screen {
  section.home-pillars p {
    font-family: "Bitter", serif;
    font-size: 1.125rem; /* 18/16 */
    margin-top: 15px;
    color: #ffffff;
  }
}
@media screen and (max-width: 768px) {
  section.home-pillars p {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  section.home-pillars .home-pillars__entry {
    min-height: 720px;
    padding: 45px 90px;
    overflow: hidden;
  }
}
@media screen and (max-width: 1080px) {
  section.home-pillars .home-pillars__entry {
    padding: 45px 60px;
  }
}
@media screen and (max-width: 768px) {
  section.home-pillars .home-pillars__entry {
    min-height: auto;
    padding: 30px 30px;
  }
}
@media screen {
  section.home-pillars .home-pillars__entry-wrapper {
    max-width: 550px;
    margin: 0 auto;
  }
}
@media screen and (max-width: 768px) {
  section.home-pillars .home-pillars__entry-wrapper {
    max-width: auto;
  }
}
@media screen {
  section.home-pillars .home-pillars__entry-wrapper a {
    text-decoration: none;
  }
}
@media screen {
  section.home-pillars .home-pillars__entry-hint {
    margin-top: 64px;
  }
  section.home-pillars .home-pillars__entry-hint > p {
    display: flex;
  }
  section.home-pillars .home-pillars__entry-hint > p span {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 1rem;
    padding-left: 9px;
  }
  section.home-pillars .home-pillars__entry-hint > p span a {
    color: #ffffff;
    text-decoration: underline;
  }
}
@media screen {
  .home-pillars--beta {
    min-height: 420px !important;
  }
}
@media screen and (max-width: 768px) {
  .home-pillars--beta {
    min-height: auto !important;
  }
}
@media screen {
  .home-pillars--beta h2 {
    font-size: 2.25rem !important; /* 36/16 */
    margin-top: 15px;
  }
}
@media screen and (max-width: 768px) {
  .home-pillars--beta h2 {
    font-size: 1.875rem !important; /* 15/16 */
  }
}
@media screen {
  .home-pillars--beta p {
    font-size: 1rem !important;
  }
}
@media screen and (max-width: 768px) {
  .home-pillars--beta p {
    font-size: 0.9375rem !important; /* 15/16 */
  }
}
@media screen {
  .home-pillars--beta .home-pillars__entry-hint {
    margin-top: 48px;
  }
}
@media screen {
  .home-pillars--beta .o-button--dark {
    background: none;
    padding: 0;
  }
}
@media screen and (min-width: 1200px) {
  .home-pillars__left, .home-pillars__right {
    width: 50%;
  }
}
@media screen {
  .home-pillars--swift {
    background: #FF6333;
  }
  .home-pillars--swift img {
    width: 340px;
    display: block;
    margin: 0 auto;
    position: relative;
    right: -70px;
    bottom: -20px;
  }
}
@media screen and (max-width: 768px) {
  .home-pillars--swift img {
    width: 240px;
  }
}
@media screen {
  .home-pillars--swift .home-pillars__entry-hint svg {
    fill: #FF6333;
  }
}
@media screen {
  .home-pillars--android {
    background: #49f2c5;
    background: linear-gradient(135deg, #49f2c5 0%, #0575e6 100%);
    border-radius: 12px 0 0 0;
    position: relative;
    z-index: 1;
    overflow: hidden;
  }
}
@media screen and (max-width: 992px) {
  .home-pillars--android {
    border-radius: 0;
  }
}
@media screen {
  .home-pillars--android:before {
    content: "";
    background-size: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
}
@media screen {
  .home-pillars--android:after {
    content: "";
    width: 230px;
    height: 290px;
    background-image: url(/assets/artwork/android-pillar--no-shadow-667398ceb6be2f3e7c6f8452778b1dedbc987c594b248e24226e9d8cdb0f3399.svg);
    background-size: cover;
    position: absolute;
    bottom: -80px;
    left: 50%;
    z-index: -1;
    margin-left: -115px;
  }
}
@media screen and (max-width: 768px) {
  .home-pillars--android:after {
    display: none;
  }
}
@media screen {
  .home-pillars--android img {
    width: 180px;
  }
}
@media screen {
  .home-pillars--android .home-pillars__entry-hint svg {
    fill: #49C9D7;
  }
}
@media screen {
  .home-pillars--server-side-swift {
    background: #363B44;
    background-image: url(/assets/artwork/server-side-swift-database-d8876bd377c59aa11239c919f6ee265191d69f60124957f9ac575c0a78330884.svg);
    background-size: 210px;
    background-position: bottom -70px right -15px;
    background-repeat: no-repeat;
  }
}
@media screen and (max-width: 992px) {
  .home-pillars--server-side-swift {
    border-radius: 0;
  }
}
@media screen {
  .home-pillars--server-side-swift svg {
    fill: #363B44;
  }
}
@media screen {
  .home-pillars--unity {
    background: #687BAD;
    background-image: url(/assets/artwork/unity-vr-fe00fd0b52b25e10558b299ff0c0f54d8c9eecf812f9358ca0a69e56b20b6add.svg);
    background-size: 420px;
    background-position: bottom -250px right -175px;
    background-repeat: no-repeat;
  }
  .home-pillars--unity svg {
    fill: #687BAD;
  }
}
@media screen {
  .home-pillars--unreal-engine {
    background: #535a65;
    background-image: url(/assets/artwork/unreal-engine-ray-gun-7a18eaede9834f3a11c2d0fa336e36cf3eeed706dd3fef81d309cb525b76edd5.svg);
    background-size: 180px;
    background-position: bottom -20px right 50px;
    background-repeat: no-repeat;
    border-radius: 0 0 12px 0;
  }
}
@media screen and (max-width: 992px) {
  .home-pillars--unreal-engine {
    border-radius: 0;
  }
}
@media screen {
  .home-pillars--unreal-engine svg {
    fill: #535a65;
  }
}
@media screen {
  .home-pillars--flutter {
    background: #096ABB;
    background-image: url(/assets/artwork/flutter-logo-acf12cd5392998d5437cbfeefb41a3edfb6d680dd49a0c52818dae970ed995b5.svg);
    background-size: 210px;
    background-position: bottom -60px right 25px;
    background-repeat: no-repeat;
  }
}
@media screen and (max-width: 768px) {
  .home-pillars--flutter {
    background-size: 180px;
    background-position: bottom -60px right 10px;
  }
}
@media screen {
  .home-pillars--flutter svg {
    fill: #096ABB;
  }
}
@media screen {
  .home-pillars--library {
    background: #1E8C75;
    background-image: url(/assets/artwork/library-yeti-eddcfa99f0336e4f8e3b212ff494672ad171c20724e49a58235a875823592b65.svg);
    background-size: 320px;
    background-position: bottom -90px right -125px;
    background-repeat: no-repeat;
  }
}
@media screen and (max-width: 768px) {
  .home-pillars--library {
    background-size: 240px;
  }
}
@media screen {
  .home-pillars--library svg {
    fill: #1E8C75;
  }
}
@media screen {
  .home-top-tutorials {
    background: #333333;
    padding-top: 150px;
    padding-bottom: 96px;
    margin-top: -50px;
    overflow: hidden;
  }
  .home-top-tutorials .c-tutorial--card {
    margin-top: 24px !important;
  }
  .home-top-tutorials .c-tutorial--card .c-tutorial-item {
    min-height: 340px;
  }
  .home-top-tutorials .c-tutorial--card .c-tutorial-item .c-tutorial-item__text {
    white-space: normal;
    padding: 0 18px;
    padding-bottom: 50px;
  }
  .home-top-tutorials .c-tutorial--card .c-tutorial-item .c-tutorial-item__title {
    color: #ffffff !important;
  }
}
@media screen {
  .home-community {
    position: relative;
    z-index: 1;
  }
  .home-community h3 {
    font-size: 3rem; /* 48/16 */
  }
}
@media screen and (max-width: 768px) {
  .home-community h3 {
    font-size: 1.875rem;
  }
}
@media screen {
  .home-community p {
    font-family: "Bitter", serif;
    font-size: 1.125rem; /* 18/16 */
    margin-top: 20px;
  }
}
@media screen and (max-width: 768px) {
  .home-community p {
    font-size: 1rem;
  }
}
@media screen and (max-width: 768px) {
  .home-tutorials h3 {
    text-align: left;
  }
}
@media screen {
  .home-tutorials .c-tutorial-item .c-tutorial-item__metadata, .home-tutorials .c-tutorial-item .c-tutorial-item__metadata-short, .home-tutorials .c-tutorial-item .c-tutorial-item__platform {
    display: none;
  }
  .home-tutorials .c-tutorial-item:nth-child(odd) .c-tutorial-item__art {
    height: 220px;
  }
}
@media screen {
  .l-home-section-border-padding {
    padding-top: 30px;
    border-top: 1px solid #D6E0EF;
  }
}
@media screen and (max-width: 768px) {
  .l-home-section-border-padding {
    padding-top: 0;
    border-top: none;
  }
}
@media screen {
  .l-home-section-border-padding-bottom {
    padding-bottom: 42px;
    border-bottom: 1px solid #D6E0EF;
    margin-bottom: -18px;
  }
}
@media screen and (max-width: 768px) {
  .l-home-section-border-padding-bottom {
    padding-bottom: 0;
    border-top: none;
    margin-bottom: 0;
  }
}
@media screen {
  .l-home-getting-started .c-tutorial-item {
    width: auto !important;
    min-width: auto !important;
    height: auto !important;
  }
  .l-home-getting-started .c-tutorial-item a {
    background: #ffffff;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.075);
    padding-top: 170px;
  }
  .l-home-getting-started .c-tutorial-item .c-tutorial-item__art {
    width: 100%;
    transition: all 0.5s;
  }
  .l-home-getting-started .c-tutorial-item .c-tutorial-item__art:before {
    z-index: 1;
    background-image: none !important;
    display: none;
  }
  .l-home-getting-started .c-tutorial-item .c-tutorial-item__art:hover img {
    transform: scale(1.1) !important;
  }
  .l-home-getting-started .c-tutorial-item .c-tutorial-item__art img {
    display: block;
    width: 100%;
    max-width: 315px;
    margin: 0 auto;
    position: relative;
    top: 15px;
    transform: scale(1) !important;
  }
}
@media screen and (max-width: 768px) {
  .l-home-getting-started .c-tutorial-item .c-tutorial-item__art img {
    max-width: 270px;
  }
}
@media screen {
  .l-home-getting-started .c-tutorial-item .c-tutorial-item__text {
    z-index: 2;
    white-space: normal;
  }
  .l-home-getting-started .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    font-size: 1.5rem !important; /* 24/16 */
    line-height: 1.2 !important;
    color: #333333;
  }
}
@media screen and (max-width: 768px) {
  .l-home-getting-started .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    font-size: 1.5rem !important; /* 24/16 */
  }
}
@media screen {
  .l-home-getting-started .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__abstract {
    color: #6E7687;
    margin-top: 10px;
  }
}
@media screen {
  .l-home-getting-started .c-tutorial-item--onboarding-video:hover .c-tutorial-item__video-player:after {
    transform: scale(1.1);
  }
  .l-home-getting-started .c-tutorial-item--onboarding-video .c-tutorial-item__video-player {
    width: 100%;
    padding-top: 50%;
    position: relative;
    z-index: 0;
    overflow: hidden;
  }
  .l-home-getting-started .c-tutorial-item--onboarding-video .c-tutorial-item__video-player:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #1a1a1a;
    opacity: 0.25;
  }
  .l-home-getting-started .c-tutorial-item--onboarding-video .c-tutorial-item__video-player:after {
    content: "";
    position: absolute;
    top: 10px;
    left: 10px;
    width: calc(100% - 20px);
    height: 100%;
    background-image: url(/assets/artwork/illustration-onboarding-video-8127ed9d0195d0511990d8c4286c7e69b98a68f656d11a57348a90f788a992d7.svg);
    background-size: cover;
    z-index: -1;
    transition: transform 0.25s ease-out;
  }
  .l-home-getting-started .c-tutorial-item--onboarding-video > a {
    flex-wrap: wrap;
    padding-top: 0;
  }
}
@media screen {
  .l-home-getting-started .c-tutorial-item--path a:before {
    content: "";
    position: absolute;
    top: 16px;
    left: 50%;
    width: 244px;
    height: 154px;
    margin-left: -122px;
    background-image: url(/assets/artwork/illustration-paths-6d7cc0918e3be5ab9fe64bfd9d511fab8099b5dd330983ad7d1f6f9853109304.svg);
    background-size: cover;
  }
}
@media screen {
  .l-home-getting-started .c-tutorial-item--ios a:before {
    content: "";
    position: absolute;
    top: 25px;
    left: 50%;
    width: 182px;
    height: 147px;
    margin-left: -90px;
    background-image: url(/assets/artwork/illustration-ios-app-6fe01cac104d72c4c4f6859a8ecba8881d1fa176c021c6f868634e82eb53beb5.svg);
    background-size: cover;
  }
}
@media screen {
  .l-home-getting-started .c-tutorial-item--android a:before {
    content: "";
    position: absolute;
    top: 25px;
    left: 50%;
    width: 190px;
    height: 139px;
    margin-left: -95px;
    background-image: url(/assets/artwork/illustration-android-app-a5e1f0bed7c8b52abdf37955cbbda89773dedff4a44634ecb3ce8b02c000efc8.svg);
    background-size: cover;
  }
}
@media screen {
  .l-home-getting-started .c-tutorial-item--book a:before {
    content: "";
    position: absolute;
    top: 27px;
    left: 50%;
    width: 240px;
    height: 140px;
    margin-left: -120px;
    background-image: url(/assets/artwork/illustration-ios-apprentice-2ea93f658abc2aaec4e97ed68c2b2c2d5aeb027c63513e660be6d07692e6cb2d.svg);
    background-size: cover;
  }
}
@media screen and (min-width: 1440px) {
  .l-home-card-grid .l-grid-2 {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-home-card-grid .l-grid-2 {
    display: block;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-card-grid .c-tutorial--list {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen {
  .l-home-card-grid .c-tutorial-item {
    margin-top: 0 !important;
  }
  .l-home-card-grid .c-tutorial-item a {
    min-height: 100%;
  }
  .l-home-card-grid .c-tutorial-item .c-tutorial-item__text {
    display: grid !important;
  }
  .l-home-card-grid .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata {
    display: none;
  }
  .l-home-card-grid .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata-short {
    margin-top: 6px;
    font-size: 0.875rem; /* 14/16 */
  }
  .l-home-card-grid .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__in-progress, .l-home-card-grid .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__complete {
    order: 4;
  }
  .l-home-card-grid .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__complete {
    width: 113px;
  }
  .l-home-card-grid .c-tutorial-item .c-tutorial-item__number-badge {
    position: absolute;
    top: 37px;
    right: 37px;
  }
}
@media screen and (max-width: 768px) {
  .l-home-card-grid .c-tutorial-item .c-tutorial-item__number-badge {
    display: none;
  }
}
@media screen {
  .l-home-card-grid .c-tutorial-item .o-badge-tutorial--locked {
    display: flex;
  }
}
@media screen {
  .l-home-continue-watching .c-tutorial--featured {
    width: calc(100% + 30px);
    overflow: hidden;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .l-home-continue-watching .c-tutorial--featured::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media screen and (min-width: 1600px) {
  .l-home-continue-watching .c-tutorial--featured {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .l-home-continue-watching .c-tutorial--featured {
    display: grid;
  }
}
@media screen {
  .l-home-continue-watching .c-tutorial-item {
    width: auto !important;
    min-width: 300px !important;
    height: 240px !important;
    min-height: 240px !important;
    overflow: hidden;
    border-radius: 0.5625rem;
  }
}
@media screen and (min-width: 1600px) {
  .l-home-continue-watching .c-tutorial-item {
    min-width: auto !important;
  }
}
@media screen {
  .l-home-continue-watching .c-tutorial-item:before {
    background: rgba(51, 51, 51, 0.6);
  }
}
@media screen {
  .l-home-continue-watching .c-tutorial-item a {
    padding: 21px 0 21px 0 !important;
    overflow: hidden;
  }
  .l-home-continue-watching .c-tutorial-item a:hover .c-tutorial-item__art img {
    transform: scale(1.4);
  }
}
@media screen {
  .l-home-continue-watching .c-tutorial-item .o-badge--new, .l-home-continue-watching .c-tutorial-item .c-tutorial-item__platform {
    display: none;
  }
}
@media screen {
  .l-home-continue-watching .c-tutorial-item .c-tutorial-item__text-upper-meta .c-tutorial-item__metadata {
    display: none;
  }
  .l-home-continue-watching .c-tutorial-item .c-tutorial-item__text-upper-meta .c-tutorial-item__metadata-short {
    display: none;
    overflow: hidden;
    width: 200px;
    height: 20px;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 9px;
  }
  .l-home-continue-watching .c-tutorial-item .c-tutorial-item__text-upper-meta .c-tutorial-item__metadata-short .o-badge, .l-home-continue-watching .c-tutorial-item .c-tutorial-item__text-upper-meta .c-tutorial-item__metadata-short .o-badge-video {
    display: none;
  }
}
@media screen {
  .l-home-continue-watching .c-tutorial-item .c-tutorial-item__text {
    display: block;
    white-space: normal;
    padding: 21px 21px 9px 21px !important;
    width: 100%;
  }
}
@media screen {
  .l-home-continue-watching .c-tutorial-item .c-tutorial-item__title {
    font-size: 1.5rem !important; /* 24/16 */
    max-height: 90px;
    overflow: hidden;
  }
}
@media screen and (max-width: 992px) {
  .l-home-continue-watching .c-tutorial-item .c-tutorial-item__title {
    white-space: wrap;
  }
}
@media screen {
  .l-home-continue-watching .c-tutorial-item .c-tutorial-item__art {
    left: 0;
    width: 100%;
  }
  .l-home-continue-watching .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__art-image--primary {
    height: 100%;
    width: auto;
  }
}
@media screen {
  .l-home-continue-watching .c-tutorial-item .c-tutorial-item__in-progress {
    position: absolute !important;
    bottom: -21px !important;
    left: 0 !important;
    width: 100% !important;
    background: rgba(0, 0, 0, 0.125) !important;
  }
  .l-home-continue-watching .c-tutorial-item .c-tutorial-item__in-progress .c-tutorial-item__in-progress--fill {
    background: #158443 !important;
  }
}
@media screen {
  .l-home-upcoming .c-tutorial-item .o-button--bookmark {
    display: none !important;
  }
  .l-home-upcoming .c-tutorial-item .o-badge--new {
    display: none !important;
  }
  .l-home-upcoming .c-tutorial-item .c-tutorial-item__wrapper {
    min-height: 100%;
  }
  .l-home-upcoming .c-tutorial-item .c-tutorial-item__title, .l-home-upcoming .c-tutorial-item .c-tutorial-item__description, .l-home-upcoming .c-tutorial-item .c-tutorial-item__platform {
    color: #959DA5 !important;
  }
  .l-home-upcoming .c-tutorial-item .c-tutorial-item__metadata, .l-home-upcoming .c-tutorial-item .c-tutorial-item__metadata-short, .l-home-upcoming .c-tutorial-item .c-tutorial-item__in-progress, .l-home-upcoming .c-tutorial-item .c-tutorial-item__complete {
    display: none !important;
  }
  .l-home-upcoming .o-badge--soon {
    width: 107px !important;
    height: 25px !important;
    display: block !important;
  }
  .l-home-upcoming .o-badge-tutorial--locked {
    display: none !important;
  }
  .l-home-upcoming .o-badge-tutorial--recording {
    display: flex !important;
  }
}
@media screen {
  .l-home-new-tutorials-sidebar > div {
    display: grid;
    grid-template-columns: 1fr 420px;
    grid-column-gap: 90px;
  }
}
@media screen and (max-width: 1200px) {
  .l-home-new-tutorials-sidebar > div {
    grid-template-columns: 1fr 360px;
    grid-column-gap: 60px;
  }
}
@media screen and (max-width: 992px) {
  .l-home-new-tutorials-sidebar > div {
    grid-template-columns: 1fr;
  }
}
@media screen {
  .l-home-new-tutorials-sidebar .o-badge--new {
    display: none;
  }
}
@media screen {
  .l-home-new-tutorials-sidebar .o-badge-tutorial--locked, .l-home-new-tutorials-sidebar .o-badge-tutorial--recording {
    display: none !important;
  }
}
@media screen {
  .l-home-new-tutorials-sidebar .c-tutorial-item__metadata {
    order: 3;
    font-size: 0.875rem !important; /* 14/16 */
    display: block !important;
  }
}
@media screen {
  .l-home-new-tutorials-sidebar .c-tutorial-item__type, .l-home-new-tutorials-sidebar .c-tutorial-item__metadata-short {
    display: none !important;
  }
}
@media screen {
  .l-home-new-tutorials .c-tutorial-item a {
    height: 100%;
  }
}
@media screen and (max-width: 768px) {
  .l-home-new-tutorials .c-tutorial-item a .c-tutorial-item__text {
    display: grid !important;
  }
}
@media screen {
  .l-home-new-tutorials .c-tutorial-item .c-tutorial-item__metadata {
    order: 3;
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen {
  .l-home-new-tutorials .c-tutorial-item .c-tutorial-item__in-progress, .l-home-new-tutorials .c-tutorial-item .c-tutorial-item__complete {
    order: 4 !important;
  }
}
@media screen {
  .l-home-new-tutorials .c-tutorial-item .c-tutorial-item__complete {
    margin-top: 15px !important;
    width: 113px !important;
  }
}
@media screen {
  .l-home-announcements .c-tutorial-item .o-button--bookmark {
    display: none !important;
  }
  .l-home-announcements .c-tutorial-item a {
    grid-template-columns: 1fr 72px !important;
    padding: 21px !important;
  }
  .l-home-announcements .c-tutorial-item a .c-tutorial-item__type, .l-home-announcements .c-tutorial-item a .c-tutorial-item__in-progress, .l-home-announcements .c-tutorial-item a .c-tutorial-item__complete, .l-home-announcements .c-tutorial-item a .c-tutorial-item__metadata-short {
    display: none !important;
  }
}
@media screen {
  .l-home-books .c-tutorial--mason-mini {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: 25px;
    grid-row-gap: 25px;
    height: 100%;
  }
}
@media screen and (max-width: 992px) {
  .l-home-books .c-tutorial--mason-mini {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-home-books .c-tutorial--mason-mini {
    grid-template-columns: 1fr;
  }
}
@media screen {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item {
    margin-bottom: 20px;
    margin-top: 0;
    height: 100%;
  }
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item > a {
    display: block;
    height: 100%;
  }
}
@media screen and (max-width: 768px) {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item > a {
    grid-template-columns: 1fr 72px !important;
  }
}
@media screen and (max-width: 768px) {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item > a .c-tutorial-item__upper {
    display: grid;
  }
}
@media screen {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item .c-tutorial-item__art {
    width: auto !important;
    height: auto !important;
    background: none !important;
    order: 1;
    margin-top: -40px;
  }
}
@media screen and (max-width: 768px) {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item .c-tutorial-item__art {
    width: 72px !important;
    height: 72px !important;
    order: 2;
    margin-top: 0;
    margin-bottom: 20px;
    border-radius: 0.5625rem;
    overflow: hidden;
  }
}
@media screen {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__art-image--primary {
    display: block !important;
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__art-image--primary {
    display: none !important;
  }
}
@media screen {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__art-image--alternate {
    display: none !important;
  }
}
@media screen and (max-width: 768px) {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__art-image--alternate {
    display: block !important;
  }
}
@media screen {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item .c-tutorial-item__text {
    padding-right: 0;
    margin-left: 0;
    margin-top: 10px;
  }
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    padding-right: 0 !important;
  }
}
@media screen {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item .c-tutorial-item__upper {
    display: block;
  }
}
@media screen {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item .c-tutorial-item__lower {
    display: none !important;
  }
}
@media screen {
  .l-home-books .c-tutorial--mason-mini .c-tutorial-item .c-tutorial-item__text-upper-meta {
    display: none;
  }
}
@media screen {
  .l-home-recommendations span.o-tooltip {
    opacity: 1;
    visibility: visible;
    transform: none;
    top: -50px;
    margin-left: -120px;
  }
  .l-home-recommendations .c-tutorial-item .c-tutorial-item__in-progress, .l-home-recommendations .c-tutorial-item .c-tutorial-item__complete {
    order: 4 !important;
  }
}
@media screen {
  .l-home-dashboard {
    padding-left: 80px;
  }
}
@media screen and (max-width: 992px) {
  .l-home-dashboard {
    padding-left: 0;
  }
}
@media screen {
  .l-home-dashboard .l-grid-2 {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-dashboard .l-grid-2 {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen {
  .l-home-dashboard--sidebar {
    padding-left: 280px;
  }
}
@media screen and (max-width: 992px) {
  .l-home-dashboard--sidebar {
    padding-left: 0;
  }
}
@media screen {
  .l-home-dashboard--sidebar .l-grid-2 {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (min-width: 1440px) {
  .l-home-dashboard--sidebar .l-grid-2 {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 1152px) {
  .l-home-book-scroller {
    overflow-x: scroll;
    white-space: nowrap;
    width: calc(100% + 48px);
    max-width: 1152px;
    margin-left: -24px;
    padding-left: 24px;
    -webkit-overflow-scrolling: touch;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .l-home-book-scroller::-webkit-scrollbar {
    width: 0 !important;
  }
  .l-home-book-scroller .c-tutorial--book {
    min-width: 1152px;
    white-space: normal;
  }
}
@media screen {
  .l-home-teaspoon {
    overflow: hidden;
    background-image: url(/assets/patterns/shape-background-1-8d1d14b36b1a12b1f03999757d035e5bd0d6bbb71fc146cac5befc6c212e47e7.svg), url(/assets/patterns/shape-background-2-e1e3ba65a6ccd7893c55d105867b69ba4d51396c549a4b6a157e8ba590138edd.svg), url(/assets/patterns/shape-background-3-04b435a8b367f2acd5df19e9a5a9ebbc5cb9ebd83de592acf2614e6811916be2.svg), url(/assets/patterns/shape-background-4-0d96a3121fa3a02c4d7b878e6ed0675842ff726f49e40aba07030e84c1193067.svg), url(/assets/patterns/shape-background-5-c379900da8d28c5958f954b1f923c28e7059467db686e6466713c15ac59f9392.svg), url(/assets/patterns/shape-background-6-72adcee52e0ba4a563c8508d53eb3b86254d8a1c13794ac6058f49f443a162ff.svg), url(/assets/patterns/shape-background-7-807e6193fe372045c1a6e371de27240b7fa9c6f6204d89927caaf5d4ae34dee8.svg), url(/assets/patterns/shape-background-8-016f417c5c3633a91c7042c5b3cd3cd44e789c909675095750cc017b23010be4.svg), url(/assets/patterns/shape-background-9-67e08e905fe410e51fb03d1d9680af2c223752da21fd60247fc858579622ef3e.svg), url(/assets/patterns/shape-background-10-f4b5dbb2c2e157d0f0c5bd136cf6c3f8f54dd1b26e19bf117289e79ae35a6522.svg), url(/assets/patterns/shape-background-11-8d1d14b36b1a12b1f03999757d035e5bd0d6bbb71fc146cac5befc6c212e47e7.svg), url(/assets/patterns/shape-background-12-cf3b5cd30f02a0d25be106a8a8c5e4d38413686cfd6e9d4e3a6321bf8b628a07.svg);
    background-size: 1440px, 1440px, 1440px, 630px, 630px, 630px, 630px, 730px, 730px, 730px, 1440px, 1452px;
    background-position: top -40px right -50px, top right, top 430px right -200px, top 1330px left -400px, top 1380px left -420px, top 1530px right -400px, top 1580px right -420px, top 3030px right -400px, top 3580px right -420px, bottom 1000px left, bottom right -50px, bottom -1000px left;
    background-repeat: no-repeat;
  }
}
@media screen {
  section.l-home-hero-teaspoon {
    padding-top: 136px;
  }
}
@media screen and (max-width: 1080px) {
  section.l-home-hero-teaspoon {
    padding-top: 90px;
  }
}
@media screen and (max-width: 768px) {
  section.l-home-hero-teaspoon {
    padding-top: 60px;
  }
}
@media screen {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__wrapper {
    display: grid;
    grid-template-columns: 0.6fr 0.4fr;
    grid-column-gap: 26px;
  }
}
@media screen and (max-width: 1080px) {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__wrapper {
    grid-template-columns: 1fr;
  }
}
@media screen {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__left {
    position: relative;
  }
}
@media screen and (max-width: 1080px) {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__left {
    max-width: 686px;
    margin: 0 auto;
  }
}
@media screen {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__left:before {
    content: "";
    position: absolute;
    top: -240px;
    left: -180px;
    width: 324px;
    height: 541px;
    background-image: url(/assets/artwork/illustration-home-hero-7e4cfa11e8db4d2d1a0afbd5f7b6fd7f80bc4d22f8ec6a9c363668c68d23b493.svg);
    background-size: cover;
    background-repeat: no-repeat;
  }
}
@media screen {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__left h1 {
    font-size: 3.75rem; /* 60/16 */
    line-height: 1;
  }
}
@media screen and (max-width: 1080px) {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__left h1 {
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__left h1 {
    font-size: 2.25rem;
  }
}
@media screen {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__left p {
    margin-top: 20px;
    font-family: "Bitter", serif;
    font-size: 1.3125rem; /* 21/16 */
    line-height: 1.35;
    letter-spacing: -0.5px;
  }
}
@media screen and (max-width: 1080px) {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__left p {
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__left p {
    font-size: 1.0625rem; /* 17/16 */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    letter-spacing: 0;
  }
}
@media screen {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__right {
    position: relative;
    z-index: 0;
  }
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__right:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: -240px;
    left: 0;
    width: 626px;
    height: 669px;
    background-image: url(/assets/patterns/shape-background-13-08bfdf1a7c5ed93dd002ff177265c01825031b3c533df81d72958740f0ef2df8.svg);
    background-size: cover;
    background-repeat: no-repeat;
  }
}
@media screen and (max-width: 1080px) {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__right:before {
    display: none;
  }
}
@media screen {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__right > div {
    margin-top: -76px;
    padding-left: 40px;
  }
}
@media screen and (max-width: 1080px) {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__right > div {
    margin-top: 20px !important;
    padding-left: 0;
  }
}
@media screen {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__right p, section.l-home-hero-teaspoon .l-home-hero-teaspoon__right ul {
    font-family: "Bitter", serif;
    font-size: 1.25rem; /* 20/16 */
    color: #ffffff;
  }
}
@media screen and (max-width: 1080px) {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__right p, section.l-home-hero-teaspoon .l-home-hero-teaspoon__right ul {
    color: #333333;
  }
}
@media screen {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__right p {
    text-align: center;
    line-height: 1.25;
  }
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__right p span {
    font-size: 1.125rem; /* 18/16 */
  }
}
@media screen {
  section.l-home-hero-teaspoon .l-home-hero-teaspoon__right ul {
    text-align: center;
    margin-top: 20px;
    padding-left: 0;
    font-size: 1.125rem; /* 18/16 */
  }
}
@media screen {
  section.l-home-hero-teaspoon-bottom {
    padding-bottom: 140px;
  }
}
@media screen and (max-width: 768px) {
  section.l-home-hero-teaspoon-bottom {
    padding-top: 90px;
    padding-bottom: 90px;
  }
}
@media screen {
  section.l-home-hero-teaspoon-bottom .l-home-hero-teaspoon__left:before {
    top: -140px;
    left: -180px;
    width: 295px;
    height: 633px;
    background-image: url(/assets/artwork/illustration-home-footer-5e6ec24f93a67f76aacbd96085b7f42a0632451ee740aafc1b231d4e5c27573f.svg) !important;
    background-size: cover;
    background-repeat: no-repeat;
  }
}
@media screen {
  section.l-home-hero-teaspoon-bottom .l-home-hero-teaspoon__right:before {
    background-image: url(/assets/patterns/shape-background-14-f2bd03f1cf7707c297a77aa034a76339bf3bb6d26ce0d7cb71112f00a996fe0c.svg) !important;
    background-size: cover;
    background-repeat: no-repeat;
  }
  section.l-home-hero-teaspoon-bottom .l-home-hero-teaspoon__right > div {
    margin-top: 0;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-promo-video-teaspoon {
    margin-top: 90px;
  }
}
@media screen {
  .l-home-promo-video-teaspoon .l-home-promo-video-teaspoon__grid {
    display: grid;
    grid-template-columns: 0.4fr 0.6fr;
    grid-column-gap: 26px;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-promo-video-teaspoon .l-home-promo-video-teaspoon__grid {
    grid-template-columns: 1fr;
    grid-row-gap: 20px;
  }
}
@media screen {
  .l-home-promo-video-teaspoon .l-home-promo-video-teaspoon__grid p {
    padding-right: 20px;
    font-size: 1rem;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-promo-video-teaspoon .l-home-promo-video-teaspoon__grid p {
    padding-right: 0;
    font-size: 1.0625rem; /* 17/16 */
  }
}
@media screen and (max-width: 1080px) {
  .l-home-promo-video-teaspoon .l-home-promo-video-teaspoon__grid .l-home-promo-video-teaspoon__video {
    order: 0;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-promo-video-teaspoon .l-home-promo-video-teaspoon__grid > div {
    order: 1;
    text-align: center;
    max-width: 678px;
    margin: 0 auto;
  }
}
@media screen {
  .l-home-platforms .l-home-platforms__grid-outer {
    display: grid;
    grid-template-columns: 1fr;
    grid-column-gap: 16px;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-platforms .l-home-platforms__grid-outer {
    grid-template-columns: 1fr;
    grid-row-gap: 16px;
  }
}
@media screen {
  .l-home-platforms .l-home-platforms__grid-inner-left {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-platforms .l-home-platforms__grid-inner-left {
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
}
@media screen and (max-width: 768px) {
  .l-home-platforms .l-home-platforms__grid-inner-left {
    grid-template-columns: 1fr;
    grid-row-gap: 16px;
  }
}
@media screen {
  .l-home-platforms .l-home-platforms__grid-inner-left .c-card-platform {
    min-height: 420px;
  }
}
@media screen and (max-width: 768px) {
  .l-home-platforms .l-home-platforms__grid-inner-left .c-card-platform {
    min-height: auto;
  }
}
@media screen {
  .l-home-platforms .l-home-platforms__grid-inner-left .c-card-platform a {
    padding-top: 130px;
  }
}
@media screen {
  .l-home-platforms .l-home-platforms__grid-inner-right {
    display: grid;
    grid-row-gap: 16px;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-platforms .l-home-platforms__grid-inner-right {
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 16px;
  }
}
@media screen and (max-width: 768px) {
  .l-home-platforms .l-home-platforms__grid-inner-right {
    grid-template-columns: 1fr;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-platforms .l-home-platforms__grid-inner-right .c-card-platform a {
    padding-top: 120px;
  }
}
@media screen {
  .l-home-platforms .l-home-platforms__grid-inner-right .c-card-platform a h2 {
    align-self: flex-end;
  }
}
@media screen {
  .l-home-platforms .l-home-platforms__grid-inner-right .c-card-platform a p {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .l-home-platforms .l-home-platforms__grid-inner-right .c-card-platform a p {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  .l-home-platforms .c-card-platform h2, .l-home-platforms .c-card-platform p {
    max-width: none;
    display: block;
  }
}
@media screen {
  .l-home-community {
    position: relative;
    z-index: 1;
  }
  .l-home-community > div {
    position: relative;
  }
  .l-home-community > div:before {
    content: "";
    position: absolute;
    left: -482px;
    top: -50px;
    width: 572px;
    height: 574px;
    background-image: url(/assets/photos/people-mosaic-left-f3c554523b744b526745fc02f9b939026cc816602cdd23ecb53a317724637f6f.png);
    background-size: cover;
  }
}
@media screen and (max-width: 768px) {
  .l-home-community > div:before {
    display: none;
  }
}
@media screen {
  .l-home-community > div:after {
    content: "";
    position: absolute;
    right: -482px;
    top: -50px;
    width: 572px;
    height: 574px;
    background-image: url(/assets/photos/people-mosaic-right-af29365753cc684a0ecd2d5128c8cb69bbcaf0747b33c84c25047e8e89075836.png);
    background-size: cover;
  }
}
@media screen and (max-width: 768px) {
  .l-home-community > div:after {
    display: none;
  }
}
@media screen {
  .l-home-community p {
    font-family: "Bitter", serif;
    font-size: 1.25rem; /* 20/16 */
    margin-top: 20px;
    letter-spacing: -0.5px;
  }
}
@media screen and (max-width: 768px) {
  .l-home-community p {
    font-size: 1.0625rem; /* 17/16 */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    color: #6E7687;
    letter-spacing: 0;
  }
}
@media screen {
  .l-home-community p:first-child {
    margin-top: 40px;
  }
}
@media screen {
  .l-home-tutorials-teaspoon .l-tutorial-container {
    padding: 0;
  }
  .l-home-tutorials-teaspoon .l-tutorial-collection {
    padding-top: 0;
  }
  .l-home-tutorials-teaspoon .l-tutorial-collection .o-button__icon--prev, .l-home-tutorials-teaspoon .l-tutorial-collection .o-button__icon--next {
    opacity: 1;
    width: 140px;
  }
  .l-home-tutorials-teaspoon .l-tutorial-collection .o-button__icon--prev span, .l-home-tutorials-teaspoon .l-tutorial-collection .o-button__icon--next span {
    background: #333333;
  }
  .l-home-tutorials-teaspoon .l-tutorial-collection .o-button__icon--prev span:hover, .l-home-tutorials-teaspoon .l-tutorial-collection .o-button__icon--next span:hover {
    background: #158443;
  }
  .l-home-tutorials-teaspoon .l-tutorial-collection .o-button__icon--prev {
    left: 0;
    background: rgb(255, 255, 255);
    background: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
    padding-left: 24px;
  }
  .l-home-tutorials-teaspoon .l-tutorial-collection .o-button__icon--next {
    right: 0;
    background: rgb(255, 255, 255);
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%);
    padding-right: 24px;
  }
  .l-home-tutorials-teaspoon .l-tutorial-collection .o-button__icon--next span {
    right: 24px;
  }
  .l-home-tutorials-teaspoon .l-tutorial-container__wrapper {
    padding-top: 36px;
    padding-bottom: 36px;
  }
  .l-home-tutorials-teaspoon .c-tutorial-item {
    width: 275px;
    min-width: 275px;
  }
  .l-home-tutorials-teaspoon .c-tutorial-item a {
    border-radius: 0.75rem; /* 12/16 */
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
  }
  .l-home-tutorials-teaspoon .c-tutorial-item a .c-tutorial-item__text-upper {
    padding: 20px;
  }
  .l-home-tutorials-teaspoon .c-tutorial-item a .c-tutorial-item__text {
    margin: 0;
  }
  .l-home-tutorials-teaspoon .c-tutorial-item a .c-tutorial-item__art {
    border-radius: 0.5625rem 0.5625rem 0 0;
  }
  .l-home-tutorials-teaspoon .c-tutorial-item a .c-tutorial-item__icon {
    top: 140px !important;
  }
  .l-home-tutorials-teaspoon .c-tutorial-item a .c-tutorial-item__icon .o-badge--pro {
    top: 8px;
    box-shadow: none;
  }
  .l-home-tutorials-teaspoon .c-tutorial-item a .c-tutorial-item__title {
    font-size: 1.25rem !important; /* 20/16 */
    line-height: 1.25;
  }
  .l-home-tutorials-teaspoon .c-tutorial-item a .c-tutorial-item__metadata, .l-home-tutorials-teaspoon .c-tutorial-item a .c-tutorial-item__metadata-short {
    display: none;
  }
  .l-home-tutorials-teaspoon .c-tutorial-item a .c-tutorial-item__platform {
    display: block !important;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-why-choose .l-grid-3 {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-home-why-choose > div > div {
    margin-top: 40px;
  }
}
@media screen and (max-width: 768px) {
  .l-home-why-choose h3, .l-home-why-choose p {
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .l-home-why-choose h3 {
    margin-top: 20px;
  }
}
@media screen {
  .l-home-why-choose p {
    font-size: 1rem;
  }
}
@media screen and (max-width: 768px) {
  .l-home-why-choose p {
    font-size: 1.0625rem; /* 17/16 */
  }
}
@media screen {
  .l-home-grid-2022 {
    display: grid;
    grid-template-columns: 1fr 340px;
    grid-column-gap: 65px;
  }
}
@media screen and (max-width: 992px) {
  .l-home-grid-2022 {
    display: block;
  }
}
@media screen and (max-width: 600px) {
  .l-home-scrollable-mobile {
    display: flex !important;
    overflow-x: scroll;
    margin-left: -24px;
    padding-left: 24px;
    width: calc(100% + 48px);
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .l-home-scrollable-mobile::-webkit-scrollbar {
    width: 0 !important;
  }
  .l-home-scrollable-mobile > div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-right: 30px;
  }
}
@media screen {
  .l-home-popular-search .c-global-search {
    background-color: #ffffff;
  }
  .l-home-popular-search .c-global-search .o-input {
    margin-top: 15px;
    margin-bottom: 15px;
  }
  .l-home-popular-search .c-global-search .input__icon-svg--search {
    fill: #6E7687;
    margin-top: -3px;
    opacity: 0.5;
  }
  .l-home-popular-search .c-search__tags {
    margin-bottom: -8px;
  }
}
@media screen and (max-width: 600px) {
  .l-grid-new-content.l-home-scrollable-mobile {
    padding-top: 14px;
  }
}
@media screen and (max-width: 768px) {
  .l-grid-new-content.c-skeleton-tutorials {
    display: grid;
  }
}
@media screen {
  #user-index-new-content .c-modal-wrapper {
    max-width: 686px !important;
    height: 50%;
    min-height: 400px;
    overflow-y: scroll !important;
    padding-top: 30px !important;
  }
  #user-index-new-content .c-modal-wrapper .c-tabs {
    border-bottom: none;
  }
  #user-index-new-content .c-modal-wrapper .c-tabs li button {
    color: #A7ADB4 !important;
    font-weight: 600;
  }
  #user-index-new-content .c-modal-wrapper .c-tabs .c-tabs--active:before {
    background-color: #158443;
  }
  #user-index-new-content .c-modal-wrapper .c-tabs .c-tabs--active button {
    color: #158443 !important;
  }
}
@media screen {
  .l-home-recommended .c-tabs {
    border-bottom: none;
  }
  .l-home-recommended .c-tabs li button {
    color: #A7ADB4;
    font-weight: 600;
  }
  .l-home-recommended .c-tabs .c-tabs--active:before {
    background-color: #158443;
  }
  .l-home-recommended .c-tabs .c-tabs--active button {
    color: #158443;
  }
}
@media screen and (max-width: 600px) {
  .l-home-recommended .l-grid-2-fr {
    display: flex !important;
    overflow-x: scroll;
    margin-left: -24px;
    padding-left: 24px;
    width: calc(100% + 48px);
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .l-home-recommended .l-grid-2-fr::-webkit-scrollbar {
    width: 0 !important;
  }
  .l-home-recommended .l-grid-2-fr > div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-right: 0px;
    min-width: 320px;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item {
    width: auto !important;
    min-width: auto !important;
    height: auto !important;
  }
  .l-home-recommended .c-tutorial-item a {
    background: #ffffff;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.075);
    padding-top: 170px;
  }
  .l-home-recommended .c-tutorial-item .c-tutorial-item__art {
    width: 100%;
    transition: all 0.5s;
  }
  .l-home-recommended .c-tutorial-item .c-tutorial-item__art:before {
    z-index: 1;
    background-image: none !important;
    display: none;
  }
  .l-home-recommended .c-tutorial-item .c-tutorial-item__art:hover img {
    transform: scale(1.1) !important;
  }
  .l-home-recommended .c-tutorial-item .c-tutorial-item__art img {
    display: block;
    width: 100%;
    max-width: 315px;
    margin: 0 auto;
    position: relative;
    top: 15px;
    transform: scale(1) !important;
  }
}
@media screen and (max-width: 768px) {
  .l-home-recommended .c-tutorial-item .c-tutorial-item__art img {
    max-width: 270px;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item .c-tutorial-item__text {
    z-index: 2;
    white-space: normal;
  }
  .l-home-recommended .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    font-size: 1.25rem !important; /* 20/16 */
    line-height: 1.2 !important;
    color: #333333;
  }
  .l-home-recommended .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__abstract {
    color: #6E7687;
    margin-top: 10px;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item--onboarding-video:hover .c-tutorial-item__video-player:after {
    transform: scale(1.1);
  }
  .l-home-recommended .c-tutorial-item--onboarding-video .c-tutorial-item__video-player {
    width: 100%;
    padding-top: 50%;
    position: relative;
    z-index: 0;
    overflow: hidden;
  }
  .l-home-recommended .c-tutorial-item--onboarding-video .c-tutorial-item__video-player:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #1a1a1a;
    opacity: 0.25;
  }
  .l-home-recommended .c-tutorial-item--onboarding-video .c-tutorial-item__video-player:after {
    content: "";
    position: absolute;
    top: 10px;
    left: 10px;
    width: calc(100% - 20px);
    height: 100%;
    background-image: url(/assets/artwork/illustration-onboarding-video-8127ed9d0195d0511990d8c4286c7e69b98a68f656d11a57348a90f788a992d7.svg);
    background-size: cover;
    z-index: -1;
    transition: transform 0.25s ease-out;
  }
  .l-home-recommended .c-tutorial-item--onboarding-video > a {
    flex-wrap: wrap;
    padding-top: 0;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item--video-content:hover .c-tutorial-item__video-player > img {
    transform: scale(1.1);
  }
  .l-home-recommended .c-tutorial-item--video-content .c-tutorial-item__video-player {
    width: 100%;
    padding-top: 50%;
    position: relative;
    z-index: 0;
    overflow: hidden;
  }
  .l-home-recommended .c-tutorial-item--video-content .c-tutorial-item__video-player:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #1a1a1a;
    opacity: 0.25;
    z-index: 0;
  }
  .l-home-recommended .c-tutorial-item--video-content .c-tutorial-item__video-player > img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    transition: transform 0.25s ease-out;
    z-index: -1;
  }
  .l-home-recommended .c-tutorial-item--video-content > a {
    flex-wrap: wrap;
    padding-top: 0;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item--article-content .c-tutorial-item__video-player:before {
    display: none !important;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item .c-tutorial-item__art--article:hover img {
    transform: scale(1) !important;
  }
  .l-home-recommended .c-tutorial-item .c-tutorial-item__art--article .c-tutorial-item__art-image--alternate {
    top: 0 !important;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item--book-content {
    width: auto !important;
    height: auto !important;
    min-width: 100% !important;
    max-width: 180px;
  }
}
@media screen and (max-width: 600px) {
  .l-home-recommended .c-tutorial-item--book-content {
    min-width: 180px !important;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item--book-content:hover .c-tutorial-item__art img {
    transform: scale(1) !important;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item--book-content a {
    background: none;
    box-shadow: none;
    border-radius: 0;
    padding-top: 0;
    flex-direction: column;
    max-width: 180px;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item--book-content .c-tutorial-item__text {
    padding: 0 !important;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item--book-content .c-tutorial-item__title {
    font-size: 1.1875rem !important; /* 19/16 */
    padding-right: 0 !important;
    margin-top: 15px;
    text-align: center;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item--book-content .c-tutorial-item__platform {
    font-size: 0.875rem !important; /* 14/16 */
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item--book-content .c-tutorial-item__art {
    position: relative !important;
    border-radius: 21px;
  }
}
@media screen {
  .l-home-recommended .c-tutorial-item--book-content .c-tutorial-item__art-image--primary {
    top: auto !important;
  }
}
@media screen {
  .l-home-my-books .c-tutorial--book {
    display: grid;
    grid-template-columns: 180px 180px 180px;
    justify-content: space-around;
    padding: 0 20px;
  }
}
@media screen and (max-width: 1080px) {
  .l-home-my-books .c-tutorial--book {
    grid-template-columns: 180px 180px;
  }
}
@media screen and (max-width: 992px) {
  .l-home-my-books .c-tutorial--book {
    grid-template-columns: 180px 180px 180px;
  }
}
@media screen and (max-width: 768px) {
  .l-home-my-books .c-tutorial--book {
    grid-template-columns: 180px 180px;
  }
}
@media screen and (max-width: 600px) {
  .l-home-my-books .c-tutorial--book {
    padding: 10px 24px 0 24px;
    align-items: flex-start;
    justify-content: flex-start;
  }
  .l-home-my-books .c-tutorial--book > div {
    min-width: 180px;
  }
}
@media screen {
  .l-home-my-books .c-tutorial-item {
    max-width: 180px;
  }
  .l-home-my-books .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__art {
    max-width: 180px;
  }
  .l-home-my-books .c-tutorial-item .c-tutorial-item__title {
    font-size: 1.1875rem !important; /* 19/16 */
  }
  .l-home-my-books .c-tutorial-item .c-tutorial-item__platform {
    font-size: 0.875rem !important; /* 14/16 */
  }
}
@media screen {
  .l-onboarding-background {
    background-image: url(/assets/patterns/shape-background-2-e1e3ba65a6ccd7893c55d105867b69ba4d51396c549a4b6a157e8ba590138edd.svg), url(/assets/patterns/shape-background-1-8d1d14b36b1a12b1f03999757d035e5bd0d6bbb71fc146cac5befc6c212e47e7.svg);
    background-size: 100%, 1440px;
    background-position: top -72px right, top -60px right -60px;
    background-repeat: no-repeat;
  }
}
@media screen {
  .l-onboarding-interests {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
}
@media screen and (max-width: 1080px) {
  .l-onboarding-interests {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 992px) {
  .l-onboarding-interests {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 600px) {
  .l-onboarding-interests {
    display: grid;
    grid-template-columns: 1fr;
  }
}
@media screen {
  .l-onboarding-interests .c-card-platform > div {
    padding-top: 140px;
  }
  .l-onboarding-interests .c-card-platform > div h2 {
    min-width: 100%;
    width: 100%;
    justify-content: center;
  }
}
@media screen {
  .l-onboarding-skill {
    display: flex;
    white-space: nowrap;
    max-width: 770px;
    margin-left: auto;
    margin-right: auto;
  }
  .l-onboarding-skill:before {
    content: "";
    width: 200px;
    height: 100%;
  }
  .l-onboarding-skill .c-card-choice {
    min-width: 345px;
    width: 345px;
    height: 380px;
    margin-left: 40px;
    white-space: normal;
  }
}
@media screen and (max-width: 768px) {
  .l-onboarding-skill .c-card-choice {
    margin-left: 30px;
    width: 300px;
    min-width: 300px;
  }
}
@media screen {
  .l-onboarding-skill .c-card-choice img {
    margin-top: 24px;
    width: 160px;
  }
}
@media screen {
  .l-onboarding-skill--multiple {
    max-width: none !important;
  }
}
@media screen {
  .l-subscription-plans--teaspoon {
    background-image: url(/assets/artwork/illustration-subscription-header-923bfbe189a4967a8aa7d5afda8500cc54c825927e383d2434d94171e11bbafb.svg), url(/assets/patterns/shape-background-2-e1e3ba65a6ccd7893c55d105867b69ba4d51396c549a4b6a157e8ba590138edd.svg), url(/assets/patterns/shape-background-1-8d1d14b36b1a12b1f03999757d035e5bd0d6bbb71fc146cac5befc6c212e47e7.svg);
    background-size: 1500px, 100%, 1440px;
    background-position: top -120px center, top -72px right, top -60px right -60px;
    background-repeat: no-repeat, no-repeat, no-repeat;
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon > div > .l-flex-justify-center {
    display: grid;
    grid-template-columns: 1fr;
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon .l-margin-30--force {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-subscription-plans--teaspoon .c-plan {
    height: auto;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25) !important;
    padding: 32px 18px !important;
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon .c-plan {
    width: 100%;
    text-align: center;
    padding-bottom: 36px;
    padding-left: 24px;
    padding-right: 24px;
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon .c-plan:first-of-type {
    order: 1;
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__info {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__info {
    display: grid;
    grid-template-areas: "intro benefits" "options options";
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
  }
}
@media screen and (max-width: 600px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__info {
    grid-template-areas: "intro intro" "benefits benefits" "options options";
  }
}
@media screen and (max-width: 768px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__intro {
    grid-area: intro;
  }
}
@media screen {
  .l-subscription-plans--teaspoon .c-plan .c-plan__intro .c-plan__blurb {
    font-size: 0.9375rem; /* 15/16 */
    color: #333333;
    width: 200px;
    display: block;
    text-align: center;
    margin: 9px auto -10px;
    opacity: 0.66;
  }
}
@media screen and (max-width: 768px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__intro .c-plan__blurb {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__intro .c-plan__price .c-plan__price-main {
    font-size: 3.75rem !important; /* 60/16 */
    line-height: 60px !important;
    position: relative;
    top: auto;
    left: auto;
    letter-spacing: -2px;
  }
  .l-subscription-plans--teaspoon .c-plan .c-plan__intro .c-plan__price .c-plan__price-cents {
    top: auto;
    bottom: 0;
    left: auto;
    right: auto;
  }
  .l-subscription-plans--teaspoon .c-plan .c-plan__intro .c-plan__price .c-plan__price-currency {
    top: auto;
    bottom: auto;
    left: -15px;
    right: auto;
  }
}
@media screen {
  .l-subscription-plans--teaspoon .c-plan .c-plan__benefits {
    padding-bottom: 90px;
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__benefits {
    padding-bottom: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__benefits {
    grid-area: benefits;
  }
}
@media screen and (max-width: 600px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__benefits {
    padding-bottom: 0;
    margin-top: 24px !important;
  }
}
@media screen {
  .l-subscription-plans--teaspoon .c-plan .c-plan__benefits li {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__benefits li:first-child {
    margin-top: 0;
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__options {
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 768px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__options {
    grid-area: options;
    margin-top: 30px;
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__options a {
    position: relative;
    transform: none;
    bottom: auto;
  }
}
@media screen {
  .l-subscription-plans--teaspoon .c-plan .c-plan__options .o-button--primary {
    bottom: 36px;
  }
}
@media screen and (max-width: 768px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__options .o-button--primary {
    bottom: 0;
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__options .o-button--secondary {
    margin-top: 20px;
    width: 100%;
  }
}
@media screen and (max-width: 600px) {
  .l-subscription-plans--teaspoon .c-plan .c-plan__options .o-button--secondary {
    white-space: normal;
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon .c-plan--left, .l-subscription-plans--teaspoon .c-plan--right {
    border-radius: 0.5625rem;
  }
}
@media screen {
  .l-subscription-plans--teaspoon .c-plan--emphasis {
    background: #157CB8;
    min-width: 336px;
  }
  .l-subscription-plans--teaspoon .c-plan--emphasis:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -20px;
    width: 100%;
    height: 40px;
    background: #157CB8;
    border-radius: 0.5625rem;
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon .c-plan--emphasis {
    order: 0;
    min-height: auto;
  }
}
@media screen and (max-width: 992px) {
  .l-subscription-plans--teaspoon .c-plan--emphasis:after {
    display: none;
  }
}
@media screen {
  .l-subscription-plans--teaspoon .c-plan--emphasis .c-plan__blurb {
    color: #ffffff !important;
  }
}
@media screen {
  .l-subscription-plans--teaspoon .c-plan--emphasis .o-badge {
    color: #157CB8;
    border-color: #157CB8;
  }
}
@media screen {
  .l-subscription-plans--teaspoon .c-plan--emphasis .o-badge--pro {
    color: #ffffff;
    border-color: #ffffff;
    position: relative;
    border-radius: 0.5625rem;
    border: 2px solid #ffffff;
    left: auto;
    margin: 0;
    top: -4px;
    margin-left: 3px;
  }
}
@media screen and (max-width: 992px) {
  .l-onboarding-plans--black-friday .c-plan--neon {
    border: none;
    box-shadow: none;
  }
}
@media screen {
  .l-onboarding-plans--black-friday .o-tooltip {
    line-height: 1;
  }
  .l-onboarding-plans--black-friday .o-tooltip:after {
    display: none;
  }
}
@media screen {
  .l-subscription-sales-flourish--bottom {
    width: 100%;
    height: 200px;
    position: relative;
    margin-bottom: -100px;
  }
  .l-subscription-sales-flourish--bottom:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #F3B36A;
    clip-path: polygon(0 0, 0 0, 100% 0, 100% 100%);
  }
  .l-subscription-sales-flourish--bottom:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #F3B36A;
    opacity: 0.1;
    clip-path: polygon(0 0, 100% 0, 0 100%, 0 0);
  }
}
@media screen {
  .l-onboarding-hello {
    max-width: 670px;
    margin: 0 auto;
  }
}
@media screen and (max-width: 768px) {
  .l-onboarding-hello {
    padding: 0 30px;
    grid-template-columns: 1fr;
    grid-row-gap: 30px;
  }
}
@media screen {
  .l-onboarding-hello .c-card-option {
    height: 320px;
  }
}
@media screen and (max-width: 768px) {
  .l-onboarding-hello .c-card-option:nth-of-type(1) {
    order: 2;
  }
}
@media screen {
  .l-onboarding-hello .c-card-option:nth-of-type(1) img {
    padding-top: 10px;
    width: 175px;
  }
}
@media screen and (max-width: 768px) {
  .l-onboarding-hello .c-card-option:nth-of-type(2) {
    order: 1;
  }
}
@media screen {
  .l-onboarding-hello .c-card-option:nth-of-type(2) img {
    width: 290px;
    margin: 0 auto;
    padding-top: 20px;
  }
}
@media screen and (max-width: 380px) {
  .l-onboarding-hello .c-card-option:nth-of-type(2) img {
    width: 260px;
  }
}
@media screen {
  .l-onboarding-hello .c-card-option a {
    display: grid;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 30px;
  }
}
@media screen {
  .l-onboarding-topics {
    max-width: 500px;
    margin: 0 auto;
  }
}
@media screen and (max-width: 768px) {
  .l-onboarding-topics {
    padding: 0 30px;
    grid-template-columns: 1fr;
    grid-row-gap: 20px;
  }
}
@media screen {
  .l-onboarding-topics .c-card-option {
    height: 240px;
  }
}
@media screen and (max-width: 768px) {
  .l-onboarding-topics .c-card-option {
    height: 200px;
  }
}
@media screen {
  .l-onboarding-topics .c-card-option a {
    display: grid;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 42px;
  }
}
@media screen {
  .l-onboarding-questions {
    max-width: 428px;
    margin: 0 auto;
    display: grid;
    grid-row-gap: 20px;
  }
}
@media screen and (max-width: 768px) {
  .l-onboarding-questions {
    padding: 0 30px;
    grid-row-gap: 15px;
  }
}
@media screen {
  .l-onboarding-questions a {
    color: #333333;
    text-decoration: none;
    border: 2px solid #D6E0EF;
    border-radius: 0.5625rem;
    padding: 12px 16px;
  }
}
@media screen and (max-width: 768px) {
  .l-onboarding-questions a {
    font-size: 0.9375rem; /* 15/16 */
    padding: 11px 16px;
    text-align: center;
  }
}
@media screen {
  .l-onboarding-questions a:hover {
    background: #F2F6FA;
  }
}
@media screen {
  .l-onboarding-reason form > div {
    max-width: 820px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 28px;
    grid-row-gap: 20px;
  }
}
@media screen and (max-width: 992px) {
  .l-onboarding-reason form > div {
    max-width: 428px;
    grid-template-columns: 1fr;
    grid-row-gap: 15px;
  }
}
@media screen and (max-width: 768px) {
  .l-onboarding-reason form > div {
    padding: 0 30px;
  }
}
@media screen {
  .l-onboarding-reason div {
    position: relative;
  }
  .l-onboarding-reason div input[type=checkbox] {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
  }
  .l-onboarding-reason div > input[type=checkbox]:hover + label {
    background: #F2F6FA;
  }
  .l-onboarding-reason div > input[type=checkbox]:checked + label {
    background: #158443;
    border-color: #158443;
    color: #ffffff;
  }
  .l-onboarding-reason div > input[type=checkbox]:checked + label:before {
    opacity: 1;
  }
}
@media screen and (max-width: 768px) {
  .l-onboarding-reason div > input[type=checkbox]:checked + label:before {
    opacity: 0;
  }
}
@media screen {
  .l-onboarding-reason label {
    display: block;
    color: #333333;
    text-decoration: none;
    border: 2px solid #D6E0EF;
    border-radius: 0.5625rem;
    padding: 12px 16px;
    cursor: pointer;
    transition: all 0.5s;
    position: relative;
    z-index: -1;
  }
}
@media screen and (max-width: 768px) {
  .l-onboarding-reason label {
    font-size: 0.9375rem; /* 15/16 */
    padding: 11px 16px;
    text-align: center;
  }
}
@media screen {
  .l-onboarding-reason label:before {
    content: "";
    width: 14px;
    height: 11px;
    top: 50%;
    right: 18px;
    margin-top: -5px;
    position: absolute;
    background-image: url(/assets/svg-icons/checkmark-input-1b8bd8dd799f9ea5860fb52681f477caf55c87984a33ed8c58cefdcd097ca5d2.png);
    background-size: cover;
    opacity: 0;
  }
}
@media screen {
  .l-onboarding-reason label:hover {
    background: #F2F6FA;
  }
}
@media screen {
  .l-onboarding-header {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    margin-top: 30px;
    margin-bottom: 90px;
  }
}
@media screen and (max-width: 768px) {
  .l-onboarding-header {
    margin-bottom: 45px;
  }
}
@media screen {
  .l-onboarding-header h2 {
    text-align: center;
    font-size: 1.25rem; /* 20/16 */
  }
}
@media screen {
  .l-onboarding-header div:nth-of-type(2) {
    text-align: right;
  }
}
@media screen {
  .l-onboarding-header a {
    font-size: 1rem;
    color: #6E7687;
  }
}
@media screen {
  section.l-about-hero {
    height: 450px;
    z-index: 1;
    position: relative;
    overflow: hidden;
  }
  section.l-about-hero:before {
    content: "";
    width: 560px;
    height: 100%;
    background-image: url(/assets/patterns/people-left-large@2x-4cc481f79d54a5f3cb15b85d10654f6001af31c846d96fb0200911cbb06feffb.png);
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
}
@media screen and (max-width: 1200px) {
  section.l-about-hero:before {
    left: -150px;
  }
}
@media screen and (max-width: 992px) {
  section.l-about-hero:before {
    display: none;
  }
}
@media screen {
  section.l-about-hero:after {
    content: "";
    width: 560px;
    height: 100%;
    background-image: url(/assets/patterns/people-right-large@2x-96c41691ead326cb15541bdef6a06b2c9be827f2dc1173ebfb5051220b085b0f.png);
    background-size: cover;
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
  }
}
@media screen and (max-width: 1200px) {
  section.l-about-hero:after {
    right: -150px;
  }
}
@media screen and (max-width: 992px) {
  section.l-about-hero:after {
    display: none;
  }
}
@media screen {
  section.l-about-hero h1 {
    width: 100%;
    font-size: 3.75rem; /* 60/16 */
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  section.l-about-hero h1 {
    font-size: 2rem;
  }
}
@media screen {
  section.l-about-hero h1 span {
    margin-top: 12px;
    display: block;
    font-size: 1.875rem; /* 30/16 */
    line-height: 1.35;
  }
}
@media screen and (max-width: 768px) {
  section.l-about-hero h1 span {
    font-size: 1.5rem;
  }
}
@media screen {
  section.l-about-stats {
    background: #158443;
    background-image: url(/assets/patterns/geometric-relate-pattern--green-8de5dc544490e80b5189ea4003defbc30e0426d1efc37a89346f0895265c5f91.png);
    background-size: cover;
    padding: 54px 0;
  }
  section.l-about-stats h2, section.l-about-stats p, section.l-about-stats li {
    color: #ffffff;
  }
  section.l-about-stats .l-about-stats__figures {
    display: flex;
    justify-content: space-between;
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  section.l-about-stats .l-about-stats__figures {
    display: none;
  }
}
@media screen {
  section.l-about-stats .l-about-stats__figures .l-about-stats__figures-total {
    font-family: "Bitter", serif;
    font-size: 54px;
    font-weight: 700;
    letter-spacing: -3px;
    display: block;
  }
}
@media screen {
  section.l-about-stats .l-about-stats__figures .l-about-stats__figures-title {
    font-size: 0.75rem; /* 12/16 */
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    display: block;
    margin-top: -3px;
  }
}
@media screen and (max-width: 768px) {
  section.l-about-stats .l-about-stats__quotes {
    margin-top: 0;
  }
}
@media screen and (max-width: 768px) {
  section.l-about-stats .l-about-stats__quotes .l-grid-2 {
    display: block;
  }
}
@media screen {
  section.l-about-stats .l-about-stats__quotes h2 {
    font-size: 3rem; /* 48/16 */
  }
}
@media screen and (max-width: 768px) {
  section.l-about-stats .l-about-stats__quotes h2 {
    font-size: 1.5rem;
  }
}
@media screen {
  section.l-about-stats .l-about-stats__quotes p {
    font-family: "Bitter", serif;
    font-size: 1.125rem; /* 18/16 */
  }
}
@media screen and (max-width: 768px) {
  section.l-about-stats .l-about-stats__quotes p {
    font-size: 0.9375rem; /* 15/16 */
    margin-top: 15px;
  }
}
@media screen {
  section.l-about-team {
    padding-top: 72px;
    padding-left: 300px;
  }
}
@media screen and (max-width: 992px) {
  section.l-about-team {
    padding-left: 0;
  }
}
@media screen {
  section.l-about-team .c-nav-sidebar--article {
    position: absolute;
    width: 320px !important;
    height: auto;
    top: 150px;
  }
  section.l-about-team .c-nav-sidebar--article .c-global-header__logo, section.l-about-team .c-nav-sidebar--article .c-nav-sidebar__nav-action, section.l-about-team .c-nav-sidebar--article .c-nav-sidebar__title {
    display: none;
  }
  section.l-about-team .c-nav-sidebar--article .c-sidebar-navigator {
    display: block;
  }
}
@media screen {
  section.l-about-team .l-about-team__title {
    font-size: 3rem; /* 48/16 */
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  section.l-about-team .l-about-team__title {
    font-size: 1.75rem;
    text-align: left;
  }
}
@media screen {
  section.l-about-team .o-button--small {
    line-height: 42px !important;
  }
}
@media screen {
  .l-about-team__people .c-content-author {
    display: block;
  }
  .l-about-team__people .c-content-author img {
    min-width: 54px;
    height: 54px;
  }
  .l-about-team__people .c-content-author .c-content-author__title {
    font-size: 1.125rem; /* 18/16 */
    margin-top: 9px;
  }
  .l-about-team__people .c-content-author .c-content-author__description {
    max-height: 87px;
    overflow: hidden;
  }
  .l-about-team__people .c-content-author .c-content-author__description a {
    color: #6E7687;
    text-decoration: none;
  }
}
@media screen {
  section.l-join-team {
    padding: 120px 0;
  }
  section.l-join-team h3 {
    font-size: 1.875rem; /* 30/16 */
  }
}
@media screen and (max-width: 768px) {
  section.l-join-team h3 {
    font-size: 1.5rem;
  }
}
@media screen {
  section.l-join-team p {
    font-family: "Bitter", serif;
    font-size: 1.0625rem; /* 17/16 */
  }
}
@media screen and (max-width: 768px) {
  section.l-join-team p {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .l-library-wrapper {
    max-width: 960px;
    padding: 0 30px;
  }
}
@media screen and (max-width: 1200px) {
  .l-library-wrapper {
    max-width: none;
    padding-right: 130px;
  }
}
@media screen and (max-width: 992px) {
  .l-library-wrapper {
    padding-right: 30px;
  }
}
@media screen {
  .c-library-filters--open .l-library-wrapper {
    max-width: none;
    padding-right: 410px;
    padding-left: 30px;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters--open .l-library-wrapper {
    padding-right: 30px;
  }
}
@media screen {
  .l-library-wrapper.c-library-filters__added .o-tag {
    margin-right: 5px;
  }
}
@media screen {
  .l-contributors-article .l-block-wrapper {
    max-width: 720px;
    padding: 0;
  }
}
@media screen and (max-width: 1280px) {
  .l-contributors-article .l-block-wrapper {
    padding: 0 20px;
  }
}
@media screen and (max-width: 768px) {
  .l-contributors-article .l-block-wrapper {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}
@media screen {
  .l-contributors-article .l-block-wrapper .l-grid-3 {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .l-contributors-article .l-block-wrapper .l-grid-3 {
    grid-template-columns: 1fr;
  }
}
@media screen {
  .l-contributors-article .c-content-author__description {
    font-size: 0.875rem !important; /* 14/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-community-care-article .l-grid-row-gap-40 {
    grid-row-gap: 30px !important;
  }
}
@media screen and (max-width: 768px) {
  .l-community-care-article .c-tutorial-item {
    margin-top: 0 !important;
  }
}
@media screen {
  .l-community-care-article .c-tutorial-item .c-tutorial-item__title {
    font-size: 1.875rem !important; /* 30/16 */
  }
}
@media screen and (max-width: 768px) {
  .l-community-care-article .c-tutorial-item .c-tutorial-item__title {
    font-size: 1.3125rem !important; /* 21/16 */
  }
}
@media screen and (max-width: 992px) {
  .l-community-care-article .c-tutorial--card.c-tutorial--floating-button {
    grid-template-columns: 1fr 1fr !important;
  }
}
@media screen and (max-width: 768px) {
  .l-community-care-article .c-tutorial--card.c-tutorial--floating-button {
    grid-template-columns: 1fr !important;
  }
}
@media screen {
  .l-community-care-article .c-written-tutorial__introduction {
    background: #E2E6F7 !important;
  }
  .l-community-care-article .c-written-tutorial__introduction:before {
    background: #E2E6F7 !important;
  }
}
@media screen {
  .l-community-care-article header .l-block {
    position: relative;
    z-index: 1;
  }
  .l-community-care-article header .c-written-tutorial--event-artwork {
    z-index: 0 !important;
  }
}
@media screen {
  .l-community-care-article .l-community-care-upcoming-events {
    margin-bottom: -26px;
  }
  .l-community-care-article .l-community-care-upcoming-events ul {
    list-style: none;
    padding: 0 !important;
    margin: 0;
  }
  .l-community-care-article .l-community-care-upcoming-events ul li {
    display: flex;
    align-items: center;
    font-size: 1.5rem; /* 24/16 */
    font-family: "Bitter", serif;
    font-weight: 700;
    padding: 15px 0;
    border-bottom: 1px solid #eff3f6;
  }
}
@media screen and (max-width: 768px) {
  .l-community-care-article .l-community-care-upcoming-events ul li {
    font-size: 1.25rem;
  }
}
@media screen {
  .l-community-care-article .l-community-care-upcoming-events ul li:last-child {
    border-bottom: none;
  }
}
@media screen {
  .l-community-care-article .l-community-care-upcoming-events ul li span {
    display: inline-flex;
    background: #158443;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.6875rem; /* 11/16 */
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #ffffff;
    padding: 3px 7px;
    border-radius: 0.5625rem;
    white-space: nowrap;
  }
}
@media screen {
  .l-community-care-article .l-community-care-upcoming-events ul li a {
    color: #333333;
    text-decoration: underline;
    margin-left: 12px;
  }
}
@media screen {
  .l-article-profile {
    display: flex;
    margin-top: 24px;
  }
  .l-article-profile p {
    margin-top: 0 !important;
  }
  .l-article-profile img {
    margin-right: 20px !important;
    min-width: 150px;
    width: 150px;
    height: 150px;
  }
}
@media screen and (max-width: 768px) {
  .l-article-profile img {
    margin-right: 18px !important;
    min-width: 90px;
    width: 90px;
    height: 90px;
  }
}
@media screen {
  .l-menu-interests-dropdown {
    width: 240px;
    right: 0;
    left: auto;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
  }
  .l-menu-interests-dropdown:before {
    left: auto;
    right: 30px;
  }
  .l-menu-interests-dropdown li {
    height: 40px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    margin: 0 !important;
    padding: 0 18px;
  }
}
@media screen and (max-width: 600px) {
  .l-bookmark-button-mobile {
    margin-right: 0;
    margin-left: auto;
  }
  .l-bookmark-button-mobile button {
    background: none;
    padding: 0;
    border-radius: 0;
  }
  .l-bookmark-button-mobile button:hover {
    background: none;
  }
  .l-bookmark-button-mobile button .o-button__label, .l-bookmark-button-mobile button .o-button__loader-text, .l-bookmark-button-mobile button .o-loader-pulse {
    display: none;
  }
  .l-bookmark-button-mobile button i {
    width: 20px;
    height: 20px;
    margin: 0;
    background: none;
    border-radius: 0;
  }
  .l-bookmark-button-mobile button svg {
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
  }
  .l-bookmark-button-mobile .o-button--dark svg {
    fill: #CACED2;
  }
}
@media screen {
  .l-bookmark-button-icon {
    margin-right: 0;
  }
  .l-bookmark-button-icon button {
    background: none;
    padding: 0;
    border-radius: 0;
  }
  .l-bookmark-button-icon button:hover {
    background: none;
  }
  .l-bookmark-button-icon button .o-button__label, .l-bookmark-button-icon button .o-button__loader-text, .l-bookmark-button-icon button .o-loader-pulse {
    display: none;
  }
  .l-bookmark-button-icon button i {
    width: 20px;
    height: 20px;
    margin: 0;
    background: none;
    border-radius: 0;
  }
  .l-bookmark-button-icon button svg {
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
  }
  .l-bookmark-button-icon .o-button--dark svg {
    fill: #CACED2;
  }
}
@media screen {
  .l-bookmark-button-remove .c-tutorial-item__icon {
    display: none !important;
  }
}
@media screen and (max-width: 768px) {
  .l-bookmark-button-remove {
    display: grid;
  }
  .l-bookmark-button-remove > span {
    order: 5;
  }
  .l-bookmark-button-remove > span > a {
    position: relative !important;
    top: 0 !important;
    right: 0 !important;
    left: 18px !important;
    margin-top: 0 !important;
  }
  .l-bookmark-button-remove > a {
    order: 1;
  }
}
@media screen {
  .l-video-rating-footer {
    margin-top: -100px;
    padding-left: 20px;
    padding-right: 20px;
  }
  .l-video-rating-footer .c-add-rating {
    border-top: 1px solid rgb(223, 231, 240);
    max-width: 640px;
    padding-bottom: 120px;
  }
  .l-video-rating-footer .c-add-rating h3 {
    margin-bottom: 12px !important;
  }
}
@media screen {
  .l-article-rating-footer h3 {
    font-size: 1.0625rem !important;
    margin-bottom: 12px !important;
    margin-top: 0 !important;
  }
}
@media screen {
  .l-review-module--collection {
    margin-top: -60px;
  }
  .l-review-module--collection .l-border-bottom-grey-mako {
    border-color: #DFE7F0 !important;
  }
  .l-review-module--collection .l-block > div {
    border-top: 1px solid #DFE7F0;
    padding-top: 24px;
  }
  .l-review-module--collection .c-review-module__illustration + h2 {
    font-size: 1.3125rem; /* 21/16 */
  }
  .l-review-module--collection #current-user-rating > div {
    border: none;
  }
  .l-review-module--collection .c-review-module__answers label {
    background: #ffffff !important;
  }
  .l-review-module--collection .c-review-module__answers > input[type=checkbox]:checked + label {
    background: #158443 !important;
  }
}
@media screen {
  .l-review-module--article {
    margin-bottom: -30px;
  }
  .l-review-module--article .c-paginator {
    margin-bottom: 20px;
  }
  .l-review-module--article #current-user-rating > div {
    border: none;
  }
  .l-review-module--article #current-user-rating > form > .l-border-bottom-grey-mako {
    border-color: #ffffff;
  }
}
@media screen {
  .l-review-module--books {
    border-top: 1px solid #DFE7F0;
    padding-top: 24px;
    margin-top: 60px;
    margin-bottom: -30px;
  }
}
@media screen and (max-width: 600px) {
  .l-review-module--books {
    margin-bottom: 0;
  }
}
@media screen {
  .l-grid-bookshelf-5 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 1080px) {
  .l-grid-bookshelf-5 {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    max-width: 890px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 880px) {
  .l-grid-bookshelf-5 {
    grid-template-columns: 1fr 1fr 1fr;
    max-width: 660px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 550px) {
  .l-grid-bookshelf-5 {
    grid-template-columns: 1fr 1fr;
    max-width: 430px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen {
  .l-grid-new-content {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-row-gap: 30px;
  }
}
@media screen and (max-width: 768px) {
  .l-grid-new-content {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}
@media screen {
  .l-grid-new-content > div {
    display: flex;
    justify-content: center;
  }
}
@media screen {
  .l-prefers-color-scheme--dark {
    background-color: #333333;
    color: #ffffff !important;
    /* ==========================================================================
    1. Global
    ========================================================================== */
    /* ==========================================================================
    2. Skeletons
    ========================================================================== */
    /* ==========================================================================
    3. Authors
    ========================================================================== */
    /* ==========================================================================
    4a. Tutorials
    ========================================================================== */
    /* ==========================================================================
    4b. Platforms
    ========================================================================== */
    /* ==========================================================================
    5. Videos
    ========================================================================== */
    /* ==========================================================================
    5a. Comments
    ========================================================================== */
    /* ==========================================================================
    5c. Bookmarks
    ========================================================================== */
    /* ==========================================================================
    6. Homepage (Logged In)
    ========================================================================== */
    /* ==========================================================================
    7a. Homepage (Logged Out)
    ========================================================================== */
    /* ==========================================================================
    7b. Homepage (Logged Out) Teaspoon
    ========================================================================== */
    /* ==========================================================================
    8. Domains
    ========================================================================== */
    /* ==========================================================================
    9. Library
    ========================================================================== */
    /* ==========================================================================
    10. Paths
    ========================================================================== */
    /* ==========================================================================
    11a. Article
    ========================================================================== */
    /* ==========================================================================
    12. About a
    ========================================================================== */
    /* ==========================================================================
    12a. About b
    ========================================================================== */
    /* ==========================================================================
    13. Onboarding
    ========================================================================== */
    /* ==========================================================================
    14. Testimonials
    ========================================================================== */
    /* ==========================================================================
    15. Ratings
    ========================================================================== */
    /* ==========================================================================
    16. Newsletter
    ========================================================================== */
    /* ==========================================================================
    17. Video Collection Home Custom
    ========================================================================== */
    /* ==========================================================================
    17a. Book Collection Home Custom
    ========================================================================== */
    /* ==========================================================================
    18. FAQ
    ========================================================================== */
    /* ==========================================================================
    19a. Homepage new tutorials
    ========================================================================== */
    /* ==========================================================================
    19b. Homepage upcoming tutorials
    ========================================================================== */
    /* ==========================================================================
    19c. Homepage continue watching
    ========================================================================== */
    /* ==========================================================================
    19d. Homepage getting started
    ========================================================================== */
    /* ==========================================================================
    19e. Homepage recommendations
    ========================================================================== */
    /* ==========================================================================
    19f. Homepage (Recommended for you)
    ========================================================================== */
    /* ==========================================================================
    19g. Homepage (Popular Search)
    ========================================================================== */
    /* ==========================================================================
    19g. Homepage (Topics)
    ========================================================================== */
    /* ==========================================================================
    19h. Homepage (Checklist)
    ========================================================================== */
    /* ==========================================================================
    19i. Homepage (New Content)
    ========================================================================== */
    /* ==========================================================================
    20. Profile
    ========================================================================== */
    /* ==========================================================================
    21a. Book Chapter Navigation
    ========================================================================== */
    /* ==========================================================================
    21b. Book Chapter TOC
    ========================================================================== */
    /* ==========================================================================
    21c. Book Chapter Search
    ========================================================================== */
    /* ==========================================================================
    21d. Book Chapter Notebook & Highlighting
    ========================================================================== */
    /* ==========================================================================
    21e. Book Chapter Highlighting Tooltip
    ========================================================================== */
    /* ==========================================================================
    21e. Book Chapter Highlighting Colors
    ========================================================================== */
    /* ==========================================================================
    21f. Book Reading Experience Switcher
    ========================================================================== */
    /* ==========================================================================
    21g. Book Chapter Misc
    ========================================================================== */
    /* ==========================================================================
    21h. Book Chapter Content
    ========================================================================== */
    /* ==========================================================================
    21i. Book Chapter Mobile Navigation
    ========================================================================== */
    /* ==========================================================================
    22. Book Home
    ========================================================================== */
    /* ==========================================================================
    23. Pagination
    ========================================================================== */
    /* ==========================================================================
    24. Adverts
    ========================================================================== */
    /* ==========================================================================
    25. Sidebars
    ========================================================================== */
    /* ==========================================================================
    26. Mobile Navigator
    ========================================================================== */
    /* ==========================================================================
    27. Empty States
    ========================================================================== */
    /* ==========================================================================
    28. Dropdowns
    ========================================================================== */
    /* ==========================================================================
    29. Modals
    ========================================================================== */
    /* ==========================================================================
    30. Carbon Ads
    ========================================================================== */
    /* ==========================================================================
    31. Achievements
    ========================================================================== */
    /* ==========================================================================
    32. Ratings & Reviews
    ========================================================================== */
    /* ==========================================================================
    33a. Path Progress Card
    ========================================================================== */
    /* ==========================================================================
    33b. Simple Card (Notebooks, messages etc.)
    ========================================================================== */
    /* ==========================================================================
    34. Counters
    ========================================================================== */
    /* ==========================================================================
    35. Checklists (Getting Started etc.)
    ========================================================================== */
    /* ==========================================================================
    36. Checkbox (Toggle)
    ========================================================================== */
    /* ==========================================================================
    37. Progress (HTML)
    ========================================================================== */
    /* ==========================================================================
    38. Upcoming for Subscribers Cards
    ========================================================================== */
  }
  .l-prefers-color-scheme--dark .l-background--card-dark {
    background: #3B4048;
  }
  .l-prefers-color-scheme--dark .l-background--black-dark {
    background: #333333 !important;
  }
  .l-prefers-color-scheme--dark .l-background--grey {
    background: #333333;
  }
  .l-prefers-color-scheme--dark .l-color-grey--dark {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .l-color-white--dark {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .l-color-invert--dark {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .l-color-invert--dark a {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-artwork-invert--dark {
    filter: invert(100%);
  }
  .l-prefers-color-scheme--dark .o-tag {
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-tabs {
    border-bottom: 2px solid #3B4048 !important;
  }
  .l-prefers-color-scheme--dark .o-button--share:hover i {
    background: #73859F !important;
  }
  .l-prefers-color-scheme--dark .o-button--share i {
    background: #434A53;
  }
  .l-prefers-color-scheme--dark .o-screenshot {
    border-color: #434A53;
  }
  .l-prefers-color-scheme--dark .l-border-top-grey--dark {
    border-color: #434A53;
  }
  .l-prefers-color-scheme--dark .l-border-bottom {
    border-color: #434A53;
  }
  .l-prefers-color-scheme--dark .l-border-all-grey--dark {
    border: 3px solid #434A53;
  }
  .l-prefers-color-scheme--dark .l-svg-color-night-grey-chateau {
    fill: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .l-svg-color-night-white {
    fill: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .o-button--green-outline {
    border-color: #ffffff;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .o-button--green-outline svg {
    fill: #ffffff;
  }
  .l-prefers-color-scheme--dark .o-button--light-green-with-outline {
    background: #158443;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .o-button--light-green-with-outline i {
    background: #158443;
  }
  .l-prefers-color-scheme--dark .o-button--light-green-with-outline i svg {
    fill: #ffffff;
  }
  .l-prefers-color-scheme--dark .o-button-round--disabled {
    background: #3B4048;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .o-skeleton__artwork, .l-prefers-color-scheme--dark .o-skeleton__graphic, .l-prefers-color-scheme--dark .o-skeleton__title, .l-prefers-color-scheme--dark .o-skeleton__text, .l-prefers-color-scheme--dark .o-skeleton__button, .l-prefers-color-scheme--dark .o-skeleton-card__title, .l-prefers-color-scheme--dark .o-skeleton-card__text, .l-prefers-color-scheme--dark .o-skeleton-sidebar__meta {
    animation-duration: 0.75s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: #646D7A;
    background: linear-gradient(to right, #3B4048 8%, #485059 18%, #3B4048 33%);
    background-size: 800px 104px !important;
    animation-duration: 1s !important;
  }
  .l-prefers-color-scheme--dark .o-skeleton-card {
    background: #434A53 !important;
  }
  .l-prefers-color-scheme--dark .c-authors .c-content-author .c-content-author__title {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-authors .c-content-author .c-content-author__description {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-authors .c-content-author img {
    border: 4px solid #434A53;
  }
  .l-prefers-color-scheme--dark .c-authors .c-content-author .o-badge {
    background: #434A53 !important;
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item a, .l-prefers-color-scheme--dark .c-tutorial-item > div.c-tutorial-item__wrapper {
    background: #3B4048 !important;
    box-shadow: none;
    padding: 21px;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item a a.c-tutorial-item__overlay, .l-prefers-color-scheme--dark .c-tutorial-item > div.c-tutorial-item__wrapper a.c-tutorial-item__overlay {
    background: none !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .o-button--mark-as-complete .checkbox__input, .l-prefers-color-scheme--dark .c-tutorial-item .o-button--mark-as-complete .checkbox__indicator {
    background: none;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__text .o-badge--soon {
    background: #434A53 !important;
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__category {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__parent {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata-short {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description p, .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description ul, .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description ol {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__platform {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__type {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__continue {
    border-radius: 0.5625rem !important;
    box-shadow: 0 !important;
    border-bottom: 0 !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__art {
    background: none !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial--card .c-tutorial-item a {
    border-bottom: 0 !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial--list .c-tutorial-item a {
    background: #3B4048 !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial--list .c-tutorial-item > div.c-tutorial-item__wrapper a.c-tutorial-item__overlay {
    background: none !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial--white .c-tutorial-item {
    background: #3B4048 !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial--white .c-tutorial-item a {
    background: #3B4048 !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial--book .c-tutorial-item a, .l-prefers-color-scheme--dark .c-tutorial--list-style-basic .c-tutorial-item a, .l-prefers-color-scheme--dark .c-tutorial--list-style-complex .c-tutorial-item a {
    background: none !important;
    box-shadow: none;
    padding: 0;
  }
  .l-prefers-color-scheme--dark .c-tutorial--list-style-basic .c-tutorial-item, .l-prefers-color-scheme--dark .c-tutorial--list-style-complex .c-tutorial-item {
    border-color: #434A53;
  }
}
@media screen and (max-width: 992px) {
  .l-prefers-color-scheme--dark .c-tutorial--list-style-complex .c-tutorial-item {
    padding: 21px;
    background: #3B4048 !important;
    border-radius: 0.5625rem;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-tutorial--list-style-complex .c-tutorial-item .o-badge--pro {
    border-color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-tutorial-item--learning-path .c-tutorial-item__lower a {
    padding: 0;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-card-platform a {
    background-color: #3B4048;
  }
  .l-prefers-color-scheme--dark .c-card-platform a:before {
    filter: invert(100%);
  }
  .l-prefers-color-scheme--dark .c-card-platform a h2 {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-card-platform a p {
    color: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-video-player .c-video-player__sub-controls .l-button-cinema-mode svg {
    fill: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-tutorial-episode:before {
    background: #434A53;
  }
  .l-prefers-color-scheme--dark .c-tutorial-episode h4 a {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-tutorial-episode .o-badge-tutorial {
    border-color: #434A53;
  }
  .l-prefers-color-scheme--dark .c-tutorial-episode p {
    color: #A7ADB4 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-video-information .c-content-author a {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-video-information .c-content-author img {
    border: 4px solid #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-video-player__paywall .c-video-player__paywall-copy p {
    color: #333333;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-video-player__paywall--professional .c-video-player__paywall-copy p {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-video-player__paywall--professional .c-video-player__paywall-copy .l-color-white {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-video-player__paywall-options .c-price-card h4 {
    color: #333333;
  }
}
@media screen and (max-width: 1080px) {
  .l-prefers-color-scheme--dark .c-video-player__paywall-options .c-price-card h4 {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-video-player__paywall-options .c-price-card .c-price-card__price span {
    color: #333333;
  }
}
@media screen and (max-width: 1080px) {
  .l-prefers-color-scheme--dark .c-video-player__paywall-options .c-price-card .c-price-card__price span {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-video-player__paywall-options .c-price-card .c-price-card__period {
    color: #333333;
  }
}
@media screen and (max-width: 1080px) {
  .l-prefers-color-scheme--dark .c-video-player__paywall-options .c-price-card .c-price-card__period {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-video-player__paywall--black-friday-2019 .c-price-card h4, .l-prefers-color-scheme--dark .c-video-player__paywall--black-friday-2019 .c-price-card .c-price-card__price-currency {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-video-player--nav .c-video-player__paywall-options .c-price-card h4 {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-video-player--nav .c-video-player__paywall-options .c-price-card .c-price-card__price span {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-video-player--nav .c-video-player__paywall-options .c-price-card .c-price-card__period {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-forum-comments__load {
    background: #434A53 !important;
  }
  .l-prefers-color-scheme--dark .c-forum-comments__load span {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-forum-comments__load i svg {
    fill: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-link--bookmark-remove {
    color: #158443 !important;
    border-bottom: none !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-follow-pillars {
    background: #3B4048;
    box-shadow: none;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-hero .l-home-hero__video-wrapper .c-tutorial-item a {
    border-radius: 0 0 0 0 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .home-hero {
    box-shadow: none;
  }
  .l-prefers-color-scheme--dark .home-hero .home-hero__action h4, .l-prefers-color-scheme--dark .home-hero .home-hero__action ul {
    color: #333333;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .home-top-tutorials .c-tutorial-item .c-tutorial-item__metadata {
    color: #6E7687 !important;
  }
  .l-prefers-color-scheme--dark .home-top-tutorials .c-tutorial-item .o-progress-indicator {
    background: #434A53 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .home-pattern {
    background-image: none !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-hero-teaspoon .l-home-hero-teaspoon__left:before {
    filter: invert(100%);
  }
}
@media screen and (max-width: 1080px) {
  .l-prefers-color-scheme--dark .l-home-hero-teaspoon .l-home-hero-teaspoon__right p, .l-prefers-color-scheme--dark .l-home-hero-teaspoon .l-home-hero-teaspoon__right ul {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-teaspoon .l-tutorial-collection .c-tutorial-item a {
    background: #3B4048 !important;
  }
  .l-prefers-color-scheme--dark .l-home-teaspoon .l-tutorial-collection .o-button__icon--prev {
    background: #333333;
    background: linear-gradient(90deg, #333333 0%, rgba(51, 51, 51, 0) 100%);
  }
  .l-prefers-color-scheme--dark .l-home-teaspoon .l-tutorial-collection .o-button__icon--next {
    background: white;
    background: linear-gradient(90deg, rgba(51, 51, 51, 0) 0%, #333333 100%);
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-tabs--emphasis {
    border-bottom: none !important;
  }
  .l-prefers-color-scheme--dark .c-tabs--emphasis .c-tabs--active:before {
    display: none;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-tutorial-container--slider .c-tutorial-item a {
    background: none !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-library .c-library-controls div {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .l-library .c-library-controls div svg {
    fill: #ffffff !important;
  }
}
@media screen and (max-width: 768px) {
  .l-prefers-color-scheme--dark .l-library .c-tutorial-item {
    margin-top: 15px !important;
    border: 0 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-library .c-library-filters__added .o-tag {
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-library .c-library-filters__added .o-tag svg {
    fill: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-popular-paths .c-tutorial-item {
    background: #3B4048 !important;
  }
}
@media screen and (max-width: 768px) {
  .l-prefers-color-scheme--dark .l-popular-paths .c-tutorial-item {
    border: 0;
    background: none !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-popular-paths .c-tutorial-item a {
    border: 0;
    padding: 0;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-popular-paths .c-tutorial-item .c-tutorial-item__art {
    background: none;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-popular-paths .c-tutorial-item .o-button {
    background: #158443 !important;
    border-radius: 0.5625rem !important;
    padding: 21px 21px 21px 0 !important;
  }
  .l-prefers-color-scheme--dark .l-popular-paths .c-tutorial-item .o-button svg {
    fill: #158443 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-popular-paths .c-tutorial-item .o-button--center {
    padding: 21px 21px 21px 21px !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-popular-paths .c-tutorial-item .o-progress-indicator {
    background: rgba(0, 0, 0, 0.125);
  }
}
@media screen {
  .l-prefers-color-scheme--dark .learning-path-list .c-tutorial-item:before {
    background: #434A53 !important;
  }
  .l-prefers-color-scheme--dark .learning-path-list .c-tutorial-item .c-tutorial-item__icon {
    display: none;
  }
  .l-prefers-color-scheme--dark .learning-path-list .c-tutorial-item .o-badge-tutorial {
    border-color: #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark article.c-written-tutorial {
    color: #ffffff;
    background-color: #333333;
  }
}
@media screen and (max-width: 768px) {
  .l-prefers-color-scheme--dark article.c-written-tutorial header .c-written-tutorial__introduction {
    background: #333333;
  }
}
@media screen {
  .l-prefers-color-scheme--dark article.c-written-tutorial header .c-written-tutorial__breadcrumbs {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial header .c-written-tutorial__breadcrumbs a {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial header .c-written-tutorial__breadcrumbs .l-svg-breadcrumb {
    fill: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-content-author img {
    border: 4px solid #434A53;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-content-author .c-content-author__title a {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-content-author .c-content-author__description {
    color: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark article.c-written-tutorial h1 {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content > h1, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content > h2, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content > h3, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content > h4, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content > h5 {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content p h1, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content p h2, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content p h3, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content p h4, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content p h5 {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content ul h1, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content ul h2, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content ul h3, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content ul h4, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content ul h5, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content ol h1, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content ol h2, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content ol h3, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content ol h4, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content ol h5 {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content a {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content .note h1, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content .note h2, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content .note h3, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content .note h4, .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content .note h5 {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content .c-spoiler__answer {
    background: #434A53 !important;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-written-tutorial__content .c-draper-obfuscate-nudge .l-obfuscated-text {
    background: #AB5050;
  }
}
@media screen {
  .l-prefers-color-scheme--dark article.c-written-tutorial code {
    color: #ffffff !important;
    background: #3B4048 !important;
    border: 1px solid #73859F !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark article.c-written-tutorial pre {
    border: 1px solid #73859F;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial pre code {
    background: transparent !important;
    border: none !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark article.c-written-tutorial .note {
    background: #434A53 !important;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial .note a {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark article.c-written-tutorial .bordered {
    border-color: #434A53 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-box-list__item {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-box-list__item--active {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial .c-box-list__item--active:before {
    background-image: url(/assets/svg-icons/chevron--white-5b5a863a30ba18e88b6250dd9ae968438a95342be885d585ee66ba9b73a1cfc8.png) !important;
    background-size: cover;
  }
}
@media screen {
  .l-prefers-color-scheme--dark article.c-written-tutorial--event header h1, .l-prefers-color-scheme--dark article.c-written-tutorial--event header p {
    color: #333333 !important;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial--event header.c-written-tutorial--event-header .c-written-tutorial__introduction {
    background: #333333 !important;
    z-index: 1;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial--event header.c-written-tutorial--event-header .c-written-tutorial__introduction:before {
    background: #333333 !important;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial--event header.c-written-tutorial--event-header .c-written-tutorial__introduction h1, .l-prefers-color-scheme--dark article.c-written-tutorial--event header.c-written-tutorial--event-header .c-written-tutorial__introduction p {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark article.c-written-tutorial--event header.c-written-tutorial--event-header .c-written-tutorial--event-artwork {
    z-index: 0;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-community-care-article.c-written-tutorial--event header {
    background: #333333 !important;
  }
  .l-prefers-color-scheme--dark .l-community-care-article.c-written-tutorial--event header h1, .l-prefers-color-scheme--dark .l-community-care-article.c-written-tutorial--event header p {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-community-care-upcoming-events li {
    border-color: #434A53 !important;
  }
  .l-prefers-color-scheme--dark .l-community-care-upcoming-events li a {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-about-team .c-content-author a {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-about-team .c-content-author .c-content-author__description {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .l-about-team .c-content-author .c-content-author__description a {
    color: #A7ADB4;
    text-decoration: underline;
  }
  .l-prefers-color-scheme--dark .l-about-team .c-content-author img {
    border: 4px solid #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-nav-sidebar--white .c-sidebar-navigator .c-sidebar-navigator__indicator {
    background: none;
    border: 2px solid #434A53;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--white .c-sidebar-navigator .c-sidebar-navigator__indicator:before {
    background: #434A53;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--white .c-sidebar-navigator .c-sidebar-navigator__indicator:after {
    background: #434A53;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--white .c-sidebar-navigator .c-sidebar-navigator__title {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-onboarding-plans .c-plan {
    color: #333333;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-onboarding-progress .c-onboarding-progress__bar {
    background: #434A53 !important;
  }
  .l-prefers-color-scheme--dark .c-onboarding-progress .c-onboarding-progress__bar--complete {
    background: #158443 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-onboarding-interests .c-card-category .c-card-category__text-title {
    color: #333333;
  }
}
@media screen and (max-width: 768px) {
  .l-prefers-color-scheme--dark .l-onboarding-interests .c-card-category {
    border-bottom: 1px solid #434A53;
  }
  .l-prefers-color-scheme--dark .l-onboarding-interests .c-card-category .c-card-category__text-title {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-onboarding-skill .c-card-choice .c-card-choice__title {
    color: #333333;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-testimonial:before {
    display: none;
  }
  .l-prefers-color-scheme--dark .c-testimonial img {
    border: 4px solid #434A53 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-content-author--card {
    background: none;
  }
  .l-prefers-color-scheme--dark .c-content-author--card img {
    border: 4px solid #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-testimonial--twitter {
    background: #3B4048;
  }
  .l-prefers-color-scheme--dark .c-testimonial--twitter p, .l-prefers-color-scheme--dark .c-testimonial--twitter .c-testimonial__date, .l-prefers-color-scheme--dark .c-testimonial--twitter .c-testimonial__twitter {
    color: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-written-tutorial__introduction .rating {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__introduction .l-button__svg-empty-star {
    fill: #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-article-rating-footer {
    border-top: 1px solid #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-video-rating-footer .c-add-rating {
    border-top: 1px solid #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-article-rating-footer h3, .l-prefers-color-scheme--dark .l-video-rating-footer h3 {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .l-article-rating-footer a, .l-prefers-color-scheme--dark .l-article-rating-footer .l-color-grey-regent, .l-prefers-color-scheme--dark .l-video-rating-footer a, .l-prefers-color-scheme--dark .l-video-rating-footer .l-color-grey-regent {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .l-article-rating-footer .c-rate__star, .l-prefers-color-scheme--dark .l-video-rating-footer .c-rate__star {
    background: #434A53;
  }
  .l-prefers-color-scheme--dark .l-article-rating-footer .c-rate__star--green, .l-prefers-color-scheme--dark .l-video-rating-footer .c-rate__star--green {
    background: #158443;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-newsletter-hero .o-input--larger {
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-newsletter-hero .o-input--larger::placeholder {
    color: #959DA5;
  }
  .l-prefers-color-scheme--dark .l-newsletter-hero .o-tooltip {
    display: none;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-newsletter-article {
    border-top: 1px solid #434A53;
  }
  .l-prefers-color-scheme--dark .l-newsletter-article h4 {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .l-newsletter-article p {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-newsletter-article .l-color-grey {
    color: #A7ADB4 !important;
  }
}
@media screen and (max-width: 768px) {
  .l-prefers-color-scheme--dark .l-newsletter-article .o-button__svg--green {
    fill: #333333;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-newsletter-article .o-input--larger {
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-newsletter-article .o-input--larger::placeholder {
    color: #959DA5;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-collection-introduction__copy h2 {
    color: #333333;
  }
  .l-prefers-color-scheme--dark .l-collection-introduction__copy p {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-collection-pitch-cards h2 {
    color: #333333;
  }
  .l-prefers-color-scheme--dark .l-collection-pitch-cards .c-card-pitch {
    background: none;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-collection-modules__pitch-cards p {
    color: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-book-hero .rating {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .l-book-hero .rating .l-button__svg-empty-star {
    fill: #434A53;
  }
  .l-prefers-color-scheme--dark .l-book-hero .c-box-list--black li {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-book-hero .c-box-list--black li:before {
    background-image: url(/assets/svg-icons/chevron--white-5b5a863a30ba18e88b6250dd9ae968438a95342be885d585ee66ba9b73a1cfc8.png) !important;
    background-size: cover;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-faq ul {
    color: #6E7687;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-section-border-padding {
    padding-top: 0;
    border-top: 0;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-section-border-padding-bottom {
    padding-bottom: 0;
    border-bottom: 0;
    margin-bottom: 0;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-upcoming .c-tutorial-item__title {
    opacity: 0.5;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-continue-watching .c-tutorial-item a {
    border-bottom: 0;
  }
  .l-prefers-color-scheme--dark .l-home-continue-watching .c-tutorial-item a .c-tutorial-item__text {
    padding-bottom: 0;
  }
  .l-prefers-color-scheme--dark .l-home-continue-watching .c-tutorial-item a .c-tutorial-item__text .c-tutorial-item__metadata {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-getting-started .c-tutorial-item a {
    padding-top: 170px;
    padding-left: 0;
    padding-bottom: 0;
    padding-right: 0;
    border-bottom: none;
  }
  .l-prefers-color-scheme--dark .l-home-getting-started .c-tutorial-item a:before {
    filter: invert(100%);
  }
  .l-prefers-color-scheme--dark .l-home-getting-started .c-tutorial-item a .c-tutorial-item__abstract {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .l-home-getting-started .c-tutorial-item--onboarding-video a {
    padding-top: 0;
  }
  .l-prefers-color-scheme--dark .l-home-getting-started .c-tutorial-item--onboarding-video .c-tutorial-item__video-player:after {
    filter: invert(100%);
  }
  .l-prefers-color-scheme--dark .l-home-getting-started .c-tutorial-item--onboarding-video .c-tutorial-item__video-player:before {
    background: #3B4048;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-recommendations .o-tooltip {
    background: #ffffff !important;
    color: #333333 !important;
  }
  .l-prefers-color-scheme--dark .l-home-recommendations .o-tooltip:after {
    background: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-recommended .c-tabs .c-tabs--active button {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-home-recommended .c-tabs .c-tabs--active:before {
    background-color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-home-recommended .c-tutorial-item--onboarding-video .c-tutorial-item__video-player:after {
    filter: invert(100%);
  }
  .l-prefers-color-scheme--dark .l-home-recommended .c-tutorial--featured .c-tutorial-item a {
    padding: 0;
  }
  .l-prefers-color-scheme--dark .l-home-recommended .c-tutorial--featured .c-tutorial-item a .c-tutorial-item__abstract {
    color: #A7ADB4 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-popular-search .c-global-search {
    background-color: #333333;
  }
  .l-prefers-color-scheme--dark .l-home-popular-search .c-global-search .o-input {
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-home-popular-search .c-global-search .o-input::placeholder {
    color: #959DA5;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-topics .l-background--white {
    background-color: #3B4048;
  }
  .l-prefers-color-scheme--dark .l-home-topics .o-tag--grey-mini {
    background-color: #333333;
    border: none;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-home-checklist .l-background--white {
    background-color: #3B4048;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-grid-new-content .c-tabs .c-tabs--active button {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .l-grid-new-content .c-tabs .c-tabs--active:before {
    background-color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-profile__bio-description {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .c-profile__bio-description a {
    color: #A7ADB4;
    text-decoration: underline;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-book-header {
    background: #333333 !important;
  }
  .l-prefers-color-scheme--dark .c-book-header .o-button__svg--grey-regent {
    fill: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-book-header .l-button__svg-toc-icon-nav {
    stroke: #333333;
  }
  .l-prefers-color-scheme--dark .c-book-header > nav ul li {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-book-header .o-tooltip {
    background: #3B4048;
  }
  .l-prefers-color-scheme--dark .c-book-header .o-tooltip:after {
    background: #3B4048;
  }
  .l-prefers-color-scheme--dark .c-book-header .login-link {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-nav-sidebar--book {
    background: #222222;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-nav-sidebar__wrapper {
    background: #222222;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-video-player__lessons-section {
    border-color: #434A53 !important;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-video-player__lessons {
    background: #222222;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-video-player__lessons-header svg {
    fill: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-video-player__lessons-title, .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-box-list__item-title {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-video-player__lessons-title a, .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-box-list__item-title a {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .l-color-grey, .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-video-player__lessons-sum, .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-sidebar-navigator__title {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-box-list li:before {
    background: transparent;
    border-color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-box-list li > a {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-box-list li > a:hover {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-box-list__item--active:before {
    background-image: url(/assets/svg-icons/chevron--white-5b5a863a30ba18e88b6250dd9ae968438a95342be885d585ee66ba9b73a1cfc8.png) !important;
    background-size: cover !important;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-box-list__item--complete a {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-box-list__item--complete:before {
    background: #158443 !important;
    background-image: url(/assets/svg-icons/checkmark-c892a399ec5e7c73a6cac886b1baac93a78bf5eab341469fd7de45c61c674ec0.png) !important;
    background-size: cover !important;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-box-list__item--complete + .c-sidebar-navigator:before {
    opacity: 1;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-box-list .c-box-list__item--locked:before {
    background-image: url(/assets/svg-icons/padlock-422049d82c4fd85a56375c162d817aea257aaa413a0445d8a84b3e94cb97d0c0.png) !important;
    background-size: cover;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--book .c-sidebar-navigator:before {
    background: #585E66;
    opacity: 0.5;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-global-search--book {
    background: #333333;
  }
  .l-prefers-color-scheme--dark .c-global-search--book .l-color-grey {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-global-search--book .o-input {
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-global-search--book .o-input::placeholder {
    color: #959DA5;
  }
  .l-prefers-color-scheme--dark .c-global-search--book .c-global-search__recommendations h3 {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-global-search--book .c-global-search__recommendations ul li {
    border-bottom: 1px solid #434A53;
    padding: 15px 0;
  }
  .l-prefers-color-scheme--dark .c-global-search--book .c-global-search__recommendations ul li a {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-global-search--book .c-global-search__recommendations ul li a:hover {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-global-search--book .c-global-search__recommendations ul li p {
    font-size: 0.9375rem; /* 15/16 */
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-global-search--book .c-global-search__recommendations ul li .c-search__results--highlight {
    background: transparent;
    font-weight: 700;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-global-search--book .c-paginator {
    border-color: #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-notebook {
    background: #222222;
    border: 0;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__artwork {
    filter: invert(100%);
  }
  .l-prefers-color-scheme--dark .c-notebook .l-color-grey {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .c-notebook .o-button__svg--grey {
    fill: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__demo p mark {
    color: #ffffff;
    background: #AB5050;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry {
    border-color: #434A53;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry a, .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry mark {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry h4, .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry .c-notebook__entry-text {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry .c-notebook__action {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry .o-textarea {
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry .o-textarea::placeholder {
    color: #959DA5;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry .c-notebook__entry-note span {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry.c-notebook__entry--yellow:before {
    background: #D6C256;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry.c-notebook__entry--orange:before {
    background: #C97228;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry.c-notebook__entry--red:before {
    background: #AB5050;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry.c-notebook__entry--purple:before {
    background: #9157AD;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry.c-notebook__entry--blue:before {
    background: #5E70CC;
  }
  .l-prefers-color-scheme--dark .c-notebook .c-notebook__entry.c-notebook__entry--green:before {
    background: #549954;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-fragment--tooltip {
    background: #3B4048 !important;
    box-shadow: 4px 4px 30px rgba(0, 0, 0, 0.3);
  }
  .l-prefers-color-scheme--dark .o-fragment--tooltip:after {
    background: #3B4048 !important;
  }
  .l-prefers-color-scheme--dark .o-fragment--tooltip .o-tooltip__color--yellow {
    background: #D6C256;
  }
  .l-prefers-color-scheme--dark .o-fragment--tooltip .o-tooltip__color--orange {
    background: #C97228;
  }
  .l-prefers-color-scheme--dark .o-fragment--tooltip .o-tooltip__color--red {
    background: #AB5050;
  }
  .l-prefers-color-scheme--dark .o-fragment--tooltip .o-tooltip__color--purple {
    background: #9157AD;
  }
  .l-prefers-color-scheme--dark .o-fragment--tooltip .o-tooltip__color--blue {
    background: #5E70CC;
  }
  .l-prefers-color-scheme--dark .o-fragment--tooltip .o-tooltip__color--green {
    background: #549954;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-button__svg--highlighter-yellow {
    fill: #D6C256;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-button__svg--highlighter-orange {
    fill: #C97228;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-button__svg--highlighter-red {
    fill: #AB5050;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-button__svg--highlighter-purple {
    fill: #9157AD;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-button__svg--highlighter-blue {
    fill: #5E70CC;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-button__svg--highlighter-green {
    fill: #549954;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-fragment--tooltip-with-note {
    background: #3B4048 !important;
    border: 2px solid #73859F !important;
  }
  .l-prefers-color-scheme--dark .o-fragment--tooltip-with-note textarea {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .o-fragment--tooltip-with-note textarea::placeholder {
    color: #959DA5 !important;
  }
  .l-prefers-color-scheme--dark .o-fragment--tooltip-with-note .o-fragment__action {
    color: #A7ADB4 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-fragment mark {
    color: #ffffff;
    background-color: #8A7400;
  }
}
@media screen {
  .l-prefers-color-scheme--dark mark.o-fragment--highlighter-yellow {
    background: #8A7400;
  }
  .l-prefers-color-scheme--dark mark.o-fragment--highlighter-yellow.o-fragment--annotation-note {
    border-bottom: 3px solid #EBC700;
  }
}
@media screen {
  .l-prefers-color-scheme--dark mark.o-fragment--highlighter-orange {
    background: #B05000;
  }
  .l-prefers-color-scheme--dark mark.o-fragment--highlighter-orange.o-fragment--annotation-note {
    border-bottom: 3px solid #F99A0C;
  }
}
@media screen {
  .l-prefers-color-scheme--dark mark.o-fragment--highlighter-red {
    background: #783838;
  }
  .l-prefers-color-scheme--dark mark.o-fragment--highlighter-red.o-fragment--annotation-note {
    border-bottom: 3px solid #E58A8A;
  }
}
@media screen {
  .l-prefers-color-scheme--dark mark.o-fragment--highlighter-purple {
    background: #5F2878;
  }
  .l-prefers-color-scheme--dark mark.o-fragment--highlighter-purple.o-fragment--annotation-note {
    border-bottom: 3px solid #A0AEF2;
  }
}
@media screen {
  .l-prefers-color-scheme--dark mark.o-fragment--highlighter-blue {
    background: #1D35B2;
  }
  .l-prefers-color-scheme--dark mark.o-fragment--highlighter-blue.o-fragment--annotation-note {
    border-bottom: 3px solid #5BD1E1;
  }
}
@media screen {
  .l-prefers-color-scheme--dark mark.o-fragment--highlighter-green {
    background: #3A5F3A;
  }
  .l-prefers-color-scheme--dark mark.o-fragment--highlighter-green.o-fragment--annotation-note {
    border-bottom: 3px solid #90DE9C;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-reading-experience-selector {
    background: #222222;
    border: 0;
  }
  .l-prefers-color-scheme--dark .c-reading-experience-selector h4 {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-reading-experience-selector .o-button__svg--grey-regent {
    fill: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-reading-experience-selector .c-reading-experience-selector__checkbox--large {
    background: #3B4048;
    border: 2px solid #73859F;
  }
  .l-prefers-color-scheme--dark .c-reading-experience-selector .c-reading-experience-selector__checkbox--large label {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-reading-experience-selector .c-reading-experience-selector__range::-webkit-slider-runnable-track {
    background: #73859F;
  }
  .l-prefers-color-scheme--dark .c-reading-experience-selector .c-reading-experience-selector__range:focus::-webkit-slider-runnable-track {
    background: #73859F;
  }
  .l-prefers-color-scheme--dark .c-reading-experience-selector .c-reading-experience-selector__range::-moz-range-track {
    background: #73859F;
  }
  .l-prefers-color-scheme--dark .c-reading-experience-selector .c-reading-experience-selector__range::-ms-track {
    background: #73859F;
  }
  .l-prefers-color-scheme--dark .c-reading-experience-selector .c-reading-experience-selector__range::-webkit-slider-thumb {
    border: 0;
  }
  .l-prefers-color-scheme--dark .c-reading-experience-selector .c-reading-experience-selector__range::-moz-range-thumb {
    border: 0;
  }
  .l-prefers-color-scheme--dark .c-reading-experience-selector .c-reading-experience-selector__range::-ms-thumb {
    border: 0;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-book-chapter__links a {
    border-color: #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-book-chapter-end-message {
    border-color: #434A53;
  }
  .l-prefers-color-scheme--dark .l-book-chapter-end-message p {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .l-book-chapter-end-message p a {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .l-book-chapter-end-message textarea, .l-prefers-color-scheme--dark .l-book-chapter-end-message input {
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-book-chapter-end-message textarea::placeholder, .l-prefers-color-scheme--dark .l-book-chapter-end-message input::placeholder {
    color: #A7ADB4 !important;
    opacity: 0.75 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-book-chapter .c-modal .c-modal__description p {
    color: #6E7687 !important;
  }
  .l-prefers-color-scheme--dark .c-book-chapter .o-button-chapter {
    background: #3B4048;
  }
}
@media screen and (max-width: 600px) {
  .l-prefers-color-scheme--dark .c-book-chapter .c-written-tutorial__introduction {
    background: #333333 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-book-chapter .l-written-tutorial--light pre code {
    color: #333333;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-book-chapter .c-book-chapter__links {
    border-color: #434A53;
  }
  .l-prefers-color-scheme--dark .c-book-chapter .c-book-chapter__links a {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-book-chapter .c-book-chapter__links a:hover {
    background: #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-book-chapter h1, .l-prefers-color-scheme--dark .c-book-chapter h2, .l-prefers-color-scheme--dark .c-book-chapter h3, .l-prefers-color-scheme--dark .c-book-chapter h4, .l-prefers-color-scheme--dark .c-book-chapter h5, .l-prefers-color-scheme--dark .c-book-chapter p, .l-prefers-color-scheme--dark .c-book-chapter ol, .l-prefers-color-scheme--dark .c-book-chapter ul {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-book-chapter pre {
    border: 1px solid #73859F !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-book-chapter code {
    color: #ffffff;
    background: #3B4048 !important;
    border: 1px solid #73859F !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-book-chapter blockquote {
    background: #434A53 !important;
  }
  .l-prefers-color-scheme--dark .c-book-chapter blockquote a {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-book-chapter figcaption {
    color: #A7ADB4 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-book-chapter .l-image-bordered img {
    border-color: #434A53 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-written-tutorial--light pre {
    border: 1px solid #ffffff !important;
    background: #F2F6FA !important;
    color: #333333 !important;
  }
  .l-prefers-color-scheme--dark .l-written-tutorial--light pre code {
    color: #333333 !important;
  }
  .l-prefers-color-scheme--dark .l-written-tutorial--light .o-button-code {
    background-image: url(/assets/svg-icons/dark-359a27a4dca640e91c3d0d4c9b9457249d797e2ca85026f6d84a81d5e8657756.png);
    background-size: cover;
  }
  .l-prefers-color-scheme--dark .l-written-tutorial--light .o-button-code:hover {
    background: #647388;
    background-image: url(/assets/svg-icons/dark-359a27a4dca640e91c3d0d4c9b9457249d797e2ca85026f6d84a81d5e8657756.png);
    background-size: cover;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-mobile-navigator--book {
    background: #222222;
  }
  .l-prefers-color-scheme--dark .c-mobile-navigator--book .o-button__svg--grey-regent {
    fill: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-mobile-navigator--book .l-button__svg-toc-icon-nav {
    stroke: #222222;
  }
  .l-prefers-color-scheme--dark .c-mobile-navigator--book a:hover {
    background: #3B4048 !important;
  }
}
@media screen and (max-width: 768px) {
  .l-prefers-color-scheme--dark .l-book-sales-right {
    background: #222222;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-book-sales-right .o-badge--pro {
    border-color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-book-sales-right .o-button-close svg {
    fill: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-book-sales-right .l-button-book-meta-open svg {
    fill: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-book-sales-right .l-button-book-meta-open span {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-book-sales-right a.rating span {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-book-sales-right a.rating .l-button__svg-empty-star {
    fill: #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-book-sales-right--show .l-no-border {
    border-bottom: 1px solid #434A53 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-book-sales-cta {
    border-bottom: 1px solid #434A53;
  }
  .l-prefers-color-scheme--dark .l-book-sales-cta .l-color-green, .l-prefers-color-scheme--dark .l-book-sales-cta .o-text-button--green {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .l-book-sales-cta .o-text-button svg {
    fill: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-book-sales-copy p, .l-prefers-color-scheme--dark .l-book-sales-copy ul, .l-prefers-color-scheme--dark .l-book-sales-copy ol {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .l-book-sales-copy a {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-book-contributors img {
    border: none;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-version-history-table .c-version-history-table__row {
    border-bottom: 1px solid #434A53;
  }
  .l-prefers-color-scheme--dark .c-version-history-table .c-version-history-table__meta {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-version-history-table .c-version-history-table__links a {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-book-toc .l-book-toc-section-description:before {
    background: #434A53;
  }
  .l-prefers-color-scheme--dark .l-book-toc .l-book-toc-section-description p, .l-prefers-color-scheme--dark .l-book-toc .l-book-toc-section-description ul, .l-prefers-color-scheme--dark .l-book-toc .l-book-toc-section-description ol {
    color: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-paginator a {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-paginator a:hover {
    background: #434A53;
  }
  .l-prefers-color-scheme--dark .c-paginator a svg {
    fill: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-paginator--no-hover a:hover {
    background: none;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-banner-draper-sticky--obfuscate {
    background: #222222;
  }
  .l-prefers-color-scheme--dark .c-banner-draper-sticky--obfuscate p {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-banner-draper-sticky--obfuscate img {
    filter: invert(100%);
  }
  .l-prefers-color-scheme--dark .c-banner-draper-sticky--obfuscate .l-obfuscated-text {
    background: #AB5050;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-bookshelf-book a {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-bookshelf-book .c-bookshelf-book__description {
    color: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-banner-draper--community {
    background-color: #333333 !important;
    color: white;
  }
  .l-prefers-color-scheme--dark .c-banner-draper--community:before {
    filter: invert(100%);
  }
  .l-prefers-color-scheme--dark .c-banner-draper--community .c-banner-draper__art:before {
    opacity: 0.1;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-banner-draper--community-width + div .l-color-invert--dark {
    color: #A7ADB4 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-banner-draper--community-connect .c-banner-draper__art--left {
    background-image: url(/assets/artwork/community-connect-left--dark-d188b7bd4185599663b17c1ecdcd8595b5b689fc1357c89b7460ab638417a4c2.png);
    background-size: 100%;
    background-repeat: no-repeat;
  }
  .l-prefers-color-scheme--dark .c-banner-draper--community-connect .c-banner-draper__art--right {
    background-image: url(/assets/artwork/community-connect-right--dark-df53d5871133c3f43c52673105e9a0772f5590bc0da5de2209ae52bf23900d7d.png);
    background-size: 100%;
    background-repeat: no-repeat;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-banner-draper--community-resources .c-banner-draper__art--left {
    background-image: url(/assets/artwork/community-people-left--dark-56d19ee88d857675cc159ce5d9180b6051607aa104e333a9100dab7b5f7901b0.png);
    background-size: 100%;
    background-repeat: no-repeat;
  }
  .l-prefers-color-scheme--dark .c-banner-draper--community-resources .c-banner-draper__art--right {
    background-image: url(/assets/artwork/community-people-right--dark-3d80de63d6da52637150422392d46502420957cfa5843f6dc457e3389178924a.png);
    background-size: 100%;
    background-repeat: no-repeat;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode {
    background: #222222;
  }
}
@media screen and (max-width: 992px) {
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode {
    background: #222222;
  }
}
@media screen and (max-width: 992px) {
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode .c-nav-sidebar__wrapper {
    background: #222222;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode .c-nav-sidebar__nav-action {
    border-color: #434A53;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode .c-nav-sidebar__nav-action .o-button__icon--black {
    background: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode .c-nav-sidebar__nav-action .o-button__icon--black svg {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode .c-nav-sidebar__nav-action .l-color-black {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode .c-nav-sidebar__section:before {
    background-color: #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode .c-nav-sidebar__title {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode .c-sidebar-navigator li a .c-sidebar-navigator__indicator {
    border-color: #434A53;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode .c-sidebar-navigator li a .c-sidebar-navigator__indicator:after {
    background: #434A53 !important;
  }
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode .c-sidebar-navigator li a .c-sidebar-navigator__title {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-nav-sidebar--night-mode .o-checkbox .checkbox__indicator {
    background: none;
    border: 2px solid rgba(115, 133, 159, 0.75);
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-mobile-navigator {
    background: #222222;
  }
  .l-prefers-color-scheme--dark .c-mobile-navigator a:hover {
    background: #3B4048 !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-empty-state--message p {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-empty-state--message img {
    filter: invert(100%);
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-dropdown-menu--dark {
    background: #222222;
  }
  .l-prefers-color-scheme--dark .o-dropdown-menu--dark:before {
    background: #222222;
  }
  .l-prefers-color-scheme--dark .o-dropdown-menu--dark .o-checkbox .checkbox__indicator {
    background: none;
    border: 2px solid rgba(115, 133, 159, 0.75);
  }
  .l-prefers-color-scheme--dark .o-dropdown-menu--dark a {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .o-dropdown-menu--dark a:hover {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-dropdown-menu--expanded {
    background: #222222;
  }
}
@media screen and (max-width: 768px) {
  .l-prefers-color-scheme--dark .c-dropdown-menu--expanded {
    background: transparent;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-dropdown-menu--expanded .c-dropdown-menu__lower {
    background: #1a1a1a;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-modal--video-tutorial .c-modal__title {
    color: #333333;
  }
  .l-prefers-color-scheme--dark .c-modal--video-tutorial .c-modal__description a {
    background: none !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark #l-carbon-sidebar-ad .carbon-wrap a {
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-achievements-grid > div span:first-of-type {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .l-achievements-grid > div span:last-of-type {
    color: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-notification-badge {
    background: #222222;
    box-shadow: none;
  }
  .l-prefers-color-scheme--dark .c-notification-badge .c-notification-badge__close:hover {
    background: #333333;
  }
  .l-prefers-color-scheme--dark .c-notification-badge .c-notification-badge__close svg {
    fill: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-notification-badge p {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-notification-badge a {
    color: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-rating-count span {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-rating-count a {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-rating-count .l-button__svg-empty-star {
    fill: #CACED2;
    opacity: 0.5;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-rating-count--empty a {
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-review-module__errors span {
    color: #ffffff;
    padding: 3px 6px;
    background: #CF3B2B;
    border-radius: 3px;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-review-module--invert .l-border-bottom-grey-mako {
    border-bottom: 1px solid #434A53;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .l-color-grey-chateau {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .o-textarea--dark {
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .o-textarea--dark:focus {
    background: rgba(29, 131, 209, 0.05);
    border: 2px solid #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .c-review-module__main-header-controls span {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .c-review-module__main-header-controls a {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .c-review-module__main-header-stars .l-button__svg-empty-star {
    opacity: 0.5 !important;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .c-user-review {
    background-color: #3B4048;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .c-user-review__bottom .l-button__svg-empty-star {
    opacity: 0.5 !important;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .c-user-review__date {
    color: #A7ADB4 !important;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .c-review-module__illustration {
    background-image: url(/assets/artwork/illustration-ratings-dark-cc5317ff51fd0e2e97cacd02ae7952386f9716f375f4cbd8cc0add529554e1d9.svg) !important;
    background-size: cover;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .c-review-module__answers > input[type=checkbox]:hover + label {
    background: #363b42;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .c-review-module__answers > input[type=checkbox]:checked + label {
    background: #158443;
    border-color: #00FF6A;
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-review-module--invert .c-review-module__answers label {
    background: #3B4048;
    border: 2px solid #3B4048;
    color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-review-module--collection .l-border-bottom-grey-mako {
    border-color: #434A53 !important;
  }
  .l-prefers-color-scheme--dark .l-review-module--collection .l-block > div {
    border-top: 1px solid #434A53;
  }
  .l-prefers-color-scheme--dark .l-review-module--collection .c-review-module__answers > input[type=checkbox]:hover + label {
    background: #363b42 !important;
  }
  .l-prefers-color-scheme--dark .l-review-module--collection .c-review-module__answers > input[type=checkbox]:checked + label {
    background: #158443 !important;
    border-color: #00FF6A !important;
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .l-review-module--collection .c-review-module__answers label {
    background: #3B4048 !important;
    border: 2px solid #3B4048 !important;
    color: #ffffff !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-review-module--article {
    margin-bottom: -30px;
  }
  .l-prefers-color-scheme--dark .l-review-module--article .c-paginator {
    margin-bottom: 20px;
  }
  .l-prefers-color-scheme--dark .l-review-module--article #current-user-rating > div {
    border-bottom: 1px solid #434A53;
    margin-bottom: 20px;
  }
  .l-prefers-color-scheme--dark .l-review-module--article #current-user-rating > form {
    margin-bottom: 20px;
  }
  .l-prefers-color-scheme--dark .l-review-module--article #current-user-rating > form > .l-border-bottom-grey-mako {
    border-color: #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .l-review-module--books {
    border-color: #434A53;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-card-path-progress {
    background-color: #3B4048;
  }
  .l-prefers-color-scheme--dark .c-card-path-progress .c-card-path-progress__center .c-card-path-progress__desc, .l-prefers-color-scheme--dark .c-card-path-progress .c-card-path-progress__center .c-card-path-progress__syllabus {
    color: #A7ADB4;
  }
  .l-prefers-color-scheme--dark .c-card-path-progress .c-card-path-progress__center .c-box-list:before {
    background: linear-gradient(0deg, #3B4048 0%, rgba(55, 55, 55, 0) 100%);
  }
  .l-prefers-color-scheme--dark .c-card-path-progress .c-card-path-progress__center .c-box-list li a > span {
    color: #ffffff !important;
  }
  .l-prefers-color-scheme--dark .c-card-path-progress .c-card-path-progress__right .o-circular--progress .o-circular-progress--label {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-card-path-progress .c-card-path-progress__right .o-circular--progress .o-circular-progress--label .o-circluar--percent__text {
    color: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-card-path-progress .c-card-path-progress__right .o-circular--progress .o-progress--no-progress {
    border-color: rgba(219, 221, 224, 0.1);
  }
  .l-prefers-color-scheme--dark .c-card-path-progress .c-card-path-progress__right .o-circular--progress .o-circular--progress__container-left, .l-prefers-color-scheme--dark .c-card-path-progress .c-card-path-progress__right .o-circular--progress .o-progress--half-circle {
    border-color: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-card-simple {
    background-color: #3B4048;
  }
  .l-prefers-color-scheme--dark .c-card-simple .c-card-simple__lower .c-card-simple__meta {
    color: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-content-counter img {
    border-color: #6E7687;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-activity-checklist .c-activity-checklist__entry__top .c-activity-checklist__entry__number {
    background-color: #333333;
  }
  .l-prefers-color-scheme--dark .c-activity-checklist .c-activity-checklist__entry__bottom .c-activity-checklist__entry__desc {
    color: #A7ADB4;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-activity-checklist__entry--completed .c-activity-checklist__entry__top .c-activity-checklist__entry__number {
    background-color: #158443;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-checkbox-toggle .o-checkbox-toggle__indicator {
    background-color: rgba(219, 221, 224, 0.2);
  }
}
@media screen {
  .l-prefers-color-scheme--dark .o-progress-indicator-html progress {
    background-color: rgba(219, 221, 224, 0.1) !important;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-tutorial--all-padding .c-tutorial-item > a, .l-prefers-color-scheme--dark .c-tutorial--all-padding .c-tutorial-item > div {
    padding: 21px;
    background: #3B4048;
  }
}
@media screen {
  .l-svg-collection {
    width: 24px;
    height: 24px;
    min-width: 24px;
    min-height: 24px;
    margin-right: 9px;
  }
}
@media screen {
  .l-svg-notebook-bin {
    width: 17px;
    height: 21px;
  }
}
@media screen {
  .l-svg-breadcrumb {
    width: 10px;
    transform: rotate(90deg);
    height: 10px;
    fill: #6E7687;
  }
}
@media screen {
  .l-svg-nub-down {
    width: 10px;
    height: 10px;
    margin-top: -6px;
    margin-left: -6px;
    position: relative;
  }
}
@media screen {
  .l-svg-more {
    width: 20px;
    height: 5px;
  }
}
@media screen {
  .l-svg-empty-state-bookmark {
    width: 13px;
    height: 18px;
    top: 5px;
    position: relative;
    margin: 0 5px;
  }
}
@media screen {
  .l-svg-video-mode, .l-svg-cinema-mode {
    width: 30px;
    height: 24px;
  }
}
@media screen {
  .l-svg-videos-nav {
    fill: #DBDDE0;
    width: 20px;
    height: 20px;
  }
}
@media screen {
  .l-svg-search-nav {
    fill: #DBDDE0;
    width: 16px;
    height: 16px;
  }
}
@media screen {
  .l-svg-articles-nav {
    fill: #DBDDE0;
    width: 18px;
    height: 18px;
  }
}
@media screen {
  .l-svg-instagram-footer {
    width: 23px;
    height: 23px;
  }
}
@media screen {
  .l-svg-twitter-footer {
    width: 23px;
    height: 20px;
  }
}
@media screen {
  .l-svg-facebook-footer {
    width: 23px;
    height: 23px;
  }
}
@media screen {
  .l-svg-linkedin-footer {
    width: 22px;
    height: 22px;
  }
}
@media screen {
  .l-disclose--small {
    width: 15px;
    height: 9px;
  }
}
@media screen {
  .l-svg-color-white {
    fill: #ffffff !important;
  }
}
@media screen {
  .l-svg-color-grey-regent {
    fill: #959DA5 !important;
  }
}
@media screen {
  .l-svg-color-grey-raven {
    fill: #6E7687 !important;
  }
}
@media screen {
  #carbonads {
    /* Based on "Align Left" in https://codepen.io/collection/AyEoKk/?cursor=ZD0xJm89MSZwPTEmdj03&__cf_chl_captcha_tk__=pmd_nMU9jysxWV_aE06SoBFAY_rg3XuwrdiH7SYN_b499Bw-1634128889-0-gqNtZGzNA1CjcnBszQdl */
    display: block;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 1.5;
    overflow: hidden;
    max-width: 150px;
    text-align: left;
    position: absolute;
    right: -180px;
  }
}
@media screen and (max-width: 1140px) {
  #carbonads {
    position: relative;
    width: 100%;
    right: 0;
    margin: 30px 0;
    max-width: none;
  }
}
@media screen {
  #carbonads a {
    text-decoration: none;
    color: inherit;
  }
  #carbonads a:hover {
    color: inherit;
  }
}
@media screen {
  #carbonads span {
    display: block;
    overflow: hidden;
  }
}
@media screen {
  #carbonads img {
    margin: 0;
  }
}
@media screen {
  #carbonads .carbon-img {
    display: block;
    margin: 0 auto 8px;
    line-height: 1;
  }
}
@media screen and (max-width: 1140px) {
  #carbonads .carbon-img {
    margin: 0 8px 8px 0;
  }
}
@media screen and (max-width: 1140px) {
  #carbonads .carbon-wrap {
    display: flex;
  }
}
@media screen {
  #carbonads .carbon-text {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
  }
}
@media screen {
  #carbonads .carbon-poweredby {
    display: block;
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.4px;
    text-transform: uppercase;
  }
}
@media screen and (max-width: 1440px) {
  .l-admin--sidebar-open #carbonads {
    position: relative;
    width: 100%;
    right: 0;
    margin: 30px 0;
    max-width: none;
  }
}
@media screen and (max-width: 1440px) {
  .l-admin--sidebar-open #carbonads .carbon-img {
    margin: 0 8px 8px 0;
  }
}
@media screen and (max-width: 1440px) {
  .l-admin--sidebar-open #carbonads .carbon-wrap {
    display: flex;
  }
}
@media screen {
  .l-admin--sidebar-open #l-carbon-sidebar-ad {
    display: flex;
  }
}
@media screen {
  #l-carbon-sidebar-ad {
    /* Based on "300 x 250 Banner" in https://codepen.io/collection/AyEoKk/?cursor=ZD0xJm89MSZwPTEmdj03&__cf_chl_captcha_tk__=pmd_nMU9jysxWV_aE06SoBFAY_rg3XuwrdiH7SYN_b499Bw-1634128889-0-gqNtZGzNA1CjcnBszQdl */
    display: none;
    justify-content: center;
    align-items: center;
    position: relative;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;
    width: 100%;
    height: 250px;
    text-align: center;
  }
  #l-carbon-sidebar-ad a {
    text-decoration: none;
    color: #111;
  }
  #l-carbon-sidebar-ad a:hover {
    color: #111;
  }
  #l-carbon-sidebar-ad span {
    display: block;
    overflow: hidden;
  }
  #l-carbon-sidebar-ad .carbon-img {
    display: block;
    margin: 0 0 8px;
    line-height: 1;
  }
  #l-carbon-sidebar-ad .carbon-img img {
    width: 150px;
    max-width: 150px !important;
    height: auto;
  }
  #l-carbon-sidebar-ad .carbon-text {
    display: block;
    margin-bottom: 8px;
    padding: 0 10px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.35;
  }
  #l-carbon-sidebar-ad .carbon-wrap a {
    font-size: 14px;
    font-weight: normal;
  }
  #l-carbon-sidebar-ad .carbon-poweredby {
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 8px 6px;
    font-size: 8px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #fff !important;
    background-color: hsl(0deg, 0%, 10%);
  }
}
@media screen {
  #l-carbon-footer-ad {
    /* Based on "Wide + Call To Action" in https://codepen.io/collection/AyEoKk/?cursor=ZD0xJm89MSZwPTEmdj03&__cf_chl_captcha_tk__=pmd_nMU9jysxWV_aE06SoBFAY_rg3XuwrdiH7SYN_b499Bw-1634128889-0-gqNtZGzNA1CjcnBszQdl */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;
    position: relative;
    display: block;
    overflow: hidden;
    max-width: 688px;
    margin: 0 auto 48px;
  }
  #l-carbon-footer-ad span {
    position: relative;
    display: block;
  }
  #l-carbon-footer-ad a {
    color: inherit;
    text-decoration: none;
  }
  #l-carbon-footer-ad a:hover {
    color: inherit;
  }
  #l-carbon-footer-ad .carbon-wrap {
    display: flex;
    align-items: center;
  }
  #l-carbon-footer-ad .carbon-img {
    display: block;
    margin: 0;
    line-height: 1;
  }
  #l-carbon-footer-ad .carbon-imgimg {
    display: block;
  }
  #l-carbon-footer-ad .carbon-text {
    position: relative;
    display: flex;
    margin-bottom: 12px;
    padding: 8px 1em;
    max-width: 500px;
    text-align: left;
    font-size: 16px;
    line-height: 1.4;
    align-items: center;
  }
  #l-carbon-footer-ad .carbon-text:after {
    display: table;
    margin-left: 20px;
    padding: 12px 16px;
    border-radius: 3px;
    background-color: hsl(0deg, 0%, 20%);
    color: #fff;
    content: "Learn More";
    white-space: nowrap;
    font-weight: 600;
    font-size: 14px;
    line-height: 1;
  }
  #l-carbon-footer-ad .carbon-poweredby {
    position: absolute;
    bottom: 0;
    left: 146px;
    color: #999 !important;
    text-transform: uppercase;
    white-space: nowrap;
    letter-spacing: 0.5px;
    font-weight: 500;
    font-size: 10px;
  }
}
@media only screen and (min-width: 320px) and (max-width: 759px) {
  #l-carbon-footer-ad .carbon-text:after {
    display: none;
  }
}
@media screen {
  .c-nav-sidebar {
    position: fixed;
    left: 0;
    width: 320px;
    height: 100%;
    background: #262626;
    background: -webkit-linear-gradient(to bottom, #262626, #3B4048);
    background: linear-gradient(to bottom, #262626, #3B4048);
    padding: 0 24px;
    overflow: hidden;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar {
    width: 100%;
    height: auto;
    position: relative;
    background: #262626;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar .c-nav-sidebar__cover {
    display: none !important;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(59, 64, 72, 0.8);
    z-index: 9999;
    animation-duration: 0.3s;
    animation-fill-mode: both;
    animation-name: a-fade-in;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar .c-nav-sidebar__wrapper {
    display: none !important;
    position: fixed;
    right: 0;
    top: 0;
    width: 320px;
    height: 100vh;
    background: #262626;
    background: -webkit-linear-gradient(to bottom, #262626, #3B4048);
    background: linear-gradient(to bottom, #262626, #3B4048);
    z-index: 10000;
    padding: 78px 24px 30px;
    animation-duration: 0.3s;
    animation-fill-mode: both;
    animation-name: a-slide-in-right;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar .c-nav-sidebar__nav {
    height: calc(100% - 90px);
    overflow: scroll;
    margin-top: 20px;
  }
}
@media screen {
  .c-nav-sidebar button.c-nav-sidebar__menu-toggle {
    position: absolute;
    top: 15px;
    right: 15px;
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar button.c-nav-sidebar__menu-toggle {
    display: flex !important;
  }
}
@media screen {
  .c-nav-sidebar button.c-nav-sidebar__menu-toggle svg {
    display: flex;
    align-self: center;
    width: 18px;
    height: 18px;
    fill: #ffffff;
  }
}
@media screen {
  .c-nav-sidebar a.c-nav-sidebar__item {
    display: block;
    color: #ffffff;
    text-decoration: none;
    font-size: 1.0625rem;
    font-weight: 500;
    height: 60px;
    line-height: 60px;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar a.c-nav-sidebar__item {
    height: 54px;
    line-height: 54px;
    font-size: 1.1875rem;
  }
}
@media screen {
  .c-nav-sidebar a.c-nav-sidebar__item:hover {
    padding-left: 4px;
    color: #73859F;
  }
}
@media screen {
  .c-nav-sidebar a.c-nav-sidebar__link--active {
    color: #ffffff;
    background: rgba(115, 133, 159, 0.1);
    border-left: 5px solid #73859F;
    margin-left: -24px;
    margin-right: -24px;
    padding-left: 24px;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar a.c-nav-sidebar__link--active {
    background: none;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    border-left: 0;
    border-right: 5px solid #73859F;
  }
}
@media screen {
  .c-nav-sidebar a.c-nav-sidebar__link--active:hover {
    padding-left: 24px !important;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar a.c-nav-sidebar__link--active:hover {
    padding-left: 0 !important;
  }
}
@media screen {
  .c-nav-sidebar div.c-nav-sidebar__logo--mobile-menu {
    display: none;
    position: absolute;
    top: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar div.c-nav-sidebar__logo--mobile-menu {
    display: block !important;
  }
}
@media screen {
  .c-nav-sidebar div.c-nav-sidebar__profile {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    display: flex;
    align-content: center;
    justify-content: space-between;
    background: #393E44;
    padding: 15px 24px 20px;
  }
  .c-nav-sidebar div.c-nav-sidebar__profile:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: rgba(115, 133, 159, 0.2);
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar div.c-nav-sidebar__profile {
    margin-top: 18px;
  }
}
@media screen {
  .c-nav-sidebar div.c-nav-sidebar__profile .c-nav-sidebar__profile-message {
    display: block;
    color: #ffffff;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar div.c-nav-sidebar__profile .c-nav-sidebar__profile-message {
    font-size: 15px;
  }
}
@media screen {
  .c-nav-sidebar div.c-nav-sidebar__profile .c-nav-sidebar__profile-controls {
    text-align: right;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar div.c-nav-sidebar__profile .c-nav-sidebar__profile-image img {
    width: 48px;
    height: 48px;
  }
}
@media screen {
  .c-nav-sidebar div.c-nav-sidebar__profile .c-nav-sidebar__profile-button {
    padding: 0;
    line-height: 20px;
    height: 20px;
    margin-top: 4px;
    opacity: 0.75;
  }
  .c-nav-sidebar div.c-nav-sidebar__profile .c-nav-sidebar__profile-button:hover {
    opacity: 1;
  }
  .c-nav-sidebar div.c-nav-sidebar__profile .c-nav-sidebar__profile-button svg {
    fill: #262626;
  }
}
@media screen {
  .c-nav-sidebar div.c-nav-sidebar-advert {
    display: flex;
    align-items: center;
    height: calc(100vh - 136px);
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar div.c-nav-sidebar-advert {
    display: none;
  }
}
@media screen {
  .c-nav-sidebar div.c-nav-sidebar-advert > div {
    text-align: center;
  }
  .c-nav-sidebar div.c-nav-sidebar-advert > div .c-nav-sidebar-advert__wrapper {
    animation-duration: 0.9s;
    animation-fill-mode: both;
    animation-name: a-fade-in;
  }
  .c-nav-sidebar div.c-nav-sidebar-advert > div .c-nav-sidebar-advert__title {
    font-family: "Bitter", serif;
    font-size: 1.6875em; /* 27/16 */
    color: #ffffff;
  }
  .c-nav-sidebar div.c-nav-sidebar-advert > div .c-nav-sidebar-advert__subtitle {
    color: #ffffff;
    font-size: 0.9375em; /* 15/16 */
    margin-top: 18px;
    opacity: 0.8;
  }
  .c-nav-sidebar div.c-nav-sidebar-advert > div .c-nav-sidebar-advert__image {
    position: absolute;
    bottom: 0;
    left: 50%;
    z-index: -1;
    width: 160px;
    margin-left: -80px;
    animation-duration: 0.9s;
    animation-fill-mode: both;
    animation-name: a-fade-in-up;
  }
}
@media screen {
  .c-nav-sidebar--article {
    position: fixed;
    top: 0;
    left: 0;
    width: 80px !important;
    height: 100%;
    background: #FAFAFA;
    padding: 0 24px 30px;
    overflow-y: auto;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .c-nav-sidebar--article::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar--article {
    width: 100%;
    height: auto;
    position: relative;
    background: #FAFAFA;
    padding-bottom: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar--article .c-nav-sidebar__wrapper {
    display: none !important;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    background: #FAFAFA;
    z-index: 10000;
    padding: 78px 24px 30px;
    animation-duration: 0.3s;
    animation-fill-mode: both;
    animation-name: a-slide-in-right;
  }
}
@media screen {
  .c-nav-sidebar--article .c-nav-sidebar__nav {
    padding-top: 15px;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar--article .c-nav-sidebar__nav {
    height: 100%;
    overflow: auto;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
  }
  .c-nav-sidebar--article .c-nav-sidebar__nav::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar--article .c-nav-sidebar__nav {
    height: calc(100% - 90px);
    overflow: scroll;
    margin-top: 20px;
    padding-left: 2px;
  }
}
@media screen {
  .c-nav-sidebar--article .c-nav-sidebar__nav .c-global-header__logo {
    width: 240px;
    margin-left: -9px;
  }
  .c-nav-sidebar--article .c-nav-sidebar__nav .c-global-header__logo .o-header-logo__text {
    opacity: 0 !important;
  }
}
@media screen {
  .c-nav-sidebar--article .o-header-logo__link:hover .o-header-logo__mark {
    fill: #158443 !important;
  }
}
@media screen {
  .c-nav-sidebar--article .c-nav-sidebar__nav-action {
    display: inline-flex;
    position: relative;
    top: 0;
    margin-top: 0;
    padding: 20px 0 0;
  }
  .c-nav-sidebar--article .c-nav-sidebar__nav-action .o-button__label--open {
    display: none;
  }
  .c-nav-sidebar--article .c-nav-sidebar__nav-action i {
    margin-right: 0;
    margin-left: 4px;
  }
}
@media screen {
  .c-nav-sidebar--article .c-nav-sidebar__title {
    outline: none;
    color: #333333;
    font-family: "Bitter", serif;
    font-weight: 700;
    display: block;
    font-size: 1.125rem;
    line-height: 1.2;
    padding: 1em 45px 0 0;
    position: relative;
    -webkit-transition: background 0.3s;
    -moz-transition: background 0.3s;
    transition: background 0.3s;
    text-decoration: none;
    display: none;
  }
  .c-nav-sidebar--article .c-nav-sidebar__title svg {
    position: relative !important;
    left: 0;
    top: 0;
    margin-right: 6px;
    width: 12px;
    height: 12px;
  }
}
@media screen {
  .c-nav-sidebar--article .c-sidebar-navigator__link {
    color: #333333;
  }
  .c-nav-sidebar--article .c-sidebar-navigator__link:hover {
    color: #333333;
  }
}
@media screen {
  .c-nav-sidebar--article nav.c-video-player__lessons {
    width: 100%;
  }
  .c-nav-sidebar--article nav.c-video-player__lessons .c-video-player__lessons-section {
    display: block;
  }
}
@media screen {
  .c-nav-sidebar--white .c-nav-sidebar--article {
    background: none;
  }
  .c-nav-sidebar--white .c-nav-sidebar--article .c-sidebar-navigator__link:hover .c-sidebar-navigator__indicator:before {
    background: #dbdde0;
  }
  .c-nav-sidebar--white .c-nav-sidebar--article .c-sidebar-navigator__indicator {
    background: #ffffff;
    border: 2px solid #dbdde0;
  }
  .c-nav-sidebar--white .c-nav-sidebar--article .c-sidebar-navigator__indicator:after {
    background: #dbdde0;
  }
  .c-nav-sidebar--white .c-nav-sidebar--article .is-active .c-sidebar-navigator__indicator:before {
    background: #dbdde0 !important;
  }
  .c-nav-sidebar--white .c-nav-sidebar--article .c-sidebar-navigator__title {
    color: #333333;
  }
  .c-nav-sidebar--white .c-nav-sidebar--article .c-sidebar-navigator__title:hover {
    color: #158443;
  }
}
@media screen {
  .c-sidebar-navigator {
    position: relative;
    padding-bottom: 30px;
    display: none;
  }
  .c-sidebar-navigator li {
    list-style: none;
    margin-top: 16px;
    font-size: 0.875rem; /* 14/16 */
  }
  .c-sidebar-navigator li:last-child .c-sidebar-navigator__indicator:after {
    display: none;
  }
  .c-sidebar-navigator li:nth-last-child(2) .c-sidebar-navigator__indicator:after {
    display: none;
  }
  .c-sidebar-navigator li a {
    display: flex;
    align-items: flex-start;
    color: #ffffff;
    text-decoration: none;
    position: relative;
  }
  .c-sidebar-navigator li a:hover {
    color: #73859F;
  }
  .c-sidebar-navigator li a:hover .c-sidebar-navigator__indicator:before {
    content: "";
    width: 8px;
    height: 8px;
    position: absolute;
    top: 5px;
    left: 5px;
    background: #73859F;
    border-radius: 0.5625rem;
    opacity: 1;
  }
  .c-sidebar-navigator li a.c-sidebar-navigator__link.is-active .c-sidebar-navigator__indicator:before {
    content: "";
    width: 8px;
    height: 8px;
    position: absolute;
    top: 5px;
    left: 5px;
    background: #73859F;
    border-radius: 0.5625rem;
    opacity: 1;
  }
  .c-sidebar-navigator li a.c-sidebar-navigator__link.is-active .c-sidebar-navigator__title {
    color: #158443;
  }
  .c-sidebar-navigator li a.c-sidebar-navigator__link--empty {
    display: block;
    height: 20px;
  }
  .c-sidebar-navigator li a .c-sidebar-navigator__indicator {
    display: block;
    min-width: 18px;
    min-height: 18px;
    background: none;
    border: 2px solid #DBDDE0;
    border-radius: 50%;
  }
  .c-sidebar-navigator li a .c-sidebar-navigator__indicator:before {
    opacity: 0;
    transition: opacity 0.3s;
  }
  .c-sidebar-navigator li a .c-sidebar-navigator__indicator:after {
    content: "";
    width: 2px;
    height: calc(100% - 4px);
    position: absolute;
    top: 22px;
    left: 9px;
    margin-left: -1px;
    background: #DBDDE0;
    border-radius: 0.5625rem;
  }
  .c-sidebar-navigator li a .c-sidebar-navigator__title {
    padding-left: 12px;
    margin-top: -1px;
  }
}
@media screen {
  .c-nav-sidebar-my-interests {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 80px;
    height: 100%;
    background: #FAFAFA;
    padding: 0 24px 120px;
    overflow: auto;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .c-nav-sidebar-my-interests::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar-my-interests {
    display: none;
    z-index: 999999;
  }
}
@media screen and (max-width: 768px) {
  .c-nav-sidebar-my-interests {
    width: 210px !important;
  }
}
@media screen {
  .c-nav-sidebar-my-interests .c-nav-sidebar__cover {
    margin-left: -24px;
    width: calc(100% + 48px);
    height: 72px;
    background: #157CB8;
  }
}
@media screen {
  .c-nav-sidebar-my-interests .o-header-logo {
    width: 240px;
    margin-top: 11px;
    margin-bottom: 5px;
    margin-left: -9px;
    position: relative;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar-my-interests .o-header-logo {
    display: none;
  }
}
@media screen {
  .c-nav-sidebar-my-interests .o-header-logo .o-header-logo__link:hover .o-header-logo__mark {
    fill: #158443;
  }
}
@media screen {
  .c-nav-sidebar-my-interests .o-header-logo .o-header-logo__mark {
    width: 50px;
  }
}
@media screen {
  .c-nav-sidebar-my-interests .o-header-logo .o-header-logo__text {
    visibility: hidden;
    opacity: 0;
  }
}
@media screen {
  .c-nav-sidebar-my-interests .c-nav-sidebar__menu-toggle--opener {
    display: flex;
  }
}
@media screen {
  .c-nav-sidebar-my-interests .c-nav-sidebar__menu-toggle--closer {
    display: none;
  }
}
@media screen {
  .c-nav-sidebar-my-interests .o-button-sidebar {
    position: relative;
    margin-top: 15px;
  }
  .c-nav-sidebar-my-interests .o-button-sidebar svg {
    margin-left: -12.5px;
    margin-top: -12.5px;
  }
}
@media screen {
  .c-nav-sidebar-my-interests .c-nav-sidebar__wrapper {
    padding-bottom: 30px;
    display: none;
  }
}
@media screen {
  .c-nav-sidebar-my-interests button.c-nav-sidebar__menu-toggle {
    position: absolute;
    top: 15px;
    left: 75px;
    display: none;
    border-radius: 100px;
    background: #434A53;
    width: 48px;
    height: 48px;
  }
  .c-nav-sidebar-my-interests button.c-nav-sidebar__menu-toggle svg {
    display: flex;
    align-self: center;
    width: 20px;
    height: 20px;
    fill: #ffffff;
  }
}
@media screen {
  .c-nav-sidebar-my-interests .c-nav-sidebar__nav-action {
    border-bottom: 1px solid #DBDDE0;
    margin-left: -24px;
    margin-right: -24px;
    width: calc(100% + 48px);
    padding: 20px 24px;
  }
}
@media screen {
  .c-nav-sidebar-my-interests .c-nav-sidebar__section {
    display: flex;
    align-items: center;
    height: 50px;
    cursor: initial;
    position: relative;
  }
  .c-nav-sidebar-my-interests .c-nav-sidebar__section:before {
    content: "";
    position: absolute;
    top: 0;
    left: -24px;
    width: calc(100% + 48px);
    height: 1px;
    background: #DBDDE0;
  }
  .c-nav-sidebar-my-interests .c-nav-sidebar__section svg {
    width: 17px;
    height: 17px;
    fill: #333333;
  }
  .c-nav-sidebar-my-interests .c-nav-sidebar__section .c-nav-sidebar__section-svg--large {
    width: 19px;
    height: 19px;
    fill: #333333;
    margin-right: -1px;
  }
}
@media screen {
  .c-nav-sidebar-my-interests .c-sidebar-navigator__link {
    color: #333333;
  }
  .c-nav-sidebar-my-interests .c-sidebar-navigator__link:hover {
    color: #333333;
  }
}
@media screen {
  .c-nav-sidebar-my-interests a.c-nav-sidebar__item {
    display: block;
    color: #333333;
    text-decoration: none;
    font-size: 0.875rem; /* 14/16 */
    font-weight: 500;
    height: 40px;
    line-height: 40px;
  }
  .c-nav-sidebar-my-interests a.c-nav-sidebar__item:hover {
    padding-left: 4px;
    color: #73859F;
  }
  .c-nav-sidebar-my-interests a.c-nav-sidebar__item:last-of-type {
    margin-bottom: 10px;
  }
}
@media screen {
  .c-nav-sidebar-my-interests a.c-nav-sidebar__link--active {
    color: #333333;
    background: #158443;
    margin-left: -24px;
    margin-right: -24px;
    padding-left: 24px;
  }
  .c-nav-sidebar-my-interests a.c-nav-sidebar__link--active:hover {
    color: #ffffff;
    padding-left: 24px;
  }
}
@media screen {
  .c-nav-sidebar-my-interests div.c-nav-sidebar__logo--mobile-menu {
    display: none;
    position: absolute;
    top: 0;
  }
}
@media screen {
  .c-nav-sidebar-my-interests div.c-nav-sidebar__profile {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 320px;
    display: flex;
    align-content: center;
    justify-content: space-between;
    background: #393E44;
    padding: 15px 24px 20px;
  }
  .c-nav-sidebar-my-interests div.c-nav-sidebar__profile:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: rgba(115, 133, 159, 0.2);
  }
  .c-nav-sidebar-my-interests div.c-nav-sidebar__profile .c-nav-sidebar__profile-message {
    display: block;
    color: #ffffff;
  }
  .c-nav-sidebar-my-interests div.c-nav-sidebar__profile .c-nav-sidebar__profile-controls {
    text-align: right;
  }
  .c-nav-sidebar-my-interests div.c-nav-sidebar__profile .c-nav-sidebar__profile-button {
    padding: 0;
    line-height: 20px;
    height: 20px;
    margin-top: 4px;
    opacity: 0.75;
  }
  .c-nav-sidebar-my-interests div.c-nav-sidebar__profile .c-nav-sidebar__profile-button:hover {
    opacity: 1;
  }
  .c-nav-sidebar-my-interests div.c-nav-sidebar__profile .c-nav-sidebar__profile-button svg {
    fill: #262626;
  }
}
@media screen {
  .c-nav-sidebar-my-interests--close {
    position: fixed;
    left: 256px;
    top: 12px;
    display: flex;
    z-index: 9999999;
  }
}
@media screen and (max-width: 768px) {
  .c-nav-sidebar-my-interests--close {
    left: 186px;
  }
}
@media screen {
  .c-nav-sidebar-admin--open .c-nav-sidebar__wrapper {
    display: block !important;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .c-nav-sidebar-admin--open .c-nav-sidebar__wrapper::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media screen and (min-width: 1200px) {
  .c-nav-sidebar-admin--open .c-nav-sidebar__wrapper {
    overflow: initial;
  }
}
@media screen {
  .c-nav-sidebar-admin--open .c-nav-sidebar__wrapper .c-nav-sidebar__link--active {
    border-right: none;
  }
}
@media screen {
  .l-admin--sidebar-open .c-nav-sidebar--book {
    display: block;
  }
}
@media screen and (max-width: 992px) {
  .l-admin--sidebar-open .c-nav-sidebar--book {
    overflow: initial;
  }
}
@media screen {
  .l-admin--sidebar-open .o-button-chapter {
    display: none;
  }
}
@media screen {
  .c-nav-sidebar--book {
    z-index: 1;
    display: none;
    background: #FAFAFA;
  }
  .c-nav-sidebar--book .c-video-player__lessons {
    padding-top: 72px;
    background: #FAFAFA;
    animation: none;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar--book .c-video-player__lessons {
    padding-top: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar--book .c-nav-sidebar__wrapper {
    background: #FAFAFA;
    animation: none;
  }
}
@media screen {
  .c-nav-sidebar--book .c-video-player__lessons-section {
    border-color: #DBDDE0 !important;
  }
  .c-nav-sidebar--book .c-video-player__lessons-section:last-child {
    padding-bottom: 120px;
  }
}
@media screen {
  .c-nav-sidebar--book .c-video-player__lessons-header svg {
    fill: #A7ADB4 !important;
    opacity: 1 !important;
  }
}
@media screen {
  .c-nav-sidebar--book .c-video-player__lessons-title {
    color: #333333 !important;
  }
  .c-nav-sidebar--book .c-video-player__lessons-title a {
    color: #333333 !important;
  }
  .c-nav-sidebar--book .c-video-player__lessons-title a:hover {
    text-decoration: underline !important;
  }
}
@media screen {
  .c-nav-sidebar--book .c-video-player__lessons-sum {
    color: #6E7687 !important;
  }
}
@media screen {
  .c-nav-sidebar--book .c-box-list li a {
    color: #333333;
  }
  .c-nav-sidebar--book .c-box-list li a:hover {
    color: #333333;
    text-decoration: underline;
  }
}
@media screen {
  .c-nav-sidebar--book .c-box-list--linked li:before {
    background: #ffffff;
  }
  .c-nav-sidebar--book .c-box-list--linked li:after {
    display: none;
  }
}
@media screen {
  .c-nav-sidebar--book .c-box-list__item--complete {
    text-decoration: none !important;
  }
  .c-nav-sidebar--book .c-box-list__item--complete:before {
    background-image: url(/assets/svg-icons/checkmark-c892a399ec5e7c73a6cac886b1baac93a78bf5eab341469fd7de45c61c674ec0.png) !important;
    background-size: cover;
  }
  .c-nav-sidebar--book .c-box-list__item--complete a {
    color: #333333 !important;
  }
  .c-nav-sidebar--book .c-box-list__item--complete:hover {
    color: #333333;
  }
  .c-nav-sidebar--book .c-box-list__item--complete .c-box-list__item-scroll-to:hover {
    color: #333333 !important;
  }
}
@media screen {
  .c-nav-sidebar--book .c-box-list__item--complete + .c-sidebar-navigator:before {
    background: #158443;
  }
}
@media screen {
  .c-nav-sidebar--book .c-box-list__item--complete + nav:before {
    background: #158443;
  }
}
@media screen {
  .c-nav-sidebar--book .c-box-list .c-box-list__item--active:before {
    background-image: url(/assets/svg-icons/chevron--black-454278cfec6d2fd7013bd089533ed0fa999a8811f872991b37387fc67a6a5144.png);
    background-size: cover;
  }
}
@media screen {
  .c-nav-sidebar--book .c-box-list__item-scroll-to:hover {
    color: #333333 !important;
  }
}
@media screen {
  .c-nav-sidebar--book .c-box-list .c-box-list__item--locked:before {
    background-image: url(/assets/svg-icons/padlock--black-700be4229af004b19bd24e2e8164e393e38dfe8e1b8946cb9a135e7e4f54556f.png) !important;
    background-size: cover;
  }
}
@media screen {
  .c-nav-sidebar--book .c-sidebar-navigator {
    padding-bottom: 0;
    position: relative;
  }
  .c-nav-sidebar--book .c-sidebar-navigator:before {
    content: "";
    position: absolute;
    top: -6px;
    left: 9px;
    width: 2px;
    height: calc(100% + 18px);
    background: #DBDDE0;
  }
  .c-nav-sidebar--book .c-sidebar-navigator li {
    padding-left: 20px;
    margin-top: 12px !important;
    font-size: 0.875rem; /* 14/16 */
    white-space: normal !important;
    text-overflow: unset !important;
    overflow-x: visible !important;
  }
  .c-nav-sidebar--book .c-sidebar-navigator li:before {
    display: none;
  }
  .c-nav-sidebar--book .c-sidebar-navigator li a {
    white-space: normal !important;
    font-weight: 400;
    color: #6E7687 !important;
  }
  .c-nav-sidebar--book .c-sidebar-navigator li a:hover {
    text-decoration: underline;
  }
  .c-nav-sidebar--book .c-sidebar-navigator .is-active {
    text-decoration: underline;
  }
  .c-nav-sidebar--book .c-sidebar-navigator .c-sidebar-navigator__indicator {
    display: none;
  }
}
@media screen {
  .s_show_mobile_menu .c-nav-sidebar__wrapper {
    display: block !important;
  }
  .s_show_mobile_menu .c-nav-sidebar__cover {
    display: block !important;
  }
}
@media screen {
  header#c-global-header {
    height: 72px;
    background: #333333;
    padding: 0 25px 0 15px;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 999999;
  }
}
@media screen and (max-width: 768px) {
  header#c-global-header {
    z-index: 99999;
  }
}
@media screen {
  header#c-global-header a:focus:not(:focus-visible), header#c-global-header button:focus:not(:focus-visible) {
    outline: none;
  }
}
@media screen {
  header#c-global-header a:focus-visible, header#c-global-header button:focus-visible {
    outline: 1px dotted grey;
  }
}
@media screen {
  header#c-global-header details[open] summary::before {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: "";
    cursor: default;
  }
}
@media screen {
  header#c-global-header details summary::marker {
    display: none;
  }
}
@media screen {
  header#c-global-header details summary::-webkit-details-marker {
    display: none;
  }
}
@media screen {
  header#c-global-header summary {
    list-style: none;
  }
}
@media screen {
  header#c-global-header .c-global-header__logo {
    width: 240px;
    height: 50px;
    margin: 0;
    z-index: 99999;
  }
}
@media screen and (max-width: 1144px) {
  header#c-global-header .c-global-header__logo {
    width: 50px;
  }
}
@media screen {
  header#c-global-header .c-global-header__logo .o-header-logo__mark {
    width: 50px;
    height: 50px;
  }
}
@media screen and (max-width: 1144px) {
  header#c-global-header .c-global-header__logo svg.o-header-logo__text {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  header#c-global-header .c-global-header__nav {
    position: fixed;
    left: 0;
    top: 0;
    background: linear-gradient(to right bottom, #333333, #363638, #38393d, #3a3c43, #3b4048);
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    padding-top: 72px;
    padding-bottom: 36px;
    display: none;
  }
}
@media screen and (max-width: 768px) {
  header#c-global-header .c-global-header__nav .u-toggle-dropdown .o-button--dark {
    display: none;
  }
}
@media screen {
  header#c-global-header .c-global-header__nav > div.c-global-header__logo {
    display: none;
  }
}
@media screen {
  header#c-global-header .c-global-header__nav > div.o-button-menu {
    display: none;
  }
}
@media screen {
  header#c-global-header .c-global-header__nav.c-global-header__nav--show-menu {
    display: block !important;
    z-index: 999999;
  }
}
@media screen and (max-width: 768px) {
  header#c-global-header .c-global-header__nav.c-global-header__nav--show-menu > div.c-global-header__logo {
    display: block;
    position: absolute;
    top: 11px;
    margin-left: 15px;
  }
  header#c-global-header .c-global-header__nav.c-global-header__nav--show-menu > div.o-button-menu {
    display: flex;
    position: absolute;
    top: 12px;
  }
}
@media screen {
  header#c-global-header .c-global-header__nav > ul {
    display: flex;
    align-items: center;
  }
}
@media screen and (max-width: 768px) {
  header#c-global-header .c-global-header__nav > ul {
    display: block;
    padding: 0 20px;
  }
}
@media screen {
  header#c-global-header .c-global-header__nav > ul > li {
    font-size: 0.9375rem;
    font-weight: 600 !important;
    color: #ffffff;
    margin-left: 30px;
    position: relative;
  }
}
@media screen and (max-width: 768px) {
  header#c-global-header .c-global-header__nav > ul > li {
    margin-left: 0;
  }
}
@media screen {
  header#c-global-header .c-global-header__nav > ul > li > a {
    font-weight: 600 !important;
    text-decoration: none;
    color: #ffffff;
    transition: border 0s;
  }
  header#c-global-header .c-global-header__nav > ul > li > a:hover {
    border-bottom: 2px solid #73859F;
  }
}
@media screen and (max-width: 768px) {
  header#c-global-header .c-global-header__nav > ul > li > a {
    height: 54px;
    line-height: 54px;
    font-family: "Bitter";
    font-size: 1.125rem; /* 18/16 */
  }
}
@media screen {
  header#c-global-header .c-global-header__nav > ul > li > a.c-global-header__nav-link--active {
    border-bottom: 2px solid #73859F;
  }
}
@media screen and (max-width: 768px) {
  header#c-global-header .c-global-header__nav > ul > li > a.c-global-header__nav-link--active {
    border: 0;
  }
}
@media screen {
  header#c-global-header .c-global-header__nav > ul > li a {
    text-decoration: none;
  }
}
@media screen {
  header#c-global-header .c-global-header__nav > ul > li > span {
    font-weight: 600 !important;
  }
}
@media screen {
  header#c-global-header .c-global-header__nav .l-night-mode-toggle--mobile {
    margin-top: 30px;
  }
  header#c-global-header .c-global-header__nav .l-night-mode-toggle--mobile li {
    display: flex;
    font-family: "Bitter", serif;
    font-size: 1.0625rem; /* 17/16 */
    font-weight: 600 !important;
    height: 54px;
    line-height: 54px;
    position: relative;
  }
  header#c-global-header .c-global-header__nav .l-night-mode-toggle--mobile li a {
    margin-left: 12px;
  }
  header#c-global-header .c-global-header__nav .l-night-mode-toggle--mobile i.o-dropdown-menu__icon--night-mode svg {
    top: 3px;
    position: relative;
    width: 18px;
    height: 18px;
    fill: #ffffff;
  }
  header#c-global-header .c-global-header__nav .l-night-mode-toggle--mobile .o-checkbox {
    top: 50%;
    margin-top: -13px;
    right: 0;
  }
  header#c-global-header .c-global-header__nav .l-night-mode-toggle--mobile .o-checkbox .checkbox__indicator {
    background: none;
    border: 2px solid rgba(115, 133, 159, 0.75);
  }
}
@media screen {
  header#c-global-header .c-global-header__nav .c-global-header__search {
    font-weight: 600;
  }
  header#c-global-header .c-global-header__nav .c-global-header__search.c-global-header__search--active span:before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background: #73859F;
    bottom: 1px;
  }
}
@media screen and (max-width: 768px) {
  header#c-global-header .c-global-header__nav .c-global-header__search {
    background: #333333;
    height: 48px;
    border-radius: 100px;
    width: 100%;
    margin-top: 10px;
  }
  header#c-global-header .c-global-header__nav .c-global-header__search .l-button__search {
    left: 20px;
  }
}
@media screen {
  header#c-global-header .c-global-header__nav .c-global-header__search span {
    position: relative;
    text-decoration: none;
  }
}
@media screen and (max-width: 768px) {
  header#c-global-header .c-global-header__nav .c-global-header__search span:hover:before {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  header#c-global-header .c-global-header__nav .c-global-header__search span {
    padding-left: 24px;
  }
}
@media screen {
  header#c-global-header .c-global-header__nav .c-global-header__search span:hover:before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background: #73859F;
    bottom: 1px;
  }
}
@media screen {
  header#c-global-header .c-global-header__user {
    margin-left: auto;
    display: flex;
    z-index: 999;
  }
  header#c-global-header .c-global-header__user a, header#c-global-header .c-global-header__user button {
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    color: #ffffff;
    margin-left: 15px;
  }
  header#c-global-header .c-global-header__user a.c-global-header__user-login, header#c-global-header .c-global-header__user button.c-global-header__user-login {
    transition: border 0s;
    line-height: 48px;
  }
  header#c-global-header .c-global-header__user a.c-global-header__user-login:hover, header#c-global-header .c-global-header__user button.c-global-header__user-login:hover {
    border-bottom: 2px solid #73859F;
  }
  header#c-global-header .c-global-header__user .l-button__nub {
    top: 0;
    margin-left: 2px;
  }
  header#c-global-header .c-global-header__user .c-global-header__action {
    width: 126px;
  }
}
@media screen and (max-width: 360px) {
  header#c-global-header .c-global-header__user .c-global-header__action {
    display: none;
  }
}
@media screen {
  header#c-global-header .c-global-header__user .c-global-header__action a {
    width: 126px;
    height: 126px;
    border-radius: 100px;
    background: #158443;
    display: flex;
    align-items: center;
    font-family: "Bitter", serif;
    text-align: center;
    line-height: 1.25;
    position: absolute;
    top: -64px;
  }
  header#c-global-header .c-global-header__user .c-global-header__action a:hover {
    background: #17914a;
  }
  header#c-global-header .c-global-header__user .c-global-header__action a span {
    position: relative;
    top: 25px;
  }
  header#c-global-header .c-global-header__user .c-global-header__action a span:hover {
    text-decoration: none;
  }
}
@media screen {
  header#c-global-header .c-global-header__user .c-global-header__user-control {
    display: flex;
    min-height: 100%;
    align-items: center;
    margin: 0 21px 0 0;
  }
}
@media screen and (max-width: 992px) {
  header#c-global-header .c-global-header__user .c-global-header__user-control {
    display: none;
  }
}
@media screen {
  header#c-global-header .c-global-header__user .c-global-header__user-control a {
    display: flex;
    min-height: 100%;
    align-items: center;
    position: relative;
  }
  header#c-global-header .c-global-header__user .c-global-header__user-control a .o-tooltip {
    top: 42px;
  }
}
@media screen {
  .c-dropdown-menu--expanded {
    background-color: #222222;
    width: 780px;
    left: 0;
    padding: 0;
    border-radius: 9px;
    overflow: hidden;
  }
}
@media screen and (max-width: 992px) {
  .c-dropdown-menu--expanded {
    left: 0;
    margin-left: 0;
    width: 600px;
  }
}
@media screen and (max-width: 768px) {
  .c-dropdown-menu--expanded {
    padding-top: 0;
  }
}
@media screen {
  .c-dropdown-menu--expanded:before {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-dropdown-menu--expanded:before {
    left: 50px;
  }
}
@media screen and (max-width: 600px) {
  .c-dropdown-menu--expanded:before {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .c-dropdown-menu--expanded {
    width: 100%;
    position: relative;
    left: 0;
    margin-left: 0;
    background: none;
    box-shadow: none;
    display: block !important;
    padding-bottom: 0;
  }
}
@media screen {
  .c-dropdown-menu--expanded > li {
    display: block;
    height: auto;
    padding: 0;
  }
}
@media screen and (max-width: 600px) {
  .c-dropdown-menu--expanded li {
    padding: 0;
  }
  .c-dropdown-menu--expanded li a {
    color: #ffffff !important;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__upper {
    padding: 30px;
  }
}
@media screen and (max-width: 768px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__upper {
    padding: 12px 0;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__upper > ul {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: 18px;
  }
}
@media screen and (max-width: 992px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__upper > ul {
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 18px;
    grid-row-gap: 18px;
  }
}
@media screen and (max-width: 768px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__upper > ul {
    grid-template-columns: 1fr;
    grid-row-gap: 18px;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__upper > ul > li {
    border-right: 1px solid rgba(50, 54, 58, 0.5);
    padding: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__upper > ul > li {
    border: 0;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__upper > ul > li:last-child {
    border-right: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__upper > ul > li:nth-of-type(3) {
    border-right: 0;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__lower {
    background-color: #1a1a1a;
    padding: 8px 30px;
  }
}
@media screen and (max-width: 768px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__lower {
    display: none;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__lower > ul {
    display: flex;
  }
  .c-dropdown-menu--expanded .c-dropdown-menu__lower > ul li {
    padding: 0;
    margin-right: 40px;
  }
  .c-dropdown-menu--expanded .c-dropdown-menu__lower > ul li:last-child {
    margin-right: 0;
    margin-left: auto;
  }
  .c-dropdown-menu--expanded .c-dropdown-menu__lower > ul li a {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.8125rem !important; /* 13/16 */
    font-weight: 400 !important;
    color: #DBDDE0 !important;
    display: flex;
    align-items: center;
  }
  .c-dropdown-menu--expanded .c-dropdown-menu__lower > ul li a svg {
    margin-right: 10px;
  }
  .c-dropdown-menu--expanded .c-dropdown-menu__lower > ul li a:hover {
    text-decoration: underline !important;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__established {
    height: auto;
    position: relative;
    display: block;
  }
}
@media screen and (max-width: 768px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__established {
    padding-left: 0;
    padding-right: 0;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__established:before {
    content: "";
    width: calc(100% - 48px);
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 24px;
    background: #32363A;
    opacity: 0.5;
  }
}
@media screen and (max-width: 768px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__established:before {
    display: none;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__established:last-child:before {
    display: none;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__established:hover {
    background: #32363A;
  }
}
@media screen and (max-width: 768px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__established:hover {
    background: none;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__established:hover .l-button__svg-arrow-nav {
    transform: translateX(3px);
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__established a {
    display: flex;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__established span {
    display: block;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__established span.o-dropdown-menu__lead {
    font-size: 1rem; /* 18/16 */
    color: #A7ADB4;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__established span.o-dropdown-menu__title {
    font-size: 1rem !important; /* 18/16 */
    color: #ffffff;
  }
}
@media screen and (max-width: 768px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__established span.o-dropdown-menu__title {
    font-size: 1.125rem !important; /* 18/16 */
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__established span.o-dropdown-menu__subtitle {
    margin-top: 0;
    color: #A7ADB4;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.8125rem; /* 13/16 */
    font-weight: 400 !important;
  }
}
@media screen and (max-width: 768px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__established span.o-dropdown-menu__subtitle {
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen and (max-width: 600px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__established span.o-dropdown-menu__subtitle {
    color: #A7ADB4;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__established i {
    width: 48px;
    height: 48px;
    margin-right: 22px;
  }
}
@media screen and (max-width: 600px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__established i {
    display: none;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__established--no-hover:hover {
    background: none;
  }
  .c-dropdown-menu--expanded .c-dropdown-menu__established--no-hover:before {
    display: none;
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__sublinks {
    margin-top: 10px;
    display: grid;
    grid-template-columns: 1fr;
  }
  .c-dropdown-menu--expanded .c-dropdown-menu__sublinks li {
    height: auto;
    padding: 0;
    margin-top: 8px;
  }
  .c-dropdown-menu--expanded .c-dropdown-menu__sublinks li:first-child {
    margin-top: 2px;
  }
  .c-dropdown-menu--expanded .c-dropdown-menu__sublinks li:last-child {
    margin-bottom: 4px;
  }
  .c-dropdown-menu--expanded .c-dropdown-menu__sublinks li a {
    display: flex;
    align-items: center;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    color: white !important;
    font-size: 0.8125rem !important;
    font-weight: 400;
  }
}
@media screen and (max-width: 768px) {
  .c-dropdown-menu--expanded .c-dropdown-menu__sublinks li a {
    font-size: 0.875rem !important; /* 14/16 */
  }
}
@media screen {
  .c-dropdown-menu--expanded .c-dropdown-menu__sublinks li a:hover {
    text-decoration: underline !important;
  }
}
@media screen {
  .c-dropdown-menu--expanded-tutorials {
    width: 320px;
    padding: 12px 0;
  }
  .c-dropdown-menu--expanded-tutorials li {
    height: auto;
    padding: 12px 24px;
  }
}
@media screen {
  .l-dropdown-menu-user {
    right: -22px;
    top: 42px;
  }
}
@media screen and (max-width: 600px) {
  .l-dropdown-menu-user {
    top: 52px;
    left: -210px;
    width: 270px;
  }
  .l-dropdown-menu-user:before {
    display: none;
  }
}
@media screen and (max-width: 360px) {
  .l-dropdown-menu-user {
    left: auto;
    right: 10px;
  }
}
@media screen {
  .l-dropdown-menu-user:before {
    left: auto;
    right: 45px;
  }
}
@media screen {
  .l-dropdown-menu-user i.o-dropdown-menu__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.5625rem;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon svg {
    fill: #ffffff;
    width: 18px;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--admin {
    background: #3B4048;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--admin svg {
    width: 20px;
    height: 20px;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--subscription {
    background: #3268a6;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--subscription svg {
    position: relative;
    width: 21px;
    height: 21px;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--account {
    background: #158443;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--account svg {
    width: 26px;
    height: 26px;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--profile {
    background: #2EA664;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--profile svg {
    height: 25px;
    width: 30px;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--products {
    background: #FD7401;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--products svg {
    width: 12px;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--bookmarks {
    background: #585E66;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--bookmarks svg {
    width: 12px;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--newsletter {
    background: #157CB8;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--newsletter svg {
    height: 20px;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--support {
    background: #687BAD;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--support svg {
    width: 9px;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--forums {
    background: #41AEA4;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--forums svg {
    width: 18px;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--logout {
    background: #CF3B2B;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--logout svg {
    width: 16px;
    height: 16px;
    transform: rotate(-45deg);
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--night-mode {
    background: #333333;
  }
  .l-dropdown-menu-user i.o-dropdown-menu__icon--night-mode svg {
    width: 16px;
    height: 20px;
  }
}
@media screen {
  .l-dropdown-menu-user .o-checkbox {
    right: 24px;
  }
}
@media screen and (max-width: 600px) {
  .l-dropdown-menu-user .o-checkbox {
    display: none;
  }
}
@media screen {
  .l-dropdown-menu-user--mini {
    right: -30px;
  }
}
@media screen {
  nav#c-pillar-navigation {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    background: #ffffff;
    box-shadow: 0px 2px 1px 0px rgba(0, 0, 0, 0.05);
    padding: 0 20px;
    overflow: hidden;
    touch-action: none;
    -webkit-overflow-scrolling: touch;
  }
}
@media screen and (max-width: 768px) {
  nav#c-pillar-navigation {
    padding: 0;
  }
}
@media screen {
  nav#c-pillar-navigation > div {
    width: 100%;
  }
}
@media screen {
  nav#c-pillar-navigation ul {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow-x: scroll;
  }
}
@media screen and (max-width: 600px) {
  nav#c-pillar-navigation ul {
    justify-content: flex-start;
  }
}
@media screen {
  nav#c-pillar-navigation ul li {
    padding: 0 15px;
    white-space: nowrap;
  }
}
@media screen and (max-width: 768px) {
  nav#c-pillar-navigation ul li:first-child {
    padding-left: 35px;
  }
}
@media screen and (max-width: 768px) {
  nav#c-pillar-navigation ul li:last-child {
    padding-right: 30px;
  }
}
@media screen {
  nav#c-pillar-navigation ul li a {
    font-size: 0.9375rem; /* 15/16 */
    font-weight: 600;
    color: #333333;
    text-decoration: none;
  }
  nav#c-pillar-navigation ul li a:hover {
    color: #158443;
  }
  nav#c-pillar-navigation ul li a.active {
    color: #158443;
  }
}
@media screen {
  footer#c-global-footer {
    background-color: #333333;
    padding: 30px;
    position: relative;
    z-index: 9999999;
    overflow: hidden;
  }
  footer#c-global-footer:before {
    content: "";
    position: absolute;
    top: -80px;
    right: 0;
    z-index: 0;
    width: 200px;
    height: 327px;
    background-image: url(/assets/artwork/devices-outline-06aea0bcb7c18d3c7df5a7abdc003d44a2e6925a3569cec2b23c230832283d8c.svg);
    background-size: 200px;
    background-repeat: no-repeat;
    opacity: 0.3;
  }
  footer#c-global-footer .c-global-footer__wrapper {
    max-width: 1380px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 2fr;
    grid-column-gap: 24px;
    position: relative;
  }
}
@media screen and (max-width: 1200px) {
  footer#c-global-footer .c-global-footer__wrapper {
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 1080px) {
  footer#c-global-footer .c-global-footer__wrapper {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-areas: "logo logo logo logo";
  }
}
@media screen and (max-width: 768px) {
  footer#c-global-footer .c-global-footer__wrapper {
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "logo logo";
  }
}
@media screen and (max-width: 600px) {
  footer#c-global-footer .c-global-footer__wrapper {
    grid-template-columns: 1fr;
    grid-template-areas: "logo";
  }
}
@media screen and (max-width: 1080px) {
  footer#c-global-footer .c-global-footer__wrapper .c-global-footer__logo {
    grid-area: logo;
    max-width: 25%;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 768px) {
  footer#c-global-footer .c-global-footer__wrapper .c-global-footer__logo {
    max-width: 100%;
  }
}
@media screen and (max-width: 768px) {
  footer#c-global-footer .c-global-footer__wrapper > div {
    padding-right: 0;
  }
}
@media screen {
  footer#c-global-footer .c-global-footer__wrapper > div .o-header-logo {
    width: 240px;
  }
  footer#c-global-footer .c-global-footer__wrapper > div .o-header-logo .o-header-logo__mark {
    position: relative;
    width: 40px;
    fill: #ffffff;
  }
}
@media screen {
  footer#c-global-footer .c-global-footer__wrapper > div h4 {
    color: #ffffff;
    font-size: 1rem; /* 18/16 */
  }
}
@media screen {
  footer#c-global-footer .c-global-footer__wrapper > div p {
    color: #A7ADB4;
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen and (max-width: 1200px) {
  footer#c-global-footer .c-global-footer__wrapper > div .c-global-footer__places {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 992px) {
  footer#c-global-footer .c-global-footer__wrapper > div .c-global-footer__places {
    grid-template-columns: 1fr;
  }
}
@media screen {
  footer#c-global-footer .c-global-footer__wrapper > div .c-global-footer__places li {
    margin-bottom: 10px;
  }
  footer#c-global-footer .c-global-footer__wrapper > div .c-global-footer__places li a {
    transition: border 0s;
  }
  footer#c-global-footer .c-global-footer__wrapper > div .c-global-footer__places li a:hover {
    border-bottom: 2px solid #73859F;
  }
}
@media screen {
  footer#c-global-footer .c-global-footer__wrapper > div .c-global-footer__newsletter-text img {
    max-width: 60px;
  }
}
@media screen and (max-width: 992px) {
  footer#c-global-footer .c-global-footer__wrapper > div .c-global-footer__newsletter-text img {
    display: none;
  }
}
@media screen {
  footer#c-global-footer .c-global-footer__wrapper > div ul li a {
    color: #A7ADB4;
    font-size: 0.875rem;
    text-decoration: none;
  }
}
@media screen {
  footer#c-global-footer .c-global-footer__wrapper > div input {
    width: 100%;
    margin-top: 21px;
  }
}
@media screen {
  footer#c-global-footer .c-global-footer__wrapper > div .o-icon-button--tiny {
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -12px;
  }
}
@media screen {
  footer#c-global-footer .c-global-footer__copyright {
    max-width: 1380px;
    margin: 50px auto 0;
    align-self: flex-end;
    position: relative;
    z-index: 1;
    border-top: 1px solid #434A53;
    padding-top: 30px;
  }
  footer#c-global-footer .c-global-footer__copyright ul {
    display: flex;
    justify-content: space-between;
  }
}
@media screen and (max-width: 768px) {
  footer#c-global-footer .c-global-footer__copyright ul {
    display: block;
    text-align: center;
  }
}
@media screen {
  footer#c-global-footer .c-global-footer__copyright ul li, footer#c-global-footer .c-global-footer__copyright ul a {
    font-size: 0.875rem; /* 14/16 */
    color: #A7ADB4;
  }
}
@media screen {
  footer#c-global-footer .c-global-footer__copyright ul a {
    text-decoration: none;
    transition: border 0s;
  }
  footer#c-global-footer .c-global-footer__copyright ul a:hover {
    border-bottom: 2px solid #73859F;
  }
}
@media screen and (max-width: 768px) {
  footer#c-global-footer .c-global-footer__copyright ul a {
    margin-top: 6px;
  }
}
@media screen {
  .c-tabs {
    display: flex;
    align-items: center;
    height: 54px;
    border-bottom: 2px solid #DBDDE0;
    width: 100%;
  }
  .c-tabs li {
    display: flex;
    align-items: center;
    font-size: 0.9375em; /* 15/16 */
    font-weight: 600;
    height: 100%;
    margin: 0 12px;
    cursor: pointer;
    position: relative;
    white-space: nowrap;
  }
  .c-tabs li:first-child {
    margin-left: 0;
  }
  .c-tabs li.c-tabs--active:before {
    content: "";
    bottom: -2px;
    left: 0;
    position: absolute;
    width: 100%;
    height: 2px;
    background: #157CB8;
  }
  .c-tabs li.c-tabs--title {
    font-family: "Bitter", serif;
    font-size: 2.25rem; /* 36/16 */
    font-weight: 700;
    letter-spacing: -0.5px;
    cursor: inherit;
  }
}
@media screen and (max-width: 768px) {
  .c-tabs li.c-tabs--title {
    display: none;
  }
}
@media screen {
  .c-tabs li.c-tabs--title:after {
    content: "";
    position: absolute;
    width: calc(100% + 30px);
    height: 2px;
    left: 0;
    bottom: -2px;
    background: #ffffff;
  }
}
@media screen {
  .c-tabs-wrapper {
    background: #333333;
    top: 0;
    z-index: 999;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .c-tabs-wrapper::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media screen {
  .c-tabs--emphasis {
    border-bottom: 0;
    height: 80px;
    position: relative;
    z-index: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-tabs--emphasis {
    width: calc(100% + 30px);
  }
}
@media screen {
  .c-tabs--emphasis ul {
    width: 100%;
    padding-left: 20px !important;
  }
}
@media screen {
  .c-tabs--emphasis .l-overflow-x {
    scrollbar-width: none;
  }
}
@media screen {
  .c-tabs--emphasis > li > ul > li {
    margin: 0;
  }
}
@media screen {
  .c-tabs--emphasis li {
    font-family: "Bitter", serif;
    font-weight: 700;
    font-size: 1.0625rem;
    letter-spacing: -0.25px;
  }
  .c-tabs--emphasis li span {
    font-weight: 500;
  }
  .c-tabs--emphasis li a {
    height: 44px;
    line-height: 44px;
    text-decoration: none;
    color: #ffffff;
    padding: 0 20px;
    z-index: 1;
  }
  .c-tabs--emphasis li a svg {
    fill: #ffffff;
  }
  .c-tabs--emphasis li .c-tabs__link--start {
    background: #3268A6;
    border-radius: 50px;
    margin-right: 20px;
  }
  .c-tabs--emphasis li .c-tabs__link--start:hover {
    background: #366fb2;
  }
  .c-tabs--emphasis li.c-tabs--active a {
    background: #158443;
    border-radius: 50px;
  }
}
@media screen {
  .c-tabs--dark {
    border-color: #434A53;
  }
}
@media screen {
  .c-tabs-navigation {
    background: #222222;
    display: flex;
    align-items: center;
    height: 72px;
    width: 100%;
    padding: 0 27px;
    overflow: hidden;
    overflow-x: scroll;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .c-tabs-navigation::-webkit-scrollbar {
    width: 0 !important;
  }
  .c-tabs-navigation::-webkit-scrollbar {
    display: none;
  }
  .c-tabs-navigation li {
    margin-left: 24px;
  }
  .c-tabs-navigation li:first-child {
    margin-left: 0;
  }
  .c-tabs-navigation li a {
    color: #A7ADB4;
    font-size: 0.9375rem; /* 15/16 */
    font-weight: 600;
    text-decoration: none;
  }
  .c-tabs-navigation li.c-tabs--active a {
    color: #ffffff;
    position: relative;
  }
  .c-tabs-navigation li.c-tabs--active a:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -27px;
    width: 100%;
    height: 3px;
    background: #158443;
  }
}
@media screen {
  .c-mobile-navigator {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 60px;
    line-height: 60px;
    background: #FAFAFA;
    grid-template-columns: 1fr 1fr 1fr;
    z-index: 9999;
    display: none;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
  }
}
@media screen and (max-width: 992px) {
  .c-mobile-navigator {
    display: grid;
  }
}
@media screen {
  .c-mobile-navigator li {
    text-align: center;
  }
  .c-mobile-navigator li a {
    width: 100%;
    height: 100%;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
    cursor: pointer;
  }
  .c-mobile-navigator li a:hover {
    background: #DBDDE0;
  }
}
@media screen {
  .c-nav-sidebar-my-interests--show {
    display: flex !important;
    flex-wrap: wrap;
    align-content: flex-start;
    width: 280px;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar-my-interests--show {
    display: none !important;
  }
}
@media screen {
  .c-nav-sidebar-my-interests--show .o-header-logo__text {
    visibility: visible !important;
  }
}
@media screen {
  .c-nav-sidebar-my-interests--show .c-nav-sidebar__menu-toggle--opener {
    display: none;
  }
}
@media screen {
  .c-nav-sidebar-my-interests--show .c-nav-sidebar__menu-toggle--closer {
    display: flex;
  }
}
@media screen {
  .c-nav-sidebar-my-interests--show .c-nav-sidebar__wrapper {
    display: block;
  }
}
@media screen {
  .c-nav-sidebar-my-interests--show-mobile {
    display: flex !important;
    flex-wrap: wrap;
    align-content: flex-start;
    width: 280px;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar-my-interests--show-mobile {
    display: block !important;
  }
}
@media screen and (min-width: 992px) {
  .c-nav-sidebar-my-interests--show-mobile {
    display: block !important;
    width: 80px;
  }
  .c-nav-sidebar-my-interests--show-mobile .o-header-logo__text {
    visibility: hidden !important;
  }
  .c-nav-sidebar-my-interests--show-mobile .c-nav-sidebar__wrapper {
    display: none !important;
  }
  .c-nav-sidebar-my-interests--show-mobile .c-nav-sidebar__menu-toggle--closer {
    display: none !important;
  }
  .c-nav-sidebar-my-interests--show-mobile .c-nav-sidebar__menu-toggle--opener {
    display: flex !important;
  }
}
@media screen and (max-width: 992px) {
  .c-nav-sidebar-my-interests--show-mobile {
    display: flex !important;
  }
}
@media screen {
  .c-nav-sidebar-my-interests--show-mobile .o-header-logo__text {
    visibility: visible !important;
  }
}
@media screen {
  .c-nav-sidebar-my-interests--show-mobile .c-nav-sidebar__menu-toggle--opener {
    display: none;
  }
}
@media screen {
  .c-nav-sidebar-my-interests--show-mobile .c-nav-sidebar__menu-toggle--closer {
    display: flex;
  }
}
@media screen {
  .c-nav-sidebar-my-interests--show-mobile .c-nav-sidebar__wrapper {
    display: block;
  }
}
@media screen {
  .c-book-header {
    background: #ffffff !important;
    justify-content: space-between;
    position: sticky !important;
    top: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-book-header {
    position: relative !important;
  }
}
@media screen and (max-width: 768px) {
  .c-book-header {
    justify-content: unset;
  }
}
@media screen {
  .c-book-header .c-global-header__logo {
    width: 50px !important;
  }
  .c-book-header .c-global-header__logo .o-header-logo__link:hover svg {
    fill: #158443 !important;
  }
}
@media screen {
  .c-book-header .o-profile-pic--small + i svg {
    fill: #959DA5;
  }
}
@media screen and (max-width: 768px) {
  .c-book-header .c-book-header__chapter-intro {
    display: block;
    font-size: 1rem;
  }
}
@media screen and (max-width: 768px) {
  .c-book-header .c-book-header__chapter-intro a, .c-book-header .c-book-header__chapter-intro span {
    display: block;
  }
}
@media screen {
  .c-book-header .c-book-header__chapter-title {
    display: inline-block;
    line-height: 1.25;
    display: flex !important;
    margin-right: -110px;
  }
}
@media screen and (max-width: 1080px) {
  .c-book-header .c-book-header__chapter-title {
    margin-right: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-book-header .c-book-header__chapter-title {
    padding-right: 30px;
  }
}
@media screen and (max-width: 600px) {
  .c-book-header .c-global-header__nav {
    position: relative !important;
    display: block !important;
    background: none !important;
    overflow: visible !important;
    padding: 0 !important;
    text-align: center;
  }
}
@media screen and (max-width: 600px) {
  .c-book-header .c-global-header__nav ul {
    width: 100%;
  }
}
@media screen {
  .c-book-header .c-global-header__nav ul li {
    margin-left: 18px !important;
  }
}
@media screen {
  .c-book-header .c-global-header__user {
    margin-left: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .c-book-header .c-global-header__user {
    margin-left: auto !important;
  }
}
@media screen and (max-width: 600px) {
  .c-book-header .c-global-header__user .c-global-header__action {
    display: none;
  }
}
@media screen {
  .c-book-header .login-link {
    color: #959DA5 !important;
  }
}
@media screen {
  .c-mobile-navigator--book {
    background: #FAFAFA;
  }
  .c-mobile-navigator--book a:hover {
    background: #DBDDE0 !important;
  }
}
@media screen {
  .c-paginator a {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-family: "Bitter", serif;
    font-weight: 700;
    font-size: 1.125rem; /* 18/16 */
    height: 72px;
    line-height: 72px;
    text-decoration: none;
    text-align: center;
    color: #333333;
    cursor: pointer;
  }
  .c-paginator a:hover {
    background: #F5F8FB;
  }
  .c-paginator a span {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .c-paginator a svg {
    width: 17px;
    height: 15px;
    fill: #A7ADB4;
  }
  .c-paginator .c-paginator__back:hover svg {
    transform: translateX(-5px);
  }
  .c-paginator .c-paginator__back span, .c-paginator .c-paginator__back svg {
    margin-right: auto;
    margin-right: auto;
  }
  .c-paginator .c-paginator__back span {
    margin-left: -41px;
  }
  .c-paginator .c-paginator__back svg {
    transition: all 0.25s;
    margin-left: 24px;
  }
  .c-paginator .c-paginator__forward:hover svg {
    transform: translateX(5px);
  }
  .c-paginator .c-paginator__forward span, .c-paginator .c-paginator__forward svg {
    margin-left: auto;
    margin-left: auto;
  }
  .c-paginator .c-paginator__forward span {
    margin-right: -41px;
  }
  .c-paginator .c-paginator__forward svg {
    transition: all 0.25s;
    margin-right: 24px;
  }
  .c-paginator .c-paginator__pages {
    display: flex;
  }
  .c-paginator .c-paginator__pages .c-paginator__pages--active {
    cursor: default;
    color: #A7ADB4;
    text-decoration: none;
  }
  .c-paginator .c-paginator__pages a {
    color: #158443;
    text-decoration: underline;
    margin: 0 8px;
  }
}
@media screen {
  .c-paginator--no-hover a:hover {
    background: none;
  }
}
@media screen {
  .c-notification-badge {
    position: fixed;
    z-index: 9999999;
    top: 36px;
    right: 36px;
    width: 320px;
    background: #ffffff;
    text-align: center;
    padding: 24px 0 30px;
    border-radius: 0.5625rem;
    box-shadow: 0 2px 24px 0 rgba(55, 55, 55, 0.1);
    animation: a-scale-in 1s;
  }
}
@media screen and (max-width: 992px) {
  .c-notification-badge {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: none;
  }
}
@media screen and (max-width: 600px) {
  .c-notification-badge {
    width: 90%;
  }
}
@media screen {
  .c-notification-badge .c-notification-badge__close {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 14px;
    right: 14px;
    width: 28px;
    height: 28px;
    cursor: pointer;
    border-radius: 0.5625rem;
    transition: background-color 0.5s;
  }
  .c-notification-badge .c-notification-badge__close:hover {
    background-color: #EFF3F6;
  }
  .c-notification-badge .c-notification-badge__close svg {
    width: 12px;
    height: 12px;
    fill: #333333;
  }
}
@media screen {
  .c-notification-badge img {
    min-height: 120px;
    width: 120px;
  }
}
@media screen {
  .c-notification-badge p {
    font-family: "Bitter", serif;
    font-weight: 700;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 1.125rem; /* 18/16 */
  }
}
@media screen {
  .c-notification-badge a {
    color: #6E7687;
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen {
  .c-form__section-title {
    width: 100%;
    font-size: 1.1875rem;
    font-family: "Bitter", serif;
    border-top: 1px solid #EFF3F6;
    padding-top: 30px;
    padding-bottom: 20px;
    margin-top: 16px;
  }
  .c-form__section-title:first-child {
    padding-top: 0;
    border-top: 0;
    margin-top: 0;
  }
}
@media screen {
  .c-form__info-cta {
    display: grid;
    grid-template-columns: 1fr auto;
  }
}
@media screen and (max-width: 768px) {
  .c-form__info-cta {
    display: block !important;
  }
}
@media screen {
  .c-form__info-cta p {
    font-size: 1rem;
    color: #6E7687;
    padding-right: 20px;
  }
}
@media screen {
  .c-form__info-cta a {
    white-space: nowrap;
    color: #158443;
  }
}
@media screen {
  .c-form__upload-photo {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 20px;
  }
  .c-form__upload-photo figure.c-form__upload-photo-image .o-profile-pic {
    display: block;
    margin: 0 auto;
  }
  .c-form__upload-photo [class*=button]:not([class*=button__]) {
    margin-top: 18px;
  }
  .c-form__upload-photo p {
    font-size: 0.9375rem;
    color: #6E7687;
    margin-top: 18px;
  }
}
@media screen {
  .c-login-form .o-input {
    width: 100%;
    margin-bottom: 15px;
  }
}
@media screen and (max-width: 992px) {
  .c-login-form > .l-fill-col {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-login-form > .l-form-col {
    width: 100%;
  }
}
@media screen {
  .c-login-form__wrapper {
    max-width: 360px;
    margin: 0 auto;
    padding: 120px 0;
  }
}
@media screen {
  .c-login-form__header {
    display: flex;
    align-items: baseline;
  }
  .c-login-form__header h3 {
    flex-grow: 1;
  }
}
@media screen {
  .c-login-form__form .form__validation--error {
    position: relative;
    top: -12px;
  }
}
@media screen {
  .c-login-form__terms {
    font-size: 0.875rem; /* 14/16 */
    color: #959DA5;
  }
  .c-login-form__terms a {
    color: #158443;
  }
}
@media screen {
  .c-login-form__copy {
    font-size: 0.9375rem; /* 15/16 */
    color: #959DA5;
  }
}
@media screen {
  .c-login-form__links {
    font-family: "Bitter", serif;
    font-weight: 500;
    font-size: 0.9375rem; /* 15/16 */
    color: #158443;
    text-decoration: underline;
    cursor: pointer;
  }
}
@media screen {
  .c-login-form__newsletter .form__validation--error {
    top: 3px;
    left: 32px;
  }
}
@media screen {
  .c-login-form__newsletter-message {
    display: block;
    color: #959DA5;
    font-size: 0.9375rem; /* 15/16 */
    padding-left: 32px;
  }
  .c-login-form__newsletter-message a {
    color: #158443;
  }
}
@media screen {
  .c-single-input-form {
    position: relative;
  }
  .c-single-input-form input {
    margin: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .c-single-input-form input {
    height: 50px;
  }
}
@media screen {
  .c-single-input-form button, .c-single-input-form a {
    position: absolute;
    right: 7px;
    top: 10px;
    margin-top: -3px;
  }
}
@media screen and (max-width: 768px) {
  .c-single-input-form button, .c-single-input-form a {
    right: 12px;
    top: 13px;
    margin-top: 0;
    padding: 0;
    background: none;
    height: 24px;
  }
  .c-single-input-form button .o-button__label, .c-single-input-form a .o-button__label {
    display: none;
  }
  .c-single-input-form button i, .c-single-input-form a i {
    margin: 0;
  }
}
@media screen {
  .c-list-item-wrapper {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    min-height: 75px;
    padding: 13px 24px;
    margin-bottom: 10px;
  }
}
@media screen {
  .c-table__row {
    display: flex;
    width: 100%;
    align-items: center;
  }
  .c-table__row .c-table__image {
    width: 54px;
    height: 54px;
    margin-right: 15px;
    background: #D6E0EF;
    border-radius: 0.5625rem;
    overflow: hidden;
  }
  .c-table__row .c-table__image img {
    width: 100%;
    height: 100%;
  }
  .c-table__row .c-table__image--offset {
    margin-left: -9px;
  }
  .c-table__row .c-table__copy {
    flex: 1;
  }
  .c-table__row .c-table__copy a {
    display: block;
    text-decoration: none;
  }
  .c-table__row .c-table__copy a:hover .c-table__row-title {
    color: #158443;
  }
  .c-table__row .c-table__copy .c-table__row-title {
    font-family: "Bitter", serif;
    font-size: 1.125rem;
    font-weight: 700;
    text-decoration: none;
    color: #333333;
    transition: all 0.3s;
    padding-right: 30px;
  }
  .c-table__row .c-table__copy .c-table__row-subtitle {
    font-size: 0.9375rem;
    text-decoration: none;
    color: #6E7687;
    padding-right: 45px;
  }
  .c-table__row .c-table__row-data {
    padding-right: 20px;
  }
  .c-table__row .c-table__row-data span {
    display: block;
  }
  .c-table__row .c-table__row-control {
    position: relative;
    margin-left: auto;
  }
  .c-table__row .c-table__row-control .c-table__row-checkbox {
    top: 50%;
    margin-top: -13.5px;
    right: 0;
  }
}
@media screen {
  .c-table-list {
    padding: 8px 24px;
  }
  .c-table-list .table__col-title {
    border-bottom: 1px solid #EFF3F6;
  }
  .c-table-list .c-table__row {
    padding: 21px 0;
    border-bottom: 1px solid #EFF3F6;
    align-items: top;
  }
  .c-table-list .c-table__row:last-child {
    border-bottom: 0;
  }
  .c-table-list .c-table__row .c-table__image {
    width: 42px;
    height: 42px;
  }
  .c-table-list .c-table__row .c-table__copy .c-table__row-title {
    font-size: 1.0625em;
  }
  .c-table-list .l-table__row--height {
    padding: 15px 0;
  }
  .c-table-list .c-table__header {
    padding: 10px 0;
  }
  .c-table-list .c-table__header span {
    font-family: "Bitter", serif;
    font-weight: 700;
    font-size: 1.125rem;
  }
}
@media screen {
  .c-box-list li {
    font-size: 0.9375rem; /* 15/16 */
    font-weight: 600;
    position: relative;
    margin-top: 18px;
    color: #ffffff;
    cursor: pointer;
    z-index: 1;
    padding-left: 30px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow-x: hidden;
  }
  .c-box-list li:first-child {
    margin-top: 0;
  }
  .c-box-list li:before {
    content: "";
    position: absolute;
    top: 1px;
    left: 0;
    width: 20px;
    height: 20px;
    border-radius: 0.4375rem; /* 7/16 */
    border: 2px solid #DBDDE0;
    z-index: -1;
  }
  .c-box-list li.c-box-list__item--active {
    cursor: auto;
  }
  .c-box-list li.c-box-list__item--active:before {
    background-image: url(/assets/svg-icons/chevron--white-5b5a863a30ba18e88b6250dd9ae968438a95342be885d585ee66ba9b73a1cfc8.png);
    background-size: cover;
  }
  .c-box-list li.c-box-list__item--active a:hover {
    color: #ffffff;
    cursor: auto;
  }
  .c-box-list li.c-box-list__item--complete {
    color: #158443;
    text-decoration: line-through;
  }
  .c-box-list li.c-box-list__item--complete:before {
    content: "";
    position: absolute;
    top: 1px;
    left: 0;
    width: 20px;
    height: 20px;
    background: #158443;
    background-image: url(/assets/svg-icons/checkmark-c892a399ec5e7c73a6cac886b1baac93a78bf5eab341469fd7de45c61c674ec0.png);
    background-size: cover;
    border-radius: 0.4375rem; /* 7/16 */
    border: 0;
  }
  .c-box-list li.c-box-list__item--complete a {
    color: #158443;
  }
  .c-box-list li.c-box-list__item--complete a .c-box-list__item-duration {
    color: #158443;
  }
  .c-box-list li.c-box-list__item--pending {
    opacity: 0.2;
  }
  .c-box-list li.c-box-list__item--pending .o-badge {
    display: none;
  }
  .c-box-list li.c-box-list__item--locked:before {
    content: "";
    position: absolute;
    top: 1px;
    left: 0;
    width: 20px;
    height: 20px;
    background: none;
    background-image: url(/assets/svg-icons/padlock-422049d82c4fd85a56375c162d817aea257aaa413a0445d8a84b3e94cb97d0c0.png) !important;
    background-size: cover !important;
    border-radius: 0; /* 7/16 */
    border: 0;
  }
  .c-box-list li a {
    display: flex;
    margin-left: -30px;
    padding-left: 30px;
    color: #ffffff;
    text-decoration: none;
    white-space: nowrap;
  }
  .c-box-list li a:hover {
    color: #158443;
  }
  .c-box-list li a .c-box-list__item-number {
    margin-right: 3px;
  }
  .c-box-list li a .c-box-list__item-duration {
    margin-left: auto;
    color: #A7ADB4;
  }
  .c-box-list li a .c-box-list__item-title {
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
  }
}
@media screen {
  .c-box-list--linked li:first-child:after {
    display: none;
  }
  .c-box-list--linked li:after {
    content: "";
    position: absolute;
    top: -15px;
    left: 9px;
    width: 2px;
    height: 12px;
    background: #585E66;
  }
}
@media screen {
  .c-box-list--black li {
    color: #333333;
    font-weight: 400;
  }
  .c-box-list--black li.c-box-list__item--active:before {
    background-image: url(/assets/svg-icons/chevron--black-454278cfec6d2fd7013bd089533ed0fa999a8811f872991b37387fc67a6a5144.png);
    background-size: cover;
  }
  .c-box-list--black a {
    color: #333333 !important;
    text-decoration: none;
  }
  .c-box-list--black a:hover {
    color: #158443 !important;
  }
}
@media screen {
  .c-box-list--checked li {
    cursor: inherit;
  }
  .c-box-list--checked li:before {
    background-image: url(/assets/svg-icons/checkmark-c892a399ec5e7c73a6cac886b1baac93a78bf5eab341469fd7de45c61c674ec0.png);
    background-size: cover;
    border: 2px solid #ffffff;
  }
}
@media screen {
  .l-list-item-wrapper:first-child {
    margin-top: 30px;
  }
}
@media screen {
  .c-onboarding-progress {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .c-onboarding-progress li {
    min-width: 27px;
    height: 27px;
    background: #333333;
    border-radius: 0.5625rem;
    font-family: "Bitter", serif;
    font-weight: 700;
    color: #ffffff;
    text-align: center;
    position: relative;
  }
  .c-onboarding-progress li .c-onboarding-progress__step {
    line-height: 26px;
  }
  .c-onboarding-progress li.c-onboarding-progress__bar {
    background: #DFE7F0;
    width: 100%;
    height: 6px;
    border-radius: 100px;
    margin: 0 9px;
  }
  .c-onboarding-progress li.c-onboarding-progress__bar.c-onboarding-progress__bar--in-progress:before {
    content: "";
    width: 50%;
    height: 100%;
    border-radius: 100px;
    background: #158443;
    position: absolute;
    left: 0;
  }
  .c-onboarding-progress li.c-onboarding-progress__bar.c-onboarding-progress__bar--complete {
    background: #158443;
  }
  .c-onboarding-progress li.c-onboarding-progress--complete {
    background: #158443;
    background-image: url(/assets/svg-icons/checkmark-c892a399ec5e7c73a6cac886b1baac93a78bf5eab341469fd7de45c61c674ec0.png);
    background-size: cover;
  }
  .c-onboarding-progress li.c-onboarding-progress--complete .c-onboarding-progress__step {
    display: none;
  }
  .c-onboarding-progress li.c-onboarding-progress--complete .o-tooltip {
    background: #158443;
  }
  .c-onboarding-progress li.c-onboarding-progress--complete .o-tooltip:after {
    background: #158443;
  }
  .c-onboarding-progress li .o-tooltip {
    visibility: visible;
    opacity: 1;
    top: -50px;
    height: 36px;
    line-height: 17px;
  }
}
@media screen and (max-width: 992px) {
  .c-onboarding-progress li .o-tooltip {
    display: none;
  }
}
@media screen {
  .c-onboarding-progress li .o-tooltip:after {
    top: 20px;
  }
}
@media screen {
  .c-onboarding-progress-circular {
    position: absolute;
    top: 150px;
    left: 50%;
    margin-left: -576px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: column;
    align-content: center;
    align-items: center;
    width: 36px;
  }
}
@media screen and (max-width: 1200px) {
  .c-onboarding-progress-circular {
    left: 30px;
    margin-left: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-onboarding-progress-circular {
    display: none;
  }
}
@media screen {
  .c-onboarding-progress-circular li:nth-child(odd) {
    width: 22px;
    height: 22px;
    border-radius: 100px;
    border: 6px solid #DBDDE0;
    position: relative;
    z-index: 1;
  }
  .c-onboarding-progress-circular li:nth-child(odd) span {
    opacity: 0;
  }
}
@media screen {
  .c-onboarding-progress-circular li.c-onboarding-progress--complete:nth-child(odd) {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: #158443;
    border-radius: 100px;
    font-family: "Bitter", serif;
    font-weight: bold;
    color: #ffffff;
    border: none;
  }
  .c-onboarding-progress-circular li.c-onboarding-progress--complete:nth-child(odd) span {
    opacity: 1;
  }
}
@media screen {
  .c-onboarding-progress-circular li:nth-child(even) {
    width: 6px;
    height: 80px;
    background: #DBDDE0;
    margin-top: -5px;
    margin-bottom: -5px;
    position: relative;
    z-index: 0;
    overflow: hidden;
  }
}
@media screen {
  .c-onboarding-progress-circular li.c-onboarding-progress__bar--complete:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #158443;
  }
}
@media screen {
  .c-item-list-icon li {
    padding-left: 33px;
    font-family: "Bitter", serif;
    font-weight: 700;
    font-size: 1.0625rem; /* 17/16 */
    margin-top: 15px;
    position: relative;
  }
  .c-item-list-icon li:first-child {
    margin-top: 0;
  }
  .c-item-list-icon li:before {
    content: "";
    width: 24px;
    height: 24px;
    position: absolute;
    left: 0;
  }
}
@media screen {
  .c-item-list-icon--arrow-right li:before {
    background-image: url(/assets/svg-icons/arrow-right--clear-green-40db3118f25edfdd310ed4a1c7c26857ec61928061ed7b77ef9d64b716bae0ed.png);
    background-size: cover;
  }
}
@media screen {
  .c-item-list-icon--checkmark li:before {
    background-image: url(/assets/svg-icons/checkmark--clear-green-e7cb550028b55997c9619c790965bfe6f3cbd9a1b6f6593a4c8e7d9cd9cbdb84.png);
    background-size: cover;
  }
}
@media screen {
  .c-list-filter li {
    margin-top: 18px;
  }
  .c-list-filter li:first-child {
    margin-top: 0;
  }
  .c-list-filter .c-list-filter__label {
    font-size: 0.9375rem; /* 15/16 */
    padding-left: 36px;
  }
}
@media screen {
  .c-list-filter--dark .c-list-filter__label {
    color: #ffffff;
  }
}
@media screen {
  .c-version-history-table .c-version-history-table__row {
    margin-top: 18px;
    padding-bottom: 15px;
    border-bottom: 1px solid #DFE7F0;
  }
  .c-version-history-table .c-version-history-table__row h3 {
    font-size: 1.3125rem; /* 21/16 */
    line-height: 1.25;
  }
}
@media screen and (max-width: 768px) {
  .c-version-history-table .c-version-history-table__row h3 {
    font-size: 1.1875rem; /* 19/16 */
  }
}
@media screen {
  .c-version-history-table .c-version-history-table__row .c-version-history-table__meta {
    display: block;
    font-size: 0.9375rem; /* 15/16 */
    margin-top: 6px;
  }
}
@media screen {
  .c-version-history-table .c-version-history-table__row .c-version-history-table__links {
    margin-top: 3px;
  }
  .c-version-history-table .c-version-history-table__row .c-version-history-table__links a, .c-version-history-table .c-version-history-table__row .c-version-history-table__links span {
    font-size: 0.9375rem; /* 15/16 */
    color: #158443;
  }
}
@media screen {
  .c-activity-checklist .c-activity-checklist__entry {
    margin-bottom: 21px;
  }
  .c-activity-checklist .c-activity-checklist__entry .c-activity-checklist__entry__top {
    height: 24px;
    position: relative;
    display: flex;
    align-items: center;
  }
  .c-activity-checklist .c-activity-checklist__entry .c-activity-checklist__entry__top > button svg {
    fill: #798494;
    width: 15px;
    height: 9px;
    position: absolute;
    top: 6px;
    right: 0;
  }
  .c-activity-checklist .c-activity-checklist__entry .c-activity-checklist__entry__bottom {
    padding-left: 39px;
  }
  .c-activity-checklist .c-activity-checklist__entry .c-activity-checklist__entry__number {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    background-color: #E9EBEC;
    font-family: "Bitter", serif;
    font-size: 0.8125rem; /* 13/16 */
    font-weight: bold;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 100%;
  }
  .c-activity-checklist .c-activity-checklist__entry .c-activity-checklist__entry__title {
    font-size: 0.9375rem; /* 15/16 */
    letter-spacing: 0.25px;
    padding-left: 39px;
    white-space: nowrap;
    max-width: 100%;
    width: calc(100% - 20px);
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .c-activity-checklist .c-activity-checklist__entry .o-button-disclose--small {
    position: absolute;
    width: 100%;
    height: 100%;
  }
  .c-activity-checklist .c-activity-checklist__entry .c-activity-checklist__entry__desc {
    font-size: 0.8125rem; /* 13/16 */
    color: #6E7687;
    margin-top: 9px;
  }
  .c-activity-checklist .c-activity-checklist__entry .c-activity-checklist__entry__action {
    display: inline-flex;
    background-color: #158443;
    font-size: 0.75rem; /* 12/16 */
    font-weight: 700;
    color: #ffffff;
    padding: 9px 13px;
    border-radius: 0.5625rem;
    margin-top: 15px;
    cursor: pointer;
    text-decoration: none;
  }
  .c-activity-checklist .c-activity-checklist__entry--completed .c-activity-checklist__entry__title {
    text-decoration: line-through;
  }
  .c-activity-checklist .c-activity-checklist__entry--completed .c-activity-checklist__entry__number {
    background-color: #158443;
  }
  .c-activity-checklist .c-activity-checklist__entry--completed .c-activity-checklist__entry__number svg {
    fill: #ffffff;
    width: 12px;
    height: 10px;
  }
}
@media screen {
  .c-admin-draper-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .c-admin-draper-wrapper .l-half-col {
    width: calc(50% - 10px);
  }
}
@media screen and (max-width: 600px) {
  .c-admin-draper-wrapper .l-half-col {
    width: 100%;
  }
}
@media screen {
  .c-admin-draper {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    display: flex;
    margin-top: 15px;
    padding: 24px 30px;
    min-height: 196px;
    overflow: hidden;
  }
}
@media screen and (max-width: 600px) {
  .c-admin-draper {
    min-height: auto;
  }
}
@media screen {
  .c-admin-draper:first-child {
    margin-top: 0;
  }
}
@media screen {
  .c-admin-draper > div {
    display: flex;
    flex-wrap: wrap;
  }
}
@media screen {
  .c-admin-draper .c-admin-draper__copy {
    padding-right: 30px;
    flex-grow: 1;
  }
  .c-admin-draper .c-admin-draper__copy .c-admin-draper__title {
    width: 100%;
    font-size: 1.3125rem;
    line-height: 1.25;
  }
}
@media screen and (max-width: 600px) {
  .c-admin-draper .c-admin-draper__copy .c-admin-draper__title {
    font-size: 1.3125rem;
  }
}
@media screen {
  .c-admin-draper .c-admin-draper__copy .c-admin-draper__subtitle {
    width: 100%;
    font-size: 0.9375rem;
    color: #6E7687;
    margin-top: 6px;
  }
}
@media screen {
  .c-admin-draper .c-admin-draper__copy a {
    margin-top: 30px;
    align-self: flex-end;
  }
}
@media screen {
  .c-admin-draper .c-admin-draper__copy--large {
    min-height: 240px;
  }
}
@media screen and (max-width: 600px) {
  .c-admin-draper .c-admin-draper__copy--large {
    min-height: auto;
  }
}
@media screen {
  .c-admin-draper .c-admin-draper__copy--large .c-admin-draper__title {
    font-size: 2.25rem;
  }
}
@media screen and (max-width: 600px) {
  .c-admin-draper .c-admin-draper__copy--large .c-admin-draper__title {
    font-size: 1.3125rem;
  }
}
@media screen {
  .c-admin-draper .c-admin-draper__copy--large .c-admin-draper__subtitle {
    font-size: 1rem;
    padding-right: 10%;
  }
}
@media screen and (max-width: 600px) {
  .c-admin-draper .c-admin-draper__copy--large .c-admin-draper__subtitle {
    font-size: 0.9375rem;
    padding-right: 0;
  }
}
@media screen {
  .c-admin-draper .c-admin-draper__artwork {
    width: 90px;
    height: 90px;
    align-self: center;
  }
}
@media screen and (min-width: 993px) and (max-width: 1080px) {
  .c-admin-draper .c-admin-draper__artwork {
    width: 60px;
    height: 60px;
  }
}
@media screen and (max-width: 768px) {
  .c-admin-draper .c-admin-draper__artwork {
    align-self: flex-start;
    width: 60px;
    height: 60px;
  }
}
@media screen {
  .c-admin-draper .c-admin-draper__artwork img {
    min-width: 100%;
    height: 100%;
  }
}
@media screen {
  .c-admin-draper .c-admin-draper__artwork--large {
    width: 210px;
    height: 210px;
  }
}
@media screen and (max-width: 600px) {
  .c-admin-draper .c-admin-draper__artwork--large {
    width: 60px;
    height: 60px;
  }
}
@media screen {
  .c-admin-draper--large {
    min-height: 300px;
  }
}
@media screen and (max-width: 600px) {
  .c-admin-draper--large {
    min-height: auto;
  }
}
@media screen {
  .l-custom-admin-draper--large {
    width: 360px !important;
    height: 304px !important;
    margin-top: -30px;
    margin-right: -30px;
    align-self: flex-start !important;
  }
}
@media screen and (min-width: 993px) and (max-width: 1080px) {
  .l-custom-admin-draper--large {
    width: 300px !important;
    height: 250px !important;
  }
}
@media screen and (max-width: 600px) {
  .l-custom-admin-draper--large {
    width: 140px !important;
    height: 120px !important;
  }
}
@media screen {
  .c-banner-draper {
    height: 140px;
    overflow: hidden;
    z-index: 9999;
    position: relative;
  }
  .c-banner-draper:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper {
    height: auto;
    padding-top: 30px;
    padding-bottom: 30px;
  }
}
@media screen {
  .c-banner-draper .c-banner-draper__wrapper {
    height: 100%;
    position: relative;
    z-index: 1;
  }
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__flex-wrapper {
    display: flex;
    align-items: center;
    height: 100%;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__flex-wrapper {
    display: grid;
    grid-template-columns: auto auto;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__flex-wrapper {
    grid-template-columns: 1fr;
  }
}
@media screen {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__art {
    height: 100%;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__art {
    display: none;
  }
}
@media screen {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__art img {
    position: relative;
  }
}
@media screen {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__copy {
    margin-left: 24px;
    margin-right: 24px;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__copy {
    margin-left: 0;
  }
}
@media screen {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__copy h2 {
    display: flex;
    align-items: center;
    font-size: 1.6875rem; /* 27/16 */
    color: #ffffff;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__copy h2 {
    font-size: 1.5rem; /* 24/16 */
  }
}
@media screen {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__copy h2 a {
    color: #ffffff;
  }
}
@media screen {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__copy h2 .o-badge {
    position: relative;
    vertical-align: middle;
    margin-left: 14px;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__copy .c-banner-draper__copy-header--large {
    font-size: 1.5rem !important; /* 24/16 */
  }
}
@media screen {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__copy p {
    font-family: "Bitter", serif;
    font-size: 1.0625rem; /* 17/16 */
    color: #F2F6FA;
    margin-top: 5px;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__copy p {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__action {
    margin-left: auto;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper .c-banner-draper__wrapper .c-banner-draper__action {
    margin-top: 18px;
    margin-left: 0;
  }
}
@media screen {
  .c-banner-draper--no-height {
    height: auto;
    padding-top: 30px;
    padding-bottom: 30px;
  }
}
@media screen {
  .c-banner-draper--ios {
    background-color: #F64E1A;
  }
  .c-banner-draper--ios:before {
    background-image: url(/assets/patterns/ios-pattern@2x-afa82e7a21383f962e6cc10db0d78ffebb131d0ccd9727b43e238d7322e0ad12.png);
    background-size: cover;
  }
  .c-banner-draper--ios .c-banner-draper__art {
    width: 222px;
    margin-left: -30px;
  }
  .c-banner-draper--ios .c-banner-draper__art img {
    top: 24px;
  }
}
@media screen {
  .c-banner-draper--android {
    background-image: linear-gradient(to right, #0575e6, #00a0ff, #00c3f4, #00deb5, #00f260);
  }
  .c-banner-draper--android:before {
    background-image: url(/assets/patterns/android-pattern@2x-0acfc99c22ba9a9593d5d397392601e47bb5a1a8d5c1090f340a5d0c299f444b.png);
    background-size: cover;
  }
  .c-banner-draper--android .c-banner-draper__art {
    width: 140px;
  }
  .c-banner-draper--android .c-banner-draper__art img {
    top: 20px;
  }
}
@media screen {
  .c-banner-draper--server-side-swift {
    background-color: #363B44;
  }
  .c-banner-draper--server-side-swift:before {
    background-image: url(/assets/patterns/server-side-swift-pattern@2x-f3dba2893826ed475bdd037b3b0397a8c096e2f21aee50d77781af37a953f59f.png);
    background-size: cover;
  }
  .c-banner-draper--server-side-swift .c-banner-draper__art {
    width: 140px;
  }
  .c-banner-draper--server-side-swift .c-banner-draper__art img {
    width: 100%;
  }
  .c-banner-draper--server-side-swift .o-button--dark {
    background: #FD7401;
  }
  .c-banner-draper--server-side-swift .o-button--dark svg {
    fill: #FD7401;
  }
}
@media screen {
  .c-banner-draper--unity {
    background-color: #194A85;
  }
  .c-banner-draper--unity:before {
    background-image: url(/assets/patterns/unity-pattern@2x-ea54493ebce63300483f86d19b76151ab61e9b720dd2ffa7a9692f687f5d7985.png);
    background-size: cover;
  }
  .c-banner-draper--unity .c-banner-draper__art {
    width: 160px;
  }
  .c-banner-draper--unity .c-banner-draper__art img {
    top: 20px;
  }
}
@media screen {
  .c-banner-draper--flutter {
    background-color: #096ABB;
  }
  .c-banner-draper--flutter:before {
    background-image: url(/assets/patterns/flutter-pattern@2x-9e12512906f6b2a385152d09df75b94627d2f703c2c564245c1fdfc144f4eacf.png);
    background-size: cover;
  }
  .c-banner-draper--flutter .c-banner-draper__art {
    width: 160px;
  }
  .c-banner-draper--flutter .c-banner-draper__art img {
    top: 20px;
  }
}
@media screen {
  .c-banner-draper--unreal-engine {
    background-color: #79376C;
  }
  .c-banner-draper--unreal-engine:before {
    background-image: url(/assets/patterns/unreal-engine-pattern@2x-48474441fbdadf19f554060204e7e715fdf4a428bb0ab43345320402699c5be0.png);
    background-size: cover;
  }
  .c-banner-draper--unreal-engine .c-banner-draper__art {
    width: 172px;
  }
  .c-banner-draper--unreal-engine .c-banner-draper__art img {
    top: 20px;
  }
}
@media screen {
  .c-banner-draper--macos {
    background-color: #41AEA4;
  }
  .c-banner-draper--macos:before {
    background-image: url(/assets/patterns/macos-pattern@2x-ef0d6844edb6e457193f139c0ccfa6fd5bf50c13a07ea14791c1befbc290d0ab.png);
    background-size: cover;
  }
  .c-banner-draper--macos .c-banner-draper__art {
    width: 172px;
  }
  .c-banner-draper--macos .c-banner-draper__art img {
    top: 20px;
  }
}
@media screen {
  .c-banner-draper--archive {
    background-color: #333333;
  }
  .c-banner-draper--archive:before {
    background-image: url(/assets/patterns/archive-pattern@2x-1ce809bc4aa1a52ab4319309866b6e042d0148b4bcc20f4f63344adeb7d7363b.png);
    background-size: cover;
  }
  .c-banner-draper--archive .c-banner-draper__art {
    width: 120px;
  }
  .c-banner-draper--archive .c-banner-draper__art img {
    top: 30px;
  }
}
@media screen {
  .c-banner-draper--podcast {
    background-color: #333333;
  }
  .c-banner-draper--podcast:before {
    background-image: url(/assets/patterns/podcast-pattern@2x-e0178d0b9c54e1e3a503e42e111d2098c5057345f09b3cdc5fb5aa162b4135de.png);
    background-size: cover;
  }
  .c-banner-draper--podcast .c-banner-draper__copy p {
    max-width: 720px;
  }
  .c-banner-draper--podcast .c-banner-draper__art {
    width: 120px;
  }
  .c-banner-draper--podcast .c-banner-draper__art img {
    top: 30px;
  }
}
@media screen {
  .c-banner-draper--mobile-app {
    background: #F2F6FA;
  }
  .c-banner-draper--mobile-app h2, .c-banner-draper--mobile-app p {
    color: #333333 !important;
  }
  .c-banner-draper--mobile-app .c-banner-draper__art img {
    width: 180px;
    top: 10px;
  }
}
@media screen {
  .c-banner-draper--campaign {
    height: auto;
    min-height: 140px;
    display: flex;
    align-items: center;
    padding: 30px 0;
  }
  .c-banner-draper--campaign .c-banner-draper__copy p {
    margin-top: 9px;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-draper--campaign .c-banner-draper__copy p {
    padding-right: 0;
  }
}
@media screen {
  .c-banner-draper--account {
    background-color: #333333;
  }
  .c-banner-draper--account:before {
    background-image: url(/assets/patterns/flare-relate-pattern--dark-teal-ae0808f8dec26eea570712492e5bbdfe208f598016b1be055ba108966a73eb5f.png);
    background-size: cover;
  }
  .c-banner-draper--account .c-banner-draper__art {
    width: 300px;
  }
  .c-banner-draper--account .c-banner-draper__art img {
    top: 20px;
    margin-top: -40px;
    margin-bottom: -60px;
  }
}
@media screen {
  .c-banner-draper--account-list {
    padding-bottom: 60px;
  }
  .c-banner-draper--account-list:before {
    background-image: url(/assets/patterns/large-geometric-relate-pattern--dark-83ce2ab52da02a0fda9a08230d73ce14f6dbd16193a6eb1e339e35429af2ffcc.png);
    background-size: cover;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper--account-list .l-block-wrapper {
    width: 100%;
  }
}
@media screen {
  .c-banner-draper--account-list h2 {
    font-size: 1.875rem !important; /* 30/16 */
    line-height: 1.35 !important;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-draper--account-list h2 {
    font-size: 1.5rem !important; /* 24/16 */
    line-height: 1.25 !important;
  }
}
@media screen {
  .c-banner-draper--account-list .c-banner-draper__art {
    width: 240px;
    min-width: 240px;
    margin-left: auto;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper--account-list .c-banner-draper__art {
    display: block !important;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-draper--account-list .c-banner-draper__art {
    display: none !important;
  }
}
@media screen {
  .c-banner-draper--account-list .c-banner-draper__art img {
    top: 0;
    margin-top: 0;
    margin-bottom: 0;
  }
}
@media screen {
  .c-banner-draper--account-list .c-box-list li {
    font-family: "Bitter", serif;
    font-size: 1.0625rem; /* 17/16 */
  }
}
@media screen and (max-width: 768px) {
  .c-banner-draper--account-list .c-box-list li {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .c-banner-draper--account-list .c-box-list li:before {
    top: 3px;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-draper--account-list .c-box-list li:before {
    top: 1px;
  }
}
@media screen {
  .c-banner-draper--newsletter {
    background-color: #158443;
  }
  .c-banner-draper--newsletter:before {
    background-image: url(/assets/patterns/geometric-relate-pattern--dark-e78f59cb4699e24d8f72a0d8d6d16483af21c3fd818ce1b9c417a5cc8733f466.png);
    background-size: cover;
  }
  .c-banner-draper--newsletter .c-banner-draper__art {
    width: 200px;
  }
  .c-banner-draper--newsletter .c-banner-draper__art img {
    margin-bottom: -120px;
  }
}
@media screen {
  .c-banner-draper--subscription {
    background-color: #FDCF74;
    padding: 45px 0;
  }
  .c-banner-draper--subscription .c-banner-draper__flex-wrapper {
    max-width: 912px;
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 26px;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper--subscription .c-banner-draper__flex-wrapper {
    grid-template-columns: 1fr !important;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper--subscription h2 {
    white-space: normal;
  }
}
@media screen {
  .c-banner-draper--subscription h2, .c-banner-draper--subscription p {
    color: #333333 !important;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper--subscription h2, .c-banner-draper--subscription p {
    display: block !important;
  }
}
@media screen {
  .c-banner-draper--subscription .c-banner-draper__copy {
    margin: 0 !important;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper--subscription .c-banner-draper__copy {
    order: 2;
    text-align: center;
    max-width: 560px;
    margin: 30px auto 0 !important;
  }
}
@media screen {
  .c-banner-draper--subscription .c-banner-draper__art {
    width: 100%;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper--subscription .c-banner-draper__art {
    display: block !important;
    order: 1;
    max-width: 442px;
    margin: 0 auto;
  }
}
@media screen {
  .c-banner-draper--subscription .c-banner-draper__art img {
    width: 100%;
  }
}
@media screen {
  .c-banner-draper--pro-subscription {
    background-color: #157CB8 !important;
  }
  .c-banner-draper--pro-subscription h2, .c-banner-draper--pro-subscription p {
    color: #ffffff !important;
  }
}
@media screen {
  .c-banner-draper--pro-subscription-wide:before {
    content: "";
    position: absolute;
    left: -100px;
    bottom: 0;
    top: auto;
    width: 340px;
    height: 210px;
    background-image: url(/assets/patterns/illustration-pro-subscription-items-banner--left@2x-31f3916e8318791188fa174cb5fd47adc10c8e806d2da943a1b78dfd31889771.png);
    background-size: cover;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper--pro-subscription-wide:before {
    left: -200px;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper--pro-subscription-wide:before {
    left: -275px;
  }
}
@media screen {
  .c-banner-draper--pro-subscription-wide:after {
    content: "";
    position: absolute;
    right: -100px;
    bottom: 0;
    top: auto;
    width: 340px;
    height: 210px;
    background-image: url(/assets/patterns/illustration-pro-subscription-items-banner--right@2x-6bf8ea3b615a092f7f47b771138f6a592cf6271a629929cca837f667f4a7a6b2.png);
    background-size: cover;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper--pro-subscription-wide:after {
    right: -200px;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper--pro-subscription-wide:after {
    right: -275px;
  }
}
@media screen {
  .c-banner-draper--team-subscription {
    background: #A5CEB5;
  }
  .c-banner-draper--team-subscription .c-banner-draper__art {
    display: inline-table;
    width: 420px;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-draper--team-subscription .c-banner-draper__art {
    max-width: 300px;
    width: 100%;
  }
}
@media screen {
  .c-banner-draper--path {
    background-color: #333333;
  }
  .c-banner-draper--path .c-banner-draper__action {
    position: relative;
    top: 20px;
    min-width: 250px;
    margin-bottom: -50px;
    padding-right: 60px;
  }
  .c-banner-draper--path .c-banner-draper__action .c-box-list {
    max-height: 240px;
  }
  .c-banner-draper--path .c-banner-draper__action .c-box-list li {
    overflow-x: visible;
    cursor: inherit;
  }
  .c-banner-draper--path .c-banner-draper__action .c-box-list li:nth-child(1) {
    opacity: 0.9;
  }
  .c-banner-draper--path .c-banner-draper__action .c-box-list li:nth-child(2) {
    opacity: 0.8;
  }
  .c-banner-draper--path .c-banner-draper__action .c-box-list li:nth-child(3) {
    opacity: 0.7;
  }
  .c-banner-draper--path .c-banner-draper__action .c-box-list li:nth-child(4) {
    opacity: 0.6;
  }
  .c-banner-draper--path .c-banner-draper__action .c-box-list li:nth-child(5) {
    opacity: 0.5;
  }
  .c-banner-draper--path .c-banner-draper__action .c-box-list li:nth-child(6) {
    opacity: 0.4;
  }
  .c-banner-draper--path .c-banner-draper__action .c-box-list li:nth-child(7) {
    opacity: 0.3;
  }
  .c-banner-draper--path .c-banner-draper__action .c-box-list li:nth-child(8) {
    opacity: 0.2;
  }
  .c-banner-draper--path .c-banner-draper__action .c-box-list li:nth-child(9) {
    opacity: 0.1;
  }
  .c-banner-draper--path .c-banner-draper__action .c-box-list li:after {
    background: #ffffff;
    border-radius: 100px;
  }
}
@media screen {
  .c-banner-draper--path-android {
    background-color: #C9DC8D;
  }
  .c-banner-draper--path-android .c-banner-draper__wrapper:before {
    content: "";
    width: 167px;
    height: 165px;
    position: absolute;
    left: -167px;
    top: 50%;
    margin-top: -84px;
    background-image: url(/assets/artwork/illustration-android-path-1-4816269d716633f79033611fb0061cbebcd3f396eeb63a3097b896ff07ed1377.svg);
    background-size: cover;
  }
  .c-banner-draper--path-android .c-banner-draper__wrapper:after {
    content: "";
    width: 175px;
    height: 168px;
    position: absolute;
    right: -175px;
    top: 50%;
    margin-top: -86px;
    background-image: url(/assets/artwork/illustration-android-path-2-926e39e35948a8c71e63e5488048173dd116bd1c8ba55d3f7cfbf861ff732e6a.svg);
    background-size: cover;
  }
}
@media screen {
  .c-banner-draper--path-ios {
    background-color: #FCAC6D;
  }
  .c-banner-draper--path-ios .c-banner-draper__wrapper:before {
    content: "";
    width: 167px;
    height: 175px;
    position: absolute;
    left: -167px;
    top: 50%;
    margin-top: -90px;
    background-image: url(/assets/artwork/illustration-ios-path-2-645ab9db690dfe533b48c574033de0e8219b6d3cad6257dce06b35e0df7d6e79.svg);
    background-size: cover;
  }
  .c-banner-draper--path-ios .c-banner-draper__wrapper:after {
    content: "";
    width: 195px;
    height: 158px;
    position: absolute;
    right: -195px;
    top: 50%;
    margin-top: -80px;
    background-image: url(/assets/artwork/illustration-ios-path-1-b38bf847db51e4c39d55d606c9068dc264153f3cb6cd806b5d0f7f111219dbc4.svg);
    background-size: cover;
  }
}
@media screen {
  .c-banner-draper--path-flutter {
    background-color: #C7E7F6;
  }
  .c-banner-draper--path-flutter .c-banner-draper__wrapper:before {
    content: "";
    width: 170px;
    height: 130px;
    position: absolute;
    left: -170px;
    top: 50%;
    margin-top: -65px;
    background-image: url(/assets/artwork/illustration-flutter-path-1-2826a5fe356022558251511fe47191025b8ca62ffe74d36760ad5e147de7a60c.svg);
    background-size: cover;
  }
  .c-banner-draper--path-flutter .c-banner-draper__wrapper:after {
    content: "";
    width: 222px;
    height: 134px;
    position: absolute;
    right: -222px;
    top: 50%;
    margin-top: -67px;
    background-image: url(/assets/artwork/illustration-flutter-path-2-b50f3988f24008897d0f68918cb8c4b6cd1cbdfac5f777776dfe45e3aa35781e.svg);
    background-size: cover;
  }
}
@media screen {
  .c-banner-draper--path-unity {
    background-color: #8CBDDA;
  }
  .c-banner-draper--path-unity .c-banner-draper__wrapper:before {
    content: "";
    width: 185px;
    height: 165px;
    position: absolute;
    left: -185px;
    top: 50%;
    margin-top: -75px;
    background-image: url(/assets/artwork/illustration-unity-path-1-648e7bb4411b2adeb3f71dded5c1f2cd1a0f7b88ad424e4e8b8a380db7dcc759.svg);
    background-size: cover;
  }
  .c-banner-draper--path-unity .c-banner-draper__wrapper:after {
    content: "";
    width: 155px;
    height: 166px;
    position: absolute;
    right: -155px;
    top: 50%;
    margin-top: -83px;
    background-image: url(/assets/artwork/illustration-unity-path-2-4688f78d49e6a90c49bb8125a20b9c2c9086b559322c44197dfe0669a13ecdb9.svg);
    background-size: cover;
  }
}
@media screen {
  .c-banner-draper--black-friday-2020 h2, .c-banner-draper--black-friday-2020 p {
    color: #ffffff !important;
  }
}
@media screen {
  .c-banner-related {
    padding: 45px 0;
    overflow: hidden;
    position: relative;
  }
  .c-banner-related:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-related {
    padding: 45px 50px;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related {
    padding: 45px 0;
  }
}
@media screen {
  .c-banner-related .c-banner-related__wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 80px;
    align-items: center;
    position: relative;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related .c-banner-related__wrapper {
    grid-template-columns: 1fr !important;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related .c-banner-related__wrapper .c-banner-related__text {
    text-align: center;
  }
}
@media screen {
  .c-banner-related .c-banner-related__wrapper .c-banner-related__text .o-header-logo__mark {
    width: 24px;
    height: 24px;
    fill: #ffffff;
  }
}
@media screen {
  .c-banner-related .c-banner-related__wrapper .c-banner-related__text .c-banner-related__headline {
    font-size: 2.25rem; /* 36/16 */
    line-height: 1.25;
    margin-top: 6px;
    color: #ffffff;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related .c-banner-related__wrapper .c-banner-related__text .c-banner-related__headline {
    font-size: 1.875rem; /* 30/16 */
  }
}
@media screen and (max-width: 600px) {
  .c-banner-related .c-banner-related__wrapper .c-banner-related__text .c-banner-related__headline {
    font-size: 1.5rem; /* 24/16 */
  }
}
@media screen {
  .c-banner-related .c-banner-related__wrapper .c-banner-related__text .c-banner-related__description {
    font-family: "Bitter", serif;
    font-size: 1.125rem;
    margin-top: 9px;
    color: #ffffff;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related .c-banner-related__wrapper .c-banner-related__text .c-banner-related__description {
    font-size: 1rem; /* 18/16 */
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related .c-banner-related__wrapper .c-banner-related__artwork {
    text-align: center;
    margin-top: 30px;
  }
}
@media screen {
  .c-banner-related .c-banner-related__wrapper .c-banner-related__artwork img {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related .c-banner-related__wrapper .c-banner-related__artwork img {
    max-width: 320px;
  }
}
@media screen {
  .c-banner-related--subscription {
    background: #FDCF74;
  }
  .c-banner-related--subscription .c-banner-related__wrapper {
    grid-column-gap: 26px;
  }
  .c-banner-related--subscription .c-banner-related__text h3 {
    font-size: 1.6875rem !important; /* 27/16 */
  }
  .c-banner-related--subscription .c-banner-related__text p {
    font-size: 1.0625rem; /* 17/16 */
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related--subscription .c-banner-related__text {
    order: 2;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related--subscription .c-banner-related__artwork {
    order: 1;
    margin-top: 0 !important;
    margin-bottom: 30px;
  }
}
@media screen {
  .c-banner-related--content {
    background: linear-gradient(to right bottom, #333333, #363638, #38393d, #3a3c43, #3b4048);
  }
  .c-banner-related--content:before {
    background-color: #333333;
    background-size: cover;
  }
  .c-banner-related--content .c-banner-related__wrapper {
    grid-template-columns: 1fr auto;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related--content .c-banner-related__text {
    order: 2;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related--content .c-banner-related__text .o-header-logo__mark {
    display: none;
  }
}
@media screen {
  .c-banner-related--content .c-banner-related__artwork {
    text-align: right;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related--content .c-banner-related__artwork {
    order: 1;
    text-align: left !important;
    margin-top: 0 !important;
  }
}
@media screen {
  .c-banner-related--content .c-banner-related__artwork img {
    max-width: 350px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-radius: 0.5625rem;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-related--content .c-banner-related__artwork img {
    max-width: 250px !important;
  }
}
@media screen {
  .c-banner-draper-sticky {
    display: flex;
    align-items: center;
    height: 80px;
    background: #3268A6;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 99;
    box-shadow: 0 -2px 1px 0 rgba(51, 51, 51, 0.05);
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky {
    height: auto;
  }
}
@media screen {
  .c-banner-draper-sticky .c-banner-draper-sticky__wrapper {
    display: flex;
    align-items: center;
    padding: 0 60px;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky .c-banner-draper-sticky__wrapper {
    padding: 10px 60px 15px 20px;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper-sticky .c-banner-draper-sticky__wrapper {
    display: block;
  }
}
@media screen {
  .c-banner-draper-sticky .c-banner-draper-sticky__wrapper img {
    max-width: 90px;
    margin-right: 30px;
    position: relative;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky .c-banner-draper-sticky__wrapper img {
    display: none;
  }
}
@media screen {
  .c-banner-draper-sticky .c-banner-draper-sticky__wrapper p {
    font-family: "Bitter", serif;
    font-weight: 700;
    font-size: 1rem;
    padding-right: 20px;
    color: #ffffff;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper-sticky .c-banner-draper-sticky__wrapper p {
    margin-bottom: 15px;
  }
}
@media screen {
  .c-banner-draper-sticky .c-banner-draper-sticky__wrapper .o-alert__close {
    position: absolute;
    top: 50%;
    right: 15px;
    margin-top: -15px;
    width: 30px;
    height: 30px;
  }
  .c-banner-draper-sticky .c-banner-draper-sticky__wrapper .o-alert__close svg {
    margin-top: -8px;
    margin-left: -8px;
  }
}
@media screen {
  .c-banner-draper-sticky--account {
    background: #41AEA4;
    background-image: url(/assets/patterns/flare-relate-pattern--dark-teal-ae0808f8dec26eea570712492e5bbdfe208f598016b1be055ba108966a73eb5f.png);
    background-size: cover;
  }
}
@media screen {
  .c-banner-draper-sticky--newsletter {
    background: #333333;
    background-image: url(/assets/patterns/geometric-relate-pattern--dark-e78f59cb4699e24d8f72a0d8d6d16483af21c3fd818ce1b9c417a5cc8733f466.png);
    background-size: cover;
  }
  .c-banner-draper-sticky--newsletter img {
    max-width: 120px !important;
    top: 20px;
  }
}
@media screen {
  .c-banner-draper-sticky--subscribe {
    background: #FDCF74;
  }
  .c-banner-draper-sticky--subscribe .c-banner-draper-sticky__wrapper {
    padding-left: 0;
    padding-right: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky--subscribe .c-banner-draper-sticky__wrapper {
    padding-left: 24px;
    padding-right: 60px;
    padding-top: 15px;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper-sticky--subscribe .c-banner-draper-sticky__wrapper {
    padding-right: 24px;
  }
}
@media screen {
  .c-banner-draper-sticky--subscribe p {
    color: #333333 !important;
  }
}
@media screen {
  .c-banner-draper-sticky--subscribe img {
    max-width: 180px !important;
    margin-right: 20px !important;
    margin-left: -30px !important;
    top: 0;
  }
}
@media screen {
  .c-banner-draper-sticky--pro-subscribe {
    background: #157CB8;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky--pro-subscribe .c-banner-draper-sticky__wrapper {
    padding-top: 15px;
  }
}
@media screen {
  .c-banner-draper-sticky--pro-subscribe p {
    color: #ffffff !important;
  }
}
@media screen {
  .c-banner-draper-sticky--pro-subscribe img {
    max-width: 150px !important;
    margin-right: 20px !important;
    margin-left: -30px !important;
    top: 10px;
  }
}
@media screen {
  .c-banner-draper-sticky--team-subscribe {
    background: #A5CEB5;
  }
  .c-banner-draper-sticky--team-subscribe .c-banner-draper-sticky__wrapper {
    padding-left: 0;
    padding-right: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky--team-subscribe .c-banner-draper-sticky__wrapper {
    padding-left: 24px;
    padding-right: 60px;
  }
}
@media screen and (max-width: 600px) {
  .c-banner-draper-sticky--team-subscribe .c-banner-draper-sticky__wrapper {
    padding-right: 24px;
  }
}
@media screen {
  .c-banner-draper-sticky--team-subscribe img {
    max-width: 95px !important;
    top: 1px;
  }
}
@media screen {
  .c-banner-draper-sticky--obfuscate {
    background: #ffffff;
    box-shadow: 0px 2px 24px 0 rgba(51, 51, 51, 0.1);
    height: 96px;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky--obfuscate {
    margin: 0 24px;
    width: calc(100% - 48px);
    bottom: 72px;
    border-radius: 0.5625rem;
    padding: 24px;
    z-index: 0;
    height: auto;
  }
}
@media screen {
  .c-banner-draper-sticky--obfuscate .c-banner-draper-sticky__wrapper {
    max-width: 1140px;
    padding: 0;
  }
}
@media screen and (max-width: 1200px) {
  .c-banner-draper-sticky--obfuscate .c-banner-draper-sticky__wrapper {
    padding: 0 24px;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky--obfuscate .c-banner-draper-sticky__wrapper {
    padding: 0;
  }
}
@media screen {
  .c-banner-draper-sticky--obfuscate p {
    color: #333333 !important;
  }
}
@media screen {
  .c-banner-draper-sticky--obfuscate img {
    max-width: 170px !important;
  }
}
@media screen {
  .c-banner-draper-sticky--obfuscate .l-obfuscated-text {
    display: inline-block;
    width: 104px;
    text-align: center;
    background: #F4C3C3;
  }
}
@media screen {
  .c-banner-draper-sticky--black {
    background: #333333;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky--cta-only .c-banner-draper-sticky__wrapper {
    padding: 15px 20px 15px 20px;
  }
}
@media screen {
  .c-banner-draper-sticky--black-friday-2020 {
    background: #222222;
  }
  .c-banner-draper-sticky--black-friday-2020:before {
    content: "";
    position: absolute;
    left: -120px;
    top: 0;
    width: 300px;
    height: 100%;
    background-image: url(/assets/patterns/black-friday-2020-banner-background-left-green@2x-1457eeb695c0ff616b9105dd99462e1f20b3cf8253ec452b092436f05ca10bbd.png);
    background-size: cover;
    z-index: -1;
  }
}
@media screen and (max-width: 1200px) {
  .c-banner-draper-sticky--black-friday-2020:before {
    left: -200px;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky--black-friday-2020:before {
    display: none;
  }
}
@media screen {
  .c-banner-draper-sticky--black-friday-2020:after {
    content: "";
    position: absolute;
    right: -120px;
    top: 0;
    width: 300px;
    height: 100%;
    background-image: url(/assets/patterns/black-friday-2020-banner-background-right-green@2x-76fd0f37b155af57046dfc30ea318a0d7ba625973a933df46f229c06e5846adb.png);
    background-size: cover;
    z-index: -1;
  }
}
@media screen and (max-width: 1200px) {
  .c-banner-draper-sticky--black-friday-2020:after {
    right: -200px;
  }
}
@media screen and (max-width: 1080px) {
  .c-banner-draper-sticky--black-friday-2020:after {
    right: -250px;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky--black-friday-2020:after {
    display: none;
  }
}
@media screen {
  .c-banner-draper-sticky--black-friday-2020 .c-banner-draper-sticky__wrapper {
    padding-left: 0;
    padding-right: 0;
    max-width: 678px;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky--black-friday-2020 .c-banner-draper-sticky__wrapper {
    padding-left: 24px;
    padding-right: 60px;
    max-width: none;
  }
}
@media screen {
  .c-price-card {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    text-align: center;
    width: 300px;
    height: 0%;
    padding: 30px 0 40px;
    margin: 0 20px;
  }
  .c-price-card h4 {
    font-size: 1.125rem; /* 18/16 */
  }
  .c-price-card .c-price-card__price span {
    font-family: "Bitter", serif;
  }
  .c-price-card .c-price-card__price .c-price-card__price-currency {
    font-size: 1.25rem; /* 20/16 */
    margin-right: -6px;
  }
  .c-price-card .c-price-card__price .c-price-card__price-main {
    font-size: 7.5rem; /* 140/16 */
    line-height: 100px;
    letter-spacing: -5px;
  }
  .c-price-card .c-price-card__price .c-price-card__price-change {
    margin-left: -6px;
    position: relative;
    top: -75px;
  }
  .c-price-card .c-price-card__period {
    display: block;
    font-family: "Bitter", serif;
  }
  .c-price-card .c-price-card__saving {
    display: block;
    font-size: 0.875rem; /* 14/16 */
    color: #73859F;
  }
}
@media screen {
  .c-price-card--small {
    width: 270px;
  }
}
@media screen {
  .c-banner-draper--teaspoon-launch {
    background: #FDCF74;
    height: auto;
    padding-top: 30px;
    padding-bottom: 30px;
    text-align: center;
  }
  .c-banner-draper--teaspoon-launch .c-banner-draper__copy {
    margin: 0 !important;
  }
  .c-banner-draper--teaspoon-launch .c-banner-draper__copy h2, .c-banner-draper--teaspoon-launch .c-banner-draper__copy p {
    display: block !important;
    text-align: center;
    color: #333333 !important;
  }
  .c-banner-draper--teaspoon-launch .c-banner-draper__artwork-left {
    position: absolute;
    left: -250px;
    top: -92px;
    width: 298px;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-draper--teaspoon-launch .c-banner-draper__artwork-left {
    bottom: -92px;
    top: auto;
  }
}
@media screen {
  .c-banner-draper--teaspoon-launch .c-banner-draper__artwork-right {
    position: absolute;
    right: -340px;
    top: -92px;
    width: 380px;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-draper--teaspoon-launch .c-banner-draper__artwork-right {
    bottom: -92px;
    top: auto;
  }
}
@media screen {
  .c-banner-draper--black-friday--2020 {
    background: #222222;
    position: relative;
    height: auto;
    padding-top: 30px;
    padding-bottom: 30px;
    text-align: center;
  }
}
@media screen {
  .c-banner-draper--black-friday--2020::before {
    content: "";
    position: absolute;
    width: 302px;
    height: 205px;
    position: absolute;
    left: -100px;
    top: auto;
    bottom: 0;
    background-image: url(/assets/patterns/black-friday-2020-top-banner-background-left-green@2x-ddd3afcdcf4e19be05da694a3cc6ef4309c43ebbc3e61cab7a90eb6ba63094bb.png);
    background-size: cover;
  }
}
@media only screen and (max-width: 800px) {
  .c-banner-draper--black-friday--2020::before {
    display: none;
  }
}
@media screen {
  .c-banner-draper--black-friday--2020::after {
    content: "";
    position: absolute;
    width: 302px;
    height: 205px;
    position: absolute;
    right: -100px;
    top: auto;
    bottom: 0;
    background-image: url(/assets/patterns/black-friday-2020-top-banner-background-right-green@2x-5c58fe59f9cffd45842df12bad8bc7b45a80d6f5fa4fd906107ed06dd7173c51.png);
    background-size: cover;
  }
}
@media only screen and (max-width: 800px) {
  .c-banner-draper--black-friday--2020::after {
    display: none;
  }
}
@media only screen and (max-width: 800px) {
  .c-banner-draper--black-friday--2020 h2 {
    display: block !important;
  }
  .c-banner-draper--black-friday--2020 h2 > span {
    display: block;
  }
}
@media screen {
  .c-banner-draper--black-friday--2020 .c-banner-draper__flex-wrapper {
    justify-content: center;
    text-align: center;
  }
}
@media screen {
  .c-banner-draper-top--spring-ahead-2021 {
    background-color: #FDEA89 !important;
    background-image: url(/assets/artwork/illustration-spring-ahead-row-0338a27e2b54ba2378c23026bfded650b896b6b3472c94d82a9f41627c5c157c.png);
    background-size: 1440px 158px;
    background-position: center bottom -80px;
    background-repeat: no-repeat;
    padding-top: 30px;
    padding-bottom: 90px;
    height: auto;
  }
}
@media only screen and (max-width: 1080px) {
  .c-banner-draper-top--spring-ahead-2021 .c-banner-draper__flex-wrapper {
    grid-template-columns: auto !important;
  }
}
@media screen {
  .c-banner-draper-top--spring-ahead-2021 .c-banner-draper__copy {
    margin: 0 auto !important;
    text-align: center;
  }
}
@media screen {
  .c-banner-draper-top--spring-ahead-2021 h2, .c-banner-draper-top--spring-ahead-2021 p {
    color: #333333 !important;
  }
}
@media screen {
  .c-banner-draper-bottom--spring-ahead-2021 {
    background: #FDEA89 !important;
  }
  .c-banner-draper-bottom--spring-ahead-2021 h2, .c-banner-draper-bottom--spring-ahead-2021 p {
    color: #333333 !important;
  }
  .c-banner-draper-bottom--spring-ahead-2021 .c-banner-draper__art {
    max-width: 350px;
  }
  .c-banner-draper-bottom--spring-ahead-2021 .c-banner-draper__flex-wrapper {
    grid-template-columns: 1fr 350px;
  }
}
@media screen {
  .c-banner-draper-sticky--spring-ahead-2021 {
    background: #FDEA89;
  }
  .c-banner-draper-sticky--spring-ahead-2021 .c-banner-draper-sticky__wrapper {
    padding: 0 30px !important;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper-sticky--spring-ahead-2021 .c-banner-draper-sticky__wrapper {
    padding: 10px 60px 15px 20px !important;
  }
}
@media screen {
  .c-banner-draper-sticky--spring-ahead-2021 p {
    color: #333333 !important;
  }
}
@media screen {
  .c-banner-draper-sticky--spring-ahead-2021 img {
    max-width: 216px !important;
  }
}
@media screen {
  .c-banner-related--spring-ahead-2021 {
    background: #FDEA89 !important;
  }
  .c-banner-related--spring-ahead-2021 h3, .c-banner-related--spring-ahead-2021 p {
    color: #333333 !important;
  }
}
@media screen {
  .c-banner-draper--community {
    height: auto;
    padding-top: 140px;
    margin-top: -100px;
  }
  .c-banner-draper--community:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(/assets/artwork/illustration-subscription-header-923bfbe189a4967a8aa7d5afda8500cc54c825927e383d2434d94171e11bbafb.svg);
    background-position: top -150px center;
    background-size: 1400px;
    background-repeat: no-repeat;
    z-index: -1;
    width: 100%;
    height: 140px;
  }
  .c-banner-draper--community > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1152px;
  }
}
@media screen and (max-width: 1440px) {
  .c-banner-draper--community > div {
    margin: 0 auto;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper--community > div {
    flex-direction: column;
  }
}
@media screen {
  .c-banner-draper--community .c-banner-draper__copy {
    max-width: 720px;
    padding-right: 30px;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper--community .c-banner-draper__copy {
    text-align: center;
    padding-right: 0;
  }
}
@media screen {
  .c-banner-draper--community .c-banner-draper__copy h2 {
    line-height: 1.125;
  }
}
@media screen {
  .c-banner-draper--community .c-banner-draper__copy h2, .c-banner-draper--community .c-banner-draper__copy p {
    margin-top: 9px;
  }
}
@media screen {
  .c-banner-draper--community .c-banner-draper__copy p {
    color: #6E7687;
  }
}
@media screen {
  .c-banner-draper--community .c-banner-draper__art {
    max-width: 526px;
    position: relative;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper--community .c-banner-draper__art {
    margin-top: 30px;
  }
}
@media screen {
  .c-banner-draper--community .c-banner-draper__art:before {
    content: "";
    position: absolute;
    top: 50%;
    left: -16px;
    width: calc(100% + 32px);
    height: 200px;
    margin-top: -100px;
    border-radius: 12px;
    background-color: #D6E0EF;
    opacity: 0.4;
    z-index: -1;
  }
}
@media screen and (max-width: 768px) {
  .c-banner-draper--community .c-banner-draper__art:before {
    display: none;
  }
}
@media screen {
  .c-banner-draper--community .c-banner-draper__art img {
    width: 100%;
    border-radius: 12px;
  }
}
@media screen {
  .c-banner-draper--community-width + div > div {
    max-width: 1152px;
  }
}
@media screen and (max-width: 1440px) {
  .c-banner-draper--community-width + div > div {
    margin: 0 auto;
  }
}
@media screen {
  .c-banner-draper--community-width + div > div h3 {
    font-size: 1.875rem; /* 30/16 */
  }
}
@media screen {
  .c-banner-draper--community-width + div > div .l-border-bottom {
    border-bottom: none;
  }
}
@media screen {
  .c-banner-draper--community-intersticial {
    height: auto;
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .c-banner-draper--community-intersticial:before {
    display: none;
  }
  .c-banner-draper--community-intersticial > div {
    display: flex;
    align-items: center;
    max-width: 1152px;
  }
}
@media screen and (max-width: 1440px) {
  .c-banner-draper--community-intersticial > div {
    margin: 0 auto;
  }
}
@media screen {
  .c-banner-draper--community-intersticial > div .c-banner-draper__copy {
    text-align: center;
    padding: 0 60px;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper--community-intersticial > div .c-banner-draper__copy {
    padding: 0;
  }
}
@media screen {
  .c-banner-draper--community-intersticial > div .c-banner-draper__copy h3 {
    font-size: 1.875rem; /* 30/16 */
  }
}
@media screen {
  .c-banner-draper--community-intersticial > div .c-banner-draper__copy p {
    color: #6E7687;
    margin-top: 12px;
  }
}
@media screen {
  .c-banner-draper--community-intersticial > div .c-banner-draper__art {
    min-width: 230px;
    height: 215px;
  }
}
@media screen and (max-width: 992px) {
  .c-banner-draper--community-intersticial > div .c-banner-draper__art {
    display: none;
  }
}
@media screen {
  .c-banner-draper--community-intersticial > div .c-banner-draper__art img {
    width: 100%;
  }
}
@media screen {
  .c-banner-draper--community-connect .c-banner-draper__art--left {
    background-image: url(/assets/artwork/community-connect-left-bce21b6b2108866cbbf453b81faf599c264a9b97090d3a638629260e1a19e34f.png);
    background-size: 100%;
    background-repeat: no-repeat;
  }
  .c-banner-draper--community-connect .c-banner-draper__art--right {
    background-image: url(/assets/artwork/community-connect-right-74345afbd0f42e2fed5a8e4f8d4ac0d8c3decf3ca3cb59f1a4c151e3a14bed26.png);
    background-size: 100%;
    background-repeat: no-repeat;
  }
}
@media screen {
  .c-banner-draper--community-resources .c-banner-draper__art--left {
    height: 228px !important;
    background-image: url(/assets/artwork/community-people-left-7c2e3b4d6f8ac4183f79f1a9c845e49d25b0831d8e7ad08db1923240be20e86c.png);
    background-size: 100%;
    background-repeat: no-repeat;
  }
  .c-banner-draper--community-resources .c-banner-draper__art--right {
    height: 221px !important;
    background-image: url(/assets/artwork/community-people-right-033285e844670c7bf19a5ae4560402289e11c53111ea950344d424598c83b019.png);
    background-size: 100%;
    background-repeat: no-repeat;
  }
}
@media screen {
  .c-modal {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: fixed;
    background: rgba(59, 64, 72, 0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: scroll;
    z-index: 999999;
  }
}
@media screen and (max-width: 992px) {
  .c-modal {
    padding: 20px;
  }
}
@media screen {
  .c-modal .c-modal__close {
    display: flex;
    align-items: center;
    width: 36px;
    height: 36px;
    background: #ffffff;
    border-radius: 0.5625rem;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 100;
    justify-content: center;
  }
  .c-modal .c-modal__close svg {
    width: 18px;
    height: 18px;
    transform: rotate(45deg);
    margin: 0;
  }
}
@media screen {
  .c-modal .c-modal-wrapper {
    display: flex;
    flex-wrap: wrap;
    background: #ffffff;
    width: 720px;
    border-radius: 0.5625rem;
    overflow: hidden;
    animation-duration: 0.3s;
    animation-fill-mode: both;
    animation-name: a-zoom-in;
    position: relative;
  }
}
@media screen and (max-width: 768px) {
  .c-modal .c-modal-wrapper {
    padding-top: 24px;
  }
}
@media screen {
  .c-modal .c-modal__copy {
    flex-grow: 1;
    padding: 15px 36px 24px;
  }
}
@media screen and (max-width: 768px) {
  .c-modal .c-modal__copy {
    padding: 27px 24px;
  }
}
@media screen {
  .c-modal .c-modal__copy .c-modal__title {
    margin-bottom: 18px;
  }
}
@media screen and (max-width: 600px) {
  .c-modal .c-modal__copy .c-modal__title {
    font-size: 1.875rem;
  }
}
@media screen {
  .c-modal .c-modal__copy .c-modal__subtitle {
    font-weight: 500;
    font-size: 1.3125rem;
  }
}
@media screen and (max-width: 600px) {
  .c-modal .c-modal__copy .c-modal__subtitle {
    font-size: 1.125rem;
  }
}
@media screen {
  .c-modal .c-modal__copy .c-modal__description p, .c-modal .c-modal__copy .c-modal__description ol, .c-modal .c-modal__copy .c-modal__description ul {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
    font-size: 1rem;
    margin-top: 24px;
    color: #6E7687;
  }
}
@media screen and (max-width: 600px) {
  .c-modal .c-modal__copy .c-modal__description p, .c-modal .c-modal__copy .c-modal__description ol, .c-modal .c-modal__copy .c-modal__description ul {
    font-size: 0.9375em;
  }
}
@media screen {
  .c-modal .c-modal__copy .c-modal__description a {
    font-weight: 400 !important;
    color: #158443 !important;
    margin-left: 0px !important;
    text-decoration: underline;
    padding: 0px;
  }
}
@media screen {
  .c-modal .c-modal__copy .c-modal__description p:first-child {
    margin-top: 0;
  }
}
@media screen {
  .c-modal .c-modal__copy .c-modal__description--scroll {
    max-height: 240px;
    overflow: scroll;
    border-bottom: 1px solid #EFF3F6;
    padding-bottom: 24px;
  }
}
@media screen {
  .c-modal .c-modal__copy .c-modal__form .c-modal__checkbox {
    display: inline-block;
  }
}
@media screen {
  .c-modal--sign-up {
    text-align: center;
    white-space: normal;
  }
  .c-modal--sign-up .c-modal__title {
    font-size: 1.6875em; /* 27/16 */
    padding: 0 60px;
    margin-top: 0 !important;
    color: #333333 !important;
  }
}
@media screen and (max-width: 600px) {
  .c-modal--sign-up .c-modal__title {
    font-size: 1.3125rem !important; /* 21/16 */
    padding: 0;
  }
}
@media screen {
  .c-modal--sign-up .c-modal__artwork {
    width: 100%;
    margin-top: 30px;
  }
}
@media screen and (max-width: 768px) {
  .c-modal--sign-up .c-modal__artwork {
    display: none;
  }
}
@media screen {
  .c-modal--sign-up .c-modal__artwork img {
    width: 100%;
    max-width: 140px !important;
    margin: 0 auto !important;
    border: 0 !important;
  }
}
@media screen {
  .c-modal--sign-up .c-modal__artwork .c-modal__artwork--subscribe {
    max-width: 210px !important;
  }
  .c-modal--sign-up .o-button--green {
    color: #ffffff;
  }
  .c-modal--sign-up .o-button--green:hover {
    color: #ffffff;
  }
}
@media screen {
  .c-modal--highlighting .c-modal__title {
    font-size: 1.5rem; /* 24/16 */
  }
  .c-modal--highlighting .c-modal__artwork {
    width: 100%;
    margin-top: 30px;
  }
  .c-modal--highlighting .c-modal__artwork img {
    width: 100%;
    max-width: 250px !important;
  }
  .c-modal--highlighting .c-modal__copy {
    padding-bottom: 36px !important;
  }
  .c-modal--highlighting .c-modal__copy .c-modal__description a {
    color: #6E7687 !important;
  }
  .c-modal--highlighting .o-button__svg--grey-regent {
    fill: #959DA5 !important;
  }
}
@media screen {
  .c-modal--trailer .c-modal-wrapper {
    background: none;
    width: auto;
  }
}
@media screen and (max-width: 768px) {
  .c-modal--trailer .c-modal-wrapper {
    width: 100%;
  }
}
@media screen {
  .c-modal--trailer .c-modal-wrapper .c-modal__player {
    width: 480px;
    border-radius: 0.5625rem;
    overflow: hidden;
    padding-top: 56.25%;
    background: #333333;
    position: relative;
  }
}
@media screen and (min-width: 1080px) {
  .c-modal--trailer .c-modal-wrapper .c-modal__player {
    width: 720px;
  }
}
@media screen {
  .c-modal--trailer .c-modal-wrapper iframe {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
}
@media screen {
  .c-modal--trailer .c-modal__close {
    right: 0;
    top: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-modal--trailer .c-modal__close {
    position: fixed;
    top: 15px;
    right: 15px;
  }
}
@media screen {
  .c-modal--trailer .c-modal__close svg {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -9px 0 0 -9px;
  }
}
@media screen {
  .c-modal--video-tutorial .c-modal__copy {
    padding-top: 24px;
  }
  .c-modal--video-tutorial .c-modal__title {
    font-size: 1.6875rem !important; /* 27/16 */
    line-height: 1.125;
    margin-bottom: 6px !important;
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .c-modal--video-tutorial .c-modal__title {
    font-size: 1.5em !important; /* 24/16 */
  }
}
@media screen {
  .c-modal--video-tutorial .c-modal__description {
    font-size: 1rem !important;
    color: #6E7687;
    text-align: center;
  }
  .c-modal--video-tutorial .c-modal__description a {
    color: #6E7687 !important;
  }
}
@media screen {
  .c-modal--video-tutorial .c-modal__video-tutorial {
    position: relative;
    padding-top: 56.25%;
    margin-top: 24px;
    margin-bottom: 24px;
    overflow: hidden;
    border-radius: 0.5625rem; /* 9/16 */
  }
  .c-modal--video-tutorial .c-modal__video-tutorial img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    padding: 10px;
  }
  .c-modal--video-tutorial .c-modal__video-tutorial:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #1a1a1a;
    opacity: 0.25;
    z-index: 1;
  }
}
@media screen {
  .c-modal--video-tutorial .o-button-video {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
  }
}
@media screen {
  .c-modal--video-tutorial .c-modal__player-container:before {
    display: none;
  }
}
@media screen {
  .c-modal--video-tutorial .c-modal__complete-illustration:before {
    display: none;
  }
  .c-modal--video-tutorial .c-modal__complete-illustration img {
    transform: translateX(-50%);
    left: 50%;
    width: auto;
    height: 100%;
    max-width: 400px;
  }
}
@media screen {
  @keyframes shimmer {
    0% {
      background-position: -468px 0;
    }
    100% {
      background-position: 468px 0;
    }
  }
}
@media screen {
  .o-skeleton__artwork {
    max-width: 100%;
    border-radius: 9px;
    background: #EFF3F6;
    animation-duration: 0.75s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: linear-gradient(to right, #E1E3E6 8%, #E6E8EB 18%, #E1E3E6 33%);
    background-size: 800px 104px;
    width: 100%;
    height: 160px;
  }
}
@media screen {
  .o-skeleton__graphic {
    max-width: 100%;
    border-radius: 9px;
    background: #EFF3F6;
    animation-duration: 0.75s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: linear-gradient(to right, #E1E3E6 8%, #E6E8EB 18%, #E1E3E6 33%);
    background-size: 800px 104px;
    width: 64px;
    height: 64px;
  }
}
@media screen {
  .o-skeleton__graphic--small {
    width: 54px;
    height: 54px;
  }
}
@media screen {
  .o-skeleton__graphic--large {
    width: 90px;
    height: 90px;
  }
}
@media screen {
  .o-skeleton__title {
    max-width: 100%;
    border-radius: 9px;
    background: #EFF3F6;
    animation-duration: 0.75s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: linear-gradient(to right, #E1E3E6 8%, #E6E8EB 18%, #E1E3E6 33%);
    background-size: 800px 104px;
    width: 100%;
    max-width: 260px;
    height: 36px;
  }
}
@media screen and (max-width: 600px) {
  .o-skeleton__title {
    height: 33px;
  }
}
@media screen {
  .o-skeleton__text {
    max-width: 100%;
    border-radius: 9px;
    background: #EFF3F6;
    animation-duration: 0.75s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: linear-gradient(to right, #E1E3E6 8%, #E6E8EB 18%, #E1E3E6 33%);
    background-size: 800px 104px;
    width: 250px;
    height: 12px;
  }
}
@media screen {
  .o-skeleton__text--small {
    width: 180px;
  }
}
@media screen {
  .o-skeleton__button {
    max-width: 100%;
    border-radius: 9px;
    background: #EFF3F6;
    animation-duration: 0.75s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: linear-gradient(to right, #E1E3E6 8%, #E6E8EB 18%, #E1E3E6 33%);
    background-size: 800px 104px;
    width: 120px;
    height: 42px;
  }
}
@media screen and (max-width: 600px) {
  .o-skeleton__button {
    display: block;
    margin-top: 9px;
  }
}
@media screen {
  .o-skeleton-sidebar__meta-wrapper {
    margin-left: 12px;
  }
}
@media screen {
  .o-skeleton-sidebar__meta {
    max-width: 100%;
    border-radius: 9px;
    background: #EFF3F6;
    animation-duration: 0.75s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: linear-gradient(to right, #E1E3E6 8%, #E6E8EB 18%, #E1E3E6 33%);
    background-size: 800px 104px;
    width: 60px;
    height: 9px;
  }
}
@media screen {
  .o-skeleton-sidebar__meta--small {
    width: 30px;
    margin-top: 9px;
  }
}
@media screen {
  .o-skeleton-sidebar__meta--large {
    width: 180px;
  }
}
@media screen {
  .o-skeleton-card {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.075);
    width: 100%;
    padding: 30px 24px;
  }
}
@media screen {
  .o-skeleton-card--small {
    padding: 24px 24px;
  }
}
@media screen {
  .o-skeleton-card--large {
    padding-bottom: 45px;
  }
}
@media screen {
  .o-skeleton-card__title {
    max-width: 100%;
    border-radius: 9px;
    background: #EFF3F6;
    animation-duration: 0.75s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: linear-gradient(to right, #E1E3E6 8%, #E6E8EB 18%, #E1E3E6 33%);
    background-size: 800px 104px;
    width: 250px;
    height: 30px;
  }
}
@media screen {
  .o-skeleton-card__text {
    max-width: 100%;
    border-radius: 9px;
    background: #EFF3F6;
    animation-duration: 0.75s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: linear-gradient(to right, #E1E3E6 8%, #E6E8EB 18%, #E1E3E6 33%);
    background-size: 800px 104px;
    width: 330px;
    height: 12px;
    margin-top: 12px;
  }
}
@media screen {
  .c-skeleton-sidebar {
    align-self: flex-start;
    opacity: 0.8;
  }
}
@media screen and (max-width: 992px) {
  .c-skeleton-sidebar {
    display: none;
  }
}
@media screen {
  .c-skeleton-sidebar > div {
    display: flex;
    flex-wrap: wrap;
  }
  .c-skeleton-sidebar > div:last-child {
    position: absolute;
    bottom: 30px;
  }
}
@media screen {
  .c-skeleton-sidebar .c-skeleton-sidebar__text {
    margin-top: 44px;
  }
  .c-skeleton-sidebar .c-skeleton-sidebar__text:first-child {
    margin-top: 0;
  }
  .c-skeleton-sidebar .c-skeleton-sidebar__text:nth-child(1) {
    width: 210px;
  }
  .c-skeleton-sidebar .c-skeleton-sidebar__text:nth-child(2) {
    width: 130px;
  }
  .c-skeleton-sidebar .c-skeleton-sidebar__text:nth-child(3) {
    width: 240px;
  }
  .c-skeleton-sidebar .c-skeleton-sidebar__text:nth-child(4) {
    width: 100px;
  }
  .c-skeleton-sidebar .c-skeleton-sidebar__text:nth-child(5) {
    width: 180px;
  }
}
@media screen {
  .c-skeleton-admin {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .c-skeleton-admin .l-half-col {
    width: calc(50% - 10px);
  }
  .c-skeleton-admin .o-skeleton-card__text:nth-child(1) {
    width: 210px;
  }
  .c-skeleton-admin .o-skeleton-card__text:nth-child(2) {
    width: 100px;
  }
}
@media screen {
  .c-skeleton-tutorials {
    width: 100%;
  }
}
@media screen and (max-width: 1140px) {
  .c-skeleton-tutorials {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .c-skeleton-tutorials > div {
    margin-top: 30px;
  }
}
@media screen and (max-width: 992px) {
  .c-skeleton-tutorials {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .c-skeleton-tutorials {
    display: block;
  }
}
@media screen {
  .c-tutorial-item {
    position: relative;
  }
  .c-tutorial-item > a {
    text-decoration: none;
    display: block; /* this might not be a good idea*/
  }
  .c-tutorial-item .o-button--bookmark {
    display: none;
  }
  .c-tutorial-item .c-tutorial-item__actions {
    display: none;
  }
  .c-tutorial-item .o-button--mark-as-complete {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 27px;
    height: 27px;
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-item .o-button--mark-as-complete {
    display: none !important;
  }
}
@media screen {
  .c-tutorial-item .o-button--mark-as-complete .checkbox__input, .c-tutorial-item .o-button--mark-as-complete .checkbox__indicator {
    top: 0;
  }
}
@media screen {
  .c-tutorial-item .o-button--mark-as-complete button:focus {
    outline: none;
  }
}
@media screen {
  .c-tutorial-item .o-badge-tutorial--locked, .c-tutorial-item .o-badge-tutorial--recording {
    display: none;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__art {
    background: #ffffff;
    border-radius: 0.5625rem;
    overflow: hidden;
    position: relative;
  }
  .c-tutorial-item .c-tutorial-item__art img {
    display: flex;
    width: 100%;
    height: auto;
    align-self: flex-start;
  }
  .c-tutorial-item .c-tutorial-item__art img.c-tutorial-item__art-image--alternate, .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__in-progress, .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__complete {
    display: none;
  }
  .c-tutorial-item .c-tutorial-item__art .o-badge {
    position: absolute;
    z-index: 1;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text {
    display: flex;
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 600px) {
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    word-break: break-word;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title, .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__category {
    font-family: "Bitter", serif;
    font-size: 1.3125rem; /* 21/16 */
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: -0.5px;
    color: #333333;
    padding-right: 12px;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__category {
    font-size: 1.125rem; /* 18/16 */
    font-weight: 500;
    margin-top: 9px;
    display: none;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__parent {
    display: none;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text > span {
    display: block;
    width: 100%;
    font-size: 0.9375rem;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata, .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata-short {
    color: #6E7687;
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description {
    width: 100%;
    margin-top: 8px;
    font-size: 0.9375rem;
    color: #6E7687;
  }
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description p, .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description ul, .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description ol {
    margin-top: 8px;
    font-size: 0.9375rem;
    color: #6E7687;
  }
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description ul, .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description ol {
    padding-left: 10px;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__platform, .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__platform-long, .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__parent, .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__continue, .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__type {
    color: #6E7687;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__continue {
    display: none;
    margin-top: 8px;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__platform-long {
    display: none;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__in-progress {
    display: none;
    width: 100%;
    height: 6px;
    border-radius: 100px;
    position: absolute;
    left: 0;
    bottom: 0;
  }
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__in-progress .c-tutorial-item__in-progress--fill {
    width: 50%;
    background: #158443;
    height: 6px;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 100px;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__complete {
    display: none;
    color: #ffffff;
    margin-top: 10px;
    background: #158443;
    align-items: center;
  }
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__complete .c-tutorial-item__complete-text {
    position: relative;
    top: -1px;
  }
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__complete i {
    display: flex;
    justify-content: center;
    align-content: center;
    width: 15px;
    height: 20px;
    margin-right: 6px;
    border-radius: 7px;
  }
  .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__complete i svg {
    width: 11px;
    fill: #ffffff;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text .o-badge {
    width: auto;
    font-size: 0.6875rem; /* 11/16 */
    margin-top: 10px;
    display: none;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__text .o-badge--soon {
    display: none;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__lower {
    display: none;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__number-badge .o-badge-tutorial--checkmark {
    display: none;
  }
}
@media screen {
  .c-tutorial-item.c-tutorial-item--in-progress .c-tutorial-item__in-progress, .c-tutorial-item.c-tutorial-item--in-progress .c-tutorial-item__continue {
    display: block;
  }
}
@media screen {
  .c-tutorial-item.c-tutorial-item--complete .c-tutorial-item__complete {
    display: inline-flex;
  }
  .c-tutorial-item.c-tutorial-item--complete .c-tutorial-item__number-badge .o-badge-tutorial {
    display: none;
  }
  .c-tutorial-item.c-tutorial-item--complete .c-tutorial-item__number-badge .o-badge-tutorial--checkmark {
    display: flex;
  }
  .c-tutorial-item.c-tutorial-item--complete [data-tooltip]:before {
    content: "Unmark as complete" !important;
    right: -96px;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--card {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--card {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen {
  .c-tutorial--card .o-button--bookmark {
    display: inline-block;
    position: absolute;
    top: 177px;
    right: 0px;
  }
}
@media screen {
  .c-tutorial--card .c-tutorial-item {
    position: relative;
  }
}
@media screen and (max-width: 600px) {
  .c-tutorial--card .c-tutorial-item {
    margin-top: 45px;
  }
}
@media screen {
  .c-tutorial--card .c-tutorial-item a {
    padding: 0 !important;
  }
}
@media screen {
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__art {
    width: 100%;
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__art .o-badge-video, .c-tutorial--card .c-tutorial-item .c-tutorial-item__art .o-badge--pro {
    display: inline-flex;
    position: absolute;
    left: auto !important;
    right: 12px !important;
    top: 12px !important;
    z-index: 1;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__in-progress {
    width: 100%;
    height: 6px;
    border-radius: 100px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__in-progress .c-tutorial-item__in-progress--fill {
    width: 50%;
    background: #158443;
    height: 6px;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 100px;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__complete {
    color: #ffffff;
    background: #158443;
    align-items: center;
    margin-top: 0;
    z-index: 2;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__complete .c-tutorial-item__complete-text {
    position: relative;
    top: -1px;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__complete i {
    display: flex;
    justify-content: center;
    align-content: center;
    width: 15px;
    height: 20px;
    margin-right: 6px;
    border-radius: 7px;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__complete i svg {
    width: 11px;
    fill: #ffffff;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__art .o-badge {
    top: 12px;
    left: 12px;
  }
}
@media screen {
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__art--product {
    height: auto;
    margin-bottom: -12px;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__art--product img {
    transform: scale(0.9);
  }
}
@media screen {
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__art--product + .c-tutorial-item__text + .c-tutorial-item__number-badge .o-badge-tutorial {
    left: 8px;
    top: 162px;
  }
}
@media screen {
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__text {
    padding: 0 12px;
    margin-top: 15px;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    font-size: 21px;
    padding-right: 33px;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__category {
    display: block !important;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata {
    margin-top: 8px;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__platform {
    align-self: flex-end;
    margin-top: 5px;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata-short, .c-tutorial--card .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__type {
    font-size: 13px;
    letter-spacing: -0.1px;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description, .c-tutorial--card .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__in-progress, .c-tutorial--card .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__complete {
    display: none;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__text span.o-badge-tutorial {
    width: auto;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__text span.o-badge-tutorial > img {
    width: auto;
  }
}
@media screen {
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__platform {
    display: none;
  }
}
@media screen {
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__icon {
    display: flex;
    position: absolute;
    top: 12px !important;
    right: 13px;
  }
  .c-tutorial--card .c-tutorial-item .c-tutorial-item__icon .o-badge-video {
    align-self: center;
  }
}
@media screen {
  .c-tutorial--card .c-tutorial-item .o-badge-tutorial {
    position: absolute;
    left: 12px;
    top: 132px;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item--in-progress a {
    padding-bottom: 27px !important;
  }
  .c-tutorial--list .c-tutorial-item--complete .c-tutorial-item__metadata-short {
    display: none !important;
  }
  .c-tutorial--list .c-tutorial--list__page {
    margin-top: 15px;
  }
  .c-tutorial--list .c-tutorial--list__page:first-child {
    margin-top: 0;
  }
  .c-tutorial--list .c-tutorial-item {
    margin-top: 15px;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list .c-tutorial-item {
    margin-top: 15px !important;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item:first-child {
    margin-top: 0;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .o-button--bookmark {
    display: inline-block;
    position: absolute;
    z-index: 1;
    bottom: 0;
    right: 12px;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .o-link--bookmark-remove {
    color: #6E7687;
    text-decoration: underline;
    display: inline-block;
    position: absolute;
    z-index: 1;
    bottom: 21px;
    right: 20px;
    box-shadow: none;
    border-radius: none;
    padding: 0px;
    cursor: pointer;
    font-size: 0.9375em;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list .c-tutorial-item .o-link--bookmark-remove {
    position: absolute !important;
    top: auto !important;
    bottom: 21px !important;
    right: 21px !important;
    left: auto !important;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item > a, .c-tutorial--list .c-tutorial-item > div.c-tutorial-item__wrapper {
    background: #ffffff;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.075);
    border-radius: 0.5625rem;
    padding: 21px 42px 21px 21px;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__upper {
    display: grid;
    grid-template-columns: 90px 1fr 42px;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__upper {
    grid-template-columns: 1fr 72px !important;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__art {
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #DBDDE0;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__art {
    width: 72px;
    height: 72px;
    order: 2;
  }
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__art .o-badge {
    top: 15px;
    left: 15px;
  }
}
@media screen and (max-width: 768px) and (max-width: 768px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__art .o-badge {
    display: none;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__art img {
    align-self: auto;
    transform: scale(1.4);
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__art img.c-tutorial-item__art-image--primary {
    display: none;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__art img.c-tutorial-item__art-image--alternate {
    display: flex;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__complete {
    display: none;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__art--product img {
    transform: scale(1) !important;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text {
    margin-left: 18px;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text {
    display: block;
    order: 1;
    margin: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    font-size: 1.3125rem; /* 21/16 */
  }
}
@media screen and (max-width: 600px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    font-size: 1.25rem; /* 21/16 */
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .o-badge--pro {
    display: inline-flex;
    max-width: min-content;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata {
    display: none;
    margin-top: 8px;
  }
}
@media screen and (max-width: 600px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata {
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen and (max-width: 600px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata-short, .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata-long {
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description {
    display: block;
    margin-bottom: 8px;
    padding-right: 80px;
  }
}
@media screen and (max-width: 600px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description {
    padding-right: 0;
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__platform, .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__parent {
    align-self: flex-end;
    margin-top: 9px;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__platform, .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__parent {
    align-self: normal;
  }
}
@media screen and (max-width: 600px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__platform, .c-tutorial--list .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__parent {
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__icon {
    display: flex;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__icon {
    display: none;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__icon .o-badge-video {
    align-self: center;
  }
}
@media screen {
  .c-tutorial--list .c-tutorial-item .c-tutorial-item__icon .o-badge--pro {
    z-index: 1;
    display: inline-table;
    align-self: center;
    box-shadow: none;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list .c-tutorial-item .o-badge-tutorial {
    position: absolute;
    left: 12px !important;
    top: 132px !important;
    z-index: 1;
  }
}
@media screen {
  .c-tutorial--list-style-basic .c-tutorial-item {
    border-bottom: 1px solid #DBDDE0;
    padding-bottom: 20px;
  }
  .c-tutorial--list-style-basic .c-tutorial-item .o-button--bookmark {
    display: inline-flex;
    position: absolute;
    bottom: 0;
    right: 0;
  }
  .c-tutorial--list-style-basic .c-tutorial-item .o-badge--new {
    display: none;
  }
  .c-tutorial--list-style-basic .c-tutorial-item .c-tutorial-item__art {
    display: none;
  }
  .c-tutorial--list-style-basic .c-tutorial-item .c-tutorial-item__title {
    order: 1;
    margin-top: 6px;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-basic .c-tutorial-item .c-tutorial-item__title {
    font-size: 1.25rem;
  }
}
@media screen {
  .c-tutorial--list-style-basic .c-tutorial-item .c-tutorial-item__metadata {
    order: 0;
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen {
  .c-tutorial--list-style-basic .c-tutorial-item .c-tutorial-item__text-upper-meta {
    order: 2;
    margin-top: 6px;
  }
}
@media screen {
  .c-tutorial--list-style-basic .c-tutorial-item .c-tutorial-item__description {
    font-size: 0.875rem; /* 14/16 */
    margin-top: 0;
    padding-right: 30px;
  }
}
@media screen {
  .c-tutorial--list-style-basic .c-tutorial-item .c-tutorial-item__platform, .c-tutorial--list-style-basic .c-tutorial-item .c-tutorial-item__metadata-short {
    display: none;
  }
}
@media screen {
  .c-tutorial--list-style-basic .c-tutorial-item--in-progress {
    border-bottom: none;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item {
    padding-bottom: 20px;
    border-bottom: 1px solid #DBDDE0;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item {
    padding-bottom: 0;
    border-bottom: none;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item a {
    background: #ffffff;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.075);
    border-radius: 0.5625rem;
    padding: 21px;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item a > .c-tutorial-item__icon {
    display: none;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .o-button--bookmark {
    display: inline-flex;
    position: absolute;
    bottom: 0;
    right: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item .o-button--bookmark {
    right: 12px;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper {
    display: grid;
    grid-template-columns: 1fr 90px;
    grid-column-gap: 30px;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper {
    grid-template-columns: 1fr 72px;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__art {
    display: flex;
    align-items: center;
    justify-content: center;
    order: 1;
    width: 90px;
    height: 90px;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__art {
    width: 72px;
    height: 72px;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__art .o-badge--new {
    display: none;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__art .c-tutorial-item__art-image--primary {
    display: none;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__art .c-tutorial-item__art-image--alternate {
    display: flex;
    align-self: auto;
    transform: scale(1.4);
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__text-upper {
    order: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__text-upper {
    align-content: flex-start;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__text-upper .o-badge--new {
    display: inline-flex;
    position: absolute;
    top: -20px;
    right: -10px;
    z-index: 2;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__text-upper .o-badge--new {
    top: 0;
    right: 10px;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__text-upper .c-tutorial-item__metadata {
    order: 0;
    font-size: 0.875rem; /* 14/16 */
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__text-upper .c-tutorial-item__metadata {
    display: none;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__text-upper .c-tutorial-item__title {
    order: 1;
    font-size: 1.5rem; /* 24/16 */
    line-height: 1.25;
    margin-top: 3px;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__text-upper .c-tutorial-item__title {
    font-size: 1.25rem;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__text-upper .c-tutorial-item__platform {
    order: 2;
    font-size: 0.875rem;
    margin-top: 3px;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__text-upper-meta {
    display: none;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__lower {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    margin-top: 10px;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__lower {
    flex-wrap: wrap;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__lower .c-tutorial-item__description {
    margin-top: 0;
    order: 1;
    padding-right: 30px;
    font-size: 0.875rem;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__lower .c-tutorial-item__description {
    order: 0;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__lower .c-tutorial-item__metadata-short {
    order: 0;
    width: auto;
    margin-right: 10px;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__lower .c-tutorial-item__metadata-short {
    order: 1;
    margin-top: 10px;
    display: flex;
    align-items: center;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__lower .c-tutorial-item__metadata-short .o-badge--pro {
    display: inline-flex;
    border-color: #157CB8;
    margin-top: 0;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__lower .c-tutorial-item__metadata-short .o-badge-video {
    width: 38px;
    height: 38px;
    min-width: 38px;
    min-height: 38px;
  }
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__lower .c-tutorial-item__metadata-short .o-badge-video svg {
    width: 13px;
    height: 14px;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__lower .c-tutorial-item__metadata-short .c-tutorial-item__metadata-short-string {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex .c-tutorial-item .c-tutorial-item__lower .c-tutorial-item__metadata-short .c-tutorial-item__metadata-short-string {
    display: inline-block;
    margin-left: 9px;
    font-size: 0.875rem;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item--in-progress {
    border-bottom: none;
  }
}
@media screen {
  .c-tutorial--list-style-complex .c-tutorial-item--complete .c-tutorial-item__art .c-tutorial-item__complete {
    display: none;
  }
  .c-tutorial--list-style-complex .c-tutorial-item--complete .c-tutorial-item__lower {
    flex-wrap: wrap;
  }
  .c-tutorial--list-style-complex .c-tutorial-item--complete .c-tutorial-item__lower .c-tutorial-item__description {
    order: 0;
  }
  .c-tutorial--list-style-complex .c-tutorial-item--complete .c-tutorial-item__lower .c-tutorial-item__complete {
    order: 1;
  }
  .c-tutorial--list-style-complex .c-tutorial-item--complete .c-tutorial-item__lower .o-badge--pro, .c-tutorial--list-style-complex .c-tutorial-item--complete .c-tutorial-item__lower .o-badge-video {
    display: none !important;
  }
}
@media screen {
  .c-tutorial--list-style-complex-zero .c-tutorial-item__upper {
    grid-template-columns: 1fr !important;
  }
  .c-tutorial--list-style-complex-zero .c-tutorial-item__title {
    margin-top: 10px !important;
    padding-right: 0 !important;
  }
  .c-tutorial--list-style-complex-zero .o-button--bookmark, .c-tutorial--list-style-complex-zero .c-tutorial-item__art, .c-tutorial--list-style-complex-zero .c-tutorial-item__metadata-short, .c-tutorial--list-style-complex-zero .c-tutorial-item__platform {
    display: none !important;
  }
  .c-tutorial--list-style-complex-zero .c-tutorial-item__description {
    padding-right: 0 !important;
  }
}
@media screen and (max-width: 992px) {
  .c-tutorial--list-style-complex-zero .c-tutorial-item__metadata {
    display: block !important;
  }
}
@media screen {
  .c-tutorial--list-progress .c-tutorial-item {
    height: 120px;
  }
  .c-tutorial--list-progress .c-tutorial-item a {
    padding: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list-progress .c-tutorial-item a {
    align-content: initial !important;
  }
}
@media screen {
  .c-tutorial--list-progress .c-tutorial-item .c-tutorial-item__upper {
    grid-template-columns: 120px 1fr !important;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list-progress .c-tutorial-item .c-tutorial-item__upper {
    grid-template-columns: 120px 1fr !important;
  }
}
@media screen {
  .c-tutorial--list-progress .c-tutorial-item__text {
    align-content: center !important;
    padding-right: 18px;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list-progress .c-tutorial-item__text {
    order: 2 !important;
    padding-left: 18px;
    min-width: 100%;
  }
}
@media screen {
  .c-tutorial--list-progress .c-tutorial-item__art {
    width: 120px !important;
    height: 120px !important;
    border-radius: 0 !important;
    background: none !important;
    position: relative;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list-progress .c-tutorial-item__art {
    order: 1;
  }
}
@media screen {
  .c-tutorial--list-progress .c-tutorial-item__art:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(55, 55, 55, 0.8);
    z-index: 1;
  }
}
@media screen {
  .c-tutorial--list-progress .c-tutorial-item__art img.c-tutorial-item__art-image--alternate {
    position: absolute;
    left: 0;
    top: 10px;
    width: 100%;
    height: auto;
    transform: scale(2);
    filter: blur(4px);
  }
}
@media screen {
  .c-tutorial--list-progress .o-circular--progress {
    z-index: 2;
  }
  .c-tutorial--list-progress .o-circular--progress .o-circular--progress__container-left, .c-tutorial--list-progress .o-circular--progress .o-progress--half-circle {
    border-color: #ffffff !important;
  }
  .c-tutorial--list-progress .o-circular--progress .o-circular-progress--label {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 54px;
    height: 46px;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -23px 0 0 -27px;
    color: #ffffff;
    font-family: "Bitter", serif;
    font-weight: bold;
    letter-spacing: -0.5px;
    font-size: 1.125rem !important; /* 18/16 */
  }
  .c-tutorial--list-progress .o-circular--progress .o-circular-progress--label .o-circluar--percent__text {
    color: #ffffff !important;
    font-size: 1.125rem !important;
    padding: 0;
  }
}
@media screen {
  .c-tutorial--list-progress .c-tutorial-item__title {
    font-size: 1.1875rem !important; /* 19/16 */
    margin-top: 20px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 100%;
    width: 100% !important;
  }
}
@media screen {
  .c-tutorial--list-progress .c-tutorial-item__platform, .c-tutorial--list-progress .c-tutorial-item__metadata {
    display: block !important;
    margin-top: 3px !important;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 100%;
    width: 100% !important;
  }
}
@media screen {
  .c-tutorial--list-progress .c-tutorial-item__platform-long {
    display: none !important;
  }
}
@media screen {
  .c-tutorial--list-progress .c-tutorial-item__platform, .c-tutorial--list-progress .c-tutorial-item__metadata, .c-tutorial--list-progress .c-tutorial-item__description {
    font-size: 0.875rem !important; /* 14/16 */
  }
}
@media screen {
  .c-tutorial--list-progress .c-tutorial-item__title, .c-tutorial--list-progress .c-tutorial-item__platform, .c-tutorial--list-progress .c-tutorial-item__description {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    max-width: 100%;
  }
}
@media screen {
  .c-tutorial--list-progress .c-tutorial-item__description {
    margin: 0 !important;
  }
  .c-tutorial--list-progress .c-tutorial-item__description p {
    margin: 0 !important;
    font-size: 0.875rem !important;
  }
}
@media screen {
  .c-tutorial--featured .l-tutorial-container__wrapper {
    grid-row-gap: 30px;
  }
  .c-tutorial--featured .c-tutorial-item--in-progress .c-tutorial-item__in-progress {
    display: block;
  }
  .c-tutorial--featured .c-tutorial-item {
    width: 480px;
    min-width: 480px;
    height: 325px;
    position: relative;
  }
  .c-tutorial--featured .c-tutorial-item > a {
    display: flex;
    align-items: flex-end;
    height: 100%;
    overflow: hidden;
    border-radius: 0.5625rem;
  }
  .c-tutorial--featured .c-tutorial-item > a:hover .c-tutorial-item__art img {
    transform: scale(1.3);
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__art {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__art:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to bottom, rgba(51, 51, 51, 0) 0%, rgb(51, 51, 51) 100%);
    z-index: 1;
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__art img {
    transition: 0.5s all;
    transform: scale(1.2);
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__art .o-badge {
    left: 15px;
    top: 15px;
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__art .o-badge-video, .c-tutorial--featured .c-tutorial-item .c-tutorial-item__art .o-badge--pro {
    right: 15px !important;
    top: 15px !important;
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__text {
    position: relative;
    align-self: flex-end;
    padding: 21px 24px;
    z-index: 2;
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__text span {
    color: #ffffff;
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    font-size: 1.875rem; /* 30/16 */
    line-height: 1.25;
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__category {
    font-size: 1.3125em; /* 21/16 */
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description {
    display: none;
    color: #ffffff;
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata {
    margin-top: 12px !important;
    display: block !important;
    font-size: 0.9375rem !important; /* 15/16 */
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__platform {
    margin-top: 3px;
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata-short, .c-tutorial--featured .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata, .c-tutorial--featured .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__platform {
    color: #ffffff !important;
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__lower {
    display: none !important;
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__text-upper-meta {
    display: none !important;
  }
  .c-tutorial--featured .c-tutorial-item .c-tutorial-item__icon {
    position: absolute;
    right: 15px;
    top: 15px !important;
    z-index: 3;
  }
  .c-tutorial--featured .c-tutorial-item .o-badge-tutorial {
    display: none;
  }
  .c-tutorial--featured .c-tutorial-item .o-button--bookmark {
    display: none;
  }
}
@media screen {
  .c-tutorial--card .c-tutorial-item__metadata-short .o-badge-video {
    display: none;
  }
  .c-tutorial--card.c-tutorial--number .c-tutorial-item__text {
    margin-top: 40px !important;
  }
  .c-tutorial--card.c-tutorial--number .c-tutorial-item__art--product + .c-tutorial-item__text {
    margin-top: 20px !important;
  }
}
@media screen {
  .c-tutorial--list.c-tutorial--number .c-tutorial-item {
    padding-left: 86px;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list.c-tutorial--number .c-tutorial-item {
    padding-left: 56px;
  }
}
@media screen {
  .c-tutorial--list.c-tutorial--number .c-tutorial-item:before {
    content: "";
    position: absolute;
    left: 27px;
    top: 100px;
    width: 6px;
    height: calc(100% - 50px);
    background: #DFE7F0;
    border-radius: 100px;
  }
}
@media screen {
  .c-tutorial--list.c-tutorial--number .c-tutorial-item.c-tutorial-item--complete:before {
    background: #158443;
  }
}
@media screen {
  .c-tutorial--list.c-tutorial--number .o-badge-tutorial {
    position: absolute;
    top: 36px;
    left: 0;
  }
}
@media screen {
  .c-tutorial--contributor .c-tutorial-item__text .c-tutorial-item__complete {
    display: none;
  }
  .c-tutorial--contributor .c-tutorial-item__text .o-badge-role {
    display: inline-flex;
  }
  .c-tutorial--contributor .c-tutorial-item__text .c-tutorial-item__platform {
    display: none;
  }
}
@media screen {
  .c-tutorial--mini .c-tutorial-item {
    margin-top: 15px;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mini .c-tutorial-item {
    margin-top: 0;
  }
}
@media screen {
  .c-tutorial--mini .c-tutorial-item a {
    padding: 13px 15px;
    grid-template-columns: 54px 1fr;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mini .c-tutorial-item a {
    padding: 0;
  }
}
@media screen {
  .c-tutorial--mini .c-tutorial-item .o-button--bookmark {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mini .c-tutorial-item .o-button--bookmark {
    display: block;
  }
}
@media screen {
  .c-tutorial--mini .c-tutorial-item .c-tutorial-item__art {
    width: 54px;
    height: 54px;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mini .c-tutorial-item .c-tutorial-item__art {
    width: 72px;
    height: 72px;
  }
}
@media screen {
  .c-tutorial--mini .c-tutorial-item .c-tutorial-item__art span.o-badge {
    display: none;
  }
}
@media screen {
  .c-tutorial--mini .c-tutorial-item .c-tutorial-item__text {
    margin-left: 15px;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mini .c-tutorial-item .c-tutorial-item__text {
    margin-left: 0;
  }
}
@media screen {
  .c-tutorial--mini .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    font-size: 1.125rem; /* 18/16 */
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mini .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    font-size: 1.3125rem;
  }
}
@media screen {
  .c-tutorial--mini .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata {
    margin-top: 2px;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mini .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__metadata {
    margin-top: 8px;
  }
}
@media screen {
  .c-tutorial--mini .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description, .c-tutorial--mini .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__platform {
    display: none;
  }
}
@media screen {
  .c-tutorial--mini .c-tutorial-item .c-tutorial-item__icon, .c-tutorial--mini .c-tutorial-item .c-tutorial-item__in-progress, .c-tutorial--mini .c-tutorial-item .c-tutorial-item__complete {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mini .c-tutorial-item .c-tutorial-item__icon {
    display: none;
  }
}
@media screen {
  .c-tutorial-episode {
    position: relative;
    padding-left: 64px;
    margin-top: 20px;
  }
  .c-tutorial-episode:first-child {
    margin-top: 0;
  }
  .c-tutorial-episode:last-child:before {
    display: none;
  }
  .c-tutorial-episode:before {
    content: "";
    position: absolute;
    left: 20px;
    top: 40px;
    width: 6px;
    height: calc(100% - 32px);
    background: #DFE7F0;
    border-radius: 100px;
    transition: 0.75s all;
  }
  .c-tutorial-episode > div:last-child {
    height: 0;
  }
  .c-tutorial-episode a {
    color: #333333;
    text-decoration: none;
  }
  .c-tutorial-episode a:hover {
    color: #158443;
  }
  .c-tutorial-episode h4 {
    font-size: 1.3125rem; /* 21/16 */
  }
  .c-tutorial-episode p {
    font-size: 1rem;
    margin-top: 10px;
    color: #333333;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-episode p {
    font-size: 0.9375rem;
  }
}
@media screen {
  .c-tutorial-episode .c-tutorial-episode__length {
    font-family: "Bitter", serif;
    font-size: 1.125em; /* 18/16 */
    margin-left: 8px;
    position: relative;
    top: 3px;
  }
}
@media screen {
  .c-tutorial-episode .o-badge {
    margin-left: 12px;
    position: relative;
    top: 1px;
  }
}
@media screen {
  .c-tutorial-episode .o-badge-tutorial {
    position: absolute;
    top: -9px;
    left: 0;
    width: 46px;
    height: 46px;
    font-size: 1.1875rem; /* 19/16 */
  }
  .c-tutorial-episode .o-badge-tutorial svg {
    display: none;
  }
}
@media screen {
  .c-tutorial-episode .o-button--mark-as-complete {
    position: absolute;
    left: 0;
    top: -9px;
    width: 46px;
    height: 46px;
    cursor: pointer;
    z-index: 99;
  }
  .c-tutorial-episode .o-button--mark-as-complete:focus {
    outline: none;
  }
}
@media screen {
  .c-tutorial-episode__number-badge .o-badge-tutorial--checkmark, .c-tutorial-episode__number-badge .o-badge-tutorial--locked {
    display: none;
  }
}
@media screen {
  .c-tutorial-episode--completed:before {
    background: #158443 !important;
  }
  .c-tutorial-episode--completed .c-tutorial-episode__number-badge {
    background: #158443;
  }
  .c-tutorial-episode--completed .c-tutorial-episode__number-badge .o-badge-tutorial {
    display: none;
  }
  .c-tutorial-episode--completed .c-tutorial-episode__number-badge .o-badge-tutorial--checkmark {
    display: flex;
  }
  .c-tutorial-episode--completed .c-tutorial-episode__number-badge svg {
    display: block;
  }
  .c-tutorial-episode--completed [data-tooltip]:before {
    left: 70px !important;
    content: attr(data-unmark-complete) !important;
  }
}
@media screen {
  .c-tutorial-episode--locked .o-badge-tutorial {
    display: none;
  }
  .c-tutorial-episode--locked .o-badge-tutorial--locked {
    display: flex;
  }
}
@media screen {
  .c-tutorial-card--large .c-tutorial-item {
    padding: 42px 30px 96px;
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-card--large .c-tutorial-item {
    background: none;
    padding: 0;
    box-shadow: none;
    margin-top: 24px;
  }
}
@media screen {
  .c-tutorial-card--large .c-tutorial-item__art {
    display: flex;
    min-height: 240px;
    margin-bottom: 24px;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-card--large .c-tutorial-item__art {
    background: none;
    margin-bottom: 21px;
    min-height: auto;
  }
}
@media screen {
  .c-tutorial-card--large .c-tutorial-item__art img {
    width: 200px;
    margin: 0 auto;
    align-self: center;
  }
}
@media screen {
  .c-tutorial-card--large .c-tutorial-item__title {
    font-size: 1.6875rem !important; /* 27/16 */
    line-height: 1.3;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-card--large .c-tutorial-item__title {
    font-size: 1.3125rem !important; /* 21/16 */
    line-height: 1.35;
  }
}
@media screen {
  .c-tutorial-card--large .c-tutorial-item__icon {
    position: absolute;
    top: 20px;
    right: 20px;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-card--large .c-tutorial-item__icon {
    top: 0;
    right: 0;
  }
}
@media screen {
  .c-tutorial-card--large .o-button {
    display: flex;
    position: absolute;
    bottom: 30px;
    width: calc(100% - 60px);
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-card--large .o-button {
    width: 100%;
    position: relative;
    bottom: auto;
    margin-top: 18px;
  }
}
@media screen {
  .c-tutorial-card--large .o-progress-indicator {
    margin-top: 18px;
  }
  .c-tutorial-card--large .o-progress-indicator .o-progress-indicator__fill {
    width: 25%;
  }
}
@media screen {
  .c-tutorial-item__art.c-tutorial-item__art--learning-path {
    background: none !important;
    height: 100% !important;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-item__art.c-tutorial-item__art--learning-path {
    height: auto !important;
    width: 100% !important;
    margin: 0 auto !important;
  }
}
@media screen {
  .c-tutorial-item__art.c-tutorial-item__art--learning-path img {
    transform: scale(1) !important;
  }
}
@media screen {
  .o-progress-indicator--learning-path {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: none;
  }
  .o-progress-indicator--learning-path .o-progress-indicator__fill {
    width: 25%;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-item--learning-path {
    margin-top: 24px !important;
  }
}
@media screen {
  .c-tutorial-item--learning-path a {
    grid-template-columns: 90px 1fr 0 !important;
  }
}
@media screen {
  .c-tutorial-item--learning-path .c-tutorial-item__platform {
    display: grid !important;
  }
  .c-tutorial-item--learning-path .c-tutorial-item__platform .o-badge--pro {
    order: 2;
    margin-top: 6px !important;
  }
}
@media screen {
  .c-tutorial-item--learning-path .c-tutorial-item__text .c-tutorial-item__description {
    padding-right: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-item--learning-path .c-tutorial-item__text {
    margin-left: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-item--learning-path .c-tutorial-item__art {
    margin-bottom: 21px !important;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-item--learning-path .c-tutorial-item__icon {
    top: 0 !important;
    right: 0 !important;
  }
}
@media screen {
  .c-tutorial-item--learning-path .c-tutorial-item__continue {
    display: flex !important;
    box-shadow: 0 !important;
    color: #ffffff !important;
    background: #158443 !important;
    padding: 5px 9px 5px 11px !important;
    align-items: center;
    position: absolute;
    bottom: 21px;
    left: 129px;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial-item--learning-path .c-tutorial-item__continue {
    left: 0;
    padding: 5px 9px 5px 11px !important;
    border-radius: 0.5625rem !important;
  }
}
@media screen {
  .c-tutorial-item--learning-path .c-tutorial-item__continue:hover {
    background: #17914a;
  }
}
@media screen {
  .c-tutorial-item--learning-path .c-tutorial-item__continue .c-tutorial-item__complete-text {
    position: relative;
    top: -1px;
  }
}
@media screen {
  .c-tutorial-item--learning-path .c-tutorial-item__continue i {
    display: flex;
    justify-content: center;
    align-content: center;
    width: 15px;
    height: 20px;
    margin-right: 0;
    margin-left: 3px;
  }
  .c-tutorial-item--learning-path .c-tutorial-item__continue i svg {
    width: 11px;
    fill: #ffffff;
  }
}
@media screen {
  .c-tutorial--dark .c-tutorial-item a {
    background: none !important;
    box-shadow: none;
    border-radius: 0 !important;
    border-bottom: 2px solid #3B4048;
    padding: 21px 21px 21px 0;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--dark .c-tutorial-item a {
    padding: 0 0 21px 0;
    border-bottom: 0;
  }
}
@media screen {
  .c-tutorial--dark .c-tutorial-item .c-tutorial-item__title {
    color: #ffffff !important;
  }
}
@media screen {
  .c-tutorial--dark .c-tutorial-item .c-tutorial-item__metadata {
    color: #A7ADB4 !important;
  }
}
@media screen {
  .c-tutorial--dark .c-tutorial-item .c-tutorial-item__metadata-short {
    color: #A7ADB4 !important;
  }
}
@media screen {
  .c-tutorial--dark .c-tutorial-item .c-tutorial-item__description, .c-tutorial--dark .c-tutorial-item .c-tutorial-item__platform {
    color: #A7ADB4 !important;
  }
}
@media screen {
  .c-tutorial--mason .c-tutorial-item__actions {
    position: absolute;
    bottom: 21px;
    right: 21px;
    z-index: 1;
  }
  .c-tutorial--mason .c-tutorial-item__actions .o-icon-button {
    background: #333333;
  }
  .c-tutorial--mason .c-tutorial-item__actions .o-dropdown-menu--dark a {
    padding: 0 !important;
    background: none !important;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__upper {
    display: grid;
    grid-template-columns: 1fr 90px;
    width: 100%;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__text-upper-meta {
    display: none;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__lower {
    display: block;
  }
  .c-tutorial--mason .c-tutorial-item > a, .c-tutorial--mason .c-tutorial-item > div.c-tutorial-item__wrapper {
    overflow: hidden;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
    padding: 21px;
    height: 100%;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__art {
    order: 2;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__art .o-badge-video, .c-tutorial--mason .c-tutorial-item .c-tutorial-item__art .o-badge--pro {
    display: none;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__art .o-badge-tutorial--locked, .c-tutorial--mason .c-tutorial-item .c-tutorial-item__art .o-badge-tutorial--recording {
    display: flex;
    width: 48px;
    height: 48px;
    left: 50% !important;
    top: 50% !important;
    margin: -24px 0 0 -24px;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__text {
    order: 1;
    margin-left: 0;
    align-content: start !important;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__title {
    padding-right: 30px;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__text .o-badge--new {
    display: inline-flex;
    position: absolute;
    top: 0;
    right: 10px;
    z-index: 2;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__text .o-badge--pro {
    display: inline-flex;
    max-width: min-content;
    box-shadow: none;
    margin-top: 0;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description {
    margin-top: 15px;
    padding-right: 0;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__icon, .c-tutorial--mason .c-tutorial-item .o-badge--new {
    display: none;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__metadata-short {
    display: flex;
    align-items: center;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__metadata-short .o-badge, .c-tutorial--mason .c-tutorial-item .c-tutorial-item__metadata-short .o-badge-video {
    margin-right: 9px;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__metadata-short .o-badge-video {
    width: 38px;
    height: 38px;
    min-width: 38px;
    min-height: 38px;
  }
  .c-tutorial--mason .c-tutorial-item .c-tutorial-item__metadata-short .o-badge-video svg {
    width: 13px;
  }
}
@media screen {
  .c-tutorial--mason-mini a {
    grid-template-columns: 1fr 72px !important;
    padding: 18px 21px !important;
  }
  .c-tutorial--mason-mini .c-tutorial-item__title {
    font-size: 1.1875em !important; /* 19/16 */
    padding-right: 30px !important;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mason-mini .c-tutorial-item__title {
    font-size: 1.3125em !important; /* 21/16 */
  }
}
@media screen {
  .c-tutorial--mason-mini .c-tutorial-item__art {
    width: 72px !important;
    height: 72px !important;
  }
}
@media screen {
  .c-tutorial--mason-mini .c-tutorial-item__metadata {
    display: block !important;
  }
}
@media screen {
  .c-tutorial--mason-mini .c-tutorial-item__metadata-short {
    color: #333333;
  }
}
@media screen {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__upper {
    grid-template-columns: 90px 1fr;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__upper {
    grid-template-columns: 1fr 72px;
  }
}
@media screen {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__text-upper {
    margin-left: 18px;
    order: 2;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__text-upper {
    margin-left: 0;
    order: 1;
  }
}
@media screen {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__text-upper .o-badge--new {
    display: block;
    position: absolute;
    right: 21px;
    top: 21px;
    margin-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__text-upper .o-badge--new {
    right: 10px;
    top: 10px;
    z-index: 2;
  }
}
@media screen {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__text-upper-meta {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__text-upper-meta {
    display: none;
  }
}
@media screen {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__platform {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__platform {
    display: block;
  }
}
@media screen {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__platform-long {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__platform-long {
    display: none;
  }
}
@media screen {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__description {
    margin-top: 9px !important;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__description {
    margin-top: 15px !important;
  }
}
@media screen {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__lower {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--mason-large .c-tutorial-item .c-tutorial-item__lower {
    display: block;
  }
}
@media screen {
  .c-tutorial--mason-art .c-tutorial-item__art {
    width: 180px !important;
    height: 100% !important;
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 0 !important;
  }
  .c-tutorial--mason-art .c-tutorial-item__art-image--alternate {
    transform: none !important;
    width: auto !important;
    height: 100% !important;
  }
  .c-tutorial--mason-art .c-tutorial-item__lower {
    padding-right: 180px;
  }
  .c-tutorial--mason-art .o-button--bookmark {
    right: 192px !important;
  }
}
@media screen {
  .c-tutorial--mason-small .c-tutorial-item > a, .c-tutorial--mason-small .c-tutorial-item > div {
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.075);
  }
  .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__upper {
    grid-template-columns: 1fr 72px;
    grid-column-gap: 16px;
  }
  .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__lower {
    display: inline-grid;
  }
  .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__title {
    font-size: 1.25rem; /* 20/16 */
    padding-right: 0 !important;
    line-height: 1.2;
  }
  .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__platform, .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__parent {
    margin-top: 5px !important;
  }
  .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__metadata-short {
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 90%;
    height: 40px;
    line-height: 40px;
  }
  .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__metadata-short .o-badge-video {
    margin-right: 5px;
    display: inline-flex;
    top: 2px;
  }
  .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__metadata-short .o-badge-video svg {
    height: 14px;
  }
  .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__metadata-short .o-badge--pro {
    height: 26px;
    line-height: 16px;
    margin-right: 5px;
  }
  .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__description, .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__platform, .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__metadata-short {
    font-size: 0.875rem; /* 14/16 */
  }
  .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__art {
    width: 72px !important;
    height: 72px !important;
  }
  .c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__complete {
    width: 108px;
  }
}
@media screen {
  .c-tutorial--mason-mini-bookmark a {
    padding: 18px 45px 18px 21px !important;
  }
  .c-tutorial--mason-mini-bookmark a .o-button--bookmark {
    right: 10px !important;
    top: 18px !important;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list.c-tutorial--number .c-tutorial-item__number-badge .o-badge-tutorial {
    width: 42px;
    height: 42px;
    top: 13px !important;
    left: 0 !important;
    font-size: 1rem;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--list.c-tutorial--number .c-tutorial-item__art {
    display: none;
  }
}
@media screen {
  .c-tutorial--mark-as-complete .o-button--bookmark {
    display: none !important;
  }
  .c-tutorial--mark-as-complete .o-button--mark-as-complete {
    display: block;
  }
}
@media screen {
  .c-tutorial--white .c-tutorial-item {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    min-height: 340px;
    overflow: hidden;
  }
  .c-tutorial--white .c-tutorial-item .c-tutorial-item__art {
    border-radius: 0.5625rem 0.5625rem 0 0;
  }
  .c-tutorial--white .c-tutorial-item .c-tutorial-item__text {
    white-space: normal;
    padding: 0 18px;
    padding-bottom: 50px;
  }
  .c-tutorial--white .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description {
    display: block;
  }
}
@media screen {
  .c-tutorial--floating-button .c-tutorial-item .c-tutorial-item__text {
    padding-bottom: 100px;
  }
  .c-tutorial--floating-button .c-tutorial-item .o-button {
    position: absolute;
    bottom: 24px;
  }
}
@media screen {
  .c-tutorial--book .c-tutorial-item.c-tutorial-item--locked .o-badge-tutorial--locked {
    display: flex;
    top: 50% !important;
  }
  .c-tutorial--book .c-tutorial-item .o-badge--new {
    display: inline-flex;
    position: absolute;
    top: -20px;
    right: -10px;
    z-index: 2;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__actions {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 1;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__actions .o-icon-button {
    background: #333333;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__art {
    border-radius: 21px;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__art .o-badge--new {
    display: none;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__art .o-badge-tutorial--locked {
    width: 48px;
    height: 48px;
    top: 50%;
    left: 50%;
    top: -24px;
    margin-top: -24px;
    margin-left: -24px;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__in-progress {
    width: 100%;
    height: 6px;
    border-radius: 100px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    display: none;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__in-progress .c-tutorial-item__in-progress--fill {
    width: 50%;
    background: #158443;
    height: 6px;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 100px;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__complete {
    display: none;
    color: #ffffff;
    margin-top: 10px;
    background: #158443;
    align-items: center;
    width: 100%;
    border-radius: 0;
    bottom: 0;
    left: 0;
    justify-content: center;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__complete .c-tutorial-item__complete-text {
    position: relative;
    top: -1px;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__complete i {
    display: flex;
    justify-content: center;
    align-content: center;
    width: 15px;
    height: 20px;
    margin-right: 6px;
    border-radius: 7px;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__art .c-tutorial-item__complete i svg {
    width: 11px;
    fill: #ffffff;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__title {
    font-size: 1.25rem; /* 20/16 */
    line-height: 1.25;
    text-align: center;
    margin-top: 15px;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__metadata-short, .c-tutorial--book .c-tutorial-item .c-tutorial-item__platform {
    color: #6E7687;
    font-size: 0.875rem; /* 14/16 */
    text-align: center;
    margin-top: 6px;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__platform-long {
    display: block;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__text-upper-meta {
    width: 100%;
    text-align: center;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__text-upper-meta .c-tutorial-item__description {
    display: none;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__metadata-short {
    display: block;
    width: 100%;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__parent, .c-tutorial--book .c-tutorial-item .c-tutorial-item__metadata {
    display: none;
  }
  .c-tutorial--book .c-tutorial-item .c-tutorial-item__lower {
    display: none;
  }
  .c-tutorial--book .c-tutorial-item--in-progress .c-tutorial-item__art .c-tutorial-item__in-progress {
    display: block;
  }
  .c-tutorial--book .c-tutorial-item--in-progress .c-tutorial-item__text-upper-meta .c-tutorial-item__in-progress {
    display: none;
  }
  .c-tutorial--book .c-tutorial-item--complete .c-tutorial-item__art .c-tutorial-item__complete {
    display: inline-flex;
  }
  .c-tutorial--book .c-tutorial-item--complete .c-tutorial-item__text-upper-meta .c-tutorial-item__complete {
    display: none;
  }
}
@media screen {
  .c-tutorial--editable-books .c-tutorial-item__actions--book {
    display: block;
  }
}
@media screen {
  .c-tutorial--editable-tutorials.c-tutorial--mason .c-tutorial-item__metadata-short {
    width: 60%;
  }
  .c-tutorial--editable-tutorials.c-tutorial--mason .o-button--bookmark {
    right: 66px;
    bottom: 6px;
  }
  .c-tutorial--editable-tutorials .c-tutorial-item__actions--tutorial {
    display: block;
  }
}
@media screen {
  .c-tutorial--no-margin .c-tutorial-item {
    margin-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-tutorial--no-margin .c-tutorial-item {
    margin-top: 0 !important;
  }
}
@media screen {
  .c-tutorial--cta-card .c-tutorial-item > a {
    flex-direction: column;
  }
  .c-tutorial--cta-card .c-tutorial-item > a .c-tutorial-item__upper .c-tutorial-item__art {
    margin-top: -21px;
    margin-left: -21px;
    width: calc(100% + 42px) !important;
    border-radius: 0.5625rem 0.5625rem 0 0;
  }
  .c-tutorial--cta-card.c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__upper {
    display: block;
  }
  .c-tutorial--cta-card.c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__text {
    padding-top: 6px;
  }
  .c-tutorial--cta-card.c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__text .c-tutorial-item__title {
    padding-top: 14px;
    line-height: 1.25;
  }
  .c-tutorial--cta-card.c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__upper .o-badge--pro {
    position: absolute;
    top: 0;
    right: 10px;
    z-index: 2;
    margin-top: 150px;
  }
  .c-tutorial--cta-card.c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__upper .o-badge--new {
    right: unset;
    left: 10px;
  }
  .c-tutorial--cta-card.c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__art {
    height: 160px !important;
  }
  .c-tutorial--cta-card.c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__upper .c-tutorial-item__art img {
    transform: scale(1);
    align-self: flex-start;
  }
  .c-tutorial--cta-card.c-tutorial--mason .c-tutorial-item .c-tutorial-item__text .c-tutorial-item__description {
    margin-top: 0px;
  }
  .c-tutorial--cta-card .c-tutorial-item__metadata-short {
    margin-top: 9px;
    display: block !important;
  }
  .c-tutorial--cta-card.c-tutorial--floating-button .c-tutorial-item .c-tutorial-item__text {
    padding-bottom: 15px;
  }
  .c-tutorial--cta-card.c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__metadata-short .o-badge--pro {
    display: none;
  }
}
@media screen {
  .c-tutorial--reduced.c-tutorial--mason-small .c-tutorial-item .c-tutorial-item__metadata-short {
    display: none;
  }
}
@media screen {
  .c-video-player {
    min-height: 100vh;
    position: relative;
    background: #333333;
    color: #ffffff;
    overflow: hidden;
    padding: 0px 60px 120px 140px;
  }
}
@media screen and (max-width: 1080px) {
  .c-video-player {
    padding: 0px 30px 0 110px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player {
    padding: 0px 30px 0;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player {
    padding: 0;
  }
}
@media screen {
  .c-video-player.c-video-player--cinema nav {
    top: inherit !important;
  }
}
@media screen {
  .c-video-player.c-video-player--nav {
    padding: 0px 60px 90px;
  }
}
@media screen and (max-width: 1080px) {
  .c-video-player.c-video-player--nav {
    padding: 0px 30px 0;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player.c-video-player--nav {
    padding: 0 20px 0;
  }
}
@media screen {
  .c-video-player.c-video-player--nav .o-button-sidebar--open {
    display: none;
  }
}
@media screen {
  .c-video-player.c-video-player--nav .o-button-sidebar--close {
    display: inline-flex;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player.c-video-player--nav .o-button-sidebar--close {
    display: none;
  }
}
@media screen {
  .c-video-player.c-video-player--nav .c-video-player__lessons {
    display: block !important;
    width: 320px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player.c-video-player--nav .c-video-player__lessons {
    width: 100%;
  }
}
@media screen {
  .c-video-player.c-video-player--nav .c-video-player__lessons-section {
    display: block;
  }
  .c-video-player.c-video-player--nav .c-video-player__lessons-section .c-tutorial-item__metadata-short {
    display: none;
  }
}
@media screen {
  .c-video-player.c-video-player--nav .c-video-player__lessons-section--action {
    display: block;
    padding: 20px 24px;
    border-bottom: 1px solid #434A53;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player.c-video-player--nav .c-video-player__lessons-section--action {
    display: none;
  }
}
@media screen {
  .c-video-player.c-video-player--nav .c-video-player__wrapper {
    margin: 0 auto 0 auto;
    padding-left: 320px;
    max-width: 1280px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player.c-video-player--nav .c-video-player__wrapper {
    padding-left: 0;
    padding-right: 0;
  }
}
@media screen {
  .c-video-player.c-video-player--nav .c-video-player__video {
    border-radius: 0.5625rem;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player.c-video-player--nav .c-video-player__video {
    border-radius: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player .c-video-player__wrapper {
    display: grid;
    width: 100%;
  }
}
@media screen {
  .c-video-player .c-video-player__video {
    background: linear-gradient(to right bottom, #333333, #363638, #38393d, #3a3c43, #3b4048);
    border-radius: 0.5625rem;
    margin-top: 40px;
    margin-bottom: 24px;
    padding-top: 56.25%;
    position: relative;
    overflow: hidden;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player .c-video-player__video {
    margin-bottom: 15px;
    margin-top: 0;
    margin-left: -30px;
    width: calc(100% + 60px);
    border-radius: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player .c-video-player__video {
    margin-left: -20px;
    width: calc(100% + 40px);
  }
}
@media screen and (max-width: 600px) {
  .c-video-player .c-video-player__video {
    margin-left: -20px;
    width: calc(100% + 40px);
    border-radius: 0 !important;
    margin-bottom: 0;
    padding-bottom: 20px;
  }
}
@media screen {
  .c-video-player .c-video-player__video .c-video-player__preloader {
    width: 100%;
    animation-duration: 0.5s;
  }
}
@media screen {
  div.vimeo-player > div[style] {
    padding: 0 0 0 0 !important;
    position: inherit !important;
  }
}
@media screen {
  .c-video-player__lessons:hover {
    overflow-y: auto;
  }
}
@media screen {
  .c-video-player__lessons {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 80px;
    height: 100%;
    background: linear-gradient(to right bottom, #333333, #363638, #38393d, #3a3c43, #3b4048);
    padding: 4px 0 36px 0;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .c-video-player__lessons::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__lessons {
    width: 100%;
    position: relative;
    order: 3;
    background: none;
    padding: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__lessons .c-video-player__lessons-section--action {
    display: none;
  }
}
@media screen {
  .c-video-player__lessons .o-button-sidebar--open {
    position: absolute;
    top: 15px;
    left: 22px;
    cursor: pointer;
  }
  .c-video-player__lessons .o-button-sidebar--open svg {
    width: 26px;
    height: 26px;
    margin: -13px 0 0 -13px;
  }
}
@media screen {
  .c-video-player__lessons .o-button-sidebar--close {
    display: none;
  }
}
@media screen {
  .c-video-player__lessons .c-video-player__lessons-section {
    padding: 0 24px;
    border-bottom: 1px solid #434A53;
    padding-bottom: 20px;
    display: none;
  }
  .c-video-player__lessons .c-video-player__lessons-section:last-child {
    border-bottom: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__lessons .c-video-player__lessons-section {
    display: block;
    padding: 0 0 24px 0;
  }
}
@media screen {
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lessons-header {
    display: block;
    cursor: pointer;
    position: relative;
  }
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lessons-header svg {
    width: 15px;
    height: 9px;
    fill: #B8CCE6;
    position: absolute;
    top: 50%;
    right: 0;
    opacity: 0.5;
    margin-top: -4px;
    transform: rotate(180deg);
  }
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lessons-header.c-video-player__lessons-header--open svg {
    transform: rotate(360deg);
  }
}
@media screen {
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lessons-title {
    display: block;
    font-size: 1.125rem; /* 18/16 */
    color: #ffffff;
    margin-top: 20px;
  }
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lessons-title .l-svg-collection {
    margin-right: 12px;
  }
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lessons-title a {
    color: #ffffff;
    text-decoration: none;
  }
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lessons-title a:hover {
    color: #158443;
  }
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lessons-title .o-badge--pro {
    margin-left: 12px;
  }
}
@media screen {
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lessons-sum {
    display: block;
    font-size: 0.75rem; /* 12/16 */
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #A7ADB4;
    margin-top: 3px;
  }
}
@media screen {
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lesson-list {
    display: none;
    margin: 18px 0 10px;
  }
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lesson-list > li {
    white-space: normal;
    overflow-x: visible;
    text-overflow: none;
  }
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lesson-list > li a:before {
    background: #ffffff;
    color: #333333;
    z-index: 999;
    top: -51px;
  }
}
@media screen and (max-width: 1080px) {
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lesson-list > li a:before {
    display: none;
  }
}
@media screen {
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lesson-list > li a:after {
    background: #ffffff;
    z-index: 998;
    top: -28px;
  }
}
@media screen and (max-width: 1080px) {
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lesson-list > li a:after {
    display: none;
  }
}
@media screen {
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lesson-list li > div {
    display: inline;
  }
}
@media screen {
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lesson-list li > div > button {
    position: absolute;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    cursor: pointer;
  }
}
@media screen {
  .c-video-player__lessons .c-video-player__lessons-section .c-video-player__lesson-list--open {
    display: block;
  }
}
@media screen {
  .c-video-player__lessons .c-video-player__lessons-section .c-tutorial-item {
    margin-top: 30px;
  }
  .c-video-player__lessons .c-video-player__lessons-section .c-tutorial-item:first-child {
    margin-top: 0;
  }
  .c-video-player__lessons .c-video-player__lessons-section .c-tutorial-item a {
    border-bottom: 0;
  }
}
@media screen {
  .c-video-player__lessons .c-video-player__lessons-section .o-button--mark-as-complete {
    width: 20px;
    height: 20px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 99;
    cursor: pointer;
  }
  .c-video-player__lessons .c-video-player__lessons-section .o-button--mark-as-complete:focus {
    outline: none;
  }
}
@media screen {
  .c-video-player__complete {
    display: none;
  }
  .c-video-player__complete .c-video-player__complete-wrapper {
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__complete h3 {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__complete .o-button--dark {
    background: none;
    margin-top: 9px;
  }
}
@media screen {
  .c-video-player__complete .c-video-player__complete-countdown {
    font-size: 0.9375rem; /* 15/16 */
    font-weight: 700;
    color: #ffffff;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__complete .c-video-player__complete-countdown {
    display: none;
  }
}
@media screen {
  .c-video-player__complete .c-video-player__complete-loader {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 120px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    cursor: pointer;
    border-radius: 100px;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__complete .c-video-player__complete-loader {
    width: 60px;
    height: 60px;
  }
}
@media screen {
  .c-video-player__complete .c-video-player__complete-loader:hover {
    background: #434A53;
  }
}
@media screen {
  .c-video-player__complete .c-video-player__complete-loader .c-video-player__complete-icon {
    width: 38px;
    height: 42px;
    fill: #ffffff;
    margin-right: -5px;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__complete .c-video-player__complete-loader .c-video-player__complete-icon {
    width: 20px;
    height: 30px;
  }
}
@media screen {
  .c-video-player__complete .c-video-player__complete-loader .c-video-player__complete-circle {
    position: absolute;
    left: 0;
    top: 0;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__complete .c-video-player__complete-loader .c-video-player__complete-circle {
    width: 60px;
    height: 60px;
  }
}
@media screen {
  .c-video-player__complete .c-video-player__complete-loader .c-video-player__complete-circle.c-video-player__complete-circle--fill {
    transform: rotate(-90deg);
  }
}
@media screen {
  .c-video-player__next {
    align-items: center;
  }
  .c-video-player__next .c-video-player__next-wrapper {
    max-width: 650px;
    width: 100%;
    margin: 0 auto;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__next .c-video-player__next-wrapper {
    padding: 0 20px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__next .c-video-player__next-wrapper .l-video-player-path-complete {
    display: none;
  }
}
@media screen {
  .c-video-player__next .c-video-player__next-wrapper > h3, .c-video-player__next .c-video-player__next-wrapper > p {
    text-align: center;
  }
}
@media screen {
  .c-video-player__next .c-video-player__next-wrapper > h3 {
    font-size: 1.5rem; /* 24/16 */
  }
}
@media screen {
  .c-video-player__next .c-video-player__next-wrapper > p {
    color: #A7ADB4;
    font-size: 1rem;
    margin-top: 12px;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__next .c-video-player__next-wrapper .l-video-player-uppercase {
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #ffffff;
    font-size: 11px;
    font-weight: 600;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item .o-button--bookmark {
    display: none !important;
  }
}
@media screen {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a {
    box-shadow: none;
    background: none;
    position: relative;
    z-index: 0;
  }
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a:before {
    content: "";
    position: absolute;
    top: -3px;
    left: -3px;
    width: calc(100% + 6px);
    height: calc(100% + 6px);
    background: rgb(248, 13, 13);
    background: linear-gradient(-45deg, rgb(248, 13, 13) 0%, rgb(114, 7, 250) 33%, rgb(45, 208, 169) 66%, rgb(208, 15, 201) 100%);
    border-radius: 0.5625rem;
    z-index: -1;
    background-size: 150% 150%;
    animation: a-background-gradient 5s ease infinite;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a:before {
    display: none !important;
  }
}
@media screen {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #434A53;
    border-radius: 0.5625rem;
    z-index: -1;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a:after {
    display: none !important;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a {
    text-align: center;
    border: none;
    padding: 0 !important;
  }
}
@media screen {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a .c-tutorial-item__upper {
    display: grid;
    grid-template-columns: 150px 1fr !important;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a .c-tutorial-item__upper {
    grid-template-columns: 1fr !important;
  }
}
@media screen {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a .c-tutorial-item__art {
    order: 1 !important;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a .c-tutorial-item__art {
    display: none;
  }
}
@media screen {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a .c-tutorial-item__text {
    order: 2 !important;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a .c-tutorial-item__text {
    text-align: center;
  }
}
@media screen {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a .c-tutorial-item__title {
    color: #ffffff;
    font-size: 1.3125rem !important; /* 21/16 */
  }
}
@media screen {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a .c-tutorial-item__description {
    color: #A7ADB4;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a .c-tutorial-item__description {
    display: none;
  }
}
@media screen {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a .c-tutorial-item__in-progress {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a .o-button--green {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__next .c-video-player__next-wrapper .c-tutorial-item a .o-button--green {
    display: inline-flex !important;
  }
}
@media screen and (max-width: 1280px) {
  .c-video-player--nav .c-video-player__next .c-video-player__next-wrapper {
    padding: 0 20px;
  }
}
@media screen and (max-width: 1280px) {
  .c-video-player--nav .c-video-player__next .c-video-player__next-wrapper .l-video-player-path-complete {
    display: none;
  }
}
@media screen and (max-width: 1280px) {
  .c-video-player--nav .c-video-player__next .c-video-player__next-wrapper > h3.l-video-player-hide-title {
    display: none;
  }
}
@media screen and (max-width: 1280px) {
  .c-video-player--nav .c-video-player__next .c-video-player__next-wrapper .l-video-player-title-sidebar {
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #ffffff;
    font-size: 11px;
    font-weight: 600;
    display: block !important;
  }
}
@media screen and (max-width: 1280px) {
  .c-video-player--nav .c-video-player__next .c-tutorial-item a .c-tutorial-item__upper {
    grid-template-columns: 1fr !important;
  }
}
@media screen and (max-width: 1280px) {
  .c-video-player--nav .c-video-player__next .c-tutorial-item a .c-tutorial-item__art {
    display: none;
  }
}
@media screen {
  .c-video-player__paywall {
    display: none;
    /* Below 1080px change the layout dramatically */
  }
  .c-video-player__paywall .c-video-player__paywall-mobile-link {
    display: none;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__paywall .c-video-player__paywall-mobile-link {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
  }
}
@media screen {
  .c-video-player__paywall .c-video-player__paywall-wrapper {
    display: flex;
    padding: 30px;
    align-items: center;
    height: 100%;
    max-width: 960px;
    margin: 0 auto;
    animation-duration: 0.5s;
  }
}
@media screen and (max-width: 1080px) {
  .c-video-player__paywall .c-video-player__paywall-wrapper {
    padding: 60px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__paywall .c-video-player__paywall-wrapper {
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__paywall .c-video-player__paywall-wrapper {
    padding: 15px;
  }
}
@media screen {
  .c-video-player__paywall .c-video-player__paywall-sign-in {
    font-size: 1rem;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__paywall .c-video-player__paywall-sign-in {
    display: none;
  }
}
@media screen {
  .c-video-player__paywall .c-video-player__paywall-sign-in a {
    color: #158443;
  }
}
@media screen {
  .c-video-player__paywall .c-video-player__paywall-copy {
    padding-right: 30px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__paywall .c-video-player__paywall-copy {
    padding-right: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__paywall .c-video-player__paywall-artwork {
    display: none;
  }
}
@media screen {
  .c-video-player__paywall .c-video-player__paywall-artwork img {
    width: 320px;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__paywall .c-video-player__paywall-options {
    margin-top: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__paywall h3 {
    text-align: center !important;
    line-height: 1.25;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__paywall h3 {
    font-size: 1.5rem !important; /* 24/16 */
  }
}
@media screen and (max-width: 400px) {
  .c-video-player__paywall h3 {
    font-size: 1.1875rem !important; /* 19/16 */
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__paywall .c-price-card {
    padding: 10px 0 !important;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__paywall .c-price-card h4 {
    font-size: 1rem;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__paywall .c-price-card .o-badge {
    display: none;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__paywall .c-price-card__price span {
    font-size: 1rem !important;
  }
}
@media screen and (max-width: 1080px) {
  .c-video-player__paywall {
    align-items: center;
  }
  .c-video-player__paywall h3 {
    margin-top: 0 !important;
    font-size: 2.25rem; /* 36/16 */
  }
  .c-video-player__paywall .c-video-player__paywall-options {
    display: flex;
    flex-wrap: wrap;
    max-width: 600px;
    padding: 0 20px;
    flex-direction: column-reverse;
  }
  .c-video-player__paywall .c-price-card {
    background: none;
    width: 100%;
    display: flex;
    align-items: center;
    border-bottom: 2px solid #3B4048;
    padding: 20px 0;
  }
  .c-video-player__paywall .c-price-card:first-child {
    border-bottom: 0;
  }
  .c-video-player__paywall .c-price-card .c-price-card__divider {
    display: flex;
    align-items: center;
  }
  .c-video-player__paywall .c-price-card h4, .c-video-player__paywall .c-price-card .c-price-card__period {
    margin-top: 0;
    color: #ffffff;
  }
  .c-video-player__paywall .c-price-card .c-price-card__price {
    margin-top: 0;
    margin-left: 10px;
    margin-right: 5px;
  }
  .c-video-player__paywall .c-price-card .c-price-card__price span {
    color: #ffffff;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 21px;
    margin: 0;
    letter-spacing: -0.5px;
    top: 0;
  }
  .c-video-player__paywall .c-price-card .c-price-card__price .c-price-card__price-change {
    margin-left: -4px;
  }
  .c-video-player__paywall .c-price-card .c-price-card__action {
    margin-top: 0;
    margin-left: auto;
  }
  .c-video-player__paywall .c-price-card .c-price-card__action a {
    padding: 0;
    background: none;
  }
  .c-video-player__paywall .c-price-card .c-price-card__action a .o-button__label {
    display: none;
  }
  .c-video-player__paywall .c-price-card .c-price-card__action a svg {
    fill: #333333;
  }
}
@media screen {
  .c-video-player--nav .c-video-player__paywall {
    align-items: center;
  }
  .c-video-player--nav .c-video-player__paywall h3 {
    margin-top: 0 !important;
    font-size: 2rem; /* 36/16 */
    text-align: center !important;
    line-height: 1.25;
  }
  .c-video-player--nav .c-video-player__paywall-wrapper {
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
  }
  .c-video-player--nav .c-video-player__paywall-copy {
    padding-right: 0;
  }
}
@media screen and (max-width: 1200px) {
  .c-video-player--nav .c-video-player__paywall-copy .l-font-17 {
    display: none;
  }
}
@media screen {
  .c-video-player--nav .c-video-player__paywall-artwork {
    display: none;
  }
}
@media screen {
  .c-video-player--nav .c-video-player__paywall-options {
    display: flex;
    flex-wrap: wrap;
    max-width: 600px;
    padding: 0 20px;
    flex-direction: column-reverse;
  }
}
@media screen {
  .c-video-player--nav .c-price-card {
    background: none;
    width: 100%;
    display: flex;
    align-items: center;
    border-bottom: 2px solid #3B4048;
    padding: 20px 0;
  }
  .c-video-player--nav .c-price-card:first-child {
    border-bottom: 0;
  }
  .c-video-player--nav .c-price-card .c-price-card__divider {
    display: flex;
    align-items: center;
  }
  .c-video-player--nav .c-price-card h4, .c-video-player--nav .c-price-card .c-price-card__period {
    margin-top: 0;
    color: #ffffff;
  }
  .c-video-player--nav .c-price-card .c-price-card__price {
    margin-top: 0;
    margin-left: 10px;
    margin-right: 5px;
  }
  .c-video-player--nav .c-price-card .c-price-card__price span {
    color: #ffffff;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 21px;
    margin: 0;
    letter-spacing: -0.5px;
    top: 0;
  }
  .c-video-player--nav .c-price-card .c-price-card__price .c-price-card__price-change {
    margin-left: -4px;
  }
  .c-video-player--nav .c-price-card .c-price-card__action {
    margin-top: 0;
    margin-left: auto;
  }
}
@media screen {
  .c-video-player__paywall--black-friday .c-video-player__paywall-artwork img {
    width: 420px;
  }
}
@media screen and (max-width: 1140px) {
  .c-video-player__paywall--black-friday .c-video-player__paywall-artwork img {
    width: 320px;
  }
}
@media screen and (max-width: 1080px) {
  .c-video-player__paywall--black-friday .c-price-card {
    display: block;
  }
  .c-video-player__paywall--black-friday .c-price-card .c-price-card__divider {
    display: none;
  }
  .c-video-player__paywall--black-friday .c-price-card .c-price-card__divider-alternate {
    display: block;
  }
  .c-video-player__paywall--black-friday .c-price-card .c-price-card__divider-alternate h4 {
    font-size: 1.5rem; /* 24/16 */
  }
  .c-video-player__paywall--black-friday .c-price-card .c-price-card__saving {
    color: #ffffff;
  }
  .c-video-player__paywall--black-friday .c-price-card .c-price-card__action {
    margin-top: 0;
    margin-left: auto;
  }
  .c-video-player__paywall--black-friday .c-price-card .c-price-card__action a {
    padding: 0 15px;
    background: #158443;
  }
  .c-video-player__paywall--black-friday .c-price-card .c-price-card__action a .o-button__label {
    display: inline-flex;
  }
  .c-video-player__paywall--black-friday .c-price-card .c-price-card__action a svg {
    fill: #158443;
  }
}
@media screen {
  .c-video-player--nav .c-video-player__paywall--black-friday .c-price-card {
    display: block;
  }
  .c-video-player--nav .c-video-player__paywall--black-friday .c-price-card .c-price-card__divider {
    display: none;
  }
  .c-video-player--nav .c-video-player__paywall--black-friday .c-price-card .c-price-card__divider-alternate {
    display: block;
  }
  .c-video-player--nav .c-video-player__paywall--black-friday .c-price-card .c-price-card__divider-alternate h4 {
    font-size: 1.5rem; /* 24/16 */
  }
  .c-video-player--nav .c-video-player__paywall--black-friday .c-price-card .c-price-card__saving {
    color: #ffffff;
  }
}
@media screen {
  .c-video-player__paywall--black-friday-2019 {
    background: #333333;
  }
}
@media screen and (max-width: 1080px) {
  .c-video-player__paywall--black-friday-2019 .c-video-player__paywall-wrapper .c-plan--neon {
    box-shadow: none;
    border: none;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__paywall--black-friday-2019 .c-video-player__paywall-wrapper .l-color-neon--red {
    color: #ffffff !important;
    -webkit-text-stroke-width: 0;
    text-shadow: none;
  }
}
@media screen {
  .c-video-player--nav .c-video-player__paywall--black-friday .c-plan--neon {
    border: none;
    box-shadow: none;
  }
}
@media screen {
  .c-video-player__paywall--black-friday--mod-spring {
    background-image: url(/assets/patterns/spring-fling-video-background@2x-3988623820d39ac467cd1d396f2edff3b7122cb4d00ef89fe45b4a3242213f8a.png) !important;
    background-color: #ffd7d6 !important;
    background-size: 100% !important;
    background: no-repeat;
  }
  .c-video-player__paywall--black-friday--mod-spring .c-video-player__paywall-wrapper h3, .c-video-player__paywall--black-friday--mod-spring .c-video-player__paywall-sign-in {
    color: #333333 !important;
  }
  .c-video-player__paywall--black-friday--mod-spring .c-price-card__price-main {
    font-size: 6.5rem !important;
    letter-spacing: -7px !important;
  }
}
@media screen and (max-width: 1080px) {
  .c-video-player__paywall--black-friday--mod-spring .c-price-card {
    background: none;
    box-shadow: none !important;
  }
  .c-video-player__paywall--black-friday--mod-spring .c-price-card h4, .c-video-player__paywall--black-friday--mod-spring .c-price-card .c-price-card__saving {
    color: #333333;
  }
  .c-video-player__paywall--black-friday--mod-spring .c-price-card .o-button--green {
    background: #158443 !important;
  }
  .c-video-player__paywall--black-friday--mod-spring .c-price-card .o-button--green svg {
    fill: #158443 !important;
  }
}
@media screen and (max-width: 1080px) and (max-width: 600px) {
  .c-video-player__paywall--black-friday--mod-spring .c-price-card .c-price-card__price {
    margin-left: 5px !important;
    margin-right: 0px !important;
  }
}
@media screen and (max-width: 1080px) and (max-width: 600px) {
  .c-video-player__paywall--black-friday--mod-spring .c-price-card .c-price-card__price .c-price-card__price-currency, .c-video-player__paywall--black-friday--mod-spring .c-price-card .c-price-card__price .c-price-card__price-main, .c-video-player__paywall--black-friday--mod-spring .c-price-card .c-price-card__price .c-price-card__period {
    color: #333333;
  }
}
@media screen and (max-width: 1080px) and (max-width: 600px) {
  .c-video-player__paywall--black-friday--mod-spring .c-price-card .c-price-card__price .c-price-card__price-main {
    letter-spacing: -0.5px !important;
  }
}
@media screen and (max-width: 1080px) and (max-width: 600px) {
  .c-video-player__paywall--black-friday--mod-spring .c-price-card .c-price-card__period {
    color: #333333;
    font-weight: 700;
  }
}
@media screen and (max-width: 1080px) and (max-width: 600px) {
  .c-video-player__paywall--black-friday--mod-spring .c-price-card .c-price-card__action a {
    background: none !important;
  }
  .c-video-player__paywall--black-friday--mod-spring .c-price-card .c-price-card__action a svg {
    fill: #333333 !important;
  }
}
@media screen {
  .c-video-player__paywall--free-weekend {
    background: #FDC774;
    background-image: url(/assets/patterns/free-weekend-video-background@2x-971948267a0d8bf3fb8fed1c09d4b218dcc2f9adb644d415910b57f97f0b5031.png);
    background-size: cover;
    display: block;
    text-align: center;
    align-items: center;
  }
  .c-video-player__paywall--free-weekend h3, .c-video-player__paywall--free-weekend p {
    color: #333333 !important;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__paywall--free-weekend h3 {
    font-size: 2rem;
  }
}
@media screen {
  .c-video-player__paywall--free-weekend h3 span {
    display: block;
    font-size: 2.1rem; /* 40/16 */
    margin-top: -6px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__paywall--free-weekend h3 span {
    font-size: 1.75rem;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__paywall--free-weekend h3 span {
    display: none;
  }
}
@media screen {
  .c-video-player__paywall--free-weekend h3 + p {
    font-family: "Bitter", serif;
    font-size: 1.1875rem; /* 19/16 */
    padding: 0 60px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__paywall--free-weekend h3 + p {
    font-size: 1.0625rem;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__paywall--free-weekend h3 + p {
    padding: 0 20px;
    font-size: 0.875rem;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__paywall--free-weekend .l-margin-21 {
    margin-top: 0;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__paywall--free-weekend .l-margin-30 {
    margin-top: 15px;
  }
}
@media screen {
  .c-video-player--nav .c-video-player__paywall--free-weekend h3 {
    font-size: 2rem;
  }
  .c-video-player--nav .c-video-player__paywall--free-weekend h3 span {
    font-size: 1.75rem;
  }
  .c-video-player--nav .c-video-player__paywall--free-weekend p {
    font-size: 1.0625rem; /* 17/16 */
  }
}
@media screen {
  .c-video-player__paywall--spring-ahead-2021 {
    background-color: #FDEA89 !important;
  }
  .c-video-player__paywall--spring-ahead-2021 h3, .c-video-player__paywall--spring-ahead-2021 p {
    color: #333333;
  }
}
@media screen {
  .c-video-information .c-written-tutorial__content h2, .c-video-information .c-written-tutorial__content h3, .c-video-information .c-written-tutorial__content h4 {
    margin-bottom: 24px;
  }
  .c-video-information .c-written-tutorial__content p, .c-video-information .c-written-tutorial__content ul, .c-video-information .c-written-tutorial__content ol {
    font-size: 1.0625rem; /* 17/16 */
    margin-bottom: 18px;
  }
}
@media screen and (max-width: 768px) {
  .c-video-information .c-written-tutorial__content p, .c-video-information .c-written-tutorial__content ul, .c-video-information .c-written-tutorial__content ol {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .c-video-information .c-written-tutorial__content ul, .c-video-information .c-written-tutorial__content ol {
    padding-left: 20px;
    list-style: initial;
  }
  .c-video-information .c-written-tutorial__content ul li, .c-video-information .c-written-tutorial__content ol li {
    margin-top: 0;
  }
}
@media screen {
  .c-video-information .c-written-tutorial__content ol {
    list-style: decimal;
  }
}
@media screen {
  .c-video-information .c-written-tutorial__content a {
    color: #158443;
    text-decoration: underline;
  }
}
@media screen {
  .c-subscription-promo-video .c-subscription-promo-video__wrapper {
    position: relative;
    border-radius: 1.25rem; /* 20/16 */
  }
  .c-subscription-promo-video .c-subscription-promo-video__wrapper img {
    border-radius: 1.25rem;
  }
  .c-subscription-promo-video .c-subscription-promo-video__placeholder {
    opacity: 0;
    border-radius: 1.25rem;
  }
  .c-subscription-promo-video .c-subscription-promo-video__fake {
    background: url(/assets/photos/promo-video-bg-96ecc3946d56abea1a36858b57e39ffc4dda22c0bc8782be1102ed89ec1dd572.jpg);
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1;
    cursor: pointer;
    border-radius: 1.25rem;
    padding-top: 56.25%;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
  }
  .c-subscription-promo-video .c-subscription-promo-video__fake:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(35, 41, 43, 0);
    z-index: -1;
    transition: all 0.05s linear;
  }
  .c-subscription-promo-video .c-subscription-promo-video__fake .o-button-video {
    position: absolute;
  }
}
@media screen {
  .c-video-player__preview {
    background: #1A1A1A;
    padding: 30px;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__preview {
    padding: 18px;
  }
}
@media screen {
  .c-video-player__preview > div {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
  }
}
@media screen {
  .c-video-player__preview .c-video-player__preview-artwork {
    max-width: 500px;
    max-height: 500px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -250px 0 0 -250px;
    opacity: 0.1;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__preview .c-video-player__preview-artwork {
    max-width: 300px;
    max-height: 300px;
    margin: -150px 0 0 -150px;
  }
}
@media screen and (max-width: 480px) {
  .c-video-player__preview .c-video-player__preview-artwork {
    max-width: 200px;
    max-height: 200px;
    margin: -100px 0 0 -100px;
  }
}
@media screen {
  .c-video-player__preview .c-video-player__preview-title {
    display: block;
    position: absolute;
    top: 30px;
    left: 30px;
    font-family: "Bitter", serif;
    font-size: 1.25rem; /* 20/16 */
    font-weight: 700;
    letter-spacing: -0.5px;
    color: #ffffff;
    width: 60%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__preview .c-video-player__preview-title {
    font-size: 0.9375rem; /* 15/16 */
    top: 18px;
    left: 18px;
  }
}
@media screen and (max-width: 480px) {
  .c-video-player__preview .c-video-player__preview-title {
    display: none;
  }
}
@media screen {
  .c-video-player__preview .c-video-player__preview-part {
    display: block;
    font-size: 0.75rem; /* 12/16 */
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 700;
    color: #ffffff;
    text-align: left;
    position: absolute;
    top: 60px;
    left: 30px;
    width: 60%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__preview .c-video-player__preview-part {
    font-size: 0.625rem; /* 10/16 */
    top: 40px;
    left: 18px;
  }
}
@media screen and (max-width: 480px) {
  .c-video-player__preview .c-video-player__preview-part {
    position: absolute;
    top: 18px;
  }
}
@media screen {
  .c-video-player__preview .c-video-player__preview-episode {
    display: block;
    font-family: "Bitter", serif;
    font-size: 3.125rem; /* 50/16 */
    line-height: 1.2;
    letter-spacing: -1px;
    color: #ffffff;
    text-align: center;
    max-width: 688px;
    width: 100%;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__preview .c-video-player__preview-episode {
    font-size: 2.625rem; /* 42/16 */
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__preview .c-video-player__preview-episode {
    font-size: 0.9375rem; /* 15/16 */
    letter-spacing: 0;
    position: absolute;
    top: 56px;
    left: 18px;
    text-align: left;
    width: 60%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
}
@media screen and (max-width: 480px) {
  .c-video-player__preview .c-video-player__preview-episode {
    top: 34px;
  }
}
@media screen {
  .c-video-player__preview .c-video-player__preview-domains {
    position: absolute;
    display: block;
    bottom: 30px;
    left: 30px;
    color: #A7ADB4;
    font-size: 0.75rem; /* 12/16 */
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 700;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__preview .c-video-player__preview-domains {
    font-size: 0.625rem; /* 10/16 */
    bottom: 18px;
    left: 18px;
  }
}
@media screen and (max-width: 480px) {
  .c-video-player__preview .c-video-player__preview-domains {
    display: none;
  }
}
@media screen and (max-width: 1200px) {
  .c-video-player--nav .c-video-player__preview .c-video-player__preview-artwork {
    max-width: 300px;
    max-height: 300px;
    margin: -150px 0 0 -150px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player--nav .c-video-player__preview .c-video-player__preview-artwork {
    max-width: 500px;
    max-height: 500px;
    margin: -250px 0 0 -250px;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player--nav .c-video-player__preview .c-video-player__preview-artwork {
    max-width: 300px;
    max-height: 300px;
    margin: -150px 0 0 -150px;
  }
}
@media screen and (max-width: 480px) {
  .c-video-player--nav .c-video-player__preview .c-video-player__preview-artwork {
    max-width: 200px;
    max-height: 200px;
    margin: -100px 0 0 -100px;
  }
}
@media screen and (max-width: 1200px) {
  .c-video-player--nav .c-video-player__preview .c-video-player__preview-episode {
    font-size: 2.625rem; /* 42/16 */
  }
}
@media screen and (max-width: 768px) {
  .c-video-player--nav .c-video-player__preview .c-video-player__preview-episode {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .c-video-player--cinema {
    padding: 0 0 90px !important;
  }
  .c-video-player--cinema .c-video-player__complete, .c-video-player--cinema .c-video-player__paywall {
    height: 56.25vw;
    max-height: calc(100vh - 169px);
    min-height: 480px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player--cinema .c-video-player__complete, .c-video-player--cinema .c-video-player__paywall {
    height: 100%;
    max-height: 100%;
    min-height: 100%;
  }
}
@media screen {
  .c-video-player--cinema .c-video-player__video {
    margin: 0 0 24px 0;
    border-radius: 0 !important;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player--cinema .c-video-player__video {
    width: 100%;
    margin-bottom: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player--cinema .c-video-player__video {
    width: 100%;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player--cinema .c-video-player__video {
    width: 100%;
  }
}
@media screen {
  .c-video-player--cinema .c-video-player__video-container {
    height: 56.25vw;
    max-height: calc(100vh - 169px);
    min-height: 480px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player--cinema .c-video-player__video-container {
    height: 100%;
    max-height: 100%;
    min-height: 100%;
  }
}
@media screen {
  .c-video-player--cinema .c-video-player__video-container .c-video-player__video {
    background: none;
  }
  .c-video-player--cinema .c-video-player__video-container .c-video-player__video iframe {
    height: 56.25vw;
    max-height: calc(100vh - 169px);
    min-height: 480px;
    background: linear-gradient(to right bottom, #333333, #363638, #38393d, #3a3c43, #3b4048);
  }
}
@media screen and (max-width: 992px) {
  .c-video-player--cinema .c-video-player__video-container .c-video-player__video iframe {
    height: 100%;
    max-height: 100%;
    min-height: 100%;
    background: none;
  }
}
@media screen {
  .c-video-player--cinema .c-video-player__video-container .c-video-player__video > div .c-video-player__preview {
    height: 56.25vw;
    max-height: calc(100vh - 169px);
    min-height: 480px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player--cinema .c-video-player__video-container .c-video-player__video > div .c-video-player__preview {
    height: 100%;
    max-height: 100%;
    min-height: 100%;
  }
}
@media screen {
  .c-video-player--cinema .c-video-player__lessons {
    margin-top: -70px;
    min-height: 350px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player--cinema .c-video-player__lessons {
    margin-top: 0;
  }
}
@media screen {
  .c-video-player--cinema.c-video-player--nav .c-video-player__wrapper {
    padding-left: 350px;
    position: relative;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player--cinema.c-video-player--nav .c-video-player__wrapper {
    padding: 0 30px;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player--cinema.c-video-player--nav .c-video-player__wrapper {
    padding: 0 20px;
  }
}
@media screen {
  .c-video-player--cinema .c-video-player__wrapper {
    padding: 24px 30px 0 100px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player--cinema .c-video-player__wrapper {
    padding: 0 30px;
    margin-top: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player--cinema .c-video-player__wrapper {
    padding: 0 20px;
  }
}
@media screen {
  .c-video-player--cinema .l-svg-cinema-mode, .c-video-player--cinema .o-tooltip--default {
    display: none !important;
  }
}
@media screen {
  .c-video-player--cinema .l-svg-video-mode, .c-video-player--cinema .o-tooltip--default {
    display: block !important;
  }
}
@media screen {
  .c-video-player__sub-controls {
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: space-between;
    min-height: 46px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__sub-controls {
    order: 5;
    margin-bottom: 36px;
  }
}
@media screen {
  .c-video-player__sub-controls h1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: 30px;
    font-size: 1.125rem; /* 18/16 */
    font-weight: 400;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__sub-controls h1 {
    display: none;
  }
}
@media screen {
  .c-video-player__sub-controls .l-bookmark-button-mobile .o-button--bookmark {
    padding-top: 20px;
  }
}
@media screen and (max-width: 600px) {
  .c-video-player__sub-controls .l-bookmark-button-mobile .o-button--bookmark {
    padding-top: 0;
  }
}
@media screen {
  .c-video-player__sub-controls .o-button--dark, .c-video-player__sub-controls .o-button--green {
    margin: 0 !important;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__sub-controls .l-button-cinema-mode {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player .c-video-player__tabs {
    order: 4;
    margin-bottom: 24px;
    overflow: hidden;
    overflow-x: scroll;
  }
}
@media screen {
  .c-video-player .c-video-player__tabs > ul li a {
    height: 54px;
    line-height: 54px;
  }
}
@media screen {
  .c-video-player .c-video-player__information p {
    color: #A7ADB4;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player .c-video-player__information p {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .c-video-player .c-written-tutorial__meta {
    color: #A7ADB4;
  }
}
@media screen {
  .c-video-player__notes p, .c-video-player__notes ul, .c-video-player__notes ol {
    color: #A7ADB4;
    margin-bottom: 18px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__notes p {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .c-video-player__notes ul {
    list-style-type: square;
    margin-left: 62px;
    padding-left: 24px;
  }
}
@media screen {
  .c-video-player__notes ol {
    padding-left: 24px;
  }
}
@media screen {
  .c-video-player__notes li {
    margin-top: 6px;
  }
}
@media screen and (max-width: 992px) {
  .c-video-player__notes li {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .c-video-player__notes a {
    color: #ffffff;
  }
}
@media screen {
  .c-video-player__notes code {
    font-family: "IBM Plex Mono", serif;
    font-size: 0.875rem; /* 14/16 */
    padding: 0 6px;
    border: 1px solid #73859F;
    background: #3B4048;
    border-radius: 5px;
    color: #ffffff;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__notes code {
    font-size: 0.8125rem; /* 13/16 */
  }
}
@media screen {
  .c-video-player__notes pre {
    font-family: "IBM Plex Mono", serif;
    font-size: 0.8125rem; /* 13/16 */
    background: linear-gradient(to right bottom, #333333, #363638, #38393d, #3a3c43, #3b4048);
    border: 1px solid #73859F;
    border-radius: 0.5625rem;
    padding: 15px;
    color: #ffffff;
    margin-top: 18px;
    margin-bottom: 24px;
    position: relative;
    padding-right: 80px;
    white-space: pre-wrap;
  }
  .c-video-player__notes pre code {
    background: none;
    border: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player__notes pre {
    font-size: 0.75rem; /* 12/16 */
  }
}
@media screen {
  .c-video-player__transcripts .video-timestamp {
    display: flex;
    align-items: center;
    position: absolute;
    top: -1px;
    left: -62px;
    height: 24px;
    padding: 0 8px;
    cursor: pointer;
  }
  .c-video-player__transcripts .video-timestamp:hover {
    background-color: #3B4048;
  }
  .c-video-player__transcripts ul li {
    position: relative;
    margin-right: 56px;
  }
  .c-video-player__transcripts ul li .video-timestamp {
    margin-left: -24px;
  }
  .c-video-player__transcripts ul li p {
    margin-left: 0px;
    margin-right: 56px;
  }
  .c-video-player__transcripts ul li p .video-timestamp {
    margin-left: -24px;
  }
  .c-video-player__transcripts ul, .c-video-player__transcripts p, .c-video-player__transcripts ol {
    margin-left: 62px;
  }
  .c-video-player__transcripts pre code {
    padding: 0;
    font-size: 0.8125rem;
  }
  .c-video-player__transcripts pre code span {
    font-size: 0.8125rem;
  }
}
@media screen {
  .c-video-player__transcripts p,
.c-video-player__transcripts ul {
    color: #CED5DE;
    margin-bottom: 18px;
    font-size: 15px;
  }
}
@media screen {
  .c-video-player__transcripts p,
.c-video-player__transcripts ul,
.c-video-player__transcripts ol {
    position: relative;
  }
}
@media screen {
  .c-video-player__transcripts p {
    padding-left: 3px;
    margin-right: 56px;
  }
}
@media screen {
  .c-video-player__transcripts h2 {
    display: none;
  }
}
@media screen {
  .c-video-player__transcripts pre {
    display: none;
  }
}
@media screen {
  .c-video-player__transcripts [data-tooltip]::before {
    background: #3B4048;
    font-size: 0.8125rem;
    text-align: center;
    padding-left: 13px;
    padding-right: 12px;
    top: -51px;
    left: 30px;
    z-index: 999;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-radius: 9px;
  }
}
@media screen {
  .c-video-player__transcripts [data-tooltip]::after {
    background: #3B4048;
    font-size: 0.8125rem;
    text-align: center;
    top: -20px;
    left: 30px;
    z-index: 1000;
    border-right: 2px solid rgba(255, 255, 255, 0.4);
    border-bottom: 2px solid rgba(255, 255, 255, 0.4);
  }
}
@media screen {
  .c-video-player__transcripts--banner {
    display: flex;
    flex-direction: column;
    align-items: flex-start !important;
    padding: 30px 24px !important;
    gap: 2px;
    background: #3B4048;
    border-radius: 9px;
  }
  .c-video-player__transcripts--banner .l-obfuscated-text {
    display: inline-block;
    width: 104px;
    text-align: center;
    background: #783838;
  }
  .c-video-player__transcripts--banner p, .c-video-player__transcripts--banner div, .c-video-player__transcripts--banner span {
    font-family: Bitter;
    font-size: 17px;
    font-weight: 400;
    line-height: 28px;
    letter-spacing: -0.5px;
    text-align: left;
  }
  .c-video-player__transcripts--banner p {
    margin: 0px 0px 18px 0px !important;
  }
}
@media screen {
  .c-video-player__notes--light pre {
    border: 1px solid #D6E0EF !important;
    background: #F2F6FA !important;
    color: #333333 !important;
    /* Comment */
    /* Red */
    /* Orange */
    /* Yellow */
    /* Green */
    /* Blue */
    /* Purple */
  }
  .c-video-player__notes--light pre code {
    color: #333333;
  }
  .c-video-player__notes--light pre .hljs-comment,
.c-video-player__notes--light pre .hljs-quote {
    color: #bbbbbb;
  }
  .c-video-player__notes--light pre .hljs-variable,
.c-video-player__notes--light pre .hljs-template-variable,
.c-video-player__notes--light pre .hljs-tag,
.c-video-player__notes--light pre .hljs-name,
.c-video-player__notes--light pre .hljs-selector-id,
.c-video-player__notes--light pre .hljs-selector-class,
.c-video-player__notes--light pre .hljs-regexp,
.c-video-player__notes--light pre .hljs-deletion {
    color: #d12f1b;
  }
  .c-video-player__notes--light pre .hljs-number,
.c-video-player__notes--light pre .hljs-built_in,
.c-video-player__notes--light pre .hljs-builtin-name,
.c-video-player__notes--light pre .hljs-literal,
.c-video-player__notes--light pre .hljs-type,
.c-video-player__notes--light pre .hljs-params,
.c-video-player__notes--light pre .hljs-meta,
.c-video-player__notes--light pre .hljs-link {
    color: #e68200;
  }
  .c-video-player__notes--light pre .hljs-attribute {
    color: #e29803;
  }
  .c-video-player__notes--light pre .hljs-string,
.c-video-player__notes--light pre .hljs-symbol,
.c-video-player__notes--light pre .hljs-bullet,
.c-video-player__notes--light pre .hljs-addition {
    color: #008400;
  }
  .c-video-player__notes--light pre .hljs-function,
.c-video-player__notes--light pre .hljs-title,
.c-video-player__notes--light pre .hljs-section {
    color: #272ad8;
  }
  .c-video-player__notes--light pre .hljs-keyword,
.c-video-player__notes--light pre .hljs-selector-tag {
    color: #703da9;
  }
  .c-video-player__notes--light .o-button-code {
    background-image: url(/assets/svg-icons/dark-359a27a4dca640e91c3d0d4c9b9457249d797e2ca85026f6d84a81d5e8657756.png);
    background-size: cover;
  }
  .c-video-player__notes--light .o-button-code:hover {
    background: #647388;
    background-image: url(/assets/svg-icons/dark-359a27a4dca640e91c3d0d4c9b9457249d797e2ca85026f6d84a81d5e8657756.png);
    background-size: cover;
  }
}
@media screen {
  .c-video-player .c-content-author img {
    border: 4px solid #434A53;
  }
  .c-video-player .c-content-author .c-content-author__title a {
    color: #ffffff;
  }
  .c-video-player .c-authors {
    background: #333333;
  }
  .c-video-player .c-authors .l-block-wrapper {
    padding: 0;
  }
  .c-video-player .c-authors .l-grid-3 {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .c-video-player .c-authors .l-grid-3 {
    grid-template-columns: 1fr;
  }
}
@media screen {
  .c-video-player .c-forum-comments {
    background: #333333;
  }
}
@media screen {
  article.c-written-tutorial {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
@media screen and (max-width: 600px) {
  article.c-written-tutorial {
    padding-top: 0;
    margin-top: 0;
    overflow: hidden;
  }
}
@media screen {
  article.c-written-tutorial header {
    display: grid;
    grid-template-columns: 1fr 210px;
    grid-column-gap: 25px;
  }
}
@media screen and (max-width: 1280px) {
  article.c-written-tutorial header {
    grid-column-gap: 30px;
  }
}
@media screen and (max-width: 1080px) {
  article.c-written-tutorial header {
    grid-template-columns: 1fr 250px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial header {
    grid-template-columns: 1fr 200px;
  }
}
@media screen and (max-width: 600px) {
  article.c-written-tutorial header {
    display: grid;
    grid-template-columns: 1fr;
    padding: 0;
    animation: none;
  }
}
@media screen {
  article.c-written-tutorial header h1 {
    line-height: 1;
    color: #333333;
    word-break: break-word;
    font-size: 2.625rem; /* 42/16 */
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial header h1 {
    font-size: 2.25rem; /* 36/16 */
  }
}
@media screen and (max-width: 600px) {
  article.c-written-tutorial header h1 {
    font-size: 1.875rem; /* 36/16 */
  }
}
@media screen {
  article.c-written-tutorial header .c-written-tutorial__pull-quote {
    font-family: "IBM Plex Serif", serif;
    font-size: 1.0625rem; /* 18/16 */
  }
}
@media screen {
  article.c-written-tutorial header .o-button--green {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}
@media screen {
  article.c-written-tutorial header .c-written-tutorial__breadcrumbs a {
    color: #6E7687;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial header .c-written-tutorial__breadcrumbs a {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen and (max-width: 600px) {
  article.c-written-tutorial header .c-written-tutorial__introduction {
    order: 2;
    margin-left: -20px;
    padding: 20px 20px 0 20px;
    background: #ffffff;
    z-index: 2;
  }
}
@media screen {
  article.c-written-tutorial header .c-written-tutorial__introduction .o-button--bookmark .o-button__svg {
    margin-top: -10px;
  }
}
@media screen {
  article.c-written-tutorial header .c-written-tutorial__artwork {
    width: 100%;
  }
}
@media screen and (max-width: 600px) {
  article.c-written-tutorial header .c-written-tutorial__artwork {
    order: 1;
    margin-bottom: -60px;
    margin-left: -20px;
    width: calc(100% + 40px);
    animation: none;
    z-index: 1;
  }
}
@media screen {
  article.c-written-tutorial header .c-written-tutorial__artwork img {
    width: 282px;
    height: 282px;
    background: #73859F;
    border-radius: 21px;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
  }
}
@media screen and (max-width: 1080px) {
  article.c-written-tutorial header .c-written-tutorial__artwork img {
    width: 250px;
    height: 250px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial header .c-written-tutorial__artwork img {
    width: 200px;
    height: 200px;
  }
}
@media screen and (max-width: 600px) {
  article.c-written-tutorial header .c-written-tutorial__artwork img {
    display: flex;
    margin: 0 auto;
    width: 100%;
    height: auto;
    border-radius: 0;
    box-shadow: none;
  }
}
@media screen {
  article.c-written-tutorial header .c-written-tutorial__artwork figcaption {
    font-size: 0.9375rem; /* 15/16 */
    color: #6E7687;
  }
}
@media screen {
  article.c-written-tutorial header .c-written-tutorial__meta {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen and (max-width: 992px) {
  article.c-written-tutorial .c-written-tutorial__content {
    overflow: hidden;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content {
    padding: 0;
    margin-top: 24px;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-draper-obfuscate-nudge {
    padding-top: 18px !important;
    margin-top: 30px !important;
    margin-bottom: 30px !important;
  }
  article.c-written-tutorial .c-written-tutorial__content .c-draper-obfuscate-nudge p {
    font-family: "Bitter", serif !important;
  }
  article.c-written-tutorial .c-written-tutorial__content .c-draper-obfuscate-nudge .l-obfuscated-text {
    display: inline-block;
    width: 104px;
    text-align: center;
    background: #F4C3C3;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-written-tutorial__content-footer {
    display: flex;
  }
}
@media screen and (max-width: 600px) {
  article.c-written-tutorial .c-written-tutorial__content .c-written-tutorial__content-footer {
    display: block;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-written-tutorial__content-footer .c-written-tutorial__content-tags {
    width: 100%;
    padding-right: 45px;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-written-tutorial__content-footer .c-written-tutorial__content-share {
    display: flex;
    align-items: flex-start;
    margin-left: auto;
  }
}
@media screen and (max-width: 600px) {
  article.c-written-tutorial .c-written-tutorial__content .c-written-tutorial__content-footer .c-written-tutorial__content-share {
    margin-top: 30px;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-written-tutorial__content-footer .c-written-tutorial__content-share button {
    margin-left: 6px;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-written-tutorial__content-footer .c-written-tutorial__content-share .o-button--bookmark {
    height: 28px;
    line-height: 28px;
    padding: 0;
  }
}
@media screen and (max-width: 600px) {
  article.c-written-tutorial .c-written-tutorial__content .c-written-tutorial__content-footer .c-written-tutorial__content-share .o-button--bookmark {
    margin-left: auto;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-written-tutorial__content-footer .c-written-tutorial__content-share .o-button--bookmark svg {
    margin-top: -10px;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content h1, article.c-written-tutorial .c-written-tutorial__content h2 {
    font-size: 1.6875rem; /* 27/16 */
    margin-top: 27px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content h1, article.c-written-tutorial .c-written-tutorial__content h2 {
    font-size: 1.5rem; /* 24/16 */
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content h3 {
    font-size: 1.3125rem; /* 21/16 */
    margin-top: 24px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content h3 {
    font-size: 1.3125rem; /* 21/16 */
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content h4 {
    font-size: 1.125rem; /* 18/16 */
    margin-top: 18px;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content h1, article.c-written-tutorial .c-written-tutorial__content h2, article.c-written-tutorial .c-written-tutorial__content h3, article.c-written-tutorial .c-written-tutorial__content h4, article.c-written-tutorial .c-written-tutorial__content h5 {
    margin-top: 36px;
    color: #333333;
  }
  article.c-written-tutorial .c-written-tutorial__content h1 a, article.c-written-tutorial .c-written-tutorial__content h2 a, article.c-written-tutorial .c-written-tutorial__content h3 a, article.c-written-tutorial .c-written-tutorial__content h4 a, article.c-written-tutorial .c-written-tutorial__content h5 a {
    color: #158443;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content h2 + p, article.c-written-tutorial .c-written-tutorial__content h3 + p, article.c-written-tutorial .c-written-tutorial__content h4 + p {
    margin-top: 12px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content h2 + p, article.c-written-tutorial .c-written-tutorial__content h3 + p, article.c-written-tutorial .c-written-tutorial__content h4 + p {
    margin-top: 12px;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content h1 + span + p {
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content h1 + span + p {
    margin-top: 10px !important;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content h2 + span + p {
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content h2 + span + p {
    margin-top: 10px !important;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content h3 + span + p {
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content h3 + span + p {
    margin-top: 10px !important;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content h4 + span + p {
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content h4 + span + p {
    margin-top: 10px !important;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content h4 + span + p {
    margin-top: 10px !important;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content h4 + span + p {
    margin-top: 10px !important;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content p, article.c-written-tutorial .c-written-tutorial__content ul, article.c-written-tutorial .c-written-tutorial__content ol {
    font-family: "IBM Plex Serif", serif;
    font-size: 1.0625rem; /* 18/16 */
    line-height: 1.58;
    margin-top: 18px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content p, article.c-written-tutorial .c-written-tutorial__content ul, article.c-written-tutorial .c-written-tutorial__content ol {
    font-size: 1rem;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content p a, article.c-written-tutorial .c-written-tutorial__content ul a, article.c-written-tutorial .c-written-tutorial__content ol a {
    color: #158443;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content p em, article.c-written-tutorial .c-written-tutorial__content p strong, article.c-written-tutorial .c-written-tutorial__content ul em, article.c-written-tutorial .c-written-tutorial__content ul strong, article.c-written-tutorial .c-written-tutorial__content ol em, article.c-written-tutorial .c-written-tutorial__content ol strong {
    font-weight: 700;
    font-style: normal;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content p i, article.c-written-tutorial .c-written-tutorial__content ul i, article.c-written-tutorial .c-written-tutorial__content ol i {
    font-style: italic;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content ul, article.c-written-tutorial .c-written-tutorial__content ol {
    padding-left: 24px;
  }
  article.c-written-tutorial .c-written-tutorial__content ul li, article.c-written-tutorial .c-written-tutorial__content ol li {
    margin-top: 0.5rem;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content ul li {
    list-style: square;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content div.note {
    font-family: "IBM Plex Serif", serif;
    background: #F2F6FA;
    font-size: 1rem; /* 17/16 */
    padding: 20px 24px;
    border-radius: 0.5625rem;
    margin-top: 18px;
  }
  article.c-written-tutorial .c-written-tutorial__content div.note pre {
    margin-left: 0px;
    width: 100%;
  }
  article.c-written-tutorial .c-written-tutorial__content div.note pre .hljs {
    color: #ffffff;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content div.note {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content div.note em {
    font-weight: 700;
    font-style: normal;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content div.note p {
    font-size: 1.0625rem;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content div.note p {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content div.note p:first-child {
    margin-top: 0;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content div.note a {
    color: #158443;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content pre, article.c-written-tutorial .c-written-tutorial__content code {
    word-wrap: break-word;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content pre {
    font-family: "Menlo", monospace !important;
    font-size: 0.8125rem; /* 13/16 */
    background: linear-gradient(to right bottom, #333333, #363638, #38393d, #3a3c43, #3b4048);
    border-radius: 0.5625rem;
    padding: 15px;
    color: #ffffff;
    margin-top: 18px;
    position: relative;
    padding-right: 80px;
    margin-left: -16px;
    width: calc(100% + 32px);
    white-space: pre-wrap;
  }
}
@media screen and (max-width: 992px) {
  article.c-written-tutorial .c-written-tutorial__content pre {
    width: 100%;
    margin-left: 0;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content pre {
    font-size: 0.75rem; /* 12/16 */
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content pre .hljs {
    color: #ffffff;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-spoiler pre {
    margin-left: 0px;
    width: 100%;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content code {
    font-family: "Menlo", monospace;
    font-size: 0.875rem; /* 14/16 */
    padding: 0 6px;
    border: 1px solid #D6E0EF;
    background: #F2F6FA;
    border-radius: 5px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content code {
    font-size: 0.8125rem; /* 13/16 */
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content img, article.c-written-tutorial .c-written-tutorial__content .wp-video {
    margin: 0 auto;
    display: flex;
    max-width: 100%;
    height: auto;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .bordered {
    border: 0.75rem solid #DFE7F0;
    border-radius: 0.5625rem;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .wp-caption {
    margin: 36px auto;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .wp-caption-text {
    font-size: 0.9375rem; /* 15/16 */
    color: #6E7687;
    margin-top: 9px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content .o-button--files {
    display: none;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-written-tutorial__content-iframe {
    position: relative;
    padding-bottom: 56.25%;
    margin: 36px 0;
  }
  article.c-written-tutorial .c-written-tutorial__content .c-written-tutorial__content-iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-spoiler {
    text-align: center;
  }
  article.c-written-tutorial .c-written-tutorial__content .c-spoiler.c-spoiler--revealed .c-spoiler__answer {
    display: block;
  }
  article.c-written-tutorial .c-written-tutorial__content .c-spoiler.c-spoiler--revealed .o-button {
    display: none;
  }
  article.c-written-tutorial .c-written-tutorial__content .c-spoiler .c-spoiler__answer {
    text-align: left;
    font-family: "IBM Plex Serif", serif;
    background: #F2F6FA;
    font-size: 1.0625rem; /* 17/16 */
    padding: 20px 24px;
    border-radius: 0.5625rem;
    margin-top: 24px;
    display: none;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content .c-spoiler .c-spoiler__answer {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-spoiler .c-spoiler__answer em {
    font-weight: 700;
    font-style: normal;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-spoiler .c-spoiler__answer p {
    font-size: 1.0625rem;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial .c-written-tutorial__content .c-spoiler .c-spoiler__answer p {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-spoiler .c-spoiler__answer p:first-child {
    margin-top: 0;
  }
}
@media screen {
  article.c-written-tutorial .c-written-tutorial__content .c-spoiler .c-spoiler__answer a {
    color: #158443;
  }
}
@media screen {
  article.c-written-tutorial.c-written-tutorial--event {
    padding: 0;
    height: 100%;
    min-height: 100vh;
  }
  article.c-written-tutorial.c-written-tutorial--event header {
    display: block;
    padding: 60px 0 0 0;
    animation: none;
    background: #E2E6F7;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial.c-written-tutorial--event header .c-written-tutorial__introduction {
    background: none;
    margin-left: 0;
    padding: 0;
  }
}
@media screen {
  article.c-written-tutorial.c-written-tutorial--event header h1 {
    font-size: 3rem;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial.c-written-tutorial--event header h1 {
    font-size: 2.5rem;
  }
}
@media screen {
  article.c-written-tutorial.c-written-tutorial--event header h1 > span {
    display: none;
    font-size: 3rem;
  }
}
@media screen {
  article.c-written-tutorial.c-written-tutorial--event header .c-written-tutorial__pull-quote {
    font-family: "Bitter", serif;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial.c-written-tutorial--event header p {
    font-size: 15px;
  }
}
@media screen {
  article.c-written-tutorial.c-written-tutorial--event header.c-written-tutorial--event-header {
    background: none;
    padding: 0 0 0 0;
    position: relative;
    overflow: hidden;
  }
  article.c-written-tutorial.c-written-tutorial--event header.c-written-tutorial--event-header .c-written-tutorial__introduction {
    position: relative;
  }
  article.c-written-tutorial.c-written-tutorial--event header.c-written-tutorial--event-header .c-written-tutorial__introduction h1 {
    padding-top: 45px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial.c-written-tutorial--event header.c-written-tutorial--event-header .c-written-tutorial__introduction h1 {
    font-size: 2.0625rem; /* 33/16 */
  }
}
@media screen {
  article.c-written-tutorial.c-written-tutorial--event header.c-written-tutorial--event-header .c-written-tutorial__introduction p {
    font-size: 1.1875rem; /* 19/16 */
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial.c-written-tutorial--event header.c-written-tutorial--event-header .c-written-tutorial__introduction p {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  article.c-written-tutorial.c-written-tutorial--event .c-written-tutorial--event-artwork img {
    width: 100%;
    border-radius: 0.5625rem;
  }
}
@media screen {
  article.c-written-tutorial.c-written-tutorial--event .c-written-tutorial__content {
    padding-bottom: 120px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial.c-written-tutorial--event .c-written-tutorial__content {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen {
  article.c-written-tutorial.c-written-tutorial--event .c-written-tutorial__content > h2 {
    font-size: 2.25rem;
    line-height: 1.125;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial.c-written-tutorial--event .c-written-tutorial__content > h2 {
    font-size: 1.5rem;
  }
}
@media screen {
  article.c-written-tutorial.c-written-tutorial--event .c-written-tutorial__content > h2 a {
    color: #333333;
  }
}
@media screen {
  article.c-written-tutorial.c-written-tutorial--event .c-written-tutorial__content > span {
    display: block;
    font-size: 0.75rem; /* 12/16 */
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 15px;
  }
}
@media screen {
  article.c-written-tutorial.c-written-tutorial--event .c-written-tutorial__content img.bordered {
    border-width: 9px;
  }
}
@media screen and (max-width: 768px) {
  article.c-written-tutorial.c-written-tutorial--event .c-written-tutorial__content img.bordered {
    border-width: 6px;
  }
}
@media screen {
  .l-written-tutorial--light pre {
    border: 1px solid #D6E0EF !important;
    background: #F2F6FA !important;
    color: #333333 !important;
  }
  .l-written-tutorial--light pre .hljs {
    color: #333333 !important;
  }
  .l-written-tutorial--light div.note pre .hljs {
    color: #333333 !important;
  }
  .l-written-tutorial--light .o-button-code {
    background-image: url(/assets/svg-icons/dark-359a27a4dca640e91c3d0d4c9b9457249d797e2ca85026f6d84a81d5e8657756.png);
    background-size: cover;
  }
  .l-written-tutorial--light .o-button-code:hover {
    background: #647388;
    background-image: url(/assets/svg-icons/dark-359a27a4dca640e91c3d0d4c9b9457249d797e2ca85026f6d84a81d5e8657756.png);
    background-size: cover;
  }
}
@media screen {
  .c-admin-edit-banner {
    background: #333333;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: fixed;
    bottom: 0;
    width: 100%;
    padding: 12px 15px;
    z-index: 99999;
  }
}
@media screen and (max-width: 768px) {
  .c-admin-edit-banner {
    justify-content: center;
  }
}
@media screen {
  .c-admin-edit-banner a, .c-admin-edit-banner span {
    font-size: 0.9375rem; /* 15/16 */
    font-weight: 600;
    color: #ffffff;
    text-decoration: none;
  }
}
@media screen {
  .c-admin-edit-banner a {
    cursor: pointer;
    margin-right: 18px;
  }
}
@media screen and (max-width: 992px) {
  .c-admin-edit-banner .c-admin-edit-banner__links {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .c-admin-edit-banner .c-admin-edit-banner__profile {
    display: none;
  }
}
@media screen {
  .c-admin-edit-banner .c-admin-edit-banner__profile .c-admin-edit-banner__profile-username {
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    white-space: nowrap;
  }
}
@media screen {
  .c-admin-edit-banner .o-text-button--warning:hover .o-tooltip {
    opacity: 1;
    visibility: visible;
  }
  .c-admin-edit-banner .o-text-button--warning li {
    display: block;
    max-width: 360px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-left: 12px;
    position: relative;
  }
  .c-admin-edit-banner .o-text-button--warning li:before {
    content: "";
    width: 3.5px;
    height: 13px;
    background-image: url(/assets/svg-icons/warning-d5e52e154c388e379e8676cde7ce41fa41669469ccafa9c3018f95f207f54603.png);
    background-size: cover;
    position: absolute;
    left: 0;
    top: 9px;
  }
}
@media screen and (max-width: 768px) {
  .c-admin-edit-banner .o-text-button--warning li {
    max-width: 200px;
  }
}
@media screen {
  .c-admin-edit-banner .o-text-button--warning .o-tooltip {
    top: auto;
    bottom: 40px;
    line-height: 30px;
    height: auto;
  }
  .c-admin-edit-banner .o-text-button--warning .o-tooltip:after {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-admin-edit-banner .o-text-button--warning .o-tooltip {
    left: auto !important;
    right: 0;
    transform: none;
  }
}
@media screen and (max-width: 768px) {
  .c-admin-edit-banner .o-text-button--warning .o-tooltip {
    left: 50% !important;
    right: auto;
    transform: translateX(-50%);
  }
}
@media screen {
  .c-sticky-options-banner {
    position: fixed;
    top: 10px;
    right: 30px;
    z-index: 99999;
    width: 27px;
  }
}
@media screen and (max-width: 1200px) {
  .c-sticky-options-banner {
    display: none;
  }
}
@media screen {
  .c-sticky-options-banner button {
    width: 27px;
    padding: 0;
    margin-top: 15px;
  }
  .c-sticky-options-banner button i {
    width: 27px;
  }
}
@media screen {
  .c-book-chapter {
    padding-top: 30px !important;
  }
}
@media screen and (max-width: 992px) {
  .c-book-chapter {
    padding-left: 24px;
    padding-right: 24px;
  }
}
@media screen and (max-width: 768px) {
  .c-book-chapter {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}
@media screen {
  .c-book-chapter header {
    display: block !important;
    animation: none !important;
  }
  .c-book-chapter header h1 {
    margin-top: 20px;
  }
}
@media screen and (max-width: 600px) {
  .c-book-chapter header .c-written-tutorial__introduction {
    margin-left: 0 !important;
    padding: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .c-book-chapter header .c-written-tutorial__introduction .l-font-17 {
    font-size: 1rem;
  }
}
@media screen and (max-width: 768px) {
  .c-book-chapter header .c-written-tutorial__introduction .l-font-42 {
    font-size: 2rem;
  }
}
@media screen {
  .c-book-chapter .c-written-tutorial__content {
    animation: none !important;
  }
  .c-book-chapter .c-written-tutorial__content p, .c-book-chapter .c-written-tutorial__content ul, .c-book-chapter .c-written-tutorial__content ol {
    /* The base style sets em as bold, due to a legacy quirk in the style
     * used for articles in Wordpress. Books support <em> as italic and
     * <strong> as bold as is the convention for CommonMark.
     */
  }
  .c-book-chapter .c-written-tutorial__content p strong, .c-book-chapter .c-written-tutorial__content ul strong, .c-book-chapter .c-written-tutorial__content ol strong {
    font-weight: 700 !important;
    font-style: normal !important;
  }
  .c-book-chapter .c-written-tutorial__content p strong em, .c-book-chapter .c-written-tutorial__content ul strong em, .c-book-chapter .c-written-tutorial__content ol strong em {
    font-style: italic !important;
    font-weight: 700 !important;
  }
  .c-book-chapter .c-written-tutorial__content p em, .c-book-chapter .c-written-tutorial__content ul em, .c-book-chapter .c-written-tutorial__content ol em {
    font-style: italic !important;
    font-weight: 400 !important;
  }
  .c-book-chapter .c-written-tutorial__content p em strong, .c-book-chapter .c-written-tutorial__content ul em strong, .c-book-chapter .c-written-tutorial__content ol em strong {
    font-style: italic !important;
    font-weight: 700 !important;
  }
}
@media screen {
  .c-book-chapter h1 code, .c-book-chapter h2 code, .c-book-chapter h3 code, .c-book-chapter h4 code, .c-book-chapter h5 code {
    font-size: inherit !important;
    font-family: inherit !important;
    background: none !important;
    border: 0 !important;
    padding: 0 !important;
  }
  .c-book-chapter h1 em, .c-book-chapter h2 em, .c-book-chapter h3 em, .c-book-chapter h4 em, .c-book-chapter h5 em {
    font-style: normal;
  }
}
@media screen {
  .c-book-chapter pre code {
    background: none !important;
    border: none !important;
    padding: 0 !important;
  }
}
@media screen {
  .c-book-chapter blockquote {
    font-family: inherit;
    background: #F2F6FA;
    font-size: 1em; /* 17/16 */
    padding: 20px 24px;
    border-radius: 0.5625rem;
    margin-top: 18px;
  }
  .c-book-chapter blockquote pre {
    margin-left: 0px;
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .c-book-chapter blockquote {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .c-book-chapter blockquote strong {
    font-weight: 700;
    font-style: normal;
  }
}
@media screen {
  .c-book-chapter blockquote em {
    font-style: italic;
  }
}
@media screen {
  .c-book-chapter blockquote p {
    font-size: 1.0625rem;
  }
}
@media screen and (max-width: 768px) {
  .c-book-chapter blockquote p {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .c-book-chapter blockquote p:first-child {
    margin-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-book-chapter blockquote p:first-child {
    margin-top: 0 !important;
  }
}
@media screen {
  .c-book-chapter blockquote a {
    color: #158443;
  }
}
@media screen {
  .c-book-chapter figure {
    max-width: 720px;
    margin: 0 auto;
  }
  .c-book-chapter figure img {
    max-height: 720px;
  }
  .c-book-chapter figure figcaption {
    margin-top: 12px;
    font-size: 0.9375em; /* 15/16 */
    color: #6E7687;
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .c-book-chapter figure figcaption {
    font-size: 0.8125em; /* 13/16 */
  }
}
@media screen and (max-width: 600px) {
  .c-book-chapter figure figcaption {
    text-align: left;
  }
}
@media screen {
  .c-book-chapter .l-image-bordered img {
    border: 9px solid #DFE7F0;
    border-radius: 0.5625rem;
  }
}
@media screen {
  .c-book-chapter__links {
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 72px;
  }
  .c-book-chapter__links a {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-family: "Bitter", serif;
    font-weight: 700;
    font-size: 1.125rem; /* 18/16 */
    height: 72px;
    line-height: 72px;
    text-decoration: none;
    text-align: center;
    color: #333333;
    border-top: 1px solid #DFE7F0;
  }
  .c-book-chapter__links a:hover {
    background: #F5F8FB;
  }
  .c-book-chapter__links a span {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .c-book-chapter__links a svg {
    width: 17px;
    height: 15px;
    fill: #A7ADB4;
  }
  .c-book-chapter__links .c-book-chapter__links--left:hover svg {
    transform: translateX(-5px);
  }
  .c-book-chapter__links .c-book-chapter__links--left span, .c-book-chapter__links .c-book-chapter__links--left svg {
    margin-right: auto;
    margin-right: auto;
  }
  .c-book-chapter__links .c-book-chapter__links--left span {
    margin-left: -41px;
  }
  .c-book-chapter__links .c-book-chapter__links--left svg {
    transition: all 0.25s;
    margin-left: 24px;
  }
  .c-book-chapter__links .c-book-chapter__links--right:hover svg {
    transform: translateX(5px);
  }
  .c-book-chapter__links .c-book-chapter__links--right span, .c-book-chapter__links .c-book-chapter__links--right svg {
    margin-left: auto;
    margin-left: auto;
  }
  .c-book-chapter__links .c-book-chapter__links--right span {
    margin-right: -41px;
  }
  .c-book-chapter__links .c-book-chapter__links--right svg {
    transition: all 0.25s;
    margin-right: 24px;
  }
}
@media screen {
  .c-book-chapter__dedications {
    max-width: 568px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 18px;
  }
  .c-book-chapter__dedications p {
    text-align: center;
  }
  .c-book-chapter__dedications p:nth-child(even) {
    margin-top: 12px !important;
    margin-bottom: 48px;
  }
}
@media screen {
  .c-book-chapter__team {
    padding-top: 24px;
  }
  .c-book-chapter__team h2 {
    margin-bottom: 24px;
  }
}
@media screen and (max-width: 768px) {
  .c-book-chapter__team {
    padding-top: 15px;
  }
}
@media screen {
  .c-book-chapter__team > div {
    display: flex;
    margin-bottom: 45px;
  }
}
@media screen and (max-width: 768px) {
  .c-book-chapter__team > div {
    margin-bottom: 24px;
  }
}
@media screen {
  .c-book-chapter__team figure {
    width: 180px;
    min-width: 180px;
    margin-right: 24px;
  }
}
@media screen and (max-width: 768px) {
  .c-book-chapter__team figure {
    width: 60px;
    min-width: 60px;
    margin-right: 15px;
  }
}
@media screen {
  .c-book-chapter__team figure img {
    width: 100%;
    height: 100%;
  }
}
@media screen {
  .c-book-chapter__team p {
    margin: 0 !important;
  }
  .c-book-chapter__team p strong:first-child {
    font-size: 1.6875rem; /* 27/16 */
    font-family: "Bitter", serif;
    font-weight: 700;
    line-height: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-book-chapter__team p strong:first-child {
    font-size: 1.1875rem; /* 19/16 */
  }
}
@media screen and (max-width: 768px) {
  .c-book-chapter__team .l-image-bordered img {
    border-width: 4px !important;
  }
}
@media screen {
  .c-global-search {
    width: 100%;
    background: #333333;
  }
  .c-global-search .c-global-search__recommendations {
    max-width: 960px;
    margin: 36px auto 0;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .c-global-search .c-global-search__recommendations::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media screen and (max-width: 992px) {
  .c-global-search .c-global-search__recommendations {
    padding: 0 30px;
  }
}
@media screen {
  .c-global-search .c-global-search__recommendations .c-search__loading {
    padding-top: 30px;
    padding-bottom: 0;
  }
}
@media screen {
  .c-global-search .c-global-search__recommendations h3 {
    font-size: 1.3125rem; /* 21/16 */
    color: #ffffff;
    margin-bottom: 21px;
  }
}
@media screen {
  .c-global-search .c-global-search__recommendations .c-tutorial--dark .c-tutorial-item a {
    background: #3B4048 !important;
    border-radius: 0.5625rem !important;
  }
}
@media screen {
  .c-global-search .c-global-search__input {
    height: 160px;
    display: flex;
    align-items: center;
    border-top: 2px solid #3B4048;
    border-bottom: 2px solid #3B4048;
    position: relative;
  }
}
@media screen and (max-width: 768px) {
  .c-global-search .c-global-search__input {
    height: 120px;
  }
}
@media screen {
  .c-global-search .c-global-search__input > div {
    height: 100%;
  }
}
@media screen {
  .c-global-search .c-global-search__input .c-global-search__close {
    position: absolute;
    top: 20px;
    right: 20px;
    background: none;
    overflow: hidden;
  }
}
@media screen {
  .c-global-search .c-global-search__input .c-global-search__icon {
    position: absolute;
    top: 50%;
    margin-top: -24px;
  }
}
@media screen and (max-width: 768px) {
  .c-global-search .c-global-search__input .c-global-search__icon {
    margin-top: -15px;
  }
}
@media screen {
  .c-global-search .c-global-search__input .c-global-search__icon svg {
    width: 48px;
    height: 48px;
    fill: #959DA5;
  }
}
@media screen and (max-width: 768px) {
  .c-global-search .c-global-search__input .c-global-search__icon svg {
    width: 30px;
    height: 30px;
  }
}
@media screen {
  .c-global-search .c-global-search__input input {
    width: 100%;
    height: 100%;
    background: none;
    border: none;
    font-size: 2.625rem;
    color: #ffffff;
    padding-left: 78px;
  }
  .c-global-search .c-global-search__input input:focus {
    outline: none;
  }
  .c-global-search .c-global-search__input input::placeholder {
    color: #959DA5;
  }
}
@media screen and (max-width: 768px) {
  .c-global-search .c-global-search__input input {
    font-size: 1.5rem;
    padding-left: 48px;
  }
}
@media screen and (max-width: 768px) {
  .c-global-search .c-global-search__input input {
    font-size: 1.25rem;
  }
}
@media screen {
  .c-global-search .c-global-search__hint {
    max-width: 960px;
    margin: 36px auto 0;
    padding: 0 20px;
  }
  .c-global-search .c-global-search__hint p, .c-global-search .c-global-search__hint a {
    color: #ffffff;
  }
  .c-global-search .c-global-search__hint p {
    display: flex;
    justify-content: center;
    text-align: center;
    font-weight: normal !important;
  }
  .c-global-search .c-global-search__hint p i {
    margin-right: 9px;
  }
  .c-global-search .c-global-search__hint p a {
    text-decoration: underline !important;
  }
}
@media screen {
  .c-global-search--overlay {
    position: fixed;
    z-index: 99999;
    top: 0;
    left: 0;
    height: 100%;
    min-height: 100%;
    padding-top: 72px;
    padding-bottom: 72px;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .c-global-search--overlay::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media screen and (max-width: 600px) {
  .c-global-search--overlay {
    padding-top: 0;
  }
}
@media screen {
  .c-filter-platform {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    background: #333333;
    height: 120px;
    line-height: 120px;
    align-items: center;
    min-width: 1200px;
  }
}
@media screen and (max-width: 992px) {
  .c-filter-platform {
    height: 80px;
    line-height: 80px;
    display: flex;
    min-width: auto;
    white-space: nowrap;
  }
}
@media screen {
  .c-filter-platform li {
    cursor: pointer;
    text-align: center;
    font-family: "Bitter", serif;
    font-size: 1.125rem; /* 18/16 */
    font-weight: 700;
    color: #ffffff;
    letter-spacing: -0.5px;
    border-right: 2px solid #3B4048;
    transition: background 0.3s ease-out;
  }
}
@media screen and (max-width: 992px) {
  .c-filter-platform li {
    border-right: 0;
    font-size: 1.0625rem; /* 17/16 */
  }
}
@media screen and (max-width: 992px) {
  .c-filter-platform li:first-child {
    margin-left: 15px;
  }
}
@media screen {
  .c-filter-platform li:last-child {
    border-right: none;
  }
}
@media screen {
  .c-filter-platform li:hover {
    background: #3B4048;
  }
}
@media screen and (max-width: 992px) {
  .c-filter-platform li:hover {
    background: none;
  }
}
@media screen and (max-width: 992px) {
  .c-filter-platform li span {
    padding: 10px 20px;
    border-radius: 100px;
  }
}
@media screen {
  .c-filter-platform li.c-filter-platform__option--active {
    background: #3B4048;
    position: relative;
  }
}
@media screen and (max-width: 992px) {
  .c-filter-platform li.c-filter-platform__option--active {
    background: none;
  }
}
@media screen {
  .c-filter-platform li.c-filter-platform__option--active:before {
    content: "";
    position: absolute;
    background: #ffffff;
    bottom: -12px;
    left: 50%;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    transform: rotate(45deg);
    border-radius: 3px;
  }
}
@media screen and (max-width: 992px) {
  .c-filter-platform li.c-filter-platform__option--active:before {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-filter-platform li.c-filter-platform__option--active span {
    background: #3B4048;
  }
}
@media screen {
  .c-library-filters {
    position: fixed;
    right: 0;
    left: auto;
    top: 0;
    width: 100px;
    height: 100%;
    background: linear-gradient(to right bottom, #333333, #363638, #38393d, #3a3c43, #3b4048);
    display: block;
    padding-top: 72px;
    padding-bottom: 54px;
    overflow: hidden;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters {
    position: relative !important;
    padding-top: 0 !important;
    padding-bottom: 0;
    width: 100%;
    height: 150px !important;
    overflow: hidden;
    overflow-y: hidden !important;
    animation: none;
    z-index: 99;
  }
}
@media screen {
  .c-library-filters .o-button__label--open {
    display: none;
  }
}
@media screen {
  .c-library-filters .o-button-tooltip--subscription {
    width: 22px !important;
    height: 22px !important;
    margin-left: 6px !important;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters .o-button-tooltip--subscription {
    display: none;
  }
}
@media screen {
  .c-library-filters .o-button-tooltip--subscription svg {
    transform: none !important;
    width: 12px !important;
    height: 12px !important;
    fill: #333333 !important;
    opacity: 1 !important;
    margin: -6px 5px 0 0 !important;
  }
}
@media screen {
  .c-library-filters .o-tooltip--subscription {
    min-width: 300px;
    font-style: normal;
  }
  .c-library-filters .o-tooltip--subscription:before {
    content: "";
    width: 100%;
    height: 30px;
    position: absolute;
    bottom: -30px;
    left: 0;
  }
  .c-library-filters .o-tooltip--subscription a {
    color: #158443 !important;
    text-decoration: underline !important;
  }
}
@media screen and (min-width: 992px) {
  .c-library-filters .c-video-player__lessons-section {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters .c-video-player__lessons-section {
    padding: 0 24px 20px;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters .c-video-player__lessons-section--options {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters .c-video-player__lessons-section-search {
    display: block;
  }
}
@media screen {
  .c-library-filters .c-video-player__lessons-section-category {
    display: block !important;
  }
}
@media screen {
  .c-library-filters .c-video-player__lessons-title .c-video-player__lessons-info {
    position: relative;
    top: 7px;
    right: -9px;
  }
  .c-library-filters .c-video-player__lessons-title .c-video-player__lessons-info:hover .o-tooltip {
    visibility: visible;
    opacity: 1;
  }
  .c-library-filters .c-video-player__lessons-title .c-video-player__lessons-info svg {
    opacity: 1;
    fill: #333333;
    width: 12px;
    height: 14px;
    margin-top: -7px;
    margin-left: 6px;
  }
  .c-library-filters .c-video-player__lessons-title .c-video-player__lessons-info .o-tooltip {
    top: -50px;
    height: auto;
    text-align: left;
  }
}
@media screen {
  .c-library-filters .c-video-player__lessons-section--action {
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -35px;
    padding: 0 10px;
    width: 100%;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters .c-video-player__lessons-section--action {
    display: inline-flex;
    position: relative;
    top: 0;
    margin-top: 0;
    padding: 20px 24px;
    width: 100%;
    justify-content: center;
  }
  .c-library-filters .c-video-player__lessons-section--action button .o-button__icon--left {
    margin-right: 9px;
  }
}
@media screen {
  .c-library-filters .c-video-player__lessons-section--action button .o-button__icon--left {
    margin-right: 6px;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters .c-video-player__lessons-section--action .o-text-button--desktop {
    display: none !important;
  }
}
@media screen {
  .c-library-filters .c-video-player__lessons-section--action .o-text-button--mobile {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters .c-video-player__lessons-section--action .o-text-button--mobile {
    display: flex !important;
  }
}
@media screen {
  .c-library-filters .c-library-filters__checkbox-list {
    display: flex;
    flex-wrap: wrap;
    margin-top: 9px !important;
  }
  .c-library-filters .c-library-filters__checkbox-list li {
    padding: 12px 0;
    width: 50%;
    white-space: nowrap;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters .c-library-filters__checkbox-list li {
    width: 25%;
  }
}
@media screen and (max-width: 768px) {
  .c-library-filters .c-library-filters__checkbox-list li {
    width: 33%;
  }
}
@media screen and (max-width: 600px) {
  .c-library-filters .c-library-filters__checkbox-list li {
    width: 100%;
  }
}
@media screen {
  .c-library-filters .c-library-filters__checkbox-list li > span {
    color: #ffffff;
    padding-left: 32px;
    position: relative;
    top: 1px;
    z-index: -1;
  }
}
@media screen {
  .c-library-filters .c-library-filters__checkbox-list li .checkbox__indicator {
    width: 24px;
    height: 24px;
  }
  .c-library-filters .c-library-filters__checkbox-list li .checkbox__indicator svg {
    width: 12px;
    margin: -5px 0 0 -6px;
  }
}
@media screen {
  .c-library-filters .c-video-player__lesson-list {
    margin-bottom: 0 !important;
  }
}
@media screen {
  .c-library-filters .c-video-player__lesson-list--open {
    display: flex !important;
    flex-wrap: wrap !important;
  }
}
@media screen {
  .c-library-filters .c-video-player__lesson-list-dropdown--open {
    display: block !important;
  }
}
@media screen {
  .c-library-filters #library-query {
    margin-bottom: 0;
  }
}
@media screen {
  .c-library-filters .c-library-filters__key-controls {
    position: fixed;
    bottom: 0;
    width: 100px;
    z-index: 999;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters .c-library-filters__key-controls {
    width: 100% !important;
  }
  .c-library-filters .c-library-filters__key-controls .o-button__label--open {
    display: block !important;
  }
  .c-library-filters .c-library-filters__key-controls .o-button__label--close {
    display: none !important;
  }
}
@media screen {
  .c-library-filters .c-library-filters__key-controls .o-button {
    border-radius: 0;
    width: 100%;
    height: 54px;
    justify-content: center;
  }
}
@media screen {
  .c-library-filters .c-library-filters__key-controls .o-button-apply {
    display: none;
  }
}
@media screen {
  .c-library-filters .dropdown .dropdown-toggle input {
    width: 100% !important;
    height: 50px;
    padding: 0 15px;
    background: #ffffff;
    border: 2px solid #D6E0EF;
    border-radius: 0.5625rem; /* 9/16 */
    transition: all 0.25s;
    margin-top: 6px;
    margin-bottom: 20px;
    font-size: 1rem;
    background: #3B4048;
    border: 2px solid #73859F;
    color: #ffffff;
    margin-bottom: 0;
  }
  .c-library-filters .dropdown .dropdown-toggle input:focus {
    background: rgba(29, 131, 209, 0.05);
    border: 2px solid #73859F;
    box-shadow: 0px 5px 10px rgba(55, 55, 55, 0.05);
    outline: none;
  }
  .c-library-filters .dropdown .dropdown-toggle input::placeholder {
    color: #ffffff;
  }
  .c-library-filters .dropdown .dropdown-toggle input:hover {
    background: rgba(29, 131, 209, 0.05);
  }
  .c-library-filters .dropdown.open input {
    padding: 0 15px !important;
    height: 50px !important;
    margin-top: 6px !important;
    margin-bottom: 0 !important;
  }
}
@media screen {
  .c-library-filters .c-library-filters__added {
    margin-top: 18px;
  }
  .c-library-filters .c-library-filters__added span.o-tag {
    margin-right: 5px;
  }
}
@media screen {
  .c-library-filters .dropdown-menu {
    background: #ffffff;
    border-radius: 0.5625rem !important;
    padding: 24px 0 12px;
    width: 320px;
    z-index: 99999;
    border: 0 !important;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters .dropdown-menu {
    position: relative;
    width: 100%;
    background: none;
    border-radius: none;
    box-shadow: none;
    margin-left: -10px;
  }
}
@media screen {
  .c-library-filters .dropdown-menu li {
    position: relative;
    padding-left: 30px;
  }
  .c-library-filters .dropdown-menu li:hover {
    background: #F2F6FA;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters .dropdown-menu li:hover {
    background: none;
  }
}
@media screen {
  .c-library-filters .dropdown-menu li > span {
    display: inline-block;
    margin-left: -10px;
    color: #959DA5;
    margin-top: 15px;
    margin-bottom: 15px;
  }
}
@media screen {
  .c-library-filters .dropdown-menu li button {
    background: #959DA5;
    color: #ffffff;
    border-radius: 0.5625rem;
    font-size: 0.875rem; /* 14/16 */
    font-weight: 700;
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    float: right;
    cursor: pointer;
    margin-right: 18px;
    margin-top: 10px;
  }
}
@media screen {
  .c-library-filters .dropdown-menu li a {
    display: flex;
    align-items: center;
    height: 42px;
    padding: 0 24px;
    font-size: 15px;
  }
  .c-library-filters .dropdown-menu li a:before {
    content: "";
    position: absolute;
    left: 20px;
    top: 50%;
    width: 24px;
    height: 24px;
    background: #ffffff;
    border-radius: 0.5625rem;
    border: 2px solid rgba(115, 133, 159, 0.5);
    margin-top: -12px;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters .dropdown-menu li a:before {
    background: none;
    border: 2px solid rgba(115, 133, 159, 0.5);
  }
}
@media screen {
  .c-library-filters .dropdown-menu li.highlight {
    color: #333333;
  }
  .c-library-filters .dropdown-menu li.highlight a {
    background: none;
    color: #333333;
  }
}
@media screen {
  .c-library-filters .dropdown-menu li.active a {
    background: none;
  }
  .c-library-filters .dropdown-menu li.active a:before {
    background: #158443;
    background-image: url(/assets/svg-icons/checkmark-c892a399ec5e7c73a6cac886b1baac93a78bf5eab341469fd7de45c61c674ec0.png);
    background-size: cover;
    border: none;
  }
}
@media screen {
  .c-library-filters--open .c-library-filters {
    width: 380px;
    overflow-y: auto;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters--open .c-library-filters {
    position: fixed;
    padding-top: 72px;
    padding-bottom: 54px;
    width: 100%;
    height: 100%;
  }
}
@media screen {
  .c-library-filters--open .c-library-filters .c-video-player__lessons-section--action {
    display: inline-flex;
    position: relative;
    top: 0;
    margin-top: 0;
    padding: 20px 24px;
  }
  .c-library-filters--open .c-library-filters .c-video-player__lessons-section--action button .o-button__icon--left {
    margin-right: 9px;
  }
}
@media screen {
  .c-library-filters--open .c-library-filters__key-controls {
    display: flex;
    width: 380px;
  }
}
@media screen {
  .c-library-filters--open .o-button__label--close {
    display: none;
  }
}
@media screen {
  .c-library-filters--open .o-button__label--open {
    display: block;
  }
}
@media screen {
  .c-library-filters--open .c-video-player__lessons-section {
    display: block;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters--open .c-video-player__lessons-section--options {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters--mobile-open .c-library-filters__key-controls {
    display: flex;
    width: 360px;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters--mobile-open .c-library-filters {
    position: fixed !important;
    padding-top: 72px !important;
    padding-bottom: 54px;
    width: 100%;
    height: 100% !important;
    overflow-y: scroll !important;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters--mobile-open .c-library-filters .c-video-player__lessons-section--options {
    display: block;
  }
}
@media screen and (max-width: 992px) {
  .c-library-filters--mobile-open .c-library-filters .o-button-apply {
    display: inline-block !important;
  }
}
@media screen {
  .c-library-filters--mobile-open .c-library-filters .o-button-apply svg {
    width: 16px;
    height: 16px;
    position: relative;
    top: 2px;
    left: -2px;
  }
}
@media screen {
  .c-library-controls button {
    margin-left: 18px;
  }
  .c-library-controls button:focus {
    outline: none;
  }
  .c-library-controls button:last-child {
    margin-right: 0;
  }
  .c-library-controls .o-dropdown-menu {
    top: 30px;
    right: 0;
    width: 270px;
  }
  .c-library-controls .o-dropdown-menu:before {
    display: none;
  }
  .c-library-controls .o-dropdown-menu li {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 1.0625rem; /* 17/16 */
    color: #333333;
  }
  .c-library-controls .o-dropdown-menu li:hover {
    background: #DBDDE0;
  }
}
@media screen {
  .l-library.l-background--black .c-library-controls button {
    color: #ffffff;
  }
  .l-library.l-background--black .c-library-controls button svg {
    fill: #ffffff;
  }
}
@media screen {
  .c-search__loading {
    padding-bottom: 300px;
    padding-top: 100px;
    text-align: center;
  }
  .c-search__loading h3 {
    text-align: center;
  }
  .c-search__loading .c-search__loading-static {
    min-height: 220px;
  }
  .c-search__loading .c-search__loading-static img {
    width: 150px;
  }
}
@media screen and (max-width: 768px) {
  .c-search__loading .c-search__loading-static img {
    width: 120px;
  }
}
@media screen {
  .c-search__loading .c-search__loading-animate {
    position: relative;
    width: 150px;
    margin-top: 20px;
    margin-left: 30px;
  }
  .c-search__loading .c-search__loading-animate img {
    position: absolute;
    width: 50px;
    top: 0;
    left: 50px;
  }
}
@media screen and (max-width: 768px) {
  .c-search__loading .c-search__loading-animate img {
    width: 50px;
  }
}
@media screen {
  .c-search__loading .c-search__loading-animate img.a-file-rotate--2 {
    top: 75px;
    left: 15px;
    animation-duration: 2.9s;
  }
}
@media screen {
  .c-search__loading .c-search__loading-animate img.a-file-rotate--3 {
    top: 75px;
    left: 85px;
    animation-duration: 3.1s;
  }
}
@media screen {
  .c-search__no-results {
    text-align: center;
    margin-top: -36px;
  }
  .c-search__no-results h3 {
    font-size: 2.25rem; /* 36/16 */
    margin-top: 24px;
  }
}
@media screen and (max-width: 600px) {
  .c-search__no-results h3 {
    font-size: 1.3125rem !important;
  }
}
@media screen {
  .c-search__no-results h4 {
    font-size: 1.3125rem; /* 21/16 */
    margin-top: 32px;
  }
}
@media screen and (max-width: 600px) {
  .c-search__no-results h4 {
    font-size: 1.1875rem !important; /* 19/16 */
  }
}
@media screen {
  .c-search__no-results img {
    display: inline-block;
    width: 200px;
    height: auto;
    margin-left: -20px;
    padding-top: 20px;
  }
}
@media screen and (max-width: 600px) {
  .c-search__no-results img {
    width: 150px;
  }
}
@media screen {
  .c-search__no-results p {
    font-family: "Bitter", serif;
    font-style: italic;
    font-size: 2.25rem;
  }
}
@media screen and (max-width: 600px) {
  .c-search__no-results p {
    font-size: 1.3125rem;
  }
}
@media screen {
  .c-search__no-results .c-search__tags {
    margin-top: 24px;
    text-align: center;
  }
}
@media screen {
  .c-global-search--book {
    background: #ffffff;
  }
}
@media screen and (max-width: 600px) {
  .c-global-search--book {
    padding-top: 24px;
  }
}
@media screen {
  .c-global-search--book .o-input {
    margin: 0;
  }
}
@media screen and (max-width: 992px) {
  .c-global-search--book .o-input {
    width: calc(100% - 32px);
  }
}
@media screen {
  .c-global-search--book .input__icon-svg--search {
    fill: #959DA5;
    margin-top: -9px;
  }
}
@media screen {
  .c-global-search--book .c-global-search__close {
    position: absolute;
    right: -32px;
    top: 15px;
    cursor: pointer;
  }
}
@media screen and (max-width: 992px) {
  .c-global-search--book .c-global-search__close {
    right: 0;
  }
}
@media screen {
  .c-global-search--book .c-global-search__close svg {
    height: 18px;
  }
}
@media screen {
  .c-global-search--book .c-global-search__recommendations {
    margin-top: 20px;
  }
}
@media screen and (max-width: 992px) {
  .c-global-search--book .c-global-search__recommendations {
    padding-left: 0;
    padding-right: 0;
  }
}
@media screen {
  .c-global-search--book .c-global-search__recommendations h3 {
    color: #333333;
  }
}
@media screen {
  .c-global-search--book .c-global-search__recommendations ul li {
    border-bottom: 1px solid #DBDDE0;
    padding: 15px 0;
  }
  .c-global-search--book .c-global-search__recommendations ul li a {
    color: #333333;
    text-decoration: none;
  }
  .c-global-search--book .c-global-search__recommendations ul li p {
    font-size: 0.9375rem; /* 15/16 */
    color: #333333;
  }
  .c-global-search--book .c-global-search__recommendations ul li .c-search__results--highlight {
    background: transparent;
    font-weight: 700;
    padding: 0;
  }
}
@media screen {
  .c-global-search--book .c-global-search__recommendations .c-search__results-chapter {
    margin-bottom: 3px;
    font-family: "Bitter", serif;
    font-size: 1.0625rem; /* 17/16 */
    font-weight: 700;
    text-decoration: underline;
  }
  .c-global-search--book .c-global-search__recommendations .c-search__results-chapter:hover {
    color: #158443;
  }
}
@media screen {
  .c-global-search--book .c-paginator {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    border-bottom: 1px solid #DBDDE0;
  }
}
@media screen {
  .c-content-author {
    display: flex;
  }
}
@media screen and (max-width: 768px) {
  .c-content-author {
    margin-top: 20px;
  }
}
@media screen {
  .c-content-author img {
    display: flex;
    min-width: 60px;
    height: 60px;
    border-radius: 0.5625rem;
    border: 4px solid #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    margin-right: 15px;
  }
}
@media screen {
  .c-content-author a {
    color: #333333;
    text-decoration: none;
  }
}
@media screen {
  .c-content-author .c-content-author__title {
    display: block;
    font-family: "Bitter", serif;
    font-size: 1rem; /* 18/16 */
    font-weight: 700;
    margin-top: 6px;
  }
  .c-content-author .c-content-author__title i {
    position: relative;
    margin-left: 15px;
    top: 1px;
  }
}
@media screen {
  .c-content-author .c-content-author__title--large {
    font-size: 1.125rem; /* 18/16 */
    margin-top: 0 !important;
  }
}
@media screen {
  .c-content-author .c-content-author__description {
    font-size: 0.9375rem; /* 15/16 */
    color: #6E7687;
    margin-top: 6px;
  }
  .c-content-author .c-content-author__description a {
    color: #158443;
    text-decoration: underline;
  }
}
@media screen {
  .c-content-author .c-content-author__read-more {
    margin-top: 3px;
  }
  .c-content-author .c-content-author__read-more a {
    font-size: 0.9375rem; /* 15/16 */
    color: #158443;
  }
}
@media screen {
  .c-content-author .o-badge {
    display: inline-block;
    margin-top: 12px;
  }
}
@media screen {
  .c-authors--dark .c-content-author .c-content-author__title {
    color: #ffffff;
  }
  .c-authors--dark .c-content-author .c-content-author__description {
    color: #A7ADB4;
  }
  .c-authors--dark .c-content-author img {
    border: 4px solid #434A53;
  }
  .c-authors--dark .c-content-author .o-badge {
    background: #434A53 !important;
    color: #ffffff !important;
  }
}
@media screen {
  .c-content-author--card {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    padding: 18px 42px 30px 18px;
  }
  .c-content-author--card img {
    border: 0;
    box-shadow: none;
  }
}
@media screen {
  .c-content-author--quote {
    position: relative;
  }
  .c-content-author--quote:before {
    content: "";
    position: absolute;
    width: 20px;
    height: 15px;
    right: 18px;
    top: 18px;
    background-image: url(/assets/svg-icons/punctutation-a2544368f2caec4bc5be734142714d92543038d9cf6bf95e0a06680be8f1629a.png);
    background-size: cover;
  }
}
@media screen {
  .c-profile__grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    max-width: 1080px;
  }
}
@media screen and (max-width: 1140px) {
  .c-profile__grid {
    padding: 30px 20px 0;
  }
}
@media screen and (max-width: 992px) {
  .c-profile__grid {
    grid-template-columns: 1fr;
  }
  .c-profile__grid .c-profile__links {
    order: 2;
    margin-top: 30px;
  }
  .c-profile__grid .c-profile__bio {
    order: 1;
  }
}
@media screen {
  .c-profile__grid .c-profile__bio-description {
    color: #6E7687;
  }
  .c-profile__grid .c-profile__bio-description a {
    color: #158443;
  }
}
@media screen {
  .c-profile__sidebar {
    width: 100%;
    background: #333333;
    padding: 42px 30px;
    z-index: 9999;
    text-align: center;
  }
  .c-profile__sidebar .c-profile__sidebar-user {
    font-size: 1.25rem; /* 20/16 */
    margin-top: 15px;
  }
}
@media screen {
  .c-profile__empty {
    text-align: center;
  }
  .c-profile__empty img {
    width: 320px;
  }
}
@media screen {
  .c-profile__contributions .c-tutorial-item__in-progress, .c-profile__contributions .c-tutorial-item__complete {
    display: none !important;
  }
}
@media screen {
  .c-profile__progressions .c-tutorial-item__in-progress {
    display: none !important;
  }
  .c-profile__progressions .c-tutorial-item--complete .c-tutorial-item__complete {
    display: inline-flex !important;
  }
  .c-profile__progressions .o-button--mark-as-complete {
    display: block;
  }
  .c-profile__progressions .c-tutorial-item__icon {
    display: none !important;
  }
  .c-profile__progressions .c-tutorial-item__art .o-badge {
    display: none !important;
  }
}
@media screen {
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__header {
    display: flex;
  }
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__load {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 80px;
    line-height: 80px;
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    font-family: "Bitter", serif;
    font-size: 1.0625rem; /* 17/16 */
    font-weight: 700;
    cursor: pointer;
    padding: 0 18px;
  }
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__load:hover {
    color: #158443;
  }
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__load span {
    margin-left: auto;
    letter-spacing: -0.5px;
    color: #333333;
  }
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__load i {
    display: flex;
    margin-left: auto;
  }
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__comment {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    padding: 20px 18px;
    display: grid;
    grid-template-columns: 69px 1fr;
    position: relative;
    margin-top: 15px;
  }
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__comment:first-child {
    margin-top: 0;
  }
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__comment .c-forum-comment__username {
    display: block;
    font-family: "Bitter", serif;
    font-weight: 700;
  }
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__comment .c-forum-comment__date {
    display: block;
    font-size: 0.9375rem; /* 15/16 */
    color: #6E7687;
    margin-top: 4px;
  }
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__comment .c-forum-comment__post {
    margin-top: 4px;
    padding-right: 40px;
    font-size: 1rem;
  }
}
@media screen and (max-width: 768px) {
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__comment .c-forum-comment__post {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__comment .c-forum-comment__reply {
    position: absolute;
    bottom: 18px;
    right: 18px;
  }
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__comment .c-forum-comment__reply svg {
    transition: all 0.3s ease-out;
  }
  .c-forum-comments .c-forum-comments__wrapper .c-forum-comments__comment .c-forum-comment__reply:hover svg {
    opacity: 1;
  }
}
@media screen {
  .c-empty-state {
    text-align: center;
    position: relative;
  }
  .c-empty-state img {
    width: 200px;
  }
  .c-empty-state .c-empty-state__artwork {
    margin-top: 60px;
    width: 120px;
  }
}
@media screen and (max-width: 600px) {
  .c-empty-state .c-empty-state__artwork {
    width: 90px;
    margin-top: 45px;
  }
}
@media screen {
  .c-empty-state--android .c-empty-state__image-animate {
    position: absolute;
    width: 120px;
    top: 40px;
    right: 0px;
  }
}
@media screen {
  .c-empty-state--loader .c-search__loading {
    margin-left: -20px;
  }
  .c-empty-state--loader .c-search__loading-animate {
    margin-top: 40px;
  }
}
@media screen {
  .c-empty-state--following {
    padding: 0 30px 120px;
  }
  .c-empty-state--following h3 {
    font-size: 1.75rem; /* 32/16 */
  }
  .c-empty-state--following .c-empty-state__artwork {
    margin-top: -30px;
    width: 240px;
  }
}
@media screen {
  .c-empty-state--suggestions h3 {
    font-size: 1.75rem; /* 32/16 */
  }
}
@media screen {
  .c-empty-state--message {
    margin-top: 60px;
    text-align: center;
  }
  .c-empty-state--message h4 {
    font-size: 1.1875em; /* 19/16 */
    margin-top: 18px;
  }
  .c-empty-state--message p {
    font-size: 0.9375em; /* 15/16 */
    color: #6E7687;
    margin-top: 6px;
  }
  .c-empty-state--message img {
    width: 270px;
  }
}
@media screen {
  .c-empty-state--books img {
    width: 120px;
  }
}
@media screen {
  .c-empty-state--articles img {
    width: 130px;
  }
}
@media screen {
  .c-empty-state--announcements img {
    width: 66px;
  }
}
@media screen {
  .c-testimonial-wrapper {
    columns: 3;
    column-gap: 60px;
  }
}
@media screen and (max-width: 992px) {
  .c-testimonial-wrapper {
    columns: 2;
  }
}
@media screen and (max-width: 768px) {
  .c-testimonial-wrapper {
    columns: 1;
  }
}
@media screen {
  .c-testimonial-wrapper .c-testimonial {
    width: 100%;
    display: inline-block;
    margin-bottom: 30px;
  }
}
@media screen {
  .c-testimonial {
    text-align: center;
    position: relative;
    z-index: 1;
  }
}
@media screen and (max-width: 768px) {
  .c-testimonial {
    text-align: left;
  }
}
@media screen {
  .c-testimonial:before {
    content: "";
    z-index: 0;
    width: 40px;
    height: 30px;
    background-image: url(/assets/svg-icons/punctutation-a2544368f2caec4bc5be734142714d92543038d9cf6bf95e0a06680be8f1629a.png);
    background-size: cover;
    position: absolute;
    top: -10px;
    left: -10px;
    opacity: 0.25;
    z-index: -1;
  }
}
@media screen {
  .c-testimonial p {
    font-size: 1.0625rem; /* 17/16 */
  }
}
@media screen and (max-width: 600px) {
  .c-testimonial p {
    font-size: 0.9375rem;
  }
}
@media screen {
  .c-testimonial span {
    display: block;
    font-family: "Bitter", serif;
    font-size: 1.125rem; /* 18/16 */
    font-weight: 700;
    margin-top: 15px;
  }
}
@media screen {
  .c-testimonial img {
    width: 48px;
    height: 48px;
    margin-top: 15px;
    border: 4px solid #ffffff;
    border-radius: 0.5625rem;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
  }
}
@media screen {
  .c-testimonial-wrapper--twitter {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }
}
@media screen and (max-width: 992px) {
  .c-testimonial-wrapper--twitter {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 768px) {
  .c-testimonial-wrapper--twitter {
    grid-template-columns: 1fr;
  }
}
@media screen {
  .c-testimonial-wrapper--twitter .c-testimonial--twitter {
    width: 100%;
    display: inline-block;
  }
}
@media screen {
  .c-testimonial--twitter {
    background-color: rgba(255, 255, 255, 0.5);
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
    border-radius: 0.75rem; /* 12/16 */
    position: relative;
    z-index: 1;
    padding: 18px 18px 48px 18px;
  }
  .c-testimonial--twitter .c-testimonial__upper {
    display: grid;
    grid-template-columns: 42px 1fr;
    grid-column-gap: 14px;
  }
  .c-testimonial--twitter .c-testimonial__upper span {
    font-size: 1rem;
    display: block;
  }
  .c-testimonial--twitter .c-testimonial__user {
    font-size: 1.125rem; /* 18/16 */
    font-weight: 700;
  }
  .c-testimonial--twitter .c-testimonial__twitter {
    font-size: 1rem;
    color: #6E7687;
    margin-top: -3px;
  }
  .c-testimonial--twitter .c-testimonial__date {
    position: absolute;
    bottom: 18px;
    right: 18px;
    font-size: 0.875rem; /* 14/16 */
    color: #6E7687;
  }
  .c-testimonial--twitter p {
    font-size: 1rem;
    margin-top: 16px;
    margin-bottom: 0;
  }
}
@media screen and (max-width: 600px) {
  .c-testimonial--twitter p {
    font-size: 0.9375rem;
  }
}
@media screen {
  .c-testimonial--twitter img {
    width: 48px;
    height: 48px;
    border-radius: 100px;
  }
}
@media screen {
  .c-testimonial--twitter svg {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 22px;
    height: 18px;
  }
}
@media screen {
  .c-card-category {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    padding: 0 0 30px;
    min-height: 320px;
    position: relative;
    overflow: hidden;
  }
}
@media screen and (max-width: 768px) {
  .c-card-category:first-child {
    margin-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-card-category {
    background: none;
    box-shadow: none;
    border-radius: 0;
    min-height: 0;
    border-bottom: 1px solid #DFE7F0;
  }
}
@media screen and (max-width: 600px) {
  .c-card-category {
    margin-top: 30px;
  }
}
@media screen {
  .c-card-category .c-card-category__artwork {
    width: 100%;
    height: 60px;
    position: relative;
    background: #ffffff;
    background-size: cover !important;
  }
}
@media screen and (max-width: 768px) {
  .c-card-category .c-card-category__artwork {
    display: none;
  }
}
@media screen {
  .c-card-category .c-card-category__artwork img {
    display: block;
    width: 100%;
  }
}
@media screen {
  .c-card-category .c-card-category__artwork .o-badge {
    position: absolute;
    top: 12px;
    left: 12px;
  }
}
@media screen {
  .c-card-category .c-card-category__text {
    padding: 0 27px;
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .c-card-category .c-card-category__text {
    padding: 0;
    text-align: left;
  }
}
@media screen {
  .c-card-category .c-card-category__text .o-badge-video {
    display: inline-flex;
    width: 54px;
    height: 54px;
    margin-top: -27px;
  }
}
@media screen and (max-width: 768px) {
  .c-card-category .c-card-category__text .o-badge-video {
    margin-top: 0;
  }
}
@media screen {
  .c-card-category .c-card-category__text .o-badge-video img {
    width: 100%;
  }
}
@media screen {
  .c-card-category .c-card-category__text .c-card-category__text-title {
    font-size: 1.5rem; /* 24/16 */
    margin-top: 12px;
  }
}
@media screen and (max-width: 768px) {
  .c-card-category .c-card-category__text .c-card-category__text-title {
    font-size: 1.3125rem; /* 21/16 */
  }
}
@media screen {
  .c-card-category .c-card-category__text .c-card-category__text-description {
    font-size: 0.9375rem; /* 15/16 */
    color: #6E7687;
    margin-top: 12px;
    padding-bottom: 70px;
  }
}
@media screen and (max-width: 768px) {
  .c-card-category .c-card-category__text .c-card-category__text-description {
    padding-bottom: 0;
    margin-bottom: 15px;
  }
}
@media screen {
  .c-card-category .c-card-category__text .o-button--green, .c-card-category .c-card-category__text .o-button--dark {
    position: absolute;
    bottom: 30px;
    transform: translateX(-50%);
  }
}
@media screen and (max-width: 768px) {
  .c-card-category .c-card-category__text .o-button--green, .c-card-category .c-card-category__text .o-button--dark {
    position: relative;
    bottom: 0;
    transform: translateX(0);
  }
}
@media screen {
  .c-card-choice {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    text-align: center;
    padding: 27px 42px;
    position: relative;
  }
  .c-card-choice .c-card-choice__title {
    font-size: 1.5rem; /* 24/16 */
  }
  .c-card-choice a {
    position: absolute;
    bottom: 30px;
    transform: translateX(-50%);
  }
}
@media screen {
  .c-plan {
    background: #ffffff;
    box-shadow: 0px 2px 1px 0 rgba(51, 51, 51, 0.05);
    border-radius: 0.5625rem;
    text-align: center;
    padding: 36px 30px;
    width: 330px;
    height: 565px;
    margin-top: 30px;
    position: relative;
  }
  .c-plan h3 {
    font-size: 1.3125rem; /* 21/16 */
    font-weight: 600;
    margin-bottom: 0;
    padding-top: 0;
  }
  .c-plan .l-font-24 {
    font-size: 1.5rem;
  }
  .c-plan .c-plan__price {
    display: inline-block;
    position: relative;
    margin-top: 15px;
  }
  .c-plan .c-plan__price .c-plan__price-currency {
    font-family: "Bitter", serif;
    font-size: 1.125rem; /* 18/16 */
    font-weight: 700;
    position: absolute;
    top: 8px;
    left: -18px;
  }
  .c-plan .c-plan__price .c-plan__price-main {
    font-family: "Bitter", serif;
    font-size: 6.25rem; /* 100/16 */
    font-weight: 700;
    line-height: 100px;
    letter-spacing: -5px;
  }
  .c-plan .c-plan__price .c-plan__price-cents {
    font-family: "Bitter", serif;
    font-size: 1.125rem; /* 18/16 */
    font-weight: 700;
    letter-spacing: -0.5px;
    position: absolute;
    bottom: 8px;
    right: -24px;
  }
  .c-plan .c-plan__time span {
    display: block;
  }
  .c-plan .c-plan__time .c-plan__time-month {
    font-family: "Bitter", serif;
  }
  .c-plan .c-plan__time .c-plan__time-save {
    font-size: 0.875rem; /* 14/16 */
    margin-top: 6px;
    opacity: 0.66;
  }
  .c-plan .c-plan__time .c-plan__time-price {
    display: none;
  }
  .c-plan .c-plan__benefits {
    margin-top: 18px;
    list-style: none;
    padding: 0 0 60px 0;
    margin: 0;
  }
  .c-plan .c-plan__benefits li {
    position: relative;
    padding-left: 32px;
    font-family: "Bitter", serif;
    font-weight: 700;
    text-align: left;
    margin-top: 15px;
  }
}
@media screen and (max-width: 1080px) {
  .c-plan .c-plan__benefits li {
    font-size: 0.9375rem; /* 15/16 */
  }
}
@media screen {
  .c-plan .c-plan__benefits li:before {
    content: "";
    width: 24px;
    height: 24px;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url(/assets/svg-icons/checkmark--green-1e096ae45df68feb9ffcc548c7c6510565f7f0d4098690d0121fe6739a2a7e76.png);
    background-size: cover;
  }
}
@media screen {
  .c-plan a, .c-plan .o-button {
    position: absolute;
    bottom: 36px;
    transform: translateX(-50%);
  }
}
@media screen {
  .c-plan .o-button--primary {
    bottom: 84px;
  }
}
@media screen {
  .c-plan .o-button--secondary {
    bottom: 36px;
    text-decoration: underline;
    font-size: 0.9375rem; /* 15/16 */
    white-space: nowrap;
  }
}
@media screen {
  .c-plan--emphasis {
    background: #158443;
    width: 336px;
    min-height: 645px;
    margin-top: 0;
  }
  .c-plan--emphasis .o-badge {
    position: absolute;
    top: -16px;
    color: #158443;
    border: 6px solid #158443;
    left: 50%;
    margin-left: -62px;
    box-shadow: none;
    border-radius: 0.9375rem; /* 15/16 */
  }
  .c-plan--emphasis .o-badge:after {
    background: #158443;
    top: 26px;
  }
  .c-plan--emphasis h3, .c-plan--emphasis li, .c-plan--emphasis .c-plan__price-currency, .c-plan--emphasis .c-plan__price-main, .c-plan--emphasis .c-plan__price-cents {
    color: #ffffff;
  }
  .c-plan--emphasis .c-plan__time span {
    color: #ffffff;
  }
  .c-plan--emphasis .c-plan__benefits li:before {
    background-image: url(/assets/svg-icons/checkmark-c892a399ec5e7c73a6cac886b1baac93a78bf5eab341469fd7de45c61c674ec0.png);
  }
  .c-plan--emphasis .c-plan__benefits .c-plan__benefits--highlight:before {
    background-image: url(/assets/svg-icons/checkmark--blue-18803e2ee06f4c404b6c173497e54fbbb6e251bac81ecc8dfc030657cf775724.png);
  }
}
@media screen {
  .c-plan--team .c-plan__price-main {
    letter-spacing: -10px !important;
  }
}
@media screen {
  .c-plan--no-price p {
    height: 222px;
    display: flex;
    align-items: center;
  }
}
@media screen {
  .c-plan--left {
    border-radius: 0.5625rem 0 0 0.5625rem;
  }
}
@media screen {
  .c-plan--right {
    border-radius: 0 0.5625rem 0.5625rem 0;
  }
}
@media screen {
  .c-plan--confirm {
    width: 500px !important;
    height: auto !important;
    padding-bottom: 40px !important;
  }
  .c-plan--confirm .o-button--green {
    margin-top: 30px;
    position: relative;
    transform: none !important;
    bottom: auto;
  }
}
@media screen {
  .c-plan--neon {
    background: transparent;
    border: 2px solid #28D7FE;
    box-shadow: inset 0 0 1vw #1041FF, 0 0 3vw #1041FF, inset 0 0 6vw #1041FF, 0 0 6vw #1041FF, 0 0 0.4vw #8BFDFE;
  }
  .c-plan--neon h4, .c-plan--neon .c-price-card__price-main, .c-plan--neon .c-price-card__price-currency, .c-plan--neon .c-price-card__period, .c-plan--neon .c-price-card__saving {
    color: #ffffff;
  }
}
@media screen {
  .c-card-platform a, .c-card-platform > div {
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    background: #ffffff;
    border-radius: 0.5625rem;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
    text-align: center;
    color: #333333;
    text-decoration: none;
    padding: 36px;
    position: relative;
    overflow: hidden;
  }
  .c-card-platform a:before, .c-card-platform > div:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: all 0.5s;
  }
  .c-card-platform h2 {
    max-width: 180px;
    margin: 0 auto;
    height: 54px;
    display: flex;
    align-items: center;
    font-size: 1.5rem; /* 24/16 */
    line-height: 1.125;
  }
  .c-card-platform p {
    color: #6E7687;
    font-size: 1rem;
    max-width: 180px;
    margin: 0 auto;
  }
}
@media screen {
  .c-card-platform--ios a:before, .c-card-platform--ios > div:before {
    background-image: url(/assets/artwork/illustration-ios-platform-ab500adbf99ef7a50eac362ac7dbd2da6c39386765beaf61e26e9e44c6d4223c.svg);
    background-size: 220px;
    background-position: top -44px center;
    background-repeat: no-repeat;
  }
  .c-card-platform--ios a:hover:before, .c-card-platform--ios > div:hover:before {
    background-size: 230px;
  }
}
@media screen {
  .c-card-platform--android a:before, .c-card-platform--android > div:before {
    background-image: url(/assets/artwork/illustration-android-platform-c683dd8685d10d1ffe4eeb8f9a65bea8c2fc5578d7a8f76608cf223babf8a1dc.svg);
    background-size: 230px;
    background-position: top -65px center;
    background-repeat: no-repeat;
  }
  .c-card-platform--android a:hover:before, .c-card-platform--android > div:hover:before {
    background-size: 240px;
  }
}
@media screen {
  .c-card-platform--flutter a:before, .c-card-platform--flutter > div:before {
    background-image: url(/assets/artwork/illustration-flutter-platform-14685d0e2cbeab64008c7ec07d50a10cbbb123c7c45a47eccd8143d287eff61c.svg);
    background-size: 343px;
    background-position: top -30px left -20px;
    background-repeat: no-repeat;
  }
}
@media screen and (max-width: 768px) {
  .c-card-platform--flutter a:before, .c-card-platform--flutter > div:before {
    background-position: top -30px center;
  }
}
@media screen {
  .c-card-platform--flutter a:hover:before, .c-card-platform--flutter > div:hover:before {
    background-size: 353px;
  }
}
@media screen {
  .c-card-platform--server-side-swift a:before, .c-card-platform--server-side-swift > div:before {
    background-image: url(/assets/artwork/illustration-server-side-swift-platform-91676fd94c82c9d38412dfc3a9b24735710b500c8f47c0c04fee0cac1a160c27.svg);
    background-size: 207px;
    background-position: top -43px center;
    background-repeat: no-repeat;
  }
  .c-card-platform--server-side-swift a:hover:before, .c-card-platform--server-side-swift > div:hover:before {
    background-size: 212px;
  }
}
@media screen {
  .c-card-platform--unity a:before, .c-card-platform--unity > div:before {
    background-image: url(/assets/artwork/illustration-unity-platform-4459ddc546660de8c658f1f5a61ed4d400b8379ec1fd1348d3a27d2424975a1f.svg);
    background-size: 284px;
    background-position: top -60px right -38px;
    background-repeat: no-repeat;
  }
}
@media screen and (max-width: 768px) {
  .c-card-platform--unity a:before, .c-card-platform--unity > div:before {
    background-position: top -60px center;
  }
}
@media screen {
  .c-card-platform--unity a:hover:before, .c-card-platform--unity > div:hover:before {
    background-size: 289px;
  }
}
@media screen {
  .c-card-option {
    border: 2px solid #D6E0EF;
    border-radius: 0.5625rem;
  }
  .c-card-option a {
    color: #333333;
    text-decoration: none;
    width: 100%;
    height: 100%;
    display: block;
    text-align: center;
    border-radius: 0.5625rem;
    position: relative;
  }
  .c-card-option a:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: #F2F6FA;
    z-index: -1;
    border-radius: 0.5625rem;
    transition: opacity 0.5s;
  }
  .c-card-option a:hover:before {
    opacity: 1;
  }
  .c-card-option h3 {
    color: #333333;
    font-size: 1.25rem; /* 20/16 */
    line-height: 1.25;
    text-decoration: none;
    text-align: center;
  }
}
@media screen {
  .c-card-option--ios a {
    background-image: url(/assets/artwork/onboarding-apple-icon-4e20e750ef237d1182f3dcab6de9e7e555da2dba4bacab0afb4e4a3c3a261242.svg);
    background-position: center calc(50% - 30px);
    background-size: 60px 65px;
    background-repeat: no-repeat;
  }
}
@media screen {
  .c-card-option--android {
    background-image: url(/assets/artwork/onboarding-android-icon-1cf3c1cd3080f104965c5771d36b6c69b2a14403320987914d1bf2ddcb56c783.svg);
    background-position: center calc(50% - 30px);
    background-size: 74px 50px;
    background-repeat: no-repeat;
  }
}
@media screen {
  .c-card-option--flutter {
    background-image: url(/assets/artwork/onboarding-flutter-icon-bd399909e58361c320f651baafe2990a2566358becca14deaa681ced949bd9b8.svg);
    background-position: center calc(50% - 30px);
    background-size: 65px 69px;
    background-repeat: no-repeat;
  }
}
@media screen {
  .c-card-option--server-side-swift {
    background-image: url(/assets/artwork/onboarding-sss-icon-cf09daa9cd8027ec50a34196dc0f971c140b9fb693da1839c1d0f38ebeab11de.svg);
    background-position: center calc(50% - 30px);
    background-size: 77px 62px;
    background-repeat: no-repeat;
  }
}
@media screen {
  .c-card-option--gametech {
    background-image: url(/assets/artwork/onboarding-unity-icon-1f53dd0e9ffa147bdddb4f7fe6ccd67903d178a4215855a314fdfb77b57d142b.svg);
    background-position: center calc(50% - 30px);
    background-size: 68px 69px;
    background-repeat: no-repeat;
  }
}
@media screen {
  .c-card-simple {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #ffffff;
    border-radius: 0.5625rem;
    padding: 20px;
    min-height: 120px;
    position: relative;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.075);
  }
  .c-card-simple > a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  .c-card-simple .c-card-simple__upper {
    padding-bottom: 20px;
  }
  .c-card-simple .c-card-simple__upper .c-card-simple__title {
    font-family: "Bitter", serif;
    font-size: 1.125rem; /* 18/16 */
    font-weight: bold;
    letter-spacing: -0.25px;
    line-height: 1.35;
  }
  .c-card-simple .c-card-simple__lower .c-card-simple__meta {
    display: block;
    font-size: 0.875rem; /* 14/16 */
    color: #6E7687;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: calc(100% - 30px);
    max-width: 100%;
  }
}
@media screen {
  .c-card-simple--notebook .c-card-simple__lower svg {
    position: absolute;
    bottom: 20px;
    right: 20px;
    width: 18px;
    height: 17px;
    fill: #959DA5;
  }
}
@media screen {
  .c-card-simple--bookmarks .c-card-simple__lower div.c-card-simple__bookmark {
    position: absolute;
    bottom: 20px;
    right: 20px;
  }
  .c-card-simple--bookmarks .c-card-simple__lower div.c-card-simple__bookmark .o-button--bookmark {
    height: 0px;
  }
}
@media screen {
  .c-card-simple--wrap-normal .c-card-simple__lower .c-card-simple__meta {
    white-space: normal;
  }
}
@media screen {
  .c-card-path-progress {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: 228px 1fr 90px;
    padding: 20px 20px 20px 0;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.075);
    border-radius: 0.5625rem;
    background-color: #ffffff;
  }
}
@media screen and (max-width: 768px) {
  .c-card-path-progress {
    grid-template-columns: 1fr 90px;
    padding: 20px;
  }
}
@media screen {
  .c-card-path-progress .c-card-path-progress__left {
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
@media screen and (max-width: 768px) {
  .c-card-path-progress .c-card-path-progress__left {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -75px 0 0 -75px;
    opacity: 0.1;
  }
}
@media screen {
  .c-card-path-progress .c-card-path-progress__left img {
    width: 150px;
    height: 150px;
    z-index: 1;
  }
  .c-card-path-progress .c-card-path-progress__left img:first-of-type {
    position: absolute;
    left: -75px;
    top: 50%;
    margin-top: -75px;
    filter: blur(134px);
    z-index: 0;
  }
}
@media screen and (max-width: 768px) {
  .c-card-path-progress .c-card-path-progress__left img:first-of-type {
    left: 0;
    top: 0;
  }
}
@media screen {
  .c-card-path-progress .c-card-path-progress__center {
    overflow-x: hidden;
  }
  .c-card-path-progress .c-card-path-progress__center .c-card-path-progress__title {
    font-size: 1.3125rem; /* 21/16 */
  }
  .c-card-path-progress .c-card-path-progress__center .c-card-path-progress__desc {
    font-size: 0.9375rem; /* 15/16 */
    margin-top: 6px;
    color: #6E7687;
  }
  .c-card-path-progress .c-card-path-progress__center .c-card-path-progress__syllabus {
    display: block;
    font-size: 0.9375rem; /* 15/16 */
    margin-top: 6px;
    color: #6E7687;
  }
  .c-card-path-progress .c-card-path-progress__center .c-box-list {
    margin-top: 24px;
    padding-bottom: 24px;
    position: relative;
  }
  .c-card-path-progress .c-card-path-progress__center .c-box-list:hover:before {
    opacity: 0;
    z-index: 0;
  }
  .c-card-path-progress .c-card-path-progress__center .c-box-list:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 128px;
    background: rgb(255, 255, 255);
    background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
    z-index: 2;
    transition: opacity 0.2s;
  }
  .c-card-path-progress .c-card-path-progress__center .c-box-list li {
    display: flex;
    white-space: normal;
  }
  .c-card-path-progress .c-card-path-progress__center .c-box-list li > a {
    display: inline-flex;
    white-space: normal;
  }
  .c-card-path-progress .c-card-path-progress__center .c-box-list .c-box-list__item-title {
    white-space: normal;
  }
  .c-card-path-progress .c-card-path-progress__center .c-box-list .c-box-list__item-number {
    color: #333333;
  }
  .c-card-path-progress .c-card-path-progress__center .c-box-list .c-box-list__item-duration {
    color: #6E7687;
    font-weight: normal;
    max-width: 60px;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-left: 0;
    display: none;
  }
}
@media screen {
  .c-card-path-progress .c-card-path-progress__right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
  }
  .c-card-path-progress .c-card-path-progress__right .o-circular--progress .o-circular-progress--label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    width: 54px;
    height: 30px;
    top: 50%;
    left: 50%;
    right: auto;
    bottom: auto;
    margin: -15px 0 0 -27px;
  }
  .c-card-path-progress .c-card-path-progress__right .o-circular--progress .o-circular-progress--label .o-circluar--percent__text {
    display: inline-flex;
    padding-bottom: 0;
  }
}
@media screen {
  .c-noscript__body {
    margin: 50px 0;
  }
  .c-noscript__body h1 {
    font-family: "Bitter", serif;
    font-weight: 700;
    font-size: 9rem; /* 144/16 */
    letter-spacing: -5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
}
@media only screen and (max-width: 600px) {
  .c-noscript__body h1 {
    font-size: 6rem;
  }
  .c-noscript__body h1 img {
    width: 90px;
  }
}
@media screen {
  .c-noscript__body p {
    font-family: "Bitter", serif;
    font-size: 1.25rem; /* 20/16 */
    max-width: 720px;
    margin: 40px auto;
  }
}
@media screen {
  .c-faq h2 {
    margin-top: 54px;
  }
}
@media screen and (max-width: 600px) {
  .c-faq h2 {
    font-size: 1.3125rem;
  }
}
@media screen {
  .c-faq .c-faq__item {
    margin-top: 48px;
    padding-left: 50px;
  }
  .c-faq .c-faq__item h3 {
    font-size: 1.3125rem; /* 21/16 */
    position: relative;
  }
}
@media screen and (max-width: 600px) {
  .c-faq .c-faq__item h3 {
    font-size: 1.1875rem; /* 19/16 */
  }
}
@media screen {
  .c-faq .c-faq__item h3:before {
    content: "";
    position: absolute;
    width: 27px;
    height: 27px;
    background: #73859F;
    background-image: url(/assets/svg-icons/question-30b4ec22034594c5246dad2174ba2e3efef37b7ca31c34a6243e25c59fe3392d.png);
    background-size: cover;
    left: -50px;
    border-radius: 0.5625rem;
  }
}
@media screen {
  .c-faq .c-faq__item p {
    position: relative;
    color: #6E7687;
    font-size: 1rem;
    margin-top: 27px;
  }
}
@media screen and (max-width: 600px) {
  .c-faq .c-faq__item p {
    font-size: 0.9375rem;
  }
}
@media screen {
  .c-faq .c-faq__item p:first-child:before {
    content: "";
    position: absolute;
    width: 27px;
    height: 27px;
    background-image: url(/assets/svg-icons/loopy-arrow-ed620ece85c7319eebf154f3c1f702066b68d9d73799cce24e35b44adc0ecafd.png);
    background-size: cover;
    top: -4px;
    left: -50px;
  }
}
@media screen {
  .c-faq .c-faq__item p a {
    color: #158443;
  }
}
@media screen {
  .c-faq .c-faq__item ul, .c-faq .c-faq__item ol {
    padding-left: 20px;
    margin-top: 27px;
    color: #6E7687;
  }
  .c-faq .c-faq__item ul li, .c-faq .c-faq__item ol li {
    margin-bottom: 6px;
  }
  .c-faq .c-faq__item ul li a, .c-faq .c-faq__item ol li a {
    color: #158443;
  }
}
@media screen {
  .c-faq .c-faq__item ul li {
    list-style: square;
  }
}
@media screen {
  .c-faq .c-faq__item span.o-badge {
    display: inline-block;
    margin-top: 18px;
  }
}
@media screen {
  .c-review-module--invert .l-border-bottom-grey-mako {
    border-bottom: 1px solid #DBDDE0;
  }
  .c-review-module--invert .l-color-grey-chateau {
    color: #6E7687;
  }
  .c-review-module--invert .o-textarea--dark {
    background: #ffffff;
    border: 2px solid #D6E0EF;
    color: #333333;
    width: 100%;
  }
  .c-review-module--invert .o-textarea--dark:focus {
    background: rgba(29, 131, 209, 0.05);
    border: 2px solid #73859F;
  }
  .c-review-module--invert .c-review-module__main-header-controls span {
    font-size: 0.9375rem; /* 15/16 */
    color: #6E7687;
    margin-left: 9px;
  }
  .c-review-module--invert .c-review-module__main-header-controls a {
    color: #158443;
    text-decoration: underline;
  }
  .c-review-module--invert .c-review-module__main-header-stars .l-button__svg-empty-star {
    fill: #CACED2 !important;
  }
  .c-review-module--invert .c-user-review {
    background-color: #ffffff;
  }
  .c-review-module--invert .c-user-review__date {
    color: #6E7687 !important;
  }
  .c-review-module--invert .c-user-review__bottom .l-button__svg-empty-star {
    opacity: 1 !important;
  }
  .c-review-module--invert .c-review-module__illustration {
    background-image: url(/assets/artwork/illustration-ratings-ecbd0a20f8ea5b868641eee840861c289d0591e9419c4df98c00866ccbadbb5e.svg);
    background-size: cover;
  }
  .c-review-module--invert .c-review-module__answers > input[type=checkbox]:hover + label {
    background: #ebf1f7;
  }
  .c-review-module--invert .c-review-module__answers > input[type=checkbox]:checked + label {
    background: #158443;
    border-color: #158443;
    color: #ffffff;
  }
  .c-review-module--invert .c-review-module__answers label {
    background: #F2F6FA;
    border: 2px solid #D6E0EF;
    color: #333333;
  }
}
@media screen {
  .c-review-module__main-header {
    margin-top: 12px;
    margin-bottom: 24px;
  }
  .c-review-module__main-header > div {
    position: relative;
  }
}
@media screen and (max-width: 600px) {
  .c-review-module__main-header > div {
    display: block;
  }
}
@media screen and (max-width: 600px) {
  .c-review-module__main-header p {
    position: absolute;
    top: 30px;
    right: 0;
  }
}
@media screen {
  .c-review-module__main-header .c-review-module__main-header-stars {
    display: flex;
    position: relative;
    top: -4px;
    margin: 0 5px;
  }
}
@media screen and (max-width: 600px) {
  .c-review-module__main-header .c-review-module__main-header-stars {
    position: absolute;
    top: 6px;
    right: 0;
    margin: 0;
  }
}
@media screen {
  .c-review-module__main-header .c-review-module__main-header-stars .l-button__svg-empty-star {
    opacity: 1 !important;
  }
}
@media screen {
  .c-review-module__main-header-controls {
    position: relative;
    top: 1px;
    margin-top: 15px;
    margin-left: -5px;
  }
  .c-review-module__main-header-controls span {
    font-size: 0.9375rem; /* 15/16 */
    color: #A7ADB4;
    margin-left: 9px;
  }
  .c-review-module__main-header-controls a {
    color: #ffffff;
    text-decoration: underline;
  }
}
@media screen {
  .c-review-module__score {
    line-height: 0.8;
    margin-right: 5px;
    letter-spacing: -2px;
    font-family: "Bitter", serif;
    font-weight: bold;
  }
}
@media screen {
  .c-review-module__illustration {
    width: 250px;
    height: 113px;
    background-image: url(/assets/artwork/illustration-ratings-dark-cc5317ff51fd0e2e97cacd02ae7952386f9716f375f4cbd8cc0add529554e1d9.svg);
    background-size: cover;
    margin: 0 auto;
  }
}
@media screen and (max-width: 768px) {
  .c-review-module__illustration {
    width: 200px;
    height: 91px;
  }
}
@media screen {
  .c-review-module__errors span {
    color: #CF3B2B;
    text-transform: uppercase;
    font-size: 0.6875rem; /* 11/16 */
    letter-spacing: 0.5px;
    font-weight: 700;
  }
}
@media screen {
  .c-review-module__errors--top {
    position: absolute;
    top: -24px;
    left: 0;
  }
}
@media screen {
  .c-review-module__errors--inline {
    position: relative;
    top: 50%;
    left: 20px;
  }
}
@media screen {
  .c-review-module__errors--bottom {
    position: absolute;
    bottom: -74px;
    right: 0;
  }
}
@media screen {
  .c-rating-count {
    position: relative;
  }
}
@media screen and (max-width: 768px) {
  .c-rating-count {
    padding-bottom: 24px;
  }
}
@media screen {
  .c-rating-count .c-rating-count__score {
    margin-right: 8px;
    position: relative;
    top: 1px;
  }
}
@media screen {
  .c-rating-count span {
    color: #333333;
  }
}
@media screen {
  .c-rating-count a {
    color: #333333;
  }
}
@media screen and (max-width: 768px) {
  .c-rating-count a {
    position: absolute;
    bottom: 0;
    left: 0;
    margin: 0;
  }
}
@media screen {
  .c-add-rating > div {
    grid-template-columns: 1fr auto 1fr;
  }
  .c-add-rating .c-rate__star {
    display: inline-flex;
    justify-content: center;
    background: #A7ADB4;
    border: 2px solid #A7ADB4;
    margin: 0 3px;
  }
  .c-add-rating .c-rate__star svg {
    fill: #ffffff;
  }
  .c-add-rating .c-rate__star--green {
    background: #158443;
    border: 2px solid #158443;
  }
  .c-add-rating .c-rate__star--green svg {
    fill: #ffffff;
  }
}
@media screen {
  .c-user-review {
    padding: 24px 21px;
    background-color: #3B4048;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.075);
    border-radius: 0.5625rem;
    margin-top: 18px;
  }
  .c-user-review .c-user-review__top {
    display: flex;
    justify-content: space-between;
  }
  .c-user-review .c-user-review__top .c-user-review__username {
    font-size: 1rem;
    margin-top: -2px;
  }
  .c-user-review .c-user-review__top .c-user-review__date {
    font-size: 0.9375rem; /* 15/16 */
    color: #A7ADB4;
    margin-top: -2px;
  }
  .c-user-review .c-user-review__top .c-user-review__profile img {
    width: 40px;
    height: 40px;
    margin-right: 12px;
    border-radius: 6px;
  }
  .c-user-review .c-user-review__top .c-user-review__account {
    display: flex;
  }
  .c-user-review .c-user-review__bottom .c-user-review__title {
    width: 250px;
    text-overflow: ellipsis;
    overflow-x: hidden;
    white-space: nowrap;
    letter-spacing: -0.5px;
  }
  .c-user-review .c-user-review__bottom .l-button__svg-empty-star {
    opacity: 0.5;
  }
}
@media screen {
  #current-user-rating .c-user-review {
    margin-bottom: 36px !important;
  }
}
@media screen {
  .c-review-module__questions {
    animation: a-slight-fade-in-up 0.25s;
    position: relative;
  }
}
@media screen {
  .c-review-module__answers {
    position: relative;
  }
  .c-review-module__answers input[type=checkbox] {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
  }
  .c-review-module__answers > input[type=checkbox]:hover + label {
    background: #363b42;
  }
  .c-review-module__answers > input[type=checkbox]:checked + label {
    background: #158443;
    border-color: #00FF6A;
    color: #ffffff;
  }
  .c-review-module__answers label {
    padding: 7px 12px;
    border-radius: 0.5625rem;
    background: #3B4048;
    border: 2px solid #3B4048;
    font-weight: 600;
    font-size: 0.9375rem; /* 15/16 */
    white-space: nowrap;
    display: inline-flex;
    margin: 0 10px 10px 0;
  }
}
@media screen {
  .c-modal--ratings {
    z-index: 99999999999;
  }
  .c-modal--ratings .c-modal__title {
    color: #333333;
  }
}
@media screen and (max-width: 768px) {
  .c-modal--ratings .c-modal__title {
    font-size: 1.5rem !important; /* 24/16 */
  }
}
@media screen {
  .c-modal--ratings .c-modal-wrapper {
    max-width: 540px;
    padding: 36px 24px 40px 24px;
  }
  .c-modal--ratings .c-modal-wrapper > div {
    width: 100%;
    text-align: center;
  }
  .c-modal--ratings .c-modal-wrapper > div .c-modal__complete-illustration {
    padding-top: 0;
  }
  .c-modal--ratings .c-modal-wrapper > div .c-modal__complete-illustration img {
    max-width: 100%;
    width: 250px;
    margin: 20px;
  }
}
@media screen and (max-width: 768px) {
  .c-modal--ratings .c-modal-wrapper > div .c-modal__complete-illustration img {
    width: 200px;
    height: 91px;
  }
}
@media screen {
  .c-notebook {
    height: 100%;
    width: 590px;
    background: #FAFAFA;
    border: 1px solid #DFE7F0;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
    padding: 21px 24px 24px;
    position: fixed;
    top: 72px;
    right: 0;
    z-index: 9999999;
    border-radius: 0.5625rem 0 0 0;
    overflow-y: scroll;
  }
}
@media screen and (max-width: 992px) {
  .c-notebook {
    width: 100%;
    top: 0;
    border-radius: 0;
    box-shadow: none;
  }
}
@media screen {
  .c-notebook .c-notebook__title-actions {
    position: absolute;
    cursor: pointer;
    top: 24px;
  }
}
@media screen {
  .c-notebook .c-notebook__erase {
    right: 24px;
  }
}
@media screen and (max-width: 992px) {
  .c-notebook .c-notebook__erase {
    right: 60px;
  }
}
@media screen {
  .c-notebook .c-notebook__close {
    width: 16px;
    height: 24px;
    right: 24px;
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .c-notebook .c-notebook__close {
    display: block;
  }
}
@media screen {
  .c-notebook .c-notebook__close svg {
    width: 16px;
    transform: rotate(180deg);
  }
}
@media screen {
  .c-notebook h3 {
    padding-right: 100px;
    line-height: 1.125;
  }
}
@media screen {
  .c-notebook .c-notebook__artwork {
    display: block;
    max-width: 240px;
    margin: 60px auto 9px;
  }
}
@media screen {
  .c-notebook .c-notebook__demo {
    position: relative;
    margin-top: 90px;
  }
  .c-notebook .c-notebook__demo:before {
    content: "";
    position: absolute;
    top: -90px;
    left: 0;
    width: 100%;
    height: calc(100% + 90px);
    background: transparent;
    z-index: 99999999;
  }
  .c-notebook .c-notebook__demo p {
    font-family: "IBM Plex Serif", serif;
    font-size: 1rem;
  }
  .c-notebook .c-notebook__demo p mark {
    background: #F4C3C3;
    color: #333333;
  }
  .c-notebook .c-notebook__demo .o-fragment--tooltip {
    top: -64px;
  }
}
@media screen {
  .c-notebook .c-notebook__entry {
    padding-left: 18px;
    padding-bottom: 15px;
    margin-top: 15px;
    position: relative;
    border-bottom: 1px solid #DBDDE0;
  }
  .c-notebook .c-notebook__entry:before {
    content: "";
    width: 3px;
    height: calc(100% - 15px);
    position: absolute;
    left: 0;
    top: 0;
    background: #FFE242;
    border-radius: 100px;
  }
  .c-notebook .c-notebook__entry:last-child {
    border-bottom: 0;
  }
  .c-notebook .c-notebook__entry a {
    color: #333333;
    text-decoration: none;
  }
  .c-notebook .c-notebook__entry h4 {
    font-size: 1.125rem; /* 18/16 */
  }
  .c-notebook .c-notebook__entry .c-notebook__actions {
    display: flex;
    align-content: center;
    align-items: baseline;
    justify-content: space-between;
  }
  .c-notebook .c-notebook__entry .c-notebook__action {
    font-size: 14px;
    font-weight: 600;
    color: #6E7687;
    text-decoration: underline;
    cursor: pointer;
  }
  .c-notebook .c-notebook__entry .c-notebook__action--secondary {
    text-decoration: none;
  }
  .c-notebook .c-notebook__entry .c-notebook__entry-text {
    font-size: 0.9375rem; /* 15/16 */
    margin-top: 8px;
  }
  .c-notebook .c-notebook__entry .c-notebook__entry-text mark {
    color: #333333;
    background-color: transparent;
  }
  .c-notebook .c-notebook__entry .c-notebook__entry-note {
    font-size: 14px;
    font-style: italic;
    margin-top: 9px;
  }
  .c-notebook .c-notebook__entry .c-notebook__entry-note .o-textarea {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 0.875rem; /* 14/16 */
  }
  .c-notebook .c-notebook__entry .c-notebook__entry-note span {
    color: #6E7687;
  }
  .c-notebook .c-notebook__entry.c-notebook__entry--yellow:before {
    background: #FFE242;
  }
  .c-notebook .c-notebook__entry.c-notebook__entry--orange:before {
    background: #FBBC5D;
  }
  .c-notebook .c-notebook__entry.c-notebook__entry--red:before {
    background: #E58A8A;
  }
  .c-notebook .c-notebook__entry.c-notebook__entry--purple:before {
    background: #A0AEF2;
  }
  .c-notebook .c-notebook__entry.c-notebook__entry--blue:before {
    background: #85DDE9;
  }
  .c-notebook .c-notebook__entry.c-notebook__entry--green:before {
    background: #90DE9C;
  }
}
@media screen {
  .o-fragment--id {
    display: block;
    position: relative;
    top: -48px;
    visibility: hidden;
  }
}
@media screen {
  article.c-book-chapter div blockquote {
    padding-top: 1px;
  }
}
@media screen {
  .o-fragment {
    position: relative;
  }
  .o-fragment mark {
    color: #333333;
    background-color: #FFEA75;
  }
  .o-fragment .o-fragment--annotation {
    cursor: pointer;
  }
  .o-fragment .o-fragment--annotation-note {
    border-bottom: 3px solid #EBC700;
  }
  .o-fragment .o-fragment--tooltip-with-note {
    background: #F5F8FB;
    border: 2px solid #D6E0EF;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.875rem; /* 14/16 */
    font-weight: 600;
    border-radius: 0.5625rem;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.2);
    padding: 21px;
    position: absolute;
    transform: translateX(-50%);
    color: #ffffff;
    z-index: 99999;
    width: auto;
    white-space: nowrap;
    text-transform: none !important;
    letter-spacing: 0 !important;
    user-select: none;
  }
  .o-fragment .o-fragment--tooltip-with-note span {
    cursor: pointer;
  }
  .o-fragment .o-fragment--tooltip-with-note textarea {
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    color: #333333;
    width: 100%;
    min-width: 270px;
    min-height: 100px;
    font-size: 0.9375rem; /* 15/16 */
    resize: none;
  }
  .o-fragment .o-fragment--tooltip-with-note textarea:focus {
    box-shadow: none;
    outline: 0;
  }
  .o-fragment .o-fragment--tooltip-with-note textarea::placeholder {
    color: #6E7687 !important;
  }
  .o-fragment .o-fragment--tooltip-with-note:after {
    display: none;
  }
  .o-fragment .o-fragment--tooltip-with-note .o-fragment__actions {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
  }
  .o-fragment .o-fragment--tooltip-with-note .o-fragment__action {
    color: #6E7687;
  }
}
@media screen {
  mark.o-fragment--highlighter-yellow {
    background: #FFEA75;
  }
  mark.o-fragment--highlighter-yellow.o-fragment--annotation-note {
    border-bottom: 3px solid #EBC700;
  }
}
@media screen {
  mark.o-fragment--highlighter-orange {
    background: #FBCF8E;
  }
  mark.o-fragment--highlighter-orange.o-fragment--annotation-note {
    border-bottom: 3px solid #F99A0C;
  }
}
@media screen {
  mark.o-fragment--highlighter-red {
    background: #F4C3C3;
  }
  mark.o-fragment--highlighter-red.o-fragment--annotation-note {
    border-bottom: 3px solid #E58A8A;
  }
}
@media screen {
  mark.o-fragment--highlighter-purple {
    background: #CECEF8;
  }
  mark.o-fragment--highlighter-purple.o-fragment--annotation-note {
    border-bottom: 3px solid #A0AEF2;
  }
}
@media screen {
  mark.o-fragment--highlighter-blue {
    background: #B4E3E9;
  }
  mark.o-fragment--highlighter-blue.o-fragment--annotation-note {
    border-bottom: 3px solid #5BD1E1;
  }
}
@media screen {
  mark.o-fragment--highlighter-green {
    background: #C3F0CA;
  }
  mark.o-fragment--highlighter-green.o-fragment--annotation-note {
    border-bottom: 3px solid #90DE9C;
  }
}
@media screen {
  .c-reading-experience-selector {
    width: 320px;
    background: #FAFAFA;
    border: 1px solid #DFE7F0;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
    padding: 21px 24px 24px;
    position: fixed;
    top: 72px;
    right: 20px;
    z-index: 9999999;
    border-radius: 0.5625rem;
  }
}
@media screen and (max-width: 992px) {
  .c-reading-experience-selector {
    position: fixed;
    top: auto;
    right: auto;
    left: 0;
    bottom: 60px;
    border-radius: 0;
    width: 100%;
    padding-left: 240px;
    padding-right: 240px;
    -webkit-overflow-scrolling: touch;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    scrollbar-width: none;
    box-shadow: none;
    border-bottom: 0;
  }
  .c-reading-experience-selector::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  .c-reading-experience-selector {
    padding-left: 24px;
    padding-right: 24px;
  }
}
@media screen {
  .c-reading-experience-selector .o-alert__close {
    display: none;
    position: absolute;
    top: 15px;
    right: 15px;
    width: 18px;
    height: 18px;
  }
  .c-reading-experience-selector .o-alert__close svg {
    position: absolute;
    width: 18px !important;
    height: 18px !important;
    margin: -9px 0 0 -9px;
  }
}
@media screen and (max-width: 992px) {
  .c-reading-experience-selector .o-alert__close {
    display: block;
  }
}
@media screen {
  .c-reading-experience-selector h4 {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 600;
    font-size: 0.9375rem; /* 15/16 */
    letter-spacing: 0;
  }
}
@media screen {
  .c-reading-experience-selector > div {
    margin-top: 20px;
  }
  .c-reading-experience-selector > div:first-child {
    margin-top: 0;
  }
}
@media screen {
  .c-reading-experience-selector .l-width-14 {
    width: 14px !important;
  }
}
@media screen {
  .c-reading-experience-selector .l-width-21 {
    width: 21px !important;
  }
}
@media screen {
  .c-reading-experience-selector .o-dropdown-menu__icon--night-mode {
    display: none;
  }
}
@media screen {
  .c-reading-experience-selector .o-dropdown-menu__icon--night-mode + a {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 600;
    font-size: 0.9375rem; /* 15/16 */
    letter-spacing: 0;
  }
  .c-reading-experience-selector .o-dropdown-menu__icon--night-mode + a label {
    right: 24px;
  }
}
@media screen and (max-width: 992px) {
  .c-reading-experience-selector .o-dropdown-menu__icon--night-mode + a label {
    right: auto;
    margin-left: 9px;
  }
}
@media screen {
  .c-reading-experience-selector .c-reading-experience-selector__checkbox-wrapper > span:first-child {
    margin-left: 0 !important;
  }
}
@media screen {
  .c-reading-experience-selector .c-reading-experience-selector__range-wrapper {
    display: flex;
    align-content: center;
  }
  .c-reading-experience-selector .c-reading-experience-selector__range-wrapper > span {
    min-width: 27px;
    height: 27px;
    display: flex;
    align-content: center;
    justify-content: center;
  }
  .c-reading-experience-selector .c-reading-experience-selector__range-wrapper > span svg {
    width: 27px;
    height: 27px;
  }
}
@media screen {
  .c-reading-experience-selector .c-reading-experience-selector__range {
    -webkit-appearance: none;
    background: transparent;
    width: 100%;
    margin: 0 9px;
  }
}
@media screen {
  .c-reading-experience-selector .c-reading-experience-selector__radio {
    -webkit-appearance: radio;
  }
  .c-reading-experience-selector .c-reading-experience-selector__radio:checked + span {
    position: absolute;
    background: none;
    border: 2px solid #158443;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    border-radius: 0.5625rem;
    left: -2px;
    top: -2px;
  }
}
@media screen {
  .c-reading-experience-selector .c-reading-experience-selector__checkbox {
    width: 27px;
    height: 27px;
    border: 2px solid #73859F;
    border-radius: 0.5625rem;
    display: flex;
    align-content: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
  }
  .c-reading-experience-selector .c-reading-experience-selector__checkbox input {
    opacity: 0;
    cursor: pointer;
  }
}
@media screen {
  .c-reading-experience-selector .c-reading-experience-selector__checkbox--large {
    height: 50px;
    border: 2px solid #DBDDE0;
    border-radius: 0.5625rem;
    background: #ffffff;
    cursor: pointer;
    position: relative;
    z-index: 0;
  }
  .c-reading-experience-selector .c-reading-experience-selector__checkbox--large input {
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
  }
  .c-reading-experience-selector .c-reading-experience-selector__checkbox--large label {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -35px;
    margin-top: -15px;
    color: #333333;
    white-space: nowrap;
    width: 70px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 0.9375rem; /* 15/16 */
    font-weight: 600;
    z-index: -1;
  }
}
@media screen {
  .c-reading-experience-selector__range::-webkit-slider-runnable-track {
    background: rgba(167, 173, 180, 0.5);
    height: 2px;
  }
}
@media screen {
  .c-reading-experience-selector__range:focus::-webkit-slider-runnable-track {
    background: rgba(167, 173, 180, 0.5);
    height: 2px;
    box-shadow: none;
    outline: none;
    border: none;
  }
}
@media screen {
  .c-reading-experience-selector__range::-moz-range-track {
    background: rgba(167, 173, 180, 0.5);
    height: 2px;
  }
}
@media screen {
  .c-reading-experience-selector__range::-ms-track {
    background: rgba(167, 173, 180, 0.5);
    height: 2px;
  }
}
@media screen {
  .c-reading-experience-selector__range::-webkit-slider-thumb {
    -webkit-appearance: none;
    height: 24px;
    width: 24px;
    background: #ffffff;
    border: 2px solid #959DA5;
    cursor: pointer;
    border-radius: 100%;
    margin-top: -11px;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
  }
}
@media screen {
  .c-reading-experience-selector__range::-moz-range-thumb {
    height: 24px;
    width: 24px;
    background: #ffffff;
    cursor: pointer;
    border: 2px solid #959DA5;
    border-radius: 100%;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
  }
}
@media screen {
  .c-reading-experience-selector__range::-ms-thumb {
    height: 24px;
    width: 24px;
    background: #ffffff;
    cursor: pointer;
    border: 2px solid #959DA5;
    border-radius: 100%;
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
  }
}
@media screen {
  .c-bookshelf-book a {
    text-decoration: none;
    color: #333333;
  }
  .c-bookshelf-book figure img {
    max-width: 198px;
    width: 100%;
    border-radius: 0.9375rem; /* 15/16 */
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.25);
  }
  .c-bookshelf-book .c-bookshelf-book__title {
    font-size: 1.5rem; /* 24/16 */
    line-height: 1.125;
    margin-top: 18px;
  }
}
@media screen and (max-width: 768px) {
  .c-bookshelf-book .c-bookshelf-book__title {
    font-size: 1.3125rem; /* 21/16 */
  }
}
@media screen {
  .c-bookshelf-book .c-bookshelf-book__price {
    display: block;
    font-family: "Bitter", serif;
    font-weight: 700;
    font-size: 1.0625rem; /* 17/16 */
    line-height: 1.125;
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  .c-bookshelf-book .c-bookshelf-book__price {
    font-size: 1rem;
  }
}
@media screen {
  .c-bookshelf-book .c-bookshelf-book__description {
    font-size: 0.9375em; /* 15/16 */
    margin-top: 10px;
  }
}
@media screen {
  .c-drawer__overlay {
    background-color: #333333;
    opacity: 0.7;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10002;
  }
}
@media screen {
  .c-drawer {
    position: fixed;
    top: 0;
    width: 320px;
    height: 100%;
    background-color: #ffffff;
    padding: 102px 24px 0;
    z-index: 10003;
  }
  .c-drawer .o-button-close {
    position: absolute;
    top: 90px;
    right: 18px;
  }
  .c-drawer .o-button-close svg {
    width: 12px;
    height: 12px;
    transform: rotate(0);
  }
}
@media screen {
  .c-drawer--right {
    right: 0;
  }
}
@media screen and (max-width: 600px) {
  .u-hide-mobile {
    display: none;
  }
}
@media screen and (max-width: 600px) {
  .u-hide-mobile--force {
    display: none !important;
  }
}
@media screen and (max-width: 768px) {
  .u-hide-mobile-large {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .u-hide-mobile-large--force {
    display: none !important;
  }
}
@media screen and (max-width: 992px) {
  .u-hide-tablet {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .u-hide-tablet--force {
    display: none !important;
  }
}
@media screen and (max-width: 1080px) {
  .u-hide-1080 {
    display: none;
  }
}
@media screen {
  .u-show-mobile {
    display: none;
  }
}
@media screen and (max-width: 600px) {
  .u-show-mobile {
    display: block;
  }
}
@media screen {
  .u-show-mobile-large {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .u-show-mobile-large {
    display: block;
  }
}
@media screen {
  .u-show-tablet-flex--inline {
    display: none;
  }
}
@media screen and (max-width: 992px) {
  .u-show-tablet-flex--inline {
    display: inline-flex;
  }
}
@media screen {
  .u-show-tablet-flex--inline-force {
    display: none !important;
  }
}
@media screen and (max-width: 992px) {
  .u-show-tablet-flex--inline-force {
    display: inline-flex !important;
  }
}
@media screen {
  .u-show-1080-flex--inline {
    display: none;
  }
}
@media screen and (max-width: 1080px) {
  .u-show-1080-flex--inline {
    display: inline-flex;
  }
}
@media screen {
  .u-show-mobile--inline {
    display: none;
  }
}
@media screen and (max-width: 600px) {
  .u-show-mobile--inline {
    display: inline;
  }
}
@media screen {
  .u-show-mobile-flex {
    display: none;
  }
}
@media screen and (max-width: 600px) {
  .u-show-mobile-flex {
    display: flex;
  }
}
@media screen {
  .u-show-mobile-large-flex {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .u-show-mobile-large-flex {
    display: flex;
  }
}
@media screen {
  .u-show-tablet-flex {
    display: none !important;
  }
}
@media screen and (max-width: 992px) {
  .u-show-tablet-flex {
    display: flex !important;
  }
}
@media screen {
  .u-toggle-dropdown:hover .o-dropdown-menu, .u-toggle-dropdown:active .o-dropdown-menu, .u-toggle-dropdown:focus .o-dropdown-menu {
    display: block;
  }
}
@media screen {
  .u-show--flex {
    display: flex;
  }
}
@media screen {
  .u-show {
    display: block !important;
  }
}
@media screen {
  .u-hide {
    display: none;
  }
}
@media screen {
  button:disabled .u-hide-disabled {
    display: none;
  }
}
@media screen {
  button:enabled .u-show-disabled {
    display: none;
  }
}
@media screen {
  .u-invisible {
    visibility: hidden;
  }
}
@media screen {
  .l-markdown-description p {
    margin-top: 8px;
  }
  .l-markdown-description ul {
    margin-top: 8px;
    margin-left: 15px;
  }
  .l-markdown-description li {
    list-style-type: disc;
  }
}
@media screen {
  .c-banner-draper-sticky .o-alert__close {
    width: 20px;
  }
}
@media screen and (max-width: 900px) {
  .l-community-care-link {
    display: none;
  }
}
@media screen and (max-width: 600px) {
  .l-community-care-link {
    display: block;
  }
}
@media screen {
  .l-text-size-60pc {
    font-size: 60%;
  }
}
@media screen {
  .l-text-size-80pc {
    font-size: 80%;
  }
}
@media screen {
  .l-text-size-100pc {
    font-size: 100%;
  }
}
@media screen {
  .l-text-size-120pc {
    font-size: 120%;
  }
}
@media screen {
  .l-text-size-140pc {
    font-size: 140%;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-tutorial-item .c-tutorial-item__completable {
    color: #ffffff;
  }
}
@media screen {
  .c-tutorial-item .c-tutorial-item__completable {
    display: inline;
  }
  .c-tutorial-item .c-tutorial-item__clearable {
    display: none;
  }
}
@media screen {
  .c-tutorial-item--complete .c-tutorial-item__completable {
    display: none !important;
  }
  .c-tutorial-item--complete .c-tutorial-item__clearable {
    display: inline !important;
  }
}
@media screen {
  .turbo-progress-bar {
    z-index: 1000000;
    height: 4px;
    background-color: #158443;
  }
}
@media screen {
  .l-box-shadow {
    box-shadow: 4px 4px 30px 0 rgba(51, 51, 51, 0.075);
  }
}
@media screen {
  .l-padding-right-12 {
    padding-right: 12px;
  }
}
@media screen {
  .l-padding-right-20 {
    padding-right: 20px;
  }
}
@media screen {
  .l-margin-right-20 {
    margin-right: 20px;
  }
}
@media screen {
  .l-line-height-135 {
    line-height: 1.35;
  }
}
@media screen {
  .l-flex-direction-column {
    display: flex;
    flex-direction: column;
  }
}
@media screen {
  .l-display {
    display: inline-block;
    width: 120px;
  }
}
@media screen {
  .l-display-large {
    display: inline-block;
    width: 150px;
  }
}
@media screen {
  .l-display-extra-large {
    display: inline-block;
    width: 200px;
  }
}
@media screen {
  .o-button-color {
    background-color: #e9ebec;
    padding: 10px;
    border-radius: 8px;
    font-size: 0.875rem;
  }
}
@media screen {
  .l-link:link {
    text-decoration: none;
  }
}
@media screen {
  .l-tutorial--component-p p {
    font-size: 0.875rem;
  }
}
@media screen {
  .l-padding-top-20 {
    padding-top: 20px;
  }
}
@media screen {
  .l-margin-left-40 {
    margin-left: 40px;
  }
}
@media screen {
  .l-margin-left-99 {
    margin-left: 99px;
  }
}
@media screen {
  .c-tutorial--all-padding .c-tutorial-item > a, .c-tutorial--all-padding .c-tutorial-item > div {
    padding: 21px;
    border-radius: 0.5625rem;
  }
}
@media screen {
  .l-community-image {
    display: block;
    height: 250px;
  }
}
@media screen {
  .l-community-image--right {
    background-image: url(/assets/photos/community-connect-right-fe58d024caa00d2b9c02d522c8146885f5fa75cf97062c09ebc10fbe3efd972a.png);
    background-repeat: no-repeat;
  }
}
@media screen {
  .bg-transcript--highlighted {
    background: #435E3E;
  }
}
@media screen {
  .bg-transcript--highlighted-typography {
    font-style: normal;
    font-weight: 700;
    font-size: 0.9375rem;
    line-height: 22px;
    color: #DBDDE0;
  }
}
@media screen {
  .bg-transcript--highlighted--bubble {
    background: #158443;
  }
}
@media screen {
  .c-written-tutorial__content > figure svg {
    max-width: 688px;
    width: 100%;
    height: auto;
    margin-top: 20px;
  }
  .c-written-tutorial__content figure svg {
    max-width: 688px;
    width: 100%;
    height: auto;
    margin-top: 20px;
  }
}
@media screen {
  #Arrow [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  [id^=Arrow_] [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  #ArrowGrey [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  [id^=ArrowGrey_] [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  #ArrowGreen [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  [id^=ArrowGreen_] [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  #ArrowTurquoise [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  [id^=ArrowTurquoise_] [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  #ArrowLightBlue [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  [id^=ArrowLightBlue_] [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  #ArrowDarkBlue [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  [id^=ArrowDarkBlue_] [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  #ArrowPurple [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  [id^=ArrowPurple_] [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  #ArrowPink [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  [id^=ArrowPink_] [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  #ArrowRed [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  [id^=ArrowRed_] [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  #ArrowYellow [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  [id^=ArrowYellow_] [id^=Tip] {
    fill: #ffffff;
  }
}
@media screen {
  .l-prefers-color-scheme--dark .c-written-tutorial__content {
    /* ==========================================================================
    X. Labels
    ========================================================================== */
    /* ==========================================================================
    X. Shapes
    ========================================================================== */
    /* ==========================================================================
    X. Shapes w/ Inner
    ========================================================================== */
    /* ==========================================================================
    X. Shapes w/ Patterns
    ========================================================================== */
    /* ==========================================================================
    X. Arrows
    ========================================================================== */
    /* ==========================================================================
    X. Arrow (Grey)
    ========================================================================== */
    /* ==========================================================================
    X. Arrow (Green)
    ========================================================================== */
    /* ==========================================================================
    X. Arrow (Turquoise)
    ========================================================================== */
    /* ==========================================================================
    X. Arrow (LightBlue)
    ========================================================================== */
    /* ==========================================================================
    X. Arrow (DarkBlue)
    ========================================================================== */
    /* ==========================================================================
    X. Arrow (Purple)
    ========================================================================== */
    /* ==========================================================================
    X. Arrow (Pink)
    ========================================================================== */
    /* ==========================================================================
    X. Arrow (Red)
    ========================================================================== */
    /* ==========================================================================
    X. Arrow (Yellow)
    ========================================================================== */
    /* ==========================================================================
    X. Lines
    ========================================================================== */
    /* ==========================================================================
    X. Shadows
    ========================================================================== */
    /* ==========================================================================
    X. Color Conversion (Grey)
    ========================================================================== */
    /* ==========================================================================
    X. Color Conversion (Green)
    ========================================================================== */
    /* ==========================================================================
    X. Color Conversion (Turquoise)
    ========================================================================== */
    /* ==========================================================================
    X. Color Conversion (Light Blue)
    ========================================================================== */
    /* ==========================================================================
    X. Color Conversion (Dark Blue)
    ========================================================================== */
    /* ==========================================================================
    X. Color Conversion (Purple)
    ========================================================================== */
    /* ==========================================================================
    X. Color Conversion (Pink)
    ========================================================================== */
    /* ==========================================================================
    X. Color Conversion (Red)
    ========================================================================== */
    /* ==========================================================================
    X. Color Conversion (Yellow)
    ========================================================================== */
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text {
    fill: white;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text#TextGrey {
    fill: #D8DBE1 !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text[id^=TextGrey_] {
    fill: #D8DBE1 !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text#TextGreen {
    fill: #D6E18D !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text[id^=TextGreen_] {
    fill: #D6E18D !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text#TextTurquoise {
    fill: #97CFC1 !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text[id^=TextTurquoise_] {
    fill: #97CFC1 !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text#TextLightBlue {
    fill: #A6D9E2 !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text[id^=TextLightBlue_] {
    fill: #A6D9E2 !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text#TextDarkBlue {
    fill: #B9C3E4 !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text[id^=TextDarkBlue_] {
    fill: #B9C3E4 !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text#TextPurple {
    fill: #D3BDDB !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text[id^=TextPurple_] {
    fill: #D3BDDB !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text#TextPink {
    fill: #F2BCD7 !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text[id^=TextPink_] {
    fill: #F2BCD7 !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text#TextRed {
    fill: #F7B39C !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text[id^=TextRed_] {
    fill: #F7B39C !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text#TextYellow {
    fill: #FFD46F !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content text[id^=TextYellow_] {
    fill: #FFD46F !important;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #Shape rect:nth-of-type(1) {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #Shape rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=Shape_] rect:nth-of-type(1) {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=Shape_] rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInner > rect:nth-of-type(1) {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInner > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInner_] > rect:nth-of-type(1) {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInner_] > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerFore > rect:nth-of-type(1) {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerFore > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerFore_] > rect:nth-of-type(1) {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerFore_] > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerClear > rect {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerClear_] > rect {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerPattern #ShapeInnerBack > rect:nth-of-type(1) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerPattern #ShapeInnerFore > rect:nth-of-type(1) {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerPattern #ShapeInnerFore > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerPattern_] [id^=ShapeInnerBack_] > rect:nth-of-type(1) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerPattern_] [id^=ShapeInnerFore_] > rect:nth-of-type(1) {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerPattern_] [id^=ShapeInnerFore_] > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapePattern path {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapePattern_] path {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapePattern rect:nth-of-type(1) {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapePattern_] rect:nth-of-type(1) {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapePattern rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapePattern_] rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerPattern #ShapeBackground {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerPattern_] [id^=ShapeBackground_] {
    fill: #333333;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #Arrow circle {
    fill: #333333;
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=Arrow_] circle {
    fill: #333333;
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #Arrow [id^=Line] {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=Arrow_] [id^=Line] {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #Arrow [id^=Tip] {
    fill: #333333;
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=Arrow_] [id^=Tip] {
    fill: #333333;
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowGrey circle {
    fill: #333333;
    stroke: #D8DBE1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowGrey_] circle {
    fill: #333333;
    stroke: #D8DBE1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowGrey [id^=Line] {
    stroke: #D8DBE1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowGrey_] [id^=Line] {
    stroke: #D8DBE1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowGrey [id^=Tip] {
    fill: #333333;
    stroke: #D8DBE1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowGrey_] [id^=Tip] {
    fill: #333333;
    stroke: #D8DBE1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowGreen circle {
    fill: #333333;
    stroke: #D6E18D;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowGreen_] circle {
    fill: #333333;
    stroke: #D6E18D;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowGreen [id^=Line] {
    stroke: #D6E18D;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowGreen_] [id^=Line] {
    stroke: #D6E18D;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowGreen [id^=Tip] {
    fill: #333333;
    stroke: #D6E18D;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowGreen_] [id^=Tip] {
    fill: #333333;
    stroke: #D6E18D;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowTurquoise circle {
    fill: #333333;
    stroke: #97CFC1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowTurquoise_] circle {
    fill: #333333;
    stroke: #97CFC1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowTurquoise [id^=Line] {
    stroke: #97CFC1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowTurquoise_] [id^=Line] {
    stroke: #97CFC1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowTurquoise [id^=Tip] {
    fill: #333333;
    stroke: #97CFC1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowTurquoise_] [id^=Tip] {
    fill: #333333;
    stroke: #97CFC1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowLightBlue circle {
    fill: #333333;
    stroke: #A6D9E2;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowLightBlue_] circle {
    fill: #333333;
    stroke: #A6D9E2;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowLightBlue [id^=Line] {
    stroke: #A6D9E2;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowLightBlue_] [id^=Line] {
    stroke: #A6D9E2;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowLightBlue [id^=Tip] {
    fill: #333333;
    stroke: #A6D9E2;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowLightBlue_] [id^=Tip] {
    fill: #333333;
    stroke: #A6D9E2;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowDarkBlue circle {
    fill: #333333;
    stroke: #B9C3E4;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowDarkBlue_] circle {
    fill: #333333;
    stroke: #B9C3E4;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowDarkBlue [id^=Line] {
    stroke: #B9C3E4;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowDarkBlue_] [id^=Line] {
    stroke: #B9C3E4;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowDarkBlue [id^=Tip] {
    fill: #333333;
    stroke: #B9C3E4;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowDarkBlue_] [id^=Tip] {
    fill: #333333;
    stroke: #B9C3E4;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowPurple circle {
    fill: #333333;
    stroke: #D3BDDB;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowPurple_] circle {
    fill: #333333;
    stroke: #D3BDDB;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowPurple [id^=Line] {
    stroke: #D3BDDB;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowPurple_] [id^=Line] {
    stroke: #D3BDDB;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowPurple [id^=Tip] {
    fill: #333333;
    stroke: #D3BDDB;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowPurple_] [id^=Tip] {
    fill: #333333;
    stroke: #D3BDDB;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowPink circle {
    fill: #333333;
    stroke: #F2BCD7;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowPink_] circle {
    fill: #333333;
    stroke: #F2BCD7;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowPink [id^=Line] {
    stroke: #F2BCD7;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowPink_] [id^=Line] {
    stroke: #F2BCD7;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowPink [id^=Tip] {
    fill: #333333;
    stroke: #F2BCD7;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowPink_] [id^=Tip] {
    fill: #333333;
    stroke: #F2BCD7;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowRed circle {
    fill: #333333;
    stroke: #F7B39C;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowRed_] circle {
    fill: #333333;
    stroke: #F7B39C;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowRed [id^=Line] {
    stroke: #F7B39C;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowRed_] [id^=Line] {
    stroke: #F7B39C;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowRed [id^=Tip] {
    fill: #333333;
    stroke: #F7B39C;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowRed_] [id^=Tip] {
    fill: #333333;
    stroke: #F7B39C;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowYellow circle {
    fill: #333333;
    stroke: #FFD46F;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowYellow_] circle {
    fill: #333333;
    stroke: #FFD46F;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowYellow [id^=Line] {
    stroke: #FFD46F;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowYellow_] [id^=Line] {
    stroke: #FFD46F;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ArrowYellow [id^=Tip] {
    fill: #333333;
    stroke: #FFD46F;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ArrowYellow_] [id^=Tip] {
    fill: #333333;
    stroke: #FFD46F;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeLine {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeLine_] {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeLineGrey {
    stroke: #D8DBE1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeLineGrey_] {
    stroke: #D8DBE1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeLineGreen {
    stroke: #D6E18D;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeLineGreen_] {
    stroke: #D6E18D;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeLineTurquoise {
    stroke: #97CFC1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeLineTurquoise_] {
    stroke: #97CFC1;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeLineLightBlue {
    stroke: #A6D9E2;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeLineLightBlue_] {
    stroke: #A6D9E2;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeLineDarkBlue {
    stroke: #B9C3E4;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeLineDarkBlue_] {
    stroke: #B9C3E4;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeLinePurple {
    stroke: #D3BDDB;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeLinePurple_] {
    stroke: #D3BDDB;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeLinePink {
    stroke: #F2BCD7;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeLinePink_] {
    stroke: #F2BCD7;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeLineRed {
    stroke: #F7B39C;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeLineRed_] {
    stroke: #F7B39C;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeLineYellow {
    stroke: #FFD46F;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeLineYellow_] {
    stroke: #FFD46F;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeShadow rect {
    fill: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeShadow_] rect {
    fill: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeGrey rect:nth-of-type(1) {
    fill: #717680;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeGrey rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeGrey_] rect:nth-of-type(1) {
    fill: #717680;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeGrey_] rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeGrey > rect:nth-of-type(1) {
    fill: #717680;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeGrey > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeGrey_] > rect:nth-of-type(1) {
    fill: #717680;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeGrey_] > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeGreen rect:nth-of-type(1) {
    fill: #598131;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeGreen rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeGreen_] rect:nth-of-type(1) {
    fill: #598131;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeGreen_] rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeGreen > rect:nth-of-type(1) {
    fill: #598131;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeGreen > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeGreen_] > rect:nth-of-type(1) {
    fill: #598131;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeGreen_] > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeTurquoise rect:nth-of-type(1) {
    fill: #417D86;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeTurquoise rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeTurquoise_] rect:nth-of-type(1) {
    fill: #417D86;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeTurquoise_] rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeTurquoise > rect:nth-of-type(1) {
    fill: #417D86;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeTurquoise > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeTurquoise_] > rect:nth-of-type(1) {
    fill: #417D86;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeTurquoise_] > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeLightBlue rect:nth-of-type(1) {
    fill: #26809C;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeLightBlue rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeLightBlue_] rect:nth-of-type(1) {
    fill: #26809C;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeLightBlue_] rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeLightBlue > rect:nth-of-type(1) {
    fill: #26809C;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeLightBlue > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeLightBlue_] > rect:nth-of-type(1) {
    fill: #26809C;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeLightBlue_] > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeDarkBlue rect:nth-of-type(1) {
    fill: #0074E0;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeDarkBlue rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeDarkBlue_] rect:nth-of-type(1) {
    fill: #0074E0;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeDarkBlue_] rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeDarkBlue > rect:nth-of-type(1) {
    fill: #0074E0;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeDarkBlue > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeDarkBlue_] > rect:nth-of-type(1) {
    fill: #0074E0;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeDarkBlue_] > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapePurple rect:nth-of-type(1) {
    fill: #9A53B2;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapePurple rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapePurple_] rect:nth-of-type(1) {
    fill: #9A53B2;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapePurple_] rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForePurple > rect:nth-of-type(1) {
    fill: #9A53B2;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForePurple > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForePurple_] > rect:nth-of-type(1) {
    fill: #9A53B2;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForePurple_] > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapePink rect:nth-of-type(1) {
    fill: #C34693;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapePink rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapePink_] rect:nth-of-type(1) {
    fill: #C34693;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapePink_] rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForePink > rect:nth-of-type(1) {
    fill: #C34693;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForePink > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForePink_] > rect:nth-of-type(1) {
    fill: #C34693;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForePink_] > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeRed rect:nth-of-type(1) {
    fill: #C23100;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeRed rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeRed_] rect:nth-of-type(1) {
    fill: #C23100;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeRed_] rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeRed > rect:nth-of-type(1) {
    fill: #C23100;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeRed > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeRed_] > rect:nth-of-type(1) {
    fill: #C23100;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeRed_] > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeYellow rect:nth-of-type(1) {
    fill: #9E6B05;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeYellow rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeYellow_] rect:nth-of-type(1) {
    fill: #9E6B05;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeYellow_] rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeYellow > rect:nth-of-type(1) {
    fill: #9E6B05;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content #ShapeInnerForeYellow > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeYellow_] > rect:nth-of-type(1) {
    fill: #9E6B05;
  }
  .l-prefers-color-scheme--dark .c-written-tutorial__content [id^=ShapeInnerForeYellow_] > rect:nth-of-type(2) {
    stroke: #ffffff;
  }
}
@media screen {
  .hljs-comment,
.hljs-quote {
    color: #999;
  }
}
@media screen {
  .hljs-variable,
.hljs-template-variable,
.hljs-attribute,
.hljs-tag,
.hljs-name,
.hljs-selector-id,
.hljs-selector-class,
.hljs-regexp,
.hljs-link,
.hljs-deletion {
    color: #F64E1A;
  }
}
@media screen {
  .hljs-number,
.hljs-built_in,
.hljs-builtin-name,
.hljs-literal,
.hljs-type,
.hljs-params {
    color: #f08d49;
  }
}
@media screen {
  .hljs-class .hljs-title {
    color: #f8c555;
  }
}
@media screen {
  .hljs-string,
.hljs-symbol,
.hljs-bullet,
.hljs-addition {
    color: #7ec699;
  }
}
@media screen {
  .hljs-meta {
    color: #18B5AB;
  }
}
@media screen {
  .hljs-function,
.hljs-section,
.hljs-title {
    color: #70A2FF;
  }
}
@media screen {
  .hljs-keyword,
.hljs-selector-tag {
    color: #cc99cd;
  }
}
@media screen {
  .hljs {
    display: block;
    background: #322931;
    color: #b9b5b8;
    padding: 0.5em;
  }
}
@media screen {
  .hljs-emphasis {
    font-style: italic;
  }
}
@media screen {
  .hljs-strong {
    font-weight: bold;
  }
}
@media screen {
  .l-written-tutorial--light .hljs-comment,
.l-written-tutorial--light .hljs-quote {
    color: #bbb;
  }
}
@media screen {
  .l-written-tutorial--light .hljs-variable,
.l-written-tutorial--light .hljs-template-variable,
.l-written-tutorial--light .hljs-attribute,
.l-written-tutorial--light .hljs-tag,
.l-written-tutorial--light .hljs-name,
.l-written-tutorial--light .hljs-selector-id,
.l-written-tutorial--light .hljs-selector-class,
.l-written-tutorial--light .hljs-regexp,
.l-written-tutorial--light .hljs-link,
.l-written-tutorial--light .hljs-deletion {
    color: #D12F1B;
  }
}
@media screen {
  .l-written-tutorial--light .hljs-number,
.l-written-tutorial--light .hljs-built_in,
.l-written-tutorial--light .hljs-builtin-name,
.l-written-tutorial--light .hljs-literal,
.l-written-tutorial--light .hljs-type,
.l-written-tutorial--light .hljs-params {
    color: #e68200;
  }
}
@media screen {
  .l-written-tutorial--light .hljs-class .hljs-title {
    color: #e29803;
  }
}
@media screen {
  .l-written-tutorial--light .hljs-string,
.l-written-tutorial--light .hljs-symbol,
.l-written-tutorial--light .hljs-bullet,
.l-written-tutorial--light .hljs-addition {
    color: #008400;
  }
}
@media screen {
  .l-written-tutorial--light .hljs-meta {
    color: #4E8188;
  }
}
@media screen {
  .l-written-tutorial--light .hljs-function,
.l-written-tutorial--light .hljs-section,
.l-written-tutorial--light .hljs-title {
    color: #272AD8;
  }
}
@media screen {
  .l-written-tutorial--light .hljs-keyword,
.l-written-tutorial--light .hljs-selector-tag {
    color: #703DA9;
  }
}
@media screen {
  .l-written-tutorial--light .hljs {
    display: block;
    background: #322931;
    color: #b9b5b8;
    padding: 0.5em;
  }
}
@media screen {
  .l-written-tutorial--light .hljs-emphasis {
    font-style: italic;
  }
}
@media screen {
  .l-written-tutorial--light .hljs-strong {
    font-weight: bold;
  }
}
@media print {
  /**
   * This file contains all application-wide Sass variables.
   *
   * 1. Fonts
   *
   * 2a. Colors
   *
   * 2b. Highlighter Colors
   *
   * 3. Elements
   */
  /* ==========================================================================
     1. Fonts
     ========================================================================== */
  /**
   * This file contains the font-face definitions for the fonts used across the site
   *
   * It was generated using http://google-webfonts-helper.herokuapp.com/fonts
   *
   * Remember to include latin-ext, primarily for names.
   *
   * 1. Bitter
   * 2. IBM Plex Sans
   * 3. IBM Plex Serif
   */
  /* NOTE
   *
   * Creating these fonts (Bitter) was somewhat challenging, because they were updated in
   * Google Fonts with different spacing and weight. It was then very hard to find the
   * original font with the appropriate character set.
   * This directory contains the OTF files that we need.
   * You can use https://everythingfonts.com/subsetter to extract the appropriate subset
   * (Latin Extended) and then https://kombu.kanejaku.org to create the WOFF and WOFF2 versions
   * Current settings on the subset generator:
   *
   * - Basic Latin
   * - Latin-1 Supplement
   * - Advanced Punctuation
   * - Uppercase
   * - Lowercase
   * - Numerals
   * - Basic Punctuation
   * - Currency Symbols
   * - Latin Extended-A
   * - Latin Extended-B
   */
  /* ==========================================================================
     1. Bitter
     ========================================================================== */
  /* bitter-regular - latin-ext_latin */
  @font-face {
    font-family: "Bitter";
    font-style: normal;
    font-weight: 400;
    src: url(/assets/bitter-1.300-latin_ext-regular-ea79c0f752f7656ce3694dca8312fcb969f83cbe92ca5298c5920ccffb126c5d.woff2) format("woff2"), url(/assets/bitter-1.300-latin_ext-regular-eecfd6c3af651231104ba7ae58079c215e1d4c00b80b2ff0e95ae0cbec63452c.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* bitter-italic - latin-ext_latin */
  @font-face {
    font-family: "Bitter";
    font-style: italic;
    font-weight: 400;
    src: url(/assets/bitter-1.002-latin_ext-italic-f4a1b872a93d98cd9f7865f20340e22e936f3634fb142e2372b4598c98def35a.woff2) format("woff2"), url(/assets/bitter-1.002-latin_ext-italic-a6485dae55bfcf03d80c0b42c15a8555767d700b3be2db1a24bcbff003d2c606.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* bitter-700 - latin-ext_latin */
  @font-face {
    font-family: "Bitter";
    font-style: normal;
    font-weight: 700;
    src: url(/assets/bitter-2.110-latin_ext-700-041b7c53b2f3ed8e2378eaef2841cfad596a7cf6af87bd91f96c9c3b26eec206.woff2) format("woff2"), url(/assets/bitter-2.110-latin_ext-700-57857445d4419a791376b73c9bdb14606d59d2aa09a947120d1b6a1e58965e42.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ==========================================================================
     2. IBM Plex Sans
     ========================================================================== */
  /* ibm-plex-sans-regular - latin-ext_latin */
  @font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 400;
    src: url(/assets/ibm-plex-sans-v3-latin-ext_latin-regular-4126890a77928150a6f3be017f23c93df16f56e6940a72f231823ba29d2ee998.woff2) format("woff2"), url(/assets/ibm-plex-sans-v3-latin-ext_latin-regular-3213dca28efc701a797f1a261a9377b0c530a9ae3cfb72b187d1194f3bd196d3.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ibm-plex-sans-500 - latin-ext_latin */
  @font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 500;
    src: url(/assets/ibm-plex-sans-v3-latin-ext_latin-500-04aba1eb9b084332715891b2a764459df24188e66731279bad286bbe1447e5e8.woff2) format("woff2"), url(/assets/ibm-plex-sans-v3-latin-ext_latin-500-2827cf78c931acdac08d21fb21e3c1531fda43e342b49055f9a312cf336f366c.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ibm-plex-sans-700 - latin-ext_latin */
  @font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 700;
    src: url(/assets/ibm-plex-sans-v3-latin-ext_latin-700-946ed95688a6677fb113b84ac50ef140b42971e05e4da335a3ead116a7c9886b.woff2) format("woff2"), url(/assets/ibm-plex-sans-v3-latin-ext_latin-700-7dbcb16e805e3c4e19b6afc0fbe96a730c7229f129c00e1b239eda58b12f6063.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ==========================================================================
     3. IBM Plex Serif
     ========================================================================== */
  /* ibm-plex-serif-regular - latin-ext_latin */
  @font-face {
    font-family: "IBM Plex Serif";
    font-style: normal;
    font-weight: 400;
    src: url(/assets/ibm-plex-serif-v4-latin-ext_latin-regular-e4f826dc262e20e2114e3637d5cab104d4851dee74421c968a6e29d6be2d8b0b.woff2) format("woff2"), url(/assets/ibm-plex-serif-v4-latin-ext_latin-regular-98933eb8c158bbfc91428e8e37644e6f906422073f220313353a4ae476c3bbfd.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ibm-plex-serif-500 - latin-ext_latin */
  @font-face {
    font-family: "IBM Plex Serif";
    font-style: normal;
    font-weight: 500;
    src: url(/assets/ibm-plex-serif-v4-latin-ext_latin-500-dcab0f62c8194ccb39b97113223f99f294112e0d173b18918c31f3494c203456.woff2) format("woff2"), url(/assets/ibm-plex-serif-v4-latin-ext_latin-500-ae2864b567a0cfaee3af57d9a8a800a374db2a8aee962b54bbcbf83d1c90fa15.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ibm-plex-serif-700 - latin-ext_latin */
  @font-face {
    font-family: "IBM Plex Serif";
    font-style: normal;
    font-weight: 700;
    src: url(/assets/ibm-plex-serif-v4-latin-ext_latin-700-ec4d87dbc9136c02618bd6878955a63e40207541c72e5109137d56e28ea65b3f.woff2) format("woff2"), url(/assets/ibm-plex-serif-v4-latin-ext_latin-700-cf316807d947f5b6ef4492a9ce6ec4a2f348ec1acf64a481cd6f0fbecb846ad0.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ==========================================================================
     4. IBM Plex Mono
     ========================================================================== */
  /* ibm-plex-mono-medium */
  @font-face {
    font-family: "IBM Plex Mono";
    font-style: normal;
    font-weight: 500;
    src: url(/assets/ibm-plex-mono-v1-500-ba9db195c954509bda2236e0303e51b261b85aef320cb28134ed97155de85914.woff2) format("woff2"), url(/assets/ibm-plex-mono-v1-500-37d084bbe45275af60e08db241605f8a7949a8ebc76074954fd9b02b72aa4857.woff) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* ==========================================================================
     2a. Colors
     ========================================================================== */
  /* Blacks */
  /* Greys */
  /* Greens */
  /* Blues */
  /* Reds */
  /* Purples */
  /* Teals */
  /* Yellows */
  /* Brands */
  /* Gradients */
  /* ==========================================================================
     2b. Highlighter Colors
     ========================================================================== */
  /* ==========================================================================
     3. Elements
     ========================================================================== */
  /**
   * Consult bourbon.io for a comprehensive list of available mixins before adding one here
   *
   * 1. Card - Used for nearly every container as a background
   *
   * 2. Breakpoints - Powerful mixin with five presets for common screen sizes
   *
   * 3. Position Absolute - A full width/height pseudo element fill
   *
   * 4. Border Hover
   *
   * 5. Mobile scroll - Make overflow scroll springy on mobile
   *
   */
  /* ==========================================================================
    1. Card
    ========================================================================== */
  /* ==========================================================================
   2. Breakpoints
   ========================================================================== */
  /* ==========================================================================
     3. Pseudo element absolute
     ========================================================================== */
  /* ==========================================================================
    4. Border Hover
    ========================================================================== */
  /* ==========================================================================
  5. Mobile scroll
  ========================================================================== */
  /* ==========================================================================
  6. Hide Scrollbar
  ========================================================================== */
  /**
   * A thin layer on top of normalize.css
   */
  html {
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  }
  *,
*::before,
*::after {
    box-sizing: inherit;
  }
  blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
figure,
p,
pre {
    margin: 0;
  }
  a, button {
    transition: all 0.3s ease-out;
  }
  button {
    background: transparent;
    border: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  }
  input:focus, button:focus, li:focus, a:focus, span:focus {
    outline: 0;
  }
  fieldset {
    border: 0;
    margin: 0;
    padding: 0;
  }
  iframe {
    border: 0;
  }
  ol,
ul {
    list-style: none;
    margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  }
  ol {
    list-style: decimal;
  }
  ol li {
    margin-top: 10px;
  }
  ol li:first-child {
    margin-top: 0;
  }
  input,
textarea,
select {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    -webkit-appearance: none;
  }
  /**
   * Suppress the focus outline on elements that cannot be accessed via keyboard.
   * This prevents an unwanted focus outline from appearing around elements that
   * might still respond to pointer events.
   */
  [tabindex="-1"]:focus {
    outline: none !important;
  }
  /**
   * Standardise SVG rendering
   */
  svg g, svg path {
    fill: inherit;
  }
  svg.icon {
    width: 32px;
    height: 32px;
  }
  /**
   * Sets some base rules for typography
   */
  body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-display: auto;
    font-size: 1rem;
    font-weight: normal;
    line-height: 1.45;
    color: #333333;
    -webkit-backface-visibility: hidden;
    text-shadow: 0 -1px 1px rgba(255, 255, 255, 0.01);
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }
  h1, h2, h3, h4, h5 {
    font-family: "Bitter", serif;
    font-display: auto;
    font-weight: 700;
    letter-spacing: -0.5px;
  }
  h1 {
    font-size: 3rem;
    line-height: 1.125;
  }
  /**
   *
   * Print Layout
   *
   **/
}
@media print and (max-width: 600px) {
  h1 {
    font-size: 1.875rem;
  }
}
@media print {
  h2 {
    font-size: 1.875rem;
    line-height: 1.25;
  }
}
@media print {
  h3 {
    font-size: 1.5rem;
    line-height: 1.35;
  }
}
@media print {
  h4 {
    font-size: 1.3125rem; /* 21/16 */
    line-height: 1.35;
  }
}
@media print {
  p {
    font-size: 1.0625rem;
  }
}
@media print and (max-width: 600px) {
  p {
    font-size: 0.9375rem;
  }
}
@media print {
  #content, #page {
    width: 100%;
    margin: 0;
    float: none;
  }
  @page {
    margin: 2cm;
  }
  html {
    font-size: 11pt !important;
  }
  body {
    font-family: Georgia, Times New Roman, Times, serif;
    line-height: 1.3;
    background: #fff !important;
    color: #000 !important;
  }
  a {
    color: #000;
  }
  .l-collection-hero__copy h1, .l-collection-hero__copy p {
    color: #000 !important;
  }
  #c-global-header, nav, .c-banner-draper,
#c-global-footer, .c-written-tutorial__artwork, .c-box-list,
.o-button--green, .l-bookmark-button-mobile,
.c-more-tutorials, .c-authors, .c-forum-comments,
.c-written-tutorial__content-tags, .c-written-tutorial__content-share,
.c-written-tutorial__content-buttons, .l-collection-hero__artwork--desktop,
.c-tutorial-episode__length, .o-badge-tutorial--checkmark, .o-alert--info, .o-tag,
.c-admin-edit-banner, .o-button--bookmark, .l-collection-hero__copy h4,
.c-written-tutorial__introduction h4,
.c-banner-related__artwork,
.c-mobile-navigator,
.c-paginator, .c-sticky-options-banner,
.c-banner-draper-sticky,
#carbonads, .c-rating-count {
    display: none !important;
  }
  .c-written-tutorial__introduction {
    width: 100% !important;
  }
  h1,
h2,
h3,
h4,
h5 {
    break-after: avoid !important;
  }
  h2,
h3,
h4 {
    margin-top: 18pt !important;
  }
  table, figure {
    break-inside: avoid !important;
  }
  p {
    margin-top: 12pt !important;
  }
  em {
    font-weight: 700 !important;
  }
  .c-content-author {
    display: flex;
    align-items: center;
    margin-top: 24pt;
  }
  .c-content-author img {
    max-width: 60px !important;
    margin-right: 14pt !important;
  }
  img {
    display: block !important;
    width: auto !important;
    max-width: 580px !important;
    height: auto !important;
  }
  [class*=breadcrumbs] {
    display: none !important;
  }
  article {
    max-width: 688pt !important;
  }
  a[href^="#"]:after {
    display: none !important;
  }
  a[href^="https://"] {
    text-decoration: underline !important;
  }
  p a[href^="https://"]:after,
a[href^="https://"]:after {
    display: inline-block;
    font-size: 80% !important;
    content: " (" attr(href) ")";
    word-break: break-word;
  }
  p a {
    word-wrap: break-word !important;
  }
  code {
    padding: 0 2pt !important;
    box-shadow: inset 0 0 0 1000px #e4e4e4 !important;
  }
  pre {
    margin-top: 8pt !important;
    padding: 8px !important;
    border: 1px solid #000000 !important;
    border-radius: 0.5625rem !important;
    break-inside: avoid !important;
  }
  pre code {
    box-shadow: none !important;
  }
  pre button {
    display: none !important;
  }
  ul li, ol li {
    margin-top: 8pt;
    padding-left: 8pt;
  }
  .note {
    margin-top: 12pt !important;
    padding: 10pt !important;
    box-shadow: inset 0 0 1000px #e4e4e4 !important;
    border-radius: 0.5625rem !important;
  }
  .u-hide {
    display: none !important;
  }
  [class*=c-banner-draper] img {
    display: none !important;
  }
}

/*# sourceMappingURL=application.css.map */