Created
October 16, 2024 00:16
-
-
Save alexmwalker/75a9296c3e6fc1903d75e134b21daa4c to your computer and use it in GitHub Desktop.
Test CSS
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"); | |
| :root { | |
| --base-line-height: 24px; | |
| --base-line-ratio: 18/28; | |
| --base-font-size: calc(var(--base-line-height) * var(--base-line-ratio)); | |
| --typescale: 1.25; | |
| --title-size: clamp(30px, 7vw, 60px); | |
| --sjs-red: #ee3540; | |
| --stat-font-size: clamp(5rem, 30cqi, 8rem); | |
| --font-TT-bold: "TT Commons Bold", Roboto, Helvetica, Arial, sans-serif; | |
| --font-Roboto-condensed: "Roboto Condensed", Noto-sans, sans-serif; | |
| } | |
| body { | |
| margin: 0; | |
| padding: 0; | |
| font-size: var(--base-font-size); | |
| line-height: var(--base-line-height); | |
| } | |
| @font-face { | |
| font-family: "-O7bUx4yW6bqDGwWrl4Z"; | |
| src: url(data:application/font-woff;charset=utf-8;base64,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) format("woff"); | |
| font-weight: 400; | |
| font-style: normal; | |
| } | |
| @font-face { | |
| font-family: "TT Commons Regular"; | |
| src: url("https://assets.codepen.io/9818955/TTCommons-Regular.woff2") format("woff2"); | |
| font-weight: 400; | |
| } | |
| @font-face { | |
| font-family: "TT Commons Medium"; | |
| src: url("https://assets.codepen.io/9818955/TTCommons-Medium.woff2") format("woff2"); | |
| font-weight: 600; | |
| } | |
| @font-face { | |
| font-family: "TT Commons Bold"; | |
| src: url("https://assets.codepen.io/9818955/TTCommons-Bold.woff2") format("woff2"); | |
| font-weight: 800; | |
| } | |
| body { | |
| font-family: sans-serif; | |
| } | |
| h2, h3, h4 { | |
| color: #283273; | |
| text-transform: uppercase; | |
| font-family: var(--font-Roboto-condensed); | |
| font-optical-sizing: auto; | |
| font-weight: 900; | |
| font-style: normal; | |
| } | |
| h2 { | |
| font-size: calc(var(--base-font-size) * var(--typescale) * var(--typescale) * var(--typescale) * var(--typescale) * var(--typescale)); | |
| font-weight: 800; | |
| font-style: italic; | |
| font-variation-settings: "wdth" 80; | |
| letter-spacing: -1px; | |
| } | |
| h3 { | |
| font-size: calc(var(--base-font-size) * var(--typescale) * var(--typescale) * var(--typescale)); | |
| line-height: var(--base-line-height); | |
| font-style: italic; | |
| font-weight: 800; | |
| letter-spacing: -1px; | |
| } | |
| h4 { | |
| font-size: calc(var(--base-font-size) * var(--typescale)); | |
| line-height: var(--base-line-height); | |
| font-weight: 800; | |
| } | |
| p { | |
| font-size: var(--base-font-size); | |
| line-height: var(--base-line-height); | |
| } | |
| .dotted:after { | |
| position: relative; | |
| display: block; | |
| content: ""; | |
| width: auto; | |
| height: 0px; | |
| margin-right: 5rem; | |
| border-bottom: 3px dotted #283273; | |
| bottom: -0.5em; | |
| left: 0; | |
| } | |
| .hero { | |
| font-family: "-O7bUx4yW6bqDGwWrl4Z", "TT Commons Bold", "Helvetica Neue", Arial, sans-serif; | |
| padding: calc(var(--title-size) * 0.25) 0; | |
| margin: calc(var(--title-size) * 1.7) 0 calc(var(--title-size) * 1); | |
| min-height: 18rem; | |
| } | |
| .solution { | |
| background-image: linear-gradient(90deg, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.7) 100%), url("https://assets.codepen.io/9818955/halftone-1.jpg"); | |
| background-size: 100% auto, cover; | |
| background-position: center bottom; | |
| position: relative; | |
| } | |
| .container { | |
| padding: 0 2rem; | |
| margin: 0 auto; | |
| max-width: 1200px; | |
| min-height: calc(var(--title-size) * 3); | |
| display: block; | |
| } | |
| .title { | |
| font-size: var(--title-size); | |
| line-height: calc(var(--title-size) * 0.6); | |
| text-transform: uppercase; | |
| font-weight: 800; | |
| left: 5vw; | |
| color: #283273; | |
| top: calc(var(--title-size) * -0.6); | |
| position: relative; | |
| } | |
| .title span { | |
| position: absolute; | |
| display: inline-block; | |
| mix-blend-mode: multiply; | |
| z-index: 2; | |
| } | |
| .title span.justice { | |
| text-indent: calc(var(--title-size) / 1.5); | |
| top: calc(var(--title-size) / 1.5); | |
| } | |
| .title span.date { | |
| font-size: calc(var(--title-size) * 3.2); | |
| letter-spacing: calc(var(--title-size) / -5); | |
| position: absolute; | |
| transform: translate(calc(var(--title-size) * -2.15), calc(var(--title-size) * 0.75)) rotate(90deg); | |
| z-index: 0; | |
| color: var(--sjs-red); | |
| mix-blend-mode: normal; | |
| } | |
| .title span.stocktake { | |
| font-size: calc(var(--title-size) / 2.4); | |
| line-height: calc(var(--title-size) / 4); | |
| letter-spacing: calc(var(--title-size) / 12); | |
| top: calc(var(--title-size) * 1.4); | |
| } | |
| .switch:checked ~ .hero .title span.date { | |
| position: relative; | |
| transform: translate(calc(var(--title-size) * 0.15), calc(var(--title-size) * 3)) rotate(0deg); | |
| } | |
| .banner { | |
| background: var(--sjs-red); | |
| font-family: "TT Commons Bold"; | |
| color: #fff; | |
| text-transform: uppercase; | |
| font-size: calc(var(--title-size) / 3); | |
| font-weight: 600; | |
| line-height: calc(var(--title-size) / 2.5); | |
| letter-spacing: calc(var(--title-size) / 15); | |
| width: 33%; | |
| position: relative; | |
| padding: calc(var(--title-size) / 6) calc(var(--title-size) / 3); | |
| } | |
| main { | |
| max-width: 1200px; | |
| margin: 0 auto; | |
| } | |
| .stat-container { | |
| display: block; | |
| margin: 0 1rem; | |
| font-family: var(--font-TT-bold); | |
| font-optical-sizing: auto; | |
| font-weight: 600; | |
| font-style: normal; | |
| font-variation-settings: "wdth" 100; | |
| margin-bottom: 2rem; | |
| } | |
| .stat-container h3 { | |
| font-family: "TT Commons Bold"; | |
| } | |
| .col { | |
| margin: 0 2%; | |
| box-sizing: border-box; | |
| container-type: inline-size; | |
| } | |
| .stat-block { | |
| text-align: center; | |
| background-size: auto 100%; | |
| padding: 0 1rem; | |
| } | |
| .stat-block h3 { | |
| text-transform: uppercase; | |
| line-height: 90px; | |
| font-weight: 900; | |
| margin: 2rem 0 1rem; | |
| font-size: var(--stat-font-size); | |
| line-height: 30cqi; | |
| } | |
| .stat-block h3 span { | |
| display: block; | |
| font-size: calc(var(--stat-font-size) / 2.5); | |
| line-height: calc(var(--stat-font-size) / 2.8); | |
| letter-spacing: calc(var(--stat-font-size) / 50); | |
| font-weight: 700; | |
| } | |
| .stat-block h3 span span { | |
| font-size: calc(var(--stat-font-size) / 4.5); | |
| line-height: calc(var(--stat-font-size) / 3); | |
| } | |
| .stat-block p { | |
| font-size: clamp(1rem, 4cqi, 3rem); | |
| line-height: clamp(1rem, 4cqi, 3rem); | |
| font-family: "TT Commons Regular"; | |
| font-weight: 500; | |
| } | |
| .blue-bg h3, .red-bg h3, .white-bg h3 { | |
| font-style: normal; | |
| } | |
| .blue-bg { | |
| background-image: url("https://assets.codepen.io/9818955/blue-haltftone.jpg"); | |
| color: #fff; | |
| } | |
| .blue-bg h3 { | |
| color: #fff; | |
| } | |
| .red-bg { | |
| background-image: url("https://assets.codepen.io/9818955/red-halftone.jpg"); | |
| color: #fff; | |
| } | |
| .red-bg h3 { | |
| color: #fff; | |
| } | |
| .white-bg { | |
| border: 1px solid #555; | |
| } | |
| .white-bg h3 { | |
| color: var(--sjs-red); | |
| } | |
| .i-flame { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#flame); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#flame); | |
| } | |
| .i-house-fire { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#house-fire); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#house-fire); | |
| } | |
| .i-mental-health { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#mental-health); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#mental-health); | |
| } | |
| .i-mortgage { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#mortgage); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#mortgage); | |
| } | |
| .i-drug-alcohol { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#drug-alcohol); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#drug-alcohol); | |
| } | |
| .i-piggybank { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#piggybank); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#piggybank); | |
| } | |
| .i-collapse { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#collapse); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#collapse); | |
| } | |
| .i-stopwatch { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#stopwatch); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#stopwatch); | |
| } | |
| .i-homelessness-arrow { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#homelessness-arrow); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#homelessness-arrow); | |
| } | |
| .i-gender { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#gender); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#gender); | |
| } | |
| .i-card-suits { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#card-suits); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#card-suits); | |
| } | |
| .i-below-the-line { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#below-the-line); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#below-the-line); | |
| } | |
| .i-thoughts { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#thoughts); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#thoughts); | |
| } | |
| .i-backpack { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#backpack); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#backpack); | |
| } | |
| .i-seniors { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#seniors); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#seniors); | |
| } | |
| .i-horse-racing { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#horse-racing); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#horse-racing); | |
| } | |
| .i-sports { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#sports); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#sports); | |
| } | |
| .i-gambling { | |
| -webkit-mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#gambling); | |
| mask-image: url(https://gist.githubusercontent.com/alexmwalker/795ba60c7ca9311981df36e893a1b038/raw/8acd27936357c12b8c262c476a993feecf8ad338/icons.svg#gambling); | |
| } | |
| .white-bg .icon { | |
| background: var(--sjs-red); | |
| } | |
| .red-bg .icon { | |
| background: #fff; | |
| } | |
| .icon { | |
| width: 80cqi; | |
| height: 80cqi; | |
| -webkit-mask-repeat: space; | |
| mask-repeat: space; | |
| -webkit-mask-size: 100% auto; | |
| mask-size: 100% auto; | |
| margin: 2rem auto -1rem; | |
| } | |
| .float.icon { | |
| display: none; | |
| } | |
| .icon-block { | |
| display: flex; | |
| flex-wrap: wrap; | |
| margin-bottom: 2rem; | |
| } | |
| .icon-block .icon { | |
| position: relative; | |
| width: 100px; | |
| height: 100px; | |
| background: #000; | |
| border: 1px solid #000; | |
| } | |
| .flow-content { | |
| columns: 4 150px; | |
| column-gap: 2em; | |
| } | |
| .flow-content h2 { | |
| column-span: all; | |
| } | |
| .flow-content p:first-of-type { | |
| margin-top: 0; | |
| font-size: 1.2rem; | |
| color: #283273; | |
| font-weight: 600; | |
| } | |
| .summary { | |
| background: #eeeeff; | |
| padding: 3rem 0; | |
| margin: 2rem 0; | |
| position: relative; | |
| display: block; | |
| } | |
| .summary h4 { | |
| font-family: var(--font-TT-bold); | |
| } | |
| .summary h3 { | |
| margin: 0 1rem; | |
| position: relative; | |
| padding-left: calc(var(--base-line-height) * 2.5); | |
| line-height: 2em; | |
| } | |
| .summary h3:before { | |
| display: block; | |
| position: absolute; | |
| content: ""; | |
| width: calc(var(--base-line-height) * 2); | |
| height: calc(var(--base-line-height) * 2); | |
| top: 0; | |
| left: 0; | |
| background-size: cover; | |
| background-image: url("data:image/svg+xml,%3Csvg width='193' height='193' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M62.292 118.229c.16.637.246 1.247.246 1.848.002 1.097-.296 2.15-.91 3.221-.615 1.075-1.538 2.181-2.813 3.456l-.023.021-6.772 5.976a2.03 2.03 0 0 1-2.686-.002l-6.789-5.994-.023-.021c-1.256-1.256-2.173-2.372-2.785-3.463-.612-1.089-.91-2.162-.909-3.267 0-.582.081-1.171.232-1.776.65-2.635 2.531-4.547 5.182-5.282a6.165 6.165 0 0 1 1.665-.227c1.793.003 3.454.746 4.771 1.7 1.328-.959 2.984-1.696 4.77-1.699a6.15 6.15 0 0 1 1.662.227c2.651.735 4.531 2.647 5.182 5.282Zm-5.885 5.992c1.091-1.092 1.765-1.921 2.152-2.574.388-.658.495-1.117.497-1.558 0-.315-.06-.636-.154-1.01-.184-.734-.5-1.311-.948-1.764-.448-.453-1.034-.788-1.788-1-.243-.068-.49-.1-.742-.1-1.226-.011-2.59.799-3.486 1.692a1.826 1.826 0 0 1-1.28.522c-.429 0-.87-.154-1.206-.484v-.001c-.93-.927-2.299-1.741-3.526-1.73a2.74 2.74 0 0 0-.74.1c-.755.212-1.34.548-1.788 1-.447.453-.764 1.031-.948 1.764a3.698 3.698 0 0 0-.132.909c.002.441.107.931.487 1.61.38.674 1.04 1.522 2.124 2.606l5.748 5.073 5.73-5.055ZM109.906 82.3a24.252 24.252 0 0 1-.062-1.732c0-.746.036-1.448.1-2.024.062-.574.165-1.034.255-1.238.278-.656.391-1.094.394-1.458.002-.26-.073-.517-.25-.694l-.001-.001a.81.81 0 0 0-.583-.24 1.602 1.602 0 0 0-.487.093c-.137.044-.28.1-.436.161l-.059.023c-.116.046-.243.095-.38.146-1.746.656-3.171.79-4.048.79a7.59 7.59 0 0 1-.711-.032c-2.458-.29-3.469-1.195-4.158-1.812l-.055-.049-.037-.033a4.932 4.932 0 0 0-.404-.343c-.151-.105-.329-.223-.606-.229-.278.006-.456.125-.607.23-.14.102-.266.217-.402.34l-.038.035-.052.047c-.69.619-1.7 1.525-4.158 1.817a7.7 7.7 0 0 1-.712.033c-.878 0-2.303-.135-4.049-.79a39.878 39.878 0 0 1-.379-.146l-.022-.009a8.38 8.38 0 0 0-.474-.176 1.602 1.602 0 0 0-.487-.093.813.813 0 0 0-.582.24c-.179.178-.254.436-.252.696.003.365.116.803.394 1.459.09.204.193.664.255 1.238.065.577.1 1.278.1 2.024 0 .563-.02 1.151-.062 1.732-.056.784-.246 1.913-.47 3.222l-.01.062c-.369 2.167-.827 4.865-.828 7.238v.018c.02.534.122 1.268.304 2.011.181.728.43 1.451.802 2.006l-.001.001.012.017c.004.006.007.014.012.02l.001-.001c.76 1.305 1.844 2.202 2.967 2.846 1.124.645 2.291 1.05 3.256 1.385l.032.011c.54.187.997.347 1.327.501 1.45.676 2.233 1.328 2.786 1.788l.013.011.057.047a5.7 5.7 0 0 0 .551.425c.198.128.439.237.718.237.28 0 .52-.109.717-.237.184-.119.354-.261.553-.427l.062-.052a11.63 11.63 0 0 1 2.792-1.796c.329-.153.787-.314 1.327-.501l.028-.01c.966-.335 2.134-.74 3.258-1.384 1.123-.643 2.205-1.537 2.962-2.838l.001.001.012-.02a.142.142 0 0 1 .003-.006l.002-.002a.32.32 0 0 0 .006-.009l-.001-.001c.374-.558.625-1.285.807-2.015.183-.745.284-1.481.304-2.017v-.018c-.001-2.358-.456-5.04-.822-7.201l-.016-.094c-.222-1.31-.413-2.438-.469-3.223Zm-2.52 11.695a6.536 6.536 0 0 1-.167.56 1.747 1.747 0 0 1-.122.283l-.001.002-.002.004-.003.003-.002.002-.123.194-.011.019c-.396.69-1.027 1.202-1.796 1.619-.767.417-1.659.729-2.517 1.026-.643.223-1.199.421-1.664.637h.001a15.065 15.065 0 0 0-2.602 1.524 15.156 15.156 0 0 0-2.591-1.518c-.471-.218-1.028-.416-1.667-.637-.861-.299-1.753-.611-2.521-1.03-.77-.419-1.404-.933-1.802-1.629l-.013-.021-.125-.195-.004-.005a1.584 1.584 0 0 1-.12-.284c-.164-.464-.345-1.297-.363-1.83.002-1.947.435-4.513.789-6.583.235-1.378.439-2.575.513-3.569v-.002a28.165 28.165 0 0 0 .053-2.944 13.81 13.81 0 0 0 1.883.137c.367 0 .723-.016 1.065-.049l.007-.001c2.282-.255 3.844-.979 4.9-1.68 1.053.699 2.604 1.421 4.855 1.673l.008.001c.377.037.739.053 1.105.053.509 0 1.148-.035 1.883-.138-.011.307-.017.609-.017.893 0 .964.05 1.75.072 2.052.072.98.271 2.155.501 3.504l.011.066c.353 2.071.787 4.637.788 6.675a6.694 6.694 0 0 1-.201 1.188Z' fill='%23223279'/%3E%3Cpath d='m151.889 104.807-.003.001h-.001l.004-.001Z' fill='%23223279'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M157.751 112.521c2.651.733 4.531 2.645 5.182 5.281.159.636.245 1.246.245 1.847.002 1.097-.296 2.15-.911 3.223-.615 1.075-1.538 2.18-2.813 3.456l-.023.021-6.772 5.975-.001.001a2.035 2.035 0 0 1-2.675.005c-.004-.002-.008-.003-.011-.006l-6.787-5.995-.022-.021c-1.256-1.256-2.173-2.372-2.785-3.462-.612-1.088-.911-2.161-.91-3.266 0-.583.081-1.172.233-1.778.65-2.636 2.531-4.548 5.182-5.281a6.17 6.17 0 0 1 1.665-.227c1.793.003 3.453.744 4.77 1.698 1.325-.956 2.983-1.694 4.77-1.697.548 0 1.106.07 1.663.226Zm-.703 11.274c1.091-1.093 1.764-1.922 2.151-2.575.388-.659.495-1.117.496-1.56.001-.314-.06-.635-.154-1.01-.183-.733-.5-1.31-.947-1.763-.448-.453-1.034-.789-1.788-1.001a2.744 2.744 0 0 0-.743-.1c-1.227-.011-2.588.8-3.484 1.693a1.826 1.826 0 0 1-1.281.522c-.429 0-.871-.155-1.206-.485-.93-.927-2.298-1.742-3.525-1.731-.253 0-.497.031-.741.1-.754.212-1.339.548-1.787 1.001-.447.453-.764 1.03-.948 1.763a3.698 3.698 0 0 0-.132.909c.002.442.107.932.487 1.611.379.675 1.04 1.523 2.124 2.607l5.747 5.072 5.731-5.053Z' fill='%23223279'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M.873 96.485C.874 43.596 43.747.723 96.636.722c52.889.001 95.761 42.874 95.763 95.763-.001 52.889-42.874 95.762-95.763 95.763C43.747 192.247.874 149.374.873 96.485Zm41.192 73.765a91.59 91.59 0 0 0 18.994 10.835c-.423-18.335-.844-37.281-.845-39.779 0-.109.001-.186.003-.244.044-1.364.316-2.455.889-3.519 2.932-5.467 3.752-13.381 3.748-22.407 0-5.106-.258-10.568-.521-16.147l-.002-.039a978.225 978.225 0 0 1-.289-6.4c-.048-1.13-.39-1.806-.821-2.22-.432-.412-.993-.588-1.564-.589h-.022c-.414.006-.847.128-1.133.311-.294.192-.409.384-.411.594l-.002.04-.004.051v1.928c0 5.357.003 10.622.005 12.946v.002a1.743 1.743 0 0 1-1.746 1.738h-.002c-.96 0-1.745-.772-1.746-1.737-.002-2.424-.006-8.044-.006-13.633 0-3.571.002-7.128.007-9.831v-.004c-.007-.55-.203-.847-.509-1.086-.307-.233-.76-.362-1.181-.377l-.088-.002c-.377-.002-.881.094-1.256.331-.373.243-.643.568-.707 1.206l-.002 21.288c0 .903-.694 1.666-1.61 1.738l-.143.006a1.744 1.744 0 0 1-1.736-1.61 11.197 11.197 0 0 1-.005-.578v-.007l-.001-3.519v-2.624l.001-5.515V78.369c.001-.441-.241-.872-.64-1.209-.394-.335-.929-.541-1.367-.542h-.022c-.624-.001-1.246.199-1.693.564-.446.369-.74.878-.759 1.624-.056 2.921-.074 7.121-.074 11.275 0 7.185.053 14.236.054 14.348v.012c0 .959-.773 1.741-1.735 1.747h-.013a1.748 1.748 0 0 1-1.747-1.733v-.004l-.002-.263c-.009-1.352-.051-7.684-.051-14.12 0-1.75.003-3.505.011-5.174l-.055-.15-.015-.049c-.176-.69-.446-1.207-.743-1.528-.301-.322-.601-.456-.94-.459l-.113.005c-.684.063-1.573.791-1.66 2.263-.089 1.551-.122 3.724-.122 6.212 0 3.867.08 8.5.154 12.784v.003c.068 3.966.118 7.033.118 9.2 0 .959-.01 1.742-.032 2.352-.024.613-.055 1.04-.116 1.344l-.015.058-.009.027-.004-.001c-.039.15-.093.301-.177.445l-.012.019-.037.057-.002.002c-.09.138-.202.27-.339.386l-.045.034-.035.023-.143.099-.087.048-.155.067.003-.001-.05.022-.035.014a1.613 1.613 0 0 1-.448.085l-.026.005-.14.006-.053-.005-.006-.001-.132-.014-.007-.001-.067-.008-.075-.015-.043-.012-.139-.043-.037-.013-.108-.043-.059-.028-.104-.058-.021-.012-.106-.066-.06-.044-.088-.075-.023-.021-.09-.087-.042-.046-.071-.088-.019-.025-.078-.11-.003-.004-.025-.036-.026-.042c-.288-.517-.492-1.089-.645-1.772-.892-3.997-1.998-7.138-3.147-9.028-.488-.807-.987-1.349-1.418-1.685-.428-.338-.797-.462-.97-.469l-.045-.002-.154.033a.75.75 0 0 0-.253.225c-.186.233-.302.573-.301.949 0 .13.014.265.042.399a496.524 496.524 0 0 0 2.285 10.153c.986 4.184 2.043 8.366 2.628 9.942.987 2.671 1.888 4.408 2.773 5.719.885 1.311 1.76 2.206 2.734 3.2l.044.045c.659.676 1.353 1.387 2.099 2.277.666.796 1.177 1.845 1.548 3.116.048.171.072.362.1.638.026.272.049.615.07 1.027.042.824.075 1.925.101 3.263.051 2.674.073 6.293.073 10.492 0 4.306-.022 9.225-.059 14.359Zm44.477 17.443a92.25 92.25 0 0 0 28.9-1.381c-.214-6.075-.442-12.601-.67-19.169-.863-24.852-1.718-50.157-1.718-52.971l.002-.202c.058-1.779.404-3.176 1.142-4.548 4.374-8.159 5.537-20.432 5.532-33.931 0-7.23-.328-14.815-.653-22.317l-.004-.095c-.083-1.92-.166-3.84-.244-5.758-.075-1.754-.621-2.846-1.342-3.523-.723-.676-1.663-.96-2.603-.961h-.026c-.705.012-1.435.228-1.949.576-.519.356-.804.79-.807 1.318l-.003.05-.007.071v2.79c0 7.689.006 15.213.009 18.1v.002c0 .965-.784 1.732-1.739 1.737h-.008a1.747 1.747 0 0 1-1.747-1.744l-.001-1.791c-.003-3.77-.008-10.533-.008-17.278 0-4.936.002-9.864.01-13.6v-.006c-.007-.976-.377-1.568-.924-1.996-.549-.422-1.314-.637-2.024-.664l-.153-.003c-.79-.001-1.608.222-2.219.668-.609.448-1.034 1.087-1.12 2.053l-.001 12.344c-.002 4.253-.002 8.389-.002 11.506l.001 5.388v.024a1.75 1.75 0 0 1-1.6 1.741l-.15.006a1.747 1.747 0 0 1-1.739-1.603v-.006c-.004-.06-.004-.07-.005-.561V27.876c.001-.829-.423-1.58-1.083-2.144-.655-.562-1.535-.905-2.319-.911h-.044c-.967-.002-1.977.328-2.726.944-.749.619-1.255 1.498-1.283 2.702-.077 4.029-.102 9.822-.102 15.547 0 9.49.068 18.796.074 19.592v.066c0 .959-.773 1.739-1.734 1.747h-.013a1.747 1.747 0 0 1-1.747-1.734c-.002-.165-.074-9.789-.074-19.639 0-2.491.004-4.995.016-7.365a3.221 3.221 0 0 0-.027-.056c-.034-.068-.068-.135-.09-.22l-.001-.003c-.275-1.074-.706-1.895-1.213-2.427-.511-.532-1.073-.786-1.713-.789l-.236.012c-1.253.119-2.729 1.37-2.864 3.716-.123 2.149-.169 5.149-.169 8.581 0 5.267.108 11.556.208 17.391l.003.162c.095 5.498.164 9.733.164 12.694 0 1.275-.013 2.314-.042 3.119-.03.808-.073 1.371-.149 1.75l-.017.063-.009.026-.005-.002a1.736 1.736 0 0 1-.177.442l-.008.013-.036.057-.002.003a1.716 1.716 0 0 1-.344.39l-.029.022-.039.028-.005.003-.147.103-.09.05-.204.088-.039.015c-.153.052-.302.07-.446.08l.001.004-.038.006-.135.003-.051-.006-.124-.013-.063-.006-.114-.024-.036-.012-.122-.037-.041-.014-.105-.042-.052-.024-.109-.059-.032-.019-.1-.064-.056-.042-.092-.079-.103-.096-.052-.057-.073-.093-.014-.018-.075-.105-.006-.008-.026-.038-.024-.039c-.362-.65-.624-1.377-.82-2.26-.861-3.866-2.345-9.212-4.398-12.591-.605-.999-1.292-1.815-1.964-2.377-.672-.565-1.326-.862-1.831-.89l-.093-.003c-.411.008-.713.153-1.081.6-.359.451-.556 1.041-.556 1.692 0 .227.024.461.074.697a701.478 701.478 0 0 0 3.146 13.971c1.358 5.76 2.81 11.511 3.626 13.71 1.377 3.723 2.638 6.154 3.88 7.994 1.243 1.839 2.472 3.096 3.825 4.479l.002.002c.918.937 1.881 1.92 2.909 3.15.851 1.016 1.513 2.376 1.999 4.041.046.161.074.342.102.586.028.242.052.538.074.889.044.702.08 1.626.107 2.749.055 2.246.079 5.29.079 8.922 0 15.298-.429 41.038-.807 61.222Zm74.317-47.066c.044-1.364.315-2.455.887-3.52 2.933-5.466 3.754-13.38 3.748-22.407 0-5.118-.258-10.594-.523-16.188a912.707 912.707 0 0 1-.288-6.399c-.048-1.121-.387-1.8-.813-2.217-.428-.415-.979-.593-1.538-.594l-.056.001c-.415.006-.848.129-1.134.312-.294.191-.409.383-.411.594l-.003.053-.005.046c0 5.79.005 11.878.007 14.616v.251a1.741 1.741 0 0 1-1.745 1.74h-.001a1.745 1.745 0 0 1-1.748-1.739c-.003-2.37-.007-7.795-.007-13.258 0-3.695.002-7.408.008-10.205v-.004c-.008-.55-.204-.847-.51-1.086-.307-.233-.76-.362-1.182-.378l-.08-.001c-.377-.002-.883.093-1.26.33-.375.243-.647.568-.712 1.209v9.179l-.001 6.736v3.499l.001 1.846v.025a1.746 1.746 0 0 1-1.61 1.739l-.147.006a1.742 1.742 0 0 1-1.733-1.609c-.004-.056-.004-.072-.005-.429l-.001-2.457.001-9.356V77.933c.001-.44-.241-.872-.64-1.208-.394-.335-.93-.541-1.37-.542h-.007c-.622-.001-1.249.198-1.699.563-.45.369-.746.878-.765 1.625-.056 2.93-.074 7.144-.074 11.31 0 7.172.054 14.205.055 14.312v.013c0 .959-.772 1.742-1.736 1.749h-.013a1.748 1.748 0 0 1-1.747-1.732v-.004l-.002-.269c-.009-1.367-.051-7.721-.051-14.168 0-1.732.003-3.469.011-5.121l-.055-.153-.014-.045c-.175-.689-.445-1.205-.742-1.527-.301-.322-.6-.456-.936-.459l-.118.006h-.001c-.683.062-1.572.79-1.659 2.261-.089 1.55-.122 3.721-.122 6.206 0 3.87.08 8.506.155 12.794.068 3.966.118 7.033.118 9.2 0 .96-.01 1.743-.032 2.353-.024.613-.055 1.041-.116 1.345l-.029.094-.011.026-.005-.002c-.04.143-.088.283-.161.408l-.005.008-.036.059-.012.019a1.753 1.753 0 0 1-.344.384l-.021.017-.037.027-.012.009-.149.102-.082.045-.155.068-.005.002-.047.02-.032.012a1.736 1.736 0 0 1-.475.086v.004l-.034.004-.1.002-.048-.004-.007-.001-.143-.014-.009-.001-.06-.007-.089-.019-.039-.012-.136-.042-.037-.013-.101-.04-.058-.028-.11-.061-.024-.014-.1-.063-.059-.043-.091-.078-.018-.016-.089-.084-.047-.051-.072-.09-.018-.025-.076-.108-.005-.008-.025-.037-.022-.036c-.288-.516-.494-1.088-.647-1.772v-.001c-.89-3.998-1.996-7.137-3.146-9.031-.488-.806-.987-1.346-1.418-1.682-.428-.337-.797-.461-.971-.469l-.043-.001-.156.033a.75.75 0 0 0-.253.225l-.001.001c-.186.233-.302.572-.301.949 0 .131.014.265.042.4a507.764 507.764 0 0 0 2.285 10.152c.985 4.183 2.042 8.365 2.628 9.943.988 2.67 1.889 4.407 2.774 5.718.886 1.31 1.76 2.205 2.734 3.2l.027.028c.665.679 1.365 1.395 2.118 2.294.664.794 1.176 1.845 1.545 3.116.048.172.072.363.1.64.026.273.049.617.07 1.031.042.828.075 1.933.101 3.276.051 2.685.073 6.317.073 10.532 0 5.968-.043 13.106-.107 20.364a92.119 92.119 0 0 0 18.611-14.267c-.237-10.687-.412-19.121-.412-20.745 0-.11.001-.189.003-.248Zm3.491.12-.001.142c0 1.199.131 8.047.318 17.17 14.748-16.286 23.728-37.873 23.729-61.576-.001-25.346-10.268-48.274-26.877-64.886-16.612-16.609-39.54-26.876-64.886-26.877-25.346.001-48.274 10.268-64.886 26.877C15.138 48.209 4.871 71.137 4.87 96.483c.001 25.346 10.268 48.274 26.877 64.886a92.573 92.573 0 0 0 6.785 6.12c.038-5.566.062-10.758.062-15.026 0-5.472-.041-9.451-.138-10.705a2.966 2.966 0 0 0-.035-.317c-.243-.846-.552-1.472-.868-1.846-.665-.792-1.308-1.451-1.941-2.1l-.021-.021c-2.064-2.097-4.1-4.209-6.29-10.151-.697-1.89-1.817-6.383-2.845-10.755a531.523 531.523 0 0 1-2.211-9.833v-.001a5.503 5.503 0 0 1-.118-1.129c0-1.137.363-2.235 1.062-3.113.794-1.004 1.922-1.581 3.146-1.578l.265.009h.001c1.95.134 3.784 1.576 5.154 3.828.208.344.409.721.607 1.113l-.017-.999-.014-.837v-.003c-.074-4.286-.154-8.919-.154-12.824 0-2.552.034-4.792.128-6.432.184-3.302 2.524-5.322 4.809-5.54a4.21 4.21 0 0 1 .424-.021c.589 0 1.216.125 1.829.387l.004-.25.011-.616v.001c.03-1.817.815-3.254 1.949-4.197 1.134-.946 2.596-1.42 4.03-1.421h.023c1.444.016 2.784.615 3.777 1.544.818.767 1.403 1.771 1.605 2.875a6.066 6.066 0 0 1 2.05-.356l.225.004c1.242.051 2.488.496 3.445 1.332.957.832 1.606 2.079 1.602 3.621v.014l-.003 2.362-.002 1.954a5.814 5.814 0 0 1 1.482-.226l.143-.002c1.387-.001 2.805.479 3.9 1.505 1.097 1.024 1.843 2.59 1.924 4.659.086 2.121.187 4.251.288 6.376.265 5.614.525 11.125.525 16.326-.004 9.447-.848 17.878-4.161 24.081v-.001c-.264.505-.437.97-.476 1.991l-.001.146c0 2.155.415 22.183.839 41.151a91.127 91.127 0 0 0 18.382 4.757l.044-2.578c.38-22.137.84-48.867.84-62.175.001-4.166-.047-7.042-.149-7.957a1.82 1.82 0 0 0-.033-.217c-.359-1.24-.818-2.177-1.321-2.775-.937-1.12-1.841-2.043-2.727-2.947-2.794-2.844-5.52-5.66-8.489-13.707-.944-2.557-2.48-8.714-3.886-14.7a724.443 724.443 0 0 1-3.026-13.472 6.868 6.868 0 0 1-.149-1.418c0-1.417.451-2.78 1.317-3.866.971-1.229 2.337-1.922 3.821-1.919.102 0 .206.004.309.01 2.438.166 4.783 2.014 6.561 4.943.792 1.308 1.48 2.829 2.096 4.416-.029-1.863-.062-3.812-.096-5.758l-.003-.153c-.1-5.848-.208-12.153-.208-17.466 0-3.485.046-6.542.173-8.772.236-4.182 3.166-6.721 6.016-6.996.171-.016.344-.025.521-.025a5.82 5.82 0 0 1 3.147.949c.011-.788.022-1.55.035-2.244.04-2.29 1.042-4.09 2.472-5.278 1.431-1.191 3.272-1.795 5.051-1.796h.059c1.641.02 3.332.695 4.638 1.839 1.263 1.107 2.159 2.685 2.214 4.534a7.507 7.507 0 0 1 3.64-.79c1.503.06 3.06.569 4.268 1.587 1.209 1.014 2.042 2.563 2.037 4.562v.016l-.008 6.815a7.435 7.435 0 0 1 2.701-.548h.002l.123-.001c1.759 0 3.558.601 4.949 1.897 1.392 1.295 2.347 3.279 2.452 5.94.079 1.935.163 3.877.247 5.817.326 7.526.656 15.147.656 22.457-.005 13.915-1.182 26.703-5.944 35.618-.404.767-.673 1.51-.73 3.019l-.002.157c-.001 2.687.866 28.319 1.735 53.296.204 5.862.408 11.669.6 17.155l.029.828a91.195 91.195 0 0 0 20.18-7.671c.085-9.493.149-18.891.149-25.841 0-5.459-.041-9.428-.138-10.679a2.968 2.968 0 0 0-.035-.316c-.246-.847-.554-1.471-.87-1.847-.67-.799-1.32-1.463-1.959-2.116l-.004-.004c-2.063-2.097-4.1-4.209-6.289-10.151-.697-1.891-1.818-6.383-2.845-10.755a535.498 535.498 0 0 1-2.21-9.833 5.462 5.462 0 0 1-.119-1.131c0-1.137.363-2.234 1.062-3.112.795-1.004 1.924-1.581 3.147-1.578l.263.009c1.952.134 3.787 1.576 5.156 3.829.209.344.41.721.608 1.113a957.28 957.28 0 0 0-.032-1.836l-.003-.201c-.072-4.238-.15-8.797-.15-12.646 0-2.543.034-4.775.126-6.41.187-3.302 2.524-5.323 4.811-5.541h.001c.137-.013.277-.02.419-.02.59 0 1.22.124 1.835.387.004-.299.009-.589.015-.867.03-1.808.811-3.244 1.937-4.189 1.126-.948 2.579-1.427 4.004-1.428h.06c1.444.016 2.784.615 3.777 1.545.819.767 1.403 1.77 1.605 2.875a6.047 6.047 0 0 1 2.05-.357l.224.004h.001c1.241.05 2.488.496 3.445 1.332.957.833 1.607 2.08 1.603 3.622v.012c-.003 1.274-.005 2.748-.006 4.316a5.801 5.801 0 0 1 1.483-.226h.001l.109-.001c1.388 0 2.812.474 3.915 1.497 1.104 1.021 1.858 2.588 1.94 4.666.077 1.877.165 3.76.253 5.642l.037.796c.264 5.593.523 11.081.523 16.263-.004 9.447-.849 17.877-4.162 24.081-.264.504-.436.97-.477 1.992Z' fill='%23223279'/%3E%3C/svg%3E"); | |
| } | |
| @media only screen and (min-width: 450px) { | |
| .stat-container { | |
| display: flex; | |
| flex-wrap: wrap; | |
| gap: 0; | |
| } | |
| .stat-block { | |
| margin: 0; | |
| } | |
| .col { | |
| width: 100%; | |
| flex-basis: 100%; | |
| flex-grow: 1; | |
| flex-basis: 30%; | |
| } | |
| /* 2 siblings */ | |
| .col:nth-of-type(1):nth-last-of-type(2n), | |
| .col:nth-of-type(1):nth-last-of-type(2n) ~ .col { | |
| flex-basis: 50%; | |
| } | |
| /* 3 siblings */ | |
| .col:nth-of-type(1):nth-last-of-type(3n), | |
| .col:nth-of-type(1):nth-last-of-type(3n) ~ .col { | |
| flex-basis: 33%; | |
| } | |
| /* 4 siblings */ | |
| .col:nth-of-type(1):nth-last-of-type(4n), | |
| .col:nth-of-type(1):nth-last-of-type(4n) ~ .col { | |
| flex-basis: 50%; | |
| } | |
| .float.icon { | |
| display: block; | |
| width: 40cqi; | |
| height: 40cqi; | |
| margin: 1rem 5cqi 0 -5cqi; | |
| float: right; | |
| } | |
| } | |
| @media only screen and (min-width: 765px) { | |
| /* 4 siblings */ | |
| .col:nth-of-type(1):nth-last-of-type(4n), | |
| .col:nth-of-type(1):nth-last-of-type(4n) ~ .col { | |
| flex-basis: 25%; | |
| } | |
| .container { | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: flex-start; | |
| } | |
| .summary { | |
| margin: 3rem 0 2rem; | |
| } | |
| .summary .container { | |
| justify-content: space-between; | |
| } | |
| .summary .container .col { | |
| margin: 0 2rem 0 0; | |
| } | |
| .summary .container .col:last-of-type { | |
| margin: 0; | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment