.curriculum-content-container.curriculum-module{.curriculum-content{>header{column-gap:1.5rem;display:grid;grid-template-areas:". group" "icon heading" "icon category";justify-content:flex-start;.topic-icon{--background-primary:var(--curriculum-bg-color-topic);align-self:flex-start;grid-area:icon;height:4rem;width:4rem;+h1{grid-area:heading;margin-bottom:0}}p.module-topic{color:var(--curriculum-color-topic);font-size:var(--font-size-normal);grid-area:category;margin:.5rem 0 0;&:before{content:"Category: "}}p.module-group{align-self:center;background-color:var(--curriculum-module-label-bg-color);border-radius:var(--elem-radius);color:var(--curriculum-module-label-color);font-size:var(--font-size-normal);grid-area:group;height:max-content;margin:0 0 .25rem;padding:.125rem .5rem;width:fit-content}}p.curriculum-resources{margin-bottom:.5rem;margin-top:2rem;+ul{padding-left:2rem;>li{list-style-image:var(--curriculum-module-mdn-resource);&.curriculum-external-li{list-style-image:url(/static/client/curriculum-ext-resource.005256e5fe85ee0d.svg)}em{background:var(--curriculum-bg-color);border-radius:1em;color:var(--color-text-primary);display:inline-block;font-size:.5rem;font-weight:700;line-height:var(--font-line-content);padding:0 .4em;text-rendering:optimizelegibility;text-transform:uppercase;vertical-align:super}}}}}}.curriculum-partner-banner-container{.partner-banner{background-color:var(--curriculum-bg-color-partner);background-image:var(--curriculum-bg-image-partner);background-repeat:no-repeat;border:1px solid var(--curriculum-border-color);box-shadow:var(--curriculum-shadow);display:grid;grid-template-areas:"h2" "image" "p" "a";margin:1rem auto;@media screen and (width > 769px){grid-template-areas:"copy image";grid-template-columns:2fr minmax(24rem,1fr)}>mdn-themed-image{align-self:end;grid-area:image;height:max-content;justify-self:center;max-width:max-content;width:90%;@media screen and (width > 769px){justify-self:end;width:100%}}>section{display:contents;grid-area:copy;padding:2rem 4rem;@media screen and (width > 769px){display:block}>h2{grid-area:h2;margin:1rem 0 2rem;text-align:center;@media screen and (width > 769px){margin-bottom:1rem;margin-left:0;margin-right:0;margin-top:0;text-align:left}>a{color:var(--curriculum-category-color);display:inline-block;min-width:max-content;&:visited:not([href^="#"]){color:var(--curriculum-category-color)}&:before{content:url(/static/client/curriculum-partner-underline-small.31ec7eb95e7e9df4.svg);position:absolute;transform:translate3d(-.1em,.4em,0);@media screen and (width > 769px){content:url(/static/client/curriculum-partner-underline-large.5ffe8085be3878f0.svg)}}&:focus,&:hover,&:visited{-webkit-text-decoration:none;text-decoration:none;&:before{content:none}}&:after{background-color:var(--curriculum-category-color);height:.625em;width:.625em}}}>p{grid-area:p;margin:1.5rem 1rem;@media screen and (width > 769px){margin-bottom:1.5rem;margin-left:0;margin-right:0;margin-top:1rem}}>a{color:var(--color-text-primary);grid-area:a;margin:1rem;@media screen and (width > 769px){margin-bottom:0;margin-left:0;margin-right:0;margin-top:1rem}}}}}.curriculum-content-container.curriculum-landing{background-color:var(--color-background-page);margin:0;max-width:100%;padding:0;width:100%;article{>header,>section{margin:0 auto 3rem;max-width:min(var(--max-width),74rem);padding-left:var(--gutter);padding-right:var(--gutter);width:100%}}.curriculum-content{padding-top:0;ol.modules-list{grid-template-columns:1fr 1fr 1fr 1fr;@media (width <= 426px){grid-template-columns:1fr}@media (width > 426px){grid-template-columns:1fr 1fr}@media (width > 992px){grid-template-columns:1fr 1fr 1fr}@media (width > 1200px){grid-template-columns:1fr 1fr 1fr 1fr}}}header.landing-header{display:grid;grid-template-areas:"copy" "svg";@media (width > 769px){grid-template-areas:"copy svg";grid-template-columns:30rem auto}>svg{align-self:end;grid-area:svg;justify-self:end;margin-bottom:3rem;max-width:28rem;width:100%;z-index:1;@media (width > 769px){margin-bottom:0}#icons-bg{fill:var(--curriculum-bg-color-landing-top-icon)}.laptop{fill:var(--curriculum-color-landing-laptop)}}>section{grid-area:copy;margin-right:auto;margin-top:3rem;max-width:30rem;padding-right:1rem;@media (width > 769px){margin-bottom:4rem}h1{color:var(--curriculum-color-topic);font-size:var(--font-size-larger);margin-bottom:.5rem;@media (width > 769px){font-size:var(--font-size-largest)}}h2{font-size:var(--font-size-large);margin-bottom:1.5rem;margin-top:.5rem;@media (width > 769px){font-size:var(--font-size-larger);margin-bottom:2rem}}p{color:var(--color-text-secondary)}}}.landing-about-container{background-color:var(--curriculum-bg-large-color);margin:-6rem 0 0;max-width:100%;.landing-about{display:grid;grid-template-areas:"li" "h2" "p1" "p2" "p3" "p4" "scrim";grid-template-columns:1fr;margin:0 auto 3rem;max-width:min(var(--max-width),74rem);@media (width > 992px){column-gap:1rem;grid-template-areas:"li li    li " "h2 .     scrim" "p1 .     scrim" "p2 .     scrim" "p3 arrow scrim" "p4 arrow scrim";grid-template-columns:1fr 7rem 24rem}h2{grid-area:h2;margin:1rem 0}>div.about-content{display:contents;ul{align-items:start;background-color:var(--curriculum-bg-color-landing-about-ul);border-radius:var(--elem-radius);box-shadow:var(--curriculum-shadow-landing-about-ul);color:var(--color-text-secondary);display:grid;grid-area:li;grid-template-columns:auto auto auto;justify-content:center;margin:auto;min-height:5rem;padding:1rem;transform:translateY(-1rem);width:100%;@media (width > 426px){align-items:center;gap:1rem}@media (width > 769px){justify-content:start}@media (width > 992px){justify-content:center}>li{margin:0 .5rem;text-align:center;@media (width > 426px){margin-bottom:0;margin-left:1rem;margin-right:1rem;margin-top:0;width:max-content}@media (width > 769px){align-items:center;display:inline-flex;gap:1rem}&:before{display:block;height:3rem;margin:0 auto;width:3rem;@media (width > 769px){display:initial;margin-bottom:0;margin-left:0;margin-right:0;margin-top:0}}&:first-child:before{content:var(--curriculum-landing-about-beginner)}&:nth-child(2):before{content:var(--curriculum-landing-about-pace)}&:nth-child(3):before{content:var(--curriculum-landing-about-free)}}}p{align-items:center;color:var(--color-text-secondary);display:grid;grid-template-columns:auto auto;justify-content:start;margin:1rem 0;&:before{align-self:start;display:block;height:4rem;width:4rem}&:nth-child(2){grid-area:p1;&:before{content:var(--curriculum-landing-about-bullet)}}&:nth-child(3){grid-area:p2;&:before{content:var(--curriculum-landing-about-bullet)}}&:nth-child(4){grid-area:p3;&:before{content:var(--curriculum-landing-about-bullet)}}&:nth-child(5){grid-area:p4;a{font-weight:var(--font-weight-bold);margin-left:4rem;-webkit-text-decoration:underline;text-decoration:underline;&:active,&:hover{-webkit-text-decoration:none;text-decoration:none}}}}}>div.arrow{background-image:var(--curriculum-landing-arrow);background-position:50%;background-repeat:no-repeat;grid-area:arrow}.scrim-wrapper{display:flex;flex-direction:column;grid-area:scrim;justify-content:center;justify-self:center;margin-top:1rem;max-width:24rem;@media (width > 992px){justify-self:end;margin-top:0}.scrim-border{background-image:var(--curriculum-scrim-bg);background-position:100% 100%;background-repeat:no-repeat;height:16rem;width:100%}mdn-scrim-inline{background:#000;display:block;height:14.25rem;max-width:calc(100vw - var(--gutter)*2);width:22rem}p{margin:0;padding:1rem 0}}}}.landing-stairway{background-color:var(--color-background-secondary);margin:0;max-width:100%;>div{color:var(--color-text-secondary);display:grid;grid-template-areas:"a" "b";grid-template-columns:auto;grid-template-rows:auto auto;justify-content:center;margin:0 auto 3rem;max-width:min(var(--max-width),74rem);padding:2rem;padding-left:var(--gutter);padding-right:var(--gutter);width:100%;@media (width > 769px){grid-template-columns:min(100%,34rem)}@media (width > 992px){grid-template-areas:"a b";grid-template-columns:1fr 1.4fr}svg{width:100%}>#stairway1-container{--fs:clamp(1rem,3vw,1.75rem);grid-area:a;margin:0;position:relative;transform:translateX(2vw);width:100%;@media (width > 992px){--fs:clamp(1rem,2vw,1.75rem)}#stairway1{font-size:var(--fs);left:32%;position:absolute;top:18%;>span{display:block;line-height:calc(var(--fs)*1.25);text-wrap:nowrap;width:max-content}.color{color:var(--curriculum-color)}}}>#stairway2-container{--fs:clamp(0.75rem,1.25vw,1rem);grid-area:b;position:relative;transform:translateX(-5vw);@media (width > 769px){--fs:clamp(0.75rem,1vw,0.825rem)}#stairway2{font-size:var(--fs);height:100%;left:0;margin:0;position:absolute;top:0;width:calc(100% + 5vw);>span{display:block;line-height:calc(var(--fs)*1.25);max-width:10rem;position:absolute;text-wrap:wrap;@media (width > 769px){max-width:none;text-wrap:nowrap}}#stair-1{left:47%;top:36%}#stair-2{left:33%;top:52%}#stair-3{left:23%;top:71%}#stair-4{left:8%;top:86%}@media (width > 769px){#stair-1{left:35%;top:53%}#stair-2{left:27%;top:65%}#stair-3{left:13%;top:77%}#stair-4{left:0;top:90%}}}>svg{&#stairway2large{display:none;grid-area:b;@media (width > 769px){display:initial}}&#stairway2small{grid-area:b;max-width:100%;@media (width > 769px){display:none}}}}}}#dont_know_where_toget_started{line-height:3rem;margin:1rem auto 5rem;text-align:center;width:fit-content;&:after{content:url(/static/client/curriculum-started-underline.dcade6cbeb5069df.svg);position:absolute;transform:translate3d(-6em,1.25rem,0);width:6em}~div{>ul{display:grid;gap:1rem;grid-template-areas:"beginner" "advanced" "employ" "educator";margin:0 auto;max-width:52rem;overflow:clip;scroll-snap-type:inline mandatory;@media (width > 769px){gap:5rem 4rem;grid-template-areas:"beginner advanced" "employ educator";grid-template-columns:auto auto}@media (width > 992px){gap:5rem 8rem}>li{align-items:center;background-color:var(--curriculum-bg-large-color);border-radius:var(--elem-radius);color:var(--color-text-secondary);display:grid;gap:1rem;grid-template-areas:"i h" "p p" "c c";grid-template-columns:3rem 1fr;grid-template-rows:4rem minmax(2rem,max-content) max-content;height:max-content;padding:1rem .5rem;scroll-snap-align:center;@media (width > 769px){align-items:start;background-color:initial;gap:1rem 2rem;grid-template-areas:"i h" "i p" "i c";grid-template-columns:auto auto;grid-template-rows:4rem auto max-content;height:auto;padding-bottom:0;padding-left:0;padding-right:0;padding-top:0;width:auto}&:before{align-self:start;display:inline-block;height:3rem;width:3rem;@media (width > 769px){grid-area:i;height:5rem;width:5rem}}&:first-child:before{content:var(--curriculum-landing-started-beginner)}&:nth-child(2):before{content:var(--curriculum-landing-started-advanced)}&:nth-child(3):before{content:var(--curriculum-landing-started-employment)}&:nth-child(4):before{content:var(--curriculum-landing-started-educator)}h3{color:var(--color-text-primary);font-weight:var(--font-weight-bold);grid-area:h;line-height:var(--font-line-normal);margin-top:0}p:nth-child(2){grid-area:p}p:nth-child(3){grid-area:c}em{align-self:start;grid-area:p}a{--csstools-light-dark-toggle-056fde8d-0:var(--csstools-color-scheme--light) #fff;--button-bg--default:var(--csstools-light-dark-toggle-056fde8d-0,#1b1b1b);--csstools-light-dark-toggle-056fde8d-1:var(--csstools-color-scheme--light) #cdcdcd;--button-bg-hover--default:var(--csstools-light-dark-toggle-056fde8d-1,#696969);--csstools-light-dark-toggle-056fde8d-2:var(--csstools-color-scheme--light) #9e9e9e;--button-bg-active--default:var(--csstools-light-dark-toggle-056fde8d-2,#9e9e9e);--csstools-light-dark-toggle-056fde8d-3:var(--csstools-color-scheme--light) #fff;--button-border-color--default:var(--csstools-light-dark-toggle-056fde8d-3,#1d1d1d);--button-color--default:var(--color-background-primary);--button-bg:var(--button-bg--default);--button-bg-hover:var(--button-bg-hover--default);--button-bg-active:var(--button-bg-active--default);--button-border-color:var(--button-border-color--default);--button-height:2rem;--button-color:var(--button-color--default);--button-radius:var(--elem-radius,0.25rem);align-items:center;background-color:var(--button-bg);border:1px solid var(--button-border-color);border-radius:var(--button-radius);color:var(--button-color);cursor:pointer;display:flex;font-size:var(--font-size-small);font-weight:var(--font-weight-bold);gap:.25rem;grid-area:c;justify-content:center;justify-self:center;min-height:var(--button-height);padding:.5rem;padding-left:var(--button-padding);padding-right:var(--button-padding);position:relative;text-align:center;-webkit-text-decoration:none;text-decoration:none;width:fit-content;@media (width > 769px){justify-self:start}&:hover{background-color:var(--button-bg-hover,var(--button-bg))}@supports not (color:light-dark(tan,tan)){& *{--csstools-light-dark-toggle-056fde8d-0:var(--csstools-color-scheme--light) #fff;--button-bg--default:var(--csstools-light-dark-toggle-056fde8d-0,#1b1b1b);--csstools-light-dark-toggle-056fde8d-1:var(--csstools-color-scheme--light) #cdcdcd;--button-bg-hover--default:var(--csstools-light-dark-toggle-056fde8d-1,#696969);--csstools-light-dark-toggle-056fde8d-2:var(--csstools-color-scheme--light) #9e9e9e;--button-bg-active--default:var(--csstools-light-dark-toggle-056fde8d-2,#9e9e9e);--csstools-light-dark-toggle-056fde8d-3:var(--csstools-color-scheme--light) #fff;--button-border-color--default:var(--csstools-light-dark-toggle-056fde8d-3,#1d1d1d)}}}@supports (color:light-dark(red,red)){a{--button-bg--default:light-dark(#1b1b1b,#fff);--button-bg-hover--default:light-dark(#696969,#cdcdcd);--button-bg-active--default:light-dark(#9e9e9e,#9e9e9e);--button-border-color--default:light-dark(#1d1d1d,#fff)}}}}}}}
/*# sourceMappingURL=styles-curriculum-landing.1f6943e1d3f1acf3.css.map*/