:root {
    --header-height: 3.5rem;
    --site-wide-banner-height: 0rem;
    --font-family-body-lesson-markdown: var(--font-family-noto-serif),Georgia,serif;
    --font-family-system: "Helvetica Neue",SF Pro Display,Arial,Roboto,system-ui;
    --font-family-heading-lesson-markdown: var(--font-family-nunito-sans);
    --font-size-lesson-markdown: 18px;
    --line-height-lesson-markdown: 175%;
    --sidebar: 0;
    --font-family-poppins: "Helvetica Neue",SF Pro Display,Arial,Roboto,system-ui;
    --font-family-nunito-sans: "Helvetica Neue",SF Pro Display,Arial,Roboto,system-ui;
    --font-family-noto-serif: "Helvetica Neue",SF Pro Display,Arial,Roboto,system-ui;
    --font-family-mulish: "Helvetica Neue",SF Pro Display,Arial,Roboto,system-ui
}

.heading-one {
	font-size: var(--h1-font-size);
	line-height: var(--h1-line-height);
	font-weight: 600
}

.heading-two {
	font-size: var(--h2-font-size);
	line-height: var(--h2-line-height);
	font-weight: 600
}

.heading-three {
	font-size: var(--h3-font-size);
	line-height: var(--h3-line-height);
	font-weight: 600
}

.heading-four {
	font-size: var(--h4-font-size);
	line-height: var(--h4-line-height);
	font-weight: 600
}

.\!heading-five {
	font-size: var(--h5-font-size) !important;
	line-height: var(--h5-line-height) !important
}

.heading-five {
	font-size: var(--h5-font-size);
	line-height: var(--h5-line-height)
}

.\!heading-five,
.heading-five,
.heading-six {
	font-weight: 600
}

.heading-six {
	font-size: 16px;
	line-height: 140%
}

.heading-seven {
	font-size: var(--h7-font-size);
	line-height: var(--h7-line-height);
	font-weight: 500
}

.body-one {
	font-size: var(--body1-font-size);
	line-height: var(--body1-line-height)
}

.body-three {
	font-size: var(--body3-font-size);
	line-height: var(--body3-line-height)
}

.body-four {
	font-size: var(--body4-font-size);
	line-height: var(--body4-line-height)
}

.body-five {
	font-size: var(--body5-font-size);
	line-height: var(--body5-line-height)
}

.product-page .heading-six {
	font-size: var(--h6-font-size);
	line-height: var(--h6-line-height);
	font-weight: 600
}

.body-large,
.product-page .body-large {
	font-size: var(--body-large-font-size);
	line-height: var(--body-large-line-height)
}

.body-medium {
	font-size: 1rem;
	line-height: 1.5rem
}

.\!body-small {
	font-size: 14px !important;
	line-height: 22px !important
}

.body-small {
	font-size: 14px;
	line-height: 22px
}

.lessonPage_lesson-page {
  --body-medium-font-size: 16px;
  --body-medium-line-height: 24px;
  --body-small-font-size: 14px;
  --body-small-line-height: 20px;
  --caption-text-font-size: 12px;
  --caption-text-line-height: 20px;
}

.lessonPage_lesson-page.lessonPage_tablet .custom-large h2 {
  margin: 40px 0 6px;
}

.lessonPage_lesson-page.lessonPage_mobile .custom-large h2,
.lessonPage_lesson-page.lessonPage_tablet .custom-default h2,
.lessonPage_lesson-page.lessonPage_tablet .custom-large h3 {
  margin: 36px 0 6px;
}

.lessonPage_lesson-page.lessonPage_mobile .custom-default h2,
.lessonPage_lesson-page.lessonPage_mobile .custom-large h3,
.lessonPage_lesson-page.lessonPage_tablet .custom-default h3,
.lessonPage_lesson-page.lessonPage_tablet .custom-large h4,
.lessonPage_lesson-page.lessonPage_tablet .custom-small h2 {
  margin: 32px 0 6px;
}

.lessonPage_lesson-page.lessonPage_mobile .custom-default h3,
.lessonPage_lesson-page.lessonPage_mobile .custom-large h4,
.lessonPage_lesson-page.lessonPage_mobile .custom-small h2,
.lessonPage_lesson-page.lessonPage_tablet .custom-small h3 {
  margin: 28px 0 6px;
}

.lessonPage_lesson-page.lessonPage_mobile .custom-default h4,
.lessonPage_lesson-page.lessonPage_mobile .custom-large h5,
.lessonPage_lesson-page.lessonPage_mobile .custom-small h3,
.lessonPage_lesson-page.lessonPage_tablet .custom-default h4,
.lessonPage_lesson-page.lessonPage_tablet .custom-default h5,
.lessonPage_lesson-page.lessonPage_tablet .custom-default h6,
.lessonPage_lesson-page.lessonPage_tablet .custom-large h5,
.lessonPage_lesson-page.lessonPage_tablet .custom-large h6,
.lessonPage_lesson-page.lessonPage_tablet .custom-small h4,
.lessonPage_lesson-page.lessonPage_tablet .custom-small h5,
.lessonPage_lesson-page.lessonPage_tablet .custom-small h6 {
  margin: 24px 0 6px;
}

.lessonPage_lesson-page.lessonPage_mobile .custom-small h4 {
  margin: 22px 0 6px;
}

.lessonPage_lesson-page.lessonPage_mobile .custom-default h5,
.lessonPage_lesson-page.lessonPage_mobile .custom-default h6,
.lessonPage_lesson-page.lessonPage_mobile .custom-large h6,
.lessonPage_lesson-page.lessonPage_mobile .custom-small h5,
.lessonPage_lesson-page.lessonPage_mobile .custom-small h6 {
  margin: 20px 0 6px;
}

