├── site
    ├── __init__.py
    ├── api
    │   ├── __init__.py
    │   └── github.py
    ├── .env.example
    ├── static
    │   ├── svg
    │   │   ├── check.svg
    │   │   ├── x.svg
    │   │   ├── github.svg
    │   │   └── globe.svg
    │   └── css
    │   │   ├── styles.css
    │   │   ├── microtip.css
    │   │   └── bulma.min.css
    ├── gunicorn.conf.py
    ├── app.py
    ├── templatetags
    │   └── custom_tags.py
    ├── data
    │   ├── css.json
    │   └── js.json
    └── templates
    │   ├── base.html
    │   ├── footer.html
    │   ├── unsuckcss
    │       └── index.html
    │   └── unsuckjs
    │       └── index.html
├── justfile
├── .github
    └── workflows
    │   └── deploy.yml
├── LICENSE
├── README.md
├── pyproject.toml
├── Dockerfile
└── .gitignore


/site/__init__.py:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/site/api/__init__.py:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/site/.env.example:
--------------------------------------------------------------------------------
 1 | DEBUG=True
 2 | INTERNAL_IPS=127.0.0.1
 3 | ALLOWED_HOSTS=
 4 | COLTRANE_SITE=
 5 | SECRET_KEY=this-should-be-lots-of-random-characters
 6 | 
 7 | COLTRANE_DATA_JSON5=True
 8 | 
 9 | GITHUB_USERNAME=
10 | GITHUB_PERSONAL_ACCESS_TOKEN=
11 | 


--------------------------------------------------------------------------------
/site/static/svg/check.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="green">
2 |   <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
3 | </svg>


--------------------------------------------------------------------------------
/site/static/svg/x.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="red">
2 |   <path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" />
3 | </svg>


--------------------------------------------------------------------------------
/site/gunicorn.conf.py:
--------------------------------------------------------------------------------
 1 | # Gunicorn configuration file
 2 | # https://docs.gunicorn.org/en/stable/configure.html#configuration-file
 3 | # https://docs.gunicorn.org/en/stable/settings.html
 4 | # https://adamj.eu/tech/2021/12/29/set-up-a-gunicorn-configuration-file-and-test-it/
 5 | import multiprocessing
 6 | 
 7 | max_requests = 1000
 8 | max_requests_jitter = 50
 9 | 
10 | log_file = "-"
11 | 
12 | bind = "0.0.0.0:80"
13 | workers = multiprocessing.cpu_count() * 2 + 1
14 | 
15 | # Hardcode the worker count to 2 to keep memory usage low
16 | workers = 2
17 | 


--------------------------------------------------------------------------------
/justfile:
--------------------------------------------------------------------------------
 1 | import? 'adamghill.justfile'
 2 | import? '../dotfiles/just/justfile'
 3 | 
 4 | # List commands
 5 | _default:
 6 |     just --list --unsorted --justfile {{ justfile() }} --list-heading $'Available commands:\n'
 7 | 
 8 | # Grab default `adamghill.justfile` from GitHub
 9 | fetch:
10 |   curl https://raw.githubusercontent.com/adamghill/dotfiles/master/just/justfile > adamghill.justfile
11 | 
12 | serve port='8024':
13 |   uv run --all-extras coltrane play --port {{ port }}
14 | 
15 | serve-js:
16 |   uv run --all-extras coltrane play --port 8024
17 | 
18 | serve-css:
19 |   uv run --all-extras coltrane play --port 8025
20 | 


--------------------------------------------------------------------------------
/site/static/svg/github.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2.247a10 10 0 0 0-3.162 19.487c.5.088.687-.212.687-.475c0-.237-.012-1.025-.012-1.862c-2.513.462-3.163-.613-3.363-1.175a3.64 3.64 0 0 0-1.025-1.413c-.35-.187-.85-.65-.013-.662a2 2 0 0 1 1.538 1.025a2.137 2.137 0 0 0 2.912.825a2.1 2.1 0 0 1 .638-1.338c-2.225-.25-4.55-1.112-4.55-4.937a3.9 3.9 0 0 1 1.025-2.688a3.6 3.6 0 0 1 .1-2.65s.837-.262 2.75 1.025a9.43 9.43 0 0 1 5 0c1.912-1.3 2.75-1.025 2.75-1.025a3.6 3.6 0 0 1 .1 2.65a3.87 3.87 0 0 1 1.025 2.688c0 3.837-2.338 4.687-4.562 4.937a2.37 2.37 0 0 1 .674 1.85c0 1.338-.012 2.413-.012 2.75c0 .263.187.575.687.475A10.005 10.005 0 0 0 12 2.247"/></svg>


--------------------------------------------------------------------------------
/site/static/svg/globe.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M21.41 8.64v-.05a10 10 0 0 0-18.78 0s0 0 0 .05a9.86 9.86 0 0 0 0 6.72v.05a10 10 0 0 0 18.78 0s0 0 0-.05a9.86 9.86 0 0 0 0-6.72M4.26 14a7.8 7.8 0 0 1 0-4h1.86a16.7 16.7 0 0 0 0 4Zm.82 2h1.4a12 12 0 0 0 1 2.57A8 8 0 0 1 5.08 16m1.4-8h-1.4a8 8 0 0 1 2.37-2.57A12 12 0 0 0 6.48 8M11 19.7A6.34 6.34 0 0 1 8.57 16H11Zm0-5.7H8.14a14.4 14.4 0 0 1 0-4H11Zm0-6H8.57A6.34 6.34 0 0 1 11 4.3Zm7.92 0h-1.4a12 12 0 0 0-1-2.57A8 8 0 0 1 18.92 8M13 4.3A6.34 6.34 0 0 1 15.43 8H13Zm0 15.4V16h2.43A6.34 6.34 0 0 1 13 19.7m2.86-5.7H13v-4h2.86a14.4 14.4 0 0 1 0 4m.69 4.57a12 12 0 0 0 1-2.57h1.4a8 8 0 0 1-2.4 2.57M19.74 14h-1.86a16 16 0 0 0 .12-2a16 16 0 0 0-.12-2h1.86a7.8 7.8 0 0 1 0 4"/></svg>


--------------------------------------------------------------------------------
/site/app.py:
--------------------------------------------------------------------------------
 1 | #!/usr/bin/env python
 2 | 
 3 | from coltrane import initialize, run
 4 | 
 5 | COMPRESS_FILTERS = {
 6 |     "css": [
 7 |         "refreshcss.filters.RefreshCSSFilter",
 8 |         "compressor.filters.css_default.CssAbsoluteFilter",
 9 |         "compressor.filters.cssmin.rCSSMinFilter",
10 |     ],
11 |     "js": ["compressor.filters.jsmin.rJSMinFilter"],
12 | }
13 | 
14 | SITES = {
15 |     "unsuckjs": [
16 |         "0.0.0.0:80",  # default for healthcheck
17 |         "0.0.0.0:8024",
18 |         "localhost:8024",
19 |         "unsuckjs.localhost",
20 |         "unsuckjs.com",
21 |         "unsuckjs.adamghill.com",
22 |     ],
23 |     "unsuckcss": [
24 |         "0.0.0.0:8025",
25 |         "localhost:8025",
26 |         "unsuckcss.localhost",
27 |         "unsuckcss.com",
28 |         "unsuckcss.adamghill.com",
29 |     ],
30 | }
31 | 
32 | wsgi = initialize(COMPRESS_FILTERS=COMPRESS_FILTERS, COMPRESS_ENABLED=True, COLTRANE_SITES=SITES)
33 | 
34 | if __name__ == "__main__":
35 |     run()
36 | 


--------------------------------------------------------------------------------
/.github/workflows/deploy.yml:
--------------------------------------------------------------------------------
 1 | name: Deploy
 2 | 
 3 | on:
 4 |   push:
 5 |     branches: ["main"]
 6 |   workflow_dispatch:
 7 | 
 8 | env:
 9 |   REGISTRY: ghcr.io
10 |   IMAGE_NAME: ${{ github.repository }}
11 | 
12 | jobs:
13 |   amd64:
14 |     runs-on: ubuntu-latest
15 |     permissions:
16 |       contents: read
17 |       packages: write
18 |     steps:
19 |       - uses: actions/checkout@v3
20 |       - name: Login to ghcr.io
21 |         uses: docker/login-action@v3.3.0
22 |         with:
23 |           registry: ${{ env.REGISTRY }}
24 |           username: ${{ github.actor }}
25 |           password: ${{ secrets.GITHUB_TOKEN  }}
26 |       - name: Build image and push to registry
27 |         uses: docker/build-push-action@v4
28 |         with:
29 |           context: .
30 |           file: Dockerfile
31 |           platforms: linux/amd64
32 |           push: true
33 |           tags: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}:latest
34 |       - name: Deploy to Coolify
35 |         run: |
36 |           curl --request GET '${{ secrets.COOLIFY_WEBHOOK }}' --header 'Authorization: Bearer ${{ secrets.COOLIFY_TOKEN }}'
37 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2021 Adam Hill
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/site/static/css/styles.css:
--------------------------------------------------------------------------------
 1 | td div.pos {
 2 |   color: green;
 3 |   width: 20px;
 4 |   font-weight: 700;
 5 |   text-align: center;
 6 |   margin: 0 auto;
 7 | }
 8 | 
 9 | td div.neg {
10 |   color: red;
11 |   width: 20px;
12 |   text-align: center;
13 |   margin: 0 auto;
14 | }
15 | 
16 | td div.unknown {
17 |   text-align: center;
18 |   margin: 0 auto;
19 | }
20 | 
21 | .centered {
22 |   text-align: center !important;
23 | }
24 | 
25 | .table {
26 |   border: 1px #ccc solid;
27 | }
28 | 
29 | .callout {
30 |   border: 1px #ccc solid;
31 |   background: #f2f2f2;
32 |   margin: 0px 3rem 0px 3rem;
33 |   border-radius: 1rem;
34 |   padding: 2rem;
35 | }
36 | 
37 | .container {
38 |   margin-left: 0px;
39 | }
40 | 
41 | .header.last-commit {
42 |   min-width: 8em;
43 | }
44 | 
45 | .header {
46 |   font-weight: bold;
47 | }
48 | 
49 | .info {
50 |   cursor: help;
51 |   color: grey;
52 |   font-weight: normal;
53 | }
54 | 
55 | .info::before {
56 |   content: '\27AF  ';
57 | }
58 | 
59 | .icon {
60 |   position: absolute;
61 | }
62 | 
63 | .icon+a {
64 |   padding-left: 28px;
65 | }
66 | 
67 | .digital-ocean {
68 |   float: right;
69 | }
70 | 
71 | @media only screen and (max-width: 30em) {
72 |   .digital-ocean {
73 |     display: none;
74 |   }
75 | }
76 | 


--------------------------------------------------------------------------------
/site/templatetags/custom_tags.py:
--------------------------------------------------------------------------------
 1 | import logging
 2 | 
 3 | import emoji_data_python
 4 | import iso8601
 5 | from api.github import add_metadata_from_graphql
 6 | from django import template
 7 | 
 8 | register = template.Library()
 9 | logger = logging.getLogger(__name__)
10 | 
11 | 
12 | @register.filter(name="humanize_int")
13 | def humanize_int(value: int) -> str:
14 |     try:
15 |         if value:
16 |             return f"{value:,}"
17 |     except Exception:
18 |         pass
19 | 
20 |     return str(value)
21 | 
22 | 
23 | @register.filter(name="humanize_datetime")
24 | def humanize_datetime(value: str) -> str:
25 |     if value:
26 |         return iso8601.parse_date(value).strftime("%Y-%m-%d")
27 | 
28 | 
29 | @register.simple_tag
30 | def hydrate_metadata(libraries: list[dict]) -> list[dict]:
31 |     sort_key = "last_commit"
32 | 
33 |     try:
34 |         libraries = add_metadata_from_graphql(libraries)
35 | 
36 |         return sorted(
37 |             libraries, key=lambda l: l.get(sort_key) or "", reverse=True
38 |         )
39 |     except AssertionError as e:
40 |         logger.exception(e)
41 | 
42 | 
43 | @register.filter(name="emojize")
44 | def emojize(value: str) -> str:
45 |     if value:
46 |         return emoji_data_python.replace_colons(value)
47 | 
48 |     return value
49 | 


--------------------------------------------------------------------------------
/site/data/css.json:
--------------------------------------------------------------------------------
 1 | [
 2 |   {
 3 |     "name": "Marx",
 4 |     "repo_url": "https://github.com/mblode/marx",
 5 |     "cdn_url": "https://unpkg.com/marx-css/css/marx.min.css",
 6 |     "demo_url": "https://mblode.github.io/marx/",
 7 |     "size": "3.0 kB",
 8 |     "classless": true
 9 |   }, {
10 |     "name": "MVP",
11 |     "repo_url": "https://github.com/andybrewer/mvp",
12 |     "cdn_url": "https://unpkg.com/mvp.css",
13 |     "demo_url": "https://andybrewer.github.io/mvp/mvp.html",
14 |     "size": "4.1 kB",
15 |     "classless": true
16 |   }, {
17 |     "name": "Sakura",
18 |     "repo_url": "https://github.com/oxalorg/sakura",
19 |     "cdn_url": "https://cdn.jsdelivr.net/npm/sakura.css/css/sakura.css",
20 |     "demo_url": "https://oxal.org/projects/sakura/demo/",
21 |     "size": "2.5 kB",
22 |     "classless": true
23 |   }, {
24 |     "name": "Simple.css",
25 |     "repo_url": "https://github.com/kevquirk/simple.css",
26 |     "cdn_url": "https://cdn.simplecss.org/simple.min.css",
27 |     "demo_url": "https://simplecss.org/",
28 |     "size": "2.9 kB",
29 |     "classless": true
30 |   }, {
31 |     "name": "Tacit",
32 |     "repo_url": "https://github.com/yegor256/tacit",
33 |     "cdn_url": "https://cdn.jsdelivr.net/gh/yegor256/tacit@gh-pages/tacit-css.min.css",
34 |     "demo_url": "https://yegor256.github.io/tacit/",
35 |     "size": "2.55 kB",
36 |     "classless": true
37 |   },  
38 | ]
39 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # unsuckjs.com / unsuckcss.com
 2 | 
 3 | Progressively enhance HTML with lightweight JavaScript/CSS libraries. No build tools and no compiling necessary. Most libraries should be 10 KB or less (minified).
 4 | 
 5 | ## 🤨 Why?
 6 | 
 7 | Sometimes you don't need an entire SPA framework just to load a progress spinner.
 8 | 
 9 | ## 🙋 Shouldn't this just be an `awesome` repo?
10 | 
11 | Yeah, probably.
12 | 
13 | ## 🛠️ Add a new library
14 | 
15 | 1. Fork this repo
16 | 1. Update `data/js.json` or `data/css.json` following the current examples
17 | 1. Make a PR
18 | 1. ???
19 | 1. Profit!
20 | 
21 | ## 🤓 Why use [coltrane](https://coltrane.adamghill.com) to build this site?
22 | 
23 | [unsuckjs.com](https://unsuckjs.com) and [unsuckcss.com](https://unsuckcss.com) look like static sites (and they mostly are), but I wanted to fetch repository metadata dynamically without having to re-run a static site generator on a schedule. So, I used [coltrane](https://coltrane.readthedocs.io) which gives the flexibility of using Django `templatetags` for server-side functionality. It's the best of both worlds.
24 | 
25 | Also... because it's my site and I wanted to. 🥹
26 | 
27 | ## 🔬 Local development
28 | 
29 | 1. Install [uv](https://docs.astral.sh/uv/getting-started/installation/)
30 | 1. `git clone` this repo
31 | 1. `cd` into the newly created directory
32 | 1. Create a personal access token at https://github.com/settings/tokens
33 | 1. `cp .env.example .env`
34 | 1. Update `.env` with your GitHub username and personal access token that was just created
35 | 1. `uv run coltrane play`; note: this will take a while on the first load because it loads a lot of data from the GitHub API
36 | 


--------------------------------------------------------------------------------
/pyproject.toml:
--------------------------------------------------------------------------------
 1 | [project]
 2 | name = "site"
 3 | version = "0.1.0"
 4 | dependencies = [
 5 |     "coltrane[angles, compressor, deploy, json5] >= 0.37.0",
 6 |     "iso8601 < 3",
 7 |     "django-cache-memoize < 1",
 8 |     "python-benedict < 1",
 9 |     "httpx < 1",
10 |     "hiredis < 3",
11 |     "redis < 5",
12 |     "refreshcss >= 0.5.1",
13 |     "emoji-data-python >= 1.6.0",
14 | ]
15 | requires-python = ">=3.10"
16 | 
17 | [tool.uv.sources]
18 | #coltrane = { path = "../coltrane", editable = true }
19 | #refreshcss = { path = "../refreshcss", editable = true }
20 | 
21 | [tool.ruff]
22 | src = ["coltrane"]
23 | exclude = []
24 | target-version = "py38"
25 | line-length = 120
26 | select = [
27 |   "A",
28 |   "ARG",
29 |   "B",
30 |   "C",
31 |   "DTZ",
32 |   "E",
33 |   "EM",
34 |   "F",
35 |   "FBT",
36 |   "I",
37 |   "ICN",
38 |   "ISC",
39 |   "N",
40 |   "PLC",
41 |   "PLE",
42 |   "PLR",
43 |   "PLW",
44 |   "Q",
45 |   "RUF",
46 |   "S",
47 |   "T",
48 |   "TID",
49 |   "UP",
50 |   "W",
51 |   "YTT",
52 | ]
53 | ignore = [
54 |   # Allow non-abstract empty methods in abstract base classes
55 |   "B027",
56 |   # Allow boolean positional values in function calls, like `dict.get(... True)`
57 |   "FBT003",
58 |   # Ignore checks for possible passwords
59 |   "S105", "S106", "S107",
60 |   # Ignore complexity
61 |   "C901", "PLR0911", "PLR0912", "PLR0913", "PLR0915",
62 |   # Ignore unused variables
63 |   "F841",
64 |    # Ignore exception strings
65 |   "EM101", "EM102",
66 | ]
67 | unfixable = [
68 |   # Don't touch unused imports
69 |   "F401",
70 | ]
71 | 
72 | [tool.ruff.pydocstyle]
73 | convention = "google"
74 | 
75 | [tool.ruff.isort]
76 | known-first-party = ["coltrane"]
77 | 
78 | [tool.ruff.flake8-tidy-imports]
79 | ban-relative-imports = "all"
80 | 
81 | [tool.ruff.per-file-ignores]
82 | # Tests can use magic values, assertions, and relative imports
83 | "tests/**/*" = ["PLR2004", "S101", "TID252", "ARG001"]
84 | 
85 | [tool.pytest.ini_options]
86 | addopts = "--quiet --failed-first -p no:warnings"
87 | testpaths = [
88 |     "tests"
89 | ]
90 | markers = [
91 |     "slow: marks tests as slow",
92 | ]
93 | pythonpath = [
94 |   "site"
95 | ]
96 | 


--------------------------------------------------------------------------------
/Dockerfile:
--------------------------------------------------------------------------------
 1 | # Layer with Python and some shared environment variables
 2 | FROM python:3.10-slim-bullseye as python
 3 | 
 4 | ENV PYTHONDONTWRITEBYTECODE=1
 5 | ENV PYTHONUNBUFFERED=1
 6 | 
 7 | # Layer for installing Python dependencies
 8 | FROM python as dependencies
 9 | 
10 | ENV VIRTUAL_ENV=/opt/venv
11 | 
12 | # Add some libraries sometimes needed for building Python dependencies, e.g. gcc
13 | RUN --mount=type=cache,target=/var/cache/apt,sharing=locked --mount=type=cache,target=/var/lib/apt,sharing=locked \
14 |     apt-get update --fix-missing && \
15 |     apt-get install --no-install-recommends -y \
16 |     build-essential
17 | 
18 | # Copy our Python requirements here
19 | COPY ./pyproject.toml .
20 | 
21 | # Install uv and Python dependencies
22 | # Note: Turn off pip progress bar because it seemed to cause some issues on deployment
23 | # Note: Using a virtualenv seems unnecessary, but it reduces the size of the resulting Docker image
24 | RUN --mount=type=cache,target=/root/.cache/pip --mount=type=cache,target=/root/.cache/uv \
25 |     python -m pip config --user set global.progress_bar off && \
26 |     python -m pip --disable-pip-version-check --no-color --no-input install --upgrade pip uv && \
27 |     uv venv /opt/venv && \
28 |     uv pip install --requirement pyproject.toml
29 | 
30 | 
31 | # Layer with only the Python dependencies needed for serving the app in production
32 | FROM python as production
33 | 
34 | # Copy over just the code
35 | COPY /site /site
36 | 
37 | # Copy over the virtualenv and add it to the path
38 | COPY --from=dependencies /opt/venv /opt/venv
39 | ENV PATH="/opt/venv/bin:$PATH"
40 | 
41 | WORKDIR /site
42 | 
43 | EXPOSE 80
44 | 
45 | # Install curl, collect static assets, compress static assets
46 | RUN --mount=type=cache,target=/var/cache/apt,sharing=locked --mount=type=cache,target=/var/lib/apt,sharing=locked \
47 |     apt-get update --fix-missing && \
48 |     apt-get install --no-install-recommends -y curl wget && \
49 |     python app.py collectstatic -v 2 --noinput && \
50 |     python app.py compress
51 | 
52 | HEALTHCHECK --interval=1m --timeout=10s --start-period=5s --retries=3 \
53 |   CMD curl -f http://0.0.0.0:80/static/svg/github.svg || exit 1
54 | 
55 | # Run gunicorn
56 | CMD ["gunicorn", "app:wsgi", "--config=gunicorn.conf.py"]
57 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
  1 | # Byte-compiled / optimized / DLL files
  2 | __pycache__/
  3 | *.py[cod]
  4 | *$py.class
  5 | 
  6 | # C extensions
  7 | *.so
  8 | 
  9 | # Distribution / packaging
 10 | .Python
 11 | build/
 12 | develop-eggs/
 13 | dist/
 14 | downloads/
 15 | eggs/
 16 | .eggs/
 17 | lib/
 18 | lib64/
 19 | parts/
 20 | sdist/
 21 | var/
 22 | wheels/
 23 | pip-wheel-metadata/
 24 | share/python-wheels/
 25 | *.egg-info/
 26 | .installed.cfg
 27 | *.egg
 28 | MANIFEST
 29 | 
 30 | # PyInstaller
 31 | #  Usually these files are written by a python script from a template
 32 | #  before PyInstaller builds the exe, so as to inject date/other infos into it.
 33 | *.manifest
 34 | *.spec
 35 | 
 36 | # Installer logs
 37 | pip-log.txt
 38 | pip-delete-this-directory.txt
 39 | 
 40 | # Unit test / coverage reports
 41 | htmlcov/
 42 | .tox/
 43 | .nox/
 44 | .coverage
 45 | .coverage.*
 46 | .cache
 47 | nosetests.xml
 48 | coverage.xml
 49 | *.cover
 50 | *.py,cover
 51 | .hypothesis/
 52 | .pytest_cache/
 53 | 
 54 | # Translations
 55 | *.mo
 56 | *.pot
 57 | 
 58 | # Django stuff:
 59 | *.log
 60 | local_settings.py
 61 | db.sqlite3
 62 | db.sqlite3-journal
 63 | 
 64 | # Flask stuff:
 65 | instance/
 66 | .webassets-cache
 67 | 
 68 | # Scrapy stuff:
 69 | .scrapy
 70 | 
 71 | # Sphinx documentation
 72 | docs/_build/
 73 | 
 74 | # PyBuilder
 75 | target/
 76 | 
 77 | # Jupyter Notebook
 78 | .ipynb_checkpoints
 79 | 
 80 | # IPython
 81 | profile_default/
 82 | ipython_config.py
 83 | 
 84 | # pyenv
 85 | .python-version
 86 | 
 87 | # pipenv
 88 | #   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
 89 | #   However, in case of collaboration, if having platform-specific dependencies or dependencies
 90 | #   having no cross-platform support, pipenv may install dependencies that don't work, or not
 91 | #   install all needed dependencies.
 92 | #Pipfile.lock
 93 | 
 94 | # PEP 582; used by e.g. github.com/David-OConnor/pyflow
 95 | __pypackages__/
 96 | 
 97 | # Celery stuff
 98 | celerybeat-schedule
 99 | celerybeat.pid
100 | 
101 | # SageMath parsed files
102 | *.sage.py
103 | 
104 | # Environments
105 | .env
106 | .venv
107 | env/
108 | venv/
109 | ENV/
110 | env.bak/
111 | venv.bak/
112 | 
113 | # mypy
114 | .mypy_cache/
115 | .dmypy.json
116 | dmypy.json
117 | 
118 | # Pyre type checker
119 | .pyre/
120 | 
121 | .DS_Store
122 | .vscode
123 | 
124 | site/output
125 | 


--------------------------------------------------------------------------------
/site/templates/base.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html>
 3 | 
 4 | <head>
 5 |   <meta charset="utf-8">
 6 |   <meta name="viewport" content="width=device-width, initial-scale=1">
 7 |   <title>
 8 |     <dj-block name='title'></dj-block>
 9 |   </title>
10 | 
11 |   {% compress css %}
12 |   <link rel="stylesheet" href="{% static 'css/bulma.min.css' %}">
13 |   <link rel="stylesheet" href="{% static 'css/styles.css' %}">
14 |   <link rel="stylesheet" href="{% static 'css/microtip.css' %}">
15 |   {% endcompress css %}
16 | 
17 |   <script defer data-domain="{% if site == 'unsuckcss' %}unsuckcss.com{% else %}unsuckjs.com{% endif %}"
18 |     src="https://plausible.io/js/script.tagged-events.outbound-links.js">
19 |   </script>
20 | </head>
21 | 
22 | <style></style>
23 | 
24 | <body>
25 |   <section class="section digital-ocean">
26 |     <a
27 |       href="https://www.digitalocean.com/?refcode=617d629f56c0&utm_campaign=Referral_Invite&utm_medium=Referral_Program&utm_source=badge"><img
28 |         src="https://web-platforms.sfo2.digitaloceanspaces.com/WWW/Badge%203.svg"
29 |         alt="DigitalOcean Referral Badge" /></a>
30 |   </section>
31 | 
32 |   <section class="section">
33 |     <div class="container">
34 |       <h1 class="title">
35 |         <dj-block name='headline'></dj-block>
36 |       </h1>
37 |       <p class="subtitle" style="padding-bottom: 5px; margin-bottom: 0px;">
38 |         <dj-block name='subtitle'></dj-block>
39 |       </p>
40 |     </div>
41 |   </section>
42 | 
43 |   <section class="section callout">
44 |     {% if site == 'unsuckcss' %}
45 |     <a href="https://github.com/adamghill/unsuckjs.com/blob/main/site/data/css.json">
46 |       Make a PR to add new frameworks +
47 |     </a>
48 |     {% else %}
49 |     <a href="https://github.com/adamghill/unsuckjs.com/blob/main/site/data/js.json">
50 |       Make a PR to add new libraries +
51 |     </a>
52 |     {% endif %}
53 | 
54 |     <dj-#>
55 |       <span style="float: right;">
56 |         Scroll for more info ➠
57 |       </span>
58 |     </dj-#>
59 |   </section>
60 | 
61 |   <dj-block name='content'></dj-block>
62 | 
63 |   <section class="section callout" style="margin-bottom: 1rem;">
64 |     {% if site == 'unsuckcss' %}
65 |     <a href="https://github.com/adamghill/unsuckjs.com/blob/main/site/data/css.json">
66 |       Make a PR to add new frameworks +
67 |     </a>
68 |     {% else %}
69 |     <a href="https://github.com/adamghill/unsuckjs.com/blob/main/site/data/js.json">
70 |       Make a PR to add new libraries +
71 |     </a>
72 |     {% endif %}
73 | 
74 |     <dj-#>
75 |       <span style="float: right;">
76 |         Scroll for more info ➠
77 |       </span>
78 |     </dj-#>
79 |   </section>
80 | 
81 |   <section class="section" style="text-align: center; margin-bottom: 1rem;">
82 |     <a
83 |       href="https://www.digitalocean.com/?refcode=617d629f56c0&utm_campaign=Referral_Invite&utm_medium=Referral_Program&utm_source=badge"><img
84 |         src="https://web-platforms.sfo2.digitaloceanspaces.com/WWW/Badge%203.svg"
85 |         alt="DigitalOcean Referral Badge" /></a>
86 |   </section>
87 | 
88 |   <dj-footer />
89 | </body>
90 | 
91 | </html>


--------------------------------------------------------------------------------
/site/api/github.py:
--------------------------------------------------------------------------------
  1 | import logging
  2 | 
  3 | import httpx
  4 | from benedict import benedict
  5 | from cache_memoize import cache_memoize
  6 | from django import template
  7 | from django.conf import settings
  8 | 
  9 | register = template.Library()
 10 | logger = logging.getLogger(__name__)
 11 | 
 12 | 
 13 | def get_repo_name(repo_url: str) -> str:
 14 |     github_repo_name = repo_url.strip()
 15 |     github_repo_name = github_repo_name.replace("https://github.com/", "")
 16 | 
 17 |     if github_repo_name.endswith("/"):
 18 |         github_repo_name = github_repo_name[:-1]
 19 | 
 20 |     return github_repo_name
 21 | 
 22 | 
 23 | def run_gql(repo_names):
 24 |     # TODO: Chunk up the list and run multiple queries when there are more than 100 libraries
 25 |     search_repos = " ".join([f"repo:{r}" for r in repo_names])
 26 | 
 27 |     gql = """
 28 | query repos($repo_names: String!) {
 29 |   search(
 30 |     type: REPOSITORY
 31 |     query: $repo_names
 32 |     first: 100
 33 |   ) {
 34 |     nodes {
 35 |       ... on Repository {
 36 |         defaultBranchRef {
 37 |           target {
 38 |             ... on Commit {
 39 |               history(first: 1) {
 40 |                 edges {
 41 |                   node {
 42 |                     authoredDate
 43 |                   }
 44 |                 }
 45 |               }
 46 |             }
 47 |           }
 48 |         }
 49 |         id
 50 |         description
 51 |         homepageUrl
 52 |         stargazers {
 53 |           totalCount
 54 |         }
 55 |         watchers {
 56 |           totalCount
 57 |         }
 58 |         forks {
 59 |           totalCount
 60 |         }
 61 |         nameWithOwner
 62 |         licenseInfo {
 63 |           url
 64 |           spdxId
 65 |         }
 66 |         issues(states: [OPEN]) {
 67 |           totalCount
 68 |         }
 69 |         releases(first: 1) {
 70 |           totalCount
 71 |           nodes {
 72 |             name
 73 |             tagName
 74 |           }
 75 |         }
 76 |       }
 77 |     }
 78 |   }
 79 | }
 80 | """
 81 | 
 82 |     headers = {"Authorization": f"Bearer {settings.ENV['GITHUB_PERSONAL_ACCESS_TOKEN']}"}
 83 | 
 84 |     res = httpx.post("https://api.github.com/graphql",
 85 |         json={"query": gql, "variables": {"repo_names": search_repos}},
 86 |         headers=headers,
 87 |         timeout=30)
 88 | 
 89 |     return res.json()
 90 | 
 91 | 
 92 | @cache_memoize(60 * 60 * 24, prefix="20240731")
 93 | def add_metadata_from_graphql(libraries: list[dict]) -> list[dict]:
 94 |     repo_names = [get_repo_name(l["repo_url"]) for l in libraries]
 95 | 
 96 |     metadata = {
 97 |         "description": None,
 98 |         "homepage_url": None,
 99 |         "stars": None,
100 |         "watchers": None,
101 |         "forks": None,
102 |         "open_issues": None,
103 |         "last_commit": None,
104 |         "latest_version": "",
105 |         "latest_tag": None,
106 |         "license": None,
107 |     }
108 | 
109 |     data = run_gql(repo_names)
110 | 
111 |     if "data" not in data:
112 |         raise AssertionError("Missing data from GraphQL")
113 | 
114 |     graphql_search_nodes = data["data"]["search"]["nodes"]
115 | 
116 |     for library in libraries:
117 |         library_metadata = metadata.copy()
118 |         repo_name = get_repo_name(library["repo_url"])
119 | 
120 |         graphql_data = filter(lambda d: d["nameWithOwner"] == repo_name, graphql_search_nodes)
121 | 
122 |         try:
123 |             graphql_data = next(iter(graphql_data))
124 |         except StopIteration:
125 |             continue
126 | 
127 |         graphql_data = benedict(graphql_data)
128 | 
129 |         library_metadata["description"] = graphql_data.description
130 |         library_metadata["homepage_url"] = graphql_data.homepageUrl
131 |         library_metadata["stars"] = graphql_data.stargazers.totalCount
132 |         library_metadata["watchers"] = graphql_data.watchers.totalCount
133 |         library_metadata["forks"] = graphql_data.forks.totalCount
134 |         library_metadata["open_issues"] = graphql_data.issues.totalCount
135 |         library_metadata["last_commit"] = graphql_data.defaultBranchRef.target.history.edges[0].node.authoredDate if graphql_data.defaultBranchRef.target.history.edges else None
136 |         library_metadata["latest_version"] = graphql_data.releases.nodes[0].name if graphql_data.releases.nodes else None
137 |         library_metadata["latest_tag"] = graphql_data.releases.nodes[0].tagName if graphql_data.releases.nodes else None
138 |         library_metadata["licenseSpdxId"] = graphql_data.licenseInfo.spdxId if graphql_data.licenseInfo else None
139 |         library_metadata["licenseUrl"] = graphql_data.licenseInfo.url if graphql_data.licenseInfo else None
140 | 
141 |         library.update(library_metadata)
142 | 
143 |     return libraries
144 | 


--------------------------------------------------------------------------------
/site/templates/footer.html:
--------------------------------------------------------------------------------
  1 | <footer class="footer">
  2 |   <div class="columns">
  3 |     <div class="column is-4">
  4 |       <h2 class="title is-6">Sites</h2>
  5 |       <ul>
  6 |         {% if site == 'unsuckcss' %}
  7 |         <li>
  8 |           <a href="https://unsuckjs.com">unsuckjs.com</a>
  9 |           <span class="info">
 10 |             Lightweight JavaScript libraries
 11 |           </span>
 12 |         </li>
 13 |         {% else %}
 14 |         <li>
 15 |           <a href="https://unsuckcss.com">unsuckcss.com</a>
 16 |           <span class="info">
 17 |             Lightweight CSS frameworks
 18 |           </span>
 19 |         </li>
 20 |         {% endif %}
 21 |         <li>
 22 |           <a href="https://fediview.com">fediview.com</a>
 23 |           <span class="info">
 24 |             Algorithmic timeline for Mastodon
 25 |           </span>
 26 |         </li>
 27 |         <li>
 28 |           <a href="https://devmarks.io">devmarks.io</a>
 29 |           <span class="info">
 30 |             Bookmarking for developers
 31 |           </span>
 32 |         </li>
 33 |         <li>
 34 |           <a href="https://alldjango.com">alldjango.com</a>
 35 |           <span class="info">
 36 |             No bullshit help for perfectionists
 37 |           </span>
 38 |         </li>
 39 |         <li>
 40 |           <a href="https://adamghill.com/python-utils">python-utils</a>
 41 |           <span class="info">
 42 |             Python playground
 43 |           </span>
 44 |         </li>
 45 |         <li>
 46 |           <a href="https://adamghill.com/isitwebscale">IsItWebscale</a>
 47 |           <span class="info">
 48 |             Is it web scale?!
 49 |           </span>
 50 |         </li>
 51 |         <li>
 52 |           <a href="https://adamghill.com">adamghill.com</a>
 53 |           <span class="info">
 54 |             Homebase
 55 |           </span>
 56 |         </li>
 57 |       </ul>
 58 |     </div>
 59 |     <div class="column is-4">
 60 |       <h2 class="title is-6">Colophon</h2>
 61 |       <ul class="pb-4">
 62 |         <li>
 63 |           <a href="https://coltrane.readthedocs.io">coltrane</a>
 64 |           <span class="info">
 65 |             Hybrid static site generator
 66 |           </span>
 67 |         </li>
 68 |         <li>
 69 |           <a href="https://dj-angles.adamghill.com/">dj-angles</a>
 70 |           <span class="info">
 71 |             Add more HTML into Django templates
 72 |           </span>
 73 |         </li>
 74 |         <li>
 75 |           <a href="https://github.com/adamghill/refreshcss">RefreshCSS</a>
 76 |           <span class="info">
 77 |             Removes unused classes, ids, and element selectors from CSS.
 78 |           </span>
 79 |         </li>
 80 |         <li>
 81 |           <a href="https://github.com/Iconscout/unicons">unicons</a>
 82 |         </li>
 83 |         <li>
 84 |           <a href="https://bulma.io/">Bulma CSS</a>
 85 |         </li>
 86 |       </ul>
 87 | 
 88 |       <h2 class="title is-6" style="margin-top: 36px;">Libraries</h2>
 89 |       <ul>
 90 |         <li>
 91 |           <a href="https://django-unicorn.com">unicorn</a>
 92 |           <span class="info">
 93 |             Reactive Django component library
 94 |           </span>
 95 |         </li>
 96 |         <li>
 97 |           <a href="https://minestrone.readthedocs.io">minestrone</a>
 98 |           <span class="info">
 99 |             Parse and modify messy HTML
100 |           </span>
101 |         </li>
102 |         <li>
103 |           <a href="https://django-fbv.readthedocs.io">django-fbv</a>
104 |           <span class="info">
105 |             Django function-based view utilities
106 |           </span>
107 |         </li>
108 |         <li>
109 |           <a href="https://django-rich-logging.readthedocs.io">django-rich-logging</a>
110 |           <span class="info">
111 |             Tail Django requests
112 |           </span>
113 |         </li>
114 |         <li>
115 |           <a href="https://dlitejs.com">dlite</a>
116 |           <span class="info">
117 |             Reactive Web Components (JS)
118 |           </span>
119 |         </li>
120 |       </ul>
121 |     </div>
122 |     <div class="column is-4">
123 |       <h2 class="title is-6">Writing</h2>
124 |       <ul>
125 |         <li>
126 |           <a href="https://github.com/adamghill">github.com/adamghill</a>
127 |           <span class="info">
128 |             Codes
129 |           </span>
130 |         </li>
131 |         <li>
132 |           <a href="https://indieweb.social/@adamghill">indieweb.social/@adamghill</a>
133 |           <span class="info">
134 |             Ramblings
135 |           </span>
136 |         </li>
137 |         <li>
138 |           <a href="https://dev.to/adamghill">dev.to/adamghill</a>
139 |           <span class="info">
140 |             Articles
141 |           </span>
142 |         </li>
143 |         <li>
144 |           <a href="https://www.indiehackers.com/adamghill">indiehackers.com/adamghill</a>
145 |           <span class="info">
146 |             Work in public
147 |           </span>
148 |         </li>
149 |       </ul>
150 |     </div>
151 |   </div>
152 | </footer>


--------------------------------------------------------------------------------
/site/templates/unsuckcss/index.html:
--------------------------------------------------------------------------------
  1 | <dj-extends parent='base' />
  2 | 
  3 | <dj-block name='title'>UnsuckCSS</dj-block>
  4 | 
  5 | <dj-block name='headline'>UnsuckCSS</dj-block>
  6 | 
  7 | <dj-block name='subtitle'>
  8 |   Enhance HTML with
  9 |   <abbr title="~20 KB or less" aria-label="~20 KB or less" data-microtip-position="top"
 10 |     role="tooltip">lightweight</abbr>
 11 |   CSS (or <a href="https://unsuckjs.com">JavaScript</a>) frameworks.
 12 | 
 13 |   <p>
 14 |     No build tools, no compilers, and no hassle.
 15 |   </p>
 16 | </dj-block>
 17 | 
 18 | <dj-block name='content'>
 19 |   <section class="section">
 20 |     <div class="table-container">
 21 |       <table class="table">
 22 |         {% hydrate_metadata data.css as frameworks %}
 23 | 
 24 |         <thead>
 25 |           <tr>
 26 |             <th class="header">Framework</th>
 27 |             <th class="header" style="min-width: 250px;">Description</th>
 28 |             <th class="header">License</th>
 29 |             <th class="header">
 30 |               <abbr title="Gzipped" aria-label="Gzipped" data-microtip-position="bottom" role="tooltip">Size</abbr>
 31 |             </th>
 32 |             <th class="header last-commit">Last commit</th>
 33 |             <th class="header" style="min-width: 100px;">Version</th>
 34 |             <th class="header">Stars</th>
 35 |             <dj-#>
 36 |               <th class="header">Watchers</th>
 37 |               <th class="header">Forks</th>
 38 |             </dj-#>
 39 |             <th class="header">Issues</th>
 40 |             <th class="header">Classless</th>
 41 |           </tr>
 42 |         </thead>
 43 |         <tfoot>
 44 |           <tr>
 45 |             <th class="header">Framework</th>
 46 |             <th class="header">Description</th>
 47 |             <th class="header">License</th>
 48 |             <th class="header">
 49 |               <abbr title="Gzipped" aria-label="Gzipped" data-microtip-position="top" role="tooltip">Size</abbr>
 50 |             </th>
 51 |             <th class="header">Last commit</th>
 52 |             <th class="header">Version</th>
 53 |             <th class="header">Stars</th>
 54 |             <dj-#>
 55 |               <th class="header">Watchers</th>
 56 |               <th class="header">Forks</th>
 57 |             </dj-#>
 58 |             <th class="header">Issues</th>
 59 |             <th class="header">Classless</th>
 60 |           </tr>
 61 |         </tfoot>
 62 |         <tbody>
 63 |           {% for framework in frameworks %}
 64 |           <tr>
 65 |             <td>
 66 |               <!-- Framework Name -->
 67 |               <div class="header" style="padding-bottom: 4px;">
 68 |                 {% if framework.homepage_url %}
 69 |                 <a href="{{ framework.homepage_url }}">{{ framework.name }}</a>
 70 |                 {% elif framework.repo_url %}
 71 |                 <a href="{{ framework.repo_url }}">{{ framework.name }}</a>
 72 |                 {% else %}
 73 |                 {{ framework.name }}
 74 |                 {% endif %}
 75 |               </div>
 76 | 
 77 |               {% if framework.repo_url %}
 78 |               <span>
 79 |                 <a href="{{ framework.repo_url }}">
 80 |                   <img src="{% static 'svg/github.svg' %}" class="">
 81 |                 </a>
 82 |               </span>
 83 |               {% endif %}
 84 | 
 85 |               {% if framework.cdn_url %}
 86 |               <span>
 87 |                 <a href="{{ framework.cdn_url }}">
 88 |                   <img src="{% static 'svg/globe.svg' %}" class="">
 89 |                 </a>
 90 |               </span>
 91 |               {% endif %}
 92 |             </td>
 93 | 
 94 |             <!-- Description -->
 95 |             <td>
 96 |               {{ framework.description|default:'--'|emojize }}
 97 |             </td>
 98 | 
 99 |             <!-- License -->
100 |             <td>
101 |               {% if framework.licenseSpdxId == 'NOASSERTION' %}
102 |               --
103 |               {% elif framework.licenseUrl %}
104 |               <a href="{{ framework.licenseUrl }}">{{ framework.licenseSpdxId }}</a>
105 |               {% elif framework.licenseSpdxId %}
106 |               {{ framework.licenseSpdxId }}
107 |               {% else %}
108 |               --
109 |               {% endif %}
110 |             </td>
111 | 
112 |             <!-- Minified Size -->
113 |             <td style="text-wrap: nowrap;">
114 |               {{ framework.size|default:'--' }}
115 |             </td>
116 | 
117 |             <!-- Last Commit -->
118 |             <td>
119 |               {{ framework.last_commit|humanize_datetime|default:"--" }}
120 |             </td>
121 | 
122 |             <!-- Version -->
123 |             <td>
124 |               {% if framework.latest_tag %}
125 |               <a href="{{ framework.repo_url }}/releases/tag/{{ framework.latest_tag }}">
126 |                 {{ framework.latest_version|default:"--"|truncatechars:14 }}
127 |               </a>
128 |               {% else %}
129 |               {{ framework.latest_version|default:"--"|truncatechars:14 }}
130 |               {% endif %}
131 |             </td>
132 | 
133 |             <!-- Stars -->
134 |             <td>
135 |               {{ framework.stars|humanize_int|default:"--" }}
136 |             </td>
137 | 
138 |             <dj-#>
139 |               <!-- Watchers -->
140 |               <td>
141 |                 {{ framework.watchers|humanize_int|default:"--" }}
142 |               </td>
143 | 
144 |               <!-- Forks -->
145 |               <td>
146 |                 {{ framework.forks|humanize_int|default:"--" }}
147 |               </td>
148 |             </dj-#>
149 | 
150 |             <!-- Open Issues -->
151 |             <td>
152 |               {% if framework.open_issues %}
153 |               <a href="{{ framework.repo_url }}/issues">{{ framework.open_issues|humanize_int|default:"--" }}</a>
154 |               {% else %}
155 |               {{ framework.open_issues|humanize_int|default:"--" }}</a>
156 |               {% endif %}
157 |             </td>
158 | 
159 |             <!-- Classlesss -->
160 |             <td>
161 |               {% if framework.classless is True %}
162 |               <div class="pos">
163 |                 ✓
164 |               </div>
165 |               {% elif framework.classless is False %}
166 |               <div class="neg">
167 |                 ❌
168 |               </div>
169 |               {% else %}
170 |               🤷
171 |               {% endif %}
172 |             </td>
173 |           </tr>
174 |           {% endfor %}
175 |         </tbody>
176 |       </table>
177 |     </div>
178 |   </section>
179 | </dj-block>


--------------------------------------------------------------------------------
/site/templates/unsuckjs/index.html:
--------------------------------------------------------------------------------
  1 | <dj-extends parent='base' />
  2 | 
  3 | <dj-block name='title'>UnsuckJS</dj-block>
  4 | 
  5 | <dj-block name='headline'>UnsuckJS</dj-block>
  6 | 
  7 | <dj-block name='subtitle'>
  8 |   Enhance HTML with
  9 |   <abbr title="~10 KB or less" aria-label="~10 KB or less" data-microtip-position="top"
 10 |     role="tooltip">lightweight</abbr>
 11 |   JavaScript (or <a href="https://unsuckcss.com">CSS</a>) libraries.
 12 | 
 13 |   <p>
 14 |     No build tools, no compilers, and no hassle.
 15 |   </p>
 16 | </dj-block>
 17 | 
 18 | <dj-block name='content'>
 19 |   <section class="section">
 20 |     <div class="table-container">
 21 |       <table class="table">
 22 |         {% hydrate_metadata data.js as libraries %}
 23 | 
 24 |         <thead>
 25 |           <tr>
 26 |             <th class="header">Library</th>
 27 |             <th class="header" style="min-width: 250px;">Description</th>
 28 |             <th class="header">
 29 |               <abbr title="Gzipped" aria-label="Gzipped" data-microtip-position="bottom" role="tooltip">Size</abbr>
 30 |             </th>
 31 |             <th class="header last-commit">Last commit</th>
 32 |             <th class="header" style="min-width: 100px;">Version</th>
 33 |             <th class="header">License</th>
 34 |             <th class="header">Stars</th>
 35 |             <dj-#>
 36 |               <th class="header">Watchers</th>
 37 |               <th class="header">Forks</th>
 38 |             </dj-#>
 39 |             <th class="header">Issues</th>
 40 |             <th class="header">Component</th>
 41 |             <th class="header">IE11</th>
 42 |           </tr>
 43 |         </thead>
 44 |         <tfoot>
 45 |           <tr>
 46 |             <th class="header">Library</th>
 47 |             <th class="header">Description</th>
 48 |             <th class="header">
 49 |               <abbr title="Gzipped" aria-label="Gzipped" data-microtip-position="top" role="tooltip">Size</abbr>
 50 |             </th>
 51 |             <th class="header">Last commit</th>
 52 |             <th class="header">Version</th>
 53 |             <th class="header">License</th>
 54 |             <th class="header">Stars</th>
 55 |             <dj-#>
 56 |               <th class="header">Watchers</th>
 57 |               <th class="header">Forks</th>
 58 |             </dj-#>
 59 |             <th class="header">Issues</th>
 60 |             <th class="header">Component</th>
 61 |             <th class="header">IE11</th>
 62 |           </tr>
 63 |         </tfoot>
 64 |         <tbody>
 65 |           {% for library in libraries %}
 66 |           <tr>
 67 |             <td>
 68 |               <!-- Library Name -->
 69 |               <div class="header" style="padding-bottom: 4px;">
 70 |                 {% if library.homepage_url %}
 71 |                 <a href="{{ library.homepage_url }}">{{ library.name }}</a>
 72 |                 {% elif library.repo_url %}
 73 |                 <a href="{{ library.repo_url }}">{{ library.name }}</a>
 74 |                 {% else %}
 75 |                 {{ library.name }}
 76 |                 {% endif %}
 77 |               </div>
 78 | 
 79 |               {% if library.repo_url %}
 80 |               <span>
 81 |                 <a href="{{ library.repo_url }}">
 82 |                   <img src="{% static 'svg/github.svg' %}" class="">
 83 |                 </a>
 84 |               </span>
 85 |               {% endif %}
 86 | 
 87 |               {% if library.cdn_url %}
 88 |               <span>
 89 |                 <a href="{{ library.cdn_url }}">
 90 |                   <img src="{% static 'svg/globe.svg' %}" class="">
 91 |                 </a>
 92 |               </span>
 93 |               {% endif %}
 94 |             </td>
 95 | 
 96 |             <!-- Description -->
 97 |             <td>
 98 |               {{ library.description|default:'--'|emojize }}
 99 |             </td>
100 | 
101 |             <!-- Minified Size -->
102 |             <td style="text-wrap: nowrap;">
103 |               {{ library.size|default:'--' }}
104 |             </td>
105 | 
106 |             <!-- Last Commit -->
107 |             <td>
108 |               {{ library.last_commit|humanize_datetime|default:"--" }}
109 |             </td>
110 | 
111 |             <!-- Version -->
112 |             <td>
113 |               {% if library.latest_tag %}
114 |               <a href="{{ library.repo_url }}/releases/tag/{{ library.latest_tag }}">
115 |                 {{ library.latest_version|default:"--"|truncatechars:14 }}
116 |               </a>
117 |               {% else %}
118 |               {{ library.latest_version|default:"--"|truncatechars:14 }}
119 |               {% endif %}
120 |             </td>
121 | 
122 |             <!-- License -->
123 |             <td>
124 |               {% if library.licenseSpdxId == 'NOASSERTION' %}
125 |               --
126 |               {% elif library.licenseUrl %}
127 |               <a href="{{ library.licenseUrl }}">{{ library.licenseSpdxId }}</a>
128 |               {% elif library.licenseSpdxId %}
129 |               {{ library.licenseSpdxId }}
130 |               {% else %}
131 |               --
132 |               {% endif %}
133 |             </td>
134 | 
135 |             <!-- Stars -->
136 |             <td>
137 |               {{ library.stars|humanize_int|default:"--" }}
138 |             </td>
139 | 
140 |             <dj-#>
141 |               <!-- Watchers -->
142 |               <td>
143 |                 {{ library.watchers|humanize_int|default:"--" }}
144 |               </td>
145 | 
146 |               <!-- Forks -->
147 |               <td>
148 |                 {{ library.forks|humanize_int|default:"--" }}
149 |               </td>
150 |             </dj-#>
151 | 
152 |             <!-- Open Issues -->
153 |             <td>
154 |               {% if library.open_issues %}
155 |               <a href="{{ library.repo_url }}/issues">{{ library.open_issues|humanize_int|default:"--" }}</a>
156 |               {% else %}
157 |               {{ library.open_issues|humanize_int|default:"--" }}</a>
158 |               {% endif %}
159 |             </td>
160 | 
161 |             <!-- Web Components -->
162 |             <td>
163 |               {% if library.web_components is True %}
164 |               <div class="pos">
165 |                 ✓
166 |               </div>
167 |               {% elif library.web_components is False %}
168 |               <div class="neg">
169 |                 ❌
170 |               </div>
171 |               {% else %}
172 |               <div class="unknown">
173 |                 🤷
174 |               </div>
175 |               {% endif %}
176 |             </td>
177 | 
178 |             <!-- IE11 Compatible -->
179 |             <td>
180 |               {% if library.ie11_compatible is True %}
181 |               <div class="pos">
182 |                 ✓
183 |               </div>
184 |               {% elif library.ie11_compatible is False %}
185 |               <div class="neg">
186 |                 ❌
187 |               </div>
188 |               {% else %}
189 |               <div class="unknown">
190 |                 🤷
191 |               </div>
192 |               {% endif %}
193 |             </td>
194 |           </tr>
195 |           {% endfor %}
196 |         </tbody>
197 |       </table>
198 |     </div>
199 |   </section>
200 | </dj-block>


--------------------------------------------------------------------------------
/site/data/js.json:
--------------------------------------------------------------------------------
  1 | [
  2 |     {
  3 |         "name": "Realm",
  4 |         "repo_url": "https://github.com/realmorg/realm",
  5 |         "size": "~12 kB - ~20 kB",
  6 |         "cdn_url": "https://unpkg.com/@realmorg/realm@0.0.17/dist/realm.production.min.js",
  7 |         "web_components": true,
  8 |         "categories": ["ui"]
  9 |     },
 10 |     {
 11 |         "name": "Facet",
 12 |         "repo_url": "https://github.com/kgscialdone/facet",
 13 |         "size": "~5.74 kB - ~10.1 kB",
 14 |         "cdn_url": "https://cdn.jsdelivr.net/gh/kgscialdone/facet@0.1.2a/facet.min.js",
 15 |         "web_components": true,
 16 |         "categories": ["ui", "dom"]
 17 |     },
 18 |     {
 19 |         "name": "RE:DOM",
 20 |         "repo_url": "https://github.com/redom/redom",
 21 |         "size": "~2 kB",
 22 |         "cdn_url": "https://redom.js.org/redom.min.js",
 23 |         "web_components": false,
 24 |         "categories": ["ui"]
 25 |     },
 26 |     {
 27 |         "name": "Alpine.js",
 28 |         "repo_url": "https://github.com/alpinejs/alpine",
 29 |         "size": "~12 kB",
 30 |         "cdn_url": "https://unpkg.com/alpinejs",
 31 |         "categories": ["ui"]
 32 |     },
 33 |     {
 34 |         "name": "Mithril",
 35 |         "repo_url": "https://github.com/MithrilJS/mithril.js",
 36 |         "size": "~9.5 kB",
 37 |         "ie11_compatible": true,
 38 |         "cdn_url": "https://unpkg.com/mithril",
 39 |         "categories": ["ui"]
 40 |     },
 41 |     {
 42 |         "name": "htmx",
 43 |         "repo_url": "https://github.com/bigskysoftware/htmx",
 44 |         "size": "~10 kB",
 45 |         "ie11_compatible": true,
 46 |         "cdn_url": "https://unpkg.com/htmx.org",
 47 |         "categories": ["ui", "ajax"]
 48 |     },
 49 |     {
 50 |         "name": "petite-vue",
 51 |         "repo_url": "https://github.com/vuejs/petite-vue",
 52 |         "size": "~5.8 kB",
 53 |         "cdn_url": "https://unpkg.com/petite-vue",
 54 |         "categories": ["ui"]
 55 |     },
 56 |     {
 57 |         "name": "Litedom",
 58 |         "repo_url": "https://github.com/mardix/litedom",
 59 |         "size": "~3 kB",
 60 |         "cdn_url": "https://unpkg.com/litedom",
 61 |         "web_components": true,
 62 |         "categories": ["ui"]
 63 |     },
 64 |     {
 65 |         "name": "CalDOM",
 66 |         "repo_url": "https://github.com/dumijay/CalDom",
 67 |         "size": "~3 kB",
 68 |         "cdn_url": "https://unpkg.com/caldom",
 69 |         "categories": ["ui", "dom"]
 70 |     },
 71 |     {
 72 |         "name": "bdc-js",
 73 |         "repo_url": "https://github.com/bwhmather/bdc-js",
 74 |         "size": "~1 kB",
 75 |         "cdn_url": "https://github.com/bwhmather/bdc-js/releases/download/v1.0.0/bdc.min.js",
 76 |         "categories": ["ui", "dom"]
 77 |     },
 78 |     {
 79 |         "name": "diffHTML",
 80 |         "repo_url": "https://github.com/tbranyen/diffhtml",
 81 |         "size": "8 kB - 11 kB",
 82 |         "cdn_url": "https://unpkg.com/diffhtml/dist/diffhtml.min.js",
 83 |         "categories": ["ui", "dom"]
 84 |     },
 85 |     {
 86 |         "name": "dlite",
 87 |         "repo_url": "https://github.com/adamghill/dlite",
 88 |         "size": "<5 kB",
 89 |         "cdn_url": "https://unpkg.com/dlite",
 90 |         "web_components": true,
 91 |         "categories": ["ui"]
 92 |     },
 93 |     {
 94 |         "name": "spræ",
 95 |         "repo_url": "https://github.com/dy/sprae",
 96 |         "size": "~5 kB",
 97 |         "categories": ["ui"]
 98 |     },
 99 |     {
100 |         "name": "lit",
101 |         "repo_url": "https://github.com/lit/lit",
102 |         "size": "~5 kB",
103 |         "web_components": true,
104 |         "ie11_compatible": true,
105 |         "cdn_url": "https://cdn.jsdelivr.net/gh/lit/dist/core/lit-core.min.js",
106 |         "categories": ["ui"]
107 |     },
108 |     {
109 |         "name": "strawberry",
110 |         "repo_url": "https://github.com/18alantom/strawberry",
111 |         "size": "~5 kB",
112 |         "web_components": true,
113 |         "cdn_url": "https://unpkg.com/sberry/dist/sb.min.js",
114 |         "categories": ["ui"]
115 |     },
116 |     {
117 |         "name": "ponys",
118 |         "repo_url": "https://github.com/jhuddle/ponys",
119 |         "size": "<2 kB",
120 |         "web_components": true,
121 |         "cdn_url": "https://cdn.jsdelivr.net/gh/jhuddle/ponys/miniature-ponys.js",
122 |         "categories": ["ui"]
123 |     },
124 |     {
125 |         "name": "dom-proxy",
126 |         "repo_url": "https://github.com/beenotung/dom-proxy",
127 |         "size": "<9 kB",
128 |         "web_components": true,
129 |         "cdn_url": "https://cdn.jsdelivr.net/npm/dom-proxy/browser.min.js",
130 |         "categories": ["ui"]
131 |     },
132 |     {
133 |         "name": "reken",
134 |         "repo_url": "https://github.com/hbroek/reken",
135 |         "size": "5 kB",
136 |         "web_components": false,
137 |         "cdn_url": "https://cdn.jsdelivr.net/gh/hbroek/reken/dist/reken.min.js",
138 |         "categories": ["ui"]
139 |     },
140 |     {
141 |         "name": "preact",
142 |         "repo_url": "https://github.com/preactjs/preact",
143 |         "size": "3 kB",
144 |         "web_components": true,
145 |         "ie11_compatible": true,
146 |         "cdn_url": null,
147 |         "categories": ["ui"]
148 |     },
149 |     {
150 |         "name": "VanJS",
151 |         "repo_url": "https://github.com/vanjs-org/van",
152 |         "size": "1.4 kB",
153 |         "web_components": false,
154 |         "cdn_url": "https://cdn.jsdelivr.net/gh/vanjs-org/van/public/van-latest.min.js",
155 |         "categories": ["ui"]
156 |     },
157 |     {
158 |         "name": "hyperapp",
159 |         "repo_url": "https://github.com/jorgebucaran/hyperapp",
160 |         "size": "1 kB",
161 |         "web_components": false,
162 |         "cdn_url": "https://unpkg.com/hyperapp",
163 |         "categories": ["ui"]
164 |     },
165 |     {
166 |         "name": "TwinSpark",
167 |         "repo_url": "https://github.com/piranha/twinspark-js",
168 |         "size": "8 kB",
169 |         "web_components": false,
170 |         "cdn_url": "https://github.com/piranha/twinspark-js",
171 |         "categories": ["ui"]
172 |     },
173 |     {
174 |         "name": "data-template",
175 |         "repo_url": "https://github.com/beenotung/data-template",
176 |         "size": "1.2 kB",
177 |         "web_components": false,
178 |         "cdn_url": "https://cdn.jsdelivr.net/npm/data-template/base.js",
179 |         "categories": ["ui"]
180 |     },
181 |     {
182 |         "name": "Tram-Lite",
183 |         "repo_url": "https://github.com/Tram-One/tram-lite",
184 |         "size": "1.6 kB",
185 |         "web_components": true,
186 |         "cdn_url": "https://unpkg.com/tram-lite",
187 |         "categories": ["ui"]
188 |     },
189 |     {   
190 |         "name": "Bau",
191 |         "repo_url": "https://github.com/grucloud/bau",
192 |         "size": "1.6 kB",
193 |         "web_components": false,
194 |         "cdn_url": "https://unpkg.com/@grucloud/bau",
195 |         "categories": ["ui"]
196 |     },
197 |     {   
198 |         "name": "Crank.js",
199 |         "repo_url": "https://github.com/bikeshaving/crank",
200 |         "size": "~16 kB",
201 |         "web_components": false,
202 |         "cdn_url": "https://unpkg.com/@b9g/crank?module",
203 |         "categories": ["ui"]
204 |     },
205 |     {   
206 |         "name": "lighterhtml",
207 |         "repo_url": "https://github.com/WebReflection/lighterhtml",
208 |         "size": "<2 kB",
209 |         "web_components": true,
210 |         "cdn_url": "https://unpkg.com/lighterhtml?module",
211 |         "categories": ["ui"]
212 |     },
213 |     {   
214 |         "name": "µhtml",
215 |         "repo_url": "https://github.com/WebReflection/uhtml",
216 |         "size": "<3 kB",
217 |         "web_components": true,
218 |         "cdn_url": "https://unpkg.com/uhtml",
219 |         "categories": ["ui"]
220 |     },
221 |     {   
222 |         "name": "Lithent",
223 |         "repo_url": "https://github.com/superlucky84/lithent",
224 |         "size": "3 kB",
225 |         "web_components": false,
226 |         "cdn_url": "https://cdn.jsdelivr.net/npm/lithent/dist/lithent.umd.js",
227 |         "categories": ["ui"]
228 |     },
229 |     {
230 |         "name": "reef",
231 |         "repo_url": "https://github.com/cferdinandi/reef",
232 |         "size": "1.6 kB",
233 |         "cdn_url": "https://cdn.jsdelivr.net/npm/reefjs@12/dist/reef.min.js",
234 |         "web_components": false,
235 |         "ie11_compatible": false,
236 |         "categories": ["ui"]
237 |     },
238 |     {
239 |         "name": "tmpl-htm",
240 |         "repo_url": "https://github.com/superlucky84/tmpl-htm",
241 |         "size": "1.9 kB",
242 |         "web_components": false,
243 |         "cdn_url": "https://cdn.jsdelivr.net/npm/tmpl-htm",
244 |         "categories": ["ui"]
245 |     },
246 |     {
247 |         "name": "conjure",
248 |         "repo_url": "https://github.com/adamghill/conjure",
249 |         "size": "<1 kB",
250 |         "web_components": false,
251 |         "categories": ["ui"]
252 |     },
253 |     {
254 |         "name": "arrow-js",
255 |         "repo_url": "https://github.com/justin-schroeder/arrow-js",
256 |         "size": "~2 kB",
257 |         "web_components": false,
258 |         "cdn_url": "https://esm.sh/@arrow-js/core",
259 |         "categories": ["ui"]
260 |     },
261 |     {
262 |         "name": "minijs",
263 |         "repo_url": "https://github.com/Group-One-Technology/minijs",
264 |         "size": null,
265 |         "web_components": false,
266 |         "cdn_url": null,
267 |         "categories": ["ui"]
268 |     },
269 | ]
270 | 


--------------------------------------------------------------------------------
/site/static/css/microtip.css:
--------------------------------------------------------------------------------
  1 | /* -------------------------------------------------------------------
  2 |   Microtip
  3 | 
  4 |   Modern, lightweight css-only tooltips
  5 |   Just 1kb minified and gzipped
  6 | 
  7 |   @author Ghosh
  8 |   @package Microtip
  9 | 
 10 | ----------------------------------------------------------------------
 11 |   1. Base Styles
 12 |   2. Direction Modifiers
 13 |   3. Position Modifiers
 14 | --------------------------------------------------------------------*/
 15 | 
 16 | 
 17 | /* ------------------------------------------------
 18 |   [1] Base Styles
 19 | -------------------------------------------------*/
 20 | 
 21 | [aria-label][role~="tooltip"] {
 22 |     position: relative;
 23 |   }
 24 |   
 25 |   [aria-label][role~="tooltip"]::before,
 26 |   [aria-label][role~="tooltip"]::after {
 27 |     transform: translate3d(0, 0, 0);
 28 |     -webkit-backface-visibility: hidden;
 29 |     backface-visibility: hidden;
 30 |     will-change: transform;
 31 |     opacity: 0;
 32 |     pointer-events: none;
 33 |     transition: all var(--microtip-transition-duration, .18s) var(--microtip-transition-easing, ease-in-out) var(--microtip-transition-delay, 0s);
 34 |     position: absolute;
 35 |     box-sizing: border-box;
 36 |     z-index: 10;
 37 |     transform-origin: top;
 38 |   }
 39 |   
 40 |   [aria-label][role~="tooltip"]::before {
 41 |     background-size: 100% auto !important;
 42 |     content: "";
 43 |   }
 44 |   
 45 |   [aria-label][role~="tooltip"]::after {
 46 |     background: rgba(17, 17, 17, .9);
 47 |     border-radius: 4px;
 48 |     color: #ffffff;
 49 |     content: attr(aria-label);
 50 |     font-size: var(--microtip-font-size, 13px);
 51 |     font-weight: var(--microtip-font-weight, normal);
 52 |     text-transform: var(--microtip-text-transform, none);
 53 |     padding: .5em 1em;
 54 |     white-space: nowrap;
 55 |     box-sizing: content-box;
 56 |   }
 57 |   
 58 |   [aria-label][role~="tooltip"]:hover::before,
 59 |   [aria-label][role~="tooltip"]:hover::after,
 60 |   [aria-label][role~="tooltip"]:focus::before,
 61 |   [aria-label][role~="tooltip"]:focus::after {
 62 |     opacity: 1;
 63 |     pointer-events: auto;
 64 |   }
 65 |   
 66 |   
 67 |   
 68 |   /* ------------------------------------------------
 69 |     [2] Position Modifiers
 70 |   -------------------------------------------------*/
 71 |   
 72 |   [role~="tooltip"][data-microtip-position|="top"]::before {
 73 |     background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2236px%22%20height%3D%2212px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%280%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
 74 |     height: 6px;
 75 |     width: 18px;
 76 |     margin-bottom: 5px;
 77 |   }
 78 |   
 79 |   [role~="tooltip"][data-microtip-position|="top"]::after {
 80 |     margin-bottom: 11px;
 81 |   }
 82 |   
 83 |   [role~="tooltip"][data-microtip-position|="top"]::before {
 84 |     transform: translate3d(-50%, 0, 0);
 85 |     bottom: 100%;
 86 |     left: 50%;
 87 |   }
 88 |   
 89 |   [role~="tooltip"][data-microtip-position|="top"]:hover::before {
 90 |     transform: translate3d(-50%, -5px, 0);
 91 |   }
 92 |   
 93 |   [role~="tooltip"][data-microtip-position|="top"]::after {
 94 |     transform: translate3d(-50%, 0, 0);
 95 |     bottom: 100%;
 96 |     left: 50%;
 97 |   }
 98 |   
 99 |   [role~="tooltip"][data-microtip-position="top"]:hover::after {
100 |     transform: translate3d(-50%, -5px, 0);
101 |   }
102 |   
103 |   /* ------------------------------------------------
104 |     [2.1] Top Left
105 |   -------------------------------------------------*/
106 |   [role~="tooltip"][data-microtip-position="top-left"]::after {
107 |     transform: translate3d(calc(-100% + 16px), 0, 0);
108 |     bottom: 100%;
109 |   }
110 |   
111 |   [role~="tooltip"][data-microtip-position="top-left"]:hover::after {
112 |     transform: translate3d(calc(-100% + 16px), -5px, 0);
113 |   }
114 |   
115 |   
116 |   /* ------------------------------------------------
117 |     [2.2] Top Right
118 |   -------------------------------------------------*/
119 |   [role~="tooltip"][data-microtip-position="top-right"]::after {
120 |     transform: translate3d(calc(0% + -16px), 0, 0);
121 |     bottom: 100%;
122 |   }
123 |   
124 |   [role~="tooltip"][data-microtip-position="top-right"]:hover::after {
125 |     transform: translate3d(calc(0% + -16px), -5px, 0);
126 |   }
127 |   
128 |   
129 |   /* ------------------------------------------------
130 |     [2.3] Bottom
131 |   -------------------------------------------------*/
132 |   [role~="tooltip"][data-microtip-position|="bottom"]::before {
133 |     background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2236px%22%20height%3D%2212px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%28180%2018%206%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
134 |     height: 6px;
135 |     width: 18px;
136 |     margin-top: 5px;
137 |     margin-bottom: 0;
138 |   }
139 |   
140 |   [role~="tooltip"][data-microtip-position|="bottom"]::after {
141 |     margin-top: 11px;
142 |   }
143 |   
144 |   [role~="tooltip"][data-microtip-position|="bottom"]::before {
145 |     transform: translate3d(-50%, -10px, 0);
146 |     bottom: auto;
147 |     left: 50%;
148 |     top: 100%;
149 |   }
150 |   
151 |   [role~="tooltip"][data-microtip-position|="bottom"]:hover::before {
152 |     transform: translate3d(-50%, 0, 0);
153 |   }
154 |   
155 |   [role~="tooltip"][data-microtip-position|="bottom"]::after {
156 |     transform: translate3d(-50%, -10px, 0);
157 |     top: 100%;
158 |     left: 50%;
159 |   }
160 |   
161 |   [role~="tooltip"][data-microtip-position="bottom"]:hover::after {
162 |     transform: translate3d(-50%, 0, 0);
163 |   }
164 |   
165 |   
166 |   /* ------------------------------------------------
167 |     [2.4] Bottom Left
168 |   -------------------------------------------------*/
169 |   [role~="tooltip"][data-microtip-position="bottom-left"]::after {
170 |     transform: translate3d(calc(-100% + 16px), -10px, 0);
171 |     top: 100%;
172 |   }
173 |   
174 |   [role~="tooltip"][data-microtip-position="bottom-left"]:hover::after {
175 |     transform: translate3d(calc(-100% + 16px), 0, 0);
176 |   }
177 |   
178 |   
179 |   /* ------------------------------------------------
180 |     [2.5] Bottom Right
181 |   -------------------------------------------------*/
182 |   [role~="tooltip"][data-microtip-position="bottom-right"]::after {
183 |     transform: translate3d(calc(0% + -16px), -10px, 0);
184 |     top: 100%;
185 |   }
186 |   
187 |   [role~="tooltip"][data-microtip-position="bottom-right"]:hover::after {
188 |     transform: translate3d(calc(0% + -16px), 0, 0);
189 |   }
190 |   
191 |   
192 |   /* ------------------------------------------------
193 |     [2.6] Left
194 |   -------------------------------------------------*/
195 |   [role~="tooltip"][data-microtip-position="left"]::before,
196 |   [role~="tooltip"][data-microtip-position="left"]::after {
197 |     bottom: auto;
198 |     left: auto;
199 |     right: 100%;
200 |     top: 50%;
201 |     transform: translate3d(10px, -50%, 0);
202 |   }
203 |   
204 |   [role~="tooltip"][data-microtip-position="left"]::before {
205 |     background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212px%22%20height%3D%2236px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%28-90%2018%2018%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
206 |     height: 18px;
207 |     width: 6px;
208 |     margin-right: 5px;
209 |     margin-bottom: 0;
210 |   }
211 |   
212 |   [role~="tooltip"][data-microtip-position="left"]::after {
213 |     margin-right: 11px;
214 |   }
215 |   
216 |   [role~="tooltip"][data-microtip-position="left"]:hover::before,
217 |   [role~="tooltip"][data-microtip-position="left"]:hover::after {
218 |     transform: translate3d(0, -50%, 0);
219 |   }
220 |   
221 |   
222 |   /* ------------------------------------------------
223 |     [2.7] Right
224 |   -------------------------------------------------*/
225 |   [role~="tooltip"][data-microtip-position="right"]::before,
226 |   [role~="tooltip"][data-microtip-position="right"]::after {
227 |     bottom: auto;
228 |     left: 100%;
229 |     top: 50%;
230 |     transform: translate3d(-10px, -50%, 0);
231 |   }
232 |   
233 |   [role~="tooltip"][data-microtip-position="right"]::before {
234 |     background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212px%22%20height%3D%2236px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%2890%206%206%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
235 |     height: 18px;
236 |     width: 6px;
237 |     margin-bottom: 0;
238 |     margin-left: 5px;
239 |   }
240 |   
241 |   [role~="tooltip"][data-microtip-position="right"]::after {
242 |     margin-left: 11px;
243 |   }
244 |   
245 |   [role~="tooltip"][data-microtip-position="right"]:hover::before,
246 |   [role~="tooltip"][data-microtip-position="right"]:hover::after {
247 |     transform: translate3d(0, -50%, 0);
248 |   }
249 |   
250 |   /* ------------------------------------------------
251 |     [3] Size
252 |   -------------------------------------------------*/
253 |   [role~="tooltip"][data-microtip-size="small"]::after {
254 |     white-space: initial;
255 |     width: 80px;
256 |   }
257 |   
258 |   [role~="tooltip"][data-microtip-size="medium"]::after {
259 |     white-space: initial;
260 |     width: 150px;
261 |   }
262 |   
263 |   [role~="tooltip"][data-microtip-size="large"]::after {
264 |     white-space: initial;
265 |     width: 260px;
266 |   }


--------------------------------------------------------------------------------
/site/static/css/bulma.min.css:
--------------------------------------------------------------------------------
1 | /*! bulma.io v0.9.3 | MIT License | github.com/jgthms/bulma *//*! Generated by Bulma Customizer v0.2.0 | https://github.com/webmasterish/bulma-customizer */.is-unselectable{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.title:not(:last-child),.subtitle:not(:last-child),.table-container:not(:last-child),.table:not(:last-child){margin-bottom:1.5rem}.is-overlay{bottom:0;left:0;position:absolute;right:0;top:0}/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}ul{list-style:none}button,input,select,textarea{margin:0}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}img,video{height:auto;max-width:100%}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}td:not([align]),th:not([align]){text-align:inherit}html{background-color:#fff;font-size:16px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;min-width:300px;overflow-x:hidden;overflow-y:scroll;text-rendering:optimizeLegibility;text-size-adjust:100%}article,aside,figure,footer,header,hgroup,section{display:block}body,button,input,optgroup,select,textarea{font-family:BlinkMacSystemFont,-apple-system,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue","Helvetica","Arial",sans-serif}code,pre{-moz-osx-font-smoothing:auto;-webkit-font-smoothing:auto;font-family:monospace}body{color:#4a4a4a;font-size:1em;font-weight:400;line-height:1.5}a{color:#485fc7;cursor:pointer;text-decoration:none}a strong{color:currentColor}a:hover{color:#363636}code{background-color:#f5f5f5;color:#da1039;font-size:.875em;font-weight:normal;padding:.25em .5em .25em}hr{background-color:#f5f5f5;border:none;display:block;height:2px;margin:1.5rem 0}img{height:auto;max-width:100%}input[type=checkbox],input[type=radio]{vertical-align:baseline}small{font-size:.875em}span{font-style:inherit;font-weight:inherit}strong{color:#363636;font-weight:700}fieldset{border:none}pre{-webkit-overflow-scrolling:touch;background-color:#f5f5f5;color:#4a4a4a;font-size:.875em;overflow-x:auto;padding:1.25rem 1.5rem;white-space:pre;word-wrap:normal}pre code{background-color:transparent;color:currentColor;font-size:1em;padding:0}table td,table th{vertical-align:top}table td:not([align]),table th:not([align]){text-align:inherit}table th{color:#363636}.container{flex-grow:1;margin:0 auto;position:relative;width:auto}.container.is-fluid{max-width:none !important;padding-left:32px;padding-right:32px;width:100%}@media screen and (min-width: 1024px){.container{max-width:960px}}@media screen and (max-width: 1215px){.container.is-widescreen:not(.is-max-desktop){max-width:1152px}}@media screen and (max-width: 1407px){.container.is-fullhd:not(.is-max-desktop):not(.is-max-widescreen){max-width:1344px}}@media screen and (min-width: 1216px){.container:not(.is-max-desktop){max-width:1152px}}@media screen and (min-width: 1408px){.container:not(.is-max-desktop):not(.is-max-widescreen){max-width:1344px}}.table{background-color:#fff;color:#363636}.table td,.table th{border:1px solid #dbdbdb;border-width:0 0 1px;padding:.5em .75em;vertical-align:top}.table td.is-white,.table th.is-white{background-color:#fff;border-color:#fff;color:#0a0a0a}.table td.is-black,.table th.is-black{background-color:#0a0a0a;border-color:#0a0a0a;color:#fff}.table td.is-light,.table th.is-light{background-color:#f5f5f5;border-color:#f5f5f5;color:rgba(0,0,0,.7)}.table td.is-dark,.table th.is-dark{background-color:#363636;border-color:#363636;color:#fff}.table td.is-primary,.table th.is-primary{background-color:#00d1b2;border-color:#00d1b2;color:#fff}.table td.is-link,.table th.is-link{background-color:#485fc7;border-color:#485fc7;color:#fff}.table td.is-info,.table th.is-info{background-color:#3e8ed0;border-color:#3e8ed0;color:#fff}.table td.is-success,.table th.is-success{background-color:#48c78e;border-color:#48c78e;color:#fff}.table td.is-warning,.table th.is-warning{background-color:#ffe08a;border-color:#ffe08a;color:rgba(0,0,0,.7)}.table td.is-danger,.table th.is-danger{background-color:#f14668;border-color:#f14668;color:#fff}.table td.is-narrow,.table th.is-narrow{white-space:nowrap;width:1%}.table td.is-selected,.table th.is-selected{background-color:#00d1b2;color:#fff}.table td.is-selected a,.table td.is-selected strong,.table th.is-selected a,.table th.is-selected strong{color:currentColor}.table td.is-vcentered,.table th.is-vcentered{vertical-align:middle}.table th{color:#363636}.table th:not([align]){text-align:inherit}.table tr.is-selected{background-color:#00d1b2;color:#fff}.table tr.is-selected a,.table tr.is-selected strong{color:currentColor}.table tr.is-selected td,.table tr.is-selected th{border-color:#fff;color:currentColor}.table thead{background-color:transparent}.table thead td,.table thead th{border-width:0 0 2px;color:#363636}.table tfoot{background-color:transparent}.table tfoot td,.table tfoot th{border-width:2px 0 0;color:#363636}.table tbody{background-color:transparent}.table tbody tr:last-child td,.table tbody tr:last-child th{border-bottom-width:0}.table.is-bordered td,.table.is-bordered th{border-width:1px}.table.is-bordered tr:last-child td,.table.is-bordered tr:last-child th{border-bottom-width:1px}.table.is-fullwidth{width:100%}.table.is-hoverable tbody tr:not(.is-selected):hover{background-color:#fafafa}.table.is-hoverable.is-striped tbody tr:not(.is-selected):hover{background-color:#fafafa}.table.is-hoverable.is-striped tbody tr:not(.is-selected):hover:nth-child(even){background-color:#f5f5f5}.table.is-narrow td,.table.is-narrow th{padding:.25em .5em}.table.is-striped tbody tr:not(.is-selected):nth-child(even){background-color:#fafafa}.table-container{-webkit-overflow-scrolling:touch;overflow:auto;overflow-y:hidden;max-width:100%}.title,.subtitle{word-break:break-word}.title em,.title span,.subtitle em,.subtitle span{font-weight:inherit}.title sub,.subtitle sub{font-size:.75em}.title sup,.subtitle sup{font-size:.75em}.title .tag,.subtitle .tag{vertical-align:middle}.title{color:#363636;font-size:2rem;font-weight:600;line-height:1.125}.title strong{color:inherit;font-weight:inherit}.title:not(.is-spaced)+.subtitle{margin-top:-1.25rem}.title.is-1{font-size:3rem}.title.is-2{font-size:2.5rem}.title.is-3{font-size:2rem}.title.is-4{font-size:1.5rem}.title.is-5{font-size:1.25rem}.title.is-6{font-size:1rem}.title.is-7{font-size:.75rem}.subtitle{color:#4a4a4a;font-size:1.25rem;font-weight:400;line-height:1.25}.subtitle strong{color:#363636;font-weight:600}.subtitle:not(.is-spaced)+.title{margin-top:-1.25rem}.subtitle.is-1{font-size:3rem}.subtitle.is-2{font-size:2.5rem}.subtitle.is-3{font-size:2rem}.subtitle.is-4{font-size:1.5rem}.subtitle.is-5{font-size:1.25rem}.subtitle.is-6{font-size:1rem}.subtitle.is-7{font-size:.75rem}.column{display:block;flex-basis:0;flex-grow:1;flex-shrink:1;padding:.75rem}.columns.is-mobile>.column.is-narrow{flex:none;width:unset}.columns.is-mobile>.column.is-full{flex:none;width:100%}.columns.is-mobile>.column.is-three-quarters{flex:none;width:75%}.columns.is-mobile>.column.is-two-thirds{flex:none;width:66.6666%}.columns.is-mobile>.column.is-half{flex:none;width:50%}.columns.is-mobile>.column.is-one-third{flex:none;width:33.3333%}.columns.is-mobile>.column.is-one-quarter{flex:none;width:25%}.columns.is-mobile>.column.is-one-fifth{flex:none;width:20%}.columns.is-mobile>.column.is-two-fifths{flex:none;width:40%}.columns.is-mobile>.column.is-three-fifths{flex:none;width:60%}.columns.is-mobile>.column.is-four-fifths{flex:none;width:80%}.columns.is-mobile>.column.is-offset-three-quarters{margin-left:75%}.columns.is-mobile>.column.is-offset-two-thirds{margin-left:66.6666%}.columns.is-mobile>.column.is-offset-half{margin-left:50%}.columns.is-mobile>.column.is-offset-one-third{margin-left:33.3333%}.columns.is-mobile>.column.is-offset-one-quarter{margin-left:25%}.columns.is-mobile>.column.is-offset-one-fifth{margin-left:20%}.columns.is-mobile>.column.is-offset-two-fifths{margin-left:40%}.columns.is-mobile>.column.is-offset-three-fifths{margin-left:60%}.columns.is-mobile>.column.is-offset-four-fifths{margin-left:80%}.columns.is-mobile>.column.is-0{flex:none;width:0%}.columns.is-mobile>.column.is-offset-0{margin-left:0%}.columns.is-mobile>.column.is-1{flex:none;width:8.33333337%}.columns.is-mobile>.column.is-offset-1{margin-left:8.33333337%}.columns.is-mobile>.column.is-2{flex:none;width:16.66666674%}.columns.is-mobile>.column.is-offset-2{margin-left:16.66666674%}.columns.is-mobile>.column.is-3{flex:none;width:25%}.columns.is-mobile>.column.is-offset-3{margin-left:25%}.columns.is-mobile>.column.is-4{flex:none;width:33.33333337%}.columns.is-mobile>.column.is-offset-4{margin-left:33.33333337%}.columns.is-mobile>.column.is-5{flex:none;width:41.66666674%}.columns.is-mobile>.column.is-offset-5{margin-left:41.66666674%}.columns.is-mobile>.column.is-6{flex:none;width:50%}.columns.is-mobile>.column.is-offset-6{margin-left:50%}.columns.is-mobile>.column.is-7{flex:none;width:58.33333337%}.columns.is-mobile>.column.is-offset-7{margin-left:58.33333337%}.columns.is-mobile>.column.is-8{flex:none;width:66.66666674%}.columns.is-mobile>.column.is-offset-8{margin-left:66.66666674%}.columns.is-mobile>.column.is-9{flex:none;width:75%}.columns.is-mobile>.column.is-offset-9{margin-left:75%}.columns.is-mobile>.column.is-10{flex:none;width:83.33333337%}.columns.is-mobile>.column.is-offset-10{margin-left:83.33333337%}.columns.is-mobile>.column.is-11{flex:none;width:91.66666674%}.columns.is-mobile>.column.is-offset-11{margin-left:91.66666674%}.columns.is-mobile>.column.is-12{flex:none;width:100%}.columns.is-mobile>.column.is-offset-12{margin-left:100%}@media screen and (max-width: 768px){.column.is-narrow-mobile{flex:none;width:unset}.column.is-full-mobile{flex:none;width:100%}.column.is-three-quarters-mobile{flex:none;width:75%}.column.is-two-thirds-mobile{flex:none;width:66.6666%}.column.is-half-mobile{flex:none;width:50%}.column.is-one-third-mobile{flex:none;width:33.3333%}.column.is-one-quarter-mobile{flex:none;width:25%}.column.is-one-fifth-mobile{flex:none;width:20%}.column.is-two-fifths-mobile{flex:none;width:40%}.column.is-three-fifths-mobile{flex:none;width:60%}.column.is-four-fifths-mobile{flex:none;width:80%}.column.is-offset-three-quarters-mobile{margin-left:75%}.column.is-offset-two-thirds-mobile{margin-left:66.6666%}.column.is-offset-half-mobile{margin-left:50%}.column.is-offset-one-third-mobile{margin-left:33.3333%}.column.is-offset-one-quarter-mobile{margin-left:25%}.column.is-offset-one-fifth-mobile{margin-left:20%}.column.is-offset-two-fifths-mobile{margin-left:40%}.column.is-offset-three-fifths-mobile{margin-left:60%}.column.is-offset-four-fifths-mobile{margin-left:80%}.column.is-0-mobile{flex:none;width:0%}.column.is-offset-0-mobile{margin-left:0%}.column.is-1-mobile{flex:none;width:8.33333337%}.column.is-offset-1-mobile{margin-left:8.33333337%}.column.is-2-mobile{flex:none;width:16.66666674%}.column.is-offset-2-mobile{margin-left:16.66666674%}.column.is-3-mobile{flex:none;width:25%}.column.is-offset-3-mobile{margin-left:25%}.column.is-4-mobile{flex:none;width:33.33333337%}.column.is-offset-4-mobile{margin-left:33.33333337%}.column.is-5-mobile{flex:none;width:41.66666674%}.column.is-offset-5-mobile{margin-left:41.66666674%}.column.is-6-mobile{flex:none;width:50%}.column.is-offset-6-mobile{margin-left:50%}.column.is-7-mobile{flex:none;width:58.33333337%}.column.is-offset-7-mobile{margin-left:58.33333337%}.column.is-8-mobile{flex:none;width:66.66666674%}.column.is-offset-8-mobile{margin-left:66.66666674%}.column.is-9-mobile{flex:none;width:75%}.column.is-offset-9-mobile{margin-left:75%}.column.is-10-mobile{flex:none;width:83.33333337%}.column.is-offset-10-mobile{margin-left:83.33333337%}.column.is-11-mobile{flex:none;width:91.66666674%}.column.is-offset-11-mobile{margin-left:91.66666674%}.column.is-12-mobile{flex:none;width:100%}.column.is-offset-12-mobile{margin-left:100%}}@media screen and (min-width: 769px),print{.column.is-narrow,.column.is-narrow-tablet{flex:none;width:unset}.column.is-full,.column.is-full-tablet{flex:none;width:100%}.column.is-three-quarters,.column.is-three-quarters-tablet{flex:none;width:75%}.column.is-two-thirds,.column.is-two-thirds-tablet{flex:none;width:66.6666%}.column.is-half,.column.is-half-tablet{flex:none;width:50%}.column.is-one-third,.column.is-one-third-tablet{flex:none;width:33.3333%}.column.is-one-quarter,.column.is-one-quarter-tablet{flex:none;width:25%}.column.is-one-fifth,.column.is-one-fifth-tablet{flex:none;width:20%}.column.is-two-fifths,.column.is-two-fifths-tablet{flex:none;width:40%}.column.is-three-fifths,.column.is-three-fifths-tablet{flex:none;width:60%}.column.is-four-fifths,.column.is-four-fifths-tablet{flex:none;width:80%}.column.is-offset-three-quarters,.column.is-offset-three-quarters-tablet{margin-left:75%}.column.is-offset-two-thirds,.column.is-offset-two-thirds-tablet{margin-left:66.6666%}.column.is-offset-half,.column.is-offset-half-tablet{margin-left:50%}.column.is-offset-one-third,.column.is-offset-one-third-tablet{margin-left:33.3333%}.column.is-offset-one-quarter,.column.is-offset-one-quarter-tablet{margin-left:25%}.column.is-offset-one-fifth,.column.is-offset-one-fifth-tablet{margin-left:20%}.column.is-offset-two-fifths,.column.is-offset-two-fifths-tablet{margin-left:40%}.column.is-offset-three-fifths,.column.is-offset-three-fifths-tablet{margin-left:60%}.column.is-offset-four-fifths,.column.is-offset-four-fifths-tablet{margin-left:80%}.column.is-0,.column.is-0-tablet{flex:none;width:0%}.column.is-offset-0,.column.is-offset-0-tablet{margin-left:0%}.column.is-1,.column.is-1-tablet{flex:none;width:8.33333337%}.column.is-offset-1,.column.is-offset-1-tablet{margin-left:8.33333337%}.column.is-2,.column.is-2-tablet{flex:none;width:16.66666674%}.column.is-offset-2,.column.is-offset-2-tablet{margin-left:16.66666674%}.column.is-3,.column.is-3-tablet{flex:none;width:25%}.column.is-offset-3,.column.is-offset-3-tablet{margin-left:25%}.column.is-4,.column.is-4-tablet{flex:none;width:33.33333337%}.column.is-offset-4,.column.is-offset-4-tablet{margin-left:33.33333337%}.column.is-5,.column.is-5-tablet{flex:none;width:41.66666674%}.column.is-offset-5,.column.is-offset-5-tablet{margin-left:41.66666674%}.column.is-6,.column.is-6-tablet{flex:none;width:50%}.column.is-offset-6,.column.is-offset-6-tablet{margin-left:50%}.column.is-7,.column.is-7-tablet{flex:none;width:58.33333337%}.column.is-offset-7,.column.is-offset-7-tablet{margin-left:58.33333337%}.column.is-8,.column.is-8-tablet{flex:none;width:66.66666674%}.column.is-offset-8,.column.is-offset-8-tablet{margin-left:66.66666674%}.column.is-9,.column.is-9-tablet{flex:none;width:75%}.column.is-offset-9,.column.is-offset-9-tablet{margin-left:75%}.column.is-10,.column.is-10-tablet{flex:none;width:83.33333337%}.column.is-offset-10,.column.is-offset-10-tablet{margin-left:83.33333337%}.column.is-11,.column.is-11-tablet{flex:none;width:91.66666674%}.column.is-offset-11,.column.is-offset-11-tablet{margin-left:91.66666674%}.column.is-12,.column.is-12-tablet{flex:none;width:100%}.column.is-offset-12,.column.is-offset-12-tablet{margin-left:100%}}@media screen and (max-width: 1023px){.column.is-narrow-touch{flex:none;width:unset}.column.is-full-touch{flex:none;width:100%}.column.is-three-quarters-touch{flex:none;width:75%}.column.is-two-thirds-touch{flex:none;width:66.6666%}.column.is-half-touch{flex:none;width:50%}.column.is-one-third-touch{flex:none;width:33.3333%}.column.is-one-quarter-touch{flex:none;width:25%}.column.is-one-fifth-touch{flex:none;width:20%}.column.is-two-fifths-touch{flex:none;width:40%}.column.is-three-fifths-touch{flex:none;width:60%}.column.is-four-fifths-touch{flex:none;width:80%}.column.is-offset-three-quarters-touch{margin-left:75%}.column.is-offset-two-thirds-touch{margin-left:66.6666%}.column.is-offset-half-touch{margin-left:50%}.column.is-offset-one-third-touch{margin-left:33.3333%}.column.is-offset-one-quarter-touch{margin-left:25%}.column.is-offset-one-fifth-touch{margin-left:20%}.column.is-offset-two-fifths-touch{margin-left:40%}.column.is-offset-three-fifths-touch{margin-left:60%}.column.is-offset-four-fifths-touch{margin-left:80%}.column.is-0-touch{flex:none;width:0%}.column.is-offset-0-touch{margin-left:0%}.column.is-1-touch{flex:none;width:8.33333337%}.column.is-offset-1-touch{margin-left:8.33333337%}.column.is-2-touch{flex:none;width:16.66666674%}.column.is-offset-2-touch{margin-left:16.66666674%}.column.is-3-touch{flex:none;width:25%}.column.is-offset-3-touch{margin-left:25%}.column.is-4-touch{flex:none;width:33.33333337%}.column.is-offset-4-touch{margin-left:33.33333337%}.column.is-5-touch{flex:none;width:41.66666674%}.column.is-offset-5-touch{margin-left:41.66666674%}.column.is-6-touch{flex:none;width:50%}.column.is-offset-6-touch{margin-left:50%}.column.is-7-touch{flex:none;width:58.33333337%}.column.is-offset-7-touch{margin-left:58.33333337%}.column.is-8-touch{flex:none;width:66.66666674%}.column.is-offset-8-touch{margin-left:66.66666674%}.column.is-9-touch{flex:none;width:75%}.column.is-offset-9-touch{margin-left:75%}.column.is-10-touch{flex:none;width:83.33333337%}.column.is-offset-10-touch{margin-left:83.33333337%}.column.is-11-touch{flex:none;width:91.66666674%}.column.is-offset-11-touch{margin-left:91.66666674%}.column.is-12-touch{flex:none;width:100%}.column.is-offset-12-touch{margin-left:100%}}@media screen and (min-width: 1024px){.column.is-narrow-desktop{flex:none;width:unset}.column.is-full-desktop{flex:none;width:100%}.column.is-three-quarters-desktop{flex:none;width:75%}.column.is-two-thirds-desktop{flex:none;width:66.6666%}.column.is-half-desktop{flex:none;width:50%}.column.is-one-third-desktop{flex:none;width:33.3333%}.column.is-one-quarter-desktop{flex:none;width:25%}.column.is-one-fifth-desktop{flex:none;width:20%}.column.is-two-fifths-desktop{flex:none;width:40%}.column.is-three-fifths-desktop{flex:none;width:60%}.column.is-four-fifths-desktop{flex:none;width:80%}.column.is-offset-three-quarters-desktop{margin-left:75%}.column.is-offset-two-thirds-desktop{margin-left:66.6666%}.column.is-offset-half-desktop{margin-left:50%}.column.is-offset-one-third-desktop{margin-left:33.3333%}.column.is-offset-one-quarter-desktop{margin-left:25%}.column.is-offset-one-fifth-desktop{margin-left:20%}.column.is-offset-two-fifths-desktop{margin-left:40%}.column.is-offset-three-fifths-desktop{margin-left:60%}.column.is-offset-four-fifths-desktop{margin-left:80%}.column.is-0-desktop{flex:none;width:0%}.column.is-offset-0-desktop{margin-left:0%}.column.is-1-desktop{flex:none;width:8.33333337%}.column.is-offset-1-desktop{margin-left:8.33333337%}.column.is-2-desktop{flex:none;width:16.66666674%}.column.is-offset-2-desktop{margin-left:16.66666674%}.column.is-3-desktop{flex:none;width:25%}.column.is-offset-3-desktop{margin-left:25%}.column.is-4-desktop{flex:none;width:33.33333337%}.column.is-offset-4-desktop{margin-left:33.33333337%}.column.is-5-desktop{flex:none;width:41.66666674%}.column.is-offset-5-desktop{margin-left:41.66666674%}.column.is-6-desktop{flex:none;width:50%}.column.is-offset-6-desktop{margin-left:50%}.column.is-7-desktop{flex:none;width:58.33333337%}.column.is-offset-7-desktop{margin-left:58.33333337%}.column.is-8-desktop{flex:none;width:66.66666674%}.column.is-offset-8-desktop{margin-left:66.66666674%}.column.is-9-desktop{flex:none;width:75%}.column.is-offset-9-desktop{margin-left:75%}.column.is-10-desktop{flex:none;width:83.33333337%}.column.is-offset-10-desktop{margin-left:83.33333337%}.column.is-11-desktop{flex:none;width:91.66666674%}.column.is-offset-11-desktop{margin-left:91.66666674%}.column.is-12-desktop{flex:none;width:100%}.column.is-offset-12-desktop{margin-left:100%}}@media screen and (min-width: 1216px){.column.is-narrow-widescreen{flex:none;width:unset}.column.is-full-widescreen{flex:none;width:100%}.column.is-three-quarters-widescreen{flex:none;width:75%}.column.is-two-thirds-widescreen{flex:none;width:66.6666%}.column.is-half-widescreen{flex:none;width:50%}.column.is-one-third-widescreen{flex:none;width:33.3333%}.column.is-one-quarter-widescreen{flex:none;width:25%}.column.is-one-fifth-widescreen{flex:none;width:20%}.column.is-two-fifths-widescreen{flex:none;width:40%}.column.is-three-fifths-widescreen{flex:none;width:60%}.column.is-four-fifths-widescreen{flex:none;width:80%}.column.is-offset-three-quarters-widescreen{margin-left:75%}.column.is-offset-two-thirds-widescreen{margin-left:66.6666%}.column.is-offset-half-widescreen{margin-left:50%}.column.is-offset-one-third-widescreen{margin-left:33.3333%}.column.is-offset-one-quarter-widescreen{margin-left:25%}.column.is-offset-one-fifth-widescreen{margin-left:20%}.column.is-offset-two-fifths-widescreen{margin-left:40%}.column.is-offset-three-fifths-widescreen{margin-left:60%}.column.is-offset-four-fifths-widescreen{margin-left:80%}.column.is-0-widescreen{flex:none;width:0%}.column.is-offset-0-widescreen{margin-left:0%}.column.is-1-widescreen{flex:none;width:8.33333337%}.column.is-offset-1-widescreen{margin-left:8.33333337%}.column.is-2-widescreen{flex:none;width:16.66666674%}.column.is-offset-2-widescreen{margin-left:16.66666674%}.column.is-3-widescreen{flex:none;width:25%}.column.is-offset-3-widescreen{margin-left:25%}.column.is-4-widescreen{flex:none;width:33.33333337%}.column.is-offset-4-widescreen{margin-left:33.33333337%}.column.is-5-widescreen{flex:none;width:41.66666674%}.column.is-offset-5-widescreen{margin-left:41.66666674%}.column.is-6-widescreen{flex:none;width:50%}.column.is-offset-6-widescreen{margin-left:50%}.column.is-7-widescreen{flex:none;width:58.33333337%}.column.is-offset-7-widescreen{margin-left:58.33333337%}.column.is-8-widescreen{flex:none;width:66.66666674%}.column.is-offset-8-widescreen{margin-left:66.66666674%}.column.is-9-widescreen{flex:none;width:75%}.column.is-offset-9-widescreen{margin-left:75%}.column.is-10-widescreen{flex:none;width:83.33333337%}.column.is-offset-10-widescreen{margin-left:83.33333337%}.column.is-11-widescreen{flex:none;width:91.66666674%}.column.is-offset-11-widescreen{margin-left:91.66666674%}.column.is-12-widescreen{flex:none;width:100%}.column.is-offset-12-widescreen{margin-left:100%}}@media screen and (min-width: 1408px){.column.is-narrow-fullhd{flex:none;width:unset}.column.is-full-fullhd{flex:none;width:100%}.column.is-three-quarters-fullhd{flex:none;width:75%}.column.is-two-thirds-fullhd{flex:none;width:66.6666%}.column.is-half-fullhd{flex:none;width:50%}.column.is-one-third-fullhd{flex:none;width:33.3333%}.column.is-one-quarter-fullhd{flex:none;width:25%}.column.is-one-fifth-fullhd{flex:none;width:20%}.column.is-two-fifths-fullhd{flex:none;width:40%}.column.is-three-fifths-fullhd{flex:none;width:60%}.column.is-four-fifths-fullhd{flex:none;width:80%}.column.is-offset-three-quarters-fullhd{margin-left:75%}.column.is-offset-two-thirds-fullhd{margin-left:66.6666%}.column.is-offset-half-fullhd{margin-left:50%}.column.is-offset-one-third-fullhd{margin-left:33.3333%}.column.is-offset-one-quarter-fullhd{margin-left:25%}.column.is-offset-one-fifth-fullhd{margin-left:20%}.column.is-offset-two-fifths-fullhd{margin-left:40%}.column.is-offset-three-fifths-fullhd{margin-left:60%}.column.is-offset-four-fifths-fullhd{margin-left:80%}.column.is-0-fullhd{flex:none;width:0%}.column.is-offset-0-fullhd{margin-left:0%}.column.is-1-fullhd{flex:none;width:8.33333337%}.column.is-offset-1-fullhd{margin-left:8.33333337%}.column.is-2-fullhd{flex:none;width:16.66666674%}.column.is-offset-2-fullhd{margin-left:16.66666674%}.column.is-3-fullhd{flex:none;width:25%}.column.is-offset-3-fullhd{margin-left:25%}.column.is-4-fullhd{flex:none;width:33.33333337%}.column.is-offset-4-fullhd{margin-left:33.33333337%}.column.is-5-fullhd{flex:none;width:41.66666674%}.column.is-offset-5-fullhd{margin-left:41.66666674%}.column.is-6-fullhd{flex:none;width:50%}.column.is-offset-6-fullhd{margin-left:50%}.column.is-7-fullhd{flex:none;width:58.33333337%}.column.is-offset-7-fullhd{margin-left:58.33333337%}.column.is-8-fullhd{flex:none;width:66.66666674%}.column.is-offset-8-fullhd{margin-left:66.66666674%}.column.is-9-fullhd{flex:none;width:75%}.column.is-offset-9-fullhd{margin-left:75%}.column.is-10-fullhd{flex:none;width:83.33333337%}.column.is-offset-10-fullhd{margin-left:83.33333337%}.column.is-11-fullhd{flex:none;width:91.66666674%}.column.is-offset-11-fullhd{margin-left:91.66666674%}.column.is-12-fullhd{flex:none;width:100%}.column.is-offset-12-fullhd{margin-left:100%}}.columns{margin-left:-0.75rem;margin-right:-0.75rem;margin-top:-0.75rem}.columns:last-child{margin-bottom:-0.75rem}.columns:not(:last-child){margin-bottom:calc(1.5rem - 0.75rem)}.columns.is-centered{justify-content:center}.columns.is-gapless{margin-left:0;margin-right:0;margin-top:0}.columns.is-gapless>.column{margin:0;padding:0 !important}.columns.is-gapless:not(:last-child){margin-bottom:1.5rem}.columns.is-gapless:last-child{margin-bottom:0}.columns.is-mobile{display:flex}.columns.is-multiline{flex-wrap:wrap}.columns.is-vcentered{align-items:center}@media screen and (min-width: 769px),print{.columns:not(.is-desktop){display:flex}}@media screen and (min-width: 1024px){.columns.is-desktop{display:flex}}.columns.is-variable{--columnGap: 0.75rem;margin-left:calc(-1 * var(--columnGap));margin-right:calc(-1 * var(--columnGap))}.columns.is-variable>.column{padding-left:var(--columnGap);padding-right:var(--columnGap)}.columns.is-variable.is-0{--columnGap: 0rem}@media screen and (max-width: 768px){.columns.is-variable.is-0-mobile{--columnGap: 0rem}}@media screen and (min-width: 769px),print{.columns.is-variable.is-0-tablet{--columnGap: 0rem}}@media screen and (min-width: 769px)and (max-width: 1023px){.columns.is-variable.is-0-tablet-only{--columnGap: 0rem}}@media screen and (max-width: 1023px){.columns.is-variable.is-0-touch{--columnGap: 0rem}}@media screen and (min-width: 1024px){.columns.is-variable.is-0-desktop{--columnGap: 0rem}}@media screen and (min-width: 1024px)and (max-width: 1215px){.columns.is-variable.is-0-desktop-only{--columnGap: 0rem}}@media screen and (min-width: 1216px){.columns.is-variable.is-0-widescreen{--columnGap: 0rem}}@media screen and (min-width: 1216px)and (max-width: 1407px){.columns.is-variable.is-0-widescreen-only{--columnGap: 0rem}}@media screen and (min-width: 1408px){.columns.is-variable.is-0-fullhd{--columnGap: 0rem}}.columns.is-variable.is-1{--columnGap: 0.25rem}@media screen and (max-width: 768px){.columns.is-variable.is-1-mobile{--columnGap: 0.25rem}}@media screen and (min-width: 769px),print{.columns.is-variable.is-1-tablet{--columnGap: 0.25rem}}@media screen and (min-width: 769px)and (max-width: 1023px){.columns.is-variable.is-1-tablet-only{--columnGap: 0.25rem}}@media screen and (max-width: 1023px){.columns.is-variable.is-1-touch{--columnGap: 0.25rem}}@media screen and (min-width: 1024px){.columns.is-variable.is-1-desktop{--columnGap: 0.25rem}}@media screen and (min-width: 1024px)and (max-width: 1215px){.columns.is-variable.is-1-desktop-only{--columnGap: 0.25rem}}@media screen and (min-width: 1216px){.columns.is-variable.is-1-widescreen{--columnGap: 0.25rem}}@media screen and (min-width: 1216px)and (max-width: 1407px){.columns.is-variable.is-1-widescreen-only{--columnGap: 0.25rem}}@media screen and (min-width: 1408px){.columns.is-variable.is-1-fullhd{--columnGap: 0.25rem}}.columns.is-variable.is-2{--columnGap: 0.5rem}@media screen and (max-width: 768px){.columns.is-variable.is-2-mobile{--columnGap: 0.5rem}}@media screen and (min-width: 769px),print{.columns.is-variable.is-2-tablet{--columnGap: 0.5rem}}@media screen and (min-width: 769px)and (max-width: 1023px){.columns.is-variable.is-2-tablet-only{--columnGap: 0.5rem}}@media screen and (max-width: 1023px){.columns.is-variable.is-2-touch{--columnGap: 0.5rem}}@media screen and (min-width: 1024px){.columns.is-variable.is-2-desktop{--columnGap: 0.5rem}}@media screen and (min-width: 1024px)and (max-width: 1215px){.columns.is-variable.is-2-desktop-only{--columnGap: 0.5rem}}@media screen and (min-width: 1216px){.columns.is-variable.is-2-widescreen{--columnGap: 0.5rem}}@media screen and (min-width: 1216px)and (max-width: 1407px){.columns.is-variable.is-2-widescreen-only{--columnGap: 0.5rem}}@media screen and (min-width: 1408px){.columns.is-variable.is-2-fullhd{--columnGap: 0.5rem}}.columns.is-variable.is-3{--columnGap: 0.75rem}@media screen and (max-width: 768px){.columns.is-variable.is-3-mobile{--columnGap: 0.75rem}}@media screen and (min-width: 769px),print{.columns.is-variable.is-3-tablet{--columnGap: 0.75rem}}@media screen and (min-width: 769px)and (max-width: 1023px){.columns.is-variable.is-3-tablet-only{--columnGap: 0.75rem}}@media screen and (max-width: 1023px){.columns.is-variable.is-3-touch{--columnGap: 0.75rem}}@media screen and (min-width: 1024px){.columns.is-variable.is-3-desktop{--columnGap: 0.75rem}}@media screen and (min-width: 1024px)and (max-width: 1215px){.columns.is-variable.is-3-desktop-only{--columnGap: 0.75rem}}@media screen and (min-width: 1216px){.columns.is-variable.is-3-widescreen{--columnGap: 0.75rem}}@media screen and (min-width: 1216px)and (max-width: 1407px){.columns.is-variable.is-3-widescreen-only{--columnGap: 0.75rem}}@media screen and (min-width: 1408px){.columns.is-variable.is-3-fullhd{--columnGap: 0.75rem}}.columns.is-variable.is-4{--columnGap: 1rem}@media screen and (max-width: 768px){.columns.is-variable.is-4-mobile{--columnGap: 1rem}}@media screen and (min-width: 769px),print{.columns.is-variable.is-4-tablet{--columnGap: 1rem}}@media screen and (min-width: 769px)and (max-width: 1023px){.columns.is-variable.is-4-tablet-only{--columnGap: 1rem}}@media screen and (max-width: 1023px){.columns.is-variable.is-4-touch{--columnGap: 1rem}}@media screen and (min-width: 1024px){.columns.is-variable.is-4-desktop{--columnGap: 1rem}}@media screen and (min-width: 1024px)and (max-width: 1215px){.columns.is-variable.is-4-desktop-only{--columnGap: 1rem}}@media screen and (min-width: 1216px){.columns.is-variable.is-4-widescreen{--columnGap: 1rem}}@media screen and (min-width: 1216px)and (max-width: 1407px){.columns.is-variable.is-4-widescreen-only{--columnGap: 1rem}}@media screen and (min-width: 1408px){.columns.is-variable.is-4-fullhd{--columnGap: 1rem}}.columns.is-variable.is-5{--columnGap: 1.25rem}@media screen and (max-width: 768px){.columns.is-variable.is-5-mobile{--columnGap: 1.25rem}}@media screen and (min-width: 769px),print{.columns.is-variable.is-5-tablet{--columnGap: 1.25rem}}@media screen and (min-width: 769px)and (max-width: 1023px){.columns.is-variable.is-5-tablet-only{--columnGap: 1.25rem}}@media screen and (max-width: 1023px){.columns.is-variable.is-5-touch{--columnGap: 1.25rem}}@media screen and (min-width: 1024px){.columns.is-variable.is-5-desktop{--columnGap: 1.25rem}}@media screen and (min-width: 1024px)and (max-width: 1215px){.columns.is-variable.is-5-desktop-only{--columnGap: 1.25rem}}@media screen and (min-width: 1216px){.columns.is-variable.is-5-widescreen{--columnGap: 1.25rem}}@media screen and (min-width: 1216px)and (max-width: 1407px){.columns.is-variable.is-5-widescreen-only{--columnGap: 1.25rem}}@media screen and (min-width: 1408px){.columns.is-variable.is-5-fullhd{--columnGap: 1.25rem}}.columns.is-variable.is-6{--columnGap: 1.5rem}@media screen and (max-width: 768px){.columns.is-variable.is-6-mobile{--columnGap: 1.5rem}}@media screen and (min-width: 769px),print{.columns.is-variable.is-6-tablet{--columnGap: 1.5rem}}@media screen and (min-width: 769px)and (max-width: 1023px){.columns.is-variable.is-6-tablet-only{--columnGap: 1.5rem}}@media screen and (max-width: 1023px){.columns.is-variable.is-6-touch{--columnGap: 1.5rem}}@media screen and (min-width: 1024px){.columns.is-variable.is-6-desktop{--columnGap: 1.5rem}}@media screen and (min-width: 1024px)and (max-width: 1215px){.columns.is-variable.is-6-desktop-only{--columnGap: 1.5rem}}@media screen and (min-width: 1216px){.columns.is-variable.is-6-widescreen{--columnGap: 1.5rem}}@media screen and (min-width: 1216px)and (max-width: 1407px){.columns.is-variable.is-6-widescreen-only{--columnGap: 1.5rem}}@media screen and (min-width: 1408px){.columns.is-variable.is-6-fullhd{--columnGap: 1.5rem}}.columns.is-variable.is-7{--columnGap: 1.75rem}@media screen and (max-width: 768px){.columns.is-variable.is-7-mobile{--columnGap: 1.75rem}}@media screen and (min-width: 769px),print{.columns.is-variable.is-7-tablet{--columnGap: 1.75rem}}@media screen and (min-width: 769px)and (max-width: 1023px){.columns.is-variable.is-7-tablet-only{--columnGap: 1.75rem}}@media screen and (max-width: 1023px){.columns.is-variable.is-7-touch{--columnGap: 1.75rem}}@media screen and (min-width: 1024px){.columns.is-variable.is-7-desktop{--columnGap: 1.75rem}}@media screen and (min-width: 1024px)and (max-width: 1215px){.columns.is-variable.is-7-desktop-only{--columnGap: 1.75rem}}@media screen and (min-width: 1216px){.columns.is-variable.is-7-widescreen{--columnGap: 1.75rem}}@media screen and (min-width: 1216px)and (max-width: 1407px){.columns.is-variable.is-7-widescreen-only{--columnGap: 1.75rem}}@media screen and (min-width: 1408px){.columns.is-variable.is-7-fullhd{--columnGap: 1.75rem}}.columns.is-variable.is-8{--columnGap: 2rem}@media screen and (max-width: 768px){.columns.is-variable.is-8-mobile{--columnGap: 2rem}}@media screen and (min-width: 769px),print{.columns.is-variable.is-8-tablet{--columnGap: 2rem}}@media screen and (min-width: 769px)and (max-width: 1023px){.columns.is-variable.is-8-tablet-only{--columnGap: 2rem}}@media screen and (max-width: 1023px){.columns.is-variable.is-8-touch{--columnGap: 2rem}}@media screen and (min-width: 1024px){.columns.is-variable.is-8-desktop{--columnGap: 2rem}}@media screen and (min-width: 1024px)and (max-width: 1215px){.columns.is-variable.is-8-desktop-only{--columnGap: 2rem}}@media screen and (min-width: 1216px){.columns.is-variable.is-8-widescreen{--columnGap: 2rem}}@media screen and (min-width: 1216px)and (max-width: 1407px){.columns.is-variable.is-8-widescreen-only{--columnGap: 2rem}}@media screen and (min-width: 1408px){.columns.is-variable.is-8-fullhd{--columnGap: 2rem}}.has-text-white{color:#fff !important}a.has-text-white:hover,a.has-text-white:focus{color:#e6e6e6 !important}.has-background-white{background-color:#fff !important}.has-text-black{color:#0a0a0a !important}a.has-text-black:hover,a.has-text-black:focus{color:#000 !important}.has-background-black{background-color:#0a0a0a !important}.has-text-light{color:#f5f5f5 !important}a.has-text-light:hover,a.has-text-light:focus{color:#dbdbdb !important}.has-background-light{background-color:#f5f5f5 !important}.has-text-dark{color:#363636 !important}a.has-text-dark:hover,a.has-text-dark:focus{color:#1c1c1c !important}.has-background-dark{background-color:#363636 !important}.has-text-primary{color:#00d1b2 !important}a.has-text-primary:hover,a.has-text-primary:focus{color:#009e86 !important}.has-background-primary{background-color:#00d1b2 !important}.has-text-primary-light{color:#ebfffc !important}a.has-text-primary-light:hover,a.has-text-primary-light:focus{color:#b8fff4 !important}.has-background-primary-light{background-color:#ebfffc !important}.has-text-primary-dark{color:#00947e !important}a.has-text-primary-dark:hover,a.has-text-primary-dark:focus{color:#00c7a9 !important}.has-background-primary-dark{background-color:#00947e !important}.has-text-link{color:#485fc7 !important}a.has-text-link:hover,a.has-text-link:focus{color:#3449a8 !important}.has-background-link{background-color:#485fc7 !important}.has-text-link-light{color:#eff1fa !important}a.has-text-link-light:hover,a.has-text-link-light:focus{color:#c8cfee !important}.has-background-link-light{background-color:#eff1fa !important}.has-text-link-dark{color:#3850b7 !important}a.has-text-link-dark:hover,a.has-text-link-dark:focus{color:#576dcb !important}.has-background-link-dark{background-color:#3850b7 !important}.has-text-info{color:#3e8ed0 !important}a.has-text-info:hover,a.has-text-info:focus{color:#2b74b1 !important}.has-background-info{background-color:#3e8ed0 !important}.has-text-info-light{color:#eff5fb !important}a.has-text-info-light:hover,a.has-text-info-light:focus{color:#c6ddf1 !important}.has-background-info-light{background-color:#eff5fb !important}.has-text-info-dark{color:#296fa8 !important}a.has-text-info-dark:hover,a.has-text-info-dark:focus{color:#368ace !important}.has-background-info-dark{background-color:#296fa8 !important}.has-text-success{color:#48c78e !important}a.has-text-success:hover,a.has-text-success:focus{color:#34a873 !important}.has-background-success{background-color:#48c78e !important}.has-text-success-light{color:#effaf5 !important}a.has-text-success-light:hover,a.has-text-success-light:focus{color:#c8eedd !important}.has-background-success-light{background-color:#effaf5 !important}.has-text-success-dark{color:#257953 !important}a.has-text-success-dark:hover,a.has-text-success-dark:focus{color:#31a06e !important}.has-background-success-dark{background-color:#257953 !important}.has-text-warning{color:#ffe08a !important}a.has-text-warning:hover,a.has-text-warning:focus{color:#ffd257 !important}.has-background-warning{background-color:#ffe08a !important}.has-text-warning-light{color:#fffaeb !important}a.has-text-warning-light:hover,a.has-text-warning-light:focus{color:#ffecb8 !important}.has-background-warning-light{background-color:#fffaeb !important}.has-text-warning-dark{color:#946c00 !important}a.has-text-warning-dark:hover,a.has-text-warning-dark:focus{color:#c79200 !important}.has-background-warning-dark{background-color:#946c00 !important}.has-text-danger{color:#f14668 !important}a.has-text-danger:hover,a.has-text-danger:focus{color:#ee1742 !important}.has-background-danger{background-color:#f14668 !important}.has-text-danger-light{color:#feecf0 !important}a.has-text-danger-light:hover,a.has-text-danger-light:focus{color:#fabdc9 !important}.has-background-danger-light{background-color:#feecf0 !important}.has-text-danger-dark{color:#cc0f35 !important}a.has-text-danger-dark:hover,a.has-text-danger-dark:focus{color:#ee2049 !important}.has-background-danger-dark{background-color:#cc0f35 !important}.has-text-black-bis{color:#121212 !important}.has-background-black-bis{background-color:#121212 !important}.has-text-black-ter{color:#242424 !important}.has-background-black-ter{background-color:#242424 !important}.has-text-grey-darker{color:#363636 !important}.has-background-grey-darker{background-color:#363636 !important}.has-text-grey-dark{color:#4a4a4a !important}.has-background-grey-dark{background-color:#4a4a4a !important}.has-text-grey{color:#7a7a7a !important}.has-background-grey{background-color:#7a7a7a !important}.has-text-grey-light{color:#b5b5b5 !important}.has-background-grey-light{background-color:#b5b5b5 !important}.has-text-grey-lighter{color:#dbdbdb !important}.has-background-grey-lighter{background-color:#dbdbdb !important}.has-text-white-ter{color:#f5f5f5 !important}.has-background-white-ter{background-color:#f5f5f5 !important}.has-text-white-bis{color:#fafafa !important}.has-background-white-bis{background-color:#fafafa !important}.is-flex-direction-row{flex-direction:row !important}.is-flex-direction-row-reverse{flex-direction:row-reverse !important}.is-flex-direction-column{flex-direction:column !important}.is-flex-direction-column-reverse{flex-direction:column-reverse !important}.is-flex-wrap-nowrap{flex-wrap:nowrap !important}.is-flex-wrap-wrap{flex-wrap:wrap !important}.is-flex-wrap-wrap-reverse{flex-wrap:wrap-reverse !important}.is-justify-content-flex-start{justify-content:flex-start !important}.is-justify-content-flex-end{justify-content:flex-end !important}.is-justify-content-center{justify-content:center !important}.is-justify-content-space-between{justify-content:space-between !important}.is-justify-content-space-around{justify-content:space-around !important}.is-justify-content-space-evenly{justify-content:space-evenly !important}.is-justify-content-start{justify-content:start !important}.is-justify-content-end{justify-content:end !important}.is-justify-content-left{justify-content:left !important}.is-justify-content-right{justify-content:right !important}.is-align-content-flex-start{align-content:flex-start !important}.is-align-content-flex-end{align-content:flex-end !important}.is-align-content-center{align-content:center !important}.is-align-content-space-between{align-content:space-between !important}.is-align-content-space-around{align-content:space-around !important}.is-align-content-space-evenly{align-content:space-evenly !important}.is-align-content-stretch{align-content:stretch !important}.is-align-content-start{align-content:start !important}.is-align-content-end{align-content:end !important}.is-align-content-baseline{align-content:baseline !important}.is-align-items-stretch{align-items:stretch !important}.is-align-items-flex-start{align-items:flex-start !important}.is-align-items-flex-end{align-items:flex-end !important}.is-align-items-center{align-items:center !important}.is-align-items-baseline{align-items:baseline !important}.is-align-items-start{align-items:start !important}.is-align-items-end{align-items:end !important}.is-align-items-self-start{align-items:self-start !important}.is-align-items-self-end{align-items:self-end !important}.is-align-self-auto{align-self:auto !important}.is-align-self-flex-start{align-self:flex-start !important}.is-align-self-flex-end{align-self:flex-end !important}.is-align-self-center{align-self:center !important}.is-align-self-baseline{align-self:baseline !important}.is-align-self-stretch{align-self:stretch !important}.is-flex-grow-0{flex-grow:0 !important}.is-flex-grow-1{flex-grow:1 !important}.is-flex-grow-2{flex-grow:2 !important}.is-flex-grow-3{flex-grow:3 !important}.is-flex-grow-4{flex-grow:4 !important}.is-flex-grow-5{flex-grow:5 !important}.is-flex-shrink-0{flex-shrink:0 !important}.is-flex-shrink-1{flex-shrink:1 !important}.is-flex-shrink-2{flex-shrink:2 !important}.is-flex-shrink-3{flex-shrink:3 !important}.is-flex-shrink-4{flex-shrink:4 !important}.is-flex-shrink-5{flex-shrink:5 !important}.is-clearfix::after{clear:both;content:" ";display:table}.is-pulled-left{float:left !important}.is-pulled-right{float:right !important}.is-radiusless{border-radius:0 !important}.is-shadowless{box-shadow:none !important}.is-clickable{cursor:pointer !important;pointer-events:all !important}.is-clipped{overflow:hidden !important}.is-relative{position:relative !important}.is-marginless{margin:0 !important}.is-paddingless{padding:0 !important}.m-0{margin:0 !important}.mt-0{margin-top:0 !important}.mr-0{margin-right:0 !important}.mb-0{margin-bottom:0 !important}.ml-0{margin-left:0 !important}.mx-0{margin-left:0 !important;margin-right:0 !important}.my-0{margin-top:0 !important;margin-bottom:0 !important}.m-1{margin:.25rem !important}.mt-1{margin-top:.25rem !important}.mr-1{margin-right:.25rem !important}.mb-1{margin-bottom:.25rem !important}.ml-1{margin-left:.25rem !important}.mx-1{margin-left:.25rem !important;margin-right:.25rem !important}.my-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.m-2{margin:.5rem !important}.mt-2{margin-top:.5rem !important}.mr-2{margin-right:.5rem !important}.mb-2{margin-bottom:.5rem !important}.ml-2{margin-left:.5rem !important}.mx-2{margin-left:.5rem !important;margin-right:.5rem !important}.my-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.m-3{margin:.75rem !important}.mt-3{margin-top:.75rem !important}.mr-3{margin-right:.75rem !important}.mb-3{margin-bottom:.75rem !important}.ml-3{margin-left:.75rem !important}.mx-3{margin-left:.75rem !important;margin-right:.75rem !important}.my-3{margin-top:.75rem !important;margin-bottom:.75rem !important}.m-4{margin:1rem !important}.mt-4{margin-top:1rem !important}.mr-4{margin-right:1rem !important}.mb-4{margin-bottom:1rem !important}.ml-4{margin-left:1rem !important}.mx-4{margin-left:1rem !important;margin-right:1rem !important}.my-4{margin-top:1rem !important;margin-bottom:1rem !important}.m-5{margin:1.5rem !important}.mt-5{margin-top:1.5rem !important}.mr-5{margin-right:1.5rem !important}.mb-5{margin-bottom:1.5rem !important}.ml-5{margin-left:1.5rem !important}.mx-5{margin-left:1.5rem !important;margin-right:1.5rem !important}.my-5{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.m-6{margin:3rem !important}.mt-6{margin-top:3rem !important}.mr-6{margin-right:3rem !important}.mb-6{margin-bottom:3rem !important}.ml-6{margin-left:3rem !important}.mx-6{margin-left:3rem !important;margin-right:3rem !important}.my-6{margin-top:3rem !important;margin-bottom:3rem !important}.m-auto{margin:auto !important}.mt-auto{margin-top:auto !important}.mr-auto{margin-right:auto !important}.mb-auto{margin-bottom:auto !important}.ml-auto{margin-left:auto !important}.mx-auto{margin-left:auto !important;margin-right:auto !important}.my-auto{margin-top:auto !important;margin-bottom:auto !important}.p-0{padding:0 !important}.pt-0{padding-top:0 !important}.pr-0{padding-right:0 !important}.pb-0{padding-bottom:0 !important}.pl-0{padding-left:0 !important}.px-0{padding-left:0 !important;padding-right:0 !important}.py-0{padding-top:0 !important;padding-bottom:0 !important}.p-1{padding:.25rem !important}.pt-1{padding-top:.25rem !important}.pr-1{padding-right:.25rem !important}.pb-1{padding-bottom:.25rem !important}.pl-1{padding-left:.25rem !important}.px-1{padding-left:.25rem !important;padding-right:.25rem !important}.py-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.p-2{padding:.5rem !important}.pt-2{padding-top:.5rem !important}.pr-2{padding-right:.5rem !important}.pb-2{padding-bottom:.5rem !important}.pl-2{padding-left:.5rem !important}.px-2{padding-left:.5rem !important;padding-right:.5rem !important}.py-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.p-3{padding:.75rem !important}.pt-3{padding-top:.75rem !important}.pr-3{padding-right:.75rem !important}.pb-3{padding-bottom:.75rem !important}.pl-3{padding-left:.75rem !important}.px-3{padding-left:.75rem !important;padding-right:.75rem !important}.py-3{padding-top:.75rem !important;padding-bottom:.75rem !important}.p-4{padding:1rem !important}.pt-4{padding-top:1rem !important}.pr-4{padding-right:1rem !important}.pb-4{padding-bottom:1rem !important}.pl-4{padding-left:1rem !important}.px-4{padding-left:1rem !important;padding-right:1rem !important}.py-4{padding-top:1rem !important;padding-bottom:1rem !important}.p-5{padding:1.5rem !important}.pt-5{padding-top:1.5rem !important}.pr-5{padding-right:1.5rem !important}.pb-5{padding-bottom:1.5rem !important}.pl-5{padding-left:1.5rem !important}.px-5{padding-left:1.5rem !important;padding-right:1.5rem !important}.py-5{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.p-6{padding:3rem !important}.pt-6{padding-top:3rem !important}.pr-6{padding-right:3rem !important}.pb-6{padding-bottom:3rem !important}.pl-6{padding-left:3rem !important}.px-6{padding-left:3rem !important;padding-right:3rem !important}.py-6{padding-top:3rem !important;padding-bottom:3rem !important}.p-auto{padding:auto !important}.pt-auto{padding-top:auto !important}.pr-auto{padding-right:auto !important}.pb-auto{padding-bottom:auto !important}.pl-auto{padding-left:auto !important}.px-auto{padding-left:auto !important;padding-right:auto !important}.py-auto{padding-top:auto !important;padding-bottom:auto !important}.is-size-1{font-size:3rem !important}.is-size-2{font-size:2.5rem !important}.is-size-3{font-size:2rem !important}.is-size-4{font-size:1.5rem !important}.is-size-5{font-size:1.25rem !important}.is-size-6{font-size:1rem !important}.is-size-7{font-size:.75rem !important}@media screen and (max-width: 768px){.is-size-1-mobile{font-size:3rem !important}.is-size-2-mobile{font-size:2.5rem !important}.is-size-3-mobile{font-size:2rem !important}.is-size-4-mobile{font-size:1.5rem !important}.is-size-5-mobile{font-size:1.25rem !important}.is-size-6-mobile{font-size:1rem !important}.is-size-7-mobile{font-size:.75rem !important}}@media screen and (min-width: 769px),print{.is-size-1-tablet{font-size:3rem !important}.is-size-2-tablet{font-size:2.5rem !important}.is-size-3-tablet{font-size:2rem !important}.is-size-4-tablet{font-size:1.5rem !important}.is-size-5-tablet{font-size:1.25rem !important}.is-size-6-tablet{font-size:1rem !important}.is-size-7-tablet{font-size:.75rem !important}}@media screen and (max-width: 1023px){.is-size-1-touch{font-size:3rem !important}.is-size-2-touch{font-size:2.5rem !important}.is-size-3-touch{font-size:2rem !important}.is-size-4-touch{font-size:1.5rem !important}.is-size-5-touch{font-size:1.25rem !important}.is-size-6-touch{font-size:1rem !important}.is-size-7-touch{font-size:.75rem !important}}@media screen and (min-width: 1024px){.is-size-1-desktop{font-size:3rem !important}.is-size-2-desktop{font-size:2.5rem !important}.is-size-3-desktop{font-size:2rem !important}.is-size-4-desktop{font-size:1.5rem !important}.is-size-5-desktop{font-size:1.25rem !important}.is-size-6-desktop{font-size:1rem !important}.is-size-7-desktop{font-size:.75rem !important}}@media screen and (min-width: 1216px){.is-size-1-widescreen{font-size:3rem !important}.is-size-2-widescreen{font-size:2.5rem !important}.is-size-3-widescreen{font-size:2rem !important}.is-size-4-widescreen{font-size:1.5rem !important}.is-size-5-widescreen{font-size:1.25rem !important}.is-size-6-widescreen{font-size:1rem !important}.is-size-7-widescreen{font-size:.75rem !important}}@media screen and (min-width: 1408px){.is-size-1-fullhd{font-size:3rem !important}.is-size-2-fullhd{font-size:2.5rem !important}.is-size-3-fullhd{font-size:2rem !important}.is-size-4-fullhd{font-size:1.5rem !important}.is-size-5-fullhd{font-size:1.25rem !important}.is-size-6-fullhd{font-size:1rem !important}.is-size-7-fullhd{font-size:.75rem !important}}.has-text-centered{text-align:center !important}.has-text-justified{text-align:justify !important}.has-text-left{text-align:left !important}.has-text-right{text-align:right !important}@media screen and (max-width: 768px){.has-text-centered-mobile{text-align:center !important}}@media screen and (min-width: 769px),print{.has-text-centered-tablet{text-align:center !important}}@media screen and (min-width: 769px)and (max-width: 1023px){.has-text-centered-tablet-only{text-align:center !important}}@media screen and (max-width: 1023px){.has-text-centered-touch{text-align:center !important}}@media screen and (min-width: 1024px){.has-text-centered-desktop{text-align:center !important}}@media screen and (min-width: 1024px)and (max-width: 1215px){.has-text-centered-desktop-only{text-align:center !important}}@media screen and (min-width: 1216px){.has-text-centered-widescreen{text-align:center !important}}@media screen and (min-width: 1216px)and (max-width: 1407px){.has-text-centered-widescreen-only{text-align:center !important}}@media screen and (min-width: 1408px){.has-text-centered-fullhd{text-align:center !important}}@media screen and (max-width: 768px){.has-text-justified-mobile{text-align:justify !important}}@media screen and (min-width: 769px),print{.has-text-justified-tablet{text-align:justify !important}}@media screen and (min-width: 769px)and (max-width: 1023px){.has-text-justified-tablet-only{text-align:justify !important}}@media screen and (max-width: 1023px){.has-text-justified-touch{text-align:justify !important}}@media screen and (min-width: 1024px){.has-text-justified-desktop{text-align:justify !important}}@media screen and (min-width: 1024px)and (max-width: 1215px){.has-text-justified-desktop-only{text-align:justify !important}}@media screen and (min-width: 1216px){.has-text-justified-widescreen{text-align:justify !important}}@media screen and (min-width: 1216px)and (max-width: 1407px){.has-text-justified-widescreen-only{text-align:justify !important}}@media screen and (min-width: 1408px){.has-text-justified-fullhd{text-align:justify !important}}@media screen and (max-width: 768px){.has-text-left-mobile{text-align:left !important}}@media screen and (min-width: 769px),print{.has-text-left-tablet{text-align:left !important}}@media screen and (min-width: 769px)and (max-width: 1023px){.has-text-left-tablet-only{text-align:left !important}}@media screen and (max-width: 1023px){.has-text-left-touch{text-align:left !important}}@media screen and (min-width: 1024px){.has-text-left-desktop{text-align:left !important}}@media screen and (min-width: 1024px)and (max-width: 1215px){.has-text-left-desktop-only{text-align:left !important}}@media screen and (min-width: 1216px){.has-text-left-widescreen{text-align:left !important}}@media screen and (min-width: 1216px)and (max-width: 1407px){.has-text-left-widescreen-only{text-align:left !important}}@media screen and (min-width: 1408px){.has-text-left-fullhd{text-align:left !important}}@media screen and (max-width: 768px){.has-text-right-mobile{text-align:right !important}}@media screen and (min-width: 769px),print{.has-text-right-tablet{text-align:right !important}}@media screen and (min-width: 769px)and (max-width: 1023px){.has-text-right-tablet-only{text-align:right !important}}@media screen and (max-width: 1023px){.has-text-right-touch{text-align:right !important}}@media screen and (min-width: 1024px){.has-text-right-desktop{text-align:right !important}}@media screen and (min-width: 1024px)and (max-width: 1215px){.has-text-right-desktop-only{text-align:right !important}}@media screen and (min-width: 1216px){.has-text-right-widescreen{text-align:right !important}}@media screen and (min-width: 1216px)and (max-width: 1407px){.has-text-right-widescreen-only{text-align:right !important}}@media screen and (min-width: 1408px){.has-text-right-fullhd{text-align:right !important}}.is-capitalized{text-transform:capitalize !important}.is-lowercase{text-transform:lowercase !important}.is-uppercase{text-transform:uppercase !important}.is-italic{font-style:italic !important}.is-underlined{text-decoration:underline !important}.has-text-weight-light{font-weight:300 !important}.has-text-weight-normal{font-weight:400 !important}.has-text-weight-medium{font-weight:500 !important}.has-text-weight-semibold{font-weight:600 !important}.has-text-weight-bold{font-weight:700 !important}.is-family-primary{font-family:BlinkMacSystemFont,-apple-system,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue","Helvetica","Arial",sans-serif !important}.is-family-secondary{font-family:BlinkMacSystemFont,-apple-system,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue","Helvetica","Arial",sans-serif !important}.is-family-sans-serif{font-family:BlinkMacSystemFont,-apple-system,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue","Helvetica","Arial",sans-serif !important}.is-family-monospace{font-family:monospace !important}.is-family-code{font-family:monospace !important}.is-block{display:block !important}@media screen and (max-width: 768px){.is-block-mobile{display:block !important}}@media screen and (min-width: 769px),print{.is-block-tablet{display:block !important}}@media screen and (min-width: 769px)and (max-width: 1023px){.is-block-tablet-only{display:block !important}}@media screen and (max-width: 1023px){.is-block-touch{display:block !important}}@media screen and (min-width: 1024px){.is-block-desktop{display:block !important}}@media screen and (min-width: 1024px)and (max-width: 1215px){.is-block-desktop-only{display:block !important}}@media screen and (min-width: 1216px){.is-block-widescreen{display:block !important}}@media screen and (min-width: 1216px)and (max-width: 1407px){.is-block-widescreen-only{display:block !important}}@media screen and (min-width: 1408px){.is-block-fullhd{display:block !important}}.is-flex{display:flex !important}@media screen and (max-width: 768px){.is-flex-mobile{display:flex !important}}@media screen and (min-width: 769px),print{.is-flex-tablet{display:flex !important}}@media screen and (min-width: 769px)and (max-width: 1023px){.is-flex-tablet-only{display:flex !important}}@media screen and (max-width: 1023px){.is-flex-touch{display:flex !important}}@media screen and (min-width: 1024px){.is-flex-desktop{display:flex !important}}@media screen and (min-width: 1024px)and (max-width: 1215px){.is-flex-desktop-only{display:flex !important}}@media screen and (min-width: 1216px){.is-flex-widescreen{display:flex !important}}@media screen and (min-width: 1216px)and (max-width: 1407px){.is-flex-widescreen-only{display:flex !important}}@media screen and (min-width: 1408px){.is-flex-fullhd{display:flex !important}}.is-inline{display:inline !important}@media screen and (max-width: 768px){.is-inline-mobile{display:inline !important}}@media screen and (min-width: 769px),print{.is-inline-tablet{display:inline !important}}@media screen and (min-width: 769px)and (max-width: 1023px){.is-inline-tablet-only{display:inline !important}}@media screen and (max-width: 1023px){.is-inline-touch{display:inline !important}}@media screen and (min-width: 1024px){.is-inline-desktop{display:inline !important}}@media screen and (min-width: 1024px)and (max-width: 1215px){.is-inline-desktop-only{display:inline !important}}@media screen and (min-width: 1216px){.is-inline-widescreen{display:inline !important}}@media screen and (min-width: 1216px)and (max-width: 1407px){.is-inline-widescreen-only{display:inline !important}}@media screen and (min-width: 1408px){.is-inline-fullhd{display:inline !important}}.is-inline-block{display:inline-block !important}@media screen and (max-width: 768px){.is-inline-block-mobile{display:inline-block !important}}@media screen and (min-width: 769px),print{.is-inline-block-tablet{display:inline-block !important}}@media screen and (min-width: 769px)and (max-width: 1023px){.is-inline-block-tablet-only{display:inline-block !important}}@media screen and (max-width: 1023px){.is-inline-block-touch{display:inline-block !important}}@media screen and (min-width: 1024px){.is-inline-block-desktop{display:inline-block !important}}@media screen and (min-width: 1024px)and (max-width: 1215px){.is-inline-block-desktop-only{display:inline-block !important}}@media screen and (min-width: 1216px){.is-inline-block-widescreen{display:inline-block !important}}@media screen and (min-width: 1216px)and (max-width: 1407px){.is-inline-block-widescreen-only{display:inline-block !important}}@media screen and (min-width: 1408px){.is-inline-block-fullhd{display:inline-block !important}}.is-inline-flex{display:inline-flex !important}@media screen and (max-width: 768px){.is-inline-flex-mobile{display:inline-flex !important}}@media screen and (min-width: 769px),print{.is-inline-flex-tablet{display:inline-flex !important}}@media screen and (min-width: 769px)and (max-width: 1023px){.is-inline-flex-tablet-only{display:inline-flex !important}}@media screen and (max-width: 1023px){.is-inline-flex-touch{display:inline-flex !important}}@media screen and (min-width: 1024px){.is-inline-flex-desktop{display:inline-flex !important}}@media screen and (min-width: 1024px)and (max-width: 1215px){.is-inline-flex-desktop-only{display:inline-flex !important}}@media screen and (min-width: 1216px){.is-inline-flex-widescreen{display:inline-flex !important}}@media screen and (min-width: 1216px)and (max-width: 1407px){.is-inline-flex-widescreen-only{display:inline-flex !important}}@media screen and (min-width: 1408px){.is-inline-flex-fullhd{display:inline-flex !important}}.is-hidden{display:none !important}.is-sr-only{border:none !important;clip:rect(0, 0, 0, 0) !important;height:.01em !important;overflow:hidden !important;padding:0 !important;position:absolute !important;white-space:nowrap !important;width:.01em !important}@media screen and (max-width: 768px){.is-hidden-mobile{display:none !important}}@media screen and (min-width: 769px),print{.is-hidden-tablet{display:none !important}}@media screen and (min-width: 769px)and (max-width: 1023px){.is-hidden-tablet-only{display:none !important}}@media screen and (max-width: 1023px){.is-hidden-touch{display:none !important}}@media screen and (min-width: 1024px){.is-hidden-desktop{display:none !important}}@media screen and (min-width: 1024px)and (max-width: 1215px){.is-hidden-desktop-only{display:none !important}}@media screen and (min-width: 1216px){.is-hidden-widescreen{display:none !important}}@media screen and (min-width: 1216px)and (max-width: 1407px){.is-hidden-widescreen-only{display:none !important}}@media screen and (min-width: 1408px){.is-hidden-fullhd{display:none !important}}.is-invisible{visibility:hidden !important}@media screen and (max-width: 768px){.is-invisible-mobile{visibility:hidden !important}}@media screen and (min-width: 769px),print{.is-invisible-tablet{visibility:hidden !important}}@media screen and (min-width: 769px)and (max-width: 1023px){.is-invisible-tablet-only{visibility:hidden !important}}@media screen and (max-width: 1023px){.is-invisible-touch{visibility:hidden !important}}@media screen and (min-width: 1024px){.is-invisible-desktop{visibility:hidden !important}}@media screen and (min-width: 1024px)and (max-width: 1215px){.is-invisible-desktop-only{visibility:hidden !important}}@media screen and (min-width: 1216px){.is-invisible-widescreen{visibility:hidden !important}}@media screen and (min-width: 1216px)and (max-width: 1407px){.is-invisible-widescreen-only{visibility:hidden !important}}@media screen and (min-width: 1408px){.is-invisible-fullhd{visibility:hidden !important}}.section{padding:3rem 1.5rem}@media screen and (min-width: 1024px){.section{padding:3rem 3rem}.section.is-medium{padding:9rem 4.5rem}.section.is-large{padding:18rem 6rem}}.footer{background-color:#fafafa;padding:3rem 1.5rem 6rem}
2 | 


--------------------------------------------------------------------------------