1 line
10 KiB
CSS
1 line
10 KiB
CSS
@font-face{font-family:glacial;src:url(/assets/fonts/glacialindifference-regular-webfont.woff2) format("woff2"),url(/assets/fonts/glacialindifference-regular-webfont.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:glacial;src:url(/assets/fonts/glacialindifference-bold-webfont.woff2) format("woff2"),url(/assets/fonts/glacialindifference-bold-webfont.woff) format("woff");font-weight:700;font-style:normal;font-display:swap}html{font-size:62.5%;font-size:.625em;scroll-behavior:smooth}*,:after,:before,html{box-sizing:border-box}body{margin:0;font-size:2rem;font-family:glacial,Helvetica,Arial,sans-serif;font-weight:400;font-style:normal;line-height:1.3;-moz-font-smoothing:antialiased;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;color:#222;background-color:#fff}section{padding-left:20px;padding-right:20px}h1{font-size:5.2rem}h2{font-size:4rem;font-weight:400}h2,h3{font-family:glacial,Arial,sans-serif}h3{font-size:3.6rem;text-transform:uppercase;color:#a6bf26;color:var(--green)}h3,h4{font-weight:700}h4{font-size:2.2rem}h1,h2,h3,h4,h5,h6{margin:0;padding:0;text-decoration:none}b,strong{font-family:glacial,Arial,sans-serif;font-style:normal;font-weight:700}img,svg{max-width:100%;height:auto}a,a:visited{text-decoration:underline}a:hover{text-decoration:none}a:visited{color:#a6bf26;color:var(--green)}li{list-style-type:none}li,ul{padding:0;margin:0}@media screen and (min-width:768px;){h1{font-size:6rem}h2{font-size:4rem}h3{font-size:3.8rem}}.u-ff-book{font-weight:400}.u-ff-bold,.u-ff-book{font-family:glacial,Arial,Helvetica,sans-serif;font-style:normal}.u-ff-bold{font-weight:700}.u-ttu{text-transform:uppercase}.u-fs-18{font-size:1.8rem}.u-fs-20{font-size:2rem}.u-fs-22{font-size:2.2rem}.u-fs-30{font-size:3rem}.u-fs-36{font-size:3.6rem}.u-fs-40{font-size:4rem}.u-fs-52{font-size:5.2rem}.u-fs-60{font-size:6rem}.u-lh-1{line-height:1}.u-lh-25{line-height:2.5rem}.u-lh-26{line-height:2.6rem}.u-lh-37{line-height:3.7rem}.u-lh-40{line-height:4rem}@media (min-width:1024px){.u-fs-l-18{font-size:1.8rem}.u-fs-l-20{font-size:2rem}.u-fs-l-22{font-size:2.2rem}.u-fs-l-30{font-size:3rem}.u-fs-l-36{font-size:3.6rem}.u-fs-l-60{font-size:6rem}}:root{--purple:#3f3d56;--green:#a6bf26;--grey:#e5e5e5;--dark:#222;--white:#fff}.bg-green{background-color:#a6bf26}.bg-grey{background-color:#e5e5e5}.bg-white{background-color:#fff}.bg-purple{background-color:#3f3d56}.bg-dark{background-color:#222}.color-green{color:#a6bf26}.color-white{color:#fff}.color-purple{color:#3f3d56}.color-dark{color:#222}.border-green{border-color:#a6bf26}.border-white{border-color:#fff}.border-purple{border-color:#3f3d56}.border-dark{border-color:#222}.cta,.cta:visited{padding:16px 50px;margin:10px auto;overflow:hidden;display:block;position:relative;width:235px;max-width:300px;border:2px solid #fff;font-family:glacial,Arial,sans-serif;font-weight:700;font-size:2.2rem;line-height:2.6rem;text-decoration:none;z-index:0;color:#fff;color:var(--white);background:none;transition:color .3s}.cta-revert,.cta-revert:visited{color:#3f3d56;color:var(--purple);background:#fff}.cta-full,.cta-full:visited{color:#fff;background:#3f3d56;background:var(--purple);border:2px solid #3f3d56;border:2px solid var(--purple)}.cta:focus,.cta:hover{color:#3f3d56;color:var(--purple)}.cta:before{background:#a6bf26;background:var(--green)}.cta:after{background:#fff}.cta-revert:focus,.cta-revert:hover{color:#fff}.cta-revert:before{background:#a6bf26;background:var(--green)}.cta-revert:after{background:#3f3d56;background:var(--purple)}.cta:after,.cta:before{content:"";position:absolute;height:100%;width:100%;bottom:100%;left:0;z-index:-1;transition:transform .3s;transition-timing-function:ease;transition-timing-function:cubic-bezier(.75,0,.125,1)}.cta:focus:after,.cta:focus:before,.cta:hover:after,.cta:hover:before{transform:translate3d(0,100%,0)}.cta:focus:after,.cta:hover:after{transition-delay:.175s}.menu{position:fixed;top:0;right:0;text-align:right;width:100vw;background-color:#3f3d56;background-color:var(--purple);z-index:1000}.menu__label{position:absolute;top:0;right:0;font-size:4rem;opacity:1;color:#a6bf26;color:var(--green);z-index:999;transition:opacity .2s ease-in-out}.menu__label--close{font-size:6rem;color:#a6bf26;color:var(--green)}.menu__burger{display:inline-block}.menu__links{list-style-type:none;margin:0;padding:20px;display:flex;flex-flow:column nowrap;justify-content:center;position:absolute;top:-50%;left:50%;height:100vh;width:100vw;transform:translate(-50%,-100%);text-align:center;transition:transform .4s ease-in-out;z-index:99}.menu__link{display:block;padding:10px;font-size:3rem;color:#fff;color:var(--white);transition:color .2s ease-in-out}.menu__link:visited{color:#fff}.menu__link:focus,.menu__link:hover{color:#a6bf26;color:var(--green);transition:color .2s ease-in-out}.menu__link:active{border-bottom:1px solid #fff}.menu input:focus+.menu__label{color:#222;color:var(--dark);transition:color .2s ease-in-out}.menu input:checked+.menu__label{opacity:0;transition:opacity .2s ease-in-out}.menu input:checked~.menu__links{top:0;transform:translate(-50%);transition:transform .4s ease-in-out}.menu__links:focus-within{top:0;transform:translate(-50%);transition:transform .4s ease-in-out}@media screen and (min-width:768px){.menu__label{border:0!important;clip:rect(1px,1px,1px,1px)!important;height:1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;width:1px!important}.menu__links{position:static;transform:none;width:auto;height:auto;flex-flow:row wrap;justify-content:flex-end;max-width:1004px;margin:0 auto}.menu__links:focus-within{transform:none}.menu__link{font-size:2rem}.menu__label--close{border:0!important;clip:rect(1px,1px,1px,1px)!important;height:1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;width:1px!important}}.intro{padding:60px 20px;background-color:#3f3d56;background-color:var(--purple)}.intro__icon{display:none}.intro__title{text-align:center}.intro__title a{font-size:5.2rem;font-weight:700;text-decoration:none;color:#a6bf26;color:var(--green)}.intro__subtitle{margin:40px 0;color:#fff;color:var(--white)}.intro__links,.intro__subtitle{text-align:center}.intro__image{display:none}@media (min-width:768px){.intro{margin-top:86px;padding:40px 20px}.intro__container{min-height:80vh;max-width:1004px;margin:0 auto;display:flex;flex-flow:row wrap;justify-content:center;align-items:center}.intro__content{width:33.333%}.intro__icon{display:block}.intro__title{text-align:left;font-size:6rem;transform-origin:top left;transition:transform .4s ease}.intro__title.isMoved{position:fixed;top:24px;z-index:1001;transform:scale(.5)}.intro__links,.intro__subtitle{text-align:left}.cta,.cta:visited{margin:10px 0}.intro__image{display:block;width:66.666%}}.push{padding:60px 20px 30px}.push__container{margin-top:40px}.push__card{margin:40px 0;padding:20px;text-align:center;border:2px solid #3f3d56;border-color:var(--purple)}.push__subtitle{margin-top:10px;color:#a6bf26;color:var(--green)}.push__description{color:#3f3d56;color:var(--purple)}.push__cta{max-width:200px;font-family:glacial;font-size:2rem;line-height:2.4rem;padding:8px 20px;margin:0 auto}@media (min-width:768px){.push{padding:0 20px}.push__text{max-width:834px;margin:100px auto 60px}.push__container{max-width:1004px;margin:0 auto 100px;display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));justify-items:center;grid-gap:20px}.push__card{max-width:320px;display:flex;flex-flow:column nowrap;align-items:center;margin:0}.push__cta{display:block;margin-top:auto}}@media (min-width:768px) and (max-width:1024px){.push__card:last-child{grid-column:span 2}}.how{padding:60px 0;display:flex;flex-flow:column-reverse wrap;background-color:#e5e5e5;background-color:var(--grey)}.how__text{padding-left:20px;padding-right:20px}.how__text li{list-style-type:disc}.how__text ul{padding-left:30px}.how__illustration{background-image:url(../img/svg/code.svg);background-position:50% 50%;background-repeat:no-repeat;height:320px;background-size:contain}@media (min-width:768px){.how{flex-flow:row nowrap}.how__text{max-width:50%;flex:0 1 500px}.how__illustration{background-position:right 50%;max-width:50%;flex:1 1 100%;height:auto}}.prefooter{padding:0;margin:60px 0}.prefooter__title{text-align:center}.prefooter__text{margin-top:40px;padding-left:20px;padding-right:20px}.prefooter__link,.prefooter__link:visited{margin:0 auto 30px;padding:20px 15px;display:block;position:relative;max-width:236px;text-decoration:none;text-align:center;list-style-type:none;color:#3f3d56;color:var(--purple)}.prefooter__link:after{content:"";position:absolute;top:0;left:0;bottom:0;width:100%;border:2px solid #3f3d56;border:2px solid var(--purple);transition:transform .3s ease-in-out}.prefooter__link:focus:after,.prefooter__link:hover:after{transform:scale(1.05)}.prefooter__title{margin-bottom:30px}@media (min-width:600px) and (max-width:1024px){.prefooter__links{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));grid-template-rows:repeat(2,1fr);align-items:center;justify-items:center;grid-gap:20px;max-width:1004px;margin:0 auto}.prefooter__link:nth-child(odd){grid-column:span 1;justify-self:end}.prefooter__link:nth-child(2n){grid-column:span 1;justify-self:start}}@media (min-width:768px){.prefooter{margin-bottom:70px}.prefooter__blog{justify-content:center;margin-bottom:80px;margin-top:80px}.prefooter__text{padding:0 20px;max-width:1004px;margin:0 auto}.prefooter__link{margin:0}}@media (min-width:1024px){.prefooter__links{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));align-items:center;justify-items:center;grid-gap:20px;max-width:1004px;margin:0 auto}}.footer{padding:40px 20px}.footer__links{display:flex;flex-flow:row wrap;justify-content:space-between;align-items:center;max-width:1004px;margin:0 auto}.footer__category{width:130px;margin:10px 0;color:#fff;color:var(--white)}.footer__link{text-transform:capitalize;line-height:2}.footer__link,.footer__link:visited{color:#fff;color:var(--white)}.visually_hidden{border:0!important;clip:rect(1px,1px,1px,1px)!important;height:1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;width:1px!important}.u-block-center{margin-left:auto;margin-right:auto}.u-tac{text-align:center}.u-tar{text-align:right}.u-tal{text-align:left}.u-p-0{padding:0} |