diff --git a/LICENSE b/LICENSE index 2071b23..f936bdb 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT License -Copyright (c) +Copyright (c) 2023 Björn Hase, me@herr-hase.wtf Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: diff --git a/README.md b/README.md index dadd081..5bb9a88 100644 --- a/README.md +++ b/README.md @@ -1,2 +1,70 @@ -# slider +# Tiny Components - Slider +Created with [Riot.js](https://riot.js.org) + +Handle UI of Slider by using [Plain-UI](https://plain-ui.com) + +Source: [https://gitea.node001.net/tiny-components/raw](https://gitea.node001.net/tiny-components/raw) +Mirror: [https://github.com/node001-net/tiny-components-raw](https://github.com/node001-net/tiny-components-raw) + +## Installation + +Setup this registry in your project .npmrc file: + +``` +@tiny-components:registry=https://gitea.node001.net/api/packages/tiny-components/npm/ +``` + +Install with npm or yarn + +``` +npm i --save @tiny-components/slider +yarn add @tiny-components/slider +``` + +# Using + +``` + + + +``` + +# Customize + +Extends your Component with mixin.js. + +``` + +
+ // your markup +
+ + + +
+``` diff --git a/example/IBMPlexMono-Bold.eot b/example/IBMPlexMono-Bold.eot new file mode 100644 index 0000000..964922d Binary files /dev/null and b/example/IBMPlexMono-Bold.eot differ diff --git a/example/IBMPlexMono-Bold.ttf b/example/IBMPlexMono-Bold.ttf new file mode 100644 index 0000000..b509e00 Binary files /dev/null and b/example/IBMPlexMono-Bold.ttf differ diff --git a/example/IBMPlexMono-Bold.woff b/example/IBMPlexMono-Bold.woff new file mode 100644 index 0000000..d310614 Binary files /dev/null and b/example/IBMPlexMono-Bold.woff differ diff --git a/example/IBMPlexMono-Bold.woff2 b/example/IBMPlexMono-Bold.woff2 new file mode 100644 index 0000000..c093628 Binary files /dev/null and b/example/IBMPlexMono-Bold.woff2 differ diff --git a/example/IBMPlexMono.eot b/example/IBMPlexMono.eot new file mode 100644 index 0000000..edcc7fe Binary files /dev/null and b/example/IBMPlexMono.eot differ diff --git a/example/IBMPlexMono.ttf b/example/IBMPlexMono.ttf new file mode 100644 index 0000000..47a085c Binary files /dev/null and b/example/IBMPlexMono.ttf differ diff --git a/example/IBMPlexMono.woff b/example/IBMPlexMono.woff new file mode 100644 index 0000000..6127906 Binary files /dev/null and b/example/IBMPlexMono.woff differ diff --git a/example/IBMPlexMono.woff2 b/example/IBMPlexMono.woff2 new file mode 100644 index 0000000..6c6feb4 Binary files /dev/null and b/example/IBMPlexMono.woff2 differ diff --git a/example/example.css b/example/example.css new file mode 100644 index 0000000..7758d73 --- /dev/null +++ b/example/example.css @@ -0,0 +1,14829 @@ +@charset "UTF-8"; +@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; +} +/** + * functions + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +/** + * strip unit from value + * + * @param {mixed} $value + * @return {number} + * + */ +/** + * + * + * https://css-tricks.com/snippets/sass/str-replace-function/ + * + */ +/** + * get value of key "default" in map + * + * @param {map} $value + * @return {boolean|unit} + * + */ +/** + * factor + * + * + * + * @param {integer} $x + * @return {float} + * + */ +/** + * mixins + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +/** + * Clear Floats + * + * + * + */ +/** + * clear styles from list + * + * + */ +/** + * media-queries as mixins + * based on breakpoints from variables + * + * + * + */ +/** + * Set property and his value for each Breakpoint + * + * ( + * $md: 10px + * ) + * + * + * @param {css} $property + * @param {map} $breakpoints + * @param {Boolean} $important [false] + * + */ +/** + * Set property and his value with an factor for each Breakpoint + * + * ( + * $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 + * + * ( + * $md: 1rem + * ) + * + * @param {map} $breakpoints + * @param {unit} $font-size + * @param {unit} $default + * @param {Boolean} $important [false] + * + */ +/** + * adding overlay with z-index and color + * + * @param {z-index} + * @param {color} + * + */ +/** + * variables + * + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +/** + * grid + * + */ +:root { + --grid-columns: 12; + --grid-grid-spacing: 15px; + --grid-xs: 576px; + --grid-sm: 768px; + --grid-md: 992px; + --grid-lg: 1200px; + --grid-xlg: 1600px; + --grid-xxs-max: 575px; + --grid-xs-max: 767px; + --grid-sm-max: 991px; + --grid-md-max: 1199px; + --grid-lg-max: 1599px; +} + +/** + * fonts + * + */ +/** + * colors + * + * + */ +/** + * margin + * + */ +/** + * padding + * + */ +/** + * border + * + */ +/** + * normalize + * + * Thanks to https://necolas.github.io/normalize.css/, use a lot from them + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +:root { + --body: #f9f9f9; + --text: #363636; + --text-contrast: #ffffff; + --primary: #3e3e3e; + --primary-contrast: #3e3e3e; + --active: #717171; + --active-contrast: #ffffff; + --link: #363636; + --link-hover: #d95959; + --danger: #d95959; + --danger-contrast: #ecacac; + --info: #0090d4; + --info-constrast: #3bc0ff; + --success: #64ac64; + --success-contrast: #a6d0a6; + --warning: #f0ad4e; + --warning-contrast: #f8d9ac; + --background: #3e3e3e; + --background-contrast: #ffffff; + --background-alpha: rgba(0, 0, 0, 0.7); + --border: #3e3e3e; + --border-contrast: #ffffff; + --font-family: IBM Plex Mono, sans-serif; +} + +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: var(--font-family); + color: var(--text); + background-color: var(--body); + direction: ltr; + font-size: 0.9rem; + line-height: 1.618; +} +@media only screen and (min-width: 992px) { + body { + font-size: 1rem; + } +} + +a { + color: var(--link); + transition: color 0.5s; + text-decoration: none; +} +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; +} + +figcaption { + margin: 0; +} + +p { + 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: var(--font-family); + font-size: 0.9rem; +} + +/** + * Content + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.content { + /** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ + /** + * blockquote + * + * + */ + /** + * lists + * + */ +} +.content p { + margin: 0 0 1rem; +} +@media only screen and (min-width: 992px) { + .content p { + margin: 0 0 1.2rem; + } +} +.content a, +.content ins, +.content u { + -webkit-text-decoration-skip: ink edges; + text-decoration-skip: ink edges; +} +.content a { + text-decoration: underline; +} +.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.25rem; + background-color: var(--warning); +} +.content blockquote { + border-left: 1px solid var(--border); + margin-left: 0; + padding: 0.6rem 0.8rem; +} +.content blockquote p:last-child { + margin-bottom: 0; +} +.content dl, +.content ol, +.content ul { + padding: 0; + margin: 0 0 1rem; +} +@media only screen and (min-width: 992px) { + .content dl, + .content ol, + .content ul { + margin: 0 0 1.2rem; + } +} +.content ul { + margin-left: 1.5rem; +} +.content ol { + margin-left: 2.5rem; +} +.content ol ol, +.content ul ul { + margin-top: 0; + margin-left: 1.5rem; +} +.content ol { + list-style: decimal outside; +} +.content ul { + list-style: square outside; +} +.content dl { + margin-left: 0.5rem; +} +.content dd, +.content dt { + margin: 0; +} +.content dt { + font-weight: bold; +} +.content code { + white-space: pre; + display: block; + color: var(--text-contrast); + overflow-y: hidden; + overflow-x: auto; + border: 1px solid var(--border); + border-radius: 2px; + background-color: var(--background); + margin: 0 0 1rem; + padding: 0.6rem 0.8rem; +} +@media only screen and (min-width: 992px) { + .content code { + margin: 0 0 1.2rem; + } +} +@media only screen and (min-width: 992px) { + .content code { + padding: 0.7rem 1rem 0.9rem; + } +} + +.highlight { + padding: 0.15rem 0.4rem 0.25rem; + background: var(--primary); + color: var(--text-contrast); + border-radius: 2px; +} + +/** + * Heading + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +/** + * add font-size for heading as class and element + * + * + */ +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; +} +h1.highlight, .h1.highlight, +h2.highlight, .h2.highlight, +h3.highlight, .h3.highlight, +h4.highlight, .h4.highlight, +h5.highlight, .h5.highlight, +h6.highlight, .h6.highlight { + display: table; +} + +h1, .h1 { + font-size: 2.5rem; +} + +h2, .h2 { + font-size: 2rem; +} + +h3, .h3 { + font-size: 1.75rem; +} + +h4, .h4 { + font-size: 1.5rem; +} + +h5, .h5 { + font-size: 1.25rem; +} + +h6, .h6 { + font-size: 1rem; +} + +@media only screen and (min-width: 992px) { + h1, .h1 { + font-size: 2.75rem; + } + h2, .h2 { + font-size: 2.5rem; + } + h3, .h3 { + font-size: 2rem; + } + h4, .h4 { + font-size: 1.75rem; + } + h5, .h5 { + font-size: 1.5rem; + } + h6, .h6 { + font-size: 1.2rem; + } +} +/** + * + * A + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.badge { + display: inline-block; + background-color: var(--background); + color: var(--text-contrast); + font-size: 0.85rem; + padding: 0.4rem 0.8rem; + border: 1px solid var(--border); + border-radius: 2px; +} +.badge--round { + display: inline-flex; + justify-content: center; + border-radius: 50%; + width: 2.8em; +} + +/** + * Button + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +/** + * + * + */ +/** + * + * + */ +/** + * + * + */ +.button { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + position: relative; + display: inline-flex; + align-items: center; + text-decoration: none; + font-family: var(--font-family); + font-size: 1rem; + border: 1px solid var(--border); + background-color: var(--background-contrast); + color: var(--text); + border-radius: 2px; + transition: background-color 0.1s; + margin: 0 0 1rem; + padding: 0.5rem 1.3rem; + width: 100%; +} +@media only screen and (min-width: 768px) { + .button { + width: auto; + } +} +.button--small { + padding: 0.3rem 1.1rem; + font-size: 0.8rem; +} +.button:hover, .button--selected { + cursor: pointer; + text-decoration: none; + color: white; + background-color: var(--active); +} +.button:focus, .button:active { + outline: 1px solid var(--active); +} +.button:disabled { + opacity: 0.5; +} +.button:disabled:hover { + cursor: not-allowed; + border: 1px solid var(--border); + background-color: var(--background-contrast); + color: var(--border); +} +.button--transparent { + margin: 0; + padding: 0; + border: none; + background: transparent; + border-radius: 0; +} +.button--transparent:focus, .button--transparent:active { + outline: none; +} +.button--danger { + border-color: var(--danger); +} +.button--danger:hover { + background-color: var(--danger); +} +.button--danger:focus, .button--danger:active { + outline: 2px solid var(--danger); +} +.button--info { + border-color: var(--info); +} +.button--info:hover { + background-color: var(--info); +} +.button--info:focus, .button--info:active { + outline: 2px solid var(--info); +} +.button--warning { + border-color: var(--warning); +} +.button--warning:hover { + background-color: var(--warning); +} +.button--warning:focus, .button--warning:active { + outline: 2px solid var(--warning); +} +.button--success { + border-color: var(--success); +} +.button--success:hover { + background-color: var(--success); +} +.button--success:focus, .button--success:active { + outline: 2px solid var(--success); +} +.button--outline { + background-color: transparent; +} +.button--outline:hover { + color: var(--border); + border-color: #a4a4a4; + background-color: transparent; +} +.button--danger.button--outline:hover { + border-color: #ecacac; +} +.button--info.button--outline:hover { + border-color: #3bc0ff; +} +.button--warning.button--outline:hover { + border-color: #f8d9ac; +} +.button--success.button--outline:hover { + border-color: #a6d0a6; +} +.button--full { + background-color: var(--active); + color: white; +} +.button--full:hover { + background-color: var(--background-contrast); + color: var(--text); +} +.button--danger.button--full { + background-color: var(--danger); +} +.button--danger.button--full:hover { + background-color: var(--background-contrast); + border-color: var(--danger); +} +.button--danger.button--full:focus, .button--danger.button--full:active { + outline: 2px solid var(--danger); +} +.button--info.button--full { + background-color: var(--info); +} +.button--info.button--full:hover { + background-color: var(--background-contrast); + border-color: var(--info); +} +.button--info.button--full:focus, .button--info.button--full:active { + outline: 2px solid var(--info); +} +.button--warning.button--full { + background-color: var(--warning); +} +.button--warning.button--full:hover { + background-color: var(--background-contrast); + border-color: var(--warning); +} +.button--warning.button--full:focus, .button--warning.button--full:active { + outline: 2px solid var(--warning); +} +.button--success.button--full { + background-color: var(--success); +} +.button--success.button--full:hover { + background-color: var(--background-contrast); + border-color: var(--success); +} +.button--success.button--full:focus, .button--success.button--full:active { + outline: 2px solid var(--success); +} + +/** + * + * fields + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.field-group { + margin: 0 0 1rem; +} +.field-group--valid .field-text { + border-color: var(--success); +} +.field-group--valid .icon { + fill: var(--success); +} +.field-group--error .field-text { + border-color: var(--danger); +} +.field-group--error .icon { + fill: var(--danger); +} + +.field-label { + font-size: 1rem; + font-family: var(--font-family); +} +.field-label .icon { + vertical-align: text-bottom; +} +.field-label:hover { + cursor: pointer; +} + +.field-text, .field-choice { + font-family: var(--font-family); + font-size: 0.95rem; + width: 100%; + border: 1px solid #a4a4a4; + border-radius: 2px; + margin: 0.7rem 0 0; +} +.field-text:focus, .field-text:active, .field-choice:focus, .field-choice:active { + outline: 0; + border-color: var(--border); +} + +.field-text { + padding: 0.8em 1.1em; +} + +textarea.field-text { + height: 180px; +} + +/** + * field-choice + * + * + */ +.field-choice { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0.8em; + background-image: linear-gradient(to right, #717171, #717171); + background-position: 100%; + background-size: 1.5rem 100%; + background-repeat: no-repeat; +} +.field-choice:active, .field-choice:focus { + background-image: linear-gradient(to right, #3e3e3e, #3e3e3e); +} + +/** + * radio & checkbox + * + *
+ * + *
+ * + */ +[type=checkbox].field-choice, +[type=radio].field-choice { + position: relative; + display: none; +} +[type=checkbox].field-choice ~ .field-choice__checked, +[type=radio].field-choice ~ .field-choice__checked { + display: none; +} +[type=checkbox].field-choice:checked ~ .field-choice__checked, +[type=radio].field-choice:checked ~ .field-choice__checked { + display: inline-block; +} +[type=checkbox].field-choice:checked ~ .field-choice__unchecked, +[type=radio].field-choice:checked ~ .field-choice__unchecked { + display: none; +} + +svg.field-choice__unchecked { + fill: var(--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; +} + +/** + * + * + */ +.field-switch { + position: relative; + display: inline-block; + width: 75px; + height: 35px; + border: 1px solid var(--border); + border-radius: 2px; +} +.field-switch:after { + position: absolute; + top: 0; + left: 0; + width: 50%; + height: 100%; + content: ""; + border: 1px solid var(--border); + border-color: var(--border-contrast); + border-radius: 2px; + background-color: var(--active); + transition: transform 0.25s; +} + +[type=checkbox].field-choice ~ .field-switch:after { + left: 0; +} +[type=checkbox].field-choice:checked ~ .field-switch { + border-color: var(--success); +} +[type=checkbox].field-choice:checked ~ .field-switch:after { + background-color: var(--success); + transform: translateX(100%); +} + +/** + * display error for fields + * + */ +.field-error { + color: var(--danger); +} + +/** + * + *
+ * + * A + * + *
+ * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.group__item { + width: auto; + display: inline-block; + margin: 0 0 1rem; + margin-right: 0.25rem; +} +.group__item:last-child { + margin-right: 0; +} + +/** + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.icon { + width: 1em; + height: 1em; + max-height: 100%; + max-width: 100%; + vertical-align: middle; + overflow: hidden; + font-size: 1.4rem; + fill: var(--text); +} + +/** + *
+ * image + *
+ * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.hero { + position: relative; +} +.hero img { + width: 100%; + -o-object-fit: cover; + object-fit: cover; + -o-object-position: 50% 50%; + object-position: 50% 50%; +} + +/** + * + * tabs + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.tabs { + display: flex; + flex-direction: column; + width: 100%; + border-bottom: 1px solid var(--border); +} +@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; + color: var(--text); + transition: background-color 0.1s; + border-bottom: 3px solid transparent; + background-color: transparent; + width: 100%; +} +@media only screen and (min-width: 768px) { + .tabs__item { + width: auto; + display: inline-flex; + } +} +.tabs__item:hover { + cursor: pointer; + background-color: var(--active); + color: var(--text-contrast); + border-top-left-radius: 2px; + border-top-right-radius: 2px; +} +.tabs__item--selected { + color: var(--text); + border-color: var(--border); +} +.tabs--contrast { + border: 0; +} +.tabs--contrast .tabs__item { + color: var(--text-contrast); +} +.tabs--contrast .tabs__item:hover { + background-color: var(--background-contrast); + color: var(--text); + border-radius: 0; +} +.tabs--contrast .tabs__item--selected { + border-color: var(--border-contrast); +} +.tabs--contrast .tabs__item--selected:hover { + border-color: var(--active); +} + +/** + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.panel, .sidebar__inner { + border: 1px solid var(--border); + border-radius: 2px; + background-color: var(--background-contrast); +} +.panel__body, .sidebar__body { + padding: 0.6rem 0.8rem; +} +@media only screen and (min-width: 992px) { + .panel__body, .sidebar__body { + padding: 0.7rem 1rem 0.9rem; + } +} +.panel--border-highlight { + border-left-width: 12px; +} + +/** + *
+ *
+ *
+ * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.progress { + height: 40px; + width: 100%; + border: 1px solid var(--border); +} +.progress__inner { + height: 100%; + border: 1px solid var(--background-contrast); + background-color: var(--background); +} + +/** + *
+ * + *
+ * food truck yr franzen pabst + *
+ *
+ * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.figure { + margin: 0; + display: inline-block; + line-height: 0; + border: 1px solid var(--border); + border-radius: 2px; + overflow: hidden; +} +.figure__caption { + padding: 0.75em 1.1em; + font-size: 0.7rem; + background: var(--background); + line-height: 1.618; + margin: 0; + color: var(--text-contrast); + border-top: 1px solid var(--border-contrast); +} +.figure .media { + border: 0; + border-radius: 0; +} + +.media { + border-radius: 2px; + border: 1px solid var(--border); + width: 100%; + height: auto; +} + +/** + * + * table + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.table { + width: 100%; + border: 1px solid var(--border); + background: var(--white); +} +.table--scroll { + overflow-x: auto; +} +.table__td { + color: var(--text); +} +.table__td, .table__th { + text-align: left; + border-bottom: 1px solid var(--border); + padding: 0.25em 0.75em; +} +@media only screen and (min-width: 992px) { + .table__td, .table__th { + padding: 0.5em 1.25em; + } +} +.table__th { + color: white; + background-color: var(--background); +} +.table--striped .table__tr:nth-child(even) .table__td { + background-color: #e4e4e4; +} +.table--hover .table__tr:hover .table__td { + color: white; + background-color: #585858; +} + +/** + *
+ *
+ *
+ *
+ *
+ *
+ *
+ *
+ * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.bar { + display: flex; + min-height: 2.8em; + background-color: var(--background); + color: var(--text-contrast); + border: 1px solid var(--border); + border-radius: 2px; +} +.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; + align-items: center; + margin-left: 0.75em; +} +.bar__start:last-child, .bar__main:last-child, .bar__end:last-child { + margin-right: 0.75em; +} + +/** + *
+ * + *
+ * food truck yr franzen pabst + *
+ *
+ * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.modal { + position: fixed; + width: 100%; + height: 100%; + top: 0; + left: 0; + display: flex; + visibility: hidden; + transition: visibility 0s linear 0.5s; + padding: 1rem; + z-index: 20; + align-items: center; + justify-content: center; +} +.modal:before { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: transparent; + transition: background-color 0.5s; + z-index: 19; + content: ""; + transition: background-color 0.5s; +} +.modal__inner { + position: relative; + z-index: 21; + transition: transform 0.5s; + transform: scale(0); + max-width: 600px; + width: 100%; +} +.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: var(--text-contrast); +} +.modal__body { + margin-bottom: 1.5rem; +} +.modal .button { + color: var(--text-contrast); +} +.modal--open { + display: flex; + visibility: visible; + transition: visibility 0s linear 0s; +} +.modal--open:before { + background-color: var(--background-alpha); +} +.modal--open .modal__inner { + transform: scale(1); +} + +/** + *
+ * + * + * + *
+ * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.loading { + height: 60px; + width: 47px; + margin: 0 auto; + display: flex; + align-items: center; +} +.loading span { + display: block; + width: 15px; + height: 80px; + background-color: var(--background); + animation-name: loading-animation; + animation-duration: 0.5s; + animation-iteration-count: infinite; + animation-delay: 0.15s; + border-top: 1px solid var(--background); + border-bottom: 1px solid var(--background); +} +.loading span:first-child { + margin-right: 1px; + animation-delay: 0s; +} +.loading span:last-child { + margin-left: 1px; + animation-delay: 0.3s; +} + +@keyframes loading-animation { + 0% { + height: 60px; + } + 50% { + height: 40px; + } + 100% { + height: 60px; + } +} +/** + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.sidebar { + position: fixed; + z-index: 9; + top: 0; + left: 0; + width: 100%; + height: 100%; + max-width: 95%; + visibility: hidden; + transition: visibility 0s linear 0.5s; +} +.sidebar:before { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: transparent; + transition: background-color 0.5s; + z-index: 9; + content: ""; + transition: background-color 0.5s; +} +.sidebar__inner { + position: relative; + height: 100%; + z-index: 10; + transition: transform 0.2s; + transform: translateX(-100%); +} +.sidebar__footer { + position: fixed; + left: 0; + bottom: 0; + display: flex; + justify-content: space-between; + background: var(--background); + width: 100%; + padding: 1rem; +} +.sidebar--open { + visibility: visible; + transition: visibility 0s linear 0s; +} +.sidebar--open .sidebar__inner { + transform: translateX(0); +} +.sidebar--open:before { + background: var(--background-alpha); +} +@media only screen and (min-width: 992px) { + .sidebar { + max-width: 33%; + } +} + +/** + *
+ *
+ *
+ * + *
+ *
+ * + *
+ *
+ * + *
+ *
+ *
+ * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.toast { + display: flex; + background: var(--background); + border: 1px solid var(--border); + max-width: 800px; + width: -moz-max-content; + width: max-content; + margin-top: 1.25rem; + position: relative; + left: calc(-100% - 2rem); + transition: left 0.1s; + pointer-events: auto; +} +.toast--animation { + left: 0; +} +.toast__body { + width: 100%; + padding: 1em 1.25em; +} +.toast__button { + border: 0; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: var(--background); +} +.toast__button:hover { + cursor: pointer; +} +.toast__body, .toast__button { + color: var(--text-contrast); +} +.toast__icon, .toast__button { + display: flex; + align-self: stretch; + align-items: center; + padding: 0 1em; +} +.toast__icon svg, .toast__button svg { + font-size: 2rem; +} +.toast--danger { + background: var(--danger); +} +.toast--danger .toast__button { + background: var(--danger); +} +.toast--info { + background: var(--info); +} +.toast--info .toast__button { + background: var(--info); +} +.toast--success { + background: var(--success); +} +.toast--success .toast__button { + background: var(--success); +} +.toast--warning { + background: var(--warning); +} +.toast--warning .toast__button { + background: var(--warning); +} +.toast-wrapper { + position: fixed; + left: 0; + bottom: 0; + margin: 2rem; + z-index: 30; + pointer-events: none; +} +.toast-wrapper--right { + left: inherit; + right: 0; +} +.toast-wrapper--right .toast { + left: inherit; + right: calc(-100% - 2rem); + transition: right 0.1s; +} +.toast-wrapper--right .toast--animation { + left: inherit; + right: 0; +} +.toast-wrapper--top { + bottom: inherit; + top: 0; +} + +/** + * masonry + * + *
+ *
+ * + *
+ *
+ * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.masonry { + display: flex; + width: 100%; + flex-flow: row wrap; + gap: 15px; +} +.masonry__item { + width: 100%; + height: 200px; +} +@media only screen and (min-width: 768px) { + .masonry__item { + height: 300px; + } + .masonry__item:nth-child(4n+1) { + width: calc(25% - 10px); + } + .masonry__item:nth-child(4n+2) { + width: calc(55% - 10px); + } + .masonry__item:nth-child(4n+3) { + width: calc(20% - 10px); + } + .masonry__item:nth-child(4n+4) { + width: calc(67% - 10px); + } + .masonry__item:nth-child(4n+5) { + width: calc(33% - 10px); + } +} + +/** + * slider + * + *
+ *
+ *
+ *
+ *
+ * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.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; +} + +/** + * grid + * + * This Grid is mainly the Reflex Grid from Lee Gordon https://reflexgrid.com/, he has + * done a great work, for i few changes it was needed to integrated + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +/** + * grid: mixin + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +/** + * order class generation mixins + * + */ +/** + * offset class generation mixins + * + */ +/** + * modifier mixins + * + */ +/** + * justify-content + * + * Uses "text-align" for the fallback inline-block grid + * "text-align" is globally supported and works on all rows except the last + * "text-align-last", where supported, handles the last line (and, happily, grids with only one row) + * + */ +/** + * Responsible Visibility + * + */ +/** + * Breakpoint viewport sizes and media queries + * + * Breakpoints are defined as a map of (name: minimum width), order from small to large: + * (xs: 576px, sm: 768px, md: 992px) + * The map defined in the `$reflex-breakpoints` global variable is used as the `$breakpoints` argument by default. + * Name of the next breakpoint, or null for the last breakpoint. + * >> breakpoint-next(sm) -> md + * >> breakpoint-next(sm, $breakpoints: (xs: 576px, sm: 768px, md: 992px)) -> md + * >> breakpoint-next(sm, $breakpoint-names: (xs sm md)) -> md + * + */ +/** + * Minimum breakpoint width. Null for the smallest (first) breakpoint. + * breakpoint-min(sm, (xs: 576px, sm: 768px, md: 992px)) -> 768px + * + */ +/** + * Media of at most the maximum breakpoint width. No query for the largest breakpoint. + * Makes the @content apply to the given breakpoint and narrower. + * + */ +/** + * Media between the breakpoint's minimum and maximum widths. + * No minimum for the smallest breakpoint, and no maximum for the largest one. + * Makes the @content apply only to the given breakpoint, not viewports any wider or narrower. + * + */ +/** + * grid: helpers + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.wrap { + flex-wrap: wrap; +} + +.no-wrap { + flex-wrap: nowrap; +} +.no-wrap [class*=col-] { + flex-shrink: 1; +} + +.wrap-reverse { + flex-wrap: wrap-reverse; +} + +/** + * flex-direction + * + */ +.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 items (cross axis) + * + */ +.align-start { + align-items: flex-start; +} + +.align-end { + align-items: flex-end; +} + +.align-center { + align-items: center; +} + +.align-baseline { + align-items: baseline; +} + +/** + * align content (cross axis) + * + */ +.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 + * + */ +.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-content (main axis) + * + */ +.justify-start { + justify-content: flex-start; +} + +.justify-end { + justify-content: flex-end; +} + +.justify-center { + justify-content: center; +} + +.justify-space-between { + justify-content: space-between; +} + +.justify-space-around { + justify-content: space-around; +} + +/** + * cosmetic grid modifiers + * + */ +.grid-bleed [class*=col-] { + padding: 0; +} + +/** + * col modifiers + * + */ +.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; +} + +/** + * col-grid contents + * + */ +.flex-img { + display: block; + flex: 0 0 auto; + max-width: 100%; + height: auto; + width: 100%; +} + +.flex-footer { + width: 100%; + margin-top: auto; + margin-bottom: 0; +} +.flex-footer > :last-child { + margin-bottom: 0; +} + +/** + * Responsive visibility modifiers + * + */ +@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; + } +} + +.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 { + display: block; + box-sizing: border-box; + display: flex; + flex-wrap: wrap; + padding: 0; + margin: 0 auto; + position: relative; + list-style-type: none; +} +.grid::after, .grid::before { + box-sizing: border-box; +} + +.col-item, .col-xs-auto, .col-sm-auto, .col-lg-auto, .col-xlg-auto, .col-auto, .col-12, .col-11, .col-10, .col-9, .col-8, .col-7, .col-6, .col-5, .col-4, .col-3, .col-2, .col-1 { + box-sizing: border-box; + position: relative; + width: 100%; + vertical-align: top; + padding: 15px; +} +.col-item::after, .col-xs-auto::after, .col-sm-auto::after, .col-lg-auto::after, .col-xlg-auto::after, .col-auto::after, .col-12::after, .col-11::after, .col-10::after, .col-9::after, .col-8::after, .col-7::after, .col-6::after, .col-5::after, .col-4::after, .col-3::after, .col-2::after, .col-1::after, .col-item::before, .col-xs-auto::before, .col-sm-auto::before, .col-lg-auto::before, .col-xlg-auto::before, .col-auto::before, .col-12::before, .col-11::before, .col-10::before, .col-9::before, .col-8::before, .col-7::before, .col-6::before, .col-5::before, .col-4::before, .col-3::before, .col-2::before, .col-1::before { + box-sizing: border-box; +} +.col-item .grid, .col-xs-auto .grid, .col-sm-auto .grid, .col-lg-auto .grid, .col-xlg-auto .grid, .col-auto .grid, .col-12 .grid, .col-11 .grid, .col-10 .grid, .col-9 .grid, .col-8 .grid, .col-7 .grid, .col-6 .grid, .col-5 .grid, .col-4 .grid, .col-3 .grid, .col-2 .grid, .col-1 .grid { + flex: 1 1 auto; + margin: -15px; +} + +/** + * grid generation + * + * + */ +.col-12 { + width: 100%; +} + +.col-11 { + width: 91.6666666667%; +} + +.col-10 { + width: 83.3333333333%; +} + +.col-9 { + width: 75%; +} + +.col-8 { + width: 66.6666666667%; +} + +.col-7 { + width: 58.3333333333%; +} + +.col-6 { + width: 50%; +} + +.col-5 { + width: 41.6666666667%; +} + +.col-4 { + width: 33.3333333333%; +} + +.col-3 { + width: 25%; +} + +.col-2 { + width: 16.6666666667%; +} + +.col-1 { + width: 8.3333333333%; +} + +@media (min-width: 576px) { + .col-xs-12 { + width: 100%; + } + .col-xs-11 { + width: 91.6666666667%; + } + .col-xs-10 { + width: 83.3333333333%; + } + .col-xs-9 { + width: 75%; + } + .col-xs-8 { + width: 66.6666666667%; + } + .col-xs-7 { + width: 58.3333333333%; + } + .col-xs-6 { + width: 50%; + } + .col-xs-5 { + width: 41.6666666667%; + } + .col-xs-4 { + width: 33.3333333333%; + } + .col-xs-3 { + width: 25%; + } + .col-xs-2 { + width: 16.6666666667%; + } + .col-xs-1 { + width: 8.3333333333%; + } +} +@media (min-width: 768px) { + .col-sm-12 { + width: 100%; + } + .col-sm-11 { + width: 91.6666666667%; + } + .col-sm-10 { + width: 83.3333333333%; + } + .col-sm-9 { + width: 75%; + } + .col-sm-8 { + width: 66.6666666667%; + } + .col-sm-7 { + width: 58.3333333333%; + } + .col-sm-6 { + width: 50%; + } + .col-sm-5 { + width: 41.6666666667%; + } + .col-sm-4 { + width: 33.3333333333%; + } + .col-sm-3 { + width: 25%; + } + .col-sm-2 { + width: 16.6666666667%; + } + .col-sm-1 { + width: 8.3333333333%; + } +} +@media (min-width: 992px) { + .col-md-12 { + width: 100%; + } + .col-md-11 { + width: 91.6666666667%; + } + .col-md-10 { + width: 83.3333333333%; + } + .col-md-9 { + width: 75%; + } + .col-md-8 { + width: 66.6666666667%; + } + .col-md-7 { + width: 58.3333333333%; + } + .col-md-6 { + width: 50%; + } + .col-md-5 { + width: 41.6666666667%; + } + .col-md-4 { + width: 33.3333333333%; + } + .col-md-3 { + width: 25%; + } + .col-md-2 { + width: 16.6666666667%; + } + .col-md-1 { + width: 8.3333333333%; + } +} +@media (min-width: 1200px) { + .col-lg-12 { + width: 100%; + } + .col-lg-11 { + width: 91.6666666667%; + } + .col-lg-10 { + width: 83.3333333333%; + } + .col-lg-9 { + width: 75%; + } + .col-lg-8 { + width: 66.6666666667%; + } + .col-lg-7 { + width: 58.3333333333%; + } + .col-lg-6 { + width: 50%; + } + .col-lg-5 { + width: 41.6666666667%; + } + .col-lg-4 { + width: 33.3333333333%; + } + .col-lg-3 { + width: 25%; + } + .col-lg-2 { + width: 16.6666666667%; + } + .col-lg-1 { + width: 8.3333333333%; + } +} +@media (min-width: 1600px) { + .col-xlg-12 { + width: 100%; + } + .col-xlg-11 { + width: 91.6666666667%; + } + .col-xlg-10 { + width: 83.3333333333%; + } + .col-xlg-9 { + width: 75%; + } + .col-xlg-8 { + width: 66.6666666667%; + } + .col-xlg-7 { + width: 58.3333333333%; + } + .col-xlg-6 { + width: 50%; + } + .col-xlg-5 { + width: 41.6666666667%; + } + .col-xlg-4 { + width: 33.3333333333%; + } + .col-xlg-3 { + width: 25%; + } + .col-xlg-2 { + width: 16.6666666667%; + } + .col-xlg-1 { + width: 8.3333333333%; + } +} +/** + * col-auto + * + * + */ +.col-auto { + flex: 1 0 0px; +} + +@media (min-width: 576px) { + .col-xs-auto { + flex: 1 0 0px; + } +} +@media (min-width: 768px) { + .col-sm-auto { + flex: 1 0 0px; + } +} +@media (min-width: 992px) { + .col-md-auto { + flex: 1 0 0px; + } +} +@media (min-width: 1200px) { + .col-lg-auto { + flex: 1 0 0px; + } +} +@media (min-width: 1600px) { + .col-xlg-auto { + flex: 1 0 0px; + } +} +/** + * order helpers generation + * + * + */ +.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 helpers generation + * + * + */ +.offset-11 { + margin-left: 91.6666666667%; +} + +.offset-10 { + margin-left: 83.3333333333%; +} + +.offset-9 { + margin-left: 75%; +} + +.offset-8 { + margin-left: 66.6666666667%; +} + +.offset-7 { + margin-left: 58.3333333333%; +} + +.offset-6 { + margin-left: 50%; +} + +.offset-5 { + margin-left: 41.6666666667%; +} + +.offset-4 { + margin-left: 33.3333333333%; +} + +.offset-3 { + margin-left: 25%; +} + +.offset-2 { + margin-left: 16.6666666667%; +} + +.offset-1 { + margin-left: 8.3333333333%; +} + +@media (min-width: 576px) { + .offset-xs-11 { + margin-left: 91.6666666667%; + } + .offset-xs-10 { + margin-left: 83.3333333333%; + } + .offset-xs-9 { + margin-left: 75%; + } + .offset-xs-8 { + margin-left: 66.6666666667%; + } + .offset-xs-7 { + margin-left: 58.3333333333%; + } + .offset-xs-6 { + margin-left: 50%; + } + .offset-xs-5 { + margin-left: 41.6666666667%; + } + .offset-xs-4 { + margin-left: 33.3333333333%; + } + .offset-xs-3 { + margin-left: 25%; + } + .offset-xs-2 { + margin-left: 16.6666666667%; + } + .offset-xs-1 { + margin-left: 8.3333333333%; + } + .offset-xs-0 { + margin-left: 0; + } +} +@media (min-width: 768px) { + .offset-sm-11 { + margin-left: 91.6666666667%; + } + .offset-sm-10 { + margin-left: 83.3333333333%; + } + .offset-sm-9 { + margin-left: 75%; + } + .offset-sm-8 { + margin-left: 66.6666666667%; + } + .offset-sm-7 { + margin-left: 58.3333333333%; + } + .offset-sm-6 { + margin-left: 50%; + } + .offset-sm-5 { + margin-left: 41.6666666667%; + } + .offset-sm-4 { + margin-left: 33.3333333333%; + } + .offset-sm-3 { + margin-left: 25%; + } + .offset-sm-2 { + margin-left: 16.6666666667%; + } + .offset-sm-1 { + margin-left: 8.3333333333%; + } + .offset-sm-0 { + margin-left: 0; + } +} +@media (min-width: 992px) { + .offset-md-11 { + margin-left: 91.6666666667%; + } + .offset-md-10 { + margin-left: 83.3333333333%; + } + .offset-md-9 { + margin-left: 75%; + } + .offset-md-8 { + margin-left: 66.6666666667%; + } + .offset-md-7 { + margin-left: 58.3333333333%; + } + .offset-md-6 { + margin-left: 50%; + } + .offset-md-5 { + margin-left: 41.6666666667%; + } + .offset-md-4 { + margin-left: 33.3333333333%; + } + .offset-md-3 { + margin-left: 25%; + } + .offset-md-2 { + margin-left: 16.6666666667%; + } + .offset-md-1 { + margin-left: 8.3333333333%; + } + .offset-md-0 { + margin-left: 0; + } +} +@media (min-width: 1200px) { + .offset-lg-11 { + margin-left: 91.6666666667%; + } + .offset-lg-10 { + margin-left: 83.3333333333%; + } + .offset-lg-9 { + margin-left: 75%; + } + .offset-lg-8 { + margin-left: 66.6666666667%; + } + .offset-lg-7 { + margin-left: 58.3333333333%; + } + .offset-lg-6 { + margin-left: 50%; + } + .offset-lg-5 { + margin-left: 41.6666666667%; + } + .offset-lg-4 { + margin-left: 33.3333333333%; + } + .offset-lg-3 { + margin-left: 25%; + } + .offset-lg-2 { + margin-left: 16.6666666667%; + } + .offset-lg-1 { + margin-left: 8.3333333333%; + } + .offset-lg-0 { + margin-left: 0; + } +} +@media (min-width: 1600px) { + .offset-xlg-11 { + margin-left: 91.6666666667%; + } + .offset-xlg-10 { + margin-left: 83.3333333333%; + } + .offset-xlg-9 { + margin-left: 75%; + } + .offset-xlg-8 { + margin-left: 66.6666666667%; + } + .offset-xlg-7 { + margin-left: 58.3333333333%; + } + .offset-xlg-6 { + margin-left: 50%; + } + .offset-xlg-5 { + margin-left: 41.6666666667%; + } + .offset-xlg-4 { + margin-left: 33.3333333333%; + } + .offset-xlg-3 { + margin-left: 25%; + } + .offset-xlg-2 { + margin-left: 16.6666666667%; + } + .offset-xlg-1 { + margin-left: 8.3333333333%; + } + .offset-xlg-0 { + margin-left: 0; + } +} +/** + * core + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.border { + border: 1px solid var(--border); +} + +.border-round { + border-radius: 2px; +} + +.border-0 { + border: 0; +} + +.radius-0 { + border-radius: 0; +} + +.round { + border-radius: 50%; +} + +/** + * 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; +} + +.z-index-11 { + z-index: 11; +} + +.z-index-12 { + z-index: 12; +} + +.z-index-13 { + z-index: 13; +} + +.z-index-14 { + z-index: 14; +} + +.z-index-15 { + z-index: 15; +} + +.z-index-16 { + z-index: 16; +} + +.z-index-17 { + z-index: 17; +} + +.z-index-18 { + z-index: 18; +} + +.z-index-19 { + z-index: 19; +} + +.z-index-20 { + z-index: 20; +} + +/** + * 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; +} + +/** + * + * + */ +.overflow-x-hidden { + overflow-x: hidden; +} + +.overflow-y-hidden { + overflow-y: hidden; +} + +.object-fit-cover { + -o-object-fit: cover; + object-fit: cover; +} + +/** + * Sizing + * + * Width and Height Classes, + * Sizes with percentage will calculate with the Reflex Grid + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +/** + * mixin: sizing + * + */ +/** + * mixin: sizing for each breakpoint + * + * + */ +.w-0 { + width: 0; +} + +@media only screen and (min-width: 576px) { + .w-xs-1 { + width: 0; + } +} +@media only screen and (min-width: 768px) { + .w-sm-1 { + width: 0; + } +} +@media only screen and (min-width: 992px) { + .w-md-1 { + width: 0; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-1 { + width: 0; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-1 { + width: 0; + } +} +.h-0 { + height: 0; +} + +@media only screen and (min-width: 576px) { + .h-xs-1 { + height: 0; + } +} +@media only screen and (min-width: 768px) { + .h-sm-1 { + height: 0; + } +} +@media only screen and (min-width: 992px) { + .h-md-1 { + height: 0; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-1 { + height: 0; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-1 { + height: 0; + } +} +.w-1 { + width: 1px; +} + +@media only screen and (min-width: 576px) { + .w-xs-1 { + width: 1px; + } +} +@media only screen and (min-width: 768px) { + .w-sm-1 { + width: 1px; + } +} +@media only screen and (min-width: 992px) { + .w-md-1 { + width: 1px; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-1 { + width: 1px; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-1 { + width: 1px; + } +} +.h-1 { + height: 1px; +} + +@media only screen and (min-width: 576px) { + .h-xs-1 { + height: 1px; + } +} +@media only screen and (min-width: 768px) { + .h-sm-1 { + height: 1px; + } +} +@media only screen and (min-width: 992px) { + .h-md-1 { + height: 1px; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-1 { + height: 1px; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-1 { + height: 1px; + } +} +.w-100 { + width: 100%; +} + +@media only screen and (min-width: 576px) { + .w-xs-100 { + width: 100%; + } +} +@media only screen and (min-width: 768px) { + .w-sm-100 { + width: 100%; + } +} +@media only screen and (min-width: 992px) { + .w-md-100 { + width: 100%; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-100 { + width: 100%; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-100 { + width: 100%; + } +} +.w-auto { + width: auto; +} + +@media only screen and (min-width: 576px) { + .w-xs-auto { + width: auto; + } +} +@media only screen and (min-width: 768px) { + .w-sm-auto { + width: auto; + } +} +@media only screen and (min-width: 992px) { + .w-md-auto { + width: auto; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-auto { + width: auto; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-auto { + width: auto; + } +} +.h-100 { + height: 100%; +} + +@media only screen and (min-width: 576px) { + .h-xs-100 { + height: 100%; + } +} +@media only screen and (min-width: 768px) { + .h-sm-100 { + height: 100%; + } +} +@media only screen and (min-width: 992px) { + .h-md-100 { + height: 100%; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-100 { + height: 100%; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-100 { + height: 100%; + } +} +.h-auto { + height: auto; +} + +@media only screen and (min-width: 576px) { + .h-xs-auto { + height: auto; + } +} +@media only screen and (min-width: 768px) { + .h-sm-auto { + height: auto; + } +} +@media only screen and (min-width: 992px) { + .h-md-auto { + height: auto; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-auto { + height: auto; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-auto { + height: auto; + } +} +.w-col-1 { + width: 8.3333333333%; +} + +@media only screen and (min-width: 576px) { + .w-col-xs-1 { + width: 8.3333333333%; + } +} +@media only screen and (min-width: 768px) { + .w-col-sm-1 { + width: 8.3333333333%; + } +} +@media only screen and (min-width: 992px) { + .w-col-md-1 { + width: 8.3333333333%; + } +} +@media only screen and (min-width: 1200px) { + .w-col-lg-1 { + width: 8.3333333333%; + } +} +@media only screen and (min-width: 1600px) { + .w-col-xlg-1 { + width: 8.3333333333%; + } +} +.h-col-1 { + height: 8.3333333333%; +} + +@media only screen and (min-width: 576px) { + .h-col-xs-1 { + height: 8.3333333333%; + } +} +@media only screen and (min-width: 768px) { + .h-col-sm-1 { + height: 8.3333333333%; + } +} +@media only screen and (min-width: 992px) { + .h-col-md-1 { + height: 8.3333333333%; + } +} +@media only screen and (min-width: 1200px) { + .h-col-lg-1 { + height: 8.3333333333%; + } +} +@media only screen and (min-width: 1600px) { + .h-col-xlg-1 { + height: 8.3333333333%; + } +} +.w-col-2 { + width: 16.6666666667%; +} + +@media only screen and (min-width: 576px) { + .w-col-xs-2 { + width: 16.6666666667%; + } +} +@media only screen and (min-width: 768px) { + .w-col-sm-2 { + width: 16.6666666667%; + } +} +@media only screen and (min-width: 992px) { + .w-col-md-2 { + width: 16.6666666667%; + } +} +@media only screen and (min-width: 1200px) { + .w-col-lg-2 { + width: 16.6666666667%; + } +} +@media only screen and (min-width: 1600px) { + .w-col-xlg-2 { + width: 16.6666666667%; + } +} +.h-col-2 { + height: 16.6666666667%; +} + +@media only screen and (min-width: 576px) { + .h-col-xs-2 { + height: 16.6666666667%; + } +} +@media only screen and (min-width: 768px) { + .h-col-sm-2 { + height: 16.6666666667%; + } +} +@media only screen and (min-width: 992px) { + .h-col-md-2 { + height: 16.6666666667%; + } +} +@media only screen and (min-width: 1200px) { + .h-col-lg-2 { + height: 16.6666666667%; + } +} +@media only screen and (min-width: 1600px) { + .h-col-xlg-2 { + height: 16.6666666667%; + } +} +.w-col-3 { + width: 25%; +} + +@media only screen and (min-width: 576px) { + .w-col-xs-3 { + width: 25%; + } +} +@media only screen and (min-width: 768px) { + .w-col-sm-3 { + width: 25%; + } +} +@media only screen and (min-width: 992px) { + .w-col-md-3 { + width: 25%; + } +} +@media only screen and (min-width: 1200px) { + .w-col-lg-3 { + width: 25%; + } +} +@media only screen and (min-width: 1600px) { + .w-col-xlg-3 { + width: 25%; + } +} +.h-col-3 { + height: 25%; +} + +@media only screen and (min-width: 576px) { + .h-col-xs-3 { + height: 25%; + } +} +@media only screen and (min-width: 768px) { + .h-col-sm-3 { + height: 25%; + } +} +@media only screen and (min-width: 992px) { + .h-col-md-3 { + height: 25%; + } +} +@media only screen and (min-width: 1200px) { + .h-col-lg-3 { + height: 25%; + } +} +@media only screen and (min-width: 1600px) { + .h-col-xlg-3 { + height: 25%; + } +} +.w-col-4 { + width: 33.3333333333%; +} + +@media only screen and (min-width: 576px) { + .w-col-xs-4 { + width: 33.3333333333%; + } +} +@media only screen and (min-width: 768px) { + .w-col-sm-4 { + width: 33.3333333333%; + } +} +@media only screen and (min-width: 992px) { + .w-col-md-4 { + width: 33.3333333333%; + } +} +@media only screen and (min-width: 1200px) { + .w-col-lg-4 { + width: 33.3333333333%; + } +} +@media only screen and (min-width: 1600px) { + .w-col-xlg-4 { + width: 33.3333333333%; + } +} +.h-col-4 { + height: 33.3333333333%; +} + +@media only screen and (min-width: 576px) { + .h-col-xs-4 { + height: 33.3333333333%; + } +} +@media only screen and (min-width: 768px) { + .h-col-sm-4 { + height: 33.3333333333%; + } +} +@media only screen and (min-width: 992px) { + .h-col-md-4 { + height: 33.3333333333%; + } +} +@media only screen and (min-width: 1200px) { + .h-col-lg-4 { + height: 33.3333333333%; + } +} +@media only screen and (min-width: 1600px) { + .h-col-xlg-4 { + height: 33.3333333333%; + } +} +.w-col-5 { + width: 41.6666666667%; +} + +@media only screen and (min-width: 576px) { + .w-col-xs-5 { + width: 41.6666666667%; + } +} +@media only screen and (min-width: 768px) { + .w-col-sm-5 { + width: 41.6666666667%; + } +} +@media only screen and (min-width: 992px) { + .w-col-md-5 { + width: 41.6666666667%; + } +} +@media only screen and (min-width: 1200px) { + .w-col-lg-5 { + width: 41.6666666667%; + } +} +@media only screen and (min-width: 1600px) { + .w-col-xlg-5 { + width: 41.6666666667%; + } +} +.h-col-5 { + height: 41.6666666667%; +} + +@media only screen and (min-width: 576px) { + .h-col-xs-5 { + height: 41.6666666667%; + } +} +@media only screen and (min-width: 768px) { + .h-col-sm-5 { + height: 41.6666666667%; + } +} +@media only screen and (min-width: 992px) { + .h-col-md-5 { + height: 41.6666666667%; + } +} +@media only screen and (min-width: 1200px) { + .h-col-lg-5 { + height: 41.6666666667%; + } +} +@media only screen and (min-width: 1600px) { + .h-col-xlg-5 { + height: 41.6666666667%; + } +} +.w-col-6 { + width: 50%; +} + +@media only screen and (min-width: 576px) { + .w-col-xs-6 { + width: 50%; + } +} +@media only screen and (min-width: 768px) { + .w-col-sm-6 { + width: 50%; + } +} +@media only screen and (min-width: 992px) { + .w-col-md-6 { + width: 50%; + } +} +@media only screen and (min-width: 1200px) { + .w-col-lg-6 { + width: 50%; + } +} +@media only screen and (min-width: 1600px) { + .w-col-xlg-6 { + width: 50%; + } +} +.h-col-6 { + height: 50%; +} + +@media only screen and (min-width: 576px) { + .h-col-xs-6 { + height: 50%; + } +} +@media only screen and (min-width: 768px) { + .h-col-sm-6 { + height: 50%; + } +} +@media only screen and (min-width: 992px) { + .h-col-md-6 { + height: 50%; + } +} +@media only screen and (min-width: 1200px) { + .h-col-lg-6 { + height: 50%; + } +} +@media only screen and (min-width: 1600px) { + .h-col-xlg-6 { + height: 50%; + } +} +.w-col-7 { + width: 58.3333333333%; +} + +@media only screen and (min-width: 576px) { + .w-col-xs-7 { + width: 58.3333333333%; + } +} +@media only screen and (min-width: 768px) { + .w-col-sm-7 { + width: 58.3333333333%; + } +} +@media only screen and (min-width: 992px) { + .w-col-md-7 { + width: 58.3333333333%; + } +} +@media only screen and (min-width: 1200px) { + .w-col-lg-7 { + width: 58.3333333333%; + } +} +@media only screen and (min-width: 1600px) { + .w-col-xlg-7 { + width: 58.3333333333%; + } +} +.h-col-7 { + height: 58.3333333333%; +} + +@media only screen and (min-width: 576px) { + .h-col-xs-7 { + height: 58.3333333333%; + } +} +@media only screen and (min-width: 768px) { + .h-col-sm-7 { + height: 58.3333333333%; + } +} +@media only screen and (min-width: 992px) { + .h-col-md-7 { + height: 58.3333333333%; + } +} +@media only screen and (min-width: 1200px) { + .h-col-lg-7 { + height: 58.3333333333%; + } +} +@media only screen and (min-width: 1600px) { + .h-col-xlg-7 { + height: 58.3333333333%; + } +} +.w-col-8 { + width: 66.6666666667%; +} + +@media only screen and (min-width: 576px) { + .w-col-xs-8 { + width: 66.6666666667%; + } +} +@media only screen and (min-width: 768px) { + .w-col-sm-8 { + width: 66.6666666667%; + } +} +@media only screen and (min-width: 992px) { + .w-col-md-8 { + width: 66.6666666667%; + } +} +@media only screen and (min-width: 1200px) { + .w-col-lg-8 { + width: 66.6666666667%; + } +} +@media only screen and (min-width: 1600px) { + .w-col-xlg-8 { + width: 66.6666666667%; + } +} +.h-col-8 { + height: 66.6666666667%; +} + +@media only screen and (min-width: 576px) { + .h-col-xs-8 { + height: 66.6666666667%; + } +} +@media only screen and (min-width: 768px) { + .h-col-sm-8 { + height: 66.6666666667%; + } +} +@media only screen and (min-width: 992px) { + .h-col-md-8 { + height: 66.6666666667%; + } +} +@media only screen and (min-width: 1200px) { + .h-col-lg-8 { + height: 66.6666666667%; + } +} +@media only screen and (min-width: 1600px) { + .h-col-xlg-8 { + height: 66.6666666667%; + } +} +.w-col-9 { + width: 75%; +} + +@media only screen and (min-width: 576px) { + .w-col-xs-9 { + width: 75%; + } +} +@media only screen and (min-width: 768px) { + .w-col-sm-9 { + width: 75%; + } +} +@media only screen and (min-width: 992px) { + .w-col-md-9 { + width: 75%; + } +} +@media only screen and (min-width: 1200px) { + .w-col-lg-9 { + width: 75%; + } +} +@media only screen and (min-width: 1600px) { + .w-col-xlg-9 { + width: 75%; + } +} +.h-col-9 { + height: 75%; +} + +@media only screen and (min-width: 576px) { + .h-col-xs-9 { + height: 75%; + } +} +@media only screen and (min-width: 768px) { + .h-col-sm-9 { + height: 75%; + } +} +@media only screen and (min-width: 992px) { + .h-col-md-9 { + height: 75%; + } +} +@media only screen and (min-width: 1200px) { + .h-col-lg-9 { + height: 75%; + } +} +@media only screen and (min-width: 1600px) { + .h-col-xlg-9 { + height: 75%; + } +} +.w-col-10 { + width: 83.3333333333%; +} + +@media only screen and (min-width: 576px) { + .w-col-xs-10 { + width: 83.3333333333%; + } +} +@media only screen and (min-width: 768px) { + .w-col-sm-10 { + width: 83.3333333333%; + } +} +@media only screen and (min-width: 992px) { + .w-col-md-10 { + width: 83.3333333333%; + } +} +@media only screen and (min-width: 1200px) { + .w-col-lg-10 { + width: 83.3333333333%; + } +} +@media only screen and (min-width: 1600px) { + .w-col-xlg-10 { + width: 83.3333333333%; + } +} +.h-col-10 { + height: 83.3333333333%; +} + +@media only screen and (min-width: 576px) { + .h-col-xs-10 { + height: 83.3333333333%; + } +} +@media only screen and (min-width: 768px) { + .h-col-sm-10 { + height: 83.3333333333%; + } +} +@media only screen and (min-width: 992px) { + .h-col-md-10 { + height: 83.3333333333%; + } +} +@media only screen and (min-width: 1200px) { + .h-col-lg-10 { + height: 83.3333333333%; + } +} +@media only screen and (min-width: 1600px) { + .h-col-xlg-10 { + height: 83.3333333333%; + } +} +.w-col-11 { + width: 91.6666666667%; +} + +@media only screen and (min-width: 576px) { + .w-col-xs-11 { + width: 91.6666666667%; + } +} +@media only screen and (min-width: 768px) { + .w-col-sm-11 { + width: 91.6666666667%; + } +} +@media only screen and (min-width: 992px) { + .w-col-md-11 { + width: 91.6666666667%; + } +} +@media only screen and (min-width: 1200px) { + .w-col-lg-11 { + width: 91.6666666667%; + } +} +@media only screen and (min-width: 1600px) { + .w-col-xlg-11 { + width: 91.6666666667%; + } +} +.h-col-11 { + height: 91.6666666667%; +} + +@media only screen and (min-width: 576px) { + .h-col-xs-11 { + height: 91.6666666667%; + } +} +@media only screen and (min-width: 768px) { + .h-col-sm-11 { + height: 91.6666666667%; + } +} +@media only screen and (min-width: 992px) { + .h-col-md-11 { + height: 91.6666666667%; + } +} +@media only screen and (min-width: 1200px) { + .h-col-lg-11 { + height: 91.6666666667%; + } +} +@media only screen and (min-width: 1600px) { + .h-col-xlg-11 { + height: 91.6666666667%; + } +} +.w-col-12 { + width: 100%; +} + +@media only screen and (min-width: 576px) { + .w-col-xs-12 { + width: 100%; + } +} +@media only screen and (min-width: 768px) { + .w-col-sm-12 { + width: 100%; + } +} +@media only screen and (min-width: 992px) { + .w-col-md-12 { + width: 100%; + } +} +@media only screen and (min-width: 1200px) { + .w-col-lg-12 { + width: 100%; + } +} +@media only screen and (min-width: 1600px) { + .w-col-xlg-12 { + width: 100%; + } +} +.h-col-12 { + height: 100%; +} + +@media only screen and (min-width: 576px) { + .h-col-xs-12 { + height: 100%; + } +} +@media only screen and (min-width: 768px) { + .h-col-sm-12 { + height: 100%; + } +} +@media only screen and (min-width: 992px) { + .h-col-md-12 { + height: 100%; + } +} +@media only screen and (min-width: 1200px) { + .h-col-lg-12 { + height: 100%; + } +} +@media only screen and (min-width: 1600px) { + .h-col-xlg-12 { + height: 100%; + } +} +.w-1 { + width: 0.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-1 { + width: 0.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-1 { + width: 0.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-1 { + width: 0.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-1 { + width: 0.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-1 { + width: 0.5rem; + } +} +.w-2 { + width: 1rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-2 { + width: 1rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-2 { + width: 1rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-2 { + width: 1rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-2 { + width: 1rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-2 { + width: 1rem; + } +} +.w-3 { + width: 1.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-3 { + width: 1.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-3 { + width: 1.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-3 { + width: 1.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-3 { + width: 1.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-3 { + width: 1.5rem; + } +} +.w-4 { + width: 2rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-4 { + width: 2rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-4 { + width: 2rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-4 { + width: 2rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-4 { + width: 2rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-4 { + width: 2rem; + } +} +.w-5 { + width: 2.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-5 { + width: 2.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-5 { + width: 2.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-5 { + width: 2.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-5 { + width: 2.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-5 { + width: 2.5rem; + } +} +.w-6 { + width: 3rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-6 { + width: 3rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-6 { + width: 3rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-6 { + width: 3rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-6 { + width: 3rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-6 { + width: 3rem; + } +} +.w-7 { + width: 3.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-7 { + width: 3.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-7 { + width: 3.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-7 { + width: 3.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-7 { + width: 3.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-7 { + width: 3.5rem; + } +} +.w-8 { + width: 4rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-8 { + width: 4rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-8 { + width: 4rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-8 { + width: 4rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-8 { + width: 4rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-8 { + width: 4rem; + } +} +.w-9 { + width: 4.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-9 { + width: 4.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-9 { + width: 4.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-9 { + width: 4.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-9 { + width: 4.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-9 { + width: 4.5rem; + } +} +.w-10 { + width: 5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-10 { + width: 5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-10 { + width: 5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-10 { + width: 5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-10 { + width: 5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-10 { + width: 5rem; + } +} +.w-11 { + width: 5.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-11 { + width: 5.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-11 { + width: 5.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-11 { + width: 5.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-11 { + width: 5.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-11 { + width: 5.5rem; + } +} +.w-12 { + width: 6rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-12 { + width: 6rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-12 { + width: 6rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-12 { + width: 6rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-12 { + width: 6rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-12 { + width: 6rem; + } +} +.w-13 { + width: 6.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-13 { + width: 6.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-13 { + width: 6.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-13 { + width: 6.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-13 { + width: 6.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-13 { + width: 6.5rem; + } +} +.w-14 { + width: 7rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-14 { + width: 7rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-14 { + width: 7rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-14 { + width: 7rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-14 { + width: 7rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-14 { + width: 7rem; + } +} +.w-15 { + width: 7.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-15 { + width: 7.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-15 { + width: 7.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-15 { + width: 7.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-15 { + width: 7.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-15 { + width: 7.5rem; + } +} +.w-16 { + width: 8rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-16 { + width: 8rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-16 { + width: 8rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-16 { + width: 8rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-16 { + width: 8rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-16 { + width: 8rem; + } +} +.w-17 { + width: 8.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-17 { + width: 8.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-17 { + width: 8.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-17 { + width: 8.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-17 { + width: 8.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-17 { + width: 8.5rem; + } +} +.w-18 { + width: 9rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-18 { + width: 9rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-18 { + width: 9rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-18 { + width: 9rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-18 { + width: 9rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-18 { + width: 9rem; + } +} +.w-19 { + width: 9.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-19 { + width: 9.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-19 { + width: 9.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-19 { + width: 9.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-19 { + width: 9.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-19 { + width: 9.5rem; + } +} +.w-20 { + width: 10rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-20 { + width: 10rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-20 { + width: 10rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-20 { + width: 10rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-20 { + width: 10rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-20 { + width: 10rem; + } +} +.w-21 { + width: 10.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-21 { + width: 10.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-21 { + width: 10.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-21 { + width: 10.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-21 { + width: 10.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-21 { + width: 10.5rem; + } +} +.w-22 { + width: 11rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-22 { + width: 11rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-22 { + width: 11rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-22 { + width: 11rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-22 { + width: 11rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-22 { + width: 11rem; + } +} +.w-23 { + width: 11.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-23 { + width: 11.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-23 { + width: 11.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-23 { + width: 11.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-23 { + width: 11.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-23 { + width: 11.5rem; + } +} +.w-24 { + width: 12rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-24 { + width: 12rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-24 { + width: 12rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-24 { + width: 12rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-24 { + width: 12rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-24 { + width: 12rem; + } +} +.w-25 { + width: 12.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-25 { + width: 12.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-25 { + width: 12.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-25 { + width: 12.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-25 { + width: 12.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-25 { + width: 12.5rem; + } +} +.w-26 { + width: 13rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-26 { + width: 13rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-26 { + width: 13rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-26 { + width: 13rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-26 { + width: 13rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-26 { + width: 13rem; + } +} +.w-27 { + width: 13.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-27 { + width: 13.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-27 { + width: 13.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-27 { + width: 13.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-27 { + width: 13.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-27 { + width: 13.5rem; + } +} +.w-28 { + width: 14rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-28 { + width: 14rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-28 { + width: 14rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-28 { + width: 14rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-28 { + width: 14rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-28 { + width: 14rem; + } +} +.w-29 { + width: 14.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-29 { + width: 14.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-29 { + width: 14.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-29 { + width: 14.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-29 { + width: 14.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-29 { + width: 14.5rem; + } +} +.w-30 { + width: 15rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-30 { + width: 15rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-30 { + width: 15rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-30 { + width: 15rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-30 { + width: 15rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-30 { + width: 15rem; + } +} +.w-31 { + width: 15.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-31 { + width: 15.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-31 { + width: 15.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-31 { + width: 15.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-31 { + width: 15.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-31 { + width: 15.5rem; + } +} +.w-32 { + width: 16rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-32 { + width: 16rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-32 { + width: 16rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-32 { + width: 16rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-32 { + width: 16rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-32 { + width: 16rem; + } +} +.w-33 { + width: 16.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-33 { + width: 16.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-33 { + width: 16.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-33 { + width: 16.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-33 { + width: 16.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-33 { + width: 16.5rem; + } +} +.w-34 { + width: 17rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-34 { + width: 17rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-34 { + width: 17rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-34 { + width: 17rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-34 { + width: 17rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-34 { + width: 17rem; + } +} +.w-35 { + width: 17.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-35 { + width: 17.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-35 { + width: 17.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-35 { + width: 17.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-35 { + width: 17.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-35 { + width: 17.5rem; + } +} +.w-36 { + width: 18rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-36 { + width: 18rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-36 { + width: 18rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-36 { + width: 18rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-36 { + width: 18rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-36 { + width: 18rem; + } +} +.w-37 { + width: 18.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-37 { + width: 18.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-37 { + width: 18.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-37 { + width: 18.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-37 { + width: 18.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-37 { + width: 18.5rem; + } +} +.w-38 { + width: 19rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-38 { + width: 19rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-38 { + width: 19rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-38 { + width: 19rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-38 { + width: 19rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-38 { + width: 19rem; + } +} +.w-39 { + width: 19.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-39 { + width: 19.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-39 { + width: 19.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-39 { + width: 19.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-39 { + width: 19.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-39 { + width: 19.5rem; + } +} +.w-40 { + width: 20rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-40 { + width: 20rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-40 { + width: 20rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-40 { + width: 20rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-40 { + width: 20rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-40 { + width: 20rem; + } +} +.w-41 { + width: 20.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-41 { + width: 20.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-41 { + width: 20.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-41 { + width: 20.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-41 { + width: 20.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-41 { + width: 20.5rem; + } +} +.w-42 { + width: 21rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-42 { + width: 21rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-42 { + width: 21rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-42 { + width: 21rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-42 { + width: 21rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-42 { + width: 21rem; + } +} +.w-43 { + width: 21.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-43 { + width: 21.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-43 { + width: 21.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-43 { + width: 21.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-43 { + width: 21.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-43 { + width: 21.5rem; + } +} +.w-44 { + width: 22rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-44 { + width: 22rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-44 { + width: 22rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-44 { + width: 22rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-44 { + width: 22rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-44 { + width: 22rem; + } +} +.w-45 { + width: 22.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-45 { + width: 22.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-45 { + width: 22.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-45 { + width: 22.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-45 { + width: 22.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-45 { + width: 22.5rem; + } +} +.w-46 { + width: 23rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-46 { + width: 23rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-46 { + width: 23rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-46 { + width: 23rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-46 { + width: 23rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-46 { + width: 23rem; + } +} +.w-47 { + width: 23.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-47 { + width: 23.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-47 { + width: 23.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-47 { + width: 23.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-47 { + width: 23.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-47 { + width: 23.5rem; + } +} +.w-48 { + width: 24rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-48 { + width: 24rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-48 { + width: 24rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-48 { + width: 24rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-48 { + width: 24rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-48 { + width: 24rem; + } +} +.w-49 { + width: 24.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-49 { + width: 24.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-49 { + width: 24.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-49 { + width: 24.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-49 { + width: 24.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-49 { + width: 24.5rem; + } +} +.w-50 { + width: 25rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-50 { + width: 25rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-50 { + width: 25rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-50 { + width: 25rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-50 { + width: 25rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-50 { + width: 25rem; + } +} +.w-51 { + width: 25.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-51 { + width: 25.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-51 { + width: 25.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-51 { + width: 25.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-51 { + width: 25.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-51 { + width: 25.5rem; + } +} +.w-52 { + width: 26rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-52 { + width: 26rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-52 { + width: 26rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-52 { + width: 26rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-52 { + width: 26rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-52 { + width: 26rem; + } +} +.w-53 { + width: 26.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-53 { + width: 26.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-53 { + width: 26.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-53 { + width: 26.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-53 { + width: 26.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-53 { + width: 26.5rem; + } +} +.w-54 { + width: 27rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-54 { + width: 27rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-54 { + width: 27rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-54 { + width: 27rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-54 { + width: 27rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-54 { + width: 27rem; + } +} +.w-55 { + width: 27.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-55 { + width: 27.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-55 { + width: 27.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-55 { + width: 27.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-55 { + width: 27.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-55 { + width: 27.5rem; + } +} +.w-56 { + width: 28rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-56 { + width: 28rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-56 { + width: 28rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-56 { + width: 28rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-56 { + width: 28rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-56 { + width: 28rem; + } +} +.w-57 { + width: 28.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-57 { + width: 28.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-57 { + width: 28.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-57 { + width: 28.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-57 { + width: 28.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-57 { + width: 28.5rem; + } +} +.w-58 { + width: 29rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-58 { + width: 29rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-58 { + width: 29rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-58 { + width: 29rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-58 { + width: 29rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-58 { + width: 29rem; + } +} +.w-59 { + width: 29.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-59 { + width: 29.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-59 { + width: 29.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-59 { + width: 29.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-59 { + width: 29.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-59 { + width: 29.5rem; + } +} +.w-60 { + width: 30rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-60 { + width: 30rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-60 { + width: 30rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-60 { + width: 30rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-60 { + width: 30rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-60 { + width: 30rem; + } +} +.w-61 { + width: 30.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-61 { + width: 30.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-61 { + width: 30.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-61 { + width: 30.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-61 { + width: 30.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-61 { + width: 30.5rem; + } +} +.w-62 { + width: 31rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-62 { + width: 31rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-62 { + width: 31rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-62 { + width: 31rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-62 { + width: 31rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-62 { + width: 31rem; + } +} +.w-63 { + width: 31.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-63 { + width: 31.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-63 { + width: 31.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-63 { + width: 31.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-63 { + width: 31.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-63 { + width: 31.5rem; + } +} +.w-64 { + width: 32rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-64 { + width: 32rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-64 { + width: 32rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-64 { + width: 32rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-64 { + width: 32rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-64 { + width: 32rem; + } +} +.w-65 { + width: 32.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-65 { + width: 32.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-65 { + width: 32.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-65 { + width: 32.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-65 { + width: 32.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-65 { + width: 32.5rem; + } +} +.w-66 { + width: 33rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-66 { + width: 33rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-66 { + width: 33rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-66 { + width: 33rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-66 { + width: 33rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-66 { + width: 33rem; + } +} +.w-67 { + width: 33.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-67 { + width: 33.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-67 { + width: 33.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-67 { + width: 33.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-67 { + width: 33.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-67 { + width: 33.5rem; + } +} +.w-68 { + width: 34rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-68 { + width: 34rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-68 { + width: 34rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-68 { + width: 34rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-68 { + width: 34rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-68 { + width: 34rem; + } +} +.w-69 { + width: 34.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-69 { + width: 34.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-69 { + width: 34.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-69 { + width: 34.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-69 { + width: 34.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-69 { + width: 34.5rem; + } +} +.w-70 { + width: 35rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-70 { + width: 35rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-70 { + width: 35rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-70 { + width: 35rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-70 { + width: 35rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-70 { + width: 35rem; + } +} +.w-71 { + width: 35.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-71 { + width: 35.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-71 { + width: 35.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-71 { + width: 35.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-71 { + width: 35.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-71 { + width: 35.5rem; + } +} +.w-72 { + width: 36rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-72 { + width: 36rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-72 { + width: 36rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-72 { + width: 36rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-72 { + width: 36rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-72 { + width: 36rem; + } +} +.w-73 { + width: 36.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-73 { + width: 36.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-73 { + width: 36.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-73 { + width: 36.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-73 { + width: 36.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-73 { + width: 36.5rem; + } +} +.w-74 { + width: 37rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-74 { + width: 37rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-74 { + width: 37rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-74 { + width: 37rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-74 { + width: 37rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-74 { + width: 37rem; + } +} +.w-75 { + width: 37.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-75 { + width: 37.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-75 { + width: 37.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-75 { + width: 37.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-75 { + width: 37.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-75 { + width: 37.5rem; + } +} +.w-76 { + width: 38rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-76 { + width: 38rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-76 { + width: 38rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-76 { + width: 38rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-76 { + width: 38rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-76 { + width: 38rem; + } +} +.w-77 { + width: 38.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-77 { + width: 38.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-77 { + width: 38.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-77 { + width: 38.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-77 { + width: 38.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-77 { + width: 38.5rem; + } +} +.w-78 { + width: 39rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-78 { + width: 39rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-78 { + width: 39rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-78 { + width: 39rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-78 { + width: 39rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-78 { + width: 39rem; + } +} +.w-79 { + width: 39.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-79 { + width: 39.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-79 { + width: 39.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-79 { + width: 39.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-79 { + width: 39.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-79 { + width: 39.5rem; + } +} +.w-80 { + width: 40rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-80 { + width: 40rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-80 { + width: 40rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-80 { + width: 40rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-80 { + width: 40rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-80 { + width: 40rem; + } +} +.w-81 { + width: 40.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-81 { + width: 40.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-81 { + width: 40.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-81 { + width: 40.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-81 { + width: 40.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-81 { + width: 40.5rem; + } +} +.w-82 { + width: 41rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-82 { + width: 41rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-82 { + width: 41rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-82 { + width: 41rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-82 { + width: 41rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-82 { + width: 41rem; + } +} +.w-83 { + width: 41.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-83 { + width: 41.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-83 { + width: 41.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-83 { + width: 41.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-83 { + width: 41.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-83 { + width: 41.5rem; + } +} +.w-84 { + width: 42rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-84 { + width: 42rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-84 { + width: 42rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-84 { + width: 42rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-84 { + width: 42rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-84 { + width: 42rem; + } +} +.w-85 { + width: 42.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-85 { + width: 42.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-85 { + width: 42.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-85 { + width: 42.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-85 { + width: 42.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-85 { + width: 42.5rem; + } +} +.w-86 { + width: 43rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-86 { + width: 43rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-86 { + width: 43rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-86 { + width: 43rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-86 { + width: 43rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-86 { + width: 43rem; + } +} +.w-87 { + width: 43.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-87 { + width: 43.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-87 { + width: 43.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-87 { + width: 43.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-87 { + width: 43.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-87 { + width: 43.5rem; + } +} +.w-88 { + width: 44rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-88 { + width: 44rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-88 { + width: 44rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-88 { + width: 44rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-88 { + width: 44rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-88 { + width: 44rem; + } +} +.w-89 { + width: 44.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-89 { + width: 44.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-89 { + width: 44.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-89 { + width: 44.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-89 { + width: 44.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-89 { + width: 44.5rem; + } +} +.w-90 { + width: 45rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-90 { + width: 45rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-90 { + width: 45rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-90 { + width: 45rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-90 { + width: 45rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-90 { + width: 45rem; + } +} +.w-91 { + width: 45.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-91 { + width: 45.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-91 { + width: 45.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-91 { + width: 45.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-91 { + width: 45.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-91 { + width: 45.5rem; + } +} +.w-92 { + width: 46rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-92 { + width: 46rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-92 { + width: 46rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-92 { + width: 46rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-92 { + width: 46rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-92 { + width: 46rem; + } +} +.w-93 { + width: 46.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-93 { + width: 46.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-93 { + width: 46.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-93 { + width: 46.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-93 { + width: 46.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-93 { + width: 46.5rem; + } +} +.w-94 { + width: 47rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-94 { + width: 47rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-94 { + width: 47rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-94 { + width: 47rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-94 { + width: 47rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-94 { + width: 47rem; + } +} +.w-95 { + width: 47.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-95 { + width: 47.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-95 { + width: 47.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-95 { + width: 47.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-95 { + width: 47.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-95 { + width: 47.5rem; + } +} +.w-96 { + width: 48rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-96 { + width: 48rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-96 { + width: 48rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-96 { + width: 48rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-96 { + width: 48rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-96 { + width: 48rem; + } +} +.w-97 { + width: 48.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-97 { + width: 48.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-97 { + width: 48.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-97 { + width: 48.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-97 { + width: 48.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-97 { + width: 48.5rem; + } +} +.w-98 { + width: 49rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-98 { + width: 49rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-98 { + width: 49rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-98 { + width: 49rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-98 { + width: 49rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-98 { + width: 49rem; + } +} +.w-99 { + width: 49.5rem; +} + +@media only screen and (min-width: 576px) { + .w-xs-99 { + width: 49.5rem; + } +} +@media only screen and (min-width: 768px) { + .w-sm-99 { + width: 49.5rem; + } +} +@media only screen and (min-width: 992px) { + .w-md-99 { + width: 49.5rem; + } +} +@media only screen and (min-width: 1200px) { + .w-lg-99 { + width: 49.5rem; + } +} +@media only screen and (min-width: 1600px) { + .w-xlg-99 { + width: 49.5rem; + } +} +.h-1 { + height: 0.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-1 { + height: 0.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-1 { + height: 0.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-1 { + height: 0.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-1 { + height: 0.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-1 { + height: 0.5rem; + } +} +.h-2 { + height: 1rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-2 { + height: 1rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-2 { + height: 1rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-2 { + height: 1rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-2 { + height: 1rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-2 { + height: 1rem; + } +} +.h-3 { + height: 1.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-3 { + height: 1.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-3 { + height: 1.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-3 { + height: 1.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-3 { + height: 1.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-3 { + height: 1.5rem; + } +} +.h-4 { + height: 2rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-4 { + height: 2rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-4 { + height: 2rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-4 { + height: 2rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-4 { + height: 2rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-4 { + height: 2rem; + } +} +.h-5 { + height: 2.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-5 { + height: 2.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-5 { + height: 2.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-5 { + height: 2.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-5 { + height: 2.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-5 { + height: 2.5rem; + } +} +.h-6 { + height: 3rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-6 { + height: 3rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-6 { + height: 3rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-6 { + height: 3rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-6 { + height: 3rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-6 { + height: 3rem; + } +} +.h-7 { + height: 3.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-7 { + height: 3.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-7 { + height: 3.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-7 { + height: 3.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-7 { + height: 3.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-7 { + height: 3.5rem; + } +} +.h-8 { + height: 4rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-8 { + height: 4rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-8 { + height: 4rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-8 { + height: 4rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-8 { + height: 4rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-8 { + height: 4rem; + } +} +.h-9 { + height: 4.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-9 { + height: 4.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-9 { + height: 4.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-9 { + height: 4.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-9 { + height: 4.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-9 { + height: 4.5rem; + } +} +.h-10 { + height: 5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-10 { + height: 5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-10 { + height: 5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-10 { + height: 5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-10 { + height: 5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-10 { + height: 5rem; + } +} +.h-11 { + height: 5.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-11 { + height: 5.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-11 { + height: 5.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-11 { + height: 5.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-11 { + height: 5.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-11 { + height: 5.5rem; + } +} +.h-12 { + height: 6rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-12 { + height: 6rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-12 { + height: 6rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-12 { + height: 6rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-12 { + height: 6rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-12 { + height: 6rem; + } +} +.h-13 { + height: 6.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-13 { + height: 6.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-13 { + height: 6.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-13 { + height: 6.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-13 { + height: 6.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-13 { + height: 6.5rem; + } +} +.h-14 { + height: 7rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-14 { + height: 7rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-14 { + height: 7rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-14 { + height: 7rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-14 { + height: 7rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-14 { + height: 7rem; + } +} +.h-15 { + height: 7.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-15 { + height: 7.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-15 { + height: 7.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-15 { + height: 7.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-15 { + height: 7.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-15 { + height: 7.5rem; + } +} +.h-16 { + height: 8rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-16 { + height: 8rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-16 { + height: 8rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-16 { + height: 8rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-16 { + height: 8rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-16 { + height: 8rem; + } +} +.h-17 { + height: 8.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-17 { + height: 8.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-17 { + height: 8.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-17 { + height: 8.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-17 { + height: 8.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-17 { + height: 8.5rem; + } +} +.h-18 { + height: 9rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-18 { + height: 9rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-18 { + height: 9rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-18 { + height: 9rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-18 { + height: 9rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-18 { + height: 9rem; + } +} +.h-19 { + height: 9.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-19 { + height: 9.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-19 { + height: 9.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-19 { + height: 9.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-19 { + height: 9.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-19 { + height: 9.5rem; + } +} +.h-20 { + height: 10rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-20 { + height: 10rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-20 { + height: 10rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-20 { + height: 10rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-20 { + height: 10rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-20 { + height: 10rem; + } +} +.h-21 { + height: 10.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-21 { + height: 10.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-21 { + height: 10.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-21 { + height: 10.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-21 { + height: 10.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-21 { + height: 10.5rem; + } +} +.h-22 { + height: 11rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-22 { + height: 11rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-22 { + height: 11rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-22 { + height: 11rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-22 { + height: 11rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-22 { + height: 11rem; + } +} +.h-23 { + height: 11.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-23 { + height: 11.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-23 { + height: 11.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-23 { + height: 11.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-23 { + height: 11.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-23 { + height: 11.5rem; + } +} +.h-24 { + height: 12rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-24 { + height: 12rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-24 { + height: 12rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-24 { + height: 12rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-24 { + height: 12rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-24 { + height: 12rem; + } +} +.h-25 { + height: 12.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-25 { + height: 12.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-25 { + height: 12.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-25 { + height: 12.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-25 { + height: 12.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-25 { + height: 12.5rem; + } +} +.h-26 { + height: 13rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-26 { + height: 13rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-26 { + height: 13rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-26 { + height: 13rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-26 { + height: 13rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-26 { + height: 13rem; + } +} +.h-27 { + height: 13.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-27 { + height: 13.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-27 { + height: 13.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-27 { + height: 13.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-27 { + height: 13.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-27 { + height: 13.5rem; + } +} +.h-28 { + height: 14rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-28 { + height: 14rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-28 { + height: 14rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-28 { + height: 14rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-28 { + height: 14rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-28 { + height: 14rem; + } +} +.h-29 { + height: 14.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-29 { + height: 14.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-29 { + height: 14.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-29 { + height: 14.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-29 { + height: 14.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-29 { + height: 14.5rem; + } +} +.h-30 { + height: 15rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-30 { + height: 15rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-30 { + height: 15rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-30 { + height: 15rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-30 { + height: 15rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-30 { + height: 15rem; + } +} +.h-31 { + height: 15.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-31 { + height: 15.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-31 { + height: 15.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-31 { + height: 15.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-31 { + height: 15.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-31 { + height: 15.5rem; + } +} +.h-32 { + height: 16rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-32 { + height: 16rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-32 { + height: 16rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-32 { + height: 16rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-32 { + height: 16rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-32 { + height: 16rem; + } +} +.h-33 { + height: 16.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-33 { + height: 16.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-33 { + height: 16.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-33 { + height: 16.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-33 { + height: 16.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-33 { + height: 16.5rem; + } +} +.h-34 { + height: 17rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-34 { + height: 17rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-34 { + height: 17rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-34 { + height: 17rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-34 { + height: 17rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-34 { + height: 17rem; + } +} +.h-35 { + height: 17.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-35 { + height: 17.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-35 { + height: 17.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-35 { + height: 17.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-35 { + height: 17.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-35 { + height: 17.5rem; + } +} +.h-36 { + height: 18rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-36 { + height: 18rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-36 { + height: 18rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-36 { + height: 18rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-36 { + height: 18rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-36 { + height: 18rem; + } +} +.h-37 { + height: 18.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-37 { + height: 18.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-37 { + height: 18.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-37 { + height: 18.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-37 { + height: 18.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-37 { + height: 18.5rem; + } +} +.h-38 { + height: 19rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-38 { + height: 19rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-38 { + height: 19rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-38 { + height: 19rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-38 { + height: 19rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-38 { + height: 19rem; + } +} +.h-39 { + height: 19.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-39 { + height: 19.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-39 { + height: 19.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-39 { + height: 19.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-39 { + height: 19.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-39 { + height: 19.5rem; + } +} +.h-40 { + height: 20rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-40 { + height: 20rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-40 { + height: 20rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-40 { + height: 20rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-40 { + height: 20rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-40 { + height: 20rem; + } +} +.h-41 { + height: 20.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-41 { + height: 20.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-41 { + height: 20.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-41 { + height: 20.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-41 { + height: 20.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-41 { + height: 20.5rem; + } +} +.h-42 { + height: 21rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-42 { + height: 21rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-42 { + height: 21rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-42 { + height: 21rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-42 { + height: 21rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-42 { + height: 21rem; + } +} +.h-43 { + height: 21.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-43 { + height: 21.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-43 { + height: 21.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-43 { + height: 21.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-43 { + height: 21.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-43 { + height: 21.5rem; + } +} +.h-44 { + height: 22rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-44 { + height: 22rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-44 { + height: 22rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-44 { + height: 22rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-44 { + height: 22rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-44 { + height: 22rem; + } +} +.h-45 { + height: 22.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-45 { + height: 22.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-45 { + height: 22.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-45 { + height: 22.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-45 { + height: 22.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-45 { + height: 22.5rem; + } +} +.h-46 { + height: 23rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-46 { + height: 23rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-46 { + height: 23rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-46 { + height: 23rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-46 { + height: 23rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-46 { + height: 23rem; + } +} +.h-47 { + height: 23.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-47 { + height: 23.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-47 { + height: 23.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-47 { + height: 23.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-47 { + height: 23.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-47 { + height: 23.5rem; + } +} +.h-48 { + height: 24rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-48 { + height: 24rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-48 { + height: 24rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-48 { + height: 24rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-48 { + height: 24rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-48 { + height: 24rem; + } +} +.h-49 { + height: 24.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-49 { + height: 24.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-49 { + height: 24.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-49 { + height: 24.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-49 { + height: 24.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-49 { + height: 24.5rem; + } +} +.h-50 { + height: 25rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-50 { + height: 25rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-50 { + height: 25rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-50 { + height: 25rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-50 { + height: 25rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-50 { + height: 25rem; + } +} +.h-51 { + height: 25.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-51 { + height: 25.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-51 { + height: 25.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-51 { + height: 25.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-51 { + height: 25.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-51 { + height: 25.5rem; + } +} +.h-52 { + height: 26rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-52 { + height: 26rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-52 { + height: 26rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-52 { + height: 26rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-52 { + height: 26rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-52 { + height: 26rem; + } +} +.h-53 { + height: 26.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-53 { + height: 26.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-53 { + height: 26.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-53 { + height: 26.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-53 { + height: 26.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-53 { + height: 26.5rem; + } +} +.h-54 { + height: 27rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-54 { + height: 27rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-54 { + height: 27rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-54 { + height: 27rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-54 { + height: 27rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-54 { + height: 27rem; + } +} +.h-55 { + height: 27.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-55 { + height: 27.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-55 { + height: 27.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-55 { + height: 27.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-55 { + height: 27.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-55 { + height: 27.5rem; + } +} +.h-56 { + height: 28rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-56 { + height: 28rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-56 { + height: 28rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-56 { + height: 28rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-56 { + height: 28rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-56 { + height: 28rem; + } +} +.h-57 { + height: 28.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-57 { + height: 28.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-57 { + height: 28.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-57 { + height: 28.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-57 { + height: 28.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-57 { + height: 28.5rem; + } +} +.h-58 { + height: 29rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-58 { + height: 29rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-58 { + height: 29rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-58 { + height: 29rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-58 { + height: 29rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-58 { + height: 29rem; + } +} +.h-59 { + height: 29.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-59 { + height: 29.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-59 { + height: 29.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-59 { + height: 29.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-59 { + height: 29.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-59 { + height: 29.5rem; + } +} +.h-60 { + height: 30rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-60 { + height: 30rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-60 { + height: 30rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-60 { + height: 30rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-60 { + height: 30rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-60 { + height: 30rem; + } +} +.h-61 { + height: 30.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-61 { + height: 30.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-61 { + height: 30.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-61 { + height: 30.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-61 { + height: 30.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-61 { + height: 30.5rem; + } +} +.h-62 { + height: 31rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-62 { + height: 31rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-62 { + height: 31rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-62 { + height: 31rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-62 { + height: 31rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-62 { + height: 31rem; + } +} +.h-63 { + height: 31.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-63 { + height: 31.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-63 { + height: 31.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-63 { + height: 31.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-63 { + height: 31.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-63 { + height: 31.5rem; + } +} +.h-64 { + height: 32rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-64 { + height: 32rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-64 { + height: 32rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-64 { + height: 32rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-64 { + height: 32rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-64 { + height: 32rem; + } +} +.h-65 { + height: 32.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-65 { + height: 32.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-65 { + height: 32.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-65 { + height: 32.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-65 { + height: 32.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-65 { + height: 32.5rem; + } +} +.h-66 { + height: 33rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-66 { + height: 33rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-66 { + height: 33rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-66 { + height: 33rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-66 { + height: 33rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-66 { + height: 33rem; + } +} +.h-67 { + height: 33.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-67 { + height: 33.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-67 { + height: 33.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-67 { + height: 33.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-67 { + height: 33.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-67 { + height: 33.5rem; + } +} +.h-68 { + height: 34rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-68 { + height: 34rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-68 { + height: 34rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-68 { + height: 34rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-68 { + height: 34rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-68 { + height: 34rem; + } +} +.h-69 { + height: 34.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-69 { + height: 34.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-69 { + height: 34.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-69 { + height: 34.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-69 { + height: 34.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-69 { + height: 34.5rem; + } +} +.h-70 { + height: 35rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-70 { + height: 35rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-70 { + height: 35rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-70 { + height: 35rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-70 { + height: 35rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-70 { + height: 35rem; + } +} +.h-71 { + height: 35.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-71 { + height: 35.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-71 { + height: 35.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-71 { + height: 35.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-71 { + height: 35.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-71 { + height: 35.5rem; + } +} +.h-72 { + height: 36rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-72 { + height: 36rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-72 { + height: 36rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-72 { + height: 36rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-72 { + height: 36rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-72 { + height: 36rem; + } +} +.h-73 { + height: 36.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-73 { + height: 36.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-73 { + height: 36.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-73 { + height: 36.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-73 { + height: 36.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-73 { + height: 36.5rem; + } +} +.h-74 { + height: 37rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-74 { + height: 37rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-74 { + height: 37rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-74 { + height: 37rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-74 { + height: 37rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-74 { + height: 37rem; + } +} +.h-75 { + height: 37.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-75 { + height: 37.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-75 { + height: 37.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-75 { + height: 37.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-75 { + height: 37.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-75 { + height: 37.5rem; + } +} +.h-76 { + height: 38rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-76 { + height: 38rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-76 { + height: 38rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-76 { + height: 38rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-76 { + height: 38rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-76 { + height: 38rem; + } +} +.h-77 { + height: 38.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-77 { + height: 38.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-77 { + height: 38.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-77 { + height: 38.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-77 { + height: 38.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-77 { + height: 38.5rem; + } +} +.h-78 { + height: 39rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-78 { + height: 39rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-78 { + height: 39rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-78 { + height: 39rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-78 { + height: 39rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-78 { + height: 39rem; + } +} +.h-79 { + height: 39.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-79 { + height: 39.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-79 { + height: 39.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-79 { + height: 39.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-79 { + height: 39.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-79 { + height: 39.5rem; + } +} +.h-80 { + height: 40rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-80 { + height: 40rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-80 { + height: 40rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-80 { + height: 40rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-80 { + height: 40rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-80 { + height: 40rem; + } +} +.h-81 { + height: 40.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-81 { + height: 40.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-81 { + height: 40.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-81 { + height: 40.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-81 { + height: 40.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-81 { + height: 40.5rem; + } +} +.h-82 { + height: 41rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-82 { + height: 41rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-82 { + height: 41rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-82 { + height: 41rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-82 { + height: 41rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-82 { + height: 41rem; + } +} +.h-83 { + height: 41.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-83 { + height: 41.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-83 { + height: 41.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-83 { + height: 41.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-83 { + height: 41.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-83 { + height: 41.5rem; + } +} +.h-84 { + height: 42rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-84 { + height: 42rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-84 { + height: 42rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-84 { + height: 42rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-84 { + height: 42rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-84 { + height: 42rem; + } +} +.h-85 { + height: 42.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-85 { + height: 42.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-85 { + height: 42.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-85 { + height: 42.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-85 { + height: 42.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-85 { + height: 42.5rem; + } +} +.h-86 { + height: 43rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-86 { + height: 43rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-86 { + height: 43rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-86 { + height: 43rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-86 { + height: 43rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-86 { + height: 43rem; + } +} +.h-87 { + height: 43.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-87 { + height: 43.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-87 { + height: 43.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-87 { + height: 43.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-87 { + height: 43.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-87 { + height: 43.5rem; + } +} +.h-88 { + height: 44rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-88 { + height: 44rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-88 { + height: 44rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-88 { + height: 44rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-88 { + height: 44rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-88 { + height: 44rem; + } +} +.h-89 { + height: 44.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-89 { + height: 44.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-89 { + height: 44.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-89 { + height: 44.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-89 { + height: 44.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-89 { + height: 44.5rem; + } +} +.h-90 { + height: 45rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-90 { + height: 45rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-90 { + height: 45rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-90 { + height: 45rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-90 { + height: 45rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-90 { + height: 45rem; + } +} +.h-91 { + height: 45.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-91 { + height: 45.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-91 { + height: 45.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-91 { + height: 45.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-91 { + height: 45.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-91 { + height: 45.5rem; + } +} +.h-92 { + height: 46rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-92 { + height: 46rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-92 { + height: 46rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-92 { + height: 46rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-92 { + height: 46rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-92 { + height: 46rem; + } +} +.h-93 { + height: 46.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-93 { + height: 46.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-93 { + height: 46.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-93 { + height: 46.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-93 { + height: 46.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-93 { + height: 46.5rem; + } +} +.h-94 { + height: 47rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-94 { + height: 47rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-94 { + height: 47rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-94 { + height: 47rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-94 { + height: 47rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-94 { + height: 47rem; + } +} +.h-95 { + height: 47.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-95 { + height: 47.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-95 { + height: 47.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-95 { + height: 47.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-95 { + height: 47.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-95 { + height: 47.5rem; + } +} +.h-96 { + height: 48rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-96 { + height: 48rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-96 { + height: 48rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-96 { + height: 48rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-96 { + height: 48rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-96 { + height: 48rem; + } +} +.h-97 { + height: 48.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-97 { + height: 48.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-97 { + height: 48.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-97 { + height: 48.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-97 { + height: 48.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-97 { + height: 48.5rem; + } +} +.h-98 { + height: 49rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-98 { + height: 49rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-98 { + height: 49rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-98 { + height: 49rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-98 { + height: 49rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-98 { + height: 49rem; + } +} +.h-99 { + height: 49.5rem; +} + +@media only screen and (min-width: 576px) { + .h-xs-99 { + height: 49.5rem; + } +} +@media only screen and (min-width: 768px) { + .h-sm-99 { + height: 49.5rem; + } +} +@media only screen and (min-width: 992px) { + .h-md-99 { + height: 49.5rem; + } +} +@media only screen and (min-width: 1200px) { + .h-lg-99 { + height: 49.5rem; + } +} +@media only screen and (min-width: 1600px) { + .h-xlg-99 { + height: 49.5rem; + } +} +/** + * Spacing + * + * creates margin and padding for each direction and for each breakpont + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +/** + * mixin: spacing for single padding or margin + * + * + */ +/** + * mixin: spacing for each breakpoint + * + * + */ +/** + * + * + * + */ +.marginless { + margin: 0; +} + +.paddingless { + padding: 0; +} + +.m-last-child-0 > *:last-child { + margin: 0; +} + +.m-top-last-child-0 > *:last-child { + margin-top: 0; +} + +.m-bottom-last-child-0 > *:last-child { + margin-bottom: 0; +} + +.m-0 { + margin: 0; +} + +.m-1 { + margin: 1px; +} + +.m-2 { + margin: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .m-xs-2 { + margin: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-sm-2 { + margin: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-md-2 { + margin: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-lg-2 { + margin: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-xlg-2 { + margin: 0.125rem; + } +} +.m-3 { + margin: 0.5rem; +} + +@media only screen and (min-width: 576px) { + .m-xs-3 { + margin: 0.5rem; + } +} +@media only screen and (min-width: 768px) { + .m-sm-3 { + margin: 0.5rem; + } +} +@media only screen and (min-width: 992px) { + .m-md-3 { + margin: 0.5rem; + } +} +@media only screen and (min-width: 1200px) { + .m-lg-3 { + margin: 0.5rem; + } +} +@media only screen and (min-width: 1600px) { + .m-xlg-3 { + margin: 0.5rem; + } +} +.m-4 { + margin: 1.125rem; +} + +@media only screen and (min-width: 576px) { + .m-xs-4 { + margin: 1.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-sm-4 { + margin: 1.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-md-4 { + margin: 1.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-lg-4 { + margin: 1.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-xlg-4 { + margin: 1.125rem; + } +} +.m-5 { + margin: 2rem; +} + +@media only screen and (min-width: 576px) { + .m-xs-5 { + margin: 2rem; + } +} +@media only screen and (min-width: 768px) { + .m-sm-5 { + margin: 2rem; + } +} +@media only screen and (min-width: 992px) { + .m-md-5 { + margin: 2rem; + } +} +@media only screen and (min-width: 1200px) { + .m-lg-5 { + margin: 2rem; + } +} +@media only screen and (min-width: 1600px) { + .m-xlg-5 { + margin: 2rem; + } +} +.m-6 { + margin: 3.125rem; +} + +@media only screen and (min-width: 576px) { + .m-xs-6 { + margin: 3.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-sm-6 { + margin: 3.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-md-6 { + margin: 3.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-lg-6 { + margin: 3.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-xlg-6 { + margin: 3.125rem; + } +} +.m-7 { + margin: 4.5rem; +} + +@media only screen and (min-width: 576px) { + .m-xs-7 { + margin: 4.5rem; + } +} +@media only screen and (min-width: 768px) { + .m-sm-7 { + margin: 4.5rem; + } +} +@media only screen and (min-width: 992px) { + .m-md-7 { + margin: 4.5rem; + } +} +@media only screen and (min-width: 1200px) { + .m-lg-7 { + margin: 4.5rem; + } +} +@media only screen and (min-width: 1600px) { + .m-xlg-7 { + margin: 4.5rem; + } +} +.m-8 { + margin: 6.125rem; +} + +@media only screen and (min-width: 576px) { + .m-xs-8 { + margin: 6.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-sm-8 { + margin: 6.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-md-8 { + margin: 6.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-lg-8 { + margin: 6.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-xlg-8 { + margin: 6.125rem; + } +} +.m-9 { + margin: 8rem; +} + +@media only screen and (min-width: 576px) { + .m-xs-9 { + margin: 8rem; + } +} +@media only screen and (min-width: 768px) { + .m-sm-9 { + margin: 8rem; + } +} +@media only screen and (min-width: 992px) { + .m-md-9 { + margin: 8rem; + } +} +@media only screen and (min-width: 1200px) { + .m-lg-9 { + margin: 8rem; + } +} +@media only screen and (min-width: 1600px) { + .m-xlg-9 { + margin: 8rem; + } +} +.m-10 { + margin: 10.125rem; +} + +@media only screen and (min-width: 576px) { + .m-xs-10 { + margin: 10.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-sm-10 { + margin: 10.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-md-10 { + margin: 10.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-lg-10 { + margin: 10.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-xlg-10 { + margin: 10.125rem; + } +} +.m-top-0 { + margin-top: 0; +} + +@media only screen and (min-width: 576px) { + .m-top-xs-0 { + margin-top: 0; + } +} +@media only screen and (min-width: 768px) { + .m-top-sm-0 { + margin-top: 0; + } +} +@media only screen and (min-width: 992px) { + .m-top-md-0 { + margin-top: 0; + } +} +@media only screen and (min-width: 1200px) { + .m-top-lg-0 { + margin-top: 0; + } +} +@media only screen and (min-width: 1600px) { + .m-top-xlg-0 { + margin-top: 0; + } +} +.m-top-1 { + margin-top: 1px; +} + +@media only screen and (min-width: 576px) { + .m-top-xs-1 { + margin-top: 1px; + } +} +@media only screen and (min-width: 768px) { + .m-top-sm-1 { + margin-top: 1px; + } +} +@media only screen and (min-width: 992px) { + .m-top-md-1 { + margin-top: 1px; + } +} +@media only screen and (min-width: 1200px) { + .m-top-lg-1 { + margin-top: 1px; + } +} +@media only screen and (min-width: 1600px) { + .m-top-xlg-1 { + margin-top: 1px; + } +} +.m-top-2 { + margin-top: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .m-top-xs-2 { + margin-top: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-top-sm-2 { + margin-top: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-top-md-2 { + margin-top: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-top-lg-2 { + margin-top: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-top-xlg-2 { + margin-top: 0.125rem; + } +} +.m-top-3 { + margin-top: 0.5rem; +} + +@media only screen and (min-width: 576px) { + .m-top-xs-3 { + margin-top: 0.5rem; + } +} +@media only screen and (min-width: 768px) { + .m-top-sm-3 { + margin-top: 0.5rem; + } +} +@media only screen and (min-width: 992px) { + .m-top-md-3 { + margin-top: 0.5rem; + } +} +@media only screen and (min-width: 1200px) { + .m-top-lg-3 { + margin-top: 0.5rem; + } +} +@media only screen and (min-width: 1600px) { + .m-top-xlg-3 { + margin-top: 0.5rem; + } +} +.m-top-4 { + margin-top: 1.125rem; +} + +@media only screen and (min-width: 576px) { + .m-top-xs-4 { + margin-top: 1.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-top-sm-4 { + margin-top: 1.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-top-md-4 { + margin-top: 1.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-top-lg-4 { + margin-top: 1.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-top-xlg-4 { + margin-top: 1.125rem; + } +} +.m-top-5 { + margin-top: 2rem; +} + +@media only screen and (min-width: 576px) { + .m-top-xs-5 { + margin-top: 2rem; + } +} +@media only screen and (min-width: 768px) { + .m-top-sm-5 { + margin-top: 2rem; + } +} +@media only screen and (min-width: 992px) { + .m-top-md-5 { + margin-top: 2rem; + } +} +@media only screen and (min-width: 1200px) { + .m-top-lg-5 { + margin-top: 2rem; + } +} +@media only screen and (min-width: 1600px) { + .m-top-xlg-5 { + margin-top: 2rem; + } +} +.m-top-6 { + margin-top: 3.125rem; +} + +@media only screen and (min-width: 576px) { + .m-top-xs-6 { + margin-top: 3.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-top-sm-6 { + margin-top: 3.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-top-md-6 { + margin-top: 3.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-top-lg-6 { + margin-top: 3.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-top-xlg-6 { + margin-top: 3.125rem; + } +} +.m-top-7 { + margin-top: 4.5rem; +} + +@media only screen and (min-width: 576px) { + .m-top-xs-7 { + margin-top: 4.5rem; + } +} +@media only screen and (min-width: 768px) { + .m-top-sm-7 { + margin-top: 4.5rem; + } +} +@media only screen and (min-width: 992px) { + .m-top-md-7 { + margin-top: 4.5rem; + } +} +@media only screen and (min-width: 1200px) { + .m-top-lg-7 { + margin-top: 4.5rem; + } +} +@media only screen and (min-width: 1600px) { + .m-top-xlg-7 { + margin-top: 4.5rem; + } +} +.m-top-8 { + margin-top: 6.125rem; +} + +@media only screen and (min-width: 576px) { + .m-top-xs-8 { + margin-top: 6.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-top-sm-8 { + margin-top: 6.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-top-md-8 { + margin-top: 6.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-top-lg-8 { + margin-top: 6.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-top-xlg-8 { + margin-top: 6.125rem; + } +} +.m-top-9 { + margin-top: 8rem; +} + +@media only screen and (min-width: 576px) { + .m-top-xs-9 { + margin-top: 8rem; + } +} +@media only screen and (min-width: 768px) { + .m-top-sm-9 { + margin-top: 8rem; + } +} +@media only screen and (min-width: 992px) { + .m-top-md-9 { + margin-top: 8rem; + } +} +@media only screen and (min-width: 1200px) { + .m-top-lg-9 { + margin-top: 8rem; + } +} +@media only screen and (min-width: 1600px) { + .m-top-xlg-9 { + margin-top: 8rem; + } +} +.m-top-10 { + margin-top: 10.125rem; +} + +@media only screen and (min-width: 576px) { + .m-top-xs-10 { + margin-top: 10.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-top-sm-10 { + margin-top: 10.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-top-md-10 { + margin-top: 10.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-top-lg-10 { + margin-top: 10.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-top-xlg-10 { + margin-top: 10.125rem; + } +} +.m-bottom-0 { + margin-bottom: 0; +} + +@media only screen and (min-width: 576px) { + .m-bottom-xs-0 { + margin-bottom: 0; + } +} +@media only screen and (min-width: 768px) { + .m-bottom-sm-0 { + margin-bottom: 0; + } +} +@media only screen and (min-width: 992px) { + .m-bottom-md-0 { + margin-bottom: 0; + } +} +@media only screen and (min-width: 1200px) { + .m-bottom-lg-0 { + margin-bottom: 0; + } +} +@media only screen and (min-width: 1600px) { + .m-bottom-xlg-0 { + margin-bottom: 0; + } +} +.m-bottom-1 { + margin-bottom: 1px; +} + +@media only screen and (min-width: 576px) { + .m-bottom-xs-1 { + margin-bottom: 1px; + } +} +@media only screen and (min-width: 768px) { + .m-bottom-sm-1 { + margin-bottom: 1px; + } +} +@media only screen and (min-width: 992px) { + .m-bottom-md-1 { + margin-bottom: 1px; + } +} +@media only screen and (min-width: 1200px) { + .m-bottom-lg-1 { + margin-bottom: 1px; + } +} +@media only screen and (min-width: 1600px) { + .m-bottom-xlg-1 { + margin-bottom: 1px; + } +} +.m-bottom-2 { + margin-bottom: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .m-bottom-xs-2 { + margin-bottom: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-bottom-sm-2 { + margin-bottom: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-bottom-md-2 { + margin-bottom: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-bottom-lg-2 { + margin-bottom: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-bottom-xlg-2 { + margin-bottom: 0.125rem; + } +} +.m-bottom-3 { + margin-bottom: 0.5rem; +} + +@media only screen and (min-width: 576px) { + .m-bottom-xs-3 { + margin-bottom: 0.5rem; + } +} +@media only screen and (min-width: 768px) { + .m-bottom-sm-3 { + margin-bottom: 0.5rem; + } +} +@media only screen and (min-width: 992px) { + .m-bottom-md-3 { + margin-bottom: 0.5rem; + } +} +@media only screen and (min-width: 1200px) { + .m-bottom-lg-3 { + margin-bottom: 0.5rem; + } +} +@media only screen and (min-width: 1600px) { + .m-bottom-xlg-3 { + margin-bottom: 0.5rem; + } +} +.m-bottom-4 { + margin-bottom: 1.125rem; +} + +@media only screen and (min-width: 576px) { + .m-bottom-xs-4 { + margin-bottom: 1.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-bottom-sm-4 { + margin-bottom: 1.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-bottom-md-4 { + margin-bottom: 1.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-bottom-lg-4 { + margin-bottom: 1.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-bottom-xlg-4 { + margin-bottom: 1.125rem; + } +} +.m-bottom-5 { + margin-bottom: 2rem; +} + +@media only screen and (min-width: 576px) { + .m-bottom-xs-5 { + margin-bottom: 2rem; + } +} +@media only screen and (min-width: 768px) { + .m-bottom-sm-5 { + margin-bottom: 2rem; + } +} +@media only screen and (min-width: 992px) { + .m-bottom-md-5 { + margin-bottom: 2rem; + } +} +@media only screen and (min-width: 1200px) { + .m-bottom-lg-5 { + margin-bottom: 2rem; + } +} +@media only screen and (min-width: 1600px) { + .m-bottom-xlg-5 { + margin-bottom: 2rem; + } +} +.m-bottom-6 { + margin-bottom: 3.125rem; +} + +@media only screen and (min-width: 576px) { + .m-bottom-xs-6 { + margin-bottom: 3.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-bottom-sm-6 { + margin-bottom: 3.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-bottom-md-6 { + margin-bottom: 3.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-bottom-lg-6 { + margin-bottom: 3.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-bottom-xlg-6 { + margin-bottom: 3.125rem; + } +} +.m-bottom-7 { + margin-bottom: 4.5rem; +} + +@media only screen and (min-width: 576px) { + .m-bottom-xs-7 { + margin-bottom: 4.5rem; + } +} +@media only screen and (min-width: 768px) { + .m-bottom-sm-7 { + margin-bottom: 4.5rem; + } +} +@media only screen and (min-width: 992px) { + .m-bottom-md-7 { + margin-bottom: 4.5rem; + } +} +@media only screen and (min-width: 1200px) { + .m-bottom-lg-7 { + margin-bottom: 4.5rem; + } +} +@media only screen and (min-width: 1600px) { + .m-bottom-xlg-7 { + margin-bottom: 4.5rem; + } +} +.m-bottom-8 { + margin-bottom: 6.125rem; +} + +@media only screen and (min-width: 576px) { + .m-bottom-xs-8 { + margin-bottom: 6.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-bottom-sm-8 { + margin-bottom: 6.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-bottom-md-8 { + margin-bottom: 6.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-bottom-lg-8 { + margin-bottom: 6.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-bottom-xlg-8 { + margin-bottom: 6.125rem; + } +} +.m-bottom-9 { + margin-bottom: 8rem; +} + +@media only screen and (min-width: 576px) { + .m-bottom-xs-9 { + margin-bottom: 8rem; + } +} +@media only screen and (min-width: 768px) { + .m-bottom-sm-9 { + margin-bottom: 8rem; + } +} +@media only screen and (min-width: 992px) { + .m-bottom-md-9 { + margin-bottom: 8rem; + } +} +@media only screen and (min-width: 1200px) { + .m-bottom-lg-9 { + margin-bottom: 8rem; + } +} +@media only screen and (min-width: 1600px) { + .m-bottom-xlg-9 { + margin-bottom: 8rem; + } +} +.m-bottom-10 { + margin-bottom: 10.125rem; +} + +@media only screen and (min-width: 576px) { + .m-bottom-xs-10 { + margin-bottom: 10.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-bottom-sm-10 { + margin-bottom: 10.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-bottom-md-10 { + margin-bottom: 10.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-bottom-lg-10 { + margin-bottom: 10.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-bottom-xlg-10 { + margin-bottom: 10.125rem; + } +} +.m-left-0 { + margin-left: 0; +} + +@media only screen and (min-width: 576px) { + .m-left-xs-0 { + margin-left: 0; + } +} +@media only screen and (min-width: 768px) { + .m-left-sm-0 { + margin-left: 0; + } +} +@media only screen and (min-width: 992px) { + .m-left-md-0 { + margin-left: 0; + } +} +@media only screen and (min-width: 1200px) { + .m-left-lg-0 { + margin-left: 0; + } +} +@media only screen and (min-width: 1600px) { + .m-left-xlg-0 { + margin-left: 0; + } +} +.m-left-1 { + margin-left: 1px; +} + +@media only screen and (min-width: 576px) { + .m-left-xs-1 { + margin-left: 1px; + } +} +@media only screen and (min-width: 768px) { + .m-left-sm-1 { + margin-left: 1px; + } +} +@media only screen and (min-width: 992px) { + .m-left-md-1 { + margin-left: 1px; + } +} +@media only screen and (min-width: 1200px) { + .m-left-lg-1 { + margin-left: 1px; + } +} +@media only screen and (min-width: 1600px) { + .m-left-xlg-1 { + margin-left: 1px; + } +} +.m-left-2 { + margin-left: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .m-left-xs-2 { + margin-left: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-left-sm-2 { + margin-left: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-left-md-2 { + margin-left: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-left-lg-2 { + margin-left: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-left-xlg-2 { + margin-left: 0.125rem; + } +} +.m-left-3 { + margin-left: 0.5rem; +} + +@media only screen and (min-width: 576px) { + .m-left-xs-3 { + margin-left: 0.5rem; + } +} +@media only screen and (min-width: 768px) { + .m-left-sm-3 { + margin-left: 0.5rem; + } +} +@media only screen and (min-width: 992px) { + .m-left-md-3 { + margin-left: 0.5rem; + } +} +@media only screen and (min-width: 1200px) { + .m-left-lg-3 { + margin-left: 0.5rem; + } +} +@media only screen and (min-width: 1600px) { + .m-left-xlg-3 { + margin-left: 0.5rem; + } +} +.m-left-4 { + margin-left: 1.125rem; +} + +@media only screen and (min-width: 576px) { + .m-left-xs-4 { + margin-left: 1.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-left-sm-4 { + margin-left: 1.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-left-md-4 { + margin-left: 1.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-left-lg-4 { + margin-left: 1.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-left-xlg-4 { + margin-left: 1.125rem; + } +} +.m-left-5 { + margin-left: 2rem; +} + +@media only screen and (min-width: 576px) { + .m-left-xs-5 { + margin-left: 2rem; + } +} +@media only screen and (min-width: 768px) { + .m-left-sm-5 { + margin-left: 2rem; + } +} +@media only screen and (min-width: 992px) { + .m-left-md-5 { + margin-left: 2rem; + } +} +@media only screen and (min-width: 1200px) { + .m-left-lg-5 { + margin-left: 2rem; + } +} +@media only screen and (min-width: 1600px) { + .m-left-xlg-5 { + margin-left: 2rem; + } +} +.m-left-6 { + margin-left: 3.125rem; +} + +@media only screen and (min-width: 576px) { + .m-left-xs-6 { + margin-left: 3.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-left-sm-6 { + margin-left: 3.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-left-md-6 { + margin-left: 3.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-left-lg-6 { + margin-left: 3.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-left-xlg-6 { + margin-left: 3.125rem; + } +} +.m-left-7 { + margin-left: 4.5rem; +} + +@media only screen and (min-width: 576px) { + .m-left-xs-7 { + margin-left: 4.5rem; + } +} +@media only screen and (min-width: 768px) { + .m-left-sm-7 { + margin-left: 4.5rem; + } +} +@media only screen and (min-width: 992px) { + .m-left-md-7 { + margin-left: 4.5rem; + } +} +@media only screen and (min-width: 1200px) { + .m-left-lg-7 { + margin-left: 4.5rem; + } +} +@media only screen and (min-width: 1600px) { + .m-left-xlg-7 { + margin-left: 4.5rem; + } +} +.m-left-8 { + margin-left: 6.125rem; +} + +@media only screen and (min-width: 576px) { + .m-left-xs-8 { + margin-left: 6.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-left-sm-8 { + margin-left: 6.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-left-md-8 { + margin-left: 6.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-left-lg-8 { + margin-left: 6.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-left-xlg-8 { + margin-left: 6.125rem; + } +} +.m-left-9 { + margin-left: 8rem; +} + +@media only screen and (min-width: 576px) { + .m-left-xs-9 { + margin-left: 8rem; + } +} +@media only screen and (min-width: 768px) { + .m-left-sm-9 { + margin-left: 8rem; + } +} +@media only screen and (min-width: 992px) { + .m-left-md-9 { + margin-left: 8rem; + } +} +@media only screen and (min-width: 1200px) { + .m-left-lg-9 { + margin-left: 8rem; + } +} +@media only screen and (min-width: 1600px) { + .m-left-xlg-9 { + margin-left: 8rem; + } +} +.m-left-10 { + margin-left: 10.125rem; +} + +@media only screen and (min-width: 576px) { + .m-left-xs-10 { + margin-left: 10.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-left-sm-10 { + margin-left: 10.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-left-md-10 { + margin-left: 10.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-left-lg-10 { + margin-left: 10.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-left-xlg-10 { + margin-left: 10.125rem; + } +} +.m-right-0 { + margin-right: 0; +} + +@media only screen and (min-width: 576px) { + .m-right-xs-0 { + margin-right: 0; + } +} +@media only screen and (min-width: 768px) { + .m-right-sm-0 { + margin-right: 0; + } +} +@media only screen and (min-width: 992px) { + .m-right-md-0 { + margin-right: 0; + } +} +@media only screen and (min-width: 1200px) { + .m-right-lg-0 { + margin-right: 0; + } +} +@media only screen and (min-width: 1600px) { + .m-right-xlg-0 { + margin-right: 0; + } +} +.m-right-1 { + margin-right: 1px; +} + +@media only screen and (min-width: 576px) { + .m-right-xs-1 { + margin-right: 1px; + } +} +@media only screen and (min-width: 768px) { + .m-right-sm-1 { + margin-right: 1px; + } +} +@media only screen and (min-width: 992px) { + .m-right-md-1 { + margin-right: 1px; + } +} +@media only screen and (min-width: 1200px) { + .m-right-lg-1 { + margin-right: 1px; + } +} +@media only screen and (min-width: 1600px) { + .m-right-xlg-1 { + margin-right: 1px; + } +} +.m-right-2 { + margin-right: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .m-right-xs-2 { + margin-right: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-right-sm-2 { + margin-right: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-right-md-2 { + margin-right: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-right-lg-2 { + margin-right: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-right-xlg-2 { + margin-right: 0.125rem; + } +} +.m-right-3 { + margin-right: 0.5rem; +} + +@media only screen and (min-width: 576px) { + .m-right-xs-3 { + margin-right: 0.5rem; + } +} +@media only screen and (min-width: 768px) { + .m-right-sm-3 { + margin-right: 0.5rem; + } +} +@media only screen and (min-width: 992px) { + .m-right-md-3 { + margin-right: 0.5rem; + } +} +@media only screen and (min-width: 1200px) { + .m-right-lg-3 { + margin-right: 0.5rem; + } +} +@media only screen and (min-width: 1600px) { + .m-right-xlg-3 { + margin-right: 0.5rem; + } +} +.m-right-4 { + margin-right: 1.125rem; +} + +@media only screen and (min-width: 576px) { + .m-right-xs-4 { + margin-right: 1.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-right-sm-4 { + margin-right: 1.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-right-md-4 { + margin-right: 1.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-right-lg-4 { + margin-right: 1.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-right-xlg-4 { + margin-right: 1.125rem; + } +} +.m-right-5 { + margin-right: 2rem; +} + +@media only screen and (min-width: 576px) { + .m-right-xs-5 { + margin-right: 2rem; + } +} +@media only screen and (min-width: 768px) { + .m-right-sm-5 { + margin-right: 2rem; + } +} +@media only screen and (min-width: 992px) { + .m-right-md-5 { + margin-right: 2rem; + } +} +@media only screen and (min-width: 1200px) { + .m-right-lg-5 { + margin-right: 2rem; + } +} +@media only screen and (min-width: 1600px) { + .m-right-xlg-5 { + margin-right: 2rem; + } +} +.m-right-6 { + margin-right: 3.125rem; +} + +@media only screen and (min-width: 576px) { + .m-right-xs-6 { + margin-right: 3.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-right-sm-6 { + margin-right: 3.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-right-md-6 { + margin-right: 3.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-right-lg-6 { + margin-right: 3.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-right-xlg-6 { + margin-right: 3.125rem; + } +} +.m-right-7 { + margin-right: 4.5rem; +} + +@media only screen and (min-width: 576px) { + .m-right-xs-7 { + margin-right: 4.5rem; + } +} +@media only screen and (min-width: 768px) { + .m-right-sm-7 { + margin-right: 4.5rem; + } +} +@media only screen and (min-width: 992px) { + .m-right-md-7 { + margin-right: 4.5rem; + } +} +@media only screen and (min-width: 1200px) { + .m-right-lg-7 { + margin-right: 4.5rem; + } +} +@media only screen and (min-width: 1600px) { + .m-right-xlg-7 { + margin-right: 4.5rem; + } +} +.m-right-8 { + margin-right: 6.125rem; +} + +@media only screen and (min-width: 576px) { + .m-right-xs-8 { + margin-right: 6.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-right-sm-8 { + margin-right: 6.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-right-md-8 { + margin-right: 6.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-right-lg-8 { + margin-right: 6.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-right-xlg-8 { + margin-right: 6.125rem; + } +} +.m-right-9 { + margin-right: 8rem; +} + +@media only screen and (min-width: 576px) { + .m-right-xs-9 { + margin-right: 8rem; + } +} +@media only screen and (min-width: 768px) { + .m-right-sm-9 { + margin-right: 8rem; + } +} +@media only screen and (min-width: 992px) { + .m-right-md-9 { + margin-right: 8rem; + } +} +@media only screen and (min-width: 1200px) { + .m-right-lg-9 { + margin-right: 8rem; + } +} +@media only screen and (min-width: 1600px) { + .m-right-xlg-9 { + margin-right: 8rem; + } +} +.m-right-10 { + margin-right: 10.125rem; +} + +@media only screen and (min-width: 576px) { + .m-right-xs-10 { + margin-right: 10.125rem; + } +} +@media only screen and (min-width: 768px) { + .m-right-sm-10 { + margin-right: 10.125rem; + } +} +@media only screen and (min-width: 992px) { + .m-right-md-10 { + margin-right: 10.125rem; + } +} +@media only screen and (min-width: 1200px) { + .m-right-lg-10 { + margin-right: 10.125rem; + } +} +@media only screen and (min-width: 1600px) { + .m-right-xlg-10 { + margin-right: 10.125rem; + } +} +.p-0 { + padding: 0; +} + +.p-1 { + padding: 1px; +} + +.p-0 { + padding: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .p-xs-0 { + padding: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-sm-0 { + padding: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-md-0 { + padding: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-lg-0 { + padding: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-xlg-0 { + padding: 0.125rem; + } +} +.p-1 { + padding: 0rem; +} + +@media only screen and (min-width: 576px) { + .p-xs-1 { + padding: 0rem; + } +} +@media only screen and (min-width: 768px) { + .p-sm-1 { + padding: 0rem; + } +} +@media only screen and (min-width: 992px) { + .p-md-1 { + padding: 0rem; + } +} +@media only screen and (min-width: 1200px) { + .p-lg-1 { + padding: 0rem; + } +} +@media only screen and (min-width: 1600px) { + .p-xlg-1 { + padding: 0rem; + } +} +.p-2 { + padding: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .p-xs-2 { + padding: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-sm-2 { + padding: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-md-2 { + padding: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-lg-2 { + padding: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-xlg-2 { + padding: 0.125rem; + } +} +.p-3 { + padding: 0.5rem; +} + +@media only screen and (min-width: 576px) { + .p-xs-3 { + padding: 0.5rem; + } +} +@media only screen and (min-width: 768px) { + .p-sm-3 { + padding: 0.5rem; + } +} +@media only screen and (min-width: 992px) { + .p-md-3 { + padding: 0.5rem; + } +} +@media only screen and (min-width: 1200px) { + .p-lg-3 { + padding: 0.5rem; + } +} +@media only screen and (min-width: 1600px) { + .p-xlg-3 { + padding: 0.5rem; + } +} +.p-4 { + padding: 1.125rem; +} + +@media only screen and (min-width: 576px) { + .p-xs-4 { + padding: 1.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-sm-4 { + padding: 1.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-md-4 { + padding: 1.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-lg-4 { + padding: 1.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-xlg-4 { + padding: 1.125rem; + } +} +.p-5 { + padding: 2rem; +} + +@media only screen and (min-width: 576px) { + .p-xs-5 { + padding: 2rem; + } +} +@media only screen and (min-width: 768px) { + .p-sm-5 { + padding: 2rem; + } +} +@media only screen and (min-width: 992px) { + .p-md-5 { + padding: 2rem; + } +} +@media only screen and (min-width: 1200px) { + .p-lg-5 { + padding: 2rem; + } +} +@media only screen and (min-width: 1600px) { + .p-xlg-5 { + padding: 2rem; + } +} +.p-6 { + padding: 3.125rem; +} + +@media only screen and (min-width: 576px) { + .p-xs-6 { + padding: 3.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-sm-6 { + padding: 3.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-md-6 { + padding: 3.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-lg-6 { + padding: 3.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-xlg-6 { + padding: 3.125rem; + } +} +.p-7 { + padding: 4.5rem; +} + +@media only screen and (min-width: 576px) { + .p-xs-7 { + padding: 4.5rem; + } +} +@media only screen and (min-width: 768px) { + .p-sm-7 { + padding: 4.5rem; + } +} +@media only screen and (min-width: 992px) { + .p-md-7 { + padding: 4.5rem; + } +} +@media only screen and (min-width: 1200px) { + .p-lg-7 { + padding: 4.5rem; + } +} +@media only screen and (min-width: 1600px) { + .p-xlg-7 { + padding: 4.5rem; + } +} +.p-8 { + padding: 6.125rem; +} + +@media only screen and (min-width: 576px) { + .p-xs-8 { + padding: 6.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-sm-8 { + padding: 6.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-md-8 { + padding: 6.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-lg-8 { + padding: 6.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-xlg-8 { + padding: 6.125rem; + } +} +.p-9 { + padding: 8rem; +} + +@media only screen and (min-width: 576px) { + .p-xs-9 { + padding: 8rem; + } +} +@media only screen and (min-width: 768px) { + .p-sm-9 { + padding: 8rem; + } +} +@media only screen and (min-width: 992px) { + .p-md-9 { + padding: 8rem; + } +} +@media only screen and (min-width: 1200px) { + .p-lg-9 { + padding: 8rem; + } +} +@media only screen and (min-width: 1600px) { + .p-xlg-9 { + padding: 8rem; + } +} +.p-10 { + padding: 10.125rem; +} + +@media only screen and (min-width: 576px) { + .p-xs-10 { + padding: 10.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-sm-10 { + padding: 10.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-md-10 { + padding: 10.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-lg-10 { + padding: 10.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-xlg-10 { + padding: 10.125rem; + } +} +.p-top-0 { + padding-top: 0; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-0 { + padding-top: 0; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-0 { + padding-top: 0; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-0 { + padding-top: 0; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-0 { + padding-top: 0; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-0 { + padding-top: 0; + } +} +.p-top-1 { + padding-top: 1px; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-1 { + padding-top: 1px; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-1 { + padding-top: 1px; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-1 { + padding-top: 1px; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-1 { + padding-top: 1px; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-1 { + padding-top: 1px; + } +} +.p-top-0 { + padding-top: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-0 { + padding-top: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-0 { + padding-top: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-0 { + padding-top: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-0 { + padding-top: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-0 { + padding-top: 0.125rem; + } +} +.p-top-1 { + padding-top: 0rem; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-1 { + padding-top: 0rem; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-1 { + padding-top: 0rem; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-1 { + padding-top: 0rem; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-1 { + padding-top: 0rem; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-1 { + padding-top: 0rem; + } +} +.p-top-2 { + padding-top: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-2 { + padding-top: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-2 { + padding-top: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-2 { + padding-top: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-2 { + padding-top: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-2 { + padding-top: 0.125rem; + } +} +.p-top-3 { + padding-top: 0.5rem; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-3 { + padding-top: 0.5rem; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-3 { + padding-top: 0.5rem; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-3 { + padding-top: 0.5rem; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-3 { + padding-top: 0.5rem; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-3 { + padding-top: 0.5rem; + } +} +.p-top-4 { + padding-top: 1.125rem; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-4 { + padding-top: 1.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-4 { + padding-top: 1.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-4 { + padding-top: 1.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-4 { + padding-top: 1.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-4 { + padding-top: 1.125rem; + } +} +.p-top-5 { + padding-top: 2rem; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-5 { + padding-top: 2rem; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-5 { + padding-top: 2rem; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-5 { + padding-top: 2rem; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-5 { + padding-top: 2rem; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-5 { + padding-top: 2rem; + } +} +.p-top-6 { + padding-top: 3.125rem; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-6 { + padding-top: 3.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-6 { + padding-top: 3.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-6 { + padding-top: 3.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-6 { + padding-top: 3.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-6 { + padding-top: 3.125rem; + } +} +.p-top-7 { + padding-top: 4.5rem; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-7 { + padding-top: 4.5rem; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-7 { + padding-top: 4.5rem; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-7 { + padding-top: 4.5rem; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-7 { + padding-top: 4.5rem; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-7 { + padding-top: 4.5rem; + } +} +.p-top-8 { + padding-top: 6.125rem; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-8 { + padding-top: 6.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-8 { + padding-top: 6.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-8 { + padding-top: 6.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-8 { + padding-top: 6.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-8 { + padding-top: 6.125rem; + } +} +.p-top-9 { + padding-top: 8rem; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-9 { + padding-top: 8rem; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-9 { + padding-top: 8rem; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-9 { + padding-top: 8rem; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-9 { + padding-top: 8rem; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-9 { + padding-top: 8rem; + } +} +.p-top-10 { + padding-top: 10.125rem; +} + +@media only screen and (min-width: 576px) { + .p-top-xs-10 { + padding-top: 10.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-top-sm-10 { + padding-top: 10.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-top-md-10 { + padding-top: 10.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-top-lg-10 { + padding-top: 10.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-top-xlg-10 { + padding-top: 10.125rem; + } +} +.p-bottom-0 { + padding-bottom: 0; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-0 { + padding-bottom: 0; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-0 { + padding-bottom: 0; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-0 { + padding-bottom: 0; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-0 { + padding-bottom: 0; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-0 { + padding-bottom: 0; + } +} +.p-bottom-1 { + padding-bottom: 1px; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-1 { + padding-bottom: 1px; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-1 { + padding-bottom: 1px; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-1 { + padding-bottom: 1px; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-1 { + padding-bottom: 1px; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-1 { + padding-bottom: 1px; + } +} +.p-bottom-0 { + padding-bottom: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-0 { + padding-bottom: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-0 { + padding-bottom: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-0 { + padding-bottom: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-0 { + padding-bottom: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-0 { + padding-bottom: 0.125rem; + } +} +.p-bottom-1 { + padding-bottom: 0rem; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-1 { + padding-bottom: 0rem; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-1 { + padding-bottom: 0rem; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-1 { + padding-bottom: 0rem; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-1 { + padding-bottom: 0rem; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-1 { + padding-bottom: 0rem; + } +} +.p-bottom-2 { + padding-bottom: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-2 { + padding-bottom: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-2 { + padding-bottom: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-2 { + padding-bottom: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-2 { + padding-bottom: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-2 { + padding-bottom: 0.125rem; + } +} +.p-bottom-3 { + padding-bottom: 0.5rem; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-3 { + padding-bottom: 0.5rem; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-3 { + padding-bottom: 0.5rem; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-3 { + padding-bottom: 0.5rem; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-3 { + padding-bottom: 0.5rem; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-3 { + padding-bottom: 0.5rem; + } +} +.p-bottom-4 { + padding-bottom: 1.125rem; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-4 { + padding-bottom: 1.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-4 { + padding-bottom: 1.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-4 { + padding-bottom: 1.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-4 { + padding-bottom: 1.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-4 { + padding-bottom: 1.125rem; + } +} +.p-bottom-5 { + padding-bottom: 2rem; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-5 { + padding-bottom: 2rem; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-5 { + padding-bottom: 2rem; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-5 { + padding-bottom: 2rem; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-5 { + padding-bottom: 2rem; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-5 { + padding-bottom: 2rem; + } +} +.p-bottom-6 { + padding-bottom: 3.125rem; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-6 { + padding-bottom: 3.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-6 { + padding-bottom: 3.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-6 { + padding-bottom: 3.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-6 { + padding-bottom: 3.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-6 { + padding-bottom: 3.125rem; + } +} +.p-bottom-7 { + padding-bottom: 4.5rem; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-7 { + padding-bottom: 4.5rem; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-7 { + padding-bottom: 4.5rem; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-7 { + padding-bottom: 4.5rem; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-7 { + padding-bottom: 4.5rem; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-7 { + padding-bottom: 4.5rem; + } +} +.p-bottom-8 { + padding-bottom: 6.125rem; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-8 { + padding-bottom: 6.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-8 { + padding-bottom: 6.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-8 { + padding-bottom: 6.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-8 { + padding-bottom: 6.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-8 { + padding-bottom: 6.125rem; + } +} +.p-bottom-9 { + padding-bottom: 8rem; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-9 { + padding-bottom: 8rem; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-9 { + padding-bottom: 8rem; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-9 { + padding-bottom: 8rem; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-9 { + padding-bottom: 8rem; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-9 { + padding-bottom: 8rem; + } +} +.p-bottom-10 { + padding-bottom: 10.125rem; +} + +@media only screen and (min-width: 576px) { + .p-bottom-xs-10 { + padding-bottom: 10.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-bottom-sm-10 { + padding-bottom: 10.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-bottom-md-10 { + padding-bottom: 10.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-bottom-lg-10 { + padding-bottom: 10.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-bottom-xlg-10 { + padding-bottom: 10.125rem; + } +} +.p-left-0 { + padding-left: 0; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-0 { + padding-left: 0; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-0 { + padding-left: 0; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-0 { + padding-left: 0; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-0 { + padding-left: 0; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-0 { + padding-left: 0; + } +} +.p-left-1 { + padding-left: 1px; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-1 { + padding-left: 1px; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-1 { + padding-left: 1px; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-1 { + padding-left: 1px; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-1 { + padding-left: 1px; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-1 { + padding-left: 1px; + } +} +.p-left-0 { + padding-left: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-0 { + padding-left: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-0 { + padding-left: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-0 { + padding-left: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-0 { + padding-left: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-0 { + padding-left: 0.125rem; + } +} +.p-left-1 { + padding-left: 0rem; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-1 { + padding-left: 0rem; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-1 { + padding-left: 0rem; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-1 { + padding-left: 0rem; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-1 { + padding-left: 0rem; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-1 { + padding-left: 0rem; + } +} +.p-left-2 { + padding-left: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-2 { + padding-left: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-2 { + padding-left: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-2 { + padding-left: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-2 { + padding-left: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-2 { + padding-left: 0.125rem; + } +} +.p-left-3 { + padding-left: 0.5rem; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-3 { + padding-left: 0.5rem; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-3 { + padding-left: 0.5rem; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-3 { + padding-left: 0.5rem; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-3 { + padding-left: 0.5rem; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-3 { + padding-left: 0.5rem; + } +} +.p-left-4 { + padding-left: 1.125rem; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-4 { + padding-left: 1.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-4 { + padding-left: 1.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-4 { + padding-left: 1.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-4 { + padding-left: 1.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-4 { + padding-left: 1.125rem; + } +} +.p-left-5 { + padding-left: 2rem; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-5 { + padding-left: 2rem; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-5 { + padding-left: 2rem; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-5 { + padding-left: 2rem; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-5 { + padding-left: 2rem; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-5 { + padding-left: 2rem; + } +} +.p-left-6 { + padding-left: 3.125rem; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-6 { + padding-left: 3.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-6 { + padding-left: 3.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-6 { + padding-left: 3.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-6 { + padding-left: 3.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-6 { + padding-left: 3.125rem; + } +} +.p-left-7 { + padding-left: 4.5rem; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-7 { + padding-left: 4.5rem; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-7 { + padding-left: 4.5rem; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-7 { + padding-left: 4.5rem; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-7 { + padding-left: 4.5rem; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-7 { + padding-left: 4.5rem; + } +} +.p-left-8 { + padding-left: 6.125rem; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-8 { + padding-left: 6.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-8 { + padding-left: 6.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-8 { + padding-left: 6.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-8 { + padding-left: 6.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-8 { + padding-left: 6.125rem; + } +} +.p-left-9 { + padding-left: 8rem; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-9 { + padding-left: 8rem; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-9 { + padding-left: 8rem; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-9 { + padding-left: 8rem; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-9 { + padding-left: 8rem; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-9 { + padding-left: 8rem; + } +} +.p-left-10 { + padding-left: 10.125rem; +} + +@media only screen and (min-width: 576px) { + .p-left-xs-10 { + padding-left: 10.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-left-sm-10 { + padding-left: 10.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-left-md-10 { + padding-left: 10.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-left-lg-10 { + padding-left: 10.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-left-xlg-10 { + padding-left: 10.125rem; + } +} +.p-right-0 { + padding-right: 0; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-0 { + padding-right: 0; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-0 { + padding-right: 0; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-0 { + padding-right: 0; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-0 { + padding-right: 0; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-0 { + padding-right: 0; + } +} +.p-right-1 { + padding-right: 1px; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-1 { + padding-right: 1px; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-1 { + padding-right: 1px; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-1 { + padding-right: 1px; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-1 { + padding-right: 1px; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-1 { + padding-right: 1px; + } +} +.p-right-0 { + padding-right: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-0 { + padding-right: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-0 { + padding-right: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-0 { + padding-right: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-0 { + padding-right: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-0 { + padding-right: 0.125rem; + } +} +.p-right-1 { + padding-right: 0rem; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-1 { + padding-right: 0rem; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-1 { + padding-right: 0rem; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-1 { + padding-right: 0rem; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-1 { + padding-right: 0rem; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-1 { + padding-right: 0rem; + } +} +.p-right-2 { + padding-right: 0.125rem; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-2 { + padding-right: 0.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-2 { + padding-right: 0.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-2 { + padding-right: 0.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-2 { + padding-right: 0.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-2 { + padding-right: 0.125rem; + } +} +.p-right-3 { + padding-right: 0.5rem; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-3 { + padding-right: 0.5rem; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-3 { + padding-right: 0.5rem; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-3 { + padding-right: 0.5rem; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-3 { + padding-right: 0.5rem; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-3 { + padding-right: 0.5rem; + } +} +.p-right-4 { + padding-right: 1.125rem; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-4 { + padding-right: 1.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-4 { + padding-right: 1.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-4 { + padding-right: 1.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-4 { + padding-right: 1.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-4 { + padding-right: 1.125rem; + } +} +.p-right-5 { + padding-right: 2rem; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-5 { + padding-right: 2rem; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-5 { + padding-right: 2rem; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-5 { + padding-right: 2rem; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-5 { + padding-right: 2rem; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-5 { + padding-right: 2rem; + } +} +.p-right-6 { + padding-right: 3.125rem; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-6 { + padding-right: 3.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-6 { + padding-right: 3.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-6 { + padding-right: 3.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-6 { + padding-right: 3.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-6 { + padding-right: 3.125rem; + } +} +.p-right-7 { + padding-right: 4.5rem; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-7 { + padding-right: 4.5rem; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-7 { + padding-right: 4.5rem; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-7 { + padding-right: 4.5rem; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-7 { + padding-right: 4.5rem; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-7 { + padding-right: 4.5rem; + } +} +.p-right-8 { + padding-right: 6.125rem; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-8 { + padding-right: 6.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-8 { + padding-right: 6.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-8 { + padding-right: 6.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-8 { + padding-right: 6.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-8 { + padding-right: 6.125rem; + } +} +.p-right-9 { + padding-right: 8rem; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-9 { + padding-right: 8rem; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-9 { + padding-right: 8rem; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-9 { + padding-right: 8rem; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-9 { + padding-right: 8rem; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-9 { + padding-right: 8rem; + } +} +.p-right-10 { + padding-right: 10.125rem; +} + +@media only screen and (min-width: 576px) { + .p-right-xs-10 { + padding-right: 10.125rem; + } +} +@media only screen and (min-width: 768px) { + .p-right-sm-10 { + padding-right: 10.125rem; + } +} +@media only screen and (min-width: 992px) { + .p-right-md-10 { + padding-right: 10.125rem; + } +} +@media only screen and (min-width: 1200px) { + .p-right-lg-10 { + padding-right: 10.125rem; + } +} +@media only screen and (min-width: 1600px) { + .p-right-xlg-10 { + padding-right: 10.125rem; + } +} +/** + * colors + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.color-body { + color: var(--body); +} + +.color-text { + color: var(--text); +} + +.color-text-contrast { + color: var(--text-contrast); +} + +.color-primary { + color: var(--primary); +} + +.color-primary-contrast { + color: var(--primary-contrast); +} + +.color-active { + color: var(--active); +} + +.color-active-contrast { + color: var(--active-contrast); +} + +.color-link { + color: var(--link); +} + +.color-link-hover { + color: var(--link-hover); +} + +.color-danger { + color: var(--danger); +} + +.color-danger-contrast { + color: var(--danger-contrast); +} + +.color-info { + color: var(--info); +} + +.color-info-constrast { + color: var(--info-constrast); +} + +.color-success { + color: var(--success); +} + +.color-success-contrast { + color: var(--success-contrast); +} + +.color-warning { + color: var(--warning); +} + +.color-warning-contrast { + color: var(--warning-contrast); +} + +.color-background { + color: var(--background); +} + +.color-background-contrast { + color: var(--background-contrast); +} + +.color-background-alpha { + color: var(--background-alpha); +} + +.color-border { + color: var(--border); +} + +.color-border-contrast { + color: var(--border-contrast); +} + +.fill-body { + fill: var(--body); +} +.fill-body svg { + fill: var(--body); +} + +.fill-text { + fill: var(--text); +} +.fill-text svg { + fill: var(--text); +} + +.fill-text-contrast { + fill: var(--text-contrast); +} +.fill-text-contrast svg { + fill: var(--text-contrast); +} + +.fill-primary { + fill: var(--primary); +} +.fill-primary svg { + fill: var(--primary); +} + +.fill-primary-contrast { + fill: var(--primary-contrast); +} +.fill-primary-contrast svg { + fill: var(--primary-contrast); +} + +.fill-active { + fill: var(--active); +} +.fill-active svg { + fill: var(--active); +} + +.fill-active-contrast { + fill: var(--active-contrast); +} +.fill-active-contrast svg { + fill: var(--active-contrast); +} + +.fill-link { + fill: var(--link); +} +.fill-link svg { + fill: var(--link); +} + +.fill-link-hover { + fill: var(--link-hover); +} +.fill-link-hover svg { + fill: var(--link-hover); +} + +.fill-danger { + fill: var(--danger); +} +.fill-danger svg { + fill: var(--danger); +} + +.fill-danger-contrast { + fill: var(--danger-contrast); +} +.fill-danger-contrast svg { + fill: var(--danger-contrast); +} + +.fill-info { + fill: var(--info); +} +.fill-info svg { + fill: var(--info); +} + +.fill-info-constrast { + fill: var(--info-constrast); +} +.fill-info-constrast svg { + fill: var(--info-constrast); +} + +.fill-success { + fill: var(--success); +} +.fill-success svg { + fill: var(--success); +} + +.fill-success-contrast { + fill: var(--success-contrast); +} +.fill-success-contrast svg { + fill: var(--success-contrast); +} + +.fill-warning { + fill: var(--warning); +} +.fill-warning svg { + fill: var(--warning); +} + +.fill-warning-contrast { + fill: var(--warning-contrast); +} +.fill-warning-contrast svg { + fill: var(--warning-contrast); +} + +.fill-background { + fill: var(--background); +} +.fill-background svg { + fill: var(--background); +} + +.fill-background-contrast { + fill: var(--background-contrast); +} +.fill-background-contrast svg { + fill: var(--background-contrast); +} + +.fill-background-alpha { + fill: var(--background-alpha); +} +.fill-background-alpha svg { + fill: var(--background-alpha); +} + +.fill-border { + fill: var(--border); +} +.fill-border svg { + fill: var(--border); +} + +.fill-border-contrast { + fill: var(--border-contrast); +} +.fill-border-contrast svg { + fill: var(--border-contrast); +} + +.fill-body-hover:hover { + fill: var(--body); +} +.fill-body-hover:hover svg { + fill: var(--body); +} + +.fill-text-hover:hover { + fill: var(--text); +} +.fill-text-hover:hover svg { + fill: var(--text); +} + +.fill-text-contrast-hover:hover { + fill: var(--text-contrast); +} +.fill-text-contrast-hover:hover svg { + fill: var(--text-contrast); +} + +.fill-primary-hover:hover { + fill: var(--primary); +} +.fill-primary-hover:hover svg { + fill: var(--primary); +} + +.fill-primary-contrast-hover:hover { + fill: var(--primary-contrast); +} +.fill-primary-contrast-hover:hover svg { + fill: var(--primary-contrast); +} + +.fill-active-hover:hover { + fill: var(--active); +} +.fill-active-hover:hover svg { + fill: var(--active); +} + +.fill-active-contrast-hover:hover { + fill: var(--active-contrast); +} +.fill-active-contrast-hover:hover svg { + fill: var(--active-contrast); +} + +.fill-link-hover:hover { + fill: var(--link); +} +.fill-link-hover:hover svg { + fill: var(--link); +} + +.fill-link-hover-hover:hover { + fill: var(--link-hover); +} +.fill-link-hover-hover:hover svg { + fill: var(--link-hover); +} + +.fill-danger-hover:hover { + fill: var(--danger); +} +.fill-danger-hover:hover svg { + fill: var(--danger); +} + +.fill-danger-contrast-hover:hover { + fill: var(--danger-contrast); +} +.fill-danger-contrast-hover:hover svg { + fill: var(--danger-contrast); +} + +.fill-info-hover:hover { + fill: var(--info); +} +.fill-info-hover:hover svg { + fill: var(--info); +} + +.fill-info-constrast-hover:hover { + fill: var(--info-constrast); +} +.fill-info-constrast-hover:hover svg { + fill: var(--info-constrast); +} + +.fill-success-hover:hover { + fill: var(--success); +} +.fill-success-hover:hover svg { + fill: var(--success); +} + +.fill-success-contrast-hover:hover { + fill: var(--success-contrast); +} +.fill-success-contrast-hover:hover svg { + fill: var(--success-contrast); +} + +.fill-warning-hover:hover { + fill: var(--warning); +} +.fill-warning-hover:hover svg { + fill: var(--warning); +} + +.fill-warning-contrast-hover:hover { + fill: var(--warning-contrast); +} +.fill-warning-contrast-hover:hover svg { + fill: var(--warning-contrast); +} + +.fill-background-hover:hover { + fill: var(--background); +} +.fill-background-hover:hover svg { + fill: var(--background); +} + +.fill-background-contrast-hover:hover { + fill: var(--background-contrast); +} +.fill-background-contrast-hover:hover svg { + fill: var(--background-contrast); +} + +.fill-background-alpha-hover:hover { + fill: var(--background-alpha); +} +.fill-background-alpha-hover:hover svg { + fill: var(--background-alpha); +} + +.fill-border-hover:hover { + fill: var(--border); +} +.fill-border-hover:hover svg { + fill: var(--border); +} + +.fill-border-contrast-hover:hover { + fill: var(--border-contrast); +} +.fill-border-contrast-hover:hover svg { + fill: var(--border-contrast); +} + +.border-color-body { + border-color: var(--body); +} + +.border-color-text { + border-color: var(--text); +} + +.border-color-text-contrast { + border-color: var(--text-contrast); +} + +.border-color-primary { + border-color: var(--primary); +} + +.border-color-primary-contrast { + border-color: var(--primary-contrast); +} + +.border-color-active { + border-color: var(--active); +} + +.border-color-active-contrast { + border-color: var(--active-contrast); +} + +.border-color-link { + border-color: var(--link); +} + +.border-color-link-hover { + border-color: var(--link-hover); +} + +.border-color-danger { + border-color: var(--danger); +} + +.border-color-danger-contrast { + border-color: var(--danger-contrast); +} + +.border-color-info { + border-color: var(--info); +} + +.border-color-info-constrast { + border-color: var(--info-constrast); +} + +.border-color-success { + border-color: var(--success); +} + +.border-color-success-contrast { + border-color: var(--success-contrast); +} + +.border-color-warning { + border-color: var(--warning); +} + +.border-color-warning-contrast { + border-color: var(--warning-contrast); +} + +.border-color-background { + border-color: var(--background); +} + +.border-color-background-contrast { + border-color: var(--background-contrast); +} + +.border-color-background-alpha { + border-color: var(--background-alpha); +} + +.border-color-border { + border-color: var(--border); +} + +.border-color-border-contrast { + border-color: var(--border-contrast); +} + +.background-color-body { + background-color: var(--body); +} + +.background-color-text { + background-color: var(--text); +} + +.background-color-text-contrast { + background-color: var(--text-contrast); +} + +.background-color-primary { + background-color: var(--primary); +} + +.background-color-primary-contrast { + background-color: var(--primary-contrast); +} + +.background-color-active { + background-color: var(--active); +} + +.background-color-active-contrast { + background-color: var(--active-contrast); +} + +.background-color-link { + background-color: var(--link); +} + +.background-color-link-hover { + background-color: var(--link-hover); +} + +.background-color-danger { + background-color: var(--danger); +} + +.background-color-danger-contrast { + background-color: var(--danger-contrast); +} + +.background-color-info { + background-color: var(--info); +} + +.background-color-info-constrast { + background-color: var(--info-constrast); +} + +.background-color-success { + background-color: var(--success); +} + +.background-color-success-contrast { + background-color: var(--success-contrast); +} + +.background-color-warning { + background-color: var(--warning); +} + +.background-color-warning-contrast { + background-color: var(--warning-contrast); +} + +.background-color-background { + background-color: var(--background); +} + +.background-color-background-contrast { + background-color: var(--background-contrast); +} + +.background-color-background-alpha { + background-color: var(--background-alpha); +} + +.background-color-border { + background-color: var(--border); +} + +.background-color-border-contrast { + background-color: var(--border-contrast); +} + +/** + * typography + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +.left { + text-align: left; +} + +@media only screen and (min-width: 576px) { + .left-xs { + text-align: left; + } +} +@media only screen and (min-width: 768px) { + .left-sm { + text-align: left; + } +} +@media only screen and (min-width: 992px) { + .left-md { + text-align: left; + } +} +@media only screen and (min-width: 1200px) { + .left-lg { + text-align: left; + } +} +@media only screen and (min-width: 1600px) { + .left-xlg { + text-align: left; + } +} +.right { + text-align: right; +} + +@media only screen and (min-width: 576px) { + .right-xs { + text-align: right; + } +} +@media only screen and (min-width: 768px) { + .right-sm { + text-align: right; + } +} +@media only screen and (min-width: 992px) { + .right-md { + text-align: right; + } +} +@media only screen and (min-width: 1200px) { + .right-lg { + text-align: right; + } +} +@media only screen and (min-width: 1600px) { + .right-xlg { + text-align: right; + } +} +.center { + text-align: center; +} + +@media only screen and (min-width: 576px) { + .center-xs { + text-align: center; + } +} +@media only screen and (min-width: 768px) { + .center-sm { + text-align: center; + } +} +@media only screen and (min-width: 992px) { + .center-md { + text-align: center; + } +} +@media only screen and (min-width: 1200px) { + .center-lg { + text-align: center; + } +} +@media only screen and (min-width: 1600px) { + .center-xlg { + text-align: center; + } +} +.justify { + text-align: justify; +} + +@media only screen and (min-width: 576px) { + .justify-xs { + text-align: justify; + } +} +@media only screen and (min-width: 768px) { + .justify-sm { + text-align: justify; + } +} +@media only screen and (min-width: 992px) { + .justify-md { + text-align: justify; + } +} +@media only screen and (min-width: 1200px) { + .justify-lg { + text-align: justify; + } +} +@media only screen and (min-width: 1600px) { + .justify-xlg { + text-align: justify; + } +} +.uppercase { + text-transform: uppercase; +} + +@media only screen and (min-width: 576px) { + .uppercase-xs { + text-transform: uppercase; + } +} +@media only screen and (min-width: 768px) { + .uppercase-sm { + text-transform: uppercase; + } +} +@media only screen and (min-width: 992px) { + .uppercase-md { + text-transform: uppercase; + } +} +@media only screen and (min-width: 1200px) { + .uppercase-lg { + text-transform: uppercase; + } +} +@media only screen and (min-width: 1600px) { + .uppercase-xlg { + text-transform: uppercase; + } +} +.lowercase { + text-transform: lowercase; +} + +@media only screen and (min-width: 576px) { + .lowercase-xs { + text-transform: lowercase; + } +} +@media only screen and (min-width: 768px) { + .lowercase-sm { + text-transform: lowercase; + } +} +@media only screen and (min-width: 992px) { + .lowercase-md { + text-transform: lowercase; + } +} +@media only screen and (min-width: 1200px) { + .lowercase-lg { + text-transform: lowercase; + } +} +@media only screen and (min-width: 1600px) { + .lowercase-xlg { + text-transform: lowercase; + } +} +.crossed { + text-decoration: line-through; +} + +@media only screen and (min-width: 576px) { + .crossed-xs { + text-decoration: line-through; + } +} +@media only screen and (min-width: 768px) { + .crossed-sm { + text-decoration: line-through; + } +} +@media only screen and (min-width: 992px) { + .crossed-md { + text-decoration: line-through; + } +} +@media only screen and (min-width: 1200px) { + .crossed-lg { + text-decoration: line-through; + } +} +@media only screen and (min-width: 1600px) { + .crossed-xlg { + text-decoration: line-through; + } +} +.underline { + text-decoration: underline; +} + +@media only screen and (min-width: 576px) { + .underline-xs { + text-decoration: underline; + } +} +@media only screen and (min-width: 768px) { + .underline-sm { + text-decoration: underline; + } +} +@media only screen and (min-width: 992px) { + .underline-md { + text-decoration: underline; + } +} +@media only screen and (min-width: 1200px) { + .underline-lg { + text-decoration: underline; + } +} +@media only screen and (min-width: 1600px) { + .underline-xlg { + text-decoration: underline; + } +} +.capitalize { + text-transform: capitalize; +} + +@media only screen and (min-width: 576px) { + .capitalize-xs { + text-transform: capitalize; + } +} +@media only screen and (min-width: 768px) { + .capitalize-sm { + text-transform: capitalize; + } +} +@media only screen and (min-width: 992px) { + .capitalize-md { + text-transform: capitalize; + } +} +@media only screen and (min-width: 1200px) { + .capitalize-lg { + text-transform: capitalize; + } +} +@media only screen and (min-width: 1600px) { + .capitalize-xlg { + text-transform: capitalize; + } +} +.italic { + font-style: italic; +} + +@media only screen and (min-width: 576px) { + .italic-xs { + font-style: italic; + } +} +@media only screen and (min-width: 768px) { + .italic-sm { + font-style: italic; + } +} +@media only screen and (min-width: 992px) { + .italic-md { + font-style: italic; + } +} +@media only screen and (min-width: 1200px) { + .italic-lg { + font-style: italic; + } +} +@media only screen and (min-width: 1600px) { + .italic-xlg { + font-style: italic; + } +} +.light { + font-weight: lighter; +} + +@media only screen and (min-width: 576px) { + .light-xs { + font-weight: lighter; + } +} +@media only screen and (min-width: 768px) { + .light-sm { + font-weight: lighter; + } +} +@media only screen and (min-width: 992px) { + .light-md { + font-weight: lighter; + } +} +@media only screen and (min-width: 1200px) { + .light-lg { + font-weight: lighter; + } +} +@media only screen and (min-width: 1600px) { + .light-xlg { + font-weight: lighter; + } +} +.normal { + font-weight: normal; +} + +@media only screen and (min-width: 576px) { + .normal-xs { + font-weight: normal; + } +} +@media only screen and (min-width: 768px) { + .normal-sm { + font-weight: normal; + } +} +@media only screen and (min-width: 992px) { + .normal-md { + font-weight: normal; + } +} +@media only screen and (min-width: 1200px) { + .normal-lg { + font-weight: normal; + } +} +@media only screen and (min-width: 1600px) { + .normal-xlg { + font-weight: normal; + } +} +.medium { + font-weight: medium; +} + +@media only screen and (min-width: 576px) { + .medium-xs { + font-weight: medium; + } +} +@media only screen and (min-width: 768px) { + .medium-sm { + font-weight: medium; + } +} +@media only screen and (min-width: 992px) { + .medium-md { + font-weight: medium; + } +} +@media only screen and (min-width: 1200px) { + .medium-lg { + font-weight: medium; + } +} +@media only screen and (min-width: 1600px) { + .medium-xlg { + font-weight: medium; + } +} +.bold { + font-weight: bolder; +} + +@media only screen and (min-width: 576px) { + .bold-xs { + font-weight: bolder; + } +} +@media only screen and (min-width: 768px) { + .bold-sm { + font-weight: bolder; + } +} +@media only screen and (min-width: 992px) { + .bold-md { + font-weight: bolder; + } +} +@media only screen and (min-width: 1200px) { + .bold-lg { + font-weight: bolder; + } +} +@media only screen and (min-width: 1600px) { + .bold-xlg { + font-weight: bolder; + } +} +/** + * font-sizes + * + * + */ +.size-default { + font-size: 0.9rem; +} + +@media only screen and (min-width: 576px) { + .size-xs-default { + font-size: 0.9rem; + } +} +@media only screen and (min-width: 768px) { + .size-sm-default { + font-size: 0.9rem; + } +} +@media only screen and (min-width: 992px) { + .size-md-default { + font-size: 0.9rem; + } +} +@media only screen and (min-width: 1200px) { + .size-lg-default { + font-size: 0.9rem; + } +} +@media only screen and (min-width: 1600px) { + .size-xlg-default { + font-size: 0.9rem; + } +} +.size-small { + font-size: 0.675rem; +} + +@media only screen and (min-width: 576px) { + .size-xs-small { + font-size: 0.675rem; + } +} +@media only screen and (min-width: 768px) { + .size-sm-small { + font-size: 0.675rem; + } +} +@media only screen and (min-width: 992px) { + .size-md-small { + font-size: 0.675rem; + } +} +@media only screen and (min-width: 1200px) { + .size-lg-small { + font-size: 0.675rem; + } +} +@media only screen and (min-width: 1600px) { + .size-xlg-small { + font-size: 0.675rem; + } +} +.size-medium { + font-size: 1.35rem; +} + +@media only screen and (min-width: 576px) { + .size-xs-medium { + font-size: 1.35rem; + } +} +@media only screen and (min-width: 768px) { + .size-sm-medium { + font-size: 1.35rem; + } +} +@media only screen and (min-width: 992px) { + .size-md-medium { + font-size: 1.35rem; + } +} +@media only screen and (min-width: 1200px) { + .size-lg-medium { + font-size: 1.35rem; + } +} +@media only screen and (min-width: 1600px) { + .size-xlg-medium { + font-size: 1.35rem; + } +} +.size-large { + font-size: 1.8rem; +} + +@media only screen and (min-width: 576px) { + .size-xs-large { + font-size: 1.8rem; + } +} +@media only screen and (min-width: 768px) { + .size-sm-large { + font-size: 1.8rem; + } +} +@media only screen and (min-width: 992px) { + .size-md-large { + font-size: 1.8rem; + } +} +@media only screen and (min-width: 1200px) { + .size-lg-large { + font-size: 1.8rem; + } +} +@media only screen and (min-width: 1600px) { + .size-xlg-large { + font-size: 1.8rem; + } +} +.size-big { + font-size: 2.7rem; +} + +@media only screen and (min-width: 576px) { + .size-xs-big { + font-size: 2.7rem; + } +} +@media only screen and (min-width: 768px) { + .size-sm-big { + font-size: 2.7rem; + } +} +@media only screen and (min-width: 992px) { + .size-md-big { + font-size: 2.7rem; + } +} +@media only screen and (min-width: 1200px) { + .size-lg-big { + font-size: 2.7rem; + } +} +@media only screen and (min-width: 1600px) { + .size-xlg-big { + font-size: 2.7rem; + } +} +/** + * white-space + * + * + */ +.white-space-normal { + white-space: normal; +} + +@media only screen and (min-width: 576px) { + .white-space-normal-xs { + white-space: normal; + } +} +@media only screen and (min-width: 768px) { + .white-space-normal-sm { + white-space: normal; + } +} +@media only screen and (min-width: 992px) { + .white-space-normal-md { + white-space: normal; + } +} +@media only screen and (min-width: 1200px) { + .white-space-normal-lg { + white-space: normal; + } +} +@media only screen and (min-width: 1600px) { + .white-space-normal-xlg { + white-space: normal; + } +} +.white-space-nowrap { + white-space: nowrap; +} + +@media only screen and (min-width: 576px) { + .white-space-nowrap-xs { + white-space: nowrap; + } +} +@media only screen and (min-width: 768px) { + .white-space-nowrap-sm { + white-space: nowrap; + } +} +@media only screen and (min-width: 992px) { + .white-space-nowrap-md { + white-space: nowrap; + } +} +@media only screen and (min-width: 1200px) { + .white-space-nowrap-lg { + white-space: nowrap; + } +} +@media only screen and (min-width: 1600px) { + .white-space-nowrap-xlg { + white-space: nowrap; + } +} +.white-space-pre { + white-space: pre; +} + +@media only screen and (min-width: 576px) { + .white-space-pre-xs { + white-space: pre; + } +} +@media only screen and (min-width: 768px) { + .white-space-pre-sm { + white-space: pre; + } +} +@media only screen and (min-width: 992px) { + .white-space-pre-md { + white-space: pre; + } +} +@media only screen and (min-width: 1200px) { + .white-space-pre-lg { + white-space: pre; + } +} +@media only screen and (min-width: 1600px) { + .white-space-pre-xlg { + white-space: pre; + } +} +.white-space-preline { + white-space: preline; +} + +@media only screen and (min-width: 576px) { + .white-space-preline-xs { + white-space: preline; + } +} +@media only screen and (min-width: 768px) { + .white-space-preline-sm { + white-space: preline; + } +} +@media only screen and (min-width: 992px) { + .white-space-preline-md { + white-space: preline; + } +} +@media only screen and (min-width: 1200px) { + .white-space-preline-lg { + white-space: preline; + } +} +@media only screen and (min-width: 1600px) { + .white-space-preline-xlg { + white-space: preline; + } +} +.white-space-preline { + white-space: pre-line; +} + +@media only screen and (min-width: 576px) { + .white-space-preline-xs { + white-space: pre-line; + } +} +@media only screen and (min-width: 768px) { + .white-space-preline-sm { + white-space: pre-line; + } +} +@media only screen and (min-width: 992px) { + .white-space-preline-md { + white-space: pre-line; + } +} +@media only screen and (min-width: 1200px) { + .white-space-preline-lg { + white-space: pre-line; + } +} +@media only screen and (min-width: 1600px) { + .white-space-preline-xlg { + white-space: pre-line; + } +} +.white-space-prewrap { + white-space: pre-wrap; +} + +@media only screen and (min-width: 576px) { + .white-space-prewrap-xs { + white-space: pre-wrap; + } +} +@media only screen and (min-width: 768px) { + .white-space-prewrap-sm { + white-space: pre-wrap; + } +} +@media only screen and (min-width: 992px) { + .white-space-prewrap-md { + white-space: pre-wrap; + } +} +@media only screen and (min-width: 1200px) { + .white-space-prewrap-lg { + white-space: pre-wrap; + } +} +@media only screen and (min-width: 1600px) { + .white-space-prewrap-xlg { + white-space: pre-wrap; + } +} +/** + * visibility + * + * + * @author Björn Hase, me@herr-hase.wtf + * @license http://opensource.org/licenses/MIT The MIT License + * @link https://gitea.node001.net/tiny-components/plain-ui.git + * + */ +/** + * display + * + * + */ +.display-block { + display: block; +} + +@media only screen and (min-width: 576px) { + .display-block-xs { + display: block; + } +} +@media only screen and (min-width: 768px) { + .display-block-sm { + display: block; + } +} +@media only screen and (min-width: 992px) { + .display-block-md { + display: block; + } +} +@media only screen and (min-width: 1200px) { + .display-block-lg { + display: block; + } +} +@media only screen and (min-width: 1600px) { + .display-block-xlg { + display: block; + } +} +.display-inline { + display: inline; +} + +@media only screen and (min-width: 576px) { + .display-inline-xs { + display: inline; + } +} +@media only screen and (min-width: 768px) { + .display-inline-sm { + display: inline; + } +} +@media only screen and (min-width: 992px) { + .display-inline-md { + display: inline; + } +} +@media only screen and (min-width: 1200px) { + .display-inline-lg { + display: inline; + } +} +@media only screen and (min-width: 1600px) { + .display-inline-xlg { + display: inline; + } +} +.display-inline-block { + display: inline-block; +} + +@media only screen and (min-width: 576px) { + .display-inline-block-xs { + display: inline-block; + } +} +@media only screen and (min-width: 768px) { + .display-inline-block-sm { + display: inline-block; + } +} +@media only screen and (min-width: 992px) { + .display-inline-block-md { + display: inline-block; + } +} +@media only screen and (min-width: 1200px) { + .display-inline-block-lg { + display: inline-block; + } +} +@media only screen and (min-width: 1600px) { + .display-inline-block-xlg { + display: inline-block; + } +} +.display-flex { + display: flex; +} + +@media only screen and (min-width: 576px) { + .display-flex-xs { + display: flex; + } +} +@media only screen and (min-width: 768px) { + .display-flex-sm { + display: flex; + } +} +@media only screen and (min-width: 992px) { + .display-flex-md { + display: flex; + } +} +@media only screen and (min-width: 1200px) { + .display-flex-lg { + display: flex; + } +} +@media only screen and (min-width: 1600px) { + .display-flex-xlg { + display: flex; + } +} +.display-inline-flex { + display: inline-flex; +} + +@media only screen and (min-width: 576px) { + .display-inline-flex-xs { + display: inline-flex; + } +} +@media only screen and (min-width: 768px) { + .display-inline-flex-sm { + display: inline-flex; + } +} +@media only screen and (min-width: 992px) { + .display-inline-flex-md { + display: inline-flex; + } +} +@media only screen and (min-width: 1200px) { + .display-inline-flex-lg { + display: inline-flex; + } +} +@media only screen and (min-width: 1600px) { + .display-inline-flex-xlg { + display: inline-flex; + } +} +.display-table { + display: table; +} + +@media only screen and (min-width: 576px) { + .display-table-xs { + display: table; + } +} +@media only screen and (min-width: 768px) { + .display-table-sm { + display: table; + } +} +@media only screen and (min-width: 992px) { + .display-table-md { + display: table; + } +} +@media only screen and (min-width: 1200px) { + .display-table-lg { + display: table; + } +} +@media only screen and (min-width: 1600px) { + .display-table-xlg { + display: table; + } +} +/** + * for hidden-xs etc, show https://reflexgrid.com/#visibility-helpers + * + * @TODO full integration of reflexgrid will change this part + * + */ +/** + * Visibility + * + */ +.visibility-hidden { + visibility: hidden; +} + +.visibility-visible { + visibility: visible; +} + +.visibility-collapse { + visibility: collapse; +} + +/** + * Opacity + * + * + */ +.opacity-1 { + opacity: 0.1; +} + +.opacity-2 { + opacity: 0.2; +} + +.opacity-3 { + opacity: 0.3; +} + +.opacity-4 { + opacity: 0.4; +} + +.opacity-5 { + opacity: 0.5; +} + +.opacity-6 { + opacity: 0.6; +} + +.opacity-7 { + opacity: 0.7; +} + +.opacity-8 { + opacity: 0.8; +} + +.opacity-9 { + opacity: 0.9; +} + +.opacity-10 { + opacity: 1; +} + +.tiny-slider { + overflow-x: hidden; +} +.tiny-slider__inner { + position: relative; + transition: transform 0.3s ease-in-out; +} +.tiny-slider__item { + max-width: 100%; +} +.tiny-slider__button { + display: none; + border: none; + background: transparent; + width: 150px; + padding: 10px; +} +.tiny-slider__button .icon { + font-size: 3rem; +} +@media only screen and (min-width: 992px) { + .tiny-slider__button { + display: block; + } +} +.tiny-slider__button:hover { + cursor: pointer; +} +.tiny-slider__select { + padding: 1em; + justify-content: center; +} +.tiny-slider__select-item { + height: 25px; + width: 25px; + border: 1px solid var(--background); + background-color: var(--background-contrast); + margin: 0 0.5em; + transition: background-color 0.3s ease-in-out; +} +.tiny-slider__select-item:hover { + cursor: pointer; +} +.tiny-slider__select-item--current { + background-color: var(--background); +} + +.overflow-hidden { + overflow: hidden; +} diff --git a/example/example.js b/example/example.js new file mode 100644 index 0000000..b13b1df --- /dev/null +++ b/example/example.js @@ -0,0 +1,6735 @@ +/******/ (() => { // webpackBootstrap +/******/ var __webpack_modules__ = ({ + +/***/ "./node_modules/@tiny-components/raw/src/raw.riot": +/*!********************************************************!*\ + !*** ./node_modules/@tiny-components/raw/src/raw.riot ***! + \********************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) +/* harmony export */ }); +/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ + css: null, + + exports: { + setInnerHTML() { + this.root.innerHTML = this.props.html + }, + + onMounted() { + this.setInnerHTML() + }, + + onUpdated() { + this.setInnerHTML() + } + }, + + template: ( + template, + expressionTypes, + bindingTypes, + getComponent + ) => template( + '\n\n /**\n * tiny raw\n *\n * @author Björn Hase\n * @license http://opensource.org/licenses/MIT The MIT License\n * @link https://gitea.node001.net/tiny-components/raw\n *\n */\n\n ', + [] + ), + + name: 'tiny-raw' +}); + +/***/ }), + +/***/ "./src/slider.riot": +/*!*************************!*\ + !*** ./src/slider.riot ***! + \*************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) +/* harmony export */ }); +/* harmony import */ var riot__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! riot */ "./node_modules/riot/esm/api/register.js"); +/* harmony import */ var _mixin_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./mixin.js */ "./src/mixin.js"); +/* harmony import */ var _tiny_components_raw_src_raw_riot__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @tiny-components/raw/src/raw.riot */ "./node_modules/@tiny-components/raw/src/raw.riot"); +// riot + + +// mixin + + +// tiny-raw & riot + +riot__WEBPACK_IMPORTED_MODULE_2__.register('tiny-raw', _tiny_components_raw_src_raw_riot__WEBPACK_IMPORTED_MODULE_1__["default"]) + +/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ + css: null, + + exports: () => { + return { + + ..._mixin_js__WEBPACK_IMPORTED_MODULE_0__["default"] + + } + }, + + template: ( + template, + expressionTypes, + bindingTypes, + getComponent + ) => template( + '
', + [ + { + redundantAttribute: 'expr0', + selector: '[expr0]', + + expressions: [ + { + type: expressionTypes.ATTRIBUTE, + name: 'class', + evaluate: _scope => _scope.getPreviousClasses() + }, + { + type: expressionTypes.EVENT, + name: 'onclick', + evaluate: _scope => (event) => { _scope.handlePrevious(event) } + } + ] + }, + { + redundantAttribute: 'expr1', + selector: '[expr1]', + + expressions: [ + { + type: expressionTypes.ATTRIBUTE, + name: 'style', + evaluate: _scope => _scope.getContentStyles() + } + ] + }, + { + type: bindingTypes.EACH, + getKey: null, + condition: null, + + template: template( + '

', + [ + { + redundantAttribute: 'expr3', + selector: '[expr3]', + + expressions: [ + { + type: expressionTypes.TEXT, + childNodeIndex: 0, + + evaluate: _scope => [ + _scope.slide.title + ].join( + '' + ) + } + ] + }, + { + type: bindingTypes.IF, + evaluate: _scope => _scope.slide.media, + redundantAttribute: 'expr4', + selector: '[expr4]', + + template: template( + '', + [ + { + redundantAttribute: 'expr5', + selector: '[expr5]', + + expressions: [ + { + type: expressionTypes.ATTRIBUTE, + name: 'src', + evaluate: _scope => _scope.slide.media.url + }, + { + type: expressionTypes.ATTRIBUTE, + name: 'alt', + evaluate: _scope => _scope.slide.media.description + } + ] + } + ] + ) + }, + { + type: bindingTypes.TAG, + getComponent: getComponent, + evaluate: _scope => 'tiny-raw', + slots: [], + + attributes: [ + { + type: expressionTypes.ATTRIBUTE, + name: 'html', + evaluate: _scope => _scope.slide.content + } + ], + + redundantAttribute: 'expr6', + selector: '[expr6]' + } + ] + ), + + redundantAttribute: 'expr2', + selector: '[expr2]', + itemName: 'slide', + indexName: null, + evaluate: _scope => _scope.props.slides + }, + { + redundantAttribute: 'expr7', + selector: '[expr7]', + + expressions: [ + { + type: expressionTypes.ATTRIBUTE, + name: 'class', + evaluate: _scope => _scope.getNextClasses() + }, + { + type: expressionTypes.EVENT, + name: 'onclick', + evaluate: _scope => (event) => { _scope.handleNext(event) } + } + ] + }, + { + type: bindingTypes.EACH, + getKey: null, + condition: null, + + template: template( + null, + [ + { + expressions: [ + { + type: expressionTypes.ATTRIBUTE, + name: 'class', + evaluate: _scope => _scope.getSelectClasses(_scope.position) + }, + { + type: expressionTypes.EVENT, + name: 'onclick', + evaluate: _scope => (event) => { _scope.handleSelect(event, _scope.position) } + } + ] + } + ] + ), + + redundantAttribute: 'expr8', + selector: '[expr8]', + itemName: 'slide', + indexName: 'position', + evaluate: _scope => _scope.props.slides + } + ] + ), + + name: 'tiny-slider' +}); + +/***/ }), + +/***/ "./src/example.js": +/*!************************!*\ + !*** ./src/example.js ***! + \************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony import */ var riot__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! riot */ "./node_modules/riot/esm/api/register.js"); +/* harmony import */ var riot__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! riot */ "./node_modules/riot/esm/api/install.js"); +/* harmony import */ var riot__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! riot */ "./node_modules/riot/esm/riot.js"); +/* harmony import */ var _slider_riot__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./slider.riot */ "./src/slider.riot"); +function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); } +function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } +function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); } +function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); } +function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } +function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } +function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } +function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; } +function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } } +function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } + + +riot__WEBPACK_IMPORTED_MODULE_1__.register('tiny-slider', _slider_riot__WEBPACK_IMPORTED_MODULE_0__["default"]); + +/** + * Convert object attributes constructs into strings + * + * @param {Object} attributes - style attributes as object + * @returns {string} a string with all the attributes and their values + */ +function styles(attributes) { + return Object.entries(attributes).reduce(function (acc, item) { + var _item = _slicedToArray(item, 2), + key = _item[0], + value = _item[1]; + return [].concat(_toConsumableArray(acc), ["".concat(key, ": ").concat(value)]); + }, []).join(';'); +} +riot__WEBPACK_IMPORTED_MODULE_2__.install(function (component) { + component.styles = styles; + return component; +}); +window.riot = riot__WEBPACK_IMPORTED_MODULE_3__; + +/***/ }), + +/***/ "./src/mixin.js": +/*!**********************!*\ + !*** ./src/mixin.js ***! + \**********************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) +/* harmony export */ }); +/* harmony import */ var hammerjs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! hammerjs */ "./node_modules/hammerjs/hammer.js"); +/* harmony import */ var hammerjs__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(hammerjs__WEBPACK_IMPORTED_MODULE_0__); + + +/** + * + * + */ + +/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ + /** + * + * + */ + state: { + position: 0, + max: 0, + classes: { + item: 'tiny-slider__item' + } + }, + /** + * + * + */ + onMounted: function onMounted() { + var _this = this; + // start and add resize listener + window.addEventListener('resize', this.update.bind(this)); + setTimeout(function () { + _this.update(); + }, 100); + + // Create a manager to manager the element + var manager = new hammerjs__WEBPACK_IMPORTED_MODULE_0__(this.root); + manager.on('swipe', function (event) { + if (event.direction === 4) { + _this.handlePrevious(event); + } else if (event.direction === 2) { + _this.handleNext(event); + } + }); + }, + /** + * remove resize listener + * before unmount + * + */ + onBeforeUnmount: function onBeforeUnmount() { + window.removeEventListener('resize', this.update.bind(this)); + }, + /** + * before update view, calculate values + * + * @param {object} props + * @param {object} state + * + */ + onBeforeUpdate: function onBeforeUpdate(props, state) { + var _this2 = this; + // getting current max + var max = this.state.max; + + // setting max to show visible + this.state.max = 0; + this.state.width = this.$('.' + this.state.classes.item).offsetWidth; + + // check how many elements can visible in element + this.$$('.' + this.state.classes.item).forEach(function (element, index) { + if (element.offsetLeft < _this2.root.offsetWidth) { + _this2.state.max++; + } + }); + console.log(this.state.max); + + // change position to fit new max value + var value = Math.abs(this.state.max - max); + + // @TODO check this, at 0 it makes me mad + if (this.state.position >= value && this.state.position > 1) { + this.state.position -= value; + } + }, + /** + * set translate with position and witdh + * + * + * @return {string} + * + */ + getContentStyles: function getContentStyles() { + // getting value for position + var value = -(this.state.position * this.state.width); + return this.styles({ + transform: 'translate(' + value + 'px, 0px)' + }); + }, + /** + * set previous position + * + * + */ + handleSelect: function handleSelect(event, position) { + event.preventDefault(); + if (this.state.position !== position) { + this.update({ + position: position + }); + } + }, + /** + * set previous position + * + * + */ + handlePrevious: function handlePrevious(event) { + event.preventDefault(); + if (this.state.position > 0) { + this.update({ + position: --this.state.position + }); + } + }, + /** + * set next position + * + * + */ + handleNext: function handleNext(event) { + event.preventDefault(); + if (this.state.position < this.props.slides.length - 1) { + this.update({ + position: ++this.state.position + }); + } + }, + /** + * + * + * + * @return {string} + * + */ + getPreviousClasses: function getPreviousClasses() { + var classes = ['tiny-slider__button', 'tiny-slider__button--previous']; + if (this.state.position > 0) { + classes.push('visibility-visible'); + } else { + classes.push('visibility-hidden'); + } + return classes.join(' '); + }, + /** + * + * + * + * @return {string} + * + */ + getNextClasses: function getNextClasses() { + var classes = ['tiny-slider__button', 'tiny-slider__button--next']; + if (this.state.position <= this.props.slides.length - this.state.max) { + classes.push('visibility-visible'); + } else { + classes.push('visibility-hidden'); + } + return classes.join(' '); + }, + /** + * + * + * @param {integer} position + * @return {string} + * + */ + getSelectClasses: function getSelectClasses(position) { + var classes = ['tiny-slider__select-item']; + if (this.state.position === position) { + classes.push('tiny-slider__select-item--current'); + } + return classes.join(' '); + } +}); + +/***/ }), + +/***/ "./node_modules/hammerjs/hammer.js": +/*!*****************************************!*\ + !*** ./node_modules/hammerjs/hammer.js ***! + \*****************************************/ +/***/ ((module, exports, __webpack_require__) => { + +var __WEBPACK_AMD_DEFINE_RESULT__;/*! Hammer.JS - v2.0.7 - 2016-04-22 + * http://hammerjs.github.io/ + * + * Copyright (c) 2016 Jorik Tangelder; + * Licensed under the MIT license */ +(function(window, document, exportName, undefined) { + 'use strict'; + +var VENDOR_PREFIXES = ['', 'webkit', 'Moz', 'MS', 'ms', 'o']; +var TEST_ELEMENT = document.createElement('div'); + +var TYPE_FUNCTION = 'function'; + +var round = Math.round; +var abs = Math.abs; +var now = Date.now; + +/** + * set a timeout with a given scope + * @param {Function} fn + * @param {Number} timeout + * @param {Object} context + * @returns {number} + */ +function setTimeoutContext(fn, timeout, context) { + return setTimeout(bindFn(fn, context), timeout); +} + +/** + * if the argument is an array, we want to execute the fn on each entry + * if it aint an array we don't want to do a thing. + * this is used by all the methods that accept a single and array argument. + * @param {*|Array} arg + * @param {String} fn + * @param {Object} [context] + * @returns {Boolean} + */ +function invokeArrayArg(arg, fn, context) { + if (Array.isArray(arg)) { + each(arg, context[fn], context); + return true; + } + return false; +} + +/** + * walk objects and arrays + * @param {Object} obj + * @param {Function} iterator + * @param {Object} context + */ +function each(obj, iterator, context) { + var i; + + if (!obj) { + return; + } + + if (obj.forEach) { + obj.forEach(iterator, context); + } else if (obj.length !== undefined) { + i = 0; + while (i < obj.length) { + iterator.call(context, obj[i], i, obj); + i++; + } + } else { + for (i in obj) { + obj.hasOwnProperty(i) && iterator.call(context, obj[i], i, obj); + } + } +} + +/** + * wrap a method with a deprecation warning and stack trace + * @param {Function} method + * @param {String} name + * @param {String} message + * @returns {Function} A new function wrapping the supplied method. + */ +function deprecate(method, name, message) { + var deprecationMessage = 'DEPRECATED METHOD: ' + name + '\n' + message + ' AT \n'; + return function() { + var e = new Error('get-stack-trace'); + var stack = e && e.stack ? e.stack.replace(/^[^\(]+?[\n$]/gm, '') + .replace(/^\s+at\s+/gm, '') + .replace(/^Object.\s*\(/gm, '{anonymous}()@') : 'Unknown Stack Trace'; + + var log = window.console && (window.console.warn || window.console.log); + if (log) { + log.call(window.console, deprecationMessage, stack); + } + return method.apply(this, arguments); + }; +} + +/** + * extend object. + * means that properties in dest will be overwritten by the ones in src. + * @param {Object} target + * @param {...Object} objects_to_assign + * @returns {Object} target + */ +var assign; +if (typeof Object.assign !== 'function') { + assign = function assign(target) { + if (target === undefined || target === null) { + throw new TypeError('Cannot convert undefined or null to object'); + } + + var output = Object(target); + for (var index = 1; index < arguments.length; index++) { + var source = arguments[index]; + if (source !== undefined && source !== null) { + for (var nextKey in source) { + if (source.hasOwnProperty(nextKey)) { + output[nextKey] = source[nextKey]; + } + } + } + } + return output; + }; +} else { + assign = Object.assign; +} + +/** + * extend object. + * means that properties in dest will be overwritten by the ones in src. + * @param {Object} dest + * @param {Object} src + * @param {Boolean} [merge=false] + * @returns {Object} dest + */ +var extend = deprecate(function extend(dest, src, merge) { + var keys = Object.keys(src); + var i = 0; + while (i < keys.length) { + if (!merge || (merge && dest[keys[i]] === undefined)) { + dest[keys[i]] = src[keys[i]]; + } + i++; + } + return dest; +}, 'extend', 'Use `assign`.'); + +/** + * merge the values from src in the dest. + * means that properties that exist in dest will not be overwritten by src + * @param {Object} dest + * @param {Object} src + * @returns {Object} dest + */ +var merge = deprecate(function merge(dest, src) { + return extend(dest, src, true); +}, 'merge', 'Use `assign`.'); + +/** + * simple class inheritance + * @param {Function} child + * @param {Function} base + * @param {Object} [properties] + */ +function inherit(child, base, properties) { + var baseP = base.prototype, + childP; + + childP = child.prototype = Object.create(baseP); + childP.constructor = child; + childP._super = baseP; + + if (properties) { + assign(childP, properties); + } +} + +/** + * simple function bind + * @param {Function} fn + * @param {Object} context + * @returns {Function} + */ +function bindFn(fn, context) { + return function boundFn() { + return fn.apply(context, arguments); + }; +} + +/** + * let a boolean value also be a function that must return a boolean + * this first item in args will be used as the context + * @param {Boolean|Function} val + * @param {Array} [args] + * @returns {Boolean} + */ +function boolOrFn(val, args) { + if (typeof val == TYPE_FUNCTION) { + return val.apply(args ? args[0] || undefined : undefined, args); + } + return val; +} + +/** + * use the val2 when val1 is undefined + * @param {*} val1 + * @param {*} val2 + * @returns {*} + */ +function ifUndefined(val1, val2) { + return (val1 === undefined) ? val2 : val1; +} + +/** + * addEventListener with multiple events at once + * @param {EventTarget} target + * @param {String} types + * @param {Function} handler + */ +function addEventListeners(target, types, handler) { + each(splitStr(types), function(type) { + target.addEventListener(type, handler, false); + }); +} + +/** + * removeEventListener with multiple events at once + * @param {EventTarget} target + * @param {String} types + * @param {Function} handler + */ +function removeEventListeners(target, types, handler) { + each(splitStr(types), function(type) { + target.removeEventListener(type, handler, false); + }); +} + +/** + * find if a node is in the given parent + * @method hasParent + * @param {HTMLElement} node + * @param {HTMLElement} parent + * @return {Boolean} found + */ +function hasParent(node, parent) { + while (node) { + if (node == parent) { + return true; + } + node = node.parentNode; + } + return false; +} + +/** + * small indexOf wrapper + * @param {String} str + * @param {String} find + * @returns {Boolean} found + */ +function inStr(str, find) { + return str.indexOf(find) > -1; +} + +/** + * split string on whitespace + * @param {String} str + * @returns {Array} words + */ +function splitStr(str) { + return str.trim().split(/\s+/g); +} + +/** + * find if a array contains the object using indexOf or a simple polyFill + * @param {Array} src + * @param {String} find + * @param {String} [findByKey] + * @return {Boolean|Number} false when not found, or the index + */ +function inArray(src, find, findByKey) { + if (src.indexOf && !findByKey) { + return src.indexOf(find); + } else { + var i = 0; + while (i < src.length) { + if ((findByKey && src[i][findByKey] == find) || (!findByKey && src[i] === find)) { + return i; + } + i++; + } + return -1; + } +} + +/** + * convert array-like objects to real arrays + * @param {Object} obj + * @returns {Array} + */ +function toArray(obj) { + return Array.prototype.slice.call(obj, 0); +} + +/** + * unique array with objects based on a key (like 'id') or just by the array's value + * @param {Array} src [{id:1},{id:2},{id:1}] + * @param {String} [key] + * @param {Boolean} [sort=False] + * @returns {Array} [{id:1},{id:2}] + */ +function uniqueArray(src, key, sort) { + var results = []; + var values = []; + var i = 0; + + while (i < src.length) { + var val = key ? src[i][key] : src[i]; + if (inArray(values, val) < 0) { + results.push(src[i]); + } + values[i] = val; + i++; + } + + if (sort) { + if (!key) { + results = results.sort(); + } else { + results = results.sort(function sortUniqueArray(a, b) { + return a[key] > b[key]; + }); + } + } + + return results; +} + +/** + * get the prefixed property + * @param {Object} obj + * @param {String} property + * @returns {String|Undefined} prefixed + */ +function prefixed(obj, property) { + var prefix, prop; + var camelProp = property[0].toUpperCase() + property.slice(1); + + var i = 0; + while (i < VENDOR_PREFIXES.length) { + prefix = VENDOR_PREFIXES[i]; + prop = (prefix) ? prefix + camelProp : property; + + if (prop in obj) { + return prop; + } + i++; + } + return undefined; +} + +/** + * get a unique id + * @returns {number} uniqueId + */ +var _uniqueId = 1; +function uniqueId() { + return _uniqueId++; +} + +/** + * get the window object of an element + * @param {HTMLElement} element + * @returns {DocumentView|Window} + */ +function getWindowForElement(element) { + var doc = element.ownerDocument || element; + return (doc.defaultView || doc.parentWindow || window); +} + +var MOBILE_REGEX = /mobile|tablet|ip(ad|hone|od)|android/i; + +var SUPPORT_TOUCH = ('ontouchstart' in window); +var SUPPORT_POINTER_EVENTS = prefixed(window, 'PointerEvent') !== undefined; +var SUPPORT_ONLY_TOUCH = SUPPORT_TOUCH && MOBILE_REGEX.test(navigator.userAgent); + +var INPUT_TYPE_TOUCH = 'touch'; +var INPUT_TYPE_PEN = 'pen'; +var INPUT_TYPE_MOUSE = 'mouse'; +var INPUT_TYPE_KINECT = 'kinect'; + +var COMPUTE_INTERVAL = 25; + +var INPUT_START = 1; +var INPUT_MOVE = 2; +var INPUT_END = 4; +var INPUT_CANCEL = 8; + +var DIRECTION_NONE = 1; +var DIRECTION_LEFT = 2; +var DIRECTION_RIGHT = 4; +var DIRECTION_UP = 8; +var DIRECTION_DOWN = 16; + +var DIRECTION_HORIZONTAL = DIRECTION_LEFT | DIRECTION_RIGHT; +var DIRECTION_VERTICAL = DIRECTION_UP | DIRECTION_DOWN; +var DIRECTION_ALL = DIRECTION_HORIZONTAL | DIRECTION_VERTICAL; + +var PROPS_XY = ['x', 'y']; +var PROPS_CLIENT_XY = ['clientX', 'clientY']; + +/** + * create new input type manager + * @param {Manager} manager + * @param {Function} callback + * @returns {Input} + * @constructor + */ +function Input(manager, callback) { + var self = this; + this.manager = manager; + this.callback = callback; + this.element = manager.element; + this.target = manager.options.inputTarget; + + // smaller wrapper around the handler, for the scope and the enabled state of the manager, + // so when disabled the input events are completely bypassed. + this.domHandler = function(ev) { + if (boolOrFn(manager.options.enable, [manager])) { + self.handler(ev); + } + }; + + this.init(); + +} + +Input.prototype = { + /** + * should handle the inputEvent data and trigger the callback + * @virtual + */ + handler: function() { }, + + /** + * bind the events + */ + init: function() { + this.evEl && addEventListeners(this.element, this.evEl, this.domHandler); + this.evTarget && addEventListeners(this.target, this.evTarget, this.domHandler); + this.evWin && addEventListeners(getWindowForElement(this.element), this.evWin, this.domHandler); + }, + + /** + * unbind the events + */ + destroy: function() { + this.evEl && removeEventListeners(this.element, this.evEl, this.domHandler); + this.evTarget && removeEventListeners(this.target, this.evTarget, this.domHandler); + this.evWin && removeEventListeners(getWindowForElement(this.element), this.evWin, this.domHandler); + } +}; + +/** + * create new input type manager + * called by the Manager constructor + * @param {Hammer} manager + * @returns {Input} + */ +function createInputInstance(manager) { + var Type; + var inputClass = manager.options.inputClass; + + if (inputClass) { + Type = inputClass; + } else if (SUPPORT_POINTER_EVENTS) { + Type = PointerEventInput; + } else if (SUPPORT_ONLY_TOUCH) { + Type = TouchInput; + } else if (!SUPPORT_TOUCH) { + Type = MouseInput; + } else { + Type = TouchMouseInput; + } + return new (Type)(manager, inputHandler); +} + +/** + * handle input events + * @param {Manager} manager + * @param {String} eventType + * @param {Object} input + */ +function inputHandler(manager, eventType, input) { + var pointersLen = input.pointers.length; + var changedPointersLen = input.changedPointers.length; + var isFirst = (eventType & INPUT_START && (pointersLen - changedPointersLen === 0)); + var isFinal = (eventType & (INPUT_END | INPUT_CANCEL) && (pointersLen - changedPointersLen === 0)); + + input.isFirst = !!isFirst; + input.isFinal = !!isFinal; + + if (isFirst) { + manager.session = {}; + } + + // source event is the normalized value of the domEvents + // like 'touchstart, mouseup, pointerdown' + input.eventType = eventType; + + // compute scale, rotation etc + computeInputData(manager, input); + + // emit secret event + manager.emit('hammer.input', input); + + manager.recognize(input); + manager.session.prevInput = input; +} + +/** + * extend the data with some usable properties like scale, rotate, velocity etc + * @param {Object} manager + * @param {Object} input + */ +function computeInputData(manager, input) { + var session = manager.session; + var pointers = input.pointers; + var pointersLength = pointers.length; + + // store the first input to calculate the distance and direction + if (!session.firstInput) { + session.firstInput = simpleCloneInputData(input); + } + + // to compute scale and rotation we need to store the multiple touches + if (pointersLength > 1 && !session.firstMultiple) { + session.firstMultiple = simpleCloneInputData(input); + } else if (pointersLength === 1) { + session.firstMultiple = false; + } + + var firstInput = session.firstInput; + var firstMultiple = session.firstMultiple; + var offsetCenter = firstMultiple ? firstMultiple.center : firstInput.center; + + var center = input.center = getCenter(pointers); + input.timeStamp = now(); + input.deltaTime = input.timeStamp - firstInput.timeStamp; + + input.angle = getAngle(offsetCenter, center); + input.distance = getDistance(offsetCenter, center); + + computeDeltaXY(session, input); + input.offsetDirection = getDirection(input.deltaX, input.deltaY); + + var overallVelocity = getVelocity(input.deltaTime, input.deltaX, input.deltaY); + input.overallVelocityX = overallVelocity.x; + input.overallVelocityY = overallVelocity.y; + input.overallVelocity = (abs(overallVelocity.x) > abs(overallVelocity.y)) ? overallVelocity.x : overallVelocity.y; + + input.scale = firstMultiple ? getScale(firstMultiple.pointers, pointers) : 1; + input.rotation = firstMultiple ? getRotation(firstMultiple.pointers, pointers) : 0; + + input.maxPointers = !session.prevInput ? input.pointers.length : ((input.pointers.length > + session.prevInput.maxPointers) ? input.pointers.length : session.prevInput.maxPointers); + + computeIntervalInputData(session, input); + + // find the correct target + var target = manager.element; + if (hasParent(input.srcEvent.target, target)) { + target = input.srcEvent.target; + } + input.target = target; +} + +function computeDeltaXY(session, input) { + var center = input.center; + var offset = session.offsetDelta || {}; + var prevDelta = session.prevDelta || {}; + var prevInput = session.prevInput || {}; + + if (input.eventType === INPUT_START || prevInput.eventType === INPUT_END) { + prevDelta = session.prevDelta = { + x: prevInput.deltaX || 0, + y: prevInput.deltaY || 0 + }; + + offset = session.offsetDelta = { + x: center.x, + y: center.y + }; + } + + input.deltaX = prevDelta.x + (center.x - offset.x); + input.deltaY = prevDelta.y + (center.y - offset.y); +} + +/** + * velocity is calculated every x ms + * @param {Object} session + * @param {Object} input + */ +function computeIntervalInputData(session, input) { + var last = session.lastInterval || input, + deltaTime = input.timeStamp - last.timeStamp, + velocity, velocityX, velocityY, direction; + + if (input.eventType != INPUT_CANCEL && (deltaTime > COMPUTE_INTERVAL || last.velocity === undefined)) { + var deltaX = input.deltaX - last.deltaX; + var deltaY = input.deltaY - last.deltaY; + + var v = getVelocity(deltaTime, deltaX, deltaY); + velocityX = v.x; + velocityY = v.y; + velocity = (abs(v.x) > abs(v.y)) ? v.x : v.y; + direction = getDirection(deltaX, deltaY); + + session.lastInterval = input; + } else { + // use latest velocity info if it doesn't overtake a minimum period + velocity = last.velocity; + velocityX = last.velocityX; + velocityY = last.velocityY; + direction = last.direction; + } + + input.velocity = velocity; + input.velocityX = velocityX; + input.velocityY = velocityY; + input.direction = direction; +} + +/** + * create a simple clone from the input used for storage of firstInput and firstMultiple + * @param {Object} input + * @returns {Object} clonedInputData + */ +function simpleCloneInputData(input) { + // make a simple copy of the pointers because we will get a reference if we don't + // we only need clientXY for the calculations + var pointers = []; + var i = 0; + while (i < input.pointers.length) { + pointers[i] = { + clientX: round(input.pointers[i].clientX), + clientY: round(input.pointers[i].clientY) + }; + i++; + } + + return { + timeStamp: now(), + pointers: pointers, + center: getCenter(pointers), + deltaX: input.deltaX, + deltaY: input.deltaY + }; +} + +/** + * get the center of all the pointers + * @param {Array} pointers + * @return {Object} center contains `x` and `y` properties + */ +function getCenter(pointers) { + var pointersLength = pointers.length; + + // no need to loop when only one touch + if (pointersLength === 1) { + return { + x: round(pointers[0].clientX), + y: round(pointers[0].clientY) + }; + } + + var x = 0, y = 0, i = 0; + while (i < pointersLength) { + x += pointers[i].clientX; + y += pointers[i].clientY; + i++; + } + + return { + x: round(x / pointersLength), + y: round(y / pointersLength) + }; +} + +/** + * calculate the velocity between two points. unit is in px per ms. + * @param {Number} deltaTime + * @param {Number} x + * @param {Number} y + * @return {Object} velocity `x` and `y` + */ +function getVelocity(deltaTime, x, y) { + return { + x: x / deltaTime || 0, + y: y / deltaTime || 0 + }; +} + +/** + * get the direction between two points + * @param {Number} x + * @param {Number} y + * @return {Number} direction + */ +function getDirection(x, y) { + if (x === y) { + return DIRECTION_NONE; + } + + if (abs(x) >= abs(y)) { + return x < 0 ? DIRECTION_LEFT : DIRECTION_RIGHT; + } + return y < 0 ? DIRECTION_UP : DIRECTION_DOWN; +} + +/** + * calculate the absolute distance between two points + * @param {Object} p1 {x, y} + * @param {Object} p2 {x, y} + * @param {Array} [props] containing x and y keys + * @return {Number} distance + */ +function getDistance(p1, p2, props) { + if (!props) { + props = PROPS_XY; + } + var x = p2[props[0]] - p1[props[0]], + y = p2[props[1]] - p1[props[1]]; + + return Math.sqrt((x * x) + (y * y)); +} + +/** + * calculate the angle between two coordinates + * @param {Object} p1 + * @param {Object} p2 + * @param {Array} [props] containing x and y keys + * @return {Number} angle + */ +function getAngle(p1, p2, props) { + if (!props) { + props = PROPS_XY; + } + var x = p2[props[0]] - p1[props[0]], + y = p2[props[1]] - p1[props[1]]; + return Math.atan2(y, x) * 180 / Math.PI; +} + +/** + * calculate the rotation degrees between two pointersets + * @param {Array} start array of pointers + * @param {Array} end array of pointers + * @return {Number} rotation + */ +function getRotation(start, end) { + return getAngle(end[1], end[0], PROPS_CLIENT_XY) + getAngle(start[1], start[0], PROPS_CLIENT_XY); +} + +/** + * calculate the scale factor between two pointersets + * no scale is 1, and goes down to 0 when pinched together, and bigger when pinched out + * @param {Array} start array of pointers + * @param {Array} end array of pointers + * @return {Number} scale + */ +function getScale(start, end) { + return getDistance(end[0], end[1], PROPS_CLIENT_XY) / getDistance(start[0], start[1], PROPS_CLIENT_XY); +} + +var MOUSE_INPUT_MAP = { + mousedown: INPUT_START, + mousemove: INPUT_MOVE, + mouseup: INPUT_END +}; + +var MOUSE_ELEMENT_EVENTS = 'mousedown'; +var MOUSE_WINDOW_EVENTS = 'mousemove mouseup'; + +/** + * Mouse events input + * @constructor + * @extends Input + */ +function MouseInput() { + this.evEl = MOUSE_ELEMENT_EVENTS; + this.evWin = MOUSE_WINDOW_EVENTS; + + this.pressed = false; // mousedown state + + Input.apply(this, arguments); +} + +inherit(MouseInput, Input, { + /** + * handle mouse events + * @param {Object} ev + */ + handler: function MEhandler(ev) { + var eventType = MOUSE_INPUT_MAP[ev.type]; + + // on start we want to have the left mouse button down + if (eventType & INPUT_START && ev.button === 0) { + this.pressed = true; + } + + if (eventType & INPUT_MOVE && ev.which !== 1) { + eventType = INPUT_END; + } + + // mouse must be down + if (!this.pressed) { + return; + } + + if (eventType & INPUT_END) { + this.pressed = false; + } + + this.callback(this.manager, eventType, { + pointers: [ev], + changedPointers: [ev], + pointerType: INPUT_TYPE_MOUSE, + srcEvent: ev + }); + } +}); + +var POINTER_INPUT_MAP = { + pointerdown: INPUT_START, + pointermove: INPUT_MOVE, + pointerup: INPUT_END, + pointercancel: INPUT_CANCEL, + pointerout: INPUT_CANCEL +}; + +// in IE10 the pointer types is defined as an enum +var IE10_POINTER_TYPE_ENUM = { + 2: INPUT_TYPE_TOUCH, + 3: INPUT_TYPE_PEN, + 4: INPUT_TYPE_MOUSE, + 5: INPUT_TYPE_KINECT // see https://twitter.com/jacobrossi/status/480596438489890816 +}; + +var POINTER_ELEMENT_EVENTS = 'pointerdown'; +var POINTER_WINDOW_EVENTS = 'pointermove pointerup pointercancel'; + +// IE10 has prefixed support, and case-sensitive +if (window.MSPointerEvent && !window.PointerEvent) { + POINTER_ELEMENT_EVENTS = 'MSPointerDown'; + POINTER_WINDOW_EVENTS = 'MSPointerMove MSPointerUp MSPointerCancel'; +} + +/** + * Pointer events input + * @constructor + * @extends Input + */ +function PointerEventInput() { + this.evEl = POINTER_ELEMENT_EVENTS; + this.evWin = POINTER_WINDOW_EVENTS; + + Input.apply(this, arguments); + + this.store = (this.manager.session.pointerEvents = []); +} + +inherit(PointerEventInput, Input, { + /** + * handle mouse events + * @param {Object} ev + */ + handler: function PEhandler(ev) { + var store = this.store; + var removePointer = false; + + var eventTypeNormalized = ev.type.toLowerCase().replace('ms', ''); + var eventType = POINTER_INPUT_MAP[eventTypeNormalized]; + var pointerType = IE10_POINTER_TYPE_ENUM[ev.pointerType] || ev.pointerType; + + var isTouch = (pointerType == INPUT_TYPE_TOUCH); + + // get index of the event in the store + var storeIndex = inArray(store, ev.pointerId, 'pointerId'); + + // start and mouse must be down + if (eventType & INPUT_START && (ev.button === 0 || isTouch)) { + if (storeIndex < 0) { + store.push(ev); + storeIndex = store.length - 1; + } + } else if (eventType & (INPUT_END | INPUT_CANCEL)) { + removePointer = true; + } + + // it not found, so the pointer hasn't been down (so it's probably a hover) + if (storeIndex < 0) { + return; + } + + // update the event in the store + store[storeIndex] = ev; + + this.callback(this.manager, eventType, { + pointers: store, + changedPointers: [ev], + pointerType: pointerType, + srcEvent: ev + }); + + if (removePointer) { + // remove from the store + store.splice(storeIndex, 1); + } + } +}); + +var SINGLE_TOUCH_INPUT_MAP = { + touchstart: INPUT_START, + touchmove: INPUT_MOVE, + touchend: INPUT_END, + touchcancel: INPUT_CANCEL +}; + +var SINGLE_TOUCH_TARGET_EVENTS = 'touchstart'; +var SINGLE_TOUCH_WINDOW_EVENTS = 'touchstart touchmove touchend touchcancel'; + +/** + * Touch events input + * @constructor + * @extends Input + */ +function SingleTouchInput() { + this.evTarget = SINGLE_TOUCH_TARGET_EVENTS; + this.evWin = SINGLE_TOUCH_WINDOW_EVENTS; + this.started = false; + + Input.apply(this, arguments); +} + +inherit(SingleTouchInput, Input, { + handler: function TEhandler(ev) { + var type = SINGLE_TOUCH_INPUT_MAP[ev.type]; + + // should we handle the touch events? + if (type === INPUT_START) { + this.started = true; + } + + if (!this.started) { + return; + } + + var touches = normalizeSingleTouches.call(this, ev, type); + + // when done, reset the started state + if (type & (INPUT_END | INPUT_CANCEL) && touches[0].length - touches[1].length === 0) { + this.started = false; + } + + this.callback(this.manager, type, { + pointers: touches[0], + changedPointers: touches[1], + pointerType: INPUT_TYPE_TOUCH, + srcEvent: ev + }); + } +}); + +/** + * @this {TouchInput} + * @param {Object} ev + * @param {Number} type flag + * @returns {undefined|Array} [all, changed] + */ +function normalizeSingleTouches(ev, type) { + var all = toArray(ev.touches); + var changed = toArray(ev.changedTouches); + + if (type & (INPUT_END | INPUT_CANCEL)) { + all = uniqueArray(all.concat(changed), 'identifier', true); + } + + return [all, changed]; +} + +var TOUCH_INPUT_MAP = { + touchstart: INPUT_START, + touchmove: INPUT_MOVE, + touchend: INPUT_END, + touchcancel: INPUT_CANCEL +}; + +var TOUCH_TARGET_EVENTS = 'touchstart touchmove touchend touchcancel'; + +/** + * Multi-user touch events input + * @constructor + * @extends Input + */ +function TouchInput() { + this.evTarget = TOUCH_TARGET_EVENTS; + this.targetIds = {}; + + Input.apply(this, arguments); +} + +inherit(TouchInput, Input, { + handler: function MTEhandler(ev) { + var type = TOUCH_INPUT_MAP[ev.type]; + var touches = getTouches.call(this, ev, type); + if (!touches) { + return; + } + + this.callback(this.manager, type, { + pointers: touches[0], + changedPointers: touches[1], + pointerType: INPUT_TYPE_TOUCH, + srcEvent: ev + }); + } +}); + +/** + * @this {TouchInput} + * @param {Object} ev + * @param {Number} type flag + * @returns {undefined|Array} [all, changed] + */ +function getTouches(ev, type) { + var allTouches = toArray(ev.touches); + var targetIds = this.targetIds; + + // when there is only one touch, the process can be simplified + if (type & (INPUT_START | INPUT_MOVE) && allTouches.length === 1) { + targetIds[allTouches[0].identifier] = true; + return [allTouches, allTouches]; + } + + var i, + targetTouches, + changedTouches = toArray(ev.changedTouches), + changedTargetTouches = [], + target = this.target; + + // get target touches from touches + targetTouches = allTouches.filter(function(touch) { + return hasParent(touch.target, target); + }); + + // collect touches + if (type === INPUT_START) { + i = 0; + while (i < targetTouches.length) { + targetIds[targetTouches[i].identifier] = true; + i++; + } + } + + // filter changed touches to only contain touches that exist in the collected target ids + i = 0; + while (i < changedTouches.length) { + if (targetIds[changedTouches[i].identifier]) { + changedTargetTouches.push(changedTouches[i]); + } + + // cleanup removed touches + if (type & (INPUT_END | INPUT_CANCEL)) { + delete targetIds[changedTouches[i].identifier]; + } + i++; + } + + if (!changedTargetTouches.length) { + return; + } + + return [ + // merge targetTouches with changedTargetTouches so it contains ALL touches, including 'end' and 'cancel' + uniqueArray(targetTouches.concat(changedTargetTouches), 'identifier', true), + changedTargetTouches + ]; +} + +/** + * Combined touch and mouse input + * + * Touch has a higher priority then mouse, and while touching no mouse events are allowed. + * This because touch devices also emit mouse events while doing a touch. + * + * @constructor + * @extends Input + */ + +var DEDUP_TIMEOUT = 2500; +var DEDUP_DISTANCE = 25; + +function TouchMouseInput() { + Input.apply(this, arguments); + + var handler = bindFn(this.handler, this); + this.touch = new TouchInput(this.manager, handler); + this.mouse = new MouseInput(this.manager, handler); + + this.primaryTouch = null; + this.lastTouches = []; +} + +inherit(TouchMouseInput, Input, { + /** + * handle mouse and touch events + * @param {Hammer} manager + * @param {String} inputEvent + * @param {Object} inputData + */ + handler: function TMEhandler(manager, inputEvent, inputData) { + var isTouch = (inputData.pointerType == INPUT_TYPE_TOUCH), + isMouse = (inputData.pointerType == INPUT_TYPE_MOUSE); + + if (isMouse && inputData.sourceCapabilities && inputData.sourceCapabilities.firesTouchEvents) { + return; + } + + // when we're in a touch event, record touches to de-dupe synthetic mouse event + if (isTouch) { + recordTouches.call(this, inputEvent, inputData); + } else if (isMouse && isSyntheticEvent.call(this, inputData)) { + return; + } + + this.callback(manager, inputEvent, inputData); + }, + + /** + * remove the event listeners + */ + destroy: function destroy() { + this.touch.destroy(); + this.mouse.destroy(); + } +}); + +function recordTouches(eventType, eventData) { + if (eventType & INPUT_START) { + this.primaryTouch = eventData.changedPointers[0].identifier; + setLastTouch.call(this, eventData); + } else if (eventType & (INPUT_END | INPUT_CANCEL)) { + setLastTouch.call(this, eventData); + } +} + +function setLastTouch(eventData) { + var touch = eventData.changedPointers[0]; + + if (touch.identifier === this.primaryTouch) { + var lastTouch = {x: touch.clientX, y: touch.clientY}; + this.lastTouches.push(lastTouch); + var lts = this.lastTouches; + var removeLastTouch = function() { + var i = lts.indexOf(lastTouch); + if (i > -1) { + lts.splice(i, 1); + } + }; + setTimeout(removeLastTouch, DEDUP_TIMEOUT); + } +} + +function isSyntheticEvent(eventData) { + var x = eventData.srcEvent.clientX, y = eventData.srcEvent.clientY; + for (var i = 0; i < this.lastTouches.length; i++) { + var t = this.lastTouches[i]; + var dx = Math.abs(x - t.x), dy = Math.abs(y - t.y); + if (dx <= DEDUP_DISTANCE && dy <= DEDUP_DISTANCE) { + return true; + } + } + return false; +} + +var PREFIXED_TOUCH_ACTION = prefixed(TEST_ELEMENT.style, 'touchAction'); +var NATIVE_TOUCH_ACTION = PREFIXED_TOUCH_ACTION !== undefined; + +// magical touchAction value +var TOUCH_ACTION_COMPUTE = 'compute'; +var TOUCH_ACTION_AUTO = 'auto'; +var TOUCH_ACTION_MANIPULATION = 'manipulation'; // not implemented +var TOUCH_ACTION_NONE = 'none'; +var TOUCH_ACTION_PAN_X = 'pan-x'; +var TOUCH_ACTION_PAN_Y = 'pan-y'; +var TOUCH_ACTION_MAP = getTouchActionProps(); + +/** + * Touch Action + * sets the touchAction property or uses the js alternative + * @param {Manager} manager + * @param {String} value + * @constructor + */ +function TouchAction(manager, value) { + this.manager = manager; + this.set(value); +} + +TouchAction.prototype = { + /** + * set the touchAction value on the element or enable the polyfill + * @param {String} value + */ + set: function(value) { + // find out the touch-action by the event handlers + if (value == TOUCH_ACTION_COMPUTE) { + value = this.compute(); + } + + if (NATIVE_TOUCH_ACTION && this.manager.element.style && TOUCH_ACTION_MAP[value]) { + this.manager.element.style[PREFIXED_TOUCH_ACTION] = value; + } + this.actions = value.toLowerCase().trim(); + }, + + /** + * just re-set the touchAction value + */ + update: function() { + this.set(this.manager.options.touchAction); + }, + + /** + * compute the value for the touchAction property based on the recognizer's settings + * @returns {String} value + */ + compute: function() { + var actions = []; + each(this.manager.recognizers, function(recognizer) { + if (boolOrFn(recognizer.options.enable, [recognizer])) { + actions = actions.concat(recognizer.getTouchAction()); + } + }); + return cleanTouchActions(actions.join(' ')); + }, + + /** + * this method is called on each input cycle and provides the preventing of the browser behavior + * @param {Object} input + */ + preventDefaults: function(input) { + var srcEvent = input.srcEvent; + var direction = input.offsetDirection; + + // if the touch action did prevented once this session + if (this.manager.session.prevented) { + srcEvent.preventDefault(); + return; + } + + var actions = this.actions; + var hasNone = inStr(actions, TOUCH_ACTION_NONE) && !TOUCH_ACTION_MAP[TOUCH_ACTION_NONE]; + var hasPanY = inStr(actions, TOUCH_ACTION_PAN_Y) && !TOUCH_ACTION_MAP[TOUCH_ACTION_PAN_Y]; + var hasPanX = inStr(actions, TOUCH_ACTION_PAN_X) && !TOUCH_ACTION_MAP[TOUCH_ACTION_PAN_X]; + + if (hasNone) { + //do not prevent defaults if this is a tap gesture + + var isTapPointer = input.pointers.length === 1; + var isTapMovement = input.distance < 2; + var isTapTouchTime = input.deltaTime < 250; + + if (isTapPointer && isTapMovement && isTapTouchTime) { + return; + } + } + + if (hasPanX && hasPanY) { + // `pan-x pan-y` means browser handles all scrolling/panning, do not prevent + return; + } + + if (hasNone || + (hasPanY && direction & DIRECTION_HORIZONTAL) || + (hasPanX && direction & DIRECTION_VERTICAL)) { + return this.preventSrc(srcEvent); + } + }, + + /** + * call preventDefault to prevent the browser's default behavior (scrolling in most cases) + * @param {Object} srcEvent + */ + preventSrc: function(srcEvent) { + this.manager.session.prevented = true; + srcEvent.preventDefault(); + } +}; + +/** + * when the touchActions are collected they are not a valid value, so we need to clean things up. * + * @param {String} actions + * @returns {*} + */ +function cleanTouchActions(actions) { + // none + if (inStr(actions, TOUCH_ACTION_NONE)) { + return TOUCH_ACTION_NONE; + } + + var hasPanX = inStr(actions, TOUCH_ACTION_PAN_X); + var hasPanY = inStr(actions, TOUCH_ACTION_PAN_Y); + + // if both pan-x and pan-y are set (different recognizers + // for different directions, e.g. horizontal pan but vertical swipe?) + // we need none (as otherwise with pan-x pan-y combined none of these + // recognizers will work, since the browser would handle all panning + if (hasPanX && hasPanY) { + return TOUCH_ACTION_NONE; + } + + // pan-x OR pan-y + if (hasPanX || hasPanY) { + return hasPanX ? TOUCH_ACTION_PAN_X : TOUCH_ACTION_PAN_Y; + } + + // manipulation + if (inStr(actions, TOUCH_ACTION_MANIPULATION)) { + return TOUCH_ACTION_MANIPULATION; + } + + return TOUCH_ACTION_AUTO; +} + +function getTouchActionProps() { + if (!NATIVE_TOUCH_ACTION) { + return false; + } + var touchMap = {}; + var cssSupports = window.CSS && window.CSS.supports; + ['auto', 'manipulation', 'pan-y', 'pan-x', 'pan-x pan-y', 'none'].forEach(function(val) { + + // If css.supports is not supported but there is native touch-action assume it supports + // all values. This is the case for IE 10 and 11. + touchMap[val] = cssSupports ? window.CSS.supports('touch-action', val) : true; + }); + return touchMap; +} + +/** + * Recognizer flow explained; * + * All recognizers have the initial state of POSSIBLE when a input session starts. + * The definition of a input session is from the first input until the last input, with all it's movement in it. * + * Example session for mouse-input: mousedown -> mousemove -> mouseup + * + * On each recognizing cycle (see Manager.recognize) the .recognize() method is executed + * which determines with state it should be. + * + * If the recognizer has the state FAILED, CANCELLED or RECOGNIZED (equals ENDED), it is reset to + * POSSIBLE to give it another change on the next cycle. + * + * Possible + * | + * +-----+---------------+ + * | | + * +-----+-----+ | + * | | | + * Failed Cancelled | + * +-------+------+ + * | | + * Recognized Began + * | + * Changed + * | + * Ended/Recognized + */ +var STATE_POSSIBLE = 1; +var STATE_BEGAN = 2; +var STATE_CHANGED = 4; +var STATE_ENDED = 8; +var STATE_RECOGNIZED = STATE_ENDED; +var STATE_CANCELLED = 16; +var STATE_FAILED = 32; + +/** + * Recognizer + * Every recognizer needs to extend from this class. + * @constructor + * @param {Object} options + */ +function Recognizer(options) { + this.options = assign({}, this.defaults, options || {}); + + this.id = uniqueId(); + + this.manager = null; + + // default is enable true + this.options.enable = ifUndefined(this.options.enable, true); + + this.state = STATE_POSSIBLE; + + this.simultaneous = {}; + this.requireFail = []; +} + +Recognizer.prototype = { + /** + * @virtual + * @type {Object} + */ + defaults: {}, + + /** + * set options + * @param {Object} options + * @return {Recognizer} + */ + set: function(options) { + assign(this.options, options); + + // also update the touchAction, in case something changed about the directions/enabled state + this.manager && this.manager.touchAction.update(); + return this; + }, + + /** + * recognize simultaneous with an other recognizer. + * @param {Recognizer} otherRecognizer + * @returns {Recognizer} this + */ + recognizeWith: function(otherRecognizer) { + if (invokeArrayArg(otherRecognizer, 'recognizeWith', this)) { + return this; + } + + var simultaneous = this.simultaneous; + otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); + if (!simultaneous[otherRecognizer.id]) { + simultaneous[otherRecognizer.id] = otherRecognizer; + otherRecognizer.recognizeWith(this); + } + return this; + }, + + /** + * drop the simultaneous link. it doesnt remove the link on the other recognizer. + * @param {Recognizer} otherRecognizer + * @returns {Recognizer} this + */ + dropRecognizeWith: function(otherRecognizer) { + if (invokeArrayArg(otherRecognizer, 'dropRecognizeWith', this)) { + return this; + } + + otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); + delete this.simultaneous[otherRecognizer.id]; + return this; + }, + + /** + * recognizer can only run when an other is failing + * @param {Recognizer} otherRecognizer + * @returns {Recognizer} this + */ + requireFailure: function(otherRecognizer) { + if (invokeArrayArg(otherRecognizer, 'requireFailure', this)) { + return this; + } + + var requireFail = this.requireFail; + otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); + if (inArray(requireFail, otherRecognizer) === -1) { + requireFail.push(otherRecognizer); + otherRecognizer.requireFailure(this); + } + return this; + }, + + /** + * drop the requireFailure link. it does not remove the link on the other recognizer. + * @param {Recognizer} otherRecognizer + * @returns {Recognizer} this + */ + dropRequireFailure: function(otherRecognizer) { + if (invokeArrayArg(otherRecognizer, 'dropRequireFailure', this)) { + return this; + } + + otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); + var index = inArray(this.requireFail, otherRecognizer); + if (index > -1) { + this.requireFail.splice(index, 1); + } + return this; + }, + + /** + * has require failures boolean + * @returns {boolean} + */ + hasRequireFailures: function() { + return this.requireFail.length > 0; + }, + + /** + * if the recognizer can recognize simultaneous with an other recognizer + * @param {Recognizer} otherRecognizer + * @returns {Boolean} + */ + canRecognizeWith: function(otherRecognizer) { + return !!this.simultaneous[otherRecognizer.id]; + }, + + /** + * You should use `tryEmit` instead of `emit` directly to check + * that all the needed recognizers has failed before emitting. + * @param {Object} input + */ + emit: function(input) { + var self = this; + var state = this.state; + + function emit(event) { + self.manager.emit(event, input); + } + + // 'panstart' and 'panmove' + if (state < STATE_ENDED) { + emit(self.options.event + stateStr(state)); + } + + emit(self.options.event); // simple 'eventName' events + + if (input.additionalEvent) { // additional event(panleft, panright, pinchin, pinchout...) + emit(input.additionalEvent); + } + + // panend and pancancel + if (state >= STATE_ENDED) { + emit(self.options.event + stateStr(state)); + } + }, + + /** + * Check that all the require failure recognizers has failed, + * if true, it emits a gesture event, + * otherwise, setup the state to FAILED. + * @param {Object} input + */ + tryEmit: function(input) { + if (this.canEmit()) { + return this.emit(input); + } + // it's failing anyway + this.state = STATE_FAILED; + }, + + /** + * can we emit? + * @returns {boolean} + */ + canEmit: function() { + var i = 0; + while (i < this.requireFail.length) { + if (!(this.requireFail[i].state & (STATE_FAILED | STATE_POSSIBLE))) { + return false; + } + i++; + } + return true; + }, + + /** + * update the recognizer + * @param {Object} inputData + */ + recognize: function(inputData) { + // make a new copy of the inputData + // so we can change the inputData without messing up the other recognizers + var inputDataClone = assign({}, inputData); + + // is is enabled and allow recognizing? + if (!boolOrFn(this.options.enable, [this, inputDataClone])) { + this.reset(); + this.state = STATE_FAILED; + return; + } + + // reset when we've reached the end + if (this.state & (STATE_RECOGNIZED | STATE_CANCELLED | STATE_FAILED)) { + this.state = STATE_POSSIBLE; + } + + this.state = this.process(inputDataClone); + + // the recognizer has recognized a gesture + // so trigger an event + if (this.state & (STATE_BEGAN | STATE_CHANGED | STATE_ENDED | STATE_CANCELLED)) { + this.tryEmit(inputDataClone); + } + }, + + /** + * return the state of the recognizer + * the actual recognizing happens in this method + * @virtual + * @param {Object} inputData + * @returns {Const} STATE + */ + process: function(inputData) { }, // jshint ignore:line + + /** + * return the preferred touch-action + * @virtual + * @returns {Array} + */ + getTouchAction: function() { }, + + /** + * called when the gesture isn't allowed to recognize + * like when another is being recognized or it is disabled + * @virtual + */ + reset: function() { } +}; + +/** + * get a usable string, used as event postfix + * @param {Const} state + * @returns {String} state + */ +function stateStr(state) { + if (state & STATE_CANCELLED) { + return 'cancel'; + } else if (state & STATE_ENDED) { + return 'end'; + } else if (state & STATE_CHANGED) { + return 'move'; + } else if (state & STATE_BEGAN) { + return 'start'; + } + return ''; +} + +/** + * direction cons to string + * @param {Const} direction + * @returns {String} + */ +function directionStr(direction) { + if (direction == DIRECTION_DOWN) { + return 'down'; + } else if (direction == DIRECTION_UP) { + return 'up'; + } else if (direction == DIRECTION_LEFT) { + return 'left'; + } else if (direction == DIRECTION_RIGHT) { + return 'right'; + } + return ''; +} + +/** + * get a recognizer by name if it is bound to a manager + * @param {Recognizer|String} otherRecognizer + * @param {Recognizer} recognizer + * @returns {Recognizer} + */ +function getRecognizerByNameIfManager(otherRecognizer, recognizer) { + var manager = recognizer.manager; + if (manager) { + return manager.get(otherRecognizer); + } + return otherRecognizer; +} + +/** + * This recognizer is just used as a base for the simple attribute recognizers. + * @constructor + * @extends Recognizer + */ +function AttrRecognizer() { + Recognizer.apply(this, arguments); +} + +inherit(AttrRecognizer, Recognizer, { + /** + * @namespace + * @memberof AttrRecognizer + */ + defaults: { + /** + * @type {Number} + * @default 1 + */ + pointers: 1 + }, + + /** + * Used to check if it the recognizer receives valid input, like input.distance > 10. + * @memberof AttrRecognizer + * @param {Object} input + * @returns {Boolean} recognized + */ + attrTest: function(input) { + var optionPointers = this.options.pointers; + return optionPointers === 0 || input.pointers.length === optionPointers; + }, + + /** + * Process the input and return the state for the recognizer + * @memberof AttrRecognizer + * @param {Object} input + * @returns {*} State + */ + process: function(input) { + var state = this.state; + var eventType = input.eventType; + + var isRecognized = state & (STATE_BEGAN | STATE_CHANGED); + var isValid = this.attrTest(input); + + // on cancel input and we've recognized before, return STATE_CANCELLED + if (isRecognized && (eventType & INPUT_CANCEL || !isValid)) { + return state | STATE_CANCELLED; + } else if (isRecognized || isValid) { + if (eventType & INPUT_END) { + return state | STATE_ENDED; + } else if (!(state & STATE_BEGAN)) { + return STATE_BEGAN; + } + return state | STATE_CHANGED; + } + return STATE_FAILED; + } +}); + +/** + * Pan + * Recognized when the pointer is down and moved in the allowed direction. + * @constructor + * @extends AttrRecognizer + */ +function PanRecognizer() { + AttrRecognizer.apply(this, arguments); + + this.pX = null; + this.pY = null; +} + +inherit(PanRecognizer, AttrRecognizer, { + /** + * @namespace + * @memberof PanRecognizer + */ + defaults: { + event: 'pan', + threshold: 10, + pointers: 1, + direction: DIRECTION_ALL + }, + + getTouchAction: function() { + var direction = this.options.direction; + var actions = []; + if (direction & DIRECTION_HORIZONTAL) { + actions.push(TOUCH_ACTION_PAN_Y); + } + if (direction & DIRECTION_VERTICAL) { + actions.push(TOUCH_ACTION_PAN_X); + } + return actions; + }, + + directionTest: function(input) { + var options = this.options; + var hasMoved = true; + var distance = input.distance; + var direction = input.direction; + var x = input.deltaX; + var y = input.deltaY; + + // lock to axis? + if (!(direction & options.direction)) { + if (options.direction & DIRECTION_HORIZONTAL) { + direction = (x === 0) ? DIRECTION_NONE : (x < 0) ? DIRECTION_LEFT : DIRECTION_RIGHT; + hasMoved = x != this.pX; + distance = Math.abs(input.deltaX); + } else { + direction = (y === 0) ? DIRECTION_NONE : (y < 0) ? DIRECTION_UP : DIRECTION_DOWN; + hasMoved = y != this.pY; + distance = Math.abs(input.deltaY); + } + } + input.direction = direction; + return hasMoved && distance > options.threshold && direction & options.direction; + }, + + attrTest: function(input) { + return AttrRecognizer.prototype.attrTest.call(this, input) && + (this.state & STATE_BEGAN || (!(this.state & STATE_BEGAN) && this.directionTest(input))); + }, + + emit: function(input) { + + this.pX = input.deltaX; + this.pY = input.deltaY; + + var direction = directionStr(input.direction); + + if (direction) { + input.additionalEvent = this.options.event + direction; + } + this._super.emit.call(this, input); + } +}); + +/** + * Pinch + * Recognized when two or more pointers are moving toward (zoom-in) or away from each other (zoom-out). + * @constructor + * @extends AttrRecognizer + */ +function PinchRecognizer() { + AttrRecognizer.apply(this, arguments); +} + +inherit(PinchRecognizer, AttrRecognizer, { + /** + * @namespace + * @memberof PinchRecognizer + */ + defaults: { + event: 'pinch', + threshold: 0, + pointers: 2 + }, + + getTouchAction: function() { + return [TOUCH_ACTION_NONE]; + }, + + attrTest: function(input) { + return this._super.attrTest.call(this, input) && + (Math.abs(input.scale - 1) > this.options.threshold || this.state & STATE_BEGAN); + }, + + emit: function(input) { + if (input.scale !== 1) { + var inOut = input.scale < 1 ? 'in' : 'out'; + input.additionalEvent = this.options.event + inOut; + } + this._super.emit.call(this, input); + } +}); + +/** + * Press + * Recognized when the pointer is down for x ms without any movement. + * @constructor + * @extends Recognizer + */ +function PressRecognizer() { + Recognizer.apply(this, arguments); + + this._timer = null; + this._input = null; +} + +inherit(PressRecognizer, Recognizer, { + /** + * @namespace + * @memberof PressRecognizer + */ + defaults: { + event: 'press', + pointers: 1, + time: 251, // minimal time of the pointer to be pressed + threshold: 9 // a minimal movement is ok, but keep it low + }, + + getTouchAction: function() { + return [TOUCH_ACTION_AUTO]; + }, + + process: function(input) { + var options = this.options; + var validPointers = input.pointers.length === options.pointers; + var validMovement = input.distance < options.threshold; + var validTime = input.deltaTime > options.time; + + this._input = input; + + // we only allow little movement + // and we've reached an end event, so a tap is possible + if (!validMovement || !validPointers || (input.eventType & (INPUT_END | INPUT_CANCEL) && !validTime)) { + this.reset(); + } else if (input.eventType & INPUT_START) { + this.reset(); + this._timer = setTimeoutContext(function() { + this.state = STATE_RECOGNIZED; + this.tryEmit(); + }, options.time, this); + } else if (input.eventType & INPUT_END) { + return STATE_RECOGNIZED; + } + return STATE_FAILED; + }, + + reset: function() { + clearTimeout(this._timer); + }, + + emit: function(input) { + if (this.state !== STATE_RECOGNIZED) { + return; + } + + if (input && (input.eventType & INPUT_END)) { + this.manager.emit(this.options.event + 'up', input); + } else { + this._input.timeStamp = now(); + this.manager.emit(this.options.event, this._input); + } + } +}); + +/** + * Rotate + * Recognized when two or more pointer are moving in a circular motion. + * @constructor + * @extends AttrRecognizer + */ +function RotateRecognizer() { + AttrRecognizer.apply(this, arguments); +} + +inherit(RotateRecognizer, AttrRecognizer, { + /** + * @namespace + * @memberof RotateRecognizer + */ + defaults: { + event: 'rotate', + threshold: 0, + pointers: 2 + }, + + getTouchAction: function() { + return [TOUCH_ACTION_NONE]; + }, + + attrTest: function(input) { + return this._super.attrTest.call(this, input) && + (Math.abs(input.rotation) > this.options.threshold || this.state & STATE_BEGAN); + } +}); + +/** + * Swipe + * Recognized when the pointer is moving fast (velocity), with enough distance in the allowed direction. + * @constructor + * @extends AttrRecognizer + */ +function SwipeRecognizer() { + AttrRecognizer.apply(this, arguments); +} + +inherit(SwipeRecognizer, AttrRecognizer, { + /** + * @namespace + * @memberof SwipeRecognizer + */ + defaults: { + event: 'swipe', + threshold: 10, + velocity: 0.3, + direction: DIRECTION_HORIZONTAL | DIRECTION_VERTICAL, + pointers: 1 + }, + + getTouchAction: function() { + return PanRecognizer.prototype.getTouchAction.call(this); + }, + + attrTest: function(input) { + var direction = this.options.direction; + var velocity; + + if (direction & (DIRECTION_HORIZONTAL | DIRECTION_VERTICAL)) { + velocity = input.overallVelocity; + } else if (direction & DIRECTION_HORIZONTAL) { + velocity = input.overallVelocityX; + } else if (direction & DIRECTION_VERTICAL) { + velocity = input.overallVelocityY; + } + + return this._super.attrTest.call(this, input) && + direction & input.offsetDirection && + input.distance > this.options.threshold && + input.maxPointers == this.options.pointers && + abs(velocity) > this.options.velocity && input.eventType & INPUT_END; + }, + + emit: function(input) { + var direction = directionStr(input.offsetDirection); + if (direction) { + this.manager.emit(this.options.event + direction, input); + } + + this.manager.emit(this.options.event, input); + } +}); + +/** + * A tap is ecognized when the pointer is doing a small tap/click. Multiple taps are recognized if they occur + * between the given interval and position. The delay option can be used to recognize multi-taps without firing + * a single tap. + * + * The eventData from the emitted event contains the property `tapCount`, which contains the amount of + * multi-taps being recognized. + * @constructor + * @extends Recognizer + */ +function TapRecognizer() { + Recognizer.apply(this, arguments); + + // previous time and center, + // used for tap counting + this.pTime = false; + this.pCenter = false; + + this._timer = null; + this._input = null; + this.count = 0; +} + +inherit(TapRecognizer, Recognizer, { + /** + * @namespace + * @memberof PinchRecognizer + */ + defaults: { + event: 'tap', + pointers: 1, + taps: 1, + interval: 300, // max time between the multi-tap taps + time: 250, // max time of the pointer to be down (like finger on the screen) + threshold: 9, // a minimal movement is ok, but keep it low + posThreshold: 10 // a multi-tap can be a bit off the initial position + }, + + getTouchAction: function() { + return [TOUCH_ACTION_MANIPULATION]; + }, + + process: function(input) { + var options = this.options; + + var validPointers = input.pointers.length === options.pointers; + var validMovement = input.distance < options.threshold; + var validTouchTime = input.deltaTime < options.time; + + this.reset(); + + if ((input.eventType & INPUT_START) && (this.count === 0)) { + return this.failTimeout(); + } + + // we only allow little movement + // and we've reached an end event, so a tap is possible + if (validMovement && validTouchTime && validPointers) { + if (input.eventType != INPUT_END) { + return this.failTimeout(); + } + + var validInterval = this.pTime ? (input.timeStamp - this.pTime < options.interval) : true; + var validMultiTap = !this.pCenter || getDistance(this.pCenter, input.center) < options.posThreshold; + + this.pTime = input.timeStamp; + this.pCenter = input.center; + + if (!validMultiTap || !validInterval) { + this.count = 1; + } else { + this.count += 1; + } + + this._input = input; + + // if tap count matches we have recognized it, + // else it has began recognizing... + var tapCount = this.count % options.taps; + if (tapCount === 0) { + // no failing requirements, immediately trigger the tap event + // or wait as long as the multitap interval to trigger + if (!this.hasRequireFailures()) { + return STATE_RECOGNIZED; + } else { + this._timer = setTimeoutContext(function() { + this.state = STATE_RECOGNIZED; + this.tryEmit(); + }, options.interval, this); + return STATE_BEGAN; + } + } + } + return STATE_FAILED; + }, + + failTimeout: function() { + this._timer = setTimeoutContext(function() { + this.state = STATE_FAILED; + }, this.options.interval, this); + return STATE_FAILED; + }, + + reset: function() { + clearTimeout(this._timer); + }, + + emit: function() { + if (this.state == STATE_RECOGNIZED) { + this._input.tapCount = this.count; + this.manager.emit(this.options.event, this._input); + } + } +}); + +/** + * Simple way to create a manager with a default set of recognizers. + * @param {HTMLElement} element + * @param {Object} [options] + * @constructor + */ +function Hammer(element, options) { + options = options || {}; + options.recognizers = ifUndefined(options.recognizers, Hammer.defaults.preset); + return new Manager(element, options); +} + +/** + * @const {string} + */ +Hammer.VERSION = '2.0.7'; + +/** + * default settings + * @namespace + */ +Hammer.defaults = { + /** + * set if DOM events are being triggered. + * But this is slower and unused by simple implementations, so disabled by default. + * @type {Boolean} + * @default false + */ + domEvents: false, + + /** + * The value for the touchAction property/fallback. + * When set to `compute` it will magically set the correct value based on the added recognizers. + * @type {String} + * @default compute + */ + touchAction: TOUCH_ACTION_COMPUTE, + + /** + * @type {Boolean} + * @default true + */ + enable: true, + + /** + * EXPERIMENTAL FEATURE -- can be removed/changed + * Change the parent input target element. + * If Null, then it is being set the to main element. + * @type {Null|EventTarget} + * @default null + */ + inputTarget: null, + + /** + * force an input class + * @type {Null|Function} + * @default null + */ + inputClass: null, + + /** + * Default recognizer setup when calling `Hammer()` + * When creating a new Manager these will be skipped. + * @type {Array} + */ + preset: [ + // RecognizerClass, options, [recognizeWith, ...], [requireFailure, ...] + [RotateRecognizer, {enable: false}], + [PinchRecognizer, {enable: false}, ['rotate']], + [SwipeRecognizer, {direction: DIRECTION_HORIZONTAL}], + [PanRecognizer, {direction: DIRECTION_HORIZONTAL}, ['swipe']], + [TapRecognizer], + [TapRecognizer, {event: 'doubletap', taps: 2}, ['tap']], + [PressRecognizer] + ], + + /** + * Some CSS properties can be used to improve the working of Hammer. + * Add them to this method and they will be set when creating a new Manager. + * @namespace + */ + cssProps: { + /** + * Disables text selection to improve the dragging gesture. Mainly for desktop browsers. + * @type {String} + * @default 'none' + */ + userSelect: 'none', + + /** + * Disable the Windows Phone grippers when pressing an element. + * @type {String} + * @default 'none' + */ + touchSelect: 'none', + + /** + * Disables the default callout shown when you touch and hold a touch target. + * On iOS, when you touch and hold a touch target such as a link, Safari displays + * a callout containing information about the link. This property allows you to disable that callout. + * @type {String} + * @default 'none' + */ + touchCallout: 'none', + + /** + * Specifies whether zooming is enabled. Used by IE10> + * @type {String} + * @default 'none' + */ + contentZooming: 'none', + + /** + * Specifies that an entire element should be draggable instead of its contents. Mainly for desktop browsers. + * @type {String} + * @default 'none' + */ + userDrag: 'none', + + /** + * Overrides the highlight color shown when the user taps a link or a JavaScript + * clickable element in iOS. This property obeys the alpha value, if specified. + * @type {String} + * @default 'rgba(0,0,0,0)' + */ + tapHighlightColor: 'rgba(0,0,0,0)' + } +}; + +var STOP = 1; +var FORCED_STOP = 2; + +/** + * Manager + * @param {HTMLElement} element + * @param {Object} [options] + * @constructor + */ +function Manager(element, options) { + this.options = assign({}, Hammer.defaults, options || {}); + + this.options.inputTarget = this.options.inputTarget || element; + + this.handlers = {}; + this.session = {}; + this.recognizers = []; + this.oldCssProps = {}; + + this.element = element; + this.input = createInputInstance(this); + this.touchAction = new TouchAction(this, this.options.touchAction); + + toggleCssProps(this, true); + + each(this.options.recognizers, function(item) { + var recognizer = this.add(new (item[0])(item[1])); + item[2] && recognizer.recognizeWith(item[2]); + item[3] && recognizer.requireFailure(item[3]); + }, this); +} + +Manager.prototype = { + /** + * set options + * @param {Object} options + * @returns {Manager} + */ + set: function(options) { + assign(this.options, options); + + // Options that need a little more setup + if (options.touchAction) { + this.touchAction.update(); + } + if (options.inputTarget) { + // Clean up existing event listeners and reinitialize + this.input.destroy(); + this.input.target = options.inputTarget; + this.input.init(); + } + return this; + }, + + /** + * stop recognizing for this session. + * This session will be discarded, when a new [input]start event is fired. + * When forced, the recognizer cycle is stopped immediately. + * @param {Boolean} [force] + */ + stop: function(force) { + this.session.stopped = force ? FORCED_STOP : STOP; + }, + + /** + * run the recognizers! + * called by the inputHandler function on every movement of the pointers (touches) + * it walks through all the recognizers and tries to detect the gesture that is being made + * @param {Object} inputData + */ + recognize: function(inputData) { + var session = this.session; + if (session.stopped) { + return; + } + + // run the touch-action polyfill + this.touchAction.preventDefaults(inputData); + + var recognizer; + var recognizers = this.recognizers; + + // this holds the recognizer that is being recognized. + // so the recognizer's state needs to be BEGAN, CHANGED, ENDED or RECOGNIZED + // if no recognizer is detecting a thing, it is set to `null` + var curRecognizer = session.curRecognizer; + + // reset when the last recognizer is recognized + // or when we're in a new session + if (!curRecognizer || (curRecognizer && curRecognizer.state & STATE_RECOGNIZED)) { + curRecognizer = session.curRecognizer = null; + } + + var i = 0; + while (i < recognizers.length) { + recognizer = recognizers[i]; + + // find out if we are allowed try to recognize the input for this one. + // 1. allow if the session is NOT forced stopped (see the .stop() method) + // 2. allow if we still haven't recognized a gesture in this session, or the this recognizer is the one + // that is being recognized. + // 3. allow if the recognizer is allowed to run simultaneous with the current recognized recognizer. + // this can be setup with the `recognizeWith()` method on the recognizer. + if (session.stopped !== FORCED_STOP && ( // 1 + !curRecognizer || recognizer == curRecognizer || // 2 + recognizer.canRecognizeWith(curRecognizer))) { // 3 + recognizer.recognize(inputData); + } else { + recognizer.reset(); + } + + // if the recognizer has been recognizing the input as a valid gesture, we want to store this one as the + // current active recognizer. but only if we don't already have an active recognizer + if (!curRecognizer && recognizer.state & (STATE_BEGAN | STATE_CHANGED | STATE_ENDED)) { + curRecognizer = session.curRecognizer = recognizer; + } + i++; + } + }, + + /** + * get a recognizer by its event name. + * @param {Recognizer|String} recognizer + * @returns {Recognizer|Null} + */ + get: function(recognizer) { + if (recognizer instanceof Recognizer) { + return recognizer; + } + + var recognizers = this.recognizers; + for (var i = 0; i < recognizers.length; i++) { + if (recognizers[i].options.event == recognizer) { + return recognizers[i]; + } + } + return null; + }, + + /** + * add a recognizer to the manager + * existing recognizers with the same event name will be removed + * @param {Recognizer} recognizer + * @returns {Recognizer|Manager} + */ + add: function(recognizer) { + if (invokeArrayArg(recognizer, 'add', this)) { + return this; + } + + // remove existing + var existing = this.get(recognizer.options.event); + if (existing) { + this.remove(existing); + } + + this.recognizers.push(recognizer); + recognizer.manager = this; + + this.touchAction.update(); + return recognizer; + }, + + /** + * remove a recognizer by name or instance + * @param {Recognizer|String} recognizer + * @returns {Manager} + */ + remove: function(recognizer) { + if (invokeArrayArg(recognizer, 'remove', this)) { + return this; + } + + recognizer = this.get(recognizer); + + // let's make sure this recognizer exists + if (recognizer) { + var recognizers = this.recognizers; + var index = inArray(recognizers, recognizer); + + if (index !== -1) { + recognizers.splice(index, 1); + this.touchAction.update(); + } + } + + return this; + }, + + /** + * bind event + * @param {String} events + * @param {Function} handler + * @returns {EventEmitter} this + */ + on: function(events, handler) { + if (events === undefined) { + return; + } + if (handler === undefined) { + return; + } + + var handlers = this.handlers; + each(splitStr(events), function(event) { + handlers[event] = handlers[event] || []; + handlers[event].push(handler); + }); + return this; + }, + + /** + * unbind event, leave emit blank to remove all handlers + * @param {String} events + * @param {Function} [handler] + * @returns {EventEmitter} this + */ + off: function(events, handler) { + if (events === undefined) { + return; + } + + var handlers = this.handlers; + each(splitStr(events), function(event) { + if (!handler) { + delete handlers[event]; + } else { + handlers[event] && handlers[event].splice(inArray(handlers[event], handler), 1); + } + }); + return this; + }, + + /** + * emit event to the listeners + * @param {String} event + * @param {Object} data + */ + emit: function(event, data) { + // we also want to trigger dom events + if (this.options.domEvents) { + triggerDomEvent(event, data); + } + + // no handlers, so skip it all + var handlers = this.handlers[event] && this.handlers[event].slice(); + if (!handlers || !handlers.length) { + return; + } + + data.type = event; + data.preventDefault = function() { + data.srcEvent.preventDefault(); + }; + + var i = 0; + while (i < handlers.length) { + handlers[i](data); + i++; + } + }, + + /** + * destroy the manager and unbinds all events + * it doesn't unbind dom events, that is the user own responsibility + */ + destroy: function() { + this.element && toggleCssProps(this, false); + + this.handlers = {}; + this.session = {}; + this.input.destroy(); + this.element = null; + } +}; + +/** + * add/remove the css properties as defined in manager.options.cssProps + * @param {Manager} manager + * @param {Boolean} add + */ +function toggleCssProps(manager, add) { + var element = manager.element; + if (!element.style) { + return; + } + var prop; + each(manager.options.cssProps, function(value, name) { + prop = prefixed(element.style, name); + if (add) { + manager.oldCssProps[prop] = element.style[prop]; + element.style[prop] = value; + } else { + element.style[prop] = manager.oldCssProps[prop] || ''; + } + }); + if (!add) { + manager.oldCssProps = {}; + } +} + +/** + * trigger dom event + * @param {String} event + * @param {Object} data + */ +function triggerDomEvent(event, data) { + var gestureEvent = document.createEvent('Event'); + gestureEvent.initEvent(event, true, true); + gestureEvent.gesture = data; + data.target.dispatchEvent(gestureEvent); +} + +assign(Hammer, { + INPUT_START: INPUT_START, + INPUT_MOVE: INPUT_MOVE, + INPUT_END: INPUT_END, + INPUT_CANCEL: INPUT_CANCEL, + + STATE_POSSIBLE: STATE_POSSIBLE, + STATE_BEGAN: STATE_BEGAN, + STATE_CHANGED: STATE_CHANGED, + STATE_ENDED: STATE_ENDED, + STATE_RECOGNIZED: STATE_RECOGNIZED, + STATE_CANCELLED: STATE_CANCELLED, + STATE_FAILED: STATE_FAILED, + + DIRECTION_NONE: DIRECTION_NONE, + DIRECTION_LEFT: DIRECTION_LEFT, + DIRECTION_RIGHT: DIRECTION_RIGHT, + DIRECTION_UP: DIRECTION_UP, + DIRECTION_DOWN: DIRECTION_DOWN, + DIRECTION_HORIZONTAL: DIRECTION_HORIZONTAL, + DIRECTION_VERTICAL: DIRECTION_VERTICAL, + DIRECTION_ALL: DIRECTION_ALL, + + Manager: Manager, + Input: Input, + TouchAction: TouchAction, + + TouchInput: TouchInput, + MouseInput: MouseInput, + PointerEventInput: PointerEventInput, + TouchMouseInput: TouchMouseInput, + SingleTouchInput: SingleTouchInput, + + Recognizer: Recognizer, + AttrRecognizer: AttrRecognizer, + Tap: TapRecognizer, + Pan: PanRecognizer, + Swipe: SwipeRecognizer, + Pinch: PinchRecognizer, + Rotate: RotateRecognizer, + Press: PressRecognizer, + + on: addEventListeners, + off: removeEventListeners, + each: each, + merge: merge, + extend: extend, + assign: assign, + inherit: inherit, + bindFn: bindFn, + prefixed: prefixed +}); + +// this prevents errors when Hammer is loaded in the presence of an AMD +// style loader but by script tag, not by the loader. +var freeGlobal = (typeof window !== 'undefined' ? window : (typeof self !== 'undefined' ? self : {})); // jshint ignore:line +freeGlobal.Hammer = Hammer; + +if (true) { + !(__WEBPACK_AMD_DEFINE_RESULT__ = (function() { + return Hammer; + }).call(exports, __webpack_require__, exports, module), + __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)); +} else {} + +})(window, document, 'Hammer'); + + +/***/ }), + +/***/ "./src/example.scss": +/*!**************************!*\ + !*** ./src/example.scss ***! + \**************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +// extracted by mini-css-extract-plugin + + +/***/ }), + +/***/ "./node_modules/riot/esm/api/__.js": +/*!*****************************************!*\ + !*** ./node_modules/riot/esm/api/__.js ***! + \*****************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "__": () => (/* binding */ __) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_binding_types_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/binding-types.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/binding-types.js"); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_expression_types_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../node_modules/@riotjs/util/expression-types.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/expression-types.js"); +/* harmony import */ var _node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js */ "./node_modules/riot/esm/node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js"); +/* harmony import */ var _core_css_manager_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../core/css-manager.js */ "./node_modules/riot/esm/core/css-manager.js"); +/* Riot v7.1.0, @license MIT */ + + + + + + +// expose some internal stuff that might be used from external tools +const __ = { + cssManager: _core_css_manager_js__WEBPACK_IMPORTED_MODULE_0__["default"], + DOMBindings: { + template: _node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_1__.template, + createBinding: _node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_1__.createBinding, + createExpression: _node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_1__.createExpression, + bindingTypes: _node_modules_riotjs_util_binding_types_js__WEBPACK_IMPORTED_MODULE_2__["default"], + expressionTypes: _node_modules_riotjs_util_expression_types_js__WEBPACK_IMPORTED_MODULE_3__["default"] + }, + globals: { + DOM_COMPONENT_INSTANCE_PROPERTY: _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.DOM_COMPONENT_INSTANCE_PROPERTY, + PARENT_KEY_SYMBOL: _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PARENT_KEY_SYMBOL + } +}; + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/api/component.js": +/*!************************************************!*\ + !*** ./node_modules/riot/esm/api/component.js ***! + \************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "component": () => (/* binding */ component) +/* harmony export */ }); +/* harmony import */ var _node_modules_cumpa_index_next_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/cumpa/index.next.js */ "./node_modules/riot/esm/node_modules/cumpa/index.next.js"); +/* harmony import */ var _core_create_component_from_wrapper_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../core/create-component-from-wrapper.js */ "./node_modules/riot/esm/core/create-component-from-wrapper.js"); +/* Riot v7.1.0, @license MIT */ + + + +/** + * Helper method to create component without relying on the registered ones + * @param {Object} implementation - component implementation + * @returns {Function} function that will allow you to mount a riot component on a DOM node + */ +function component(implementation) { + return function (el, props, _temp) { + let { + slots, + attributes, + parentScope + } = _temp === void 0 ? {} : _temp; + return (0,_node_modules_cumpa_index_next_js__WEBPACK_IMPORTED_MODULE_0__["default"])(c => c.mount(el, parentScope), c => c({ + props, + slots, + attributes + }), _core_create_component_from_wrapper_js__WEBPACK_IMPORTED_MODULE_1__.createComponentFromWrapper)(implementation); + }; +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/api/install.js": +/*!**********************************************!*\ + !*** ./node_modules/riot/esm/api/install.js ***! + \**********************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "install": () => (/* binding */ install) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/checks.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/checks.js"); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); +/* Riot v7.1.0, @license MIT */ + + + + +/** + * Define a riot plugin + * @param {Function} plugin - function that will receive all the components created + * @returns {Set} the set containing all the plugins installed + */ +function install(plugin) { + if (!(0,_node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_0__.isFunction)(plugin)) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__.panic)('Plugins must be of type function'); + if (_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.PLUGINS_SET.has(plugin)) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__.panic)('This plugin was already installed'); + _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.PLUGINS_SET.add(plugin); + return _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.PLUGINS_SET; +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/api/mount.js": +/*!********************************************!*\ + !*** ./node_modules/riot/esm/api/mount.js ***! + \********************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "mount": () => (/* binding */ mount) +/* harmony export */ }); +/* harmony import */ var _node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/bianco.query/index.next.js */ "./node_modules/riot/esm/node_modules/bianco.query/index.next.js"); +/* harmony import */ var _core_mount_component_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../core/mount-component.js */ "./node_modules/riot/esm/core/mount-component.js"); +/* Riot v7.1.0, @license MIT */ + + + +/** + * Mounting function that will work only for the components that were globally registered + * @param {string|HTMLElement} selector - query for the selection or a DOM element + * @param {Object} initialProps - the initial component properties + * @param {string} name - optional component name + * @returns {Array} list of riot components + */ +function mount(selector, initialProps, name) { + return (0,_node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__["default"])(selector).map(element => (0,_core_mount_component_js__WEBPACK_IMPORTED_MODULE_1__.mountComponent)(element, initialProps, name)); +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/api/pure.js": +/*!*******************************************!*\ + !*** ./node_modules/riot/esm/api/pure.js ***! + \*******************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "pure": () => (/* binding */ pure) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/checks.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/checks.js"); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); +/* Riot v7.1.0, @license MIT */ + + + + +/** + * Lift a riot component Interface into a pure riot object + * @param {Function} func - RiotPureComponent factory function + * @returns {Function} the lifted original function received as argument + */ +function pure(func) { + if (!(0,_node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_0__.isFunction)(func)) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__.panic)('riot.pure accepts only arguments of type "function"'); + func[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.IS_PURE_SYMBOL] = true; + return func; +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/api/register.js": +/*!***********************************************!*\ + !*** ./node_modules/riot/esm/api/register.js ***! + \***********************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "register": () => (/* binding */ register) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); +/* harmony import */ var _core_create_component_from_wrapper_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../core/create-component-from-wrapper.js */ "./node_modules/riot/esm/core/create-component-from-wrapper.js"); +/* Riot v7.1.0, @license MIT */ + + + + +/** + * Register a custom tag by name + * @param {string} name - component name + * @param {Object} implementation - tag implementation + * @returns {Map} map containing all the components implementations + */ +function register(name, _ref) { + let { + css, + template, + exports + } = _ref; + if (_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.COMPONENTS_IMPLEMENTATION_MAP.has(name)) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__.panic)(`The component "${name}" was already registered`); + _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.COMPONENTS_IMPLEMENTATION_MAP.set(name, (0,_core_create_component_from_wrapper_js__WEBPACK_IMPORTED_MODULE_2__.createComponentFromWrapper)({ + name, + css, + template, + exports + })); + return _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.COMPONENTS_IMPLEMENTATION_MAP; +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/api/uninstall.js": +/*!************************************************!*\ + !*** ./node_modules/riot/esm/api/uninstall.js ***! + \************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "uninstall": () => (/* binding */ uninstall) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); +/* Riot v7.1.0, @license MIT */ + + + +/** + * Uninstall a riot plugin + * @param {Function} plugin - plugin previously installed + * @returns {Set} the set containing all the plugins installed + */ +function uninstall(plugin) { + if (!_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.PLUGINS_SET.has(plugin)) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__.panic)('This plugin was never installed'); + _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.PLUGINS_SET["delete"](plugin); + return _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.PLUGINS_SET; +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/api/unmount.js": +/*!**********************************************!*\ + !*** ./node_modules/riot/esm/api/unmount.js ***! + \**********************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "unmount": () => (/* binding */ unmount) +/* harmony export */ }); +/* harmony import */ var _node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/bianco.query/index.next.js */ "./node_modules/riot/esm/node_modules/bianco.query/index.next.js"); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* Riot v7.1.0, @license MIT */ + + + +/** + * Sweet unmounting helper function for the DOM node mounted manually by the user + * @param {string|HTMLElement} selector - query for the selection or a DOM element + * @param {boolean|null} keepRootElement - if true keep the root element + * @returns {Array} list of nodes unmounted + */ +function unmount(selector, keepRootElement) { + return (0,_node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__["default"])(selector).map(element => { + if (element[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_1__.DOM_COMPONENT_INSTANCE_PROPERTY]) { + element[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_1__.DOM_COMPONENT_INSTANCE_PROPERTY].unmount(keepRootElement); + } + return element; + }); +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/api/unregister.js": +/*!*************************************************!*\ + !*** ./node_modules/riot/esm/api/unregister.js ***! + \*************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "unregister": () => (/* binding */ unregister) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); +/* harmony import */ var _core_css_manager_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../core/css-manager.js */ "./node_modules/riot/esm/core/css-manager.js"); +/* Riot v7.1.0, @license MIT */ + + + + +/** + * Unregister a riot web component + * @param {string} name - component name + * @returns {Map} map containing all the components implementations + */ +function unregister(name) { + if (!_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.COMPONENTS_IMPLEMENTATION_MAP.has(name)) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_1__.panic)(`The component "${name}" was never registered`); + _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.COMPONENTS_IMPLEMENTATION_MAP["delete"](name); + _core_css_manager_js__WEBPACK_IMPORTED_MODULE_2__["default"].remove(name); + return _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.COMPONENTS_IMPLEMENTATION_MAP; +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/api/version.js": +/*!**********************************************!*\ + !*** ./node_modules/riot/esm/api/version.js ***! + \**********************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "version": () => (/* binding */ version) +/* harmony export */ }); +/* Riot v7.1.0, @license MIT */ +/** @type {string} current riot version */ +const version = 'v7.1.0'; + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/api/with-types.js": +/*!*************************************************!*\ + !*** ./node_modules/riot/esm/api/with-types.js ***! + \*************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "withTypes": () => (/* binding */ withTypes) +/* harmony export */ }); +/* Riot v7.1.0, @license MIT */ +/** + * no-op function needed to add the proper types to your component via typescript + * @param {Function|Object} component - component default export + * @returns {Function|Object} returns exactly what it has received + */ +/* istanbul ignore next */ +const withTypes = component => component; + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/add-css-hook.js": +/*!****************************************************!*\ + !*** ./node_modules/riot/esm/core/add-css-hook.js ***! + \****************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "addCssHook": () => (/* binding */ addCssHook) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _utils_dom_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils/dom.js */ "./node_modules/riot/esm/utils/dom.js"); +/* harmony import */ var _node_modules_bianco_attr_index_next_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/bianco.attr/index.next.js */ "./node_modules/riot/esm/node_modules/bianco.attr/index.next.js"); +/* Riot v7.1.0, @license MIT */ + + + + +/** + * Add eventually the "is" attribute to link this DOM node to its css + * @param {HTMLElement} element - target root node + * @param {string} name - name of the component mounted + * @returns {undefined} it's a void function + */ + +function addCssHook(element, name) { + if ((0,_utils_dom_js__WEBPACK_IMPORTED_MODULE_0__.getName)(element) !== name) { + (0,_node_modules_bianco_attr_index_next_js__WEBPACK_IMPORTED_MODULE_1__.set)(element, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.IS_DIRECTIVE, name); + } +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/bind-dom-node-to-component-instance.js": +/*!***************************************************************************!*\ + !*** ./node_modules/riot/esm/core/bind-dom-node-to-component-instance.js ***! + \***************************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "bindDOMNodeToComponentInstance": () => (/* binding */ bindDOMNodeToComponentInstance) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* Riot v7.1.0, @license MIT */ + + +/** + * Bind a DOM node to its component object + * @param {HTMLElement} node - html node mounted + * @param {Object} component - Riot.js component object + * @returns {Object} the component object received as second argument + */ +const bindDOMNodeToComponentInstance = (node, component) => node[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.DOM_COMPONENT_INSTANCE_PROPERTY] = component; + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/component-dom-selectors.js": +/*!***************************************************************!*\ + !*** ./node_modules/riot/esm/core/component-dom-selectors.js ***! + \***************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "COMPONENT_DOM_SELECTORS": () => (/* binding */ COMPONENT_DOM_SELECTORS) +/* harmony export */ }); +/* harmony import */ var _node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/bianco.query/index.next.js */ "./node_modules/riot/esm/node_modules/bianco.query/index.next.js"); +/* Riot v7.1.0, @license MIT */ + + +const COMPONENT_DOM_SELECTORS = Object.freeze({ + // component helpers + $(selector) { + return (0,_node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__["default"])(selector, this.root)[0]; + }, + $$(selector) { + return (0,_node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__["default"])(selector, this.root); + } +}); + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/component-lifecycle-methods.js": +/*!*******************************************************************!*\ + !*** ./node_modules/riot/esm/core/component-lifecycle-methods.js ***! + \*******************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "COMPONENT_LIFECYCLE_METHODS": () => (/* binding */ COMPONENT_LIFECYCLE_METHODS) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); +/* Riot v7.1.0, @license MIT */ + + + +const COMPONENT_LIFECYCLE_METHODS = Object.freeze({ + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.SHOULD_UPDATE_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.ON_BEFORE_MOUNT_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.ON_MOUNTED_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.ON_BEFORE_UPDATE_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.ON_UPDATED_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.ON_BEFORE_UNMOUNT_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.ON_UNMOUNTED_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop +}); + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/component-template-factory.js": +/*!******************************************************************!*\ + !*** ./node_modules/riot/esm/core/component-template-factory.js ***! + \******************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "componentTemplateFactory": () => (/* binding */ componentTemplateFactory) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js */ "./node_modules/riot/esm/node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js"); +/* harmony import */ var _node_modules_riotjs_util_expression_types_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/expression-types.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/expression-types.js"); +/* harmony import */ var _node_modules_riotjs_util_binding_types_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/binding-types.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/binding-types.js"); +/* Riot v7.1.0, @license MIT */ + + + + +/** + * Factory function to create the component templates only once + * @param {Function} template - component template creation function + * @param {RiotComponentWrapper} componentWrapper - riot compiler generated object + * @param {Function} getChildComponent - getter function to return the children components + * @returns {TemplateChunk} template chunk object + */ +function componentTemplateFactory(template, componentWrapper, getChildComponent) { + return template(_node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_0__.template, _node_modules_riotjs_util_expression_types_js__WEBPACK_IMPORTED_MODULE_1__["default"], _node_modules_riotjs_util_binding_types_js__WEBPACK_IMPORTED_MODULE_2__["default"], getChildComponent); +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/compute-component-state.js": +/*!***************************************************************!*\ + !*** ./node_modules/riot/esm/core/compute-component-state.js ***! + \***************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "computeComponentState": () => (/* binding */ computeComponentState) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); +/* Riot v7.1.0, @license MIT */ + + +/** + * Compute the component current state merging it with its previous state + * @param {Object} oldState - previous state object + * @param {Object} newState - new state given to the `update` call + * @returns {Object} new object state + */ +function computeComponentState(oldState, newState) { + return Object.assign({}, oldState, (0,_node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__.callOrAssign)(newState)); +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/compute-initial-props.js": +/*!*************************************************************!*\ + !*** ./node_modules/riot/esm/core/compute-initial-props.js ***! + \*************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "computeInitialProps": () => (/* binding */ computeInitialProps) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_dom_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/dom.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/dom.js"); +/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); +/* Riot v7.1.0, @license MIT */ + + + +/** + * Evaluate the component properties either from its real attributes or from its initial user properties + * @param {HTMLElement} element - component root + * @param {Object} initialProps - initial props + * @returns {Object} component props key value pairs + */ +function computeInitialProps(element, initialProps) { + if (initialProps === void 0) { + initialProps = {}; + } + return Object.assign({}, (0,_node_modules_riotjs_util_dom_js__WEBPACK_IMPORTED_MODULE_0__.DOMattributesToObject)(element), (0,_node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.callOrAssign)(initialProps)); +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/create-attribute-bindings.js": +/*!*****************************************************************!*\ + !*** ./node_modules/riot/esm/core/create-attribute-bindings.js ***! + \*****************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "createAttributeBindings": () => (/* binding */ createAttributeBindings) +/* harmony export */ }); +/* harmony import */ var _create_core_api_methods_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./create-core-api-methods.js */ "./node_modules/riot/esm/core/create-core-api-methods.js"); +/* harmony import */ var _node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js */ "./node_modules/riot/esm/node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js"); +/* Riot v7.1.0, @license MIT */ + + + +/** + * Create the bindings to update the component attributes + * @param {HTMLElement} node - node where we will bind the expressions + * @param {Array} attributes - list of attribute bindings + * @returns {TemplateChunk} - template bindings object + */ +function createAttributeBindings(node, attributes) { + if (attributes === void 0) { + attributes = []; + } + const expressions = attributes.map(a => (0,_node_modules_riotjs_dom_bindings_dist_esm_dom_bindings_js__WEBPACK_IMPORTED_MODULE_0__.createExpression)(node, a)); + const binding = {}; + return Object.assign(binding, Object.assign({ + expressions + }, (0,_create_core_api_methods_js__WEBPACK_IMPORTED_MODULE_1__.createCoreAPIMethods)(method => scope => { + expressions.forEach(e => e[method](scope)); + return binding; + }))); +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/create-component-from-wrapper.js": +/*!*********************************************************************!*\ + !*** ./node_modules/riot/esm/core/create-component-from-wrapper.js ***! + \*********************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "createComponentFromWrapper": () => (/* binding */ createComponentFromWrapper) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_strings_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/strings.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/strings.js"); +/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); +/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); +/* harmony import */ var _mocked_template_interface_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./mocked-template-interface.js */ "./node_modules/riot/esm/core/mocked-template-interface.js"); +/* harmony import */ var _component_template_factory_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./component-template-factory.js */ "./node_modules/riot/esm/core/component-template-factory.js"); +/* harmony import */ var _create_pure_component_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./create-pure-component.js */ "./node_modules/riot/esm/core/create-pure-component.js"); +/* harmony import */ var _instantiate_component_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./instantiate-component.js */ "./node_modules/riot/esm/core/instantiate-component.js"); +/* Riot v7.1.0, @license MIT */ + + + + + + + + + +/** + * Create the subcomponents that can be included inside a tag in runtime + * @param {Object} components - components imported in runtime + * @returns {Object} all the components transformed into Riot.Component factory functions + */ +function createChildrenComponentsObject(components) { + if (components === void 0) { + components = {}; + } + return Object.entries((0,_node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__.callOrAssign)(components)).reduce((acc, _ref) => { + let [key, value] = _ref; + acc[(0,_node_modules_riotjs_util_strings_js__WEBPACK_IMPORTED_MODULE_1__.camelToDashCase)(key)] = createComponentFromWrapper(value); + return acc; + }, {}); +} + +/** + * Create the getter function to render the child components + * @param {RiotComponentWrapper} componentWrapper - riot compiler generated object + * @returns {Function} function returning the component factory function + */ +const createChildComponentGetter = componentWrapper => { + const childrenComponents = createChildrenComponentsObject(componentWrapper.exports ? componentWrapper.exports.components : {}); + return name => { + // improve support for recursive components + if (name === componentWrapper.name) return memoizedCreateComponentFromWrapper(componentWrapper); + // return the registered components + return childrenComponents[name] || _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.COMPONENTS_IMPLEMENTATION_MAP.get(name); + }; +}; + +/** + * Performance optimization for the recursive components + * @param {RiotComponentWrapper} componentWrapper - riot compiler generated object + * @returns {Object} component like interface + */ +const memoizedCreateComponentFromWrapper = (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_3__.memoize)(createComponentFromWrapper); + +/** + * Create the component interface needed for the @riotjs/dom-bindings tag bindings + * @param {RiotComponentWrapper} componentWrapper - riot compiler generated object + * @param {string} componentWrapper.css - component css + * @param {Function} componentWrapper.template - function that will return the dom-bindings template function + * @param {Object} componentWrapper.exports - component interface + * @param {string} componentWrapper.name - component name + * @returns {Object} component like interface + */ +function createComponentFromWrapper(componentWrapper) { + const { + css, + template, + exports, + name + } = componentWrapper; + const templateFn = template ? (0,_component_template_factory_js__WEBPACK_IMPORTED_MODULE_4__.componentTemplateFactory)(template, componentWrapper, createChildComponentGetter(componentWrapper)) : _mocked_template_interface_js__WEBPACK_IMPORTED_MODULE_5__.MOCKED_TEMPLATE_INTERFACE; + return _ref2 => { + let { + slots, + attributes, + props + } = _ref2; + // pure components rendering will be managed by the end user + if (exports && exports[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_2__.IS_PURE_SYMBOL]) return (0,_create_pure_component_js__WEBPACK_IMPORTED_MODULE_6__.createPureComponent)(exports, { + slots, + attributes, + props, + css, + template + }); + const componentAPI = (0,_node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__.callOrAssign)(exports) || {}; + const component = (0,_instantiate_component_js__WEBPACK_IMPORTED_MODULE_7__.instantiateComponent)({ + css, + template: templateFn, + componentAPI, + name + })({ + slots, + attributes, + props + }); + + // notice that for the components created via tag binding + // we need to invert the mount (state/parentScope) arguments + // the template bindings will only forward the parentScope updates + // and never deal with the component state + return { + mount(element, parentScope, state) { + return component.mount(element, state, parentScope); + }, + update(parentScope, state) { + return component.update(state, parentScope); + }, + unmount(preserveRoot) { + return component.unmount(preserveRoot); + } + }; + }; +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/create-core-api-methods.js": +/*!***************************************************************!*\ + !*** ./node_modules/riot/esm/core/create-core-api-methods.js ***! + \***************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "createCoreAPIMethods": () => (/* binding */ createCoreAPIMethods) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* Riot v7.1.0, @license MIT */ + + +/** + * Wrap the Riot.js core API methods using a mapping function + * @param {Function} mapFunction - lifting function + * @returns {Object} an object having the { mount, update, unmount } functions + */ +function createCoreAPIMethods(mapFunction) { + return [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.MOUNT_METHOD_KEY, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.UPDATE_METHOD_KEY, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.UNMOUNT_METHOD_KEY].reduce((acc, method) => { + acc[method] = mapFunction(method); + return acc; + }, {}); +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/create-pure-component.js": +/*!*************************************************************!*\ + !*** ./node_modules/riot/esm/core/create-pure-component.js ***! + \*************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "createPureComponent": () => (/* binding */ createPureComponent) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); +/* harmony import */ var _node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/objects.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/objects.js"); +/* harmony import */ var _pure_component_api_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./pure-component-api.js */ "./node_modules/riot/esm/core/pure-component-api.js"); +/* harmony import */ var _bind_dom_node_to_component_instance_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./bind-dom-node-to-component-instance.js */ "./node_modules/riot/esm/core/bind-dom-node-to-component-instance.js"); +/* harmony import */ var _create_core_api_methods_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./create-core-api-methods.js */ "./node_modules/riot/esm/core/create-core-api-methods.js"); +/* Riot v7.1.0, @license MIT */ + + + + + + + +/** + * Create a pure component + * @param {Function} pureFactoryFunction - pure component factory function + * @param {Array} options.slots - component slots + * @param {Array} options.attributes - component attributes + * @param {Array} options.template - template factory function + * @param {Array} options.template - template factory function + * @param {any} options.props - initial component properties + * @returns {Object} pure component object + */ +function createPureComponent(pureFactoryFunction, _ref) { + let { + slots, + attributes, + props, + css, + template + } = _ref; + if (template) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_0__.panic)('Pure components can not have html'); + if (css) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_0__.panic)('Pure components do not have css'); + const component = (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_1__.defineDefaults)(pureFactoryFunction({ + slots, + attributes, + props + }), _pure_component_api_js__WEBPACK_IMPORTED_MODULE_2__.PURE_COMPONENT_API); + return (0,_create_core_api_methods_js__WEBPACK_IMPORTED_MODULE_3__.createCoreAPIMethods)(method => function () { + for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + // intercept the mount calls to bind the DOM node to the pure object created + // see also https://github.com/riot/riot/issues/2806 + if (method === _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.MOUNT_METHOD_KEY) { + const [element] = args; + // mark this node as pure element + (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_1__.defineProperty)(element, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.IS_PURE_SYMBOL, true); + (0,_bind_dom_node_to_component_instance_js__WEBPACK_IMPORTED_MODULE_5__.bindDOMNodeToComponentInstance)(element, component); + } + component[method](...args); + return component; + }); +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/css-manager.js": +/*!***************************************************!*\ + !*** ./node_modules/riot/esm/core/css-manager.js ***! + \***************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "CSS_BY_NAME": () => (/* binding */ CSS_BY_NAME), +/* harmony export */ "STYLE_NODE_SELECTOR": () => (/* binding */ STYLE_NODE_SELECTOR), +/* harmony export */ "default": () => (/* binding */ cssManager) +/* harmony export */ }); +/* harmony import */ var _node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/bianco.query/index.next.js */ "./node_modules/riot/esm/node_modules/bianco.query/index.next.js"); +/* harmony import */ var _node_modules_bianco_attr_index_next_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/bianco.attr/index.next.js */ "./node_modules/riot/esm/node_modules/bianco.attr/index.next.js"); +/* Riot v7.1.0, @license MIT */ + + + +const CSS_BY_NAME = new Map(); +const STYLE_NODE_SELECTOR = 'style[riot]'; + +// memoized curried function +const getStyleNode = (style => { + return () => { + // lazy evaluation: + // if this function was already called before + // we return its cached result + if (style) return style; + + // create a new style element or use an existing one + // and cache it internally + style = (0,_node_modules_bianco_query_index_next_js__WEBPACK_IMPORTED_MODULE_0__["default"])(STYLE_NODE_SELECTOR)[0] || document.createElement('style'); + (0,_node_modules_bianco_attr_index_next_js__WEBPACK_IMPORTED_MODULE_1__.set)(style, 'type', 'text/css'); + + /* istanbul ignore next */ + if (!style.parentNode) document.head.appendChild(style); + return style; + }; +})(); + +/** + * Object that will be used to inject and manage the css of every tag instance + */ +const cssManager = { + CSS_BY_NAME, + /** + * Save a tag style to be later injected into DOM + * @param { string } name - if it's passed we will map the css to a tagname + * @param { string } css - css string + * @returns {Object} self + */ + add(name, css) { + if (!CSS_BY_NAME.has(name)) { + CSS_BY_NAME.set(name, css); + this.inject(); + } + return this; + }, + /** + * Inject all previously saved tag styles into DOM + * innerHTML seems slow: http://jsperf.com/riot-insert-style + * @returns {Object} self + */ + inject() { + getStyleNode().innerHTML = [...CSS_BY_NAME.values()].join('\n'); + return this; + }, + /** + * Remove a tag style from the DOM + * @param {string} name a registered tagname + * @returns {Object} self + */ + remove(name) { + if (CSS_BY_NAME.has(name)) { + CSS_BY_NAME.delete(name); + this.inject(); + } + return this; + } +}; + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/instantiate-component.js": +/*!*************************************************************!*\ + !*** ./node_modules/riot/esm/core/instantiate-component.js ***! + \*************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "instantiateComponent": () => (/* binding */ instantiateComponent) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../node_modules/@riotjs/util/objects.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/objects.js"); +/* harmony import */ var _component_dom_selectors_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./component-dom-selectors.js */ "./node_modules/riot/esm/core/component-dom-selectors.js"); +/* harmony import */ var _component_lifecycle_methods_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./component-lifecycle-methods.js */ "./node_modules/riot/esm/core/component-lifecycle-methods.js"); +/* harmony import */ var _css_manager_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./css-manager.js */ "./node_modules/riot/esm/core/css-manager.js"); +/* harmony import */ var _node_modules_curri_index_next_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/curri/index.next.js */ "./node_modules/riot/esm/node_modules/curri/index.next.js"); +/* harmony import */ var _manage_component_lifecycle_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./manage-component-lifecycle.js */ "./node_modules/riot/esm/core/manage-component-lifecycle.js"); +/* Riot v7.1.0, @license MIT */ + + + + + + + + +/** + * Component definition function + * @param {Object} implementation - the component implementation will be generated via compiler + * @param {Object} component - the component initial properties + * @returns {Object} a new component implementation object + */ +function instantiateComponent(_ref) { + let { + css, + template, + componentAPI, + name + } = _ref; + // add the component css into the DOM + if (css && name) _css_manager_js__WEBPACK_IMPORTED_MODULE_0__["default"].add(name, css); + return (0,_node_modules_curri_index_next_js__WEBPACK_IMPORTED_MODULE_1__["default"])(_manage_component_lifecycle_js__WEBPACK_IMPORTED_MODULE_2__.manageComponentLifecycle)((0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_3__.defineProperties)( + // set the component defaults without overriding the original component API + (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_3__.defineDefaults)(componentAPI, Object.assign({}, _component_lifecycle_methods_js__WEBPACK_IMPORTED_MODULE_4__.COMPONENT_LIFECYCLE_METHODS, { + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_5__.PROPS_KEY]: {}, + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_5__.STATE_KEY]: {} + })), Object.assign({ + // defined during the component creation + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_5__.SLOTS_KEY]: null, + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_5__.ROOT_KEY]: null + }, _component_dom_selectors_js__WEBPACK_IMPORTED_MODULE_6__.COMPONENT_DOM_SELECTORS, { + name, + css, + template + }))); +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/manage-component-lifecycle.js": +/*!******************************************************************!*\ + !*** ./node_modules/riot/esm/core/manage-component-lifecycle.js ***! + \******************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "manageComponentLifecycle": () => (/* binding */ manageComponentLifecycle) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../node_modules/@riotjs/util/checks.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/checks.js"); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); +/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); +/* harmony import */ var _node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/objects.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/objects.js"); +/* harmony import */ var _add_css_hook_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./add-css-hook.js */ "./node_modules/riot/esm/core/add-css-hook.js"); +/* harmony import */ var _bind_dom_node_to_component_instance_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./bind-dom-node-to-component-instance.js */ "./node_modules/riot/esm/core/bind-dom-node-to-component-instance.js"); +/* harmony import */ var _compute_component_state_js__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./compute-component-state.js */ "./node_modules/riot/esm/core/compute-component-state.js"); +/* harmony import */ var _compute_initial_props_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./compute-initial-props.js */ "./node_modules/riot/esm/core/compute-initial-props.js"); +/* harmony import */ var _create_attribute_bindings_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./create-attribute-bindings.js */ "./node_modules/riot/esm/core/create-attribute-bindings.js"); +/* harmony import */ var _run_plugins_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./run-plugins.js */ "./node_modules/riot/esm/core/run-plugins.js"); +/* Riot v7.1.0, @license MIT */ + + + + + + + + + + + + +/** + * Component creation factory function that will enhance the user provided API + * @param {Object} component - a component implementation previously defined + * @param {Array} options.slots - component slots generated via riot compiler + * @param {Array} options.attributes - attribute expressions generated via riot compiler + * @returns {Riot.Component} a riot component instance + */ +function manageComponentLifecycle(component, _ref) { + let { + slots, + attributes, + props + } = _ref; + return (0,_node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_0__.autobindMethods)((0,_run_plugins_js__WEBPACK_IMPORTED_MODULE_1__.runPlugins)((0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__.defineProperties)((0,_node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_3__.isObject)(component) ? Object.create(component) : component, { + mount(element, state, parentScope) { + if (state === void 0) { + state = {}; + } + // any element mounted passing through this function can't be a pure component + (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__.defineProperty)(element, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.IS_PURE_SYMBOL, false); + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PARENT_KEY_SYMBOL] = parentScope; + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ATTRIBUTES_KEY_SYMBOL] = (0,_create_attribute_bindings_js__WEBPACK_IMPORTED_MODULE_5__.createAttributeBindings)(element, attributes).mount(parentScope); + (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__.defineProperty)(this, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY, Object.freeze(Object.assign({}, (0,_compute_initial_props_js__WEBPACK_IMPORTED_MODULE_6__.computeInitialProps)(element, props), (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_7__.evaluateAttributeExpressions)(this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ATTRIBUTES_KEY_SYMBOL].expressions)))); + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY] = (0,_compute_component_state_js__WEBPACK_IMPORTED_MODULE_8__.computeComponentState)(this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY], state); + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.TEMPLATE_KEY_SYMBOL] = this.template.createDOM(element).clone(); + + // link this object to the DOM node + (0,_bind_dom_node_to_component_instance_js__WEBPACK_IMPORTED_MODULE_9__.bindDOMNodeToComponentInstance)(element, this); + // add eventually the 'is' attribute + component.name && (0,_add_css_hook_js__WEBPACK_IMPORTED_MODULE_10__.addCssHook)(element, component.name); + + // define the root element + (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__.defineProperty)(this, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ROOT_KEY, element); + // define the slots array + (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__.defineProperty)(this, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.SLOTS_KEY, slots); + + // before mount lifecycle event + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ON_BEFORE_MOUNT_KEY](this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY]); + // mount the template + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.TEMPLATE_KEY_SYMBOL].mount(element, this, parentScope); + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ON_MOUNTED_KEY](this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY]); + return this; + }, + update(state, parentScope) { + if (state === void 0) { + state = {}; + } + if (parentScope) { + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PARENT_KEY_SYMBOL] = parentScope; + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ATTRIBUTES_KEY_SYMBOL].update(parentScope); + } + const newProps = (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_7__.evaluateAttributeExpressions)(this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ATTRIBUTES_KEY_SYMBOL].expressions); + if (this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.SHOULD_UPDATE_KEY](newProps, this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY]) === false) return; + (0,_node_modules_riotjs_util_objects_js__WEBPACK_IMPORTED_MODULE_2__.defineProperty)(this, _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY, Object.freeze(Object.assign({}, this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], newProps))); + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY] = (0,_compute_component_state_js__WEBPACK_IMPORTED_MODULE_8__.computeComponentState)(this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY], state); + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ON_BEFORE_UPDATE_KEY](this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY]); + + // avoiding recursive updates + // see also https://github.com/riot/riot/issues/2895 + if (!this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.IS_COMPONENT_UPDATING]) { + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.IS_COMPONENT_UPDATING] = true; + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.TEMPLATE_KEY_SYMBOL].update(this, this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PARENT_KEY_SYMBOL]); + } + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ON_UPDATED_KEY](this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY]); + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.IS_COMPONENT_UPDATING] = false; + return this; + }, + unmount(preserveRoot) { + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ON_BEFORE_UNMOUNT_KEY](this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY]); + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ATTRIBUTES_KEY_SYMBOL].unmount(); + // if the preserveRoot is null the template html will be left untouched + // in that case the DOM cleanup will happen differently from a parent node + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.TEMPLATE_KEY_SYMBOL].unmount(this, this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PARENT_KEY_SYMBOL], preserveRoot === null ? null : !preserveRoot); + this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.ON_UNMOUNTED_KEY](this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.PROPS_KEY], this[_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_4__.STATE_KEY]); + return this; + } + })), Object.keys(component).filter(prop => (0,_node_modules_riotjs_util_checks_js__WEBPACK_IMPORTED_MODULE_3__.isFunction)(component[prop]))); +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/mocked-template-interface.js": +/*!*****************************************************************!*\ + !*** ./node_modules/riot/esm/core/mocked-template-interface.js ***! + \*****************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "MOCKED_TEMPLATE_INTERFACE": () => (/* binding */ MOCKED_TEMPLATE_INTERFACE) +/* harmony export */ }); +/* harmony import */ var _pure_component_api_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./pure-component-api.js */ "./node_modules/riot/esm/core/pure-component-api.js"); +/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); +/* Riot v7.1.0, @license MIT */ + + + +const MOCKED_TEMPLATE_INTERFACE = Object.assign({}, _pure_component_api_js__WEBPACK_IMPORTED_MODULE_0__.PURE_COMPONENT_API, { + clone: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, + createDOM: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop +}); + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/mount-component.js": +/*!*******************************************************!*\ + !*** ./node_modules/riot/esm/core/mount-component.js ***! + \*******************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "mountComponent": () => (/* binding */ mountComponent) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../node_modules/@riotjs/util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); +/* harmony import */ var _utils_dom_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils/dom.js */ "./node_modules/riot/esm/utils/dom.js"); +/* Riot v7.1.0, @license MIT */ + + + + +/** + * Component initialization function starting from a DOM node + * @param {HTMLElement} element - element to upgrade + * @param {Object} initialProps - initial component properties + * @param {string} componentName - component id + * @param {Array} slots - component slots + * @returns {Object} a new component instance bound to a DOM node + */ +function mountComponent(element, initialProps, componentName, slots) { + const name = componentName || (0,_utils_dom_js__WEBPACK_IMPORTED_MODULE_0__.getName)(element); + if (!_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_1__.COMPONENTS_IMPLEMENTATION_MAP.has(name)) (0,_node_modules_riotjs_util_misc_js__WEBPACK_IMPORTED_MODULE_2__.panic)(`The component named "${name}" was never registered`); + const component = _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_1__.COMPONENTS_IMPLEMENTATION_MAP.get(name)({ + props: initialProps, + slots + }); + return component.mount(element); +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/pure-component-api.js": +/*!**********************************************************!*\ + !*** ./node_modules/riot/esm/core/pure-component-api.js ***! + \**********************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "PURE_COMPONENT_API": () => (/* binding */ PURE_COMPONENT_API) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/@riotjs/util/functions.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/functions.js"); +/* Riot v7.1.0, @license MIT */ + + + +const PURE_COMPONENT_API = Object.freeze({ + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.MOUNT_METHOD_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.UPDATE_METHOD_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop, + [_node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.UNMOUNT_METHOD_KEY]: _node_modules_riotjs_util_functions_js__WEBPACK_IMPORTED_MODULE_1__.noop +}); + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/core/run-plugins.js": +/*!***************************************************!*\ + !*** ./node_modules/riot/esm/core/run-plugins.js ***! + \***************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "runPlugins": () => (/* binding */ runPlugins) +/* harmony export */ }); +/* harmony import */ var _node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/@riotjs/util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* Riot v7.1.0, @license MIT */ + + +/** + * Run the component instance through all the plugins set by the user + * @param {Object} component - component instance + * @returns {Object} the component enhanced by the plugins + */ +function runPlugins(component) { + return [..._node_modules_riotjs_util_constants_js__WEBPACK_IMPORTED_MODULE_0__.PLUGINS_SET].reduce((c, fn) => fn(c) || c, component); +} + + + + +/***/ }), + +/***/ "./node_modules/riot/esm/node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js": +/*!******************************************************************************************!*\ + !*** ./node_modules/riot/esm/node_modules/@riotjs/dom-bindings/dist/esm.dom-bindings.js ***! + \******************************************************************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +"use strict"; +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ "bindingTypes": () => (/* reexport safe */ _util_binding_types_js__WEBPACK_IMPORTED_MODULE_0__["default"]), +/* harmony export */ "createBinding": () => (/* binding */ create$1), +/* harmony export */ "createExpression": () => (/* binding */ create$4), +/* harmony export */ "expressionTypes": () => (/* reexport safe */ _util_expression_types_js__WEBPACK_IMPORTED_MODULE_1__["default"]), +/* harmony export */ "template": () => (/* binding */ create) +/* harmony export */ }); +/* harmony import */ var _util_dom_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../util/dom.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/dom.js"); +/* harmony import */ var _util_constants_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../util/constants.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/constants.js"); +/* harmony import */ var _util_binding_types_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../util/binding-types.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/binding-types.js"); +/* harmony import */ var _util_expression_types_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../util/expression-types.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/expression-types.js"); +/* harmony import */ var _util_objects_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../util/objects.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/objects.js"); +/* harmony import */ var _util_checks_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../util/checks.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/checks.js"); +/* harmony import */ var _util_misc_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../util/misc.js */ "./node_modules/riot/esm/node_modules/@riotjs/util/misc.js"); +/* Riot WIP, @license MIT */ + + + + + + + + + + +const HEAD_SYMBOL = Symbol(); +const TAIL_SYMBOL = Symbol(); + +/** + * Create the