mirror of
https://github.com/jlengrand/irma-website.git
synced 2026-03-10 08:21:20 +00:00
10 lines
14 KiB
CSS
10 lines
14 KiB
CSS
/*
|
|
Put any CSS resets here, or use a CSS reset: https://cssreset.com/
|
|
*/*{box-sizing:border-box;margin:0;padding:0}:root{
|
|
/* Colors */}h1{font-size:48px;font-size:3rem;font-weight:700;letter-spacing:-1.6px;letter-spacing:-0.1rem;line-height:1}h1 span.light{font-weight:300}h2{font-size:32px;font-size:2rem;font-weight:700}h2 span.light{font-weight:300}h3{font-weight:700;letter-spacing:0}h3,p{font-size:16px;font-size:1rem;line-height:1.35}p{font-weight:400;color:#666}@media screen and (min-width:700px){h1{font-size:3.5rem}}@media screen and (min-width:1000px){h1{font-size:4rem}}.container{width:1200px;max-width:100%;margin:0 auto}.block{padding:64px 32px;padding:4rem 2rem}@media screen and (min-width:700px){.block{padding:6rem 4rem}}
|
|
/* Components */.button{outline:none;border:0;padding:12.8px 24px;padding:0.8rem 1.5rem;border-radius:0.3rem;font-size:12.8px;font-size:0.8rem;font-weight:500;cursor:pointer;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.button:hover{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";opacity:0.8}.button.primary{background-color:#ffcb3c;color:#fff}.button.primary.inverted{background-color:#fff;color:#000}
|
|
/* Secondary */.button.secondary{background-color:transparent;border:1.5px solid #ffcb3c}
|
|
/* Sizes */.button.small{font-size:9.6px;font-size:0.6rem;padding:8px 16px;padding:0.5rem 1rem}input{border:none;border-bottom:1px solid #000;font-size:16px;font-size:1rem;padding:12.8px;padding:0.8rem;background:none;color:#000}input::-webkit-input-placeholder{color:#666}input:-ms-input-placeholder{color:#666}input::placeholder{color:#666}input.inverted{border-bottom:1px solid #fff;color:#000;background:#fff;border-radius:0.3rem}input.inverted::-webkit-input-placeholder{color:#ddd}input.inverted:-ms-input-placeholder{color:#ddd}input.inverted::placeholder{color:#ddd}
|
|
/* Blocks */.block-header-1{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;padding:16px 32px;padding:1rem 2rem}.block-header-1--logo img{max-height:24px;max-height:1.5rem}.block-header-1 .nav-item{display:inline-block;list-style:none;margin-right:16px;margin-right:1rem;font-size:13.6px;font-size:0.85rem}.block-header-1 .nav-item.active a{color:#ffcb3c}.block-header-1 .nav-item a{text-decoration:none;color:#2b2b2b}.block-header-1 .nav-item a:hover{color:#666}.block-header-1 .nav-item.active a:hover{color:#ffcb3c}.block-header-1 .nav-item:last-of-type{margin:0}.block-header-2{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;padding:16px 32px;padding:1rem 2rem}.block-header-2--logo img{max-height:24px;max-height:1.5rem}.block-header-2--nav{display:-ms-flexbox;display:flex;-ms-flex-align:baseline;align-items:baseline}.block-header-2 .nav-item{display:inline-block;list-style:none;margin-right:16px;margin-right:1rem;font-size:13.6px;font-size:0.85rem}.block-header-2 .nav-item.active a{color:#ffcb3c}.block-header-2 .nav-item a{text-decoration:none;color:#2b2b2b}.block-header-2 .nav-item a:hover{color:#666}.block-header-2 .nav-item.active a:hover{color:#ffcb3c}.block-header-2 .nav-item:last-of-type{margin:0}.block-header-2--cta{margin-left:32px;margin-left:2rem}.block-header-3{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;padding:16px 32px;padding:1rem 2rem;background-color:#fff}.block-header-3--logo img{max-height:24px;max-height:1.5rem}.block-hero-1{--bg:#ffcb3c;--text:#fff;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-height:400px;background-color:var(--bg);color:var(--text);text-align:center}@media screen and (min-width:700px){.block-hero-1{min-height:500px}}.block-hero-2{--bg:#ffcb3c;--text:#fff;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;min-height:100vh;background-color:var(--bg);color:var(--text);background-repeat:no-repeat;background-size:auto 100%;background-position:100%}.block-hero-2,.block-hero-2 .columns{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.block-hero-2 .columns{-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:justify;justify-content:space-between}.block-hero-2 .column.text{-ms-flex:0 0 100%;flex:0 0 100%;text-align:center}.block-hero-2 .column.media{-ms-flex:0 0 100%;flex:0 0 100%;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;margin-top:96px;margin-top:6rem}.block-hero-2 .column.text p{margin:16px 0 32px;margin:1rem 0 2rem;color:#fff;font-size:16px;font-size:1rem}.block-hero-2 .column.media img{width:100%}@media screen and (min-width:700px){.block-hero-2 .column.text{-ms-flex:0 0 45%;flex:0 0 45%;text-align:left}.block-hero-2 .column.media{-ms-flex:0 0 55%;flex:0 0 55%;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;margin-top:0}.block-hero-2 .column.media img{width:45vw;max-width:520px}}.block-one-column-1 .columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:-32px;margin:-2rem}.block-one-column-1 .column{-ms-flex:0 0 calc(100% - 4rem);flex:0 0 calc(100% - 4rem);margin:32px;margin:2rem;text-align:center}.block-one-column-1 .column h3{margin-bottom:16px;margin-bottom:1rem}.block-two-column-1 .columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:-32px;margin:-2rem}.block-two-column-1 .column{-ms-flex:0 0 calc(100% - 4rem);flex:0 0 calc(100% - 4rem);margin:32px;margin:2rem;text-align:center}.block-two-column-1 .column h3{margin-bottom:16px;margin-bottom:1rem}@media screen and (min-width:750px){.block-two-column-1 .column{-ms-flex:0 0 calc(50% - 4rem);flex:0 0 calc(50% - 4rem)}}.block-three-column-1 .columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:-32px;margin:-2rem}.block-three-column-1 .column{-ms-flex:0 0 calc(100% - 4rem);flex:0 0 calc(100% - 4rem);margin:32px;margin:2rem;text-align:center}.block-three-column-1 .column h3{margin-bottom:16px;margin-bottom:1rem}@media screen and (min-width:750px){.block-three-column-1 .column{-ms-flex:0 0 calc(33.33% - 4rem);flex:0 0 calc(33.33% - 4rem)}}.block-cta-bar{padding:32px;padding:2rem;background:#ffcb3c;color:#fff}.block-cta-bar .columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center}.block-cta-bar .text{-ms-flex:0 0 100%;flex:0 0 100%;padding-right:64px;padding-right:4rem;margin-bottom:32px;margin-bottom:2rem}.block-cta-bar .text h3{margin-bottom:16px;margin-bottom:1rem}.block-cta-bar .text p{font-size:20px;font-size:1.25rem;color:#fff}.block-cta-bar .cta{-ms-flex:0 0 100%;flex:0 0 100%;text-align:right;display:-ms-flexbox;display:flex;-ms-flex-align:stretch;align-items:stretch}.block-cta-bar .cta input{-ms-flex:auto;flex:auto;width:100px;margin-right:4px;margin-right:0.25rem;border-radius:0.3rem 0 0 0.3rem}.block-cta-bar .cta .button{-ms-flex:0 0 100px;flex:0 0 100px;border-radius:0 0.3rem 0.3rem 0}@media screen and (min-width:700px){.block-cta-bar{padding:2rem 4rem}.block-cta-bar .text{margin:0}.block-cta-bar .cta,.block-cta-bar .text{-ms-flex:0 0 50%;flex:0 0 50%}.block-cta-bar .cta input{-ms-flex:auto;flex:auto;width:100px}}.block-footer-1{font-size:12.8px;font-size:0.8rem;color:#666;text-align:center}.block-footer-2 .columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;font-size:12.8px;font-size:0.8rem;margin:-32px;margin:-2rem}.block-footer-2 .column{-ms-flex:0 0 calc(50% - 4rem);flex:0 0 calc(50% - 4rem);margin:32px;margin:2rem}.block-footer-2 img{max-width:100%}@media screen and (min-width:700px){.block-footer-2 .column{-ms-flex:0 0 calc(25% - 4rem);flex:0 0 calc(25% - 4rem)}}.block-text-1 .columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:0px;margin:0rem}.block-text-1 .column{margin:0px;margin:0rem}.block-text-1 .headline{-ms-flex:0 0 100%;flex:0 0 100%}.block-text-1 .headline h3{margin-bottom:16px;margin-bottom:1rem}.block-text-1 .text{-ms-flex:0 0 100%;flex:0 0 100%}.block-text-1 .text p{margin:16px 0;margin:1rem 0}.block-text-1 .text p:first-of-type{margin:0 0 16px;margin:0 0 1rem}.block-text-1 .text p:last-of-type{margin:16px 0 0;margin:1rem 0 0}@media screen and (min-width:700px){.block-text-1 .columns{margin:-2rem}.block-text-1 .column{margin:2rem}.block-text-1 .headline{-ms-flex:0 0 calc(35% - 4rem);flex:0 0 calc(35% - 4rem)}.block-text-1 .text{-ms-flex:0 0 calc(65% - 4rem);flex:0 0 calc(65% - 4rem)}.block-text-1 .headline h3{margin-bottom:0}}.block-feature-1 .columns{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;text-align:center}.block-feature-1 .column.text{margin-right:0;margin-bottom:32px;margin-bottom:2rem}.block-feature-1 .column.media,.block-feature-1 .column.text{-ms-flex:0 0 100%;flex:0 0 100%}.block-feature-1 .column.text h2{margin-bottom:16px;margin-bottom:1rem}.block-feature-1 .column.media img{max-width:100%}@media screen and (min-width:700px){.block-feature-1 .columns{text-align:left}.block-feature-1 .column.text{-ms-flex:0 0 40%;flex:0 0 40%;margin-right:2rem;margin-bottom:0}.block-feature-1 .column.media{-ms-flex:0 0 calc(60% - 2rem);flex:0 0 calc(60% - 2rem)}}.block-feature-2 .columns{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;text-align:center}.block-feature-2 .column.text{-ms-flex:0 0 100%;flex:0 0 100%;-ms-flex-order:1;order:1;margin-bottom:32px;margin-bottom:2rem}.block-feature-2 .column.media{-ms-flex:0 0 100%;flex:0 0 100%;-ms-flex-order:2;order:2;margin-right:0}.block-feature-2 .column.text h2{margin-bottom:16px;margin-bottom:1rem}.block-feature-2 .column.media img{max-width:100%}@media screen and (min-width:700px){.block-feature-2 .columns{text-align:left}.block-feature-2 .column.text{-ms-flex:0 0 50%;flex:0 0 50%;-ms-flex-order:2;order:2;margin-bottom:0}.block-feature-2 .column.media{-ms-flex:0 0 calc(50% - 4rem);flex:0 0 calc(50% - 4rem);margin-right:4rem;-ms-flex-order:1;order:1}}.block-media-1 img{max-width:100%}.block-media-1 figcaption{font-size:11.2px;font-size:0.7rem;color:#666;text-align:center;margin-top:8px;margin-top:0.5rem}.block-media-2 .columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:-16px;margin:-1rem}.block-media-2 .column{-ms-flex:0 0 calc(100% - 2rem);flex:0 0 calc(100% - 2rem);margin:16px;margin:1rem}.block-media-2 .column img{max-width:100%}.block-media-2 figcaption{font-size:11.2px;font-size:0.7rem;color:#666;text-align:center;margin-top:8px;margin-top:0.5rem}@media screen and (min-width:700px){.block-media-2 .columns{margin:-2rem}.block-media-2 .column{-ms-flex:0 0 calc(50% - 4rem);flex:0 0 calc(50% - 4rem);margin:2rem}}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Droid Sans,Helvetica Neue,sans-serif;font-size:16px}::-moz-selection{background:#ffedbc;color:#333}::-webkit-selection{background:#ffedbc;color:#333}::selection{background:#ffedbc;color:#333}html::before{display:block;z-index:1000;position:fixed;top:0;left:0;right:0;font-size:.9em;padding:1.5em 1em 1.5em 4.5em;color:white;background-color:#DF4F5E;background:url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2248px%22%20height%3D%2248px%22%20viewBox%3D%220%200%20512%20512%22%20enable-background%3D%22new%200%200%20512%20512%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%23A82734%22%20id%3D%22warning-4-icon%22%20d%3D%22M228.55%2C134.812h54.9v166.5h-54.9V134.812z%20M256%2C385.188c-16.362%2C0-29.626-13.264-29.626-29.625c0-16.362%2C13.264-29.627%2C29.626-29.627c16.361%2C0%2C29.625%2C13.265%2C29.625%2C29.627C285.625%2C371.924%2C272.361%2C385.188%2C256%2C385.188z%20M256%2C90c91.742%2C0%2C166%2C74.245%2C166%2C166c0%2C91.741-74.245%2C166-166%2C166c-91.742%2C0-166-74.245-166-166C90%2C164.259%2C164.245%2C90%2C256%2C90z%20M256%2C50C142.229%2C50%2C50%2C142.229%2C50%2C256s92.229%2C206%2C206%2C206s206-92.229%2C206-206S369.771%2C50%2C256%2C50z%22%2F%3E%3C%2Fsvg%3E") .5em no-repeat, #DF4F5E linear-gradient(#DF4F5E, #CE3741);border:1px solid #C64F4B;border-radius:3px;box-shadow:inset 0 1px 0 #EB8A93, 0 0 .3em rgba(0,0,0, .5);white-space:pre-wrap;font-family:Menlo, Monaco, monospace;text-shadow:0 1px #A82734;content:"src/css/styles.css\00000a2:3 Custom property ignored: not scoped to the top-level :root element (.block-hero-1 { ... --bg: ... }) [postcss-custom-properties]\00000a3:3 Custom property ignored: not scoped to the top-level :root element (.block-hero-1 { ... --text: ... }) [postcss-custom-properties]\00000a2:3 Custom property ignored: not scoped to the top-level :root element (.block-hero-2 { ... --bg: ... }) [postcss-custom-properties]\00000a3:3 Custom property ignored: not scoped to the top-level :root element (.block-hero-2 { ... --text: ... }) [postcss-custom-properties]\00000a9:3 variable '--bg' is undefined and used without a fallback [postcss-custom-properties]\00000a10:3 variable '--text' is undefined and used without a fallback [postcss-custom-properties]\00000a9:3 variable '--bg' is undefined and used without a fallback [postcss-custom-properties]\00000a10:3 variable '--text' is undefined and used without a fallback [postcss-custom-properties]\00000a2:3 Custom property ignored: not scoped to the top-level :root element (.block-hero-1 { ... --bg: ... }) [postcss-custom-properties]\00000a3:3 Custom property ignored: not scoped to the top-level :root element (.block-hero-1 { ... --text: ... }) [postcss-custom-properties]\00000a2:3 Custom property ignored: not scoped to the top-level :root element (.block-hero-2 { ... --bg: ... }) [postcss-custom-properties]\00000a3:3 Custom property ignored: not scoped to the top-level :root element (.block-hero-2 { ... --text: ... }) [postcss-custom-properties]\00000a9:3 variable '--bg' is undefined and used without a fallback [postcss-custom-properties]\00000a10:3 variable '--text' is undefined and used without a fallback [postcss-custom-properties]\00000a9:3 variable '--bg' is undefined and used without a fallback [postcss-custom-properties]\00000a10:3 variable '--text' is undefined and used without a fallback [postcss-custom-properties]"}
|
|
/*# sourceMappingURL=styles.css.map */
|