.lessonPage_lesson-page.lessonPage_tablet .custom-large {
  --h1-font-size: 40px;
  --h1-line-height: 48px;
  --h2-font-size: 32px;
  --h2-line-height: 40px;
  --h3-font-size: 28px;
  --h3-line-height: 36px;
  --h4-font-size: 24px;
  --h4-line-height: 32px;
  --h5-font-size: 20px;
  --h5-line-height: 28px;
  --h6-font-size: 16px;
  --h6-line-height: 24px;
  --body-large-font-size: 20px;
  --body-large-line-height: 28px;
  --paragraph-code-font-size: 16px;
  --paragraph-code-line-height: 24px;
}

.lessonPage_lesson-page.lessonPage_tablet {
  --h1-font-size: 32px;
  --h1-line-height: 40px;
  --h2-font-size: 28px;
  --h2-line-height: 36px;
  --h3-font-size: 24px;
  --h3-line-height: 32px;
  --h4-font-size: 20px;
  --h4-line-height: 28px;
  --h5-font-size: 18px;
  --h5-line-height: 24px;
  --h6-font-size: 16px;
  --h6-line-height: 24px;
  --body-large-font-size: 18px;
  --body-large-line-height: 28px;
  --paragraph-code-font-size: 14px;
  --paragraph-code-line-height: 20px;
}

.lessonPage_lesson-page.lessonPage_tablet .custom-small {
  --h1-font-size: 28px;
  --h1-line-height: 36px;
  --h2-font-size: 24px;
  --h2-line-height: 32px;
  --h3-font-size: 20px;
  --h3-line-height: 28px;
  --h4-font-size: 18px;
  --h4-line-height: 28px;
  --h5-font-size: 16px;
  --h5-line-height: 24px;
  --h6-font-size: 14px;
  --h6-line-height: 20px;
  --body-large-font-size: 18px;
  --body-large-line-height: 24px;
  --paragraph-code-font-size: 14px;
  --paragraph-code-line-height: 20px;
}

@media (min-width: 1080px) {
  .lessonPage_lesson-page.lessonPage_desktop .custom-large h2 {
    margin: 40px 0 6px;
  }

  .lessonPage_lesson-page.lessonPage_desktop .custom-default h2,
  .lessonPage_lesson-page.lessonPage_desktop .custom-large h3 {
    margin: 36px 0 6px;
  }

  .lessonPage_lesson-page.lessonPage_desktop .custom-default h3,
  .lessonPage_lesson-page.lessonPage_desktop .custom-large h4,
  .lessonPage_lesson-page.lessonPage_desktop .custom-small h2 {
    margin: 32px 0 6px;
  }

  .lessonPage_lesson-page.lessonPage_desktop .custom-small h3 {
    margin: 28px 0 6px;
  }

  .lessonPage_lesson-page.lessonPage_desktop .custom-default h4,
  .lessonPage_lesson-page.lessonPage_desktop .custom-default h5,
  .lessonPage_lesson-page.lessonPage_desktop .custom-default h6,
  .lessonPage_lesson-page.lessonPage_desktop .custom-large h5,
  .lessonPage_lesson-page.lessonPage_desktop .custom-large h6,
  .lessonPage_lesson-page.lessonPage_desktop .custom-small h4,
  .lessonPage_lesson-page.lessonPage_desktop .custom-small h5,
  .lessonPage_lesson-page.lessonPage_desktop .custom-small h6 {
    margin: 24px 0 6px;
  }

  .lessonPage_lesson-page.lessonPage_desktop {
    --h1-font-size: 40px;
    --h1-line-height: 48px;
    --h2-font-size: 32px;
    --h2-line-height: 40px;
    --h3-font-size: 28px;
    --h3-line-height: 36px;
    --h4-font-size: 24px;
    --h4-line-height: 32px;
    --h5-font-size: 20px;
    --h5-line-height: 28px;
    --h6-font-size: 16px;
    --h6-line-height: 24px;
    --body-large-font-size: 20px;
    --body-large-line-height: 28px;
    --paragraph-code-font-size: 16px;
    --paragraph-code-line-height: 24px;
  }

  .lessonPage_lesson-page.lessonPage_desktop .custom-small {
    --h1-font-size: 32px;
    --h1-line-height: 40px;
    --h2-font-size: 28px;
    --h2-line-height: 36px;
    --h3-font-size: 24px;
    --h3-line-height: 32px;
    --h4-font-size: 20px;
    --h4-line-height: 28px;
    --h5-font-size: 18px;
    --h5-line-height: 24px;
    --h6-font-size: 16px;
    --h6-line-height: 24px;
    --body-large-font-size: 18px;
    --body-large-line-height: 28px;
    --paragraph-code-font-size: 14px;
    --paragraph-code-line-height: 20px;
  }

  .lessonPage_lesson-page.lessonPage_desktop .custom-large {
    --h1-font-size: 48px;
    --h1-line-height: 48px;
    --h2-font-size: 40px;
    --h2-line-height: 48px;
    --h3-font-size: 32px;
    --h3-line-height: 40px;
    --h4-font-size: 28px;
    --h4-line-height: 36px;
    --h5-font-size: 24px;
    --h5-line-height: 32px;
    --h6-font-size: 20px;
    --h6-line-height: 28px;
    --body-large-font-size: 24px;
    --body-large-line-height: 32px;
    --paragraph-code-font-size: 18px;
    --paragraph-code-line-height: 28px;
  }
}

 button {
    font-size: .9375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    border-radius: .125rem;
    border-width: 0;
    padding: .75rem !important;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: .025em;
    color: #fff;
    transition-duration: .2s
}

button:focus {
    outline: 2px solid transparent;
    outline-offset: 2px
}

button:disabled {
    background-color: #d1d5db
}

button.text-default {
	color: rgba(0, 0, 0, .87);
	background-color: transparent
}

button.text-default:is(.dark *) {
	color: #c1c2c6
}

button.icon-default {
	background-color: transparent;
	color: #7f818b;
	outline: 2px solid transparent;
	outline-offset: 2px
}

button.icon-default:is(.dark *) {
	color: #7f818b
}

button.icon-default:hover:enabled,
button.text-default:hover:enabled {
	background-color: #c1c2c630
}

button.icon-default:hover:enabled:is(.dark *),
button.text-default:hover:enabled:is(.dark *) {
	background-color: #41434e
}

button.text-default:disabled {
	color: #9ca3af
}

button.text-default:disabled:is(.dark *) {
	color: #6a6c78
}

button.icon-default:disabled {
	color: #d1d5db
}

button.icon-default:disabled:is(.dark *) {
	color: #5b5e6a
}

button.contained-primary {
	background-color: #5553ff;
	color: #fff
}

button.contained-primary:is(.dark *) {
	background-color: #4747b3
}

button.contained-primary:hover:enabled {
	background-color: #3d3bb7
}

button.contained-primary:hover:enabled:is(.dark *) {
	background-color: #6969c3
}

button.contained-primary:disabled {
	background-color: #cccbff;
	color: #fff
}

button.contained-primary:disabled:is(.dark *) {
	background-color: #4d4a5e;
	color: #1a191f
}

button.contained-secondary {
	color: #5553ff;
	background-color: #fff;
	border: 1px solid
}

button.contained-secondary:is(.dark *) {
	color: #b6b6e2;
	border-color: #b6b6e2;
	background-color: #1a191f
}

button.contained-secondary:hover:enabled {
	background-color: #f5f5ff
}

button.contained-secondary:hover:enabled:is(.dark *) {
	background-color: #23222b
}

button.contained-secondary:disabled {
	border-color: #e5e7eb;
	color: #d1d5db
}

button.contained-secondary:disabled:is(.dark *) {
	border-color: #363442;
	color: #65607b
}

button.contained-error {
	border: 1px solid #ef4444;
	background-color: #ef4444
}

button.contained-error:is(.dark *) {
	color: #c1c2c6
}

button.contained-error:hover:enabled {
	border-color: #b91c1c;
	background-color: #b91c1c
}

button.contained-error:hover:enabled:is(.dark *) {
	border-color: #f87171;
	background-color: #f87171;
	color: #000
}

button.contained-error:disabled {
	border-color: #d1d5db;
	background-color: #d1d5db
}

button.contained-error:disabled:is(.dark *) {
	border-color: #6a6c78;
	background-color: #6a6c78;
	color: #8f9199
}

button.outlined-default {
	border: 1px solid rgba(0, 0, 0, .23);
	color: rgba(0, 0, 0, .87);
	background-color: transparent
}

button.outlined-default:is(.dark *) {
	border-color: #c1c2c6;
	color: #c1c2c6
}

button.outlined-default:hover:enabled {
	background-color: rgba(0, 0, 0, .04);
	border-color: #0c1322
}

button.outlined-default:hover:enabled:is(.dark *) {
	border-color: #c1c2c6;
	background-color: #41434e
}

button.outlined-default:disabled {
	border-color: #d1d5db;
	background-color: #f9fafb;
	color: #d1d5db
}

button.outlined-default:disabled:is(.dark *) {
	border-color: #6a6c78;
	background-color: transparent;
	color: #6a6c78
}

button.outlined-primary {
	border: 1px solid rgba(85, 83, 255, .5);
	background-color: transparent;
	color: #5553ff
}

button.outlined-primary:is(.dark *) {
	border-color: #7775ff;
	color: #cccbff
}

button.outlined-primary:hover:enabled {
	background-color: rgba(85, 83, 255, .04);
	border-color: #5553ff
}

button.outlined-primary:hover:enabled:is(.dark *) {
	border-color: #7775ff;
	background-color: #41434e
}

button.outlined-primary:disabled {
	border-color: #d1d5db;
	background-color: #f9fafb;
	color: #d1d5db
}

button.outlined-primary:disabled:is(.dark *) {
	border-color: #6a6c78;
	background-color: transparent;
	color: #6a6c78
}

.eyebrow {
	letter-spacing: 2.2px;
	font-size: .75rem;
	font-weight: 600;
	text-transform: uppercase;
	line-height: 1.25rem
}

@media (min-width:600px) {
	.sm\:eyebrow {
		letter-spacing: 2.2px;
		font-size: .75rem;
		font-weight: 600;
		text-transform: uppercase;
		line-height: 1.25rem
	}
}

.logged-in {
	display: var(--loggedout-true, flex) !important
}

.logged-out {
	display: var(--loggedout-false, flex)
}

.show-enterprise-nav {
	display: var(--enterprise-nav-false, flex)
}

.hide-enterprise-nav {
	display: var(--enterprise-nav-true, flex)
}

.show-recommendations {
	display: var(--recommendations)
}

.show-trial {
	display: var(--trial-not-availed)
}

.not-subscribed {
	display: var(--not-subscribed)
}

.l2c-subscribed {
	display: var(--l2c-subscribed)
}

pre {
  padding: 10px;
  border-radius: 10px;
  font-size: 14px !important;
}

.markdown-default {
	color: #374151
}

.markdown-default:is(.dark *) {
	color: #c1c2c6
}

.markdown-default {
	line-height: 1.7;
	outline: none
}

.markdown-viewer {
	font-family: var(--font-family-body-lesson-markdown, var(--font-family-system, var(--font-family-noto-serif, var(--font-family-nunito-sans))));
	font-size: var(--font-size-lesson-markdown, 18px);
	overflow-wrap: break-word
}

