diff --git a/dist/fonts/stylesheet.css b/dist/fonts/stylesheet.css index 623c13c..5ccfb3c 100644 --- a/dist/fonts/stylesheet.css +++ b/dist/fonts/stylesheet.css @@ -1,24 +1 @@ -@font-face { - font-family: 'IBM Plex Mono'; - src: url('IBMPlexMono.eot'); - src: url('IBMPlexMono.eot?#iefix') format('embedded-opentype'), - url('IBMPlexMono.woff2') format('woff2'), - url('IBMPlexMono.woff') format('woff'), - url('IBMPlexMono.ttf') format('truetype'); - font-weight: normal; - font-style: normal; - font-display: swap; -} - -@font-face { - font-family: 'IBM Plex Mono'; - src: url('IBMPlexMono-Bold.eot'); - src: url('IBMPlexMono-Bold.eot?#iefix') format('embedded-opentype'), - url('IBMPlexMono-Bold.woff2') format('woff2'), - url('IBMPlexMono-Bold.woff') format('woff'), - url('IBMPlexMono-Bold.ttf') format('truetype'); - font-weight: bold; - font-style: normal; - font-display: swap; -} - +@font-face{font-family:'IBM Plex Mono';src:url('IBMPlexMono.eot');src:url('IBMPlexMono.eot?#iefix') format('embedded-opentype'),url('IBMPlexMono.woff2') format('woff2'),url('IBMPlexMono.woff') format('woff'),url('IBMPlexMono.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:'IBM Plex Mono';src:url('IBMPlexMono-Bold.eot');src:url('IBMPlexMono-Bold.eot?#iefix') format('embedded-opentype'),url('IBMPlexMono-Bold.woff2') format('woff2'),url('IBMPlexMono-Bold.woff') format('woff'),url('IBMPlexMono-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap} diff --git a/dist/plain-ui.css b/dist/plain-ui.css index c91ebce..784fb14 100644 --- a/dist/plain-ui.css +++ b/dist/plain-ui.css @@ -1,5325 +1 @@ -@charset "UTF-8"; -@font-face { - font-family: "IBM Plex Mono"; - src: url(/fonts/IBMPlexMono.eot?85f924ecb898e5720062617e4a86f1d1); - src: url(/fonts/IBMPlexMono.eot?85f924ecb898e5720062617e4a86f1d1) format("embedded-opentype"), url(/fonts/IBMPlexMono.woff2?db620201a437f00ce78da2a10cf50f3f) format("woff2"), url(/fonts/IBMPlexMono.woff?3d04ef6de65d3c77bd60c158326be298) format("woff"), url(/fonts/IBMPlexMono.ttf?ce51a85eb7160067d01bcf6e56f837d1) format("truetype"); - font-weight: normal; - font-style: normal; - font-display: swap; -} -@font-face { - font-family: "IBM Plex Mono"; - src: url(/fonts/IBMPlexMono-Bold.eot?eb105b142ce736849ef4828cb0c8eb34); - src: url(/fonts/IBMPlexMono-Bold.eot?eb105b142ce736849ef4828cb0c8eb34) format("embedded-opentype"), url(/fonts/IBMPlexMono-Bold.woff2?8b633c62813e0275ebd7a1c793c4e99c) format("woff2"), url(/fonts/IBMPlexMono-Bold.woff?b72090c625b4144f3763d5b2bf8f5942) format("woff"), url(/fonts/IBMPlexMono-Bold.ttf?558e55bd46468bb8d7074d7064d02c30) format("truetype"); - font-weight: bold; - font-style: normal; - font-display: swap; -} -:root { - --reflex-columns: 12; - --reflex-grid-spacing: 15px; - --reflex-xs: 576px; - --reflex-sm: 768px; - --reflex-md: 992px; - --reflex-lg: 1200px; - --reflex-xlg: 1600px; - --reflex-xxs-max: 575px; - --reflex-xs-max: 767px; - --reflex-sm-max: 991px; - --reflex-md-max: 1199px; - --reflex-lg-max: 1599px; -} - -.container, -.container-full { - box-sizing: border-box; - width: 100%; - margin-right: auto; - margin-left: auto; - padding-right: 30px; - padding-left: 30px; -} -.container .grid, -.container-full .grid { - margin-right: -15px; - margin-left: -15px; -} - -@media (min-width: 576px) { - .container { - max-width: 576px; - } -} -@media (min-width: 768px) { - .container { - max-width: 768px; - } -} -@media (min-width: 992px) { - .container { - max-width: 992px; - } -} -@media (min-width: 1200px) { - .container { - max-width: 1200px; - } -} -@media (min-width: 1600px) { - .container { - max-width: 1600px; - } -} - -.grid { - box-sizing: border-box; - display: block; - display: flex; - flex-wrap: wrap; - padding: 0; - margin: 0 auto; - position: relative; - letter-spacing: -0.31em; - *letter-spacing: normal; - word-spacing: -0.43em; - list-style-type: none; -} -.grid::before, .grid::after { - box-sizing: border-box; - letter-spacing: normal; - word-spacing: normal; - white-space: normal; -} - -[class*=col-] { - box-sizing: border-box; - letter-spacing: normal; - word-spacing: normal; - white-space: normal; - position: relative; - width: 100%; - vertical-align: top; - padding: 15px; - display: inline-block; - *display: inline; - zoom: 1; -} -[class*=col-]::before, [class*=col-]::after { - box-sizing: border-box; - letter-spacing: normal; - word-spacing: normal; - white-space: normal; -} -[class*=col-] .grid { - flex: 1 1 auto; - margin: -15px; -} - -.col-12 { - width: 100%; - *width: 99.9%; -} - -.col-11 { - width: 91.6666666667%; - *width: 91.5666666667%; -} - -.col-10 { - width: 83.3333333333%; - *width: 83.2333333333%; -} - -.col-9 { - width: 75%; - *width: 74.9%; -} - -.col-8 { - width: 66.6666666667%; - *width: 66.5666666667%; -} - -.col-7 { - width: 58.3333333333%; - *width: 58.2333333333%; -} - -.col-6 { - width: 50%; - *width: 49.9%; -} - -.col-5 { - width: 41.6666666667%; - *width: 41.5666666667%; -} - -.col-4 { - width: 33.3333333333%; - *width: 33.2333333333%; -} - -.col-3 { - width: 25%; - *width: 24.9%; -} - -.col-2 { - width: 16.6666666667%; - *width: 16.5666666667%; -} - -.col-1 { - width: 8.3333333333%; - *width: 8.2333333333%; -} - -@media (min-width: 576px) { - .col-xs-12 { - width: 100%; - *width: 99.9%; - } - - .col-xs-11 { - width: 91.6666666667%; - *width: 91.5666666667%; - } - - .col-xs-10 { - width: 83.3333333333%; - *width: 83.2333333333%; - } - - .col-xs-9 { - width: 75%; - *width: 74.9%; - } - - .col-xs-8 { - width: 66.6666666667%; - *width: 66.5666666667%; - } - - .col-xs-7 { - width: 58.3333333333%; - *width: 58.2333333333%; - } - - .col-xs-6 { - width: 50%; - *width: 49.9%; - } - - .col-xs-5 { - width: 41.6666666667%; - *width: 41.5666666667%; - } - - .col-xs-4 { - width: 33.3333333333%; - *width: 33.2333333333%; - } - - .col-xs-3 { - width: 25%; - *width: 24.9%; - } - - .col-xs-2 { - width: 16.6666666667%; - *width: 16.5666666667%; - } - - .col-xs-1 { - width: 8.3333333333%; - *width: 8.2333333333%; - } -} -@media (min-width: 768px) { - .col-sm-12 { - width: 100%; - *width: 99.9%; - } - - .col-sm-11 { - width: 91.6666666667%; - *width: 91.5666666667%; - } - - .col-sm-10 { - width: 83.3333333333%; - *width: 83.2333333333%; - } - - .col-sm-9 { - width: 75%; - *width: 74.9%; - } - - .col-sm-8 { - width: 66.6666666667%; - *width: 66.5666666667%; - } - - .col-sm-7 { - width: 58.3333333333%; - *width: 58.2333333333%; - } - - .col-sm-6 { - width: 50%; - *width: 49.9%; - } - - .col-sm-5 { - width: 41.6666666667%; - *width: 41.5666666667%; - } - - .col-sm-4 { - width: 33.3333333333%; - *width: 33.2333333333%; - } - - .col-sm-3 { - width: 25%; - *width: 24.9%; - } - - .col-sm-2 { - width: 16.6666666667%; - *width: 16.5666666667%; - } - - .col-sm-1 { - width: 8.3333333333%; - *width: 8.2333333333%; - } -} -@media (min-width: 992px) { - .col-md-12 { - width: 100%; - *width: 99.9%; - } - - .col-md-11 { - width: 91.6666666667%; - *width: 91.5666666667%; - } - - .col-md-10 { - width: 83.3333333333%; - *width: 83.2333333333%; - } - - .col-md-9 { - width: 75%; - *width: 74.9%; - } - - .col-md-8 { - width: 66.6666666667%; - *width: 66.5666666667%; - } - - .col-md-7 { - width: 58.3333333333%; - *width: 58.2333333333%; - } - - .col-md-6 { - width: 50%; - *width: 49.9%; - } - - .col-md-5 { - width: 41.6666666667%; - *width: 41.5666666667%; - } - - .col-md-4 { - width: 33.3333333333%; - *width: 33.2333333333%; - } - - .col-md-3 { - width: 25%; - *width: 24.9%; - } - - .col-md-2 { - width: 16.6666666667%; - *width: 16.5666666667%; - } - - .col-md-1 { - width: 8.3333333333%; - *width: 8.2333333333%; - } -} -@media (min-width: 1200px) { - .col-lg-12 { - width: 100%; - *width: 99.9%; - } - - .col-lg-11 { - width: 91.6666666667%; - *width: 91.5666666667%; - } - - .col-lg-10 { - width: 83.3333333333%; - *width: 83.2333333333%; - } - - .col-lg-9 { - width: 75%; - *width: 74.9%; - } - - .col-lg-8 { - width: 66.6666666667%; - *width: 66.5666666667%; - } - - .col-lg-7 { - width: 58.3333333333%; - *width: 58.2333333333%; - } - - .col-lg-6 { - width: 50%; - *width: 49.9%; - } - - .col-lg-5 { - width: 41.6666666667%; - *width: 41.5666666667%; - } - - .col-lg-4 { - width: 33.3333333333%; - *width: 33.2333333333%; - } - - .col-lg-3 { - width: 25%; - *width: 24.9%; - } - - .col-lg-2 { - width: 16.6666666667%; - *width: 16.5666666667%; - } - - .col-lg-1 { - width: 8.3333333333%; - *width: 8.2333333333%; - } -} -@media (min-width: 1600px) { - .col-xlg-12 { - width: 100%; - *width: 99.9%; - } - - .col-xlg-11 { - width: 91.6666666667%; - *width: 91.5666666667%; - } - - .col-xlg-10 { - width: 83.3333333333%; - *width: 83.2333333333%; - } - - .col-xlg-9 { - width: 75%; - *width: 74.9%; - } - - .col-xlg-8 { - width: 66.6666666667%; - *width: 66.5666666667%; - } - - .col-xlg-7 { - width: 58.3333333333%; - *width: 58.2333333333%; - } - - .col-xlg-6 { - width: 50%; - *width: 49.9%; - } - - .col-xlg-5 { - width: 41.6666666667%; - *width: 41.5666666667%; - } - - .col-xlg-4 { - width: 33.3333333333%; - *width: 33.2333333333%; - } - - .col-xlg-3 { - width: 25%; - *width: 24.9%; - } - - .col-xlg-2 { - width: 16.6666666667%; - *width: 16.5666666667%; - } - - .col-xlg-1 { - width: 8.3333333333%; - *width: 8.2333333333%; - } -} -.col-auto { - flex: 1 0 0px; - width: auto; -} - -@media (min-width: 576px) { - .col-xs-auto { - flex: 1 0 0px; - width: auto; - } -} -@media (min-width: 768px) { - .col-sm-auto { - flex: 1 0 0px; - width: auto; - } -} -@media (min-width: 992px) { - .col-md-auto { - flex: 1 0 0px; - width: auto; - } -} -@media (min-width: 1200px) { - .col-lg-auto { - flex: 1 0 0px; - width: auto; - } -} -@media (min-width: 1600px) { - .col-xlg-auto { - flex: 1 0 0px; - width: auto; - } -} -.order-12 { - order: 12; -} - -.order-11 { - order: 11; -} - -.order-10 { - order: 10; -} - -.order-9 { - order: 9; -} - -.order-8 { - order: 8; -} - -.order-7 { - order: 7; -} - -.order-6 { - order: 6; -} - -.order-5 { - order: 5; -} - -.order-4 { - order: 4; -} - -.order-3 { - order: 3; -} - -.order-2 { - order: 2; -} - -.order-1 { - order: 1; -} - -.order-0 { - order: 0; -} - -@media (min-width: 576px) { - .order-xs-12 { - order: 12; - } - - .order-xs-11 { - order: 11; - } - - .order-xs-10 { - order: 10; - } - - .order-xs-9 { - order: 9; - } - - .order-xs-8 { - order: 8; - } - - .order-xs-7 { - order: 7; - } - - .order-xs-6 { - order: 6; - } - - .order-xs-5 { - order: 5; - } - - .order-xs-4 { - order: 4; - } - - .order-xs-3 { - order: 3; - } - - .order-xs-2 { - order: 2; - } - - .order-xs-1 { - order: 1; - } - - .order-xs-0 { - order: 0; - } -} -@media (min-width: 768px) { - .order-sm-12 { - order: 12; - } - - .order-sm-11 { - order: 11; - } - - .order-sm-10 { - order: 10; - } - - .order-sm-9 { - order: 9; - } - - .order-sm-8 { - order: 8; - } - - .order-sm-7 { - order: 7; - } - - .order-sm-6 { - order: 6; - } - - .order-sm-5 { - order: 5; - } - - .order-sm-4 { - order: 4; - } - - .order-sm-3 { - order: 3; - } - - .order-sm-2 { - order: 2; - } - - .order-sm-1 { - order: 1; - } - - .order-sm-0 { - order: 0; - } -} -@media (min-width: 992px) { - .order-md-12 { - order: 12; - } - - .order-md-11 { - order: 11; - } - - .order-md-10 { - order: 10; - } - - .order-md-9 { - order: 9; - } - - .order-md-8 { - order: 8; - } - - .order-md-7 { - order: 7; - } - - .order-md-6 { - order: 6; - } - - .order-md-5 { - order: 5; - } - - .order-md-4 { - order: 4; - } - - .order-md-3 { - order: 3; - } - - .order-md-2 { - order: 2; - } - - .order-md-1 { - order: 1; - } - - .order-md-0 { - order: 0; - } -} -@media (min-width: 1200px) { - .order-lg-12 { - order: 12; - } - - .order-lg-11 { - order: 11; - } - - .order-lg-10 { - order: 10; - } - - .order-lg-9 { - order: 9; - } - - .order-lg-8 { - order: 8; - } - - .order-lg-7 { - order: 7; - } - - .order-lg-6 { - order: 6; - } - - .order-lg-5 { - order: 5; - } - - .order-lg-4 { - order: 4; - } - - .order-lg-3 { - order: 3; - } - - .order-lg-2 { - order: 2; - } - - .order-lg-1 { - order: 1; - } - - .order-lg-0 { - order: 0; - } -} -@media (min-width: 1600px) { - .order-xlg-12 { - order: 12; - } - - .order-xlg-11 { - order: 11; - } - - .order-xlg-10 { - order: 10; - } - - .order-xlg-9 { - order: 9; - } - - .order-xlg-8 { - order: 8; - } - - .order-xlg-7 { - order: 7; - } - - .order-xlg-6 { - order: 6; - } - - .order-xlg-5 { - order: 5; - } - - .order-xlg-4 { - order: 4; - } - - .order-xlg-3 { - order: 3; - } - - .order-xlg-2 { - order: 2; - } - - .order-xlg-1 { - order: 1; - } - - .order-xlg-0 { - order: 0; - } -} -.offset-11 { - margin-left: 91.6666666667%; - *margin-left: 91.5666666667%; -} - -.offset-10 { - margin-left: 83.3333333333%; - *margin-left: 83.2333333333%; -} - -.offset-9 { - margin-left: 75%; - *margin-left: 74.9%; -} - -.offset-8 { - margin-left: 66.6666666667%; - *margin-left: 66.5666666667%; -} - -.offset-7 { - margin-left: 58.3333333333%; - *margin-left: 58.2333333333%; -} - -.offset-6 { - margin-left: 50%; - *margin-left: 49.9%; -} - -.offset-5 { - margin-left: 41.6666666667%; - *margin-left: 41.5666666667%; -} - -.offset-4 { - margin-left: 33.3333333333%; - *margin-left: 33.2333333333%; -} - -.offset-3 { - margin-left: 25%; - *margin-left: 24.9%; -} - -.offset-2 { - margin-left: 16.6666666667%; - *margin-left: 16.5666666667%; -} - -.offset-1 { - margin-left: 8.3333333333%; - *margin-left: 8.2333333333%; -} - -@media (min-width: 576px) { - .offset-xs-11 { - margin-left: 91.6666666667%; - *margin-left: 91.5666666667%; - } - - .offset-xs-10 { - margin-left: 83.3333333333%; - *margin-left: 83.2333333333%; - } - - .offset-xs-9 { - margin-left: 75%; - *margin-left: 74.9%; - } - - .offset-xs-8 { - margin-left: 66.6666666667%; - *margin-left: 66.5666666667%; - } - - .offset-xs-7 { - margin-left: 58.3333333333%; - *margin-left: 58.2333333333%; - } - - .offset-xs-6 { - margin-left: 50%; - *margin-left: 49.9%; - } - - .offset-xs-5 { - margin-left: 41.6666666667%; - *margin-left: 41.5666666667%; - } - - .offset-xs-4 { - margin-left: 33.3333333333%; - *margin-left: 33.2333333333%; - } - - .offset-xs-3 { - margin-left: 25%; - *margin-left: 24.9%; - } - - .offset-xs-2 { - margin-left: 16.6666666667%; - *margin-left: 16.5666666667%; - } - - .offset-xs-1 { - margin-left: 8.3333333333%; - *margin-left: 8.2333333333%; - } - - .offset-xs-0 { - margin-left: 0; - *margin-left: -0.1%; - } -} -@media (min-width: 768px) { - .offset-sm-11 { - margin-left: 91.6666666667%; - *margin-left: 91.5666666667%; - } - - .offset-sm-10 { - margin-left: 83.3333333333%; - *margin-left: 83.2333333333%; - } - - .offset-sm-9 { - margin-left: 75%; - *margin-left: 74.9%; - } - - .offset-sm-8 { - margin-left: 66.6666666667%; - *margin-left: 66.5666666667%; - } - - .offset-sm-7 { - margin-left: 58.3333333333%; - *margin-left: 58.2333333333%; - } - - .offset-sm-6 { - margin-left: 50%; - *margin-left: 49.9%; - } - - .offset-sm-5 { - margin-left: 41.6666666667%; - *margin-left: 41.5666666667%; - } - - .offset-sm-4 { - margin-left: 33.3333333333%; - *margin-left: 33.2333333333%; - } - - .offset-sm-3 { - margin-left: 25%; - *margin-left: 24.9%; - } - - .offset-sm-2 { - margin-left: 16.6666666667%; - *margin-left: 16.5666666667%; - } - - .offset-sm-1 { - margin-left: 8.3333333333%; - *margin-left: 8.2333333333%; - } - - .offset-sm-0 { - margin-left: 0; - *margin-left: -0.1%; - } -} -@media (min-width: 992px) { - .offset-md-11 { - margin-left: 91.6666666667%; - *margin-left: 91.5666666667%; - } - - .offset-md-10 { - margin-left: 83.3333333333%; - *margin-left: 83.2333333333%; - } - - .offset-md-9 { - margin-left: 75%; - *margin-left: 74.9%; - } - - .offset-md-8 { - margin-left: 66.6666666667%; - *margin-left: 66.5666666667%; - } - - .offset-md-7 { - margin-left: 58.3333333333%; - *margin-left: 58.2333333333%; - } - - .offset-md-6 { - margin-left: 50%; - *margin-left: 49.9%; - } - - .offset-md-5 { - margin-left: 41.6666666667%; - *margin-left: 41.5666666667%; - } - - .offset-md-4 { - margin-left: 33.3333333333%; - *margin-left: 33.2333333333%; - } - - .offset-md-3 { - margin-left: 25%; - *margin-left: 24.9%; - } - - .offset-md-2 { - margin-left: 16.6666666667%; - *margin-left: 16.5666666667%; - } - - .offset-md-1 { - margin-left: 8.3333333333%; - *margin-left: 8.2333333333%; - } - - .offset-md-0 { - margin-left: 0; - *margin-left: -0.1%; - } -} -@media (min-width: 1200px) { - .offset-lg-11 { - margin-left: 91.6666666667%; - *margin-left: 91.5666666667%; - } - - .offset-lg-10 { - margin-left: 83.3333333333%; - *margin-left: 83.2333333333%; - } - - .offset-lg-9 { - margin-left: 75%; - *margin-left: 74.9%; - } - - .offset-lg-8 { - margin-left: 66.6666666667%; - *margin-left: 66.5666666667%; - } - - .offset-lg-7 { - margin-left: 58.3333333333%; - *margin-left: 58.2333333333%; - } - - .offset-lg-6 { - margin-left: 50%; - *margin-left: 49.9%; - } - - .offset-lg-5 { - margin-left: 41.6666666667%; - *margin-left: 41.5666666667%; - } - - .offset-lg-4 { - margin-left: 33.3333333333%; - *margin-left: 33.2333333333%; - } - - .offset-lg-3 { - margin-left: 25%; - *margin-left: 24.9%; - } - - .offset-lg-2 { - margin-left: 16.6666666667%; - *margin-left: 16.5666666667%; - } - - .offset-lg-1 { - margin-left: 8.3333333333%; - *margin-left: 8.2333333333%; - } - - .offset-lg-0 { - margin-left: 0; - *margin-left: -0.1%; - } -} -@media (min-width: 1600px) { - .offset-xlg-11 { - margin-left: 91.6666666667%; - *margin-left: 91.5666666667%; - } - - .offset-xlg-10 { - margin-left: 83.3333333333%; - *margin-left: 83.2333333333%; - } - - .offset-xlg-9 { - margin-left: 75%; - *margin-left: 74.9%; - } - - .offset-xlg-8 { - margin-left: 66.6666666667%; - *margin-left: 66.5666666667%; - } - - .offset-xlg-7 { - margin-left: 58.3333333333%; - *margin-left: 58.2333333333%; - } - - .offset-xlg-6 { - margin-left: 50%; - *margin-left: 49.9%; - } - - .offset-xlg-5 { - margin-left: 41.6666666667%; - *margin-left: 41.5666666667%; - } - - .offset-xlg-4 { - margin-left: 33.3333333333%; - *margin-left: 33.2333333333%; - } - - .offset-xlg-3 { - margin-left: 25%; - *margin-left: 24.9%; - } - - .offset-xlg-2 { - margin-left: 16.6666666667%; - *margin-left: 16.5666666667%; - } - - .offset-xlg-1 { - margin-left: 8.3333333333%; - *margin-left: 8.2333333333%; - } - - .offset-xlg-0 { - margin-left: 0; - *margin-left: -0.1%; - } -} -.wrap { - flex-wrap: wrap; -} - -.no-wrap { - flex-wrap: nowrap; -} -.no-wrap [class*=col-] { - flex-shrink: 1; -} - -.wrap-reverse { - flex-wrap: wrap-reverse; -} - -.direction-row { - flex-direction: row; -} - -.direction-row-reverse { - flex-direction: row-reverse; -} - -.direction-column { - flex-direction: column; -} - -.direction-column-reverse { - flex-direction: column-reverse; -} - -.align-start { - align-items: flex-start; -} - -.align-end { - align-items: flex-end; -} -.align-end [class*=col-] { - vertical-align: bottom; -} - -.align-center { - align-items: center; -} -.align-center [class*=col-] { - vertical-align: middle; -} - -.align-baseline { - align-items: baseline; -} - -.align-content-start { - align-content: flex-start; -} - -.align-content-end { - align-content: flex-end; -} -.align-content-end [class*=col-] { - vertical-align: bottom; -} - -.align-content-center { - align-content: center; -} - -.align-content-space-between { - align-content: space-between; -} - -.align-content-space-around { - align-content: space-around; -} - -.align-self-stretch { - align-self: stretch; -} - -.align-self-start { - align-self: flex-start; -} - -.align-self-end { - align-self: flex-end; - vertical-align: bottom; -} - -.align-self-center { - align-self: center; - vertical-align: middle; -} - -.align-self-baseline { - align-self: baseline; - vertical-align: baseline; -} - -.justify-start { - justify-content: flex-start; -} -.justify-start.grid { - text-align: left; -} - -.justify-end { - justify-content: flex-end; -} -.justify-end.grid { - text-align: right; - -moz-text-align-last: right; - text-align-last: right; -} -.justify-end.grid [class*=col-] { - text-align: left; - text-align: start; - -moz-text-align-last: left; - -moz-text-align-last: start; - text-align-last: left; - text-align-last: start; -} - -.justify-center { - justify-content: center; -} -.justify-center.grid { - text-align: center; - -moz-text-align-last: center; - text-align-last: center; -} -.justify-center.grid [class*=col-] { - text-align: left; - text-align: start; - -moz-text-align-last: left; - -moz-text-align-last: start; - text-align-last: left; - text-align-last: start; -} - -.justify-space-between { - justify-content: space-between; -} -.justify-space-between.grid { - text-align: justify; - -moz-text-align-last: justify; - text-align-last: justify; -} -.justify-space-between.grid [class*=col-] { - text-align: left; - text-align: start; - -moz-text-align-last: left; - -moz-text-align-last: start; - text-align-last: left; - text-align-last: start; -} - -.justify-space-around { - justify-content: space-around; -} -.justify-space-around.grid { - text-align: justify; - -moz-text-align-last: justify; - text-align-last: justify; -} -.justify-space-around.grid [class*=col-] { - text-align: left; - text-align: start; - -moz-text-align-last: left; - -moz-text-align-last: start; - text-align-last: left; - text-align-last: start; -} - -.grid-bleed [class*=col-] { - padding: 0; -} - -.col-grid { - display: flex; - flex-direction: column; -} -.col-grid.direction-row { - flex-direction: row; -} - -.col-bleed { - padding: 0; -} - -.col-bleed-x { - padding: 15px 0; -} - -.col-bleed-y { - padding: 0 15px; -} - -.flex-img { - display: block; - flex: 0 0 auto; - max-width: 100%; - height: auto; - width: 100%; - *width: auto; -} - -.flex-footer { - width: 100%; - margin-top: auto; - margin-bottom: 0; -} -.flex-footer > :last-child { - margin-bottom: 0; -} - -@media (min-width: 0px) and (max-width: 575px) { - .hidden-xxs { - display: none; - } -} - -@media (min-width: 576px) { - .hidden-xs-up { - display: none; - } -} - -@media (max-width: 767px) { - .hidden-xs-down { - display: none; - } -} - -@media (min-width: 576px) and (max-width: 767px) { - .hidden-xs { - display: none; - } -} - -@media (min-width: 768px) { - .hidden-sm-up { - display: none; - } -} - -@media (max-width: 991px) { - .hidden-sm-down { - display: none; - } -} - -@media (min-width: 768px) and (max-width: 991px) { - .hidden-sm { - display: none; - } -} - -@media (min-width: 992px) { - .hidden-md-up { - display: none; - } -} - -@media (max-width: 1199px) { - .hidden-md-down { - display: none; - } -} - -@media (min-width: 992px) and (max-width: 1199px) { - .hidden-md { - display: none; - } -} - -@media (min-width: 1200px) { - .hidden-lg-up { - display: none; - } -} - -@media (max-width: 1599px) { - .hidden-lg-down { - display: none; - } -} - -@media (min-width: 1200px) and (max-width: 1599px) { - .hidden-lg { - display: none; - } -} - -@media (min-width: 1600px) { - .hidden-xlg { - display: none; - } -} - -/** - * functions - * - * - * @author Björn Hase, Tentakelfabrik - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://github.com/tentakelfabrik/crispy-css - * - */ -/** - * strip unit from value - * - * @param {mixed} $value - * @return {number} - * - */ -/** - * get value of key "default" in map - * - * @param {map} $value - * @return {boolean|unit} - * - */ -/** - * factor - * - * - * - * @param {integer} $x - * @return {float} - * - */ -/** - * mixins - * - * - * @author Björn Hase, Tentakelfabrik - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://github.com/tentakelfabrik/plain-ui-css - * - */ -/** - * Clear Floats - * - * - * - */ -/** - * clear styles from list - * - * - */ -/** - * media-queries as mixins - * based on breakpoints from variables - * - * - * - */ -/** - * Set property and his value for each Breakpoint - * - * ( - * $plain-ui__md: 10px - * ) - * - * - * @param {css} $property - * @param {map} $breakpoints - * @param {Boolean} $important [false] - * - */ -/** - * Set property and his value with an factor for each Breakpoint - * - * ( - * $plain-ui__md: 10px - * ) - * - * @param {css} $property - * @param {number} $factor - * @param {map} $breakpoints - * @param {Boolean} $important [false] - * - */ -/** - * Set font-size from Breakpoints, use for calculating difference from font-size and default font-size - * - * ( - * $plain-ui__md: 1rem - * ) - * - * @param {map} $breakpoints - * @param {unit} $font-size - * @param {unit} $default - * @param {Boolean} $important [false] - * - */ -/** - * variables - * - * - * - * @author Björn Hase, Tentakelfabrik - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://github.com/tentakelfabrik/plain-ui-css - * - */ -/** - * breakpoints - * - */ -/** - * fonts - * - */ -/** - * colors - * - * - */ -:root { - --primary: #585858; - --primary-light: #585858; - --primary-active: #717171; - --primary-dark: #252525; - --link: #585858; - --link-hover: #ecacac; - --danger: #d95959; - --danger-light: #ecacac; - --success: #64ac64; - --white: #ffffff; - --black: #000000; - --text: #363636; - --background: #f9f9f9; - --border: #dfdfdf; -} - -/** - * padding & margin - * - */ -/** - * z-index - * - */ -/** - * core - * - * - * @author Björn Hase, Tentakelfabrik - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://github.com/tentakelfabrik/crispy-css - * - */ -/** - * normalize - * - * Thanks to https://necolas.github.io/normalize.css/, use a lot from them - * - * @author Björn Hase, Tentakelfabrik - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://github.com/tentakelfabrik/crispy-css - * - */ -html { - font-size: 100%; - line-height: 1.15; - -webkit-text-size-adjust: 100%; -} - -body, -html { - margin: 0; - height: 100%; -} - -html, -legend { - box-sizing: border-box; -} - -body { - font-family: "IBM Plex Mono", sans-serif; - color: var(--text); - background-color: var(--background); - direction: ltr; - font-size: 1rem; - line-height: 1.618; -} - -a { - color: var(--link); - transition: color 0.5s; -} -a:hover { - color: var(--link-hover); -} -a:focus { - outline: none; -} - -main { - display: block; -} - -*, -*::after, -*::before { - box-sizing: inherit; -} - -table { - border-collapse: collapse; - border-spacing: 0; -} - -figure { - margin: 0 0 1rem; -} - -figcaption { - margin: 0; -} - -/** - * form elements - * - * - */ -button, -input, -optgroup, -select, -textarea { - margin: 0; -} - -fieldset { - margin: 0 0 1rem; -} - -button, -select { - text-transform: none; -} - -[type=button], -[type=reset], -[type=submit], -button { - -webkit-appearance: button; -} - -[type=button]::-moz-focus-inner, -[type=reset]::-moz-focus-inner, -[type=submit]::-moz-focus-inner, -button::-moz-focus-inner { - border-style: none; - padding: 0; -} - -[type=button]:-moz-focusring, -[type=reset]:-moz-focusring, -[type=submit]:-moz-focusring, -button:-moz-focusring { - outline: 1px dotted ButtonText; -} - -legend { - box-sizing: border-box; - display: table; - max-width: 100%; - padding: 0; - white-space: normal; -} - -[type=number]::-webkit-inner-spin-button, -[type=number]::-webkit-outer-spin-button { - height: auto; -} - -[type=search] { - -webkit-appearance: textfield; - outline-offset: -2px; -} - -[type=search]::-webkit-search-decoration { - -webkit-appearance: none; -} - -::-webkit-file-upload-button { - -webkit-appearance: button; - font: inherit; -} - -/** - * hr - * - */ -hr { - box-sizing: content-box; - height: 0; - overflow: visible; - border: 0; - border-top: 1px solid var(--border); - margin: 0 0 1rem; -} - -progress { - vertical-align: baseline; -} - -details { - display: block; -} - -summary { - display: list-item; -} - -code, -kbd, -pre, -samp { - font-family: "IBM Plex Mono", sans-serif; - font-size: 1rem; -} - -/** - * Heading - * - * - * @author Björn Hase, Tentakelfabrik - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://github.com/tentakelfabrik/crispy-css - * - */ -h1, .h1, -h2, .h2, -h3, .h3, -h4, .h4, -h5, .h5, -h6, .h6 { - font-family: "IBM Plex Mono", sans-serif; - font-weight: bold; - line-height: 1.2; - margin: 0 0 1rem; -} -@media only screen and (min-width: 992px) { - h1, .h1, -h2, .h2, -h3, .h3, -h4, .h4, -h5, .h5, -h6, .h6 { - margin: 0 0 1.5rem; - } -} - -h5 { - line-height: 1.4; -} - -h6 { - line-height: 1.618; -} - -h1, .h1 { - font-size: 2.5rem; -} -@media only screen and (min-width: 992px) { - h1, .h1 { - font-size: 3rem; - } -} - -h2, .h2 { - font-size: 2rem; -} -@media only screen and (min-width: 992px) { - h2, .h2 { - font-size: 2.4rem; - } -} - -h3, .h3 { - font-size: 1.75rem; -} -@media only screen and (min-width: 992px) { - h3, .h3 { - font-size: 2.1rem; - } -} - -h4, .h4 { - font-size: 1.5rem; -} -@media only screen and (min-width: 992px) { - h4, .h4 { - font-size: 1.8rem; - } -} - -h5, .h5 { - font-size: 1.25rem; -} -@media only screen and (min-width: 992px) { - h5, .h5 { - font-size: 1.5rem; - } -} - -h6, .h6 { - font-size: 1rem; -} -@media only screen and (min-width: 992px) { - h6, .h6 { - font-size: 1.2rem; - } -} - -/** - * Heading - * - * - * @author Björn Hase, Tentakelfabrik - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://github.com/tentakelfabrik/crispy-css - * - */ -.content { - /** - * Prevent `sub` and `sup` elements from affecting the line height in - * all browsers. - */ - /** - * blockquote - * - * - */ - /** - * lists - * - */ -} -.content p { - margin: 0 0 1rem; -} -.content a, -.content ins, -.content u { - -webkit-text-decoration-skip: ink edges; - text-decoration-skip: ink edges; -} -.content b, -.content strong { - font-weight: bolder; -} -.content small { - font-size: 80%; -} -.content sub, -.content sup { - font-size: 70%; - line-height: 0; - position: relative; - vertical-align: baseline; -} -.content sub { - bottom: -0.25em; -} -.content sup { - top: -0.5em; -} -.content abbr[title] { - border-bottom: 1px dotted; - cursor: help; - text-decoration: none; -} -.content mark { - padding: 0.25em; -} -.content blockquote { - border-left: 1px solid #585858; - margin-left: 0; - padding: 5px 12px; -} -.content blockquote p:last-child { - margin-bottom: 0; -} -.content dl, -.content ol, -.content ul { - padding: 0; - margin: 0 0 1rem; -} -.content ol, -.content ul { - margin-left: 1.5em; -} -.content ol ol, -.content ul ul { - margin-top: 0; - margin-left: 1em; -} -.content ol { - list-style: decimal outside; -} -.content ul { - list-style: disc outside; -} -.content dl { - margin-left: 0.5em; -} -.content dd, -.content dt { - margin: 0; -} -.content dt { - font-weight: bold; -} - -/** - * - * A - * - * - * @author Björn Hase, Tentakelfabrik - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://github.com/tentakelfabrik/crispy-css - * - */ -.badge { - display: inline-block; - background-color: var(--primary); - color: var(--white); - font-size: 0.85rem; - padding: 0.4em 0.8em; -} -.badge--round { - display: inline-flex; - justify-content: center; - border-radius: 50%; - width: 2.5em; -} - -/** - * - * - * - */ -.button { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - position: relative; - display: inline-flex; - align-items: center; - text-decoration: none; - font-family: "IBM Plex Mono", sans-serif; - font-size: 1rem; - border: 1px solid var(--primary); - background-color: var(--white); - color: var(--primary); - border-radius: 2px; - transition: background-color 0.1s; - margin-bottom: 0.5em; - padding: 0 1.3em; - min-height: 2.8em; - width: 100%; -} -@media only screen and (min-width: 768px) { - .button { - width: auto; - } -} -.button--small { - font-size: 0.8rem; -} -.button--clearfix { - margin: 0; - padding: 0; - border: none; - background: transparent; -} -.button--clearfix:focus, .button--clearfix:active { - outline: none; -} -.button:hover, .button--selected { - cursor: pointer; - text-decoration: none; - color: white; - background-color: var(--primary-active); -} -.button:focus, .button:active { - outline: 1px solid var(--primary-active); -} -.button:disabled { - opacity: 0.5; -} -.button:disabled:hover { - cursor: not-allowed; - border: 1px solid var(--primary); - background-color: white; - color: var(--primary); -} -.button--danger { - border-color: var(--danger); -} -.button--danger:hover { - background-color: var(--danger); -} -.button--danger:focus, .button--danger:active { - outline: 2px solid var(--primary-active); -} -.button--outline { - background-color: transparent; -} -.button--outline:hover { - color: var(--primary); - border-color: var(--primary-light); - background-color: transparent; -} -.button--danger.button--outline:hover { - border-color: var(--danger-light); -} - -/** - * - * - * - * - */ -/** - * - * - * - * - */ -.icon { - width: 1em; - height: 1em; - max-height: 100%; - max-width: 100%; - vertical-align: middle; - overflow: hidden; - font-size: 1.4rem; - fill: var(--text); -} - -/** - *
- * image - *
- * - */ -.hero { - position: relative; -} -.hero img { - width: 100%; - -o-object-fit: cover; - object-fit: cover; - -o-object-position: 50% 50%; - object-position: 50% 50%; -} - -/** - * - * - * - */ -/** - * - * - * - */ -/** - *
- * - *
- * food truck yr franzen pabst - *
- *
- * - */ -/** - * - * - * - */ -/** - *
- *
- *
- *
- *
- * - */ -/** - * - * - * - * - */ -.bar { - display: flex; - min-height: 2.8em; - background-color: #585858; - color: var(--white); -} -.bar .icon { - font-size: 1.5rem; -} -.bar__start { - justify-content: start; -} -.bar__main { - flex-grow: 1; -} -.bar__end { - justify-content: end; -} -.bar__start, .bar__main, .bar__end { - display: flex; - align-self: center; - margin-left: 0.75em; -} -.bar__start:last-child, .bar__main:last-child, .bar__end:last-child { - margin-right: 0.75em; -} -.bar .button:active, .bar .button:focus { - outline: none; -} - -/** - *
- * - *
- * food truck yr franzen pabst - *
- *
- * - */ -/** - * - * - * - */ -.loading { - height: 60px; - width: 47px; - margin: 0 auto; - display: flex; - align-items: center; -} -.loading span { - display: block; - width: 15px; - height: 80px; - background-color: var(--primary); - -webkit-animation-name: plain-ui__loading-animation; - animation-name: plain-ui__loading-animation; - -webkit-animation-duration: 0.5s; - animation-duration: 0.5s; - -webkit-animation-iteration-count: infinite; - animation-iteration-count: infinite; - -webkit-animation-delay: 0.15s; - animation-delay: 0.15s; - border-top: 1px solid var(--primary-dark); - border-bottom: 1px solid var(--primary-dark); -} -.loading span:first-child { - margin-right: 1px; - -webkit-animation-delay: 0s; - animation-delay: 0s; -} -.loading span:last-child { - margin-left: 1px; - -webkit-animation-delay: 0.3s; - animation-delay: 0.3s; -} - -@-webkit-keyframes plain-ui__loading-animation { - 0% { - height: 60px; - } - 50% { - height: 40px; - } - 100% { - height: 60px; - } -} - -@keyframes plain-ui__loading-animation { - 0% { - height: 60px; - } - 50% { - height: 40px; - } - 100% { - height: 60px; - } -} -/** - * masonry - * - *
- *
- * - *
- *
- * - * @author Björn Hase, Tentakelfabrik - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://github.com/tentakelfabrik/crispy-css - * - */ -.masonry { - display: flex; - width: 100%; - flex-flow: row wrap; -} -.masonry__item { - width: 100%; - height: 200px; - padding-left: 1px; - padding-bottom: 1px; -} -@media only screen and (min-width: 768px) { - .masonry__item { - height: 300px; - } - .masonry__item:nth-child(4n+1) { - width: 25%; - } - .masonry__item:nth-child(4n+2) { - width: 55%; - } - .masonry__item:nth-child(4n+3) { - width: 20%; - } - .masonry__item:nth-child(4n+4) { - width: 67%; - } - .masonry__item:nth-child(4n+5) { - width: 33%; - } -} - -:root { - --reflex-columns: 12; - --reflex-grid-spacing: 15px; - --reflex-xs: 576px; - --reflex-sm: 768px; - --reflex-md: 992px; - --reflex-lg: 1200px; - --reflex-xlg: 1600px; - --reflex-xxs-max: 575px; - --reflex-xs-max: 767px; - --reflex-sm-max: 991px; - --reflex-md-max: 1199px; - --reflex-lg-max: 1599px; -} - -.container, -.container-full { - box-sizing: border-box; - width: 100%; - margin-right: auto; - margin-left: auto; - padding-right: 30px; - padding-left: 30px; -} - -.container .grid, -.container-full .grid { - margin-right: -15px; - margin-left: -15px; -} - -@media (min-width: 576px) { - .container { - max-width: 576px; - } -} -@media (min-width: 768px) { - .container { - max-width: 768px; - } -} -@media (min-width: 992px) { - .container { - max-width: 992px; - } -} -@media (min-width: 1200px) { - .container { - max-width: 1200px; - } -} -@media (min-width: 1600px) { - .container { - max-width: 1600px; - } -} -.grid { - box-sizing: border-box; - display: block; - display: flex; - flex-wrap: wrap; - padding: 0; - margin: 0 auto; - position: relative; - letter-spacing: -0.31em; - *letter-spacing: normal; - word-spacing: -0.43em; - list-style-type: none; -} - -.grid::before, .grid::after { - box-sizing: border-box; - letter-spacing: normal; - word-spacing: normal; - white-space: normal; -} - -[class*=col-] { - box-sizing: border-box; - letter-spacing: normal; - word-spacing: normal; - white-space: normal; - position: relative; - width: 100%; - vertical-align: top; - padding: 15px; - display: inline-block; - *display: inline; - zoom: 1; -} - -[class*=col-]::before, [class*=col-]::after { - box-sizing: border-box; - letter-spacing: normal; - word-spacing: normal; - white-space: normal; -} - -[class*=col-] .grid { - flex: 1 1 auto; - margin: -15px; -} - -.col-12 { - width: 100%; - *width: 99.9%; -} - -.col-11 { - width: 91.66666667%; - *width: 91.56666667%; -} - -.col-10 { - width: 83.33333333%; - *width: 83.23333333%; -} - -.col-9 { - width: 75%; - *width: 74.9%; -} - -.col-8 { - width: 66.66666667%; - *width: 66.56666667%; -} - -.col-7 { - width: 58.33333333%; - *width: 58.23333333%; -} - -.col-6 { - width: 50%; - *width: 49.9%; -} - -.col-5 { - width: 41.66666667%; - *width: 41.56666667%; -} - -.col-4 { - width: 33.33333333%; - *width: 33.23333333%; -} - -.col-3 { - width: 25%; - *width: 24.9%; -} - -.col-2 { - width: 16.66666667%; - *width: 16.56666667%; -} - -.col-1 { - width: 8.33333333%; - *width: 8.23333333%; -} - -@media (min-width: 576px) { - .col-xs-12 { - width: 100%; - *width: 99.9%; - } - - .col-xs-11 { - width: 91.66666667%; - *width: 91.56666667%; - } - - .col-xs-10 { - width: 83.33333333%; - *width: 83.23333333%; - } - - .col-xs-9 { - width: 75%; - *width: 74.9%; - } - - .col-xs-8 { - width: 66.66666667%; - *width: 66.56666667%; - } - - .col-xs-7 { - width: 58.33333333%; - *width: 58.23333333%; - } - - .col-xs-6 { - width: 50%; - *width: 49.9%; - } - - .col-xs-5 { - width: 41.66666667%; - *width: 41.56666667%; - } - - .col-xs-4 { - width: 33.33333333%; - *width: 33.23333333%; - } - - .col-xs-3 { - width: 25%; - *width: 24.9%; - } - - .col-xs-2 { - width: 16.66666667%; - *width: 16.56666667%; - } - - .col-xs-1 { - width: 8.33333333%; - *width: 8.23333333%; - } -} -@media (min-width: 768px) { - .col-sm-12 { - width: 100%; - *width: 99.9%; - } - - .col-sm-11 { - width: 91.66666667%; - *width: 91.56666667%; - } - - .col-sm-10 { - width: 83.33333333%; - *width: 83.23333333%; - } - - .col-sm-9 { - width: 75%; - *width: 74.9%; - } - - .col-sm-8 { - width: 66.66666667%; - *width: 66.56666667%; - } - - .col-sm-7 { - width: 58.33333333%; - *width: 58.23333333%; - } - - .col-sm-6 { - width: 50%; - *width: 49.9%; - } - - .col-sm-5 { - width: 41.66666667%; - *width: 41.56666667%; - } - - .col-sm-4 { - width: 33.33333333%; - *width: 33.23333333%; - } - - .col-sm-3 { - width: 25%; - *width: 24.9%; - } - - .col-sm-2 { - width: 16.66666667%; - *width: 16.56666667%; - } - - .col-sm-1 { - width: 8.33333333%; - *width: 8.23333333%; - } -} -@media (min-width: 992px) { - .col-md-12 { - width: 100%; - *width: 99.9%; - } - - .col-md-11 { - width: 91.66666667%; - *width: 91.56666667%; - } - - .col-md-10 { - width: 83.33333333%; - *width: 83.23333333%; - } - - .col-md-9 { - width: 75%; - *width: 74.9%; - } - - .col-md-8 { - width: 66.66666667%; - *width: 66.56666667%; - } - - .col-md-7 { - width: 58.33333333%; - *width: 58.23333333%; - } - - .col-md-6 { - width: 50%; - *width: 49.9%; - } - - .col-md-5 { - width: 41.66666667%; - *width: 41.56666667%; - } - - .col-md-4 { - width: 33.33333333%; - *width: 33.23333333%; - } - - .col-md-3 { - width: 25%; - *width: 24.9%; - } - - .col-md-2 { - width: 16.66666667%; - *width: 16.56666667%; - } - - .col-md-1 { - width: 8.33333333%; - *width: 8.23333333%; - } -} -@media (min-width: 1200px) { - .col-lg-12 { - width: 100%; - *width: 99.9%; - } - - .col-lg-11 { - width: 91.66666667%; - *width: 91.56666667%; - } - - .col-lg-10 { - width: 83.33333333%; - *width: 83.23333333%; - } - - .col-lg-9 { - width: 75%; - *width: 74.9%; - } - - .col-lg-8 { - width: 66.66666667%; - *width: 66.56666667%; - } - - .col-lg-7 { - width: 58.33333333%; - *width: 58.23333333%; - } - - .col-lg-6 { - width: 50%; - *width: 49.9%; - } - - .col-lg-5 { - width: 41.66666667%; - *width: 41.56666667%; - } - - .col-lg-4 { - width: 33.33333333%; - *width: 33.23333333%; - } - - .col-lg-3 { - width: 25%; - *width: 24.9%; - } - - .col-lg-2 { - width: 16.66666667%; - *width: 16.56666667%; - } - - .col-lg-1 { - width: 8.33333333%; - *width: 8.23333333%; - } -} -@media (min-width: 1600px) { - .col-xlg-12 { - width: 100%; - *width: 99.9%; - } - - .col-xlg-11 { - width: 91.66666667%; - *width: 91.56666667%; - } - - .col-xlg-10 { - width: 83.33333333%; - *width: 83.23333333%; - } - - .col-xlg-9 { - width: 75%; - *width: 74.9%; - } - - .col-xlg-8 { - width: 66.66666667%; - *width: 66.56666667%; - } - - .col-xlg-7 { - width: 58.33333333%; - *width: 58.23333333%; - } - - .col-xlg-6 { - width: 50%; - *width: 49.9%; - } - - .col-xlg-5 { - width: 41.66666667%; - *width: 41.56666667%; - } - - .col-xlg-4 { - width: 33.33333333%; - *width: 33.23333333%; - } - - .col-xlg-3 { - width: 25%; - *width: 24.9%; - } - - .col-xlg-2 { - width: 16.66666667%; - *width: 16.56666667%; - } - - .col-xlg-1 { - width: 8.33333333%; - *width: 8.23333333%; - } -} -.col-auto { - flex: 1 0 0px; - width: auto; -} - -@media (min-width: 576px) { - .col-xs-auto { - flex: 1 0 0px; - width: auto; - } -} -@media (min-width: 768px) { - .col-sm-auto { - flex: 1 0 0px; - width: auto; - } -} -@media (min-width: 992px) { - .col-md-auto { - flex: 1 0 0px; - width: auto; - } -} -@media (min-width: 1200px) { - .col-lg-auto { - flex: 1 0 0px; - width: auto; - } -} -@media (min-width: 1600px) { - .col-xlg-auto { - flex: 1 0 0px; - width: auto; - } -} -.order-12 { - order: 12; -} - -.order-11 { - order: 11; -} - -.order-10 { - order: 10; -} - -.order-9 { - order: 9; -} - -.order-8 { - order: 8; -} - -.order-7 { - order: 7; -} - -.order-6 { - order: 6; -} - -.order-5 { - order: 5; -} - -.order-4 { - order: 4; -} - -.order-3 { - order: 3; -} - -.order-2 { - order: 2; -} - -.order-1 { - order: 1; -} - -.order-0 { - order: 0; -} - -@media (min-width: 576px) { - .order-xs-12 { - order: 12; - } - - .order-xs-11 { - order: 11; - } - - .order-xs-10 { - order: 10; - } - - .order-xs-9 { - order: 9; - } - - .order-xs-8 { - order: 8; - } - - .order-xs-7 { - order: 7; - } - - .order-xs-6 { - order: 6; - } - - .order-xs-5 { - order: 5; - } - - .order-xs-4 { - order: 4; - } - - .order-xs-3 { - order: 3; - } - - .order-xs-2 { - order: 2; - } - - .order-xs-1 { - order: 1; - } - - .order-xs-0 { - order: 0; - } -} -@media (min-width: 768px) { - .order-sm-12 { - order: 12; - } - - .order-sm-11 { - order: 11; - } - - .order-sm-10 { - order: 10; - } - - .order-sm-9 { - order: 9; - } - - .order-sm-8 { - order: 8; - } - - .order-sm-7 { - order: 7; - } - - .order-sm-6 { - order: 6; - } - - .order-sm-5 { - order: 5; - } - - .order-sm-4 { - order: 4; - } - - .order-sm-3 { - order: 3; - } - - .order-sm-2 { - order: 2; - } - - .order-sm-1 { - order: 1; - } - - .order-sm-0 { - order: 0; - } -} -@media (min-width: 992px) { - .order-md-12 { - order: 12; - } - - .order-md-11 { - order: 11; - } - - .order-md-10 { - order: 10; - } - - .order-md-9 { - order: 9; - } - - .order-md-8 { - order: 8; - } - - .order-md-7 { - order: 7; - } - - .order-md-6 { - order: 6; - } - - .order-md-5 { - order: 5; - } - - .order-md-4 { - order: 4; - } - - .order-md-3 { - order: 3; - } - - .order-md-2 { - order: 2; - } - - .order-md-1 { - order: 1; - } - - .order-md-0 { - order: 0; - } -} -@media (min-width: 1200px) { - .order-lg-12 { - order: 12; - } - - .order-lg-11 { - order: 11; - } - - .order-lg-10 { - order: 10; - } - - .order-lg-9 { - order: 9; - } - - .order-lg-8 { - order: 8; - } - - .order-lg-7 { - order: 7; - } - - .order-lg-6 { - order: 6; - } - - .order-lg-5 { - order: 5; - } - - .order-lg-4 { - order: 4; - } - - .order-lg-3 { - order: 3; - } - - .order-lg-2 { - order: 2; - } - - .order-lg-1 { - order: 1; - } - - .order-lg-0 { - order: 0; - } -} -@media (min-width: 1600px) { - .order-xlg-12 { - order: 12; - } - - .order-xlg-11 { - order: 11; - } - - .order-xlg-10 { - order: 10; - } - - .order-xlg-9 { - order: 9; - } - - .order-xlg-8 { - order: 8; - } - - .order-xlg-7 { - order: 7; - } - - .order-xlg-6 { - order: 6; - } - - .order-xlg-5 { - order: 5; - } - - .order-xlg-4 { - order: 4; - } - - .order-xlg-3 { - order: 3; - } - - .order-xlg-2 { - order: 2; - } - - .order-xlg-1 { - order: 1; - } - - .order-xlg-0 { - order: 0; - } -} -.offset-11 { - margin-left: 91.66666667%; - *margin-left: 91.56666667%; -} - -.offset-10 { - margin-left: 83.33333333%; - *margin-left: 83.23333333%; -} - -.offset-9 { - margin-left: 75%; - *margin-left: 74.9%; -} - -.offset-8 { - margin-left: 66.66666667%; - *margin-left: 66.56666667%; -} - -.offset-7 { - margin-left: 58.33333333%; - *margin-left: 58.23333333%; -} - -.offset-6 { - margin-left: 50%; - *margin-left: 49.9%; -} - -.offset-5 { - margin-left: 41.66666667%; - *margin-left: 41.56666667%; -} - -.offset-4 { - margin-left: 33.33333333%; - *margin-left: 33.23333333%; -} - -.offset-3 { - margin-left: 25%; - *margin-left: 24.9%; -} - -.offset-2 { - margin-left: 16.66666667%; - *margin-left: 16.56666667%; -} - -.offset-1 { - margin-left: 8.33333333%; - *margin-left: 8.23333333%; -} - -@media (min-width: 576px) { - .offset-xs-11 { - margin-left: 91.66666667%; - *margin-left: 91.56666667%; - } - - .offset-xs-10 { - margin-left: 83.33333333%; - *margin-left: 83.23333333%; - } - - .offset-xs-9 { - margin-left: 75%; - *margin-left: 74.9%; - } - - .offset-xs-8 { - margin-left: 66.66666667%; - *margin-left: 66.56666667%; - } - - .offset-xs-7 { - margin-left: 58.33333333%; - *margin-left: 58.23333333%; - } - - .offset-xs-6 { - margin-left: 50%; - *margin-left: 49.9%; - } - - .offset-xs-5 { - margin-left: 41.66666667%; - *margin-left: 41.56666667%; - } - - .offset-xs-4 { - margin-left: 33.33333333%; - *margin-left: 33.23333333%; - } - - .offset-xs-3 { - margin-left: 25%; - *margin-left: 24.9%; - } - - .offset-xs-2 { - margin-left: 16.66666667%; - *margin-left: 16.56666667%; - } - - .offset-xs-1 { - margin-left: 8.33333333%; - *margin-left: 8.23333333%; - } - - .offset-xs-0 { - margin-left: 0; - *margin-left: -0.1%; - } -} -@media (min-width: 768px) { - .offset-sm-11 { - margin-left: 91.66666667%; - *margin-left: 91.56666667%; - } - - .offset-sm-10 { - margin-left: 83.33333333%; - *margin-left: 83.23333333%; - } - - .offset-sm-9 { - margin-left: 75%; - *margin-left: 74.9%; - } - - .offset-sm-8 { - margin-left: 66.66666667%; - *margin-left: 66.56666667%; - } - - .offset-sm-7 { - margin-left: 58.33333333%; - *margin-left: 58.23333333%; - } - - .offset-sm-6 { - margin-left: 50%; - *margin-left: 49.9%; - } - - .offset-sm-5 { - margin-left: 41.66666667%; - *margin-left: 41.56666667%; - } - - .offset-sm-4 { - margin-left: 33.33333333%; - *margin-left: 33.23333333%; - } - - .offset-sm-3 { - margin-left: 25%; - *margin-left: 24.9%; - } - - .offset-sm-2 { - margin-left: 16.66666667%; - *margin-left: 16.56666667%; - } - - .offset-sm-1 { - margin-left: 8.33333333%; - *margin-left: 8.23333333%; - } - - .offset-sm-0 { - margin-left: 0; - *margin-left: -0.1%; - } -} -@media (min-width: 992px) { - .offset-md-11 { - margin-left: 91.66666667%; - *margin-left: 91.56666667%; - } - - .offset-md-10 { - margin-left: 83.33333333%; - *margin-left: 83.23333333%; - } - - .offset-md-9 { - margin-left: 75%; - *margin-left: 74.9%; - } - - .offset-md-8 { - margin-left: 66.66666667%; - *margin-left: 66.56666667%; - } - - .offset-md-7 { - margin-left: 58.33333333%; - *margin-left: 58.23333333%; - } - - .offset-md-6 { - margin-left: 50%; - *margin-left: 49.9%; - } - - .offset-md-5 { - margin-left: 41.66666667%; - *margin-left: 41.56666667%; - } - - .offset-md-4 { - margin-left: 33.33333333%; - *margin-left: 33.23333333%; - } - - .offset-md-3 { - margin-left: 25%; - *margin-left: 24.9%; - } - - .offset-md-2 { - margin-left: 16.66666667%; - *margin-left: 16.56666667%; - } - - .offset-md-1 { - margin-left: 8.33333333%; - *margin-left: 8.23333333%; - } - - .offset-md-0 { - margin-left: 0; - *margin-left: -0.1%; - } -} -@media (min-width: 1200px) { - .offset-lg-11 { - margin-left: 91.66666667%; - *margin-left: 91.56666667%; - } - - .offset-lg-10 { - margin-left: 83.33333333%; - *margin-left: 83.23333333%; - } - - .offset-lg-9 { - margin-left: 75%; - *margin-left: 74.9%; - } - - .offset-lg-8 { - margin-left: 66.66666667%; - *margin-left: 66.56666667%; - } - - .offset-lg-7 { - margin-left: 58.33333333%; - *margin-left: 58.23333333%; - } - - .offset-lg-6 { - margin-left: 50%; - *margin-left: 49.9%; - } - - .offset-lg-5 { - margin-left: 41.66666667%; - *margin-left: 41.56666667%; - } - - .offset-lg-4 { - margin-left: 33.33333333%; - *margin-left: 33.23333333%; - } - - .offset-lg-3 { - margin-left: 25%; - *margin-left: 24.9%; - } - - .offset-lg-2 { - margin-left: 16.66666667%; - *margin-left: 16.56666667%; - } - - .offset-lg-1 { - margin-left: 8.33333333%; - *margin-left: 8.23333333%; - } - - .offset-lg-0 { - margin-left: 0; - *margin-left: -0.1%; - } -} -@media (min-width: 1600px) { - .offset-xlg-11 { - margin-left: 91.66666667%; - *margin-left: 91.56666667%; - } - - .offset-xlg-10 { - margin-left: 83.33333333%; - *margin-left: 83.23333333%; - } - - .offset-xlg-9 { - margin-left: 75%; - *margin-left: 74.9%; - } - - .offset-xlg-8 { - margin-left: 66.66666667%; - *margin-left: 66.56666667%; - } - - .offset-xlg-7 { - margin-left: 58.33333333%; - *margin-left: 58.23333333%; - } - - .offset-xlg-6 { - margin-left: 50%; - *margin-left: 49.9%; - } - - .offset-xlg-5 { - margin-left: 41.66666667%; - *margin-left: 41.56666667%; - } - - .offset-xlg-4 { - margin-left: 33.33333333%; - *margin-left: 33.23333333%; - } - - .offset-xlg-3 { - margin-left: 25%; - *margin-left: 24.9%; - } - - .offset-xlg-2 { - margin-left: 16.66666667%; - *margin-left: 16.56666667%; - } - - .offset-xlg-1 { - margin-left: 8.33333333%; - *margin-left: 8.23333333%; - } - - .offset-xlg-0 { - margin-left: 0; - *margin-left: -0.1%; - } -} -.wrap { - flex-wrap: wrap; -} - -.no-wrap { - flex-wrap: nowrap; -} - -.no-wrap [class*=col-] { - flex-shrink: 1; -} - -.wrap-reverse { - flex-wrap: wrap-reverse; -} - -.direction-row { - flex-direction: row; -} - -.direction-row-reverse { - flex-direction: row-reverse; -} - -.direction-column { - flex-direction: column; -} - -.direction-column-reverse { - flex-direction: column-reverse; -} - -.align-start { - align-items: flex-start; -} - -.align-end { - align-items: flex-end; -} - -.align-end [class*=col-] { - vertical-align: bottom; -} - -.align-center { - align-items: center; -} - -.align-center [class*=col-] { - vertical-align: middle; -} - -.align-baseline { - align-items: baseline; -} - -.align-content-start { - align-content: flex-start; -} - -.align-content-end { - align-content: flex-end; -} - -.align-content-end [class*=col-] { - vertical-align: bottom; -} - -.align-content-center { - align-content: center; -} - -.align-content-space-between { - align-content: space-between; -} - -.align-content-space-around { - align-content: space-around; -} - -.align-self-stretch { - align-self: stretch; -} - -.align-self-start { - align-self: flex-start; -} - -.align-self-end { - align-self: flex-end; - vertical-align: bottom; -} - -.align-self-center { - align-self: center; - vertical-align: middle; -} - -.align-self-baseline { - align-self: baseline; - vertical-align: baseline; -} - -.justify-start { - justify-content: flex-start; -} - -.justify-start.grid { - text-align: left; -} - -.justify-end { - justify-content: flex-end; -} - -.justify-end.grid { - text-align: right; - -moz-text-align-last: right; - text-align-last: right; -} - -.justify-end.grid [class*=col-] { - text-align: left; - text-align: start; - -moz-text-align-last: left; - -moz-text-align-last: start; - text-align-last: left; - text-align-last: start; -} - -.justify-center { - justify-content: center; -} - -.justify-center.grid { - text-align: center; - -moz-text-align-last: center; - text-align-last: center; -} - -.justify-center.grid [class*=col-] { - text-align: left; - text-align: start; - -moz-text-align-last: left; - -moz-text-align-last: start; - text-align-last: left; - text-align-last: start; -} - -.justify-space-between { - justify-content: space-between; -} - -.justify-space-between.grid { - text-align: justify; - -moz-text-align-last: justify; - text-align-last: justify; -} - -.justify-space-between.grid [class*=col-] { - text-align: left; - text-align: start; - -moz-text-align-last: left; - -moz-text-align-last: start; - text-align-last: left; - text-align-last: start; -} - -.justify-space-around { - justify-content: space-around; -} - -.justify-space-around.grid { - text-align: justify; - -moz-text-align-last: justify; - text-align-last: justify; -} - -.justify-space-around.grid [class*=col-] { - text-align: left; - text-align: start; - -moz-text-align-last: left; - -moz-text-align-last: start; - text-align-last: left; - text-align-last: start; -} - -.grid-bleed [class*=col-] { - padding: 0; -} - -.col-grid { - display: flex; - flex-direction: column; -} - -.col-grid.direction-row { - flex-direction: row; -} - -.col-bleed { - padding: 0; -} - -.col-bleed-x { - padding: 15px 0; -} - -.col-bleed-y { - padding: 0 15px; -} - -.flex-img { - display: block; - flex: 0 0 auto; - max-width: 100%; - height: auto; - width: 100%; - *width: auto; -} - -.flex-footer { - width: 100%; - margin-top: auto; - margin-bottom: 0; -} - -.flex-footer > :last-child { - margin-bottom: 0; -} - -@media (max-width: 575px) { - .hidden-xxs { - display: none; - } -} -@media (min-width: 576px) { - .hidden-xs-up { - display: none; - } -} -@media (max-width: 767px) { - .hidden-xs-down { - display: none; - } -} -@media (min-width: 576px) and (max-width: 767px) { - .hidden-xs { - display: none; - } -} -@media (min-width: 768px) { - .hidden-sm-up { - display: none; - } -} -@media (max-width: 991px) { - .hidden-sm-down { - display: none; - } -} -@media (min-width: 768px) and (max-width: 991px) { - .hidden-sm { - display: none; - } -} -@media (min-width: 992px) { - .hidden-md-up { - display: none; - } -} -@media (max-width: 1199px) { - .hidden-md-down { - display: none; - } -} -@media (min-width: 992px) and (max-width: 1199px) { - .hidden-md { - display: none; - } -} -@media (min-width: 1200px) { - .hidden-lg-up { - display: none; - } -} -@media (max-width: 1599px) { - .hidden-lg-down { - display: none; - } -} -@media (min-width: 1200px) and (max-width: 1599px) { - .hidden-lg { - display: none; - } -} -@media (min-width: 1600px) { - .hidden-xlg { - display: none; - } -} -/** - * - * - * - * - */ -/** - * Sizing - * - * Width and Height Classes, - * Sizes with percentage will calculate with the Reflex Grid - * - * - */ -.w-0 { - width: 0; -} - -.h-0 { - height: 0; -} - -.w-1 { - width: 1px; -} - -.h-1 { - height: 1px; -} - -.w-col-1 { - width: 8.3333333333%; -} - -.h-col-1 { - height: 8.3333333333%; -} - -.w-col-2 { - width: 16.6666666667%; -} - -.h-col-2 { - height: 16.6666666667%; -} - -.w-col-3 { - width: 25%; -} - -.h-col-3 { - height: 25%; -} - -.w-col-4 { - width: 33.3333333333%; -} - -.h-col-4 { - height: 33.3333333333%; -} - -.w-col-5 { - width: 41.6666666667%; -} - -.h-col-5 { - height: 41.6666666667%; -} - -.w-col-6 { - width: 50%; -} - -.h-col-6 { - height: 50%; -} - -.w-col-7 { - width: 58.3333333333%; -} - -.h-col-7 { - height: 58.3333333333%; -} - -.w-col-8 { - width: 66.6666666667%; -} - -.h-col-8 { - height: 66.6666666667%; -} - -.w-col-9 { - width: 75%; -} - -.h-col-9 { - height: 75%; -} - -.w-col-10 { - width: 83.3333333333%; -} - -.h-col-10 { - height: 83.3333333333%; -} - -.w-col-11 { - width: 91.6666666667%; -} - -.h-col-11 { - height: 91.6666666667%; -} - -.w-col-12 { - width: 100%; -} - -.h-col-12 { - height: 100%; -} - -.w-1 { - width: 0.5rem; -} - -.w-2 { - width: 1rem; -} - -.w-3 { - width: 1.5rem; -} - -.w-4 { - width: 2rem; -} - -.w-5 { - width: 2.5rem; -} - -.w-6 { - width: 3rem; -} - -.w-7 { - width: 3.5rem; -} - -.w-8 { - width: 4rem; -} - -.w-9 { - width: 4.5rem; -} - -.w-10 { - width: 5rem; -} - -.w-11 { - width: 5.5rem; -} - -.w-12 { - width: 6rem; -} - -.w-13 { - width: 6.5rem; -} - -.w-14 { - width: 7rem; -} - -.w-15 { - width: 7.5rem; -} - -.w-16 { - width: 8rem; -} - -.w-17 { - width: 8.5rem; -} - -.w-18 { - width: 9rem; -} - -.w-19 { - width: 9.5rem; -} - -.w-20 { - width: 10rem; -} - -.w-21 { - width: 10.5rem; -} - -.w-22 { - width: 11rem; -} - -.w-23 { - width: 11.5rem; -} - -.w-24 { - width: 12rem; -} - -.w-25 { - width: 12.5rem; -} - -.w-26 { - width: 13rem; -} - -.w-27 { - width: 13.5rem; -} - -.w-28 { - width: 14rem; -} - -.w-29 { - width: 14.5rem; -} - -.w-30 { - width: 15rem; -} - -.w-31 { - width: 15.5rem; -} - -.w-32 { - width: 16rem; -} - -.w-33 { - width: 16.5rem; -} - -.w-34 { - width: 17rem; -} - -.w-35 { - width: 17.5rem; -} - -.w-36 { - width: 18rem; -} - -.w-37 { - width: 18.5rem; -} - -.w-38 { - width: 19rem; -} - -.w-39 { - width: 19.5rem; -} - -.w-40 { - width: 20rem; -} - -.w-41 { - width: 20.5rem; -} - -.w-42 { - width: 21rem; -} - -.w-43 { - width: 21.5rem; -} - -.w-44 { - width: 22rem; -} - -.w-45 { - width: 22.5rem; -} - -.w-46 { - width: 23rem; -} - -.w-47 { - width: 23.5rem; -} - -.w-48 { - width: 24rem; -} - -.w-49 { - width: 24.5rem; -} - -.w-50 { - width: 25rem; -} - -.h-1 { - height: 0.5rem; -} - -.h-2 { - height: 1rem; -} - -.h-3 { - height: 1.5rem; -} - -.h-4 { - height: 2rem; -} - -.h-5 { - height: 2.5rem; -} - -.h-6 { - height: 3rem; -} - -.h-7 { - height: 3.5rem; -} - -.h-8 { - height: 4rem; -} - -.h-9 { - height: 4.5rem; -} - -.h-10 { - height: 5rem; -} - -.h-11 { - height: 5.5rem; -} - -.h-12 { - height: 6rem; -} - -.h-13 { - height: 6.5rem; -} - -.h-14 { - height: 7rem; -} - -.h-15 { - height: 7.5rem; -} - -.h-16 { - height: 8rem; -} - -.h-17 { - height: 8.5rem; -} - -.h-18 { - height: 9rem; -} - -.h-19 { - height: 9.5rem; -} - -.h-20 { - height: 10rem; -} - -.h-21 { - height: 10.5rem; -} - -.h-22 { - height: 11rem; -} - -.h-23 { - height: 11.5rem; -} - -.h-24 { - height: 12rem; -} - -.h-25 { - height: 12.5rem; -} - -.h-26 { - height: 13rem; -} - -.h-27 { - height: 13.5rem; -} - -.h-28 { - height: 14rem; -} - -.h-29 { - height: 14.5rem; -} - -.h-30 { - height: 15rem; -} - -.h-31 { - height: 15.5rem; -} - -.h-32 { - height: 16rem; -} - -.h-33 { - height: 16.5rem; -} - -.h-34 { - height: 17rem; -} - -.h-35 { - height: 17.5rem; -} - -.h-36 { - height: 18rem; -} - -.h-37 { - height: 18.5rem; -} - -.h-38 { - height: 19rem; -} - -.h-39 { - height: 19.5rem; -} - -.h-40 { - height: 20rem; -} - -.h-41 { - height: 20.5rem; -} - -.h-42 { - height: 21rem; -} - -.h-43 { - height: 21.5rem; -} - -.h-44 { - height: 22rem; -} - -.h-45 { - height: 22.5rem; -} - -.h-46 { - height: 23rem; -} - -.h-47 { - height: 23.5rem; -} - -.h-48 { - height: 24rem; -} - -.h-49 { - height: 24.5rem; -} - -.h-50 { - height: 25rem; -} - -/** - * - * - */ -.m-top-0 { - margin-top: 0; -} - -.m-top-1 { - margin-top: 1px; -} - -.m-top-2 { - margin-top: 0.125rem; -} - -.m-top-3 { - margin-top: 0.5rem; -} - -.m-top-4 { - margin-top: 1.125rem; -} - -.m-top-5 { - margin-top: 2rem; -} - -.m-top-6 { - margin-top: 3.125rem; -} - -.m-top-7 { - margin-top: 4.5rem; -} - -.m-top-8 { - margin-top: 6.125rem; -} - -.m-top-9 { - margin-top: 8rem; -} - -.m-top-10 { - margin-top: 10.125rem; -} - -.m-bottom-0 { - margin-bottom: 0; -} - -.m-bottom-1 { - margin-bottom: 1px; -} - -.m-bottom-2 { - margin-bottom: 0.125rem; -} - -.m-bottom-3 { - margin-bottom: 0.5rem; -} - -.m-bottom-4 { - margin-bottom: 1.125rem; -} - -.m-bottom-5 { - margin-bottom: 2rem; -} - -.m-bottom-6 { - margin-bottom: 3.125rem; -} - -.m-bottom-7 { - margin-bottom: 4.5rem; -} - -.m-bottom-8 { - margin-bottom: 6.125rem; -} - -.m-bottom-9 { - margin-bottom: 8rem; -} - -.m-bottom-10 { - margin-bottom: 10.125rem; -} - -.m-left-0 { - margin-left: 0; -} - -.m-left-1 { - margin-left: 1px; -} - -.m-left-2 { - margin-left: 0.125rem; -} - -.m-left-3 { - margin-left: 0.5rem; -} - -.m-left-4 { - margin-left: 1.125rem; -} - -.m-left-5 { - margin-left: 2rem; -} - -.m-left-6 { - margin-left: 3.125rem; -} - -.m-left-7 { - margin-left: 4.5rem; -} - -.m-left-8 { - margin-left: 6.125rem; -} - -.m-left-9 { - margin-left: 8rem; -} - -.m-left-10 { - margin-left: 10.125rem; -} - -.m-right-0 { - margin-right: 0; -} - -.m-right-1 { - margin-right: 1px; -} - -.m-right-2 { - margin-right: 0.125rem; -} - -.m-right-3 { - margin-right: 0.5rem; -} - -.m-right-4 { - margin-right: 1.125rem; -} - -.m-right-5 { - margin-right: 2rem; -} - -.m-right-6 { - margin-right: 3.125rem; -} - -.m-right-7 { - margin-right: 4.5rem; -} - -.m-right-8 { - margin-right: 6.125rem; -} - -.m-right-9 { - margin-right: 8rem; -} - -.m-right-10 { - margin-right: 10.125rem; -} - -.p-top-0 { - padding-top: 0; -} - -.p-top-1 { - padding-top: 1px; -} - -.p-top-0 { - padding-top: 0.125rem; -} - -.p-top-1 { - padding-top: 0rem; -} - -.p-top-2 { - padding-top: 0.125rem; -} - -.p-top-3 { - padding-top: 0.5rem; -} - -.p-top-4 { - padding-top: 1.125rem; -} - -.p-top-5 { - padding-top: 2rem; -} - -.p-top-6 { - padding-top: 3.125rem; -} - -.p-top-7 { - padding-top: 4.5rem; -} - -.p-top-8 { - padding-top: 6.125rem; -} - -.p-top-9 { - padding-top: 8rem; -} - -.p-top-10 { - padding-top: 10.125rem; -} - -.p-bottom-0 { - padding-bottom: 0; -} - -.p-bottom-1 { - padding-bottom: 1px; -} - -.p-bottom-0 { - padding-bottom: 0.125rem; -} - -.p-bottom-1 { - padding-bottom: 0rem; -} - -.p-bottom-2 { - padding-bottom: 0.125rem; -} - -.p-bottom-3 { - padding-bottom: 0.5rem; -} - -.p-bottom-4 { - padding-bottom: 1.125rem; -} - -.p-bottom-5 { - padding-bottom: 2rem; -} - -.p-bottom-6 { - padding-bottom: 3.125rem; -} - -.p-bottom-7 { - padding-bottom: 4.5rem; -} - -.p-bottom-8 { - padding-bottom: 6.125rem; -} - -.p-bottom-9 { - padding-bottom: 8rem; -} - -.p-bottom-10 { - padding-bottom: 10.125rem; -} - -.p-left-0 { - padding-left: 0; -} - -.p-left-1 { - padding-left: 1px; -} - -.p-left-0 { - padding-left: 0.125rem; -} - -.p-left-1 { - padding-left: 0rem; -} - -.p-left-2 { - padding-left: 0.125rem; -} - -.p-left-3 { - padding-left: 0.5rem; -} - -.p-left-4 { - padding-left: 1.125rem; -} - -.p-left-5 { - padding-left: 2rem; -} - -.p-left-6 { - padding-left: 3.125rem; -} - -.p-left-7 { - padding-left: 4.5rem; -} - -.p-left-8 { - padding-left: 6.125rem; -} - -.p-left-9 { - padding-left: 8rem; -} - -.p-left-10 { - padding-left: 10.125rem; -} - -.p-right-0 { - padding-right: 0; -} - -.p-right-1 { - padding-right: 1px; -} - -.p-right-0 { - padding-right: 0.125rem; -} - -.p-right-1 { - padding-right: 0rem; -} - -.p-right-2 { - padding-right: 0.125rem; -} - -.p-right-3 { - padding-right: 0.5rem; -} - -.p-right-4 { - padding-right: 1.125rem; -} - -.p-right-5 { - padding-right: 2rem; -} - -.p-right-6 { - padding-right: 3.125rem; -} - -.p-right-7 { - padding-right: 4.5rem; -} - -.p-right-8 { - padding-right: 6.125rem; -} - -.p-right-9 { - padding-right: 8rem; -} - -.p-right-10 { - padding-right: 10.125rem; -} - -/** - * borders - * - * - */ -.border, .badge { - border: 1px solid #585858 !important; -} - -.border-round, .badge { - border-radius: 2px; -} - -.borderless { - border: 0 !important; -} - -.radiusless { - border-radius: 0 !important; -} - -/** - * z-index - * - * - */ -.z-index-1 { - z-index: 1; -} - -.z-index-2 { - z-index: 2; -} - -.z-index-3 { - z-index: 3; -} - -.z-index-4 { - z-index: 4; -} - -.z-index-5 { - z-index: 5; -} - -.z-index-6 { - z-index: 6; -} - -.z-index-7 { - z-index: 7; -} - -.z-index-8 { - z-index: 8; -} - -.z-index-9 { - z-index: 9; -} - -.z-index-10 { - z-index: 10; -} - -/** - * - * - */ -.round { - border-radius: 50%; -} - -/** - * typography - * - * - */ -.left { - text-align: left !important; -} - -.right { - text-align: right !important; -} - -.center { - text-align: center !important; -} - -.justify { - text-align: justify !important; -} - -.uppercase { - text-transform: uppercase !important; -} - -.lowercase { - text-transform: lowercase !important; -} - -.crossed { - text-decoration: line-through !important; -} - -.underline { - text-decoration: underline !important; -} - -.capitalize { - text-transform: capitalize !important; -} - -.italic { - font-style: italic !important; -} - -.light { - font-weight: lighter !important; -} - -.normal { - font-weight: normal !important; -} - -.medium { - font-weight: medium !important; -} - -.bold { - font-weight: bolder !important; -} - -.t-size-default { - font-size: 1rem !important; -} - -.t-size-small { - font-size: 0.75rem !important; -} - -.t-size-medium { - font-size: 1.5rem !important; -} - -.t-size-large { - font-size: 2rem !important; -} - -.t-size-big { - font-size: 3rem !important; -} - -/** - * colors - * - * - */ -/** - * floating - * - * - */ -.float-left { - float: left; -} - -.float-right { - float: right; -} - -.float-none { - float: none; -} - -.centered { - margin-left: auto; - margin-right: auto; -} - -.clearfix::before, .clearfix::after { - display: table; - content: " "; -} -.clearfix::after { - clear: both; -} - -/** - * position - * - * - */ -.absolute { - position: absolute !important; -} - -.fixed { - position: fixed !important; -} - -.relative { - position: relative !important; -} - -/** - * - * - */ -.vertical-align-bottom { - vertical-align: bottom; -} - -.vertical-align-top { - vertical-align: top; -} - -.vertical-align-baseline { - vertical-align: baseline; -} - -.marginless { - margin: 0 !important; -} - -/** - * - * - */ -.overflow-x-hidden { - overflow-x: hidden; -} - -.overflow-y-hidden { - overflow-y: hidden; -} - -.object-fit-cover { - -o-object-fit: cover; - object-fit: cover; -} - -.field-group { - margin-bottom: 1.2em; -} -.field-group--valid input.field-text, .field-group--valid textarea.field-text { - border-color: #64ac64; -} -.field-group--valid .icon { - fill: #64ac64; -} -.field-group--error input.field-text, .field-group--error textarea.field-text { - border-color: #ecacac; -} -.field-group--error .icon { - fill: #ecacac; -} - -.field-label { - font-size: 1rem; - font-family: "IBM Plex Mono", sans-serif; -} -.field-label .icon { - vertical-align: text-bottom; -} -.field-label:hover { - cursor: pointer; -} - -input.field-text, textarea.field-text, select.field-choice { - font-family: "IBM Plex Mono", sans-serif; - font-size: 0.95rem; - width: 100%; - border: 1px solid #bebebe; - background-color: white; - border-radius: 2px; - margin: 0.7em 0 0; -} -input.field-text:focus, input.field-text:active, textarea.field-text:focus, textarea.field-text:active, select.field-choice:focus, select.field-choice:active { - outline: 0; - border-color: #585858; -} - -input.field-text, textarea.field-text { - padding: 0.8em 1.1em; -} - -/** - * - * - */ -select.field-choice { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - padding: 0.8em; - position: relative; -} -select.field-choice::after { - position: absolute; - right: 0; - top: 0; - display: block; - content: " "; - width: 10px; - height: 10px; - background: red; -} - -/** - * radio & checkbox - * - *
- * - *
- * - */ -input[type=checkbox].field-choice, -input[type=radio].field-choice { - position: relative; - display: none; -} -input[type=checkbox].field-choice ~ .field-choice__checked, -input[type=radio].field-choice ~ .field-choice__checked { - display: none; -} -input[type=checkbox].field-choice:checked ~ .field-choice__checked, -input[type=radio].field-choice:checked ~ .field-choice__checked { - display: inline-block; -} -input[type=checkbox].field-choice:checked ~ .field-choice__unchecked, -input[type=radio].field-choice:checked ~ .field-choice__unchecked { - display: none; -} - -svg.field-choice__unchecked { - fill: #bebebe; -} - -svg.field-choice__checked { - fill: #64ac64; -} - -.field-help, .field-error { - display: inline-block; - width: 100%; - padding: 0.6em 0.5em; - font-size: 0.8rem; -} - -.field-error { - color: #ecacac; -} - -.panel { - border: 1px solid #585858; - border-radius: 2px; - background: #fff; -} -.panel__header { - display: flex; - background-color: #585858; - color: white; - padding: 0.8em 1.2em; - line-height: 1.6em; -} -.panel__header button { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - background: none; - border: none; - padding: 0; -} -.panel__header button:hover { - cursor: pointer; -} -.panel__header .icon { - vertical-align: bottom; - width: 1.5em; - height: 1.5em; - margin-right: 0.5em; - fill: white; -} -.panel__buttons { - display: flex; - justify-content: end; - width: 100%; -} -.panel__buttons button:last-child .icon { - margin-right: 0; -} -.panel__body { - padding: 0.25em 1em; -} - -.figure { - margin: 0; - display: inline-block; - line-height: 0; - border: 1px solid #585858; - border-radius: 2px; - overflow: hidden; -} -.figure__caption { - padding: 0.75em 1.1em; - font-size: 0.7rem; - background: #585858; - line-height: 1.618; - margin: 0; - color: white; -} -.figure img.media { - border: 0; -} - -img.media { - border-radius: 2px; - border: 1px solid #585858; - width: 100%; - height: auto; -} - -.table { - width: 100%; - border: 1px solid #e4e4e4; - background: white; -} -.table--striped tr:nth-child(even) { - background-color: white; -} -.table--scroll { - overflow-x: auto; -} -.table td { - color: #585858; -} -.table td, -.table th { - text-align: left; - border-bottom: 1px solid #e4e4e4; - padding: 0.5em 1.25em; -} -.table th { - color: white; - background-color: #585858; -} -.table tr:hover { - background-color: #717171; -} -.table tr:hover td { - color: white; -} - -.slider { - position: relative; - overflow-x: visible; -} -.slider__inner { - display: flex; - white-space: nowrap; -} -.slider__item { - padding: 0 0.6em; - display: inline-block; - white-space: normal; - flex-shrink: 0; -} - -.tabs { - display: flex; - flex-direction: column; - width: 100%; -} -@media only screen and (min-width: 768px) { - .tabs { - width: auto; - flex-direction: row; - } -} -.tabs__item { - min-height: 2.8em; - display: flex; - align-items: center; - padding: 0 1em; - background-color: white; - transition: background-color 0.1s; - background-color: white; - color: #585858; - border: 1px solid #585858; - border-bottom-width: 0; - width: 100%; -} -@media only screen and (min-width: 768px) { - .tabs__item { - width: auto; - display: inline-flex; - border-right-width: 0; - border-bottom-width: 1px; - } -} -.tabs__item:hover, .tabs__item--selected { - cursor: pointer; - background-color: #717171; - color: white; - border-color: #717171; -} -.tabs__item:last-child { - border-bottom-width: 1px; -} - -.modal { - position: fixed; - width: 100%; - height: 100%; - top: 0; - left: 0; - display: flex; - visibility: hidden; - transition: visibility 0s linear 0.5s; - padding: 1em; - z-index: 20; - align-items: center; - justify-content: center; -} -.modal__inner { - position: relative; - z-index: 21; - transition: transform 0.5s; - transform: scale(0); - max-width: 500px; -} -.modal__title { - font-size: 2rem; - text-align: center; - white-space: pre-line; - margin-bottom: 2rem; -} -.modal__title .icon { - font-size: 3rem; -} -.modal__title, .modal__body { - color: white; -} -.modal__body { - margin-bottom: 1.5rem; -} -.modal .button { - color: white; -} -.modal:before { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-color: transparent; - transition: background-color 0.5s; - z-index: 19; - content: ""; -} -.modal--open { - display: flex; - visibility: visible; - transition: visibility 0s linear 0s; -} -.modal--open:before { - background: rgba(0, 0, 0, 0.87); -} -.modal--open .modal__inner { - transform: scale(1); -} +@font-face{font-family:IBM Plex Mono;src:url(/fonts/IBMPlexMono.eot?85f924ecb898e5720062617e4a86f1d1);src:url(/fonts/IBMPlexMono.eot?85f924ecb898e5720062617e4a86f1d1) format("embedded-opentype"),url(/fonts/IBMPlexMono.woff2?db620201a437f00ce78da2a10cf50f3f) format("woff2"),url(/fonts/IBMPlexMono.woff?3d04ef6de65d3c77bd60c158326be298) format("woff"),url(/fonts/IBMPlexMono.ttf?ce51a85eb7160067d01bcf6e56f837d1) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:IBM Plex Mono;src:url(/fonts/IBMPlexMono-Bold.eot?eb105b142ce736849ef4828cb0c8eb34);src:url(/fonts/IBMPlexMono-Bold.eot?eb105b142ce736849ef4828cb0c8eb34) format("embedded-opentype"),url(/fonts/IBMPlexMono-Bold.woff2?8b633c62813e0275ebd7a1c793c4e99c) format("woff2"),url(/fonts/IBMPlexMono-Bold.woff?b72090c625b4144f3763d5b2bf8f5942) format("woff"),url(/fonts/IBMPlexMono-Bold.ttf?558e55bd46468bb8d7074d7064d02c30) format("truetype");font-weight:700;font-style:normal;font-display:swap}.col-11{width:91.6666666667%;*width:91.5666666667%}.col-10{width:83.3333333333%;*width:83.2333333333%}.col-8{width:66.6666666667%;*width:66.5666666667%}.col-7{width:58.3333333333%;*width:58.2333333333%}.col-5{width:41.6666666667%;*width:41.5666666667%}.col-4{width:33.3333333333%;*width:33.2333333333%}.col-2{width:16.6666666667%;*width:16.5666666667%}.col-1{width:8.3333333333%;*width:8.2333333333%}@media (min-width:576px){.col-xs-12{width:100%;*width:99.9%}.col-xs-11{width:91.6666666667%;*width:91.5666666667%}.col-xs-10{width:83.3333333333%;*width:83.2333333333%}.col-xs-9{width:75%;*width:74.9%}.col-xs-8{width:66.6666666667%;*width:66.5666666667%}.col-xs-7{width:58.3333333333%;*width:58.2333333333%}.col-xs-6{width:50%;*width:49.9%}.col-xs-5{width:41.6666666667%;*width:41.5666666667%}.col-xs-4{width:33.3333333333%;*width:33.2333333333%}.col-xs-3{width:25%;*width:24.9%}.col-xs-2{width:16.6666666667%;*width:16.5666666667%}.col-xs-1{width:8.3333333333%;*width:8.2333333333%}}@media (min-width:768px){.col-sm-12{width:100%;*width:99.9%}.col-sm-11{width:91.6666666667%;*width:91.5666666667%}.col-sm-10{width:83.3333333333%;*width:83.2333333333%}.col-sm-9{width:75%;*width:74.9%}.col-sm-8{width:66.6666666667%;*width:66.5666666667%}.col-sm-7{width:58.3333333333%;*width:58.2333333333%}.col-sm-6{width:50%;*width:49.9%}.col-sm-5{width:41.6666666667%;*width:41.5666666667%}.col-sm-4{width:33.3333333333%;*width:33.2333333333%}.col-sm-3{width:25%;*width:24.9%}.col-sm-2{width:16.6666666667%;*width:16.5666666667%}.col-sm-1{width:8.3333333333%;*width:8.2333333333%}}@media (min-width:992px){.col-md-12{width:100%;*width:99.9%}.col-md-11{width:91.6666666667%;*width:91.5666666667%}.col-md-10{width:83.3333333333%;*width:83.2333333333%}.col-md-9{width:75%;*width:74.9%}.col-md-8{width:66.6666666667%;*width:66.5666666667%}.col-md-7{width:58.3333333333%;*width:58.2333333333%}.col-md-6{width:50%;*width:49.9%}.col-md-5{width:41.6666666667%;*width:41.5666666667%}.col-md-4{width:33.3333333333%;*width:33.2333333333%}.col-md-3{width:25%;*width:24.9%}.col-md-2{width:16.6666666667%;*width:16.5666666667%}.col-md-1{width:8.3333333333%;*width:8.2333333333%}}@media (min-width:1200px){.col-lg-12{width:100%;*width:99.9%}.col-lg-11{width:91.6666666667%;*width:91.5666666667%}.col-lg-10{width:83.3333333333%;*width:83.2333333333%}.col-lg-9{width:75%;*width:74.9%}.col-lg-8{width:66.6666666667%;*width:66.5666666667%}.col-lg-7{width:58.3333333333%;*width:58.2333333333%}.col-lg-6{width:50%;*width:49.9%}.col-lg-5{width:41.6666666667%;*width:41.5666666667%}.col-lg-4{width:33.3333333333%;*width:33.2333333333%}.col-lg-3{width:25%;*width:24.9%}.col-lg-2{width:16.6666666667%;*width:16.5666666667%}.col-lg-1{width:8.3333333333%;*width:8.2333333333%}}@media (min-width:1600px){.col-xlg-12{width:100%;*width:99.9%}.col-xlg-11{width:91.6666666667%;*width:91.5666666667%}.col-xlg-10{width:83.3333333333%;*width:83.2333333333%}.col-xlg-9{width:75%;*width:74.9%}.col-xlg-8{width:66.6666666667%;*width:66.5666666667%}.col-xlg-7{width:58.3333333333%;*width:58.2333333333%}.col-xlg-6{width:50%;*width:49.9%}.col-xlg-5{width:41.6666666667%;*width:41.5666666667%}.col-xlg-4{width:33.3333333333%;*width:33.2333333333%}.col-xlg-3{width:25%;*width:24.9%}.col-xlg-2{width:16.6666666667%;*width:16.5666666667%}.col-xlg-1{width:8.3333333333%;*width:8.2333333333%}}.col-auto{-ms-flex:1 0 0px}@media (min-width:576px){.col-xs-auto{flex:1 0 0px;width:auto}}@media (min-width:768px){.col-sm-auto{flex:1 0 0px;width:auto}}@media (min-width:992px){.col-md-auto{flex:1 0 0px;width:auto}}@media (min-width:1200px){.col-lg-auto{flex:1 0 0px;width:auto}}@media (min-width:1600px){.col-xlg-auto{flex:1 0 0px;width:auto}}.offset-11{margin-left:91.6666666667%;*margin-left:91.5666666667%}.offset-10{margin-left:83.3333333333%;*margin-left:83.2333333333%}.offset-8{margin-left:66.6666666667%;*margin-left:66.5666666667%}.offset-7{margin-left:58.3333333333%;*margin-left:58.2333333333%}.offset-5{margin-left:41.6666666667%;*margin-left:41.5666666667%}.offset-4{margin-left:33.3333333333%;*margin-left:33.2333333333%}.offset-2{margin-left:16.6666666667%;*margin-left:16.5666666667%}.offset-1{margin-left:8.3333333333%;*margin-left:8.2333333333%}@media (min-width:576px){.offset-xs-11{margin-left:91.6666666667%;*margin-left:91.5666666667%}.offset-xs-10{margin-left:83.3333333333%;*margin-left:83.2333333333%}.offset-xs-9{margin-left:75%;*margin-left:74.9%}.offset-xs-8{margin-left:66.6666666667%;*margin-left:66.5666666667%}.offset-xs-7{margin-left:58.3333333333%;*margin-left:58.2333333333%}.offset-xs-6{margin-left:50%;*margin-left:49.9%}.offset-xs-5{margin-left:41.6666666667%;*margin-left:41.5666666667%}.offset-xs-4{margin-left:33.3333333333%;*margin-left:33.2333333333%}.offset-xs-3{margin-left:25%;*margin-left:24.9%}.offset-xs-2{margin-left:16.6666666667%;*margin-left:16.5666666667%}.offset-xs-1{margin-left:8.3333333333%;*margin-left:8.2333333333%}.offset-xs-0{margin-left:0;*margin-left:-.1%}}@media (min-width:768px){.offset-sm-11{margin-left:91.6666666667%;*margin-left:91.5666666667%}.offset-sm-10{margin-left:83.3333333333%;*margin-left:83.2333333333%}.offset-sm-9{margin-left:75%;*margin-left:74.9%}.offset-sm-8{margin-left:66.6666666667%;*margin-left:66.5666666667%}.offset-sm-7{margin-left:58.3333333333%;*margin-left:58.2333333333%}.offset-sm-6{margin-left:50%;*margin-left:49.9%}.offset-sm-5{margin-left:41.6666666667%;*margin-left:41.5666666667%}.offset-sm-4{margin-left:33.3333333333%;*margin-left:33.2333333333%}.offset-sm-3{margin-left:25%;*margin-left:24.9%}.offset-sm-2{margin-left:16.6666666667%;*margin-left:16.5666666667%}.offset-sm-1{margin-left:8.3333333333%;*margin-left:8.2333333333%}.offset-sm-0{margin-left:0;*margin-left:-.1%}}@media (min-width:992px){.offset-md-11{margin-left:91.6666666667%;*margin-left:91.5666666667%}.offset-md-10{margin-left:83.3333333333%;*margin-left:83.2333333333%}.offset-md-9{margin-left:75%;*margin-left:74.9%}.offset-md-8{margin-left:66.6666666667%;*margin-left:66.5666666667%}.offset-md-7{margin-left:58.3333333333%;*margin-left:58.2333333333%}.offset-md-6{margin-left:50%;*margin-left:49.9%}.offset-md-5{margin-left:41.6666666667%;*margin-left:41.5666666667%}.offset-md-4{margin-left:33.3333333333%;*margin-left:33.2333333333%}.offset-md-3{margin-left:25%;*margin-left:24.9%}.offset-md-2{margin-left:16.6666666667%;*margin-left:16.5666666667%}.offset-md-1{margin-left:8.3333333333%;*margin-left:8.2333333333%}.offset-md-0{margin-left:0;*margin-left:-.1%}}@media (min-width:1200px){.offset-lg-11{margin-left:91.6666666667%;*margin-left:91.5666666667%}.offset-lg-10{margin-left:83.3333333333%;*margin-left:83.2333333333%}.offset-lg-9{margin-left:75%;*margin-left:74.9%}.offset-lg-8{margin-left:66.6666666667%;*margin-left:66.5666666667%}.offset-lg-7{margin-left:58.3333333333%;*margin-left:58.2333333333%}.offset-lg-6{margin-left:50%;*margin-left:49.9%}.offset-lg-5{margin-left:41.6666666667%;*margin-left:41.5666666667%}.offset-lg-4{margin-left:33.3333333333%;*margin-left:33.2333333333%}.offset-lg-3{margin-left:25%;*margin-left:24.9%}.offset-lg-2{margin-left:16.6666666667%;*margin-left:16.5666666667%}.offset-lg-1{margin-left:8.3333333333%;*margin-left:8.2333333333%}.offset-lg-0{margin-left:0;*margin-left:-.1%}}@media (min-width:1600px){.offset-xlg-11{margin-left:91.6666666667%;*margin-left:91.5666666667%}.offset-xlg-10{margin-left:83.3333333333%;*margin-left:83.2333333333%}.offset-xlg-9{margin-left:75%;*margin-left:74.9%}.offset-xlg-8{margin-left:66.6666666667%;*margin-left:66.5666666667%}.offset-xlg-7{margin-left:58.3333333333%;*margin-left:58.2333333333%}.offset-xlg-6{margin-left:50%;*margin-left:49.9%}.offset-xlg-5{margin-left:41.6666666667%;*margin-left:41.5666666667%}.offset-xlg-4{margin-left:33.3333333333%;*margin-left:33.2333333333%}.offset-xlg-3{margin-left:25%;*margin-left:24.9%}.offset-xlg-2{margin-left:16.6666666667%;*margin-left:16.5666666667%}.offset-xlg-1{margin-left:8.3333333333%;*margin-left:8.2333333333%}.offset-xlg-0{margin-left:0;*margin-left:-.1%}}@media (min-width:0px) and (max-width:575px){.hidden-xxs{display:none}}:root{--primary:#585858;--primary-light:#585858;--primary-active:#717171;--primary-dark:#252525;--link:#585858;--link-hover:#ecacac;--danger:#d95959;--danger-light:#ecacac;--success:#64ac64;--white:#fff;--black:#000;--text:#363636;--background:#f9f9f9;--border:#dfdfdf}html{font-size:100%;line-height:1.15;-webkit-text-size-adjust:100%}body,html{margin:0;height:100%}html,legend{box-sizing:border-box}body{font-family:IBM Plex Mono,sans-serif;color:var(--text);background-color:var(--background);direction:ltr;font-size:1rem;line-height:1.618}a{color:var(--link);transition:color .5s}a:hover{color:var(--link-hover)}a:focus{outline:none}main{display:block}*,:after,:before{box-sizing:inherit}table{border-collapse:collapse;border-spacing:0}figure{margin:0 0 1rem}button,figcaption,input,optgroup,select,textarea{margin:0}fieldset{margin:0 0 1rem}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}legend{box-sizing:border-box;display:table;max-width:100%;padding:0;white-space:normal}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}hr{box-sizing:content-box;height:0;overflow:visible;border:0;border-top:1px solid var(--border);margin:0 0 1rem}progress{vertical-align:baseline}details{display:block}summary{display:list-item}code,kbd,pre,samp{font-family:IBM Plex Mono,sans-serif;font-size:1rem}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{font-family:IBM Plex Mono,sans-serif;font-weight:700;line-height:1.2;margin:0 0 1rem}@media only screen and (min-width:992px){.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{margin:0 0 1.5rem}}h5{line-height:1.4}h6{line-height:1.618}.h1,h1{font-size:2.5rem}@media only screen and (min-width:992px){.h1,h1{font-size:3rem}}.h2,h2{font-size:2rem}@media only screen and (min-width:992px){.h2,h2{font-size:2.4rem}}.h3,h3{font-size:1.75rem}@media only screen and (min-width:992px){.h3,h3{font-size:2.1rem}}.h4,h4{font-size:1.5rem}@media only screen and (min-width:992px){.h4,h4{font-size:1.8rem}}.h5,h5{font-size:1.25rem}@media only screen and (min-width:992px){.h5,h5{font-size:1.5rem}}.h6,h6{font-size:1rem}@media only screen and (min-width:992px){.h6,h6{font-size:1.2rem}}.badge{display:inline-block;background-color:var(--primary);color:var(--white);font-size:.85rem;padding:.4em .8em}.badge--round{display:inline-flex;justify-content:center;border-radius:50%;width:2.5em}.content p{margin:0 0 1rem}.content a,.content ins,.content u{-webkit-text-decoration-skip:ink edges;text-decoration-skip:ink edges}.content b,.content strong{font-weight:bolder}.content small{font-size:80%}.content sub,.content sup{font-size:70%;line-height:0;position:relative;vertical-align:baseline}.content sub{bottom:-.25em}.content sup{top:-.5em}.content abbr[title]{border-bottom:1px dotted;cursor:help;text-decoration:none}.content mark{padding:.25em}.content blockquote{border-left:1px solid #585858;margin-left:0;padding:5px 12px}.content blockquote p:last-child{margin-bottom:0}.content dl,.content ol,.content ul{padding:0;margin:0 0 1rem}.content ol,.content ul{margin-left:1.5em}.content ol ol,.content ul ul{margin-top:0;margin-left:1em}.content ol{list-style:decimal outside}.content ul{list-style:disc outside}.content dl{margin-left:.5em}.content dd,.content dt{margin:0}.content dt{font-weight:700}.button{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;display:inline-flex;align-items:center;text-decoration:none;font-family:IBM Plex Mono,sans-serif;font-size:1rem;border:1px solid var(--primary);background-color:var(--white);color:var(--primary);border-radius:2px;transition:background-color .1s;margin-bottom:.5em;padding:0 1.3em;min-height:2.8em;width:100%}@media only screen and (min-width:768px){.button{width:auto}}.button--small{font-size:.8rem}.button--clearfix{margin:0;padding:0;border:none;background:transparent}.button--clearfix:active,.button--clearfix:focus{outline:none}.button--selected,.button:hover{cursor:pointer;text-decoration:none;color:#fff;background-color:var(--primary-active)}.button:active,.button:focus{outline:1px solid var(--primary-active)}.button:disabled{opacity:.5}.button:disabled:hover{cursor:not-allowed;border:1px solid var(--primary);background-color:#fff;color:var(--primary)}.button--danger{border-color:var(--danger)}.button--danger:hover{background-color:var(--danger)}.button--danger:active,.button--danger:focus{outline:2px solid var(--primary-active)}.button--outline,.button--outline:hover{background-color:transparent}.button--outline:hover{color:var(--primary);border-color:var(--primary-light)}.button--danger.button--outline:hover{border-color:var(--danger-light)}.field-group{margin:0 0 1rem}.field-group--valid input.field-text,.field-group--valid textarea.field-text{border-color:var(--success)}.field-group--valid .icon{fill:var(--success)}.field-group--error input.field-text,.field-group--error textarea.field-text{border-color:var(--danger)}.field-group--error .icon{fill:var(--danger)}.field-label{font-size:1rem;font-family:IBM Plex Mono,sans-serif}.field-label .icon{vertical-align:text-bottom}.field-label:hover{cursor:pointer}input.field-text,select.field-choice,textarea.field-text{font-family:IBM Plex Mono,sans-serif;font-size:.95rem;width:100%;border:1px solid var(--primary-active);background-color:var(--white);border-radius:2px;margin:.7rem 0 0}input.field-text:active,input.field-text:focus,select.field-choice:active,select.field-choice:focus,textarea.field-text:active,textarea.field-text:focus{outline:0;border-color:var(--primary)}input.field-text,textarea.field-text{padding:.8em 1.1em}select.field-choice{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:.8em;position:relative}select.field-choice:after{position:absolute;right:0;top:0;display:block;content:" ";width:10px;height:10px;background:red}input[type=checkbox].field-choice,input[type=radio].field-choice{position:relative;display:none}input[type=checkbox].field-choice~.field-choice__checked,input[type=radio].field-choice~.field-choice__checked{display:none}input[type=checkbox].field-choice:checked~.field-choice__checked,input[type=radio].field-choice:checked~.field-choice__checked{display:inline-block}input[type=checkbox].field-choice:checked~.field-choice__unchecked,input[type=radio].field-choice:checked~.field-choice__unchecked{display:none}svg.field-choice__unchecked{fill:var(--primary-active)}svg.field-choice__checked{fill:var(--success)}.field-error,.field-help{display:inline-block;width:100%;padding:.6em .5em;font-size:.8rem}.field-error{color:var(--danger)}.icon{width:1em;height:1em;max-height:100%;max-width:100%;vertical-align:middle;overflow:hidden;font-size:1.4rem;fill:var(--text)}.hero{position:relative}.hero img{width:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:50% 50%;object-position:50% 50%}.bar{display:flex;min-height:2.8em;background-color:#585858;color:var(--white)}.bar .icon{font-size:1.5rem}.bar__start{justify-content:start}.bar__main{flex-grow:1}.bar__end{justify-content:end}.bar__end,.bar__main,.bar__start{display:flex;align-self:center;margin-left:.75em}.bar__end:last-child,.bar__main:last-child,.bar__start:last-child{margin-right:.75em}.bar .button:active,.bar .button:focus{outline:none}.loading{height:60px;width:47px;margin:0 auto;display:flex;align-items:center}.loading span{display:block;width:15px;height:80px;background-color:var(--primary);-webkit-animation-name:plain-ui__loading-animation;animation-name:plain-ui__loading-animation;-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-delay:.15s;animation-delay:.15s;border-top:1px solid var(--primary-dark);border-bottom:1px solid var(--primary-dark)}.loading span:first-child{margin-right:1px;-webkit-animation-delay:0s;animation-delay:0s}.loading span:last-child{margin-left:1px;-webkit-animation-delay:.3s;animation-delay:.3s}@-webkit-keyframes plain-ui__loading-animation{0%{height:60px}50%{height:40px}to{height:60px}}@keyframes plain-ui__loading-animation{0%{height:60px}50%{height:40px}to{height:60px}}.masonry{display:flex;width:100%;flex-flow:row wrap}.masonry__item{width:100%;height:200px;padding-left:1px;padding-bottom:1px}@media only screen and (min-width:768px){.masonry__item{height:300px}.masonry__item:nth-child(4n+1){width:25%}.masonry__item:nth-child(4n+2){width:55%}.masonry__item:nth-child(4n+3){width:20%}.masonry__item:nth-child(4n+4){width:67%}.masonry__item:nth-child(4n+5){width:33%}}:root{--reflex-columns:12;--reflex-grid-spacing:15px;--reflex-xs:576px;--reflex-sm:768px;--reflex-md:992px;--reflex-lg:1200px;--reflex-xlg:1600px;--reflex-xxs-max:575px;--reflex-xs-max:767px;--reflex-sm-max:991px;--reflex-md-max:1199px;--reflex-lg-max:1599px}.container,.container-full{box-sizing:border-box;width:100%;margin-right:auto;margin-left:auto;padding-right:30px;padding-left:30px}.container-full .grid,.container .grid{margin-right:-15px;margin-left:-15px}@media (min-width:576px){.container{max-width:576px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:992px){.container{max-width:992px}}@media (min-width:1200px){.container{max-width:1200px}}@media (min-width:1600px){.container{max-width:1600px}}.grid{box-sizing:border-box;display:block;display:flex;flex-wrap:wrap;padding:0;margin:0 auto;position:relative;letter-spacing:-.31em;*letter-spacing:normal;word-spacing:-.43em;list-style-type:none}.grid:after,.grid:before,[class*=col-]{box-sizing:border-box;letter-spacing:normal;word-spacing:normal;white-space:normal}[class*=col-]{position:relative;width:100%;vertical-align:top;padding:15px;display:inline-block;*display:inline;zoom:1}[class*=col-]:after,[class*=col-]:before{box-sizing:border-box;letter-spacing:normal;word-spacing:normal;white-space:normal}[class*=col-] .grid{flex:1 1 auto;margin:-15px}.col-12{width:100%;*width:99.9%}.col-11{width:91.66666667%;*width:91.56666667%}.col-10{width:83.33333333%;*width:83.23333333%}.col-9{width:75%;*width:74.9%}.col-8{width:66.66666667%;*width:66.56666667%}.col-7{width:58.33333333%;*width:58.23333333%}.col-6{width:50%;*width:49.9%}.col-5{width:41.66666667%;*width:41.56666667%}.col-4{width:33.33333333%;*width:33.23333333%}.col-3{width:25%;*width:24.9%}.col-2{width:16.66666667%;*width:16.56666667%}.col-1{width:8.33333333%;*width:8.23333333%}@media (min-width:576px){.col-xs-12{width:100%;*width:99.9%}.col-xs-11{width:91.66666667%;*width:91.56666667%}.col-xs-10{width:83.33333333%;*width:83.23333333%}.col-xs-9{width:75%;*width:74.9%}.col-xs-8{width:66.66666667%;*width:66.56666667%}.col-xs-7{width:58.33333333%;*width:58.23333333%}.col-xs-6{width:50%;*width:49.9%}.col-xs-5{width:41.66666667%;*width:41.56666667%}.col-xs-4{width:33.33333333%;*width:33.23333333%}.col-xs-3{width:25%;*width:24.9%}.col-xs-2{width:16.66666667%;*width:16.56666667%}.col-xs-1{width:8.33333333%;*width:8.23333333%}}@media (min-width:768px){.col-sm-12{width:100%;*width:99.9%}.col-sm-11{width:91.66666667%;*width:91.56666667%}.col-sm-10{width:83.33333333%;*width:83.23333333%}.col-sm-9{width:75%;*width:74.9%}.col-sm-8{width:66.66666667%;*width:66.56666667%}.col-sm-7{width:58.33333333%;*width:58.23333333%}.col-sm-6{width:50%;*width:49.9%}.col-sm-5{width:41.66666667%;*width:41.56666667%}.col-sm-4{width:33.33333333%;*width:33.23333333%}.col-sm-3{width:25%;*width:24.9%}.col-sm-2{width:16.66666667%;*width:16.56666667%}.col-sm-1{width:8.33333333%;*width:8.23333333%}}@media (min-width:992px){.col-md-12{width:100%;*width:99.9%}.col-md-11{width:91.66666667%;*width:91.56666667%}.col-md-10{width:83.33333333%;*width:83.23333333%}.col-md-9{width:75%;*width:74.9%}.col-md-8{width:66.66666667%;*width:66.56666667%}.col-md-7{width:58.33333333%;*width:58.23333333%}.col-md-6{width:50%;*width:49.9%}.col-md-5{width:41.66666667%;*width:41.56666667%}.col-md-4{width:33.33333333%;*width:33.23333333%}.col-md-3{width:25%;*width:24.9%}.col-md-2{width:16.66666667%;*width:16.56666667%}.col-md-1{width:8.33333333%;*width:8.23333333%}}@media (min-width:1200px){.col-lg-12{width:100%;*width:99.9%}.col-lg-11{width:91.66666667%;*width:91.56666667%}.col-lg-10{width:83.33333333%;*width:83.23333333%}.col-lg-9{width:75%;*width:74.9%}.col-lg-8{width:66.66666667%;*width:66.56666667%}.col-lg-7{width:58.33333333%;*width:58.23333333%}.col-lg-6{width:50%;*width:49.9%}.col-lg-5{width:41.66666667%;*width:41.56666667%}.col-lg-4{width:33.33333333%;*width:33.23333333%}.col-lg-3{width:25%;*width:24.9%}.col-lg-2{width:16.66666667%;*width:16.56666667%}.col-lg-1{width:8.33333333%;*width:8.23333333%}}@media (min-width:1600px){.col-xlg-12{width:100%;*width:99.9%}.col-xlg-11{width:91.66666667%;*width:91.56666667%}.col-xlg-10{width:83.33333333%;*width:83.23333333%}.col-xlg-9{width:75%;*width:74.9%}.col-xlg-8{width:66.66666667%;*width:66.56666667%}.col-xlg-7{width:58.33333333%;*width:58.23333333%}.col-xlg-6{width:50%;*width:49.9%}.col-xlg-5{width:41.66666667%;*width:41.56666667%}.col-xlg-4{width:33.33333333%;*width:33.23333333%}.col-xlg-3{width:25%;*width:24.9%}.col-xlg-2{width:16.66666667%;*width:16.56666667%}.col-xlg-1{width:8.33333333%;*width:8.23333333%}}.col-auto{flex:1 0 0px;width:auto}@media (min-width:576px){.col-xs-auto{flex:1 0 0px;width:auto}}@media (min-width:768px){.col-sm-auto{flex:1 0 0px;width:auto}}@media (min-width:992px){.col-md-auto{flex:1 0 0px;width:auto}}@media (min-width:1200px){.col-lg-auto{flex:1 0 0px;width:auto}}@media (min-width:1600px){.col-xlg-auto{flex:1 0 0px;width:auto}}.order-12{order:12}.order-11{order:11}.order-10{order:10}.order-9{order:9}.order-8{order:8}.order-7{order:7}.order-6{order:6}.order-5{order:5}.order-4{order:4}.order-3{order:3}.order-2{order:2}.order-1{order:1}.order-0{order:0}@media (min-width:576px){.order-xs-12{order:12}.order-xs-11{order:11}.order-xs-10{order:10}.order-xs-9{order:9}.order-xs-8{order:8}.order-xs-7{order:7}.order-xs-6{order:6}.order-xs-5{order:5}.order-xs-4{order:4}.order-xs-3{order:3}.order-xs-2{order:2}.order-xs-1{order:1}.order-xs-0{order:0}}@media (min-width:768px){.order-sm-12{order:12}.order-sm-11{order:11}.order-sm-10{order:10}.order-sm-9{order:9}.order-sm-8{order:8}.order-sm-7{order:7}.order-sm-6{order:6}.order-sm-5{order:5}.order-sm-4{order:4}.order-sm-3{order:3}.order-sm-2{order:2}.order-sm-1{order:1}.order-sm-0{order:0}}@media (min-width:992px){.order-md-12{order:12}.order-md-11{order:11}.order-md-10{order:10}.order-md-9{order:9}.order-md-8{order:8}.order-md-7{order:7}.order-md-6{order:6}.order-md-5{order:5}.order-md-4{order:4}.order-md-3{order:3}.order-md-2{order:2}.order-md-1{order:1}.order-md-0{order:0}}@media (min-width:1200px){.order-lg-12{order:12}.order-lg-11{order:11}.order-lg-10{order:10}.order-lg-9{order:9}.order-lg-8{order:8}.order-lg-7{order:7}.order-lg-6{order:6}.order-lg-5{order:5}.order-lg-4{order:4}.order-lg-3{order:3}.order-lg-2{order:2}.order-lg-1{order:1}.order-lg-0{order:0}}@media (min-width:1600px){.order-xlg-12{order:12}.order-xlg-11{order:11}.order-xlg-10{order:10}.order-xlg-9{order:9}.order-xlg-8{order:8}.order-xlg-7{order:7}.order-xlg-6{order:6}.order-xlg-5{order:5}.order-xlg-4{order:4}.order-xlg-3{order:3}.order-xlg-2{order:2}.order-xlg-1{order:1}.order-xlg-0{order:0}}.offset-11{margin-left:91.66666667%;*margin-left:91.56666667%}.offset-10{margin-left:83.33333333%;*margin-left:83.23333333%}.offset-9{margin-left:75%;*margin-left:74.9%}.offset-8{margin-left:66.66666667%;*margin-left:66.56666667%}.offset-7{margin-left:58.33333333%;*margin-left:58.23333333%}.offset-6{margin-left:50%;*margin-left:49.9%}.offset-5{margin-left:41.66666667%;*margin-left:41.56666667%}.offset-4{margin-left:33.33333333%;*margin-left:33.23333333%}.offset-3{margin-left:25%;*margin-left:24.9%}.offset-2{margin-left:16.66666667%;*margin-left:16.56666667%}.offset-1{margin-left:8.33333333%;*margin-left:8.23333333%}@media (min-width:576px){.offset-xs-11{margin-left:91.66666667%;*margin-left:91.56666667%}.offset-xs-10{margin-left:83.33333333%;*margin-left:83.23333333%}.offset-xs-9{margin-left:75%;*margin-left:74.9%}.offset-xs-8{margin-left:66.66666667%;*margin-left:66.56666667%}.offset-xs-7{margin-left:58.33333333%;*margin-left:58.23333333%}.offset-xs-6{margin-left:50%;*margin-left:49.9%}.offset-xs-5{margin-left:41.66666667%;*margin-left:41.56666667%}.offset-xs-4{margin-left:33.33333333%;*margin-left:33.23333333%}.offset-xs-3{margin-left:25%;*margin-left:24.9%}.offset-xs-2{margin-left:16.66666667%;*margin-left:16.56666667%}.offset-xs-1{margin-left:8.33333333%;*margin-left:8.23333333%}.offset-xs-0{margin-left:0;*margin-left:-.1%}}@media (min-width:768px){.offset-sm-11{margin-left:91.66666667%;*margin-left:91.56666667%}.offset-sm-10{margin-left:83.33333333%;*margin-left:83.23333333%}.offset-sm-9{margin-left:75%;*margin-left:74.9%}.offset-sm-8{margin-left:66.66666667%;*margin-left:66.56666667%}.offset-sm-7{margin-left:58.33333333%;*margin-left:58.23333333%}.offset-sm-6{margin-left:50%;*margin-left:49.9%}.offset-sm-5{margin-left:41.66666667%;*margin-left:41.56666667%}.offset-sm-4{margin-left:33.33333333%;*margin-left:33.23333333%}.offset-sm-3{margin-left:25%;*margin-left:24.9%}.offset-sm-2{margin-left:16.66666667%;*margin-left:16.56666667%}.offset-sm-1{margin-left:8.33333333%;*margin-left:8.23333333%}.offset-sm-0{margin-left:0;*margin-left:-.1%}}@media (min-width:992px){.offset-md-11{margin-left:91.66666667%;*margin-left:91.56666667%}.offset-md-10{margin-left:83.33333333%;*margin-left:83.23333333%}.offset-md-9{margin-left:75%;*margin-left:74.9%}.offset-md-8{margin-left:66.66666667%;*margin-left:66.56666667%}.offset-md-7{margin-left:58.33333333%;*margin-left:58.23333333%}.offset-md-6{margin-left:50%;*margin-left:49.9%}.offset-md-5{margin-left:41.66666667%;*margin-left:41.56666667%}.offset-md-4{margin-left:33.33333333%;*margin-left:33.23333333%}.offset-md-3{margin-left:25%;*margin-left:24.9%}.offset-md-2{margin-left:16.66666667%;*margin-left:16.56666667%}.offset-md-1{margin-left:8.33333333%;*margin-left:8.23333333%}.offset-md-0{margin-left:0;*margin-left:-.1%}}@media (min-width:1200px){.offset-lg-11{margin-left:91.66666667%;*margin-left:91.56666667%}.offset-lg-10{margin-left:83.33333333%;*margin-left:83.23333333%}.offset-lg-9{margin-left:75%;*margin-left:74.9%}.offset-lg-8{margin-left:66.66666667%;*margin-left:66.56666667%}.offset-lg-7{margin-left:58.33333333%;*margin-left:58.23333333%}.offset-lg-6{margin-left:50%;*margin-left:49.9%}.offset-lg-5{margin-left:41.66666667%;*margin-left:41.56666667%}.offset-lg-4{margin-left:33.33333333%;*margin-left:33.23333333%}.offset-lg-3{margin-left:25%;*margin-left:24.9%}.offset-lg-2{margin-left:16.66666667%;*margin-left:16.56666667%}.offset-lg-1{margin-left:8.33333333%;*margin-left:8.23333333%}.offset-lg-0{margin-left:0;*margin-left:-.1%}}@media (min-width:1600px){.offset-xlg-11{margin-left:91.66666667%;*margin-left:91.56666667%}.offset-xlg-10{margin-left:83.33333333%;*margin-left:83.23333333%}.offset-xlg-9{margin-left:75%;*margin-left:74.9%}.offset-xlg-8{margin-left:66.66666667%;*margin-left:66.56666667%}.offset-xlg-7{margin-left:58.33333333%;*margin-left:58.23333333%}.offset-xlg-6{margin-left:50%;*margin-left:49.9%}.offset-xlg-5{margin-left:41.66666667%;*margin-left:41.56666667%}.offset-xlg-4{margin-left:33.33333333%;*margin-left:33.23333333%}.offset-xlg-3{margin-left:25%;*margin-left:24.9%}.offset-xlg-2{margin-left:16.66666667%;*margin-left:16.56666667%}.offset-xlg-1{margin-left:8.33333333%;*margin-left:8.23333333%}.offset-xlg-0{margin-left:0;*margin-left:-.1%}}.wrap{flex-wrap:wrap}.no-wrap{flex-wrap:nowrap}.no-wrap [class*=col-]{flex-shrink:1}.wrap-reverse{flex-wrap:wrap-reverse}.direction-row{flex-direction:row}.direction-row-reverse{flex-direction:row-reverse}.direction-column{flex-direction:column}.direction-column-reverse{flex-direction:column-reverse}.align-start{align-items:flex-start}.align-end{align-items:flex-end}.align-end [class*=col-]{vertical-align:bottom}.align-center{align-items:center}.align-center [class*=col-]{vertical-align:middle}.align-baseline{align-items:baseline}.align-content-start{align-content:flex-start}.align-content-end{align-content:flex-end}.align-content-end [class*=col-]{vertical-align:bottom}.align-content-center{align-content:center}.align-content-space-between{align-content:space-between}.align-content-space-around{align-content:space-around}.align-self-stretch{align-self:stretch}.align-self-start{align-self:flex-start}.align-self-end{align-self:flex-end;vertical-align:bottom}.align-self-center{align-self:center;vertical-align:middle}.align-self-baseline{align-self:baseline;vertical-align:baseline}.justify-start{justify-content:flex-start}.justify-start.grid{text-align:left}.justify-end{justify-content:flex-end}.justify-end.grid{text-align:right;-moz-text-align-last:right;text-align-last:right}.justify-end.grid [class*=col-]{text-align:left;text-align:start;-moz-text-align-last:left;-moz-text-align-last:start;text-align-last:left;text-align-last:start}.justify-center{justify-content:center}.justify-center.grid{text-align:center;-moz-text-align-last:center;text-align-last:center}.justify-center.grid [class*=col-]{text-align:left;text-align:start;-moz-text-align-last:left;-moz-text-align-last:start;text-align-last:left;text-align-last:start}.justify-space-between{justify-content:space-between}.justify-space-between.grid{text-align:justify;-moz-text-align-last:justify;text-align-last:justify}.justify-space-between.grid [class*=col-]{text-align:left;text-align:start;-moz-text-align-last:left;-moz-text-align-last:start;text-align-last:left;text-align-last:start}.justify-space-around{justify-content:space-around}.justify-space-around.grid{text-align:justify;-moz-text-align-last:justify;text-align-last:justify}.justify-space-around.grid [class*=col-]{text-align:left;text-align:start;-moz-text-align-last:left;-moz-text-align-last:start;text-align-last:left;text-align-last:start}.grid-bleed [class*=col-]{padding:0}.col-grid{display:flex;flex-direction:column}.col-grid.direction-row{flex-direction:row}.col-bleed{padding:0}.col-bleed-x{padding:15px 0}.col-bleed-y{padding:0 15px}.flex-img{display:block;flex:0 0 auto;max-width:100%;height:auto;width:100%;*width:auto}.flex-footer{width:100%;margin-top:auto}.flex-footer,.flex-footer>:last-child{margin-bottom:0}@media (max-width:575px){.hidden-xxs{display:none}}@media (min-width:576px){.hidden-xs-up{display:none}}@media (max-width:767px){.hidden-xs-down{display:none}}@media (min-width:576px) and (max-width:767px){.hidden-xs{display:none}}@media (min-width:768px){.hidden-sm-up{display:none}}@media (max-width:991px){.hidden-sm-down{display:none}}@media (min-width:768px) and (max-width:991px){.hidden-sm{display:none}}@media (min-width:992px){.hidden-md-up{display:none}}@media (max-width:1199px){.hidden-md-down{display:none}}@media (min-width:992px) and (max-width:1199px){.hidden-md{display:none}}@media (min-width:1200px){.hidden-lg-up{display:none}}@media (max-width:1599px){.hidden-lg-down{display:none}}@media (min-width:1200px) and (max-width:1599px){.hidden-lg{display:none}}@media (min-width:1600px){.hidden-xlg{display:none}}.w-0{width:0}.h-0{height:0}.w-1{width:1px}.h-1{height:1px}.w-col-1{width:8.3333333333%}.h-col-1{height:8.3333333333%}.w-col-2{width:16.6666666667%}.h-col-2{height:16.6666666667%}.w-col-3{width:25%}.h-col-3{height:25%}.w-col-4{width:33.3333333333%}.h-col-4{height:33.3333333333%}.w-col-5{width:41.6666666667%}.h-col-5{height:41.6666666667%}.w-col-6{width:50%}.h-col-6{height:50%}.w-col-7{width:58.3333333333%}.h-col-7{height:58.3333333333%}.w-col-8{width:66.6666666667%}.h-col-8{height:66.6666666667%}.w-col-9{width:75%}.h-col-9{height:75%}.w-col-10{width:83.3333333333%}.h-col-10{height:83.3333333333%}.w-col-11{width:91.6666666667%}.h-col-11{height:91.6666666667%}.w-col-12{width:100%}.h-col-12{height:100%}.w-1{width:.5rem}.w-2{width:1rem}.w-3{width:1.5rem}.w-4{width:2rem}.w-5{width:2.5rem}.w-6{width:3rem}.w-7{width:3.5rem}.w-8{width:4rem}.w-9{width:4.5rem}.w-10{width:5rem}.w-11{width:5.5rem}.w-12{width:6rem}.w-13{width:6.5rem}.w-14{width:7rem}.w-15{width:7.5rem}.w-16{width:8rem}.w-17{width:8.5rem}.w-18{width:9rem}.w-19{width:9.5rem}.w-20{width:10rem}.w-21{width:10.5rem}.w-22{width:11rem}.w-23{width:11.5rem}.w-24{width:12rem}.w-25{width:12.5rem}.w-26{width:13rem}.w-27{width:13.5rem}.w-28{width:14rem}.w-29{width:14.5rem}.w-30{width:15rem}.w-31{width:15.5rem}.w-32{width:16rem}.w-33{width:16.5rem}.w-34{width:17rem}.w-35{width:17.5rem}.w-36{width:18rem}.w-37{width:18.5rem}.w-38{width:19rem}.w-39{width:19.5rem}.w-40{width:20rem}.w-41{width:20.5rem}.w-42{width:21rem}.w-43{width:21.5rem}.w-44{width:22rem}.w-45{width:22.5rem}.w-46{width:23rem}.w-47{width:23.5rem}.w-48{width:24rem}.w-49{width:24.5rem}.w-50{width:25rem}.h-1{height:.5rem}.h-2{height:1rem}.h-3{height:1.5rem}.h-4{height:2rem}.h-5{height:2.5rem}.h-6{height:3rem}.h-7{height:3.5rem}.h-8{height:4rem}.h-9{height:4.5rem}.h-10{height:5rem}.h-11{height:5.5rem}.h-12{height:6rem}.h-13{height:6.5rem}.h-14{height:7rem}.h-15{height:7.5rem}.h-16{height:8rem}.h-17{height:8.5rem}.h-18{height:9rem}.h-19{height:9.5rem}.h-20{height:10rem}.h-21{height:10.5rem}.h-22{height:11rem}.h-23{height:11.5rem}.h-24{height:12rem}.h-25{height:12.5rem}.h-26{height:13rem}.h-27{height:13.5rem}.h-28{height:14rem}.h-29{height:14.5rem}.h-30{height:15rem}.h-31{height:15.5rem}.h-32{height:16rem}.h-33{height:16.5rem}.h-34{height:17rem}.h-35{height:17.5rem}.h-36{height:18rem}.h-37{height:18.5rem}.h-38{height:19rem}.h-39{height:19.5rem}.h-40{height:20rem}.h-41{height:20.5rem}.h-42{height:21rem}.h-43{height:21.5rem}.h-44{height:22rem}.h-45{height:22.5rem}.h-46{height:23rem}.h-47{height:23.5rem}.h-48{height:24rem}.h-49{height:24.5rem}.h-50{height:25rem}.m-top-0{margin-top:0}.m-top-1{margin-top:1px}.m-top-2{margin-top:.125rem}.m-top-3{margin-top:.5rem}.m-top-4{margin-top:1.125rem}.m-top-5{margin-top:2rem}.m-top-6{margin-top:3.125rem}.m-top-7{margin-top:4.5rem}.m-top-8{margin-top:6.125rem}.m-top-9{margin-top:8rem}.m-top-10{margin-top:10.125rem}.m-bottom-0{margin-bottom:0}.m-bottom-1{margin-bottom:1px}.m-bottom-2{margin-bottom:.125rem}.m-bottom-3{margin-bottom:.5rem}.m-bottom-4{margin-bottom:1.125rem}.m-bottom-5{margin-bottom:2rem}.m-bottom-6{margin-bottom:3.125rem}.m-bottom-7{margin-bottom:4.5rem}.m-bottom-8{margin-bottom:6.125rem}.m-bottom-9{margin-bottom:8rem}.m-bottom-10{margin-bottom:10.125rem}.m-left-0{margin-left:0}.m-left-1{margin-left:1px}.m-left-2{margin-left:.125rem}.m-left-3{margin-left:.5rem}.m-left-4{margin-left:1.125rem}.m-left-5{margin-left:2rem}.m-left-6{margin-left:3.125rem}.m-left-7{margin-left:4.5rem}.m-left-8{margin-left:6.125rem}.m-left-9{margin-left:8rem}.m-left-10{margin-left:10.125rem}.m-right-0{margin-right:0}.m-right-1{margin-right:1px}.m-right-2{margin-right:.125rem}.m-right-3{margin-right:.5rem}.m-right-4{margin-right:1.125rem}.m-right-5{margin-right:2rem}.m-right-6{margin-right:3.125rem}.m-right-7{margin-right:4.5rem}.m-right-8{margin-right:6.125rem}.m-right-9{margin-right:8rem}.m-right-10{margin-right:10.125rem}.p-top-0{padding-top:0}.p-top-1{padding-top:1px}.p-top-0{padding-top:.125rem}.p-top-1{padding-top:0}.p-top-2{padding-top:.125rem}.p-top-3{padding-top:.5rem}.p-top-4{padding-top:1.125rem}.p-top-5{padding-top:2rem}.p-top-6{padding-top:3.125rem}.p-top-7{padding-top:4.5rem}.p-top-8{padding-top:6.125rem}.p-top-9{padding-top:8rem}.p-top-10{padding-top:10.125rem}.p-bottom-0{padding-bottom:0}.p-bottom-1{padding-bottom:1px}.p-bottom-0{padding-bottom:.125rem}.p-bottom-1{padding-bottom:0}.p-bottom-2{padding-bottom:.125rem}.p-bottom-3{padding-bottom:.5rem}.p-bottom-4{padding-bottom:1.125rem}.p-bottom-5{padding-bottom:2rem}.p-bottom-6{padding-bottom:3.125rem}.p-bottom-7{padding-bottom:4.5rem}.p-bottom-8{padding-bottom:6.125rem}.p-bottom-9{padding-bottom:8rem}.p-bottom-10{padding-bottom:10.125rem}.p-left-0{padding-left:0}.p-left-1{padding-left:1px}.p-left-0{padding-left:.125rem}.p-left-1{padding-left:0}.p-left-2{padding-left:.125rem}.p-left-3{padding-left:.5rem}.p-left-4{padding-left:1.125rem}.p-left-5{padding-left:2rem}.p-left-6{padding-left:3.125rem}.p-left-7{padding-left:4.5rem}.p-left-8{padding-left:6.125rem}.p-left-9{padding-left:8rem}.p-left-10{padding-left:10.125rem}.p-right-0{padding-right:0}.p-right-1{padding-right:1px}.p-right-0{padding-right:.125rem}.p-right-1{padding-right:0}.p-right-2{padding-right:.125rem}.p-right-3{padding-right:.5rem}.p-right-4{padding-right:1.125rem}.p-right-5{padding-right:2rem}.p-right-6{padding-right:3.125rem}.p-right-7{padding-right:4.5rem}.p-right-8{padding-right:6.125rem}.p-right-9{padding-right:8rem}.p-right-10{padding-right:10.125rem}.badge,.border{border:1px solid #585858!important}.badge,.border-round{border-radius:2px}.borderless{border:0!important}.radiusless{border-radius:0!important}.z-index-1{z-index:1}.z-index-2{z-index:2}.z-index-3{z-index:3}.z-index-4{z-index:4}.z-index-5{z-index:5}.z-index-6{z-index:6}.z-index-7{z-index:7}.z-index-8{z-index:8}.z-index-9{z-index:9}.z-index-10{z-index:10}.round{border-radius:50%}.left{text-align:left!important}.right{text-align:right!important}.center{text-align:center!important}.justify{text-align:justify!important}.uppercase{text-transform:uppercase!important}.lowercase{text-transform:lowercase!important}.crossed{text-decoration:line-through!important}.underline{text-decoration:underline!important}.capitalize{text-transform:capitalize!important}.italic{font-style:italic!important}.light{font-weight:lighter!important}.normal{font-weight:400!important}.medium{font-weight:medium!important}.bold{font-weight:bolder!important}.t-size-default{font-size:1rem!important}.t-size-small{font-size:.75rem!important}.t-size-medium{font-size:1.5rem!important}.t-size-large{font-size:2rem!important}.t-size-big{font-size:3rem!important}.float-left{float:left}.float-right{float:right}.float-none{float:none}.centered{margin-left:auto;margin-right:auto}.clearfix:after,.clearfix:before{display:table;content:" "}.clearfix:after{clear:both}.absolute{position:absolute!important}.fixed{position:fixed!important}.relative{position:relative!important}.vertical-align-bottom{vertical-align:bottom}.vertical-align-top{vertical-align:top}.vertical-align-baseline{vertical-align:baseline}.marginless{margin:0!important}.overflow-x-hidden{overflow-x:hidden}.overflow-y-hidden{overflow-y:hidden}.object-fit-cover{-o-object-fit:cover;object-fit:cover}.panel{border:1px solid #585858;border-radius:2px;background:#fff}.panel__header{display:flex;background-color:#585858;color:#fff;padding:.8em 1.2em;line-height:1.6em}.panel__header button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;padding:0}.panel__header button:hover{cursor:pointer}.panel__header .icon{vertical-align:bottom;width:1.5em;height:1.5em;margin-right:.5em;fill:#fff}.panel__buttons{display:flex;justify-content:end;width:100%}.panel__buttons button:last-child .icon{margin-right:0}.panel__body{padding:.25em 1em}.figure{margin:0;display:inline-block;line-height:0;border:1px solid #585858;border-radius:2px;overflow:hidden}.figure__caption{padding:.75em 1.1em;font-size:.7rem;background:#585858;line-height:1.618;margin:0;color:#fff}.figure img.media{border:0}img.media{border-radius:2px;border:1px solid #585858;width:100%;height:auto}.table{width:100%;border:1px solid #e4e4e4;background:#fff}.table--striped tr:nth-child(2n){background-color:#fff}.table--scroll{overflow-x:auto}.table td{color:#585858}.table td,.table th{text-align:left;border-bottom:1px solid #e4e4e4;padding:.5em 1.25em}.table th{color:#fff;background-color:#585858}.table tr:hover{background-color:#717171}.table tr:hover td{color:#fff}.slider{position:relative;overflow-x:visible}.slider__inner{display:flex;white-space:nowrap}.slider__item{padding:0 .6em;display:inline-block;white-space:normal;flex-shrink:0}.tabs{display:flex;flex-direction:column;width:100%}@media only screen and (min-width:768px){.tabs{width:auto;flex-direction:row}}.tabs__item{min-height:2.8em;display:flex;align-items:center;padding:0 1em;transition:background-color .1s;background-color:#fff;color:#585858;border:solid #585858;border-width:1px 1px 0;width:100%}@media only screen and (min-width:768px){.tabs__item{width:auto;display:inline-flex;border-right-width:0;border-bottom-width:1px}}.tabs__item--selected,.tabs__item:hover{cursor:pointer;background-color:#717171;color:#fff;border-color:#717171}.tabs__item:last-child{border-bottom-width:1px}.modal{position:fixed;width:100%;height:100%;top:0;left:0;display:flex;visibility:hidden;transition:visibility 0s linear .5s;padding:1em;z-index:20;align-items:center;justify-content:center}.modal__inner{position:relative;z-index:21;transition:transform .5s;transform:scale(0);max-width:500px}.modal__title{font-size:2rem;text-align:center;white-space:pre-line;margin-bottom:2rem}.modal__title .icon{font-size:3rem}.modal__body,.modal__title{color:#fff}.modal__body{margin-bottom:1.5rem}.modal .button{color:#fff}.modal:before{position:fixed;top:0;left:0;width:100%;height:100%;background-color:transparent;transition:background-color .5s;z-index:19;content:""}.modal--open{display:flex;visibility:visible;transition:visibility 0s linear 0s}.modal--open:before{background:rgba(0,0,0,.87)}.modal--open .modal__inner{transform:scale(1)} diff --git a/spritemap.js b/spritemap.js index b8173b5..11edce9 100644 --- a/spritemap.js +++ b/spritemap.js @@ -1,13 +1 @@ -(self["webpackChunkplain_ui"] = self["webpackChunkplain_ui"] || []).push([["spritemap"],{ - -/***/ "?4e0c": -/*!******************************!*\ - !*** spritemap-dummy-module ***! - \******************************/ -/***/ (() => { - - - -/***/ }) - -}]); \ No newline at end of file +(self.webpackChunkplain_ui=self.webpackChunkplain_ui||[]).push([[355],{256:()=>{}}]); \ No newline at end of file diff --git a/src/scss/_core.scss b/src/scss/_core.scss index 89a01c5..bf99b79 100644 --- a/src/scss/_core.scss +++ b/src/scss/_core.scss @@ -10,5 +10,4 @@ @import 'core/normalize', - 'core/heading', - 'core/content'; \ No newline at end of file + 'core/heading'; \ No newline at end of file diff --git a/src/scss/components/_bar.scss b/src/scss/components/_bar.scss index 4561858..001c2fc 100644 --- a/src/scss/components/_bar.scss +++ b/src/scss/components/_bar.scss @@ -1,5 +1,12 @@ /** - * + *
+ *
+ *
+ *
+ *
+ *
+ *
+ *
* * * diff --git a/src/scss/components/_content.scss b/src/scss/components/_content.scss index b05647f..72d559f 100644 --- a/src/scss/components/_content.scss +++ b/src/scss/components/_content.scss @@ -1,22 +1,125 @@ /** + * Heading * * + * @author Björn Hase, Tentakelfabrik + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://github.com/tentakelfabrik/crispy-css * */ -@mixin component__content() -{ - .content { - font-size: 1rem; +.content { - a { - text-decoration: underline; - } + // paragraphs + p { + margin: $plain-ui__margin; + //@include crispy__media-breakpoints('margin', $plain-ui__margin-breakpoints); + } + + // Semantic text elements + a, + ins, + u { + text-decoration-skip: ink edges; + } + + // Add the correct font weight in Chrome, Edge, and Safari. + b, + strong { + font-weight: bolder; + } + + // Add the correct font size in all browsers. + small { + font-size: 80%; + } + + /** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ + sub, + sup { + font-size: 70%; + line-height: 0; + position: relative; + vertical-align: baseline; + } + + sub { + bottom: -0.25em; + } + + sup { + top: -0.5em; + } + + abbr[title] { + border-bottom: 1px dotted; + cursor: help; + text-decoration: none; + } + + mark { + padding: 0.25em; + } - ul { - li { + /** + * blockquote + * + * + */ + blockquote { + border-left: $plain-ui__border; + margin-left: 0; + padding: $plain-ui__padding; - } + p:last-child { + margin-bottom: 0; } } + + /** + * lists + * + */ + dl, + ol, + ul { + padding: 0; + margin: $plain-ui__margin; + //@include crispy__media-breakpoints('margin', $plain-ui__margin-breakpoints); + } + + ol, + ul { + margin-left: 1.5em; + } + + ol ol, + ul ul { + margin-top: 0; + margin-left: 1em; + } + + ol { + list-style: decimal outside; + } + + ul { + list-style: disc outside; + } + + dl { + margin-left: 0.5em; + } + + dd, + dt { + margin: 0; + } + + dt { + font-weight: bold; + } } \ No newline at end of file diff --git a/src/scss/components/_field.scss b/src/scss/components/_field.scss index cd4fe9c..ece75c4 100644 --- a/src/scss/components/_field.scss +++ b/src/scss/components/_field.scss @@ -5,145 +5,145 @@ * */ -@mixin plain-ui__component__field() -{ - // group, container for fields - .field-group { - margin-bottom: 1.2em; - - &--valid { - input.field-text, textarea.field-text { - border-color: $plain-ui__success-light; - } - - .icon { - fill: $plain-ui__success-light; - } - } +.field-group { + margin: $plain-ui__margin; - &--error { - input.field-text, textarea.field-text { - border-color: $plain-ui__danger-light; - } + &--valid { + input.field-text, textarea.field-text { + border-color: var(--success); + } - .icon { - fill: $plain-ui__danger-light; - } + .icon { + fill: var(--success); } } - .field-label { - font-size: 1rem; - font-family: $plain-ui__font-family; - - .icon { - vertical-align: text-bottom; + &--error { + input.field-text, textarea.field-text { + border-color: var(--danger); } - &:hover { - cursor: pointer; + .icon { + fill: var(--danger); } } +} - input.field-text, textarea.field-text, select.field-choice { - font-family: $plain-ui__font-family; - font-size: 0.95rem; +.field-label { + font-size: 1rem; + font-family: $plain-ui__font-family; - width: 100%; + .icon { + vertical-align: text-bottom; + } - border: 1px solid lighten($plain-ui__primary-light, 40%); - background-color: white; - border-radius: 2px; + &:hover { + cursor: pointer; + } +} - margin: 0.7em 0 0; +input.field-text, textarea.field-text, select.field-choice { + font-family: $plain-ui__font-family; + font-size: 0.95rem; - &:focus, &:active { - outline: 0; - border-color: $plain-ui__primary-light; - } - } + width: 100%; - input.field-text, textarea.field-text { - padding: 0.8em 1.1em; - } + border: 1px solid var(--primary-active); + background-color: var(--white); + border-radius: $plain-ui__border-radius; - /** - * - * - */ - - select.field-choice { - appearance: none; - padding: 0.8em; - position: relative; - - &::after { - position: absolute; - right: 0; - top: 0; - display: block; - content: " "; - width: 10px; - height: 10px; - background: red; - } + margin: 0.7rem 0 0; + + &:focus, &:active { + outline: 0; + border-color: var(--primary); } +} - /** - * radio & checkbox - * - *
- * - *
- * - */ - - input[type=checkbox].field-choice, - input[type=radio].field-choice { - position: relative; - display: none; +input.field-text, textarea.field-text { + padding: 0.8em 1.1em; +} - ~ .field-choice__checked { - display: none; - } - &:checked ~ .field-choice__checked { - display: inline-block; - } +/** + * field-choice + * + * + */ - &:checked ~ .field-choice__unchecked { - display: none; - } +select.field-choice { + appearance: none; + padding: 0.8em; + position: relative; + + &::after { + position: absolute; + right: 0; + top: 0; + display: block; + content: " "; + width: 10px; + height: 10px; + background: red; } +} - svg.field-choice__unchecked { - fill: lighten($plain-ui__primary-light, 40%); - } +/** + * radio & checkbox + * + *
+ * + *
+ * + */ + +input[type=checkbox].field-choice, +input[type=radio].field-choice { + position: relative; + display: none; - svg.field-choice__checked { - fill: $plain-ui__success-light; + ~ .field-choice__checked { + display: none; } - // - .field-help, .field-error { + &:checked ~ .field-choice__checked { display: inline-block; - width: 100%; - - padding: 0.6em 0.5em; - font-size: 0.8rem; } - // display error for fields - .field-error { - color: $plain-ui__danger-light; + &:checked ~ .field-choice__unchecked { + display: none; } } + +svg.field-choice__unchecked { + fill: var(--primary-active); +} + +svg.field-choice__checked { + fill: var(--success); +} + +.field-help, .field-error { + display: inline-block; + width: 100%; + + padding: 0.6em 0.5em; + font-size: 0.8rem; +} + +/** + * display error for fields + * + */ +.field-error { + color: var(--danger); +} diff --git a/src/scss/core/_content.scss b/src/scss/core/_content.scss deleted file mode 100644 index 72d559f..0000000 --- a/src/scss/core/_content.scss +++ /dev/null @@ -1,125 +0,0 @@ -/** - * Heading - * - * - * @author Björn Hase, Tentakelfabrik - * @license http://opensource.org/licenses/MIT The MIT License - * @link https://github.com/tentakelfabrik/crispy-css - * - */ - -.content { - - // paragraphs - p { - margin: $plain-ui__margin; - //@include crispy__media-breakpoints('margin', $plain-ui__margin-breakpoints); - } - - // Semantic text elements - a, - ins, - u { - text-decoration-skip: ink edges; - } - - // Add the correct font weight in Chrome, Edge, and Safari. - b, - strong { - font-weight: bolder; - } - - // Add the correct font size in all browsers. - small { - font-size: 80%; - } - - /** - * Prevent `sub` and `sup` elements from affecting the line height in - * all browsers. - */ - sub, - sup { - font-size: 70%; - line-height: 0; - position: relative; - vertical-align: baseline; - } - - sub { - bottom: -0.25em; - } - - sup { - top: -0.5em; - } - - abbr[title] { - border-bottom: 1px dotted; - cursor: help; - text-decoration: none; - } - - mark { - padding: 0.25em; - } - - /** - * blockquote - * - * - */ - blockquote { - border-left: $plain-ui__border; - margin-left: 0; - padding: $plain-ui__padding; - - p:last-child { - margin-bottom: 0; - } - } - - /** - * lists - * - */ - dl, - ol, - ul { - padding: 0; - margin: $plain-ui__margin; - //@include crispy__media-breakpoints('margin', $plain-ui__margin-breakpoints); - } - - ol, - ul { - margin-left: 1.5em; - } - - ol ol, - ul ul { - margin-top: 0; - margin-left: 1em; - } - - ol { - list-style: decimal outside; - } - - ul { - list-style: disc outside; - } - - dl { - margin-left: 0.5em; - } - - dd, - dt { - margin: 0; - } - - dt { - font-weight: bold; - } -} \ No newline at end of file diff --git a/src/scss/plain-ui.scss b/src/scss/plain-ui.scss index b43941f..e68be62 100644 --- a/src/scss/plain-ui.scss +++ b/src/scss/plain-ui.scss @@ -9,6 +9,7 @@ 'core', 'components/badge', + 'components/content', 'components/button', 'components/field', 'components/icon', @@ -31,7 +32,6 @@ @include plain-ui__helpers__core(); -@include plain-ui__component__field(); @include plain-ui__component__panel(); @include plain-ui__component__media(); @include plain-ui__component__table();