input[type="text"] { height: var(--basic-height); }

.tab_nav_mobile svg, .app-store, .mac-app-store, .hidden { position: absolute; }

.app-store-badges > div, main .section-wrapper, header, main, footer, body { position: relative; }

.tab_nav_mobile, body:before { position: fixed; }

.show { display: block; }

.hide { display: none; }

:root { --bbg: #040404; --bfc: #F2F2F2; --indigo: #372C8F; --basic-height: 1.5; --mp: clamp(16px, 2vw, 32px); --mpx: calc(var(--mp) * 2); --ltw: clamp(260px, 3vw, 316px); --lth: calc(var(--ltw) / 9.03); --hnjs: stretch; --hnhta: center; --hnbc: rgba(22, 64, 230, 0.84); --hno: var(--mpx); --hmp: 0; --hmps: 5px 0; --hhmb: 0 0 20px; --mw: 100%; --bh: auto; --mm: var(--mpx) 0; --asbh: 40px; --mmbs: var(--asbh); --asbfd: column; --tnmd: block; --prolbe: calc( 100% - calc( var(--mp) * 2 ) ); --mswo: visible; --mswoy: visible; --hph: auto; --fph: calc( var(--hph) / 1.5 ); --bgtr: auto 1fr auto; --mmh: none; --bdu: block; --st: 1.375em; --hswm: 20px 0 0; --flgtc: 1fr; --mcgtc: var(--flgtc); --mcgg: var(--st); --mswp: 3em 0; --faamis: calc(var(--mp) * 1.5); }

:root .page-title { --mpx: 0; }

:root header { --hgtcmm: 370px; }

:root footer { z-index: 3; }

:root footer nav, :root footer .logo { display: none; }

:root footer.open-footer nav, :root footer.open-footer .logo { display: flex; }

:root footer.open-footer nav { background-color: #000; flex-direction: column; height: calc(100vh - calc(var(--mpx) * 2)); padding: var(--mpx) 0; position: fixed; top: 0; left: 0; right: 0; justify-content: center; gap: 44px; overflow: auto; }

:root footer.open-footer .logo-img { width: 35px; height: 35px; }

:root footer.open-footer .logo-text { display: none; }

@media (min-width: 500px) { :root { --flgtc: repeat(2, 1fr); } }

@media (min-width: 740px) { :root { --hmp: var(--mp); --hmps: var(--mp); --hno: 0; --bh: 50px; --asbfd: row; --mmbs: 0; --mswo: hidden; --mswoy: auto; --mw: 650px; --bdu: grid; --hhmb: 0; --hph: 60px; --hswm: 10px 0 0; } :root header h1 { --hnjs: flex-start; --hnhta: left; } :root header nav { --hnjs: flex-end; --hnhta: right; --hnbc: transparent; } }

@media (min-width: 800px) { :root { --prolbe: 100%; --hph: 100px; --mmh: 100%; --mswp: 0 0 3em; --mcgtc: repeat(2, 1fr); --faamis: calc(var(--mp) / 2); } :root .page-title { --mpx: 2em; } :root footer { --tnmd: none; } :root footer nav { display: flex; } }

@media (min-width: 1232px) { :root { --containerMinWidth: 1300px; } }

*:not(ul) { padding: 0; margin: 0; }

html, body { height: 100%; }

body { display: var(--bdu); grid-template-rows: var(--bgtr); background-color: var(--bbg); color: var(--bfc); font-family: -apple-system, BlinkMacSystemFont, system-ui, sans-serif; font-size: 100%; line-height: 1.1875; min-width: 320px; background: url(../img/pexels-philippe-donn-1169754.png) center center no-repeat fixed; background-size: cover; z-index: 0; }

body:before { content: ''; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.7); z-index: 1; }

body.open-footer { overflow: hidden; }

h1, h2, h3, h4 { font-weight: 500; }

h1 { font-size: var(--pt); }

textarea, input[type="text"] { line-height: var(--basic-height); text-indent: 4px; border-radius: 4px; border: 1px solid rgba(43, 78, 108, 0.2); box-sizing: border-box; }

input[type="file"] { z-index: 12; }

input[type="file"]:hover { cursor: pointer; }

img { width: 100%; height: auto; }

a { color: inherit; text-decoration: none; }

a:hover, button:not(:disabled):hover, input:hover { cursor: pointer; }

[disabled], .disabled { pointer-events: none; cursor: default; opacity: .6; }

[disabled]:hover, .disabled:hover { pointer-events: none; }

.hidden { z-index: -1; opacity: 0; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; margin: 0; }

svg:not(:root) { overflow: hidden; max-width: 100%; display: inline-block; }

::-webkit-input-placeholder { color: #7590a5; }

::-moz-placeholder { color: #7590a5; }

::-moz-placeholder { color: #7590a5; }

::placeholder { color: #7590a5; }

:focus::-webkit-input-placeholder { color: rgba(117, 144, 165, 0.4); }

:focus::-moz-placeholder { color: rgba(117, 144, 165, 0.4); }

:focus::placeholder { color: rgba(117, 144, 165, 0.4); }

header, main, footer { z-index: 1; }

main, footer { -webkit-padding-start: var(--mp); padding-inline-start: var(--mp); -webkit-padding-end: var(--mp); padding-inline-end: var(--mp); }

header, footer { --swmwx: 100%; background-color: rgba(0, 0, 0, 0.6); }

header .section-wrapper, footer .section-wrapper { display: grid; grid-template-columns: var(--gtc); align-items: var(--ai); align-content: var(--ac); }

header { --gtc: repeat( auto-fit, minmax(var(--hgtcmm), 1fr) ); --ai: center; height: var(--hph); }

header h1, header nav { justify-self: var(--hnjs); text-align: var(--hnhta); max-width: 100%; }

header h1 { -webkit-padding-start: var(--hmp); padding-inline-start: var(--hmp); margin: var(--hhmb); }

header nav { background-color: var(--hnbc); display: flex; gap: var(--mp); -webkit-padding-end: var(--hmp); padding-inline-end: var(--hmp); }

header nav a { padding: var(--hmps); margin: auto; }

header .section-wrapper { height: 100%; max-height: 155px; margin: var(--hswm); }

main { --ac: start; --pt: clamp(2em, 3vw, 2.875em); -webkit-margin-before: var(--mmbs); margin-block-start: var(--mmbs); display: var(--bdu); max-height: var(--mmh); overflow: auto; }

main .section-wrapper { --swmwx: calc( 100% - calc( var(--mp) * 2 ) ); height: 100%; z-index: 2; padding: var(--mswp); }

main .section-wrapper * { --mlr: auto; margin-left: var(--mlr); margin-right: var(--mlr); max-width: var(--mw); }

main .section-wrapper h4 { --mlr: 0; }

main * + * { margin-top: var(--mp); }

main li, main .app-store, main .mac-app-store, main .app-store-badges > div, main .swiper > div { --mp: 0; }

footer nav { display: flex; justify-content: space-between; align-items: center; }

footer > a { -webkit-padding-start: var(--mp); padding-inline-start: var(--mp); -webkit-padding-end: var(--mp); padding-inline-end: var(--mp); }

footer aside { -webkit-margin-end: calc(var(--mp) / 2); margin-inline-end: calc(var(--mp) / 2); }

footer aside a { display: inline-block; -webkit-margin-start: var(--faamis); margin-inline-start: var(--faamis); -webkit-margin-end: var(--faamis); margin-inline-end: var(--faamis); border-radius: 50%; width: var(--mp); height: var(--mp); -webkit-filter: grayscale(1); filter: grayscale(1); }

footer aside a:hover { -webkit-filter: grayscale(0); filter: grayscale(0); }

footer aside .twitter { background: url(../img/twitter-icon.svg) center center no-repeat; background-size: contain; }

footer aside .facebook { background: url(../img/facebook-icon.svg) center center no-repeat; background-size: contain; }

footer aside .instagram { background: url(../img/instagram-icon.svg) center center no-repeat; background-size: contain; }

footer aside .mastodon { background: url(../img/mastodon-icon.svg) center center no-repeat; background-size: contain; }

footer .section-wrapper { -webkit-padding-before: calc(var(--mp) / 2); padding-block-start: calc(var(--mp) / 2); -webkit-padding-after: calc(var(--mp) / 2); padding-block-end: calc(var(--mp) / 2); }

.swiper { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; z-index: 1; display: block; --swiper-wrapper-transition-timing-function: linear; }

.swiper-wrapper { position: relative; z-index: 1; display: flex; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial); -webkit-transform: translate3d(0px, 0, 0); transform: translate3d(0px, 0, 0); }

.swiper-horizontal { touch-action: pan-y; }

.swiper-slide { flex-shrink: 0; height: 100%; max-width: 100%; position: relative; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; display: block; }

.swiper-slide-invisible-blank { visibility: hidden; }

.swiper-lazy-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; -webkit-transform-origin: 50%; transform-origin: 50%; box-sizing: border-box; border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color)); border-radius: 50%; border-top-color: transparent; }

.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader, .swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader { -webkit-animation: swiper-preloader-spin 1s infinite linear; animation: swiper-preloader-spin 1s infinite linear; }

.swiper-lazy-preloader-white { --swiper-preloader-color: #fff; }

.swiper-lazy-preloader-black { --swiper-preloader-color: #000; }

@-webkit-keyframes swiper-preloader-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

@keyframes swiper-preloader-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

.swiper-button-prev, .swiper-button-next { position: absolute; top: var(--swiper-navigation-top-offset, 50%); width: var(--mp); height: var(--mp); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color, var(--swiper-theme-color)); }

.swiper-button-prev:after, .swiper-button-next:after { content: ''; border: solid #fff; width: 100%; height: 100%; display: block; }

.swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled { opacity: 0.35; cursor: auto; pointer-events: none; }

.swiper-button-prev.swiper-button-hidden, .swiper-button-next.swiper-button-hidden { opacity: 0; cursor: auto; pointer-events: none; }

.swiper-navigation-disabled .swiper-button-prev, .swiper-navigation-disabled .swiper-button-next { display: none !important; }

.swiper-button-prev svg, .swiper-button-next svg { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; -webkit-transform-origin: center; transform-origin: center; }

.swiper-button-prev { left: var(--swiper-navigation-sides-offset, 10px); right: auto; }

.swiper-button-prev:after { border-width: 1px 0 0 1px; }

.swiper-button-next { right: var(--swiper-navigation-sides-offset, 10px); left: auto; right: var(--swiper-navigation-sides-offset, 10px); left: auto; }

.logo { display: flex; flex-direction: var(--asbfd); align-items: center; gap: 14px; }

.logo-img, .logo-text { display: block; }

.logo-img { background: url("../img/logo-img.svg") center center no-repeat; background-size: contain; width: 65px; height: 65px; }

.logo-text { background: url("../img/logo-text.svg") 0 0 no-repeat; background-size: contain; width: var(--ltw); height: var(--lth); }

.svg-wrapper { position: relative; display: inline-block; }

.svg-wrapper svg { max-height: 100%; z-index: -1; }

.mac-app-store { background: url("../img/Download_on_the_Mac_App_Store_Badge_US-UK_RGB_blk_092917.svg") 0 0 no-repeat; width: 157px; height: var(--asbh); left: 14px; }

.app-store { background: url("../img/Download_on_the_App_Store_Badge_US-UK_RGB_blk_092917.svg") 0 0 no-repeat; width: 119px; height: var(--asbh); right: 14px; }

.app-store-badges { display: flex; flex-direction: var(--asbfd); max-width: 320px; }

.app-store-badges > div { width: 100%; }

.app-store-badges a { top: 0; }

.tab_nav_mobile { display: var(--tnmd); width: 32px; height: 32px; background-color: transparent; border: 0; right: var(--mp); bottom: var(--mp); z-index: 6; }

.tab_nav_mobile svg { width: 100%; top: 0; left: 0; }

.svg-cls-1 { stroke: #fff; }

.section-wrapper { width: var(--swmwx); margin-left: auto; margin-right: auto; }

.section-title { margin: var(--mpx) auto; font-size: var(--st); }

.page-title { text-align: center; margin: var(--mpx) auto; font-size: var(--pt); }

.title-centered { text-align: center; }

.features { padding-top: var(--mpx); }

.features-list { --mp: 0; display: grid; grid-template-columns: var(--flgtc); grid-gap: calc(var(--asbh) * 2); margin-bottom: calc(var(--mpx) * 2); }

.features-list-title { font-size: 1.125em; color: #fff; }

.features-list-icons { display: flex; grid-template-columns: 40px 1fr auto; align-items: center; width: 100%; justify-content: space-between; margin-bottom: 1em; }

.features-list-icons span, .features-list-icons a { flex: 1; max-width: 32px; margin: 0; }

.features-list-icons .icon { display: block; height: 32px; }

.features-list-icons .icon:not(:first-child) { margin-right: auto; }

.features-list-icons .weather { background: url(../img/weather-observable-icon.webp) left center no-repeat; background-size: contain; }

.features-list-icons .polis { background: url(../img/polis-icon.webp) left center no-repeat; background-size: contain; }

.features-list-icons .updates { background: url(../img/updates-icon.webp) left center no-repeat; background-size: contain; }

.features-list-icons .feature { background: url(../img/feature-icon.webp) left center no-repeat; background-size: contain; }

.features-list-icons a { border-radius: 6px; text-transform: uppercase; background-color: var(--indigo); padding: 2px 12px; text-align: center; }

.features-list-item { --mw: clamp(280px, 4vw, 300px); display: flex; flex-direction: column; justify-content: space-between; align-items: space-between; }

.features-list a { --flafs: 0.625em; display: block; font-size: var(--flafs); }

.features-list p { font-size: .75em; color: #8F8F8F; }

.features-list p + a { text-transform: uppercase; color: var(--indigo); text-align: right; margin-top: 1em; width: 100%; }

.multicolumn { --mp: 0; display: grid; grid-template-columns: var(--mcgtc); grid-gap: var(--mcgg); }

.multicolumn h2 + p { margin-top: 1em; }

@media print { * { line-height: normal !important; } @page { margin: .25cm;
    size: landscape;
    --ufffd: row; } main, div, p, li, label, h2, h3 { background: transparent; box-shadow: none; text-shadow: none; position: static !important; } th { white-space: normal; } p, li, a, li span, i, label, h2, h3, th, td, .can-toggle label .can-toggle__switch:after, input, .choices__item span { color: #000 !important; } a, a:visited { text-decoration: underline; } ::-webkit-input-placeholder { color: #aaa !important; } ::-moz-placeholder { color: #aaa !important; } ::-moz-placeholder { color: #aaa !important; } ::placeholder { color: #aaa !important; } ::-webkit-input-placeholder { color: #666 !important; } ::-moz-placeholder { color: #666 !important; } ::placeholder { color: #666 !important; } }