.markdown-default p {
	display: block;
	margin-top: 1em;
	margin-bottom: 1em;
	line-height: var(--line-height-lesson-markdown)
}

.markdownViewer.markdown-default p {
	margin-top: 0
}

.product-page {
	--body-small-font-size: 14px;
	--body-small-line-height: 20px;
	--caption-text-font-size: 14px;
	--caption-text-line-height: 20px
}

.product-page.desktop {
	--h1-font-size: 40px;
	--h1-line-height: 48px;
	--h2-font-size: 32px;
	--h2-line-height: 40px;
	--h3-font-size: 28px;
	--h3-line-height: 36px;
	--h4-font-size: 24px;
	--h4-line-height: 32px;
	--h5-font-size: 20px;
	--h5-line-height: 28px;
	--h6-font-size: 16px;
	--h6-line-height: 24px;
	--body-large-font-size: 20px;
	--body-large-line-height: 28px;
	--body-medium-font-size: 16px;
	--body-medium-line-height: 24px
}

.product-page.tablet {
	--h1-font-size: 32px;
	--h1-line-height: 40px;
	--h2-font-size: 28px;
	--h2-line-height: 36px;
	--h3-font-size: 24px;
	--h3-line-height: 32px;
	--h4-font-size: 20px;
	--h4-line-height: 28px;
	--h5-font-size: 18px;
	--h5-line-height: 28px;
	--h6-font-size: 16px;
	--h6-line-height: 24px;
	--body-large-font-size: 20px;
	--body-large-line-height: 28px;
	--body-medium-font-size: 16px;
	--body-medium-line-height: 24px
}

@media (min-width: 1080px) {
    .lg\:desktop.product-page {
        --h1-font-size: 40px;
        --h1-line-height: 48px;
        --h2-font-size: 32px;
        --h2-line-height: 40px;
        --h3-font-size: 28px;
        --h3-line-height: 36px;
        --h4-font-size: 24px;
        --h4-line-height: 32px;
        --h5-font-size: 20px;
        --h5-line-height: 28px;
        --h6-font-size: 16px;
        --h6-line-height: 24px;
        --body-large-font-size: 20px;
        --body-large-line-height: 28px;
        --body-medium-font-size: 16px;
        --body-medium-line-height: 24px;
    }
}

.overlay {
    position: relative
}

.overlay::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: inherit
}

.overlay-custom-left::before {
    background: -webkit-gradient(linear,left bottom,left top,from(rgba(9,7,97,.6)),to(rgba(9,7,97,.6))),-webkit-gradient(linear,right top,left top,color-stop(17.76%,#090761),to(rgba(255,255,255,0)));
    background: linear-gradient(0deg,rgba(9,7,97,.6),rgba(9,7,97,.6)),linear-gradient(270deg,#090761 17.76%,rgba(255,255,255,0) 100%);
}

code {
    color: #c7254e;
    border-radius: 4px;
}

.markdown-default p {
	display: block;
	margin-top: 1em;
	margin-bottom: 1em;
	line-height: var(--line-height-lesson-markdown)
}

.markdownViewer.markdown-default p {
	margin-top: 0
}

.markdown-viewer pre:is(.dark *) {
	border-color: #373942;
	background-color: #222327;
	color: #c1c2c6
}

.markdown-viewer pre code:is(.dark *) {
	background-color: #222327
}

.markdown-viewer-slate img:is(.dark *) {
	background-color: hsla(0, 0%, 100%, .9);
	opacity: .9
}

.markdown-viewer-slate-marketing-page p {
	margin: 0;
	font-size: 1rem;
	line-height: 1.5rem;
	font-weight: 400
}

.markdown-viewer-slate .figcaption {
	display: flex;
	flex-direction: column;
	align-items: center;
	white-space: pre-line
}

.markdown-viewer-slate .caption {
	margin-top: .625rem;
	word-break: break-all;
	border-radius: .375rem;
	background-color: #f9fafb;
	padding: .375rem 1.25rem;
	text-align: center;
	font-size: .875rem;
	line-height: 1.25rem;
	color: #000
}

.markdown-viewer-slate .caption:is(.dark *) {
	background-color: #222327;
	color: #c1c2c6
}

.markdown-viewer-slate .\!caption {
	margin-top: .625rem;
	word-break: break-all;
	border-radius: .375rem;
	background-color: #f9fafb;
	padding: .375rem 1.25rem;
	text-align: center;
	font-size: .875rem;
	line-height: 1.25rem;
	color: #000
}

.markdown-viewer-slate .\!caption:is(.dark *) {
	background-color: #222327;
	color: #c1c2c6
}

.markdown-viewer-questionnaire-statement p {
	margin-bottom: 2rem;
	margin-top: 0;
	padding: .5rem;
	font-size: 1.875rem;
	line-height: 2.25rem;
	font-weight: 600;
	color: #000
}

.markdown-viewer-questionnaire-statement p:is(.dark *) {
	color: #c1c2c6
}

.markdown-viewer-questionnaire-not-statement p {
	margin-bottom: .5rem;
	margin-top: .875rem;
	padding: .5rem;
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.5rem;
	color: #000
}

.markdown-viewer-questionnaire-not-statement p:is(.dark *) {
	color: #e3e3e5
}

.markdown-viewer-center {
	display: flex
}

.markdown-viewer-center pre {
	margin-bottom: 0;
	width: 100%
}

.markdown-viewer-center pre:is(.dark *) {
	border-color: #373942;
	background-color: #1e1e1e
}

.skill-assessment-main .markdown-viewer p {
	font-size: 14px;
	line-height: 22px;
	color: #000
}

.skill-assessment-main .markdown-viewer p:is(.dark *) {
	color: #c1c2c6
}

.markdown-viewer-skill-assessment p {
	margin-top: .25rem;
	margin-bottom: .25rem;
	font-size: 1rem;
	font-weight: 400;
	font-style: normal;
	line-height: 1.5rem
}

.markdown-viewer-skill-assessment p:is(.dark *) {
	color: #c1c2c6
}

.markdown-viewer-skill-assessment pre {
	margin-top: .25rem;
	margin-bottom: .25rem
}

.markdown-viewer-project,
.markdown-viewer-skill-assessment li {
	font-size: 1rem;
	line-height: 1.5rem
}

.markdown-viewer-project {
	color: #000
}

.markdown-viewer-skill-assessment-statement pre {
	margin-top: 1.25rem;
	margin-bottom: 1.25rem
}

.markdown-default h1 {
	font-size: 3rem;
    line-height: 1.25;
	margin-bottom: 10px;
	margin-top: 20px;
}

.markdown-default h2 {
	font-size: 2.25rem;
    line-height: 1.5;
	margin-bottom: 10px;
	margin-top: 20px;
}

.markdown-default h3 {
    font-size: 1.875rem;
    line-height: 1.5;
	letter-spacing: .025em;
	margin-bottom: 10px;
	margin-top: 20px;
}

.markdown-default h4 {
    font-size: 1.5rem;
    line-height: 1.5;
	letter-spacing: .025em;
	margin-bottom: 10px;
	margin-top: 10px;
}

.markdown-default h5 {
    font-size: 1.25rem;
    line-height: 1.5;
	letter-spacing: .025em;
	margin-bottom: 10px;
	margin-top: 10px;
}

.markdown-default h6 {
    font-size: 1rem;
    line-height: 1.5;
	letter-spacing: .025em;
	margin-bottom: 10px;
	margin-top: 10px;
}
.markdown-default .heading-five, 
.markdown-default .heading-four, 
.markdown-default .heading-one, 
.markdown-default .heading-six, 
.markdown-default .heading-three, 
.markdown-default .heading-two, 
.markdown-default h1, 
.markdown-default h2, 
.markdown-default h3, 
.markdown-default h4, 
.markdown-default h5, 
.markdown-default h6 {
	color: #0c1322;
	font-family: var(--font-family-heading-lesson-markdown);
    font-weight: 600;
}

.markdown-viewer ul {
	padding-inline-start: 40px;
}

.markdown-viewer ul li {
  list-style: disc;
}

.markdown-viewer ol {
	padding-inline-start: 40px;
}

.markdown-viewer ol li {
  list-style: disc;
}

.markdown-viewer code {
	overflow-wrap: break-word;
	border-radius: 0;
	padding-left: 0;
	padding-right: 0
}

.markdown-viewer code:is(.dark *) {
	background-color: #4e505c;
	color: #c1c2c6
}

.markdown-viewer strong {
	font-family: var(--font-family-body-lesson-markdown, var(--font-family-noto-serif, var(--font-family-nunito-sans)))
}

.edit-mode .markdown-viewer li {
	margin-bottom: 0
}

.edit-mode .markdown-viewer li p {
	padding-bottom: 5px
}

.markdown-default li p {
	margin-bottom: 5px;
	margin-top: 0
}

.markdown-viewer blockquote {
	background-color: #f9fafb
}

.markdown-viewer blockquote:is(.dark *) {
	background-color: #292a30
}

.markdown-viewer blockquote {
	border-left: 5px solid #cccbff;
	font-size: var(--font-size-lesson-markdown, 18px);
	margin: 1.5em .5em;
	padding: 16px 20px
}

.edit-mode .markdown-viewer blockquote {
	margin: 0 .5em;
	padding: 16px 20px
}

.markdown-viewer hr {
	margin: 10px 0
}

.markdown-viewer-rendered-in-toc,
.markdown-viewer-rendered-in-toc strong {
	font-family: var(font-family-heading);
	text-decoration: none
}

.markdown-viewer-rendered-in-toc a {
	display: flex;
	padding-top: 2px;
	font-size: var(--font-size-lesson-markdown);
	text-decoration: none
}

.medium-viewer h1,
.medium-viewer h2,
.medium-viewer h3,
.medium-viewer h4,
.medium-viewer h5,
.medium-viewer h6 {
	color: #0c1322
}

.medium-viewer h1:is(.dark *),
.medium-viewer h2:is(.dark *),
.medium-viewer h3:is(.dark *),
.medium-viewer h4:is(.dark *),
.medium-viewer h5:is(.dark *),
.medium-viewer h6:is(.dark *) {
	color: #c1c2c6
}

.quiz-viewer {
	margin-top: 10px;
	overflow-wrap: break-word;
	word-wrap: break-word;
	max-width: 60vw
}

.quiz-v2-default-option span,
.quiz-v2-explanation .markdown-default p,
.quiz-v2-explanation .markdown-viewer,
.quiz-v2-option .markdown-default p,
.quiz-v2-option .markdown-viewer {
	font-size: calc(var(--font-size-lesson-markdown, 18px) - 4px)
}

.quiz-viewer code:is(.dark *) {
	background-color: #4e505c;
	color: #c1c2c6
}

.markdown-viewer table td p,
.table-md .markdown-default p,
.table-md .markdown-viewer {
	font-size: calc(var(--font-size-lesson-markdown, 14px) - 4px);
	line-height: 1.6;
	margin-block: .2em
}

.table-md .markdown-default {
	color: inherit
}

.markdown-viewer-code-review {
	font-size: 1rem;
	line-height: 1.5rem;
	color: #000
}

.markdown-viewer-code-review:is(.dark *) {
	color: #c1c2c6
}

.markdown-viewer-ai-search {
	margin-top: .75rem;
	cursor: text;
	-webkit-user-select: text;
	-moz-user-select: text;
	user-select: text;
	font-family: var(--font-family-nunito-sans);
	font-size: .875rem;
	line-height: 1.25rem;
	font-weight: 400;
	color: #374151
}

.markdown-viewer-ai-search:is(.dark *) {
	color: #c1c2c6
}

@media (min-width:600px) {
	.markdown-viewer-ai-search {
		font-size: 1rem;
		line-height: 1.5rem
	}
}

.markdown-viewer keyword>meaning {
	display: none
}

.markdown-viewer keyword {
	cursor: pointer;
	border: solid #000;
	border-width: 0 0 2px
}

.markdown-viewer keyword:is(.dark *) {
	border-color: #c1c2c6
}


.markdown-viewer .heading-five,
.markdown-viewer .heading-four,
.markdown-viewer .heading-one,
.markdown-viewer .heading-six,
.markdown-viewer .heading-three,
.markdown-viewer .heading-two,
.markdown-viewer h1,
.markdown-viewer h2,
.markdown-viewer h3,
.markdown-viewer h4,
.markdown-viewer h5,
.markdown-viewer h6 {
	color: #0c1322
}

.markdown-viewer h4 {
	font-size: 1.5rem;
	line-height: 1.5;
}

.markdown-viewer .heading-five:is(.dark *),
.markdown-viewer .heading-four:is(.dark *),
.markdown-viewer .heading-one:is(.dark *),
.markdown-viewer .heading-six:is(.dark *),
.markdown-viewer .heading-three:is(.dark *),
.markdown-viewer .heading-two:is(.dark *),
.markdown-viewer h1:is(.dark *),
.markdown-viewer h2:is(.dark *),
.markdown-viewer h3:is(.dark *),
.markdown-viewer h4:is(.dark *),
.markdown-viewer h5:is(.dark *),
.markdown-viewer h6:is(.dark *) {
	color: #c1c2c6
}

.markdown-viewer .\!heading-five {
	color: #0c1322
}

.markdown-viewer .\!heading-five:is(.dark *) {
	color: #c1c2c6
}

.markdown-default li {
    margin-bottom: 5px;
    margin-top: 0;
}

.no-scrollbar::-webkit-scrollbar {
    display: none;
}

html {
    overscroll-behavior-y: none;
}

.bg-neutral-pressed {
    background-color: #e5e7eb;
}

.bg-gray-bold {
    background-color: #374151;
}

.s-gray-bold {
    border-color: #4b5563;
}

.page_mainContainer {
    display: flex;
    padding: 2rem 8px 3rem;
    align-items: flex-start;
    justify-content: center;
    background-color: #f9fafb;
    min-height: calc(100vh - (var(--header-height) + var(--banner-height)))
}

@media(min-width: 600px) {
    .page_mainContainer {
        padding-top:3rem
    }
}

.page_mainContainer:is(.dark *) {
    background-color: #222327
}

@media(min-width: 1080px) {
    .page_mainContainer {
        padding-top:3.5rem;
        padding-bottom: 3.5rem
    }
}

.page_innerContainer {
    max-width: 1140px;
    width: 100%;
    flex-direction: column;
    display: flex
}

.layout_mainContainer {
    display: grid;
    grid-template-columns: 6rem auto;
    grid-template-rows: auto auto 1fr;
    grid-template-areas: "ed-grid-banner ed-grid-banner" "ed-grid-header ed-grid-header" "ed-grid-sidebar edGridMain";
    margin: 0;
    transition-duration: .4s;
    height: 100%;
    min-height: 100vh;
    overflow: hidden
}

.layout_containerBanner {
    grid-area: ed-grid-banner;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 10
}

.layout_containerHeader {
    grid-area: ed-grid-header;
    position: fixed;
    width: 100%;
    top: var(--banner-height);
    z-index: 10
}

.layout_containerContent {
    grid-area: ed-grid-main;
    transition: left .3s ease-in-out,width .3s ease-in-out;
    width: 100%;
    left: 0;
    position: absolute;
    z-index: 0;
    top: calc(var(--header-height) + var(--banner-height));
    height: calc(100% - (var(--header-height) + var(--banner-height)));
	width: 100%;
}

.Profile_desktopContainer {
    display: none;
    flex-direction: row;
    justify-content: space-between
}

@media(min-width: 1080px) {
    .Profile_desktopContainer {
        display:flex
    }
}

.Profile_mobileContainer {
    display: flex;
    flex-direction: column;
    justify-content: center
}

@media(min-width: 1080px) {
    .Profile_mobileContainer {
        display:none
    }
}

.Profile_searchSectionContainer {
    width: 100%
}

.Profile_searchSection {
    max-width: 100%!important;
    margin: 1rem 0 2rem!important
}

@media(min-width: 600px) {
    .Profile_searchSection {
        margin-top:2rem!important
    }
}

@media(min-width: 1080px) {
    .Profile_searchSection {
        margin-top:3rem!important
    }
}

.Profile_leftContainer {
    display: none;
    flex-direction: row;
    justify-content: flex-start
}

@media(min-width: 1080px) {
    .Profile_leftContainer {
        display:flex
    }
}

.Profile_rightContainer {
    display: none;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-end;
    width: 13.9375rem
}

@media(min-width: 1080px) {
    .Profile_rightContainer {
        display:flex
    }
}

.Profile_imageContainer {
    width: 68px;
    height: 68px
}

.Profile_details {
    display: flex;
    flex-direction: column;
    margin-left: 16px;
    align-items: flex-start;
    text-align: left;
    justify-content: space-between
}

.Profile_header {
    display: flex;
    flex-direction: row;
    align-items: center
}

.Profile_heading {
    color: #0c1322;
    font-size: 32px;
    line-height: 40px;
    font-weight: 700;
    margin-bottom: 0
}

.Profile_heading:is(.dark *) {
    color: #ededee
}

.Profile_headerText {
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 400;
    color: #374151
}

.Profile_headerText:is(.dark *) {
    color: #d2d3d6
}

.Profile_ContentText {
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 400;
    padding-top: 8px
}

.ProfileCTA_containedPrimary {
    background-color: #5553ff;
    color: #fff;
    border-radius: .25rem;
    padding: .625rem .875rem;
    height: 2.75rem
}

.ProfileCTA_containedPrimary:is(.dark *) {
    background-color: #4747b3
}

.ProfileCTA_containedPrimary:hover:enabled {
    background-color: #3d3bb7
}

.ProfileCTA_containedPrimary:hover:enabled:is(.dark *) {
    background-color: #6969c3
}

.ProfileCTA_containedPrimary:disabled {
    background-color: #cccbff;
    color: #fff
}

.ProfileCTA_containedPrimary:disabled:is(.dark *) {
    background-color: #4d4a5e;
    color: #1a191f
}

.ProfileCTA_outlinedPrimary {
    border-radius: .25rem;
    padding: .625rem .875rem;
    height: 2.75rem;
    border: 1px solid rgba(85,83,255,.5);
    background-color: transparent;
    color: #5553ff
}

.ProfileCTA_outlinedPrimary:is(.dark *) {
    border-color: #7775ff;
    color: #cccbff
}

.ProfileCTA_outlinedPrimary:hover:enabled {
    background-color: rgba(85,83,255,.04);
    border-color: #5553ff
}

.ProfileCTA_outlinedPrimary:hover:enabled:is(.dark *) {
    border-color: #7775ff;
    background-color: #41434e
}

.ProfileCTA_outlinedPrimary:disabled {
    border-color: #d1d5db;
    background-color: #f9fafb;
    color: #d1d5db
}

.ProfileCTA_outlinedPrimary:disabled:is(.dark *) {
    border-color: #6a6c78;
    background-color: transparent;
    color: #6a6c78
}

.TabButtons_container {
    display: flex;
    flex-direction: row;
    max-width: 73.25rem;
    width: 100%;
    overflow-x: auto;
    white-space: nowrap;
    justify-self: center;
    height: 2.75rem;
    margin-top: 0;
    -ms-overflow-style: none;
    scrollbar-width: none
}

@media(min-width: 1080px) {
    .TabButtons_container {
        margin-top:2rem
    }
}

.TabButtons_containerLoading {
    display: flex;
    flex-direction: row;
    max-width: 73.25rem;
    width: 100%;
    overflow-x: auto;
    white-space: nowrap;
    justify-self: center;
    height: 2.75rem;
    margin-top: 0;
    -ms-overflow-style: none;
    scrollbar-width: none;
    background-color: #e5e7eb
}

@media(min-width: 1080px) {
    .TabButtons_containerLoading {
        margin-top:2rem
    }
}

.TabButtons_containerLoading:is(.dark *) {
    background-color: #4e505c
}

.TabButtons_containerInner {
    border-bottom: .0625rem solid #e5e7eb;
    width: 100%
}

.TabButtons_containerInner:is(.dark *) {
    border-bottom-color: #4e505c
}

.TabButtons_container::-webkit-scrollbar {
    display: none
}

.TabButtons_text {
    color: #6b7280;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5rem
}

.TabButtons_text:is(.dark *) {
    color: #7f818b
}

.TabButtons_textActive {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5rem;
    color: #0c1322
}

.TabButtons_textActive:is(.dark *) {
    color: #ededee
}

.TabButtons_button {
    padding: .625rem 1rem;
    border-radius: unset;
    border-bottom: .0625rem solid #e5e7eb;
    color: #0c1322
}

.TabButtons_button:is(.dark *) {
    color: #ededee;
    border-bottom-color: #4e505c
}

.TabButtons_button:is(.dark *):hover {
    border-bottom-color: #4e505c
}

.TabButtons_button:hover {
    border-bottom: .0625rem solid #e5e7eb
}

.TabButtons_buttonActive {
    padding: .625rem 1rem;
    border-radius: unset;
    color: #0c1322;
    border-bottom: .125rem solid #5553ff
}

.TabButtons_buttonActive:is(.dark *) {
    color: #ededee;
    border-bottom-color: #aaa9ff
}

.TabButtons_buttonActive:is(.dark *):hover {
    border-bottom-color: #aaa9ff
}

.TabButtons_buttonActive:hover {
    border-bottom: .125rem solid #5553ff
}

.TabButtons_pillText {
    border: 1px solid #7775ff;
    background-color: #f8f8ff;
    border-radius: 30px;
    padding: 4px 12px;
    color: #0c1322;
    margin-left: 8px;
    font-size: 12px;
    line-height: 18px;
    font-weight: 400
}

.TabButtons_pillText:is(.dark *) {
    color: #f3f4f6;
    border-color: #7775ff;
    background-color: #373942
}

.RecentlyViewed_container {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 2rem;
    height: 22.125rem;
    padding-bottom: 1.25rem;
    margin-bottom: 1rem
}

.RecentlyViewed_headerContainer {
    display: flex;
    flex-direction: row;
    width: 100%;
    align-items: center;
    justify-content: space-between
}

.RecentlyViewed_headingContainer {
    display: flex;
    flex-direction: row
}

.RecentlyViewed_icon {
    height: 1.25rem;
    width: 1.25rem;
    color: #5553ff
}

.RecentlyViewed_icon:is(.dark *) {
    color: #aaa9ff
}

.RecentlyViewed_iconBackground {
    height: 2.5rem;
    width: 2.5rem;
    border-radius: .625rem solid #eef;
    border-radius: 999rem;
    background-color: #eef;
    display: flex;
    justify-content: center;
    align-items: center;
    fill: #5553ff
}

.RecentlyViewed_iconBackground:is(.dark *) {
    fill: #aaa9ff;
    border-radius: .625rem solid #373942;
    background-color: #373942
}

.RecentlyViewed_headingText {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.5rem;
    margin-left: .5rem;
    align-content: center;
    color: #374151
}

@media(min-width: 600px) {
    .RecentlyViewed_headingText {
        font-size:1.5rem;
        line-height: 2rem
    }
}

.RecentlyViewed_headingText:is(.dark *) {
    color: #d2d3d6
}

.RecentlyViewed_viewAllContainer {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: .5rem 1rem;
    border-radius: .5rem
}

.RecentlyViewed_viewAllContainer:hover {
    background-color: #e5e7eb
}

.RecentlyViewed_viewAllContainer:hover:is(.dark *) {
    background-color: #4d4a5e
}

.RecentlyViewed_viewAllText {
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 700;
    color: #0c1322
}

.RecentlyViewed_viewAllText:is(.dark *) {
    color: #ededee
}


.Carousel_navigationButton {
    display: none;
    z-index: 10;
    justify-content: center;
    align-items: center;
    border-radius: 9999px;
    border: 1px solid #cccbff;
    width: 2.5rem;
    height: 2.5rem;
    transition-property: all;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: .3s;
    pointer-events: auto;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)
}

.Carousel_navigationButton:is(.dark *) {
    border-color: #41434e
}

@media(min-width: 600px) {
    .Carousel_navigationButton {
        width:3rem;
        height: 3rem;
        display: flex
    }
}

.Carousel_navigationButtonLeftPosition {
    left: -1.25rem
}

.Carousel_navigationButtonRightPosition {
    right: -1.25rem
}

.Carousel_navigationButtonDisabled {
    cursor: not-allowed;
    background-color: #d1d5db
}

.Carousel_navigationButtonEnabled {
    background-color: #fff;
    cursor: pointer
}

.Carousel_navigationButtonEnabled:is(.dark *) {
    background-color: #373942
}

.Carousel_navigationButtonEnabled:hover {
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
    background-color: #f9fafb
}

.Carousel_navigationButtonEnabled:hover:is(.dark *) {
    background-color: #303239
}

.Carousel_downArrowIcon {
    width: 1.5rem;
    height: 1.5rem;
    color: #3d3bb7
}

.Carousel_downArrowIcon:is(.dark *) {
    color: #eef
}

.Carousel_rotateRight {
    transform: translate(0) rotate(90deg) skewX(0) skewY(0) scaleX(1) scaleY(1)
}

.Carousel_rotateLeft {
    transform: translate(0) rotate(-90deg) skewX(0) skewY(0) scaleX(1) scaleY(1)
}

.Carousel_pillContainer {
    display: flex;
    margin-right: auto;
    margin-left: auto;
    margin-top: 1.25rem;
    width: -moz-max-content;
    width: max-content;
    height: .25rem;
    -moz-column-gap: .375rem;
    column-gap: .375rem
}

.Carousel_activePill {
    background-color: #5553ff
}

.Carousel_activePill:is(.dark *) {
    background-color: #cccbff
}

.Carousel_inactivePill {
    background-color: #cccbff
}

.Carousel_inactivePill:is(.dark *) {
    background-color: #4e505c
}

.Carousel_pill {
    border-radius: .25rem;
    width: .75rem;
    height: .25rem;
    cursor: pointer
}

.Carousel_carousel {
    position: relative;
    width: 100%
}

.Carousel_childrenWrapper {
    display: flex;
    overflow-x: hidden;
    padding-top: 1rem;
    padding-bottom: 2rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem
}

.Carousel_navigationButtonWrapper {
    position: absolute;
    display: flex;
    top: 50%;
    right: 50%;
    justify-content: space-between;
    pointer-events: none;
    --tw-translate-x: 50%;
    --tw-translate-y: -50%;
    transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(0) skewX(0) skewY(0) scaleX(1) scaleY(1);
    width: 95vw
}

@media(min-width: 600px) {
    .Carousel_navigationButtonWrapper {
        width:97vw
    }
}

@media(min-width: 1080px) {
    .Carousel_centerAlignChildren {
        justify-content:center
    }
}

.RecommendedForYou_svgContainer {
    width: 2.5rem;
    height: 2.5rem;
    background-color: #eef;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%
}

.RecommendedForYou_svg {
    fill: #5553ff
}

.RecommendedForYou_svg:is(.dark *) {
    fill: #aaa9ff
}

.CourseTile_tileIconDimensions {
    width: 1.25rem;
    height: 1.25rem
}

.CourseTile_tileIconDimensionsV2 {
    width: 1rem;
    height: 1rem
}

.ProfileMenu_image {
    flex-shrink: 0;
    border-radius: 9999px;
    background-color: #d1d5db
}

.ProfileMenu_image:is(.dark *) {
    background-color: #6a6c78
}

.RecentlyViewed_iconBackground {
    height: 2.5rem;
    width: 2.5rem;
    border-radius: .625rem solid #eef;
    border-radius: 999rem;
    background-color: #eef;
    display: flex;
    justify-content: center;
    align-items: center;
    fill: #5553ff
}

.RecentlyViewed_icon {
    height: 1.25rem;
    width: 1.25rem;
    color: #5553ff
}

.RecentlyViewed_icon:is(.dark *) {
    color: #aaa9ff
}