Yami Odymel f97539ab96
WIP
2024-01-23 10:34:17 +08:00

20433 lines
407 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/* ==========================================================================
Reset
========================================================================== */
/**
* Document
*
* 1. 讓所有的元素不會因為內距而更改其 `width` 寬度。
*/
*,
*::before,
*::after {
box-sizing: border-box; /** 1. */
}
/**
* HTML
*
* 1. 指定預設的動態背景與文字顏色,這樣才可以支援亮與暗色主題。
* 2. 預設要讓網頁能夠填滿整個螢幕才能讓某些元素運用整個高度。
*/
html {
background: var(--ts-page-background-default); /** 1. */
color: var(--ts-gray-800); /** 1. */
width: 100%; /** 2. */
height: 100%; /** 2. */
font-size: 15px;
line-height: 1.75;
}
body {
width: 100%; /** 2. */
height: 100%; /** 2. */
}
/**
* Body
*
* 1. 移除所有瀏覽器上的外距。
* 2. 避免元素過寬而出現不好捲動的水平捲軸。
* 3. 避免 iOS 在轉向之後變更字體縮放大小。
* 4. 改為透明來移除 Webkit 瀏覽器上的點擊高光。
*/
body {
margin: 0; /** 1. */
overflow-x: hidden; /** 2. */
-webkit-text-size-adjust: 100%; /** 3. */
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); /** 4. */
font-family: "Noto Sans TC", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", "Microsoft JhengHei", wf_SegoeUI, "Segoe UI",
Segoe, "Segoe WP", Tahoma, Verdana, Ubuntu, "Bitstream Vera Sans", "DejaVu Sans", , "LiHei Pro", "WenQuanYi Micro Hei", "Droid Sans Fallback", "AR PL UMing TW",
Roboto, "Hiragino Maru Gothic ProN", , "ヒラギノ丸ゴ ProN W4", Meiryo, "Droid Sans", sans-serif;
}
/**
* Input for iOS date input
*
* https://github.com/teacat/tocas/issues/804
* https://github.com/twbs/bootstrap/pull/31993
* https://github.com/twbs/bootstrap/blob/80621d6431acd964690f89352b4f1bf8be9cfaf3/scss/forms/_form-control.scss#L47
*/
input::-webkit-date-and-time-value {
min-height: calc(1rem * 1.5);
}
/**
* Button
*/
button {
border: none;
margin: 0;
padding: 0;
width: auto;
overflow: visible;
background: transparent;
color: inherit;
font: inherit;
line-height: normal;
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
appearance: none;
-webkit-appearance: none;
cursor: pointer;
user-select: none;
}
/**
* Dialog & Popover
*/
[popover] {
/*position: var(--ts-popover-position);*/
}
[class*="ts-"][popover]:not(:popover-open):not(:modal) {
display: none;
}
dialog[class*="ts-"],
:where([class*="ts-"][popover]) {
border: none;
margin: 0;
padding: 0;
max-width: initial;
max-height: initial;
}
/**
* Paragraphy
*/
[class*="ts-"] :where(p) {
margin-block-start: 1em;
margin-block-end: 1em;
}
[class*="ts-"] :where(:first-child) {
margin-block-start: 0;
}
[class*="ts-"] .ts-header + p {
margin-block-start: 0.5em;
}
[class*="ts-"] :where(:last-child) {
margin-block-end: 0;
}
[class*="ts-"] :where(a) {
color: inherit;
}
/* ==========================================================================
Variables
========================================================================== */
@keyframes ts-button-loading {
from {
transform: translate(-50%, -50%) rotate(0deg);
}
to {
transform: translate(-50%, -50%) rotate(360deg);
}
}
.ts-button {
--horizontal-padding: 1.25em;
--height: var(--ts-input-height-medium);
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-button {
position: relative;
margin: 0;
width: auto;
font: inherit;
outline: none;
box-sizing: border-box;
user-select: none;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
height: var(--height);
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
appearance: none;
-webkit-appearance: none;
}
.ts-button:focus {
outline: 0;
}
.ts-button {
border: 2px solid var(--accent-color, var(--ts-gray-800));
min-width: 75px;
font-size: var(--ts-font-size-14px);
line-height: 1.5;
font-weight: 500;
color: var(--accent-foreground-color, var(--ts-gray-50));
background: var(--accent-color, var(--ts-gray-800));
text-decoration: none;
display: inline-flex;
vertical-align: middle;
justify-content: center;
align-items: center;
text-align: center;
padding: 0 var(--horizontal-padding);
border-radius: var(--ts-border-radius-element);
}
.ts-button:hover {
cursor: pointer;
opacity: 0.98;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Secondary
*/
.ts-button.is-secondary {
color: var(--accent-color, var(--ts-gray-800));
border-color: var(--ts-gray-100);
background: var(--ts-gray-100);
}
/**
* Tertiary
*/
.ts-button.is-tertiary {
color: var(--ts-gray-800);
background: var(--ts-gray-300);
border-color: var(--ts-gray-300);
}
/**
* Outlined
*/
.ts-button.is-outlined {
background: transparent;
border: 2px solid var(--ts-gray-300);
color: var(--accent-color, var(--ts-gray-800));
}
/**
* Negative
*/
.ts-button.is-negative {
color: var(--ts-white);
border-color: var(--ts-negative-500);
background: var(--ts-negative-500);
}
.ts-button.is-negative.is-outlined {
color: var(--ts-negative-500);
border-color: var(--ts-gray-300);
background: transparent;
}
.ts-button.is-negative.is-secondary {
color: var(--ts-negative-500);
border-color: var(--ts-gray-100);
background: var(--ts-gray-100);
}
.ts-button.is-ghost.is-negative {
color: var(--ts-negative-500);
}
/**
* Ghost
*/
.ts-button.is-ghost {
background: transparent;
color: var(--ts-gray-800);
border: 2px solid transparent;
}
.ts-button.is-ghost:hover {
background: var(--ts-gray-100);
}
/**
* Loading
*/
.ts-button.is-loading,
.ts-button.is-loading.is-negative {
color: transparent;
}
.ts-button.is-loading .ts-icon {
visibility: hidden;
}
.ts-button.is-loading::after {
font-family: "Icons";
font-weight: normal;
font-style: normal;
display: inline;
text-decoration: inherit;
text-align: center;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
display: inline-block;
animation: ts-button-loading 2s linear infinite;
color: var(--ts-gray-50);
font-size: var(--ts-font-size-18px);
content: "\f110";
position: absolute;
top: 50%;
left: 50%;
}
.ts-button.is-loading:is(.is-outlined, .is-secondary, .is-tertiary, .is-ghost)::after {
color: var(--ts-gray-800);
}
/**
* Tertiary
*/
/*.ts-button.is-tertiary:hover {
background: var(--ts-gray-100);
opacity: 1;
}*/
/**
* Sizes
*/
.ts-button.is-small {
--height: var(--ts-input-height-small);
font-size: var(--ts-font-size-13px);
}
.ts-button.is-large {
--height: var(--ts-input-height-large);
font-size: var(--ts-font-size-16px);
}
/**
* Disabled
*/
.ts-button:disabled,
.ts-button.is-disabled,
fieldset:disabled .ts-button {
pointer-events: none;
opacity: 0.5;
user-select: none;
}
/**
* Fluid
*/
.ts-button.is-fluid {
width: 100%;
}
/**
* Circular
*/
.ts-button.is-circular {
border-radius: 100rem;
}
/**
* Icon
*/
.ts-button.is-icon {
padding: 0;
min-width: 0;
/*width: calc(var(--height) * 1.1);*/
width: var(--height);
}
.ts-button.is-icon .ts-icon {
font-size: 1.2em;
}
.ts-button.is-icon.is-small .ts-icon {
font-size: 1.15em;
}
/**
* Side Icon
*/
.ts-button:where(.is-start-icon, .is-end-icon) .ts-icon {
font-size: 1.2em;
}
.ts-button:is(.is-start-icon, .is-end-icon) .ts-icon::before {
display: inline-block;
margin-top: 1px;
}
.ts-button.is-start-icon .ts-icon {
margin-right: 0.5em;
}
.ts-button.is-end-icon .ts-icon {
margin-left: 0.5em;
}
/**
* Labeled Icon
*/
.ts-button:is(.is-start-labeled-icon, .is-end-labeled-icon) .ts-icon {
position: absolute;
top: -2px;
bottom: -2px;
background: var(--ts-gray-900);
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
width: calc(2.75rem + 2px);
}
.ts-button:where(.is-start-labeled-icon, .is-end-labeled-icon) .ts-icon {
font-size: 1.2em;
}
.ts-button.is-start-labeled-icon {
padding-left: calc(var(--horizontal-padding) + 2.75em);
}
.ts-button.is-start-labeled-icon .ts-icon {
left: -2px;
border-radius: var(--ts-border-radius-element) 0 0 var(--ts-border-radius-element);
}
.ts-button.is-end-labeled-icon {
padding-right: calc(var(--horizontal-padding) + 2.75em);
}
.ts-button.is-end-labeled-icon .ts-icon {
right: -2px;
border-radius: 0 var(--ts-border-radius-element) var(--ts-border-radius-element) 0;
}
.ts-button.is-negative:is(.is-start-labeled-icon, .is-end-labeled-icon) .ts-icon {
background: var(--ts-negative-400);
}
.ts-button.is-outlined:is(.is-start-labeled-icon, .is-end-labeled-icon) .ts-icon {
/*background: var(--ts-gray-300);*/
background: transparent;
border: 2px solid var(--ts-gray-300);
}
.ts-button.is-secondary:is(.is-start-labeled-icon, .is-end-labeled-icon) .ts-icon {
background: var(--ts-gray-200);
}
.ts-button.is-tertiary:is(.is-start-labeled-icon, .is-end-labeled-icon) .ts-icon {
background: var(--ts-gray-400);
}
/**
* Dense
*/
.ts-button.is-dense {
--height: var(--ts-input-height-medium-dense);
}
.ts-button.is-dense.is-small {
--height: var(--ts-input-height-small-dense);
}
.ts-button.is-dense.is-large {
--height: var(--ts-input-height-large-dense);
}
/**
* Wide
*/
.ts-button.is-short {
--horizontal-padding: 0.75em;
min-width: 65px;
}
.ts-button.is-wide {
--horizontal-padding: 2em;
}
/**
* Start & End
*/
.ts-addon {
display: flex;
gap: 2px;
}
.ts-addon > *:first-child,
.ts-addon > .ts-input:first-child :where(input, textarea) {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.ts-addon > *:last-child,
.ts-addon > .ts-input:last-child :where(input, textarea) {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
/**
* Buttons
*/
.ts-buttons {
display: flex;
}
.ts-buttons .ts-button:first-child {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.ts-buttons .ts-button:not(:first-child):not(:last-child) {
border-radius: 0;
}
.ts-buttons .ts-button:not(:first-child)::before {
position: absolute;
content: "";
top: 50%;
transform: translateY(-50%);
left: 0;
height: 70%;
background: var(--ts-gray-600);
width: 1px;
}
.ts-buttons .ts-button.is-icon:not(:first-child) {
width: calc(var(--height) * 1.1); /** divider visual balance */
}
.ts-buttons .ts-button.is-outlined::before {
display: none;
}
.ts-buttons .ts-button.is-negative::before {
background: var(--ts-negative-400);
}
.ts-buttons .ts-button.is-secondary::before {
background: var(--ts-gray-400);
}
.ts-buttons .ts-button:last-child {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}
.ts-buttons .ts-button.is-outlined + .ts-button.is-outlined {
border-left-color: transparent;
}
.ts-icon.is-car-rear-icon::before {
content: "\f5de";
}
.ts-icon.is-dice-five-icon::before {
content: "\f523";
}
.ts-icon.is-user-graduate-icon::before {
content: "\f501";
}
.ts-icon.is-bandage-icon::before {
content: "\f462";
}
.ts-icon.is-building-flag-icon::before {
content: "\e4d5";
}
.ts-icon.is-dice-six-icon::before {
content: "\f526";
}
.ts-icon.is-orcid-icon::before {
font-family: "IconsBrands";
content: "\f8d2";
}
.ts-icon.is-basket-shopping-icon::before {
content: "\f291";
}
.ts-icon.is-feather-pointed-icon::before {
content: "\f56b";
}
.ts-icon.is-pied-piper-pp-icon::before {
font-family: "IconsBrands";
content: "\f1a7";
}
.ts-icon.is-arrows-left-right-icon::before {
content: "\f07e";
}
.ts-icon.is-house-flood-water-circle-arrow-right-icon::before {
content: "\e50f";
}
.ts-icon.is-hand-sparkles-icon::before {
content: "\e05d";
}
.ts-icon.is-rust-icon::before {
font-family: "IconsBrands";
content: "\e07a";
}
.ts-icon.is-austral-sign-icon::before {
content: "\e0a9";
}
.ts-icon.is-cheese-icon::before {
content: "\f7ef";
}
.ts-icon.is-map-icon::before {
content: "\f279";
}
.ts-icon.is-car-icon::before {
content: "\f1b9";
}
.ts-icon.is-google-pay-icon::before {
font-family: "IconsBrands";
content: "\e079";
}
.ts-icon.is-house-laptop-icon::before {
content: "\e066";
}
.ts-icon.is-phabricator-icon::before {
font-family: "IconsBrands";
content: "\f3db";
}
.ts-icon.is-arrows-up-down-icon::before {
content: "\f07d";
}
.ts-icon.is-eject-icon::before {
content: "\f052";
}
.ts-icon.is-figma-icon::before {
font-family: "IconsBrands";
content: "\f799";
}
.ts-icon.is-file-zipper-icon::before {
content: "\f1c6";
}
.ts-icon.is-person-shelter-icon::before {
content: "\e54f";
}
.ts-icon.is-teamspeak-icon::before {
font-family: "IconsBrands";
content: "\f4f9";
}
.ts-icon.is-user-clock-icon::before {
content: "\f4fd";
}
.ts-icon.is-4-icon::before {
content: "\34";
}
.ts-icon.is-face-kiss-wink-heart-icon::before {
content: "\f598";
}
.ts-icon.is-paw-icon::before {
content: "\f1b0";
}
.ts-icon.is-angles-down-icon::before {
content: "\f103";
}
.ts-icon.is-css3-alt-icon::before {
font-family: "IconsBrands";
content: "\f38b";
}
.ts-icon.is-circle-stop-icon::before {
content: "\f28d";
}
.ts-icon.is-spoon-icon::before {
content: "\f2e5";
}
.ts-icon.is-table-columns-icon::before {
content: "\f0db";
}
.ts-icon.is-circle-info-icon::before {
content: "\f05a";
}
.ts-icon.is-mobile-icon::before {
content: "\f3ce";
}
.ts-icon.is-page4-icon::before {
font-family: "IconsBrands";
content: "\f3d7";
}
.ts-icon.is-champagne-glasses-icon::before {
content: "\f79f";
}
.ts-icon.is-signal-icon::before {
content: "\f012";
}
.ts-icon.is-pen-icon::before {
content: "\f304";
}
.ts-icon.is-staff-snake-icon::before {
content: "\e579";
}
.ts-icon.is-teeth-open-icon::before {
content: "\f62f";
}
.ts-icon.is-droplet-slash-icon::before {
content: "\f5c7";
}
.ts-icon.is-truck-monster-icon::before {
content: "\f63b";
}
.ts-icon.is-user-icon::before {
content: "\f007";
}
.ts-icon.is-face-sad-tear-icon::before {
content: "\f5b4";
}
.ts-icon.is-mizuni-icon::before {
font-family: "IconsBrands";
content: "\f3cc";
}
.ts-icon.is-lines-leaning-icon::before {
content: "\e51e";
}
.ts-icon.is-arrows-turn-right-icon::before {
content: "\e4c0";
}
.ts-icon.is-face-meh-icon::before {
content: "\f11a";
}
.ts-icon.is-person-dots-from-line-icon::before {
content: "\f470";
}
.ts-icon.is-uniregistry-icon::before {
font-family: "IconsBrands";
content: "\f404";
}
.ts-icon.is-7-icon::before {
content: "\37";
}
.ts-icon.is-hands-holding-icon::before {
content: "\f4c2";
}
.ts-icon.is-poop-icon::before {
content: "\f619";
}
.ts-icon.is-uncharted-icon::before {
font-family: "IconsBrands";
content: "\e084";
}
.ts-icon.is-yahoo-icon::before {
font-family: "IconsBrands";
content: "\f19e";
}
.ts-icon.is-gem-icon::before {
content: "\f3a5";
}
.ts-icon.is-itunes-icon::before {
font-family: "IconsBrands";
content: "\f3b4";
}
.ts-icon.is-linux-icon::before {
font-family: "IconsBrands";
content: "\f17c";
}
.ts-icon.is-percent-icon::before {
content: "\25";
}
.ts-icon.is-twitter-icon::before {
font-family: "IconsBrands";
content: "\f099";
}
.ts-icon.is-hat-wizard-icon::before {
content: "\f6e8";
}
.ts-icon.is-hand-holding-medical-icon::before {
content: "\e05c";
}
.ts-icon.is-joomla-icon::before {
font-family: "IconsBrands";
content: "\f1aa";
}
.ts-icon.is-bomb-icon::before {
content: "\f1e2";
}
.ts-icon.is-circle-check-icon::before {
content: "\f058";
}
.ts-icon.is-cube-icon::before {
content: "\f1b2";
}
.ts-icon.is-hooli-icon::before {
font-family: "IconsBrands";
content: "\f427";
}
.ts-icon.is-box-icon::before {
content: "\f466";
}
.ts-icon.is-mars-and-venus-burst-icon::before {
content: "\e523";
}
.ts-icon.is-mobile-screen-icon::before {
content: "\f3cf";
}
.ts-icon.is-object-group-icon::before {
content: "\f247";
}
.ts-icon.is-object-ungroup-icon::before {
content: "\f248";
}
.ts-icon.is-rebel-icon::before {
font-family: "IconsBrands";
content: "\f1d0";
}
.ts-icon.is-twitch-icon::before {
font-family: "IconsBrands";
content: "\f1e8";
}
.ts-icon.is-cedi-sign-icon::before {
content: "\e0df";
}
.ts-icon.is-digg-icon::before {
font-family: "IconsBrands";
content: "\f1a6";
}
.ts-icon.is-face-flushed-icon::before {
content: "\f579";
}
.ts-icon.is-firefox-browser-icon::before {
font-family: "IconsBrands";
content: "\e007";
}
.ts-icon.is-martini-glass-citrus-icon::before {
content: "\f561";
}
.ts-icon.is-bridge-icon::before {
content: "\e4c8";
}
.ts-icon.is-mosque-icon::before {
content: "\f678";
}
.ts-icon.is-bots-icon::before {
font-family: "IconsBrands";
content: "\e340";
}
.ts-icon.is-dashcube-icon::before {
font-family: "IconsBrands";
content: "\f210";
}
.ts-icon.is-droplet-icon::before {
content: "\f043";
}
.ts-icon.is-holly-berry-icon::before {
content: "\f7aa";
}
.ts-icon.is-bed-pulse-icon::before {
content: "\f487";
}
.ts-icon.is-chevron-up-icon::before {
content: "\f077";
}
.ts-icon.is-envelope-icon::before {
content: "\f0e0";
}
.ts-icon.is-hotel-icon::before {
content: "\f594";
}
.ts-icon.is-pencil-icon::before {
content: "\f303";
}
.ts-icon.is-right-from-bracket-icon::before {
content: "\f2f5";
}
.ts-icon.is-shield-icon::before {
content: "\f132";
}
.ts-icon.is-amazon-pay-icon::before {
font-family: "IconsBrands";
content: "\f42c";
}
.ts-icon.is-sketch-icon::before {
font-family: "IconsBrands";
content: "\f7c6";
}
.ts-icon.is-radiation-icon::before {
content: "\f7b9";
}
.ts-icon.is-person-praying-icon::before {
content: "\f683";
}
.ts-icon.is-sellcast-icon::before {
font-family: "IconsBrands";
content: "\f2da";
}
.ts-icon.is-temperature-empty-icon::before {
content: "\f2cb";
}
.ts-icon.is-umbrella-beach-icon::before {
content: "\f5ca";
}
.ts-icon.is-wheat-awn-circle-exclamation-icon::before {
content: "\e598";
}
.ts-icon.is-mailchimp-icon::before {
font-family: "IconsBrands";
content: "\f59e";
}
.ts-icon.is-football-icon::before {
content: "\f44e";
}
.ts-icon.is-image-portrait-icon::before {
content: "\f3e0";
}
.ts-icon.is-timeline-icon::before {
content: "\e29c";
}
.ts-icon.is-bicycle-icon::before {
content: "\f206";
}
.ts-icon.is-chess-board-icon::before {
content: "\f43c";
}
.ts-icon.is-linkedin-in-icon::before {
font-family: "IconsBrands";
content: "\f0e1";
}
.ts-icon.is-centos-icon::before {
font-family: "IconsBrands";
content: "\f789";
}
.ts-icon.is-circle-chevron-right-icon::before {
content: "\f138";
}
.ts-icon.is-computer-mouse-icon::before {
content: "\f8cc";
}
.ts-icon.is-arrow-up-icon::before {
content: "\f062";
}
.ts-icon.is-arrows-left-right-to-line-icon::before {
content: "\e4ba";
}
.ts-icon.is-chess-icon::before {
content: "\f439";
}
.ts-icon.is-people-roof-icon::before {
content: "\e537";
}
.ts-icon.is-alipay-icon::before {
font-family: "IconsBrands";
content: "\f642";
}
.ts-icon.is-face-kiss-icon::before {
content: "\f596";
}
.ts-icon.is-less-icon::before {
font-family: "IconsBrands";
content: "\f41d";
}
.ts-icon.is-person-biking-icon::before {
content: "\f84a";
}
.ts-icon.is-pizza-slice-icon::before {
content: "\f818";
}
.ts-icon.is-sellsy-icon::before {
font-family: "IconsBrands";
content: "\f213";
}
.ts-icon.is-sun-icon::before {
content: "\f185";
}
.ts-icon.is-yandex-icon::before {
font-family: "IconsBrands";
content: "\f413";
}
.ts-icon.is-dragon-icon::before {
content: "\f6d5";
}
.ts-icon.is-plane-circle-exclamation-icon::before {
content: "\e556";
}
.ts-icon.is-calendar-minus-icon::before {
content: "\f272";
}
.ts-icon.is-debian-icon::before {
font-family: "IconsBrands";
content: "\e60b";
}
.ts-icon.is-igloo-icon::before {
content: "\f7ae";
}
.ts-icon.is-scale-unbalanced-flip-icon::before {
content: "\f516";
}
.ts-icon.is-6-icon::before {
content: "\36";
}
.ts-icon.is-draw-polygon-icon::before {
content: "\f5ee";
}
.ts-icon.is-hand-holding-icon::before {
content: "\f4bd";
}
.ts-icon.is-id-badge-icon::before {
content: "\f2c1";
}
.ts-icon.is-volume-xmark-icon::before {
content: "\f6a9";
}
.ts-icon.is-building-shield-icon::before {
content: "\e4d8";
}
.ts-icon.is-display-icon::before {
content: "\e163";
}
.ts-icon.is-mars-and-venus-icon::before {
content: "\f224";
}
.ts-icon.is-tent-arrow-down-to-line-icon::before {
content: "\e57e";
}
.ts-icon.is-caret-right-icon::before {
content: "\f0da";
}
.ts-icon.is-dna-icon::before {
content: "\f471";
}
.ts-icon.is-tower-observation-icon::before {
content: "\e586";
}
.ts-icon.is-angle-left-icon::before {
content: "\f104";
}
.ts-icon.is-google-plus-icon::before {
font-family: "IconsBrands";
content: "\f2b3";
}
.ts-icon.is-stripe-s-icon::before {
font-family: "IconsBrands";
content: "\f42a";
}
.ts-icon.is-burst-icon::before {
content: "\e4dc";
}
.ts-icon.is-text-height-icon::before {
content: "\f034";
}
.ts-icon.is-uber-icon::before {
font-family: "IconsBrands";
content: "\f402";
}
.ts-icon.is-users-slash-icon::before {
content: "\e073";
}
.ts-icon.is-money-bills-icon::before {
content: "\e1f3";
}
.ts-icon.is-person-arrow-down-to-line-icon::before {
content: "\e538";
}
.ts-icon.is-sack-xmark-icon::before {
content: "\e56a";
}
.ts-icon.is-mountain-city-icon::before {
content: "\e52e";
}
.ts-icon.is-box-open-icon::before {
content: "\f49e";
}
.ts-icon.is-kickstarter-k-icon::before {
font-family: "IconsBrands";
content: "\f3bc";
}
.ts-icon.is-symfony-icon::before {
font-family: "IconsBrands";
content: "\f83d";
}
.ts-icon.is-arrow-down-1-9-icon::before {
content: "\f162";
}
.ts-icon.is-face-angry-icon::before {
content: "\f556";
}
.ts-icon.is-gitter-icon::before {
font-family: "IconsBrands";
content: "\f426";
}
.ts-icon.is-o-icon::before {
content: "\4f";
}
.ts-icon.is-dice-four-icon::before {
content: "\f524";
}
.ts-icon.is-id-card-icon::before {
content: "\f2c2";
}
.ts-icon.is-user-nurse-icon::before {
content: "\f82f";
}
.ts-icon.is-cloud-meatball-icon::before {
content: "\f73b";
}
.ts-icon.is-camera-retro-icon::before {
content: "\f083";
}
.ts-icon.is-gratipay-icon::before {
font-family: "IconsBrands";
content: "\f184";
}
.ts-icon.is-grip-lines-vertical-icon::before {
content: "\f7a5";
}
.ts-icon.is-audible-icon::before {
font-family: "IconsBrands";
content: "\f373";
}
.ts-icon.is-dyalog-icon::before {
font-family: "IconsBrands";
content: "\f399";
}
.ts-icon.is-hand-icon::before {
content: "\f256";
}
.ts-icon.is-mill-sign-icon::before {
content: "\e1ed";
}
.ts-icon.is-bridge-circle-xmark-icon::before {
content: "\e4cb";
}
.ts-icon.is-periscope-icon::before {
font-family: "IconsBrands";
content: "\f3da";
}
.ts-icon.is-person-circle-check-icon::before {
content: "\e53e";
}
.ts-icon.is-person-walking-dashed-line-arrow-right-icon::before {
content: "\e553";
}
.ts-icon.is-boxes-stacked-icon::before {
content: "\f468";
}
.ts-icon.is-house-tsunami-icon::before {
content: "\e515";
}
.ts-icon.is-python-icon::before {
font-family: "IconsBrands";
content: "\f3e2";
}
.ts-icon.is-cash-register-icon::before {
content: "\f788";
}
.ts-icon.is-hamsa-icon::before {
content: "\f665";
}
.ts-icon.is-house-chimney-window-icon::before {
content: "\e00d";
}
.ts-icon.is-node-js-icon::before {
font-family: "IconsBrands";
content: "\f3d3";
}
.ts-icon.is-person-chalkboard-icon::before {
content: "\e53d";
}
.ts-icon.is-vault-icon::before {
content: "\e2c5";
}
.ts-icon.is-forward-step-icon::before {
content: "\f051";
}
.ts-icon.is-typo3-icon::before {
font-family: "IconsBrands";
content: "\f42b";
}
.ts-icon.is-toilet-icon::before {
content: "\f7d8";
}
.ts-icon.is-candy-cane-icon::before {
content: "\f786";
}
.ts-icon.is-moon-icon::before {
content: "\f186";
}
.ts-icon.is-truck-medical-icon::before {
content: "\f0f9";
}
.ts-icon.is-blogger-b-icon::before {
font-family: "IconsBrands";
content: "\f37d";
}
.ts-icon.is-blender-icon::before {
content: "\f517";
}
.ts-icon.is-cpanel-icon::before {
font-family: "IconsBrands";
content: "\f388";
}
.ts-icon.is-martini-glass-icon::before {
content: "\f57b";
}
.ts-icon.is-virus-icon::before {
content: "\e074";
}
.ts-icon.is-arrows-to-dot-icon::before {
content: "\e4be";
}
.ts-icon.is-braille-icon::before {
content: "\f2a1";
}
.ts-icon.is-itch-io-icon::before {
font-family: "IconsBrands";
content: "\f83a";
}
.ts-icon.is-book-bookmark-icon::before {
content: "\e0bb";
}
.ts-icon.is-tower-broadcast-icon::before {
content: "\f519";
}
.ts-icon.is-truck-ramp-box-icon::before {
content: "\f4de";
}
.ts-icon.is-archway-icon::before {
content: "\f557";
}
.ts-icon.is-wheelchair-move-icon::before {
content: "\e2ce";
}
.ts-icon.is-ello-icon::before {
font-family: "IconsBrands";
content: "\f5f1";
}
.ts-icon.is-creative-commons-nc-jp-icon::before {
font-family: "IconsBrands";
content: "\f4ea";
}
.ts-icon.is-dumpster-fire-icon::before {
content: "\f794";
}
.ts-icon.is-cotton-bureau-icon::before {
font-family: "IconsBrands";
content: "\f89e";
}
.ts-icon.is-ioxhost-icon::before {
font-family: "IconsBrands";
content: "\f208";
}
.ts-icon.is-lock-open-icon::before {
content: "\f3c1";
}
.ts-icon.is-magnifying-glass-arrow-right-icon::before {
content: "\e521";
}
.ts-icon.is-truck-fast-icon::before {
content: "\f48b";
}
.ts-icon.is-gun-icon::before {
content: "\e19b";
}
.ts-icon.is-cake-candles-icon::before {
content: "\f1fd";
}
.ts-icon.is-cubes-stacked-icon::before {
content: "\e4e6";
}
.ts-icon.is-gears-icon::before {
content: "\f085";
}
.ts-icon.is-lari-sign-icon::before {
content: "\e1c8";
}
.ts-icon.is-themeco-icon::before {
font-family: "IconsBrands";
content: "\f5c6";
}
.ts-icon.is-bootstrap-icon::before {
font-family: "IconsBrands";
content: "\f836";
}
.ts-icon.is-tag-icon::before {
content: "\f02b";
}
.ts-icon.is-folder-open-icon::before {
content: "\f07c";
}
.ts-icon.is-infinity-icon::before {
content: "\f534";
}
.ts-icon.is-pix-icon::before {
font-family: "IconsBrands";
content: "\e43a";
}
.ts-icon.is-square-x-twitter-icon::before {
font-family: "IconsBrands";
content: "\e61a";
}
.ts-icon.is-grip-lines-icon::before {
content: "\f7a4";
}
.ts-icon.is-ring-icon::before {
content: "\f70b";
}
.ts-icon.is-square-check-icon::before {
content: "\f14a";
}
.ts-icon.is-arrow-right-from-bracket-icon::before {
content: "\f08b";
}
.ts-icon.is-lastfm-icon::before {
font-family: "IconsBrands";
content: "\f202";
}
.ts-icon.is-plate-wheat-icon::before {
content: "\e55a";
}
.ts-icon.is-up-long-icon::before {
content: "\f30c";
}
.ts-icon.is-building-circle-arrow-right-icon::before {
content: "\e4d1";
}
.ts-icon.is-fill-drip-icon::before {
content: "\f576";
}
.ts-icon.is-keyboard-icon::before {
content: "\f11c";
}
.ts-icon.is-laptop-file-icon::before {
content: "\e51d";
}
.ts-icon.is-microchip-icon::before {
content: "\f2db";
}
.ts-icon.is-temperature-arrow-down-icon::before {
content: "\e03f";
}
.ts-icon.is-umbraco-icon::before {
font-family: "IconsBrands";
content: "\f8e8";
}
.ts-icon.is-face-sad-cry-icon::before {
content: "\f5b3";
}
.ts-icon.is-face-grin-beam-sweat-icon::before {
content: "\f583";
}
.ts-icon.is-helmet-un-icon::before {
content: "\e503";
}
.ts-icon.is-shoe-prints-icon::before {
content: "\f54b";
}
.ts-icon.is-turn-down-icon::before {
content: "\f3be";
}
.ts-icon.is-viadeo-icon::before {
font-family: "IconsBrands";
content: "\f2a9";
}
.ts-icon.is-cloud-arrow-down-icon::before {
content: "\f0ed";
}
.ts-icon.is-explosion-icon::before {
content: "\e4e9";
}
.ts-icon.is-horse-icon::before {
content: "\f6f0";
}
.ts-icon.is-person-running-icon::before {
content: "\f70c";
}
.ts-icon.is-pills-icon::before {
content: "\f484";
}
.ts-icon.is-star-half-icon::before {
content: "\f089";
}
.ts-icon.is-vimeo-v-icon::before {
font-family: "IconsBrands";
content: "\f27d";
}
.ts-icon.is-1-icon::before {
content: "\31";
}
.ts-icon.is-arrow-up-short-wide-icon::before {
content: "\f885";
}
.ts-icon.is-ban-icon::before {
content: "\f05e";
}
.ts-icon.is-circle-icon::before {
content: "\f111";
}
.ts-icon.is-comment-dollar-icon::before {
content: "\f651";
}
.ts-icon.is-glass-water-droplet-icon::before {
content: "\e4f5";
}
.ts-icon.is-hand-holding-hand-icon::before {
content: "\e4f7";
}
.ts-icon.is-hryvnia-sign-icon::before {
content: "\f6f2";
}
.ts-icon.is-arrow-left-icon::before {
content: "\f060";
}
.ts-icon.is-mixer-icon::before {
font-family: "IconsBrands";
content: "\e056";
}
.ts-icon.is-sort-icon::before {
content: "\f0dc";
}
.ts-icon.is-vaadin-icon::before {
font-family: "IconsBrands";
content: "\f408";
}
.ts-icon.is-kit-medical-icon::before {
content: "\f479";
}
.ts-icon.is-creative-commons-share-icon::before {
font-family: "IconsBrands";
content: "\f4f2";
}
.ts-icon.is-divide-icon::before {
content: "\f529";
}
.ts-icon.is-first-order-icon::before {
font-family: "IconsBrands";
content: "\f2b0";
}
.ts-icon.is-heart-circle-check-icon::before {
content: "\e4fd";
}
.ts-icon.is-audio-description-icon::before {
content: "\f29e";
}
.ts-icon.is-circle-arrow-up-icon::before {
content: "\f0aa";
}
.ts-icon.is-ethernet-icon::before {
content: "\f796";
}
.ts-icon.is-hive-icon::before {
font-family: "IconsBrands";
content: "\e07f";
}
.ts-icon.is-laptop-code-icon::before {
content: "\f5fc";
}
.ts-icon.is-lyft-icon::before {
font-family: "IconsBrands";
content: "\f3c3";
}
.ts-icon.is-person-icon::before {
content: "\f183";
}
.ts-icon.is-suitcase-medical-icon::before {
content: "\f0fa";
}
.ts-icon.is-cable-car-icon::before {
content: "\f7da";
}
.ts-icon.is-laptop-medical-icon::before {
content: "\f812";
}
.ts-icon.is-pushed-icon::before {
font-family: "IconsBrands";
content: "\f3e1";
}
.ts-icon.is-discourse-icon::before {
font-family: "IconsBrands";
content: "\f393";
}
.ts-icon.is-sign-hanging-icon::before {
content: "\f4d9";
}
.ts-icon.is-square-hacker-news-icon::before {
font-family: "IconsBrands";
content: "\f3af";
}
.ts-icon.is-prescription-bottle-icon::before {
content: "\f485";
}
.ts-icon.is-list-icon::before {
content: "\f03a";
}
.ts-icon.is-stamp-icon::before {
content: "\f5bf";
}
.ts-icon.is-hand-scissors-icon::before {
content: "\f257";
}
.ts-icon.is-grip-icon::before {
content: "\f58d";
}
.ts-icon.is-scale-unbalanced-icon::before {
content: "\f515";
}
.ts-icon.is-gofore-icon::before {
font-family: "IconsBrands";
content: "\f3a7";
}
.ts-icon.is-graduation-cap-icon::before {
content: "\f19d";
}
.ts-icon.is-korvue-icon::before {
font-family: "IconsBrands";
content: "\f42f";
}
.ts-icon.is-map-location-icon::before {
content: "\f59f";
}
.ts-icon.is-ruler-vertical-icon::before {
content: "\f548";
}
.ts-icon.is-computer-icon::before {
content: "\e4e5";
}
.ts-icon.is-neos-icon::before {
font-family: "IconsBrands";
content: "\f612";
}
.ts-icon.is-square-phone-flip-icon::before {
content: "\f87b";
}
.ts-icon.is-baseball-bat-ball-icon::before {
content: "\f432";
}
.ts-icon.is-dungeon-icon::before {
content: "\f6d9";
}
.ts-icon.is-envira-icon::before {
font-family: "IconsBrands";
content: "\f299";
}
.ts-icon.is-google-wallet-icon::before {
font-family: "IconsBrands";
content: "\f1ee";
}
.ts-icon.is-greater-than-icon::before {
content: "\3e";
}
.ts-icon.is-hourglass-icon::before {
content: "\f254";
}
.ts-icon.is-ravelry-icon::before {
font-family: "IconsBrands";
content: "\f2d9";
}
.ts-icon.is-superpowers-icon::before {
font-family: "IconsBrands";
content: "\f2dd";
}
.ts-icon.is-accusoft-icon::before {
font-family: "IconsBrands";
content: "\f369";
}
.ts-icon.is-think-peaks-icon::before {
font-family: "IconsBrands";
content: "\f731";
}
.ts-icon.is-city-icon::before {
content: "\f64f";
}
.ts-icon.is-plane-arrival-icon::before {
content: "\f5af";
}
.ts-icon.is-arrow-up-z-a-icon::before {
content: "\f882";
}
.ts-icon.is-signs-post-icon::before {
content: "\f277";
}
.ts-icon.is-sitrox-icon::before {
font-family: "IconsBrands";
content: "\e44a";
}
.ts-icon.is-book-tanakh-icon::before {
content: "\f827";
}
.ts-icon.is-jug-detergent-icon::before {
content: "\e519";
}
.ts-icon.is-modx-icon::before {
font-family: "IconsBrands";
content: "\f285";
}
.ts-icon.is-people-line-icon::before {
content: "\e534";
}
.ts-icon.is-rectangle-ad-icon::before {
content: "\f641";
}
.ts-icon.is-shuttle-space-icon::before {
content: "\f197";
}
.ts-icon.is-envelope-open-text-icon::before {
content: "\f658";
}
.ts-icon.is-snapchat-icon::before {
font-family: "IconsBrands";
content: "\f2ab";
}
.ts-icon.is-code-icon::before {
content: "\f121";
}
.ts-icon.is-wordpress-simple-icon::before {
font-family: "IconsBrands";
content: "\f411";
}
.ts-icon.is-earth-africa-icon::before {
content: "\f57c";
}
.ts-icon.is-dog-icon::before {
content: "\f6d3";
}
.ts-icon.is-hat-cowboy-icon::before {
content: "\f8c0";
}
.ts-icon.is-house-medical-circle-xmark-icon::before {
content: "\e513";
}
.ts-icon.is-staylinked-icon::before {
font-family: "IconsBrands";
content: "\f3f5";
}
.ts-icon.is-bell-concierge-icon::before {
content: "\f562";
}
.ts-icon.is-heart-circle-xmark-icon::before {
content: "\e501";
}
.ts-icon.is-replyd-icon::before {
font-family: "IconsBrands";
content: "\f3e6";
}
.ts-icon.is-f-icon::before {
content: "\46";
}
.ts-icon.is-faucet-icon::before {
content: "\e005";
}
.ts-icon.is-film-icon::before {
content: "\f008";
}
.ts-icon.is-house-chimney-medical-icon::before {
content: "\f7f2";
}
.ts-icon.is-lungs-icon::before {
content: "\f604";
}
.ts-icon.is-shop-icon::before {
content: "\f54f";
}
.ts-icon.is-trello-icon::before {
font-family: "IconsBrands";
content: "\f181";
}
.ts-icon.is-blackberry-icon::before {
font-family: "IconsBrands";
content: "\f37b";
}
.ts-icon.is-tencent-weibo-icon::before {
font-family: "IconsBrands";
content: "\f1d5";
}
.ts-icon.is-battery-empty-icon::before {
content: "\f244";
}
.ts-icon.is-greater-than-equal-icon::before {
content: "\f532";
}
.ts-icon.is-square-nfi-icon::before {
content: "\e576";
}
.ts-icon.is-user-injured-icon::before {
content: "\f728";
}
.ts-icon.is-arrow-down-z-a-icon::before {
content: "\f881";
}
.ts-icon.is-microphone-slash-icon::before {
content: "\f131";
}
.ts-icon.is-lira-sign-icon::before {
content: "\f195";
}
.ts-icon.is-person-circle-minus-icon::before {
content: "\e540";
}
.ts-icon.is-person-dress-icon::before {
content: "\f182";
}
.ts-icon.is-plug-circle-exclamation-icon::before {
content: "\e55d";
}
.ts-icon.is-trowel-icon::before {
content: "\e589";
}
.ts-icon.is-user-check-icon::before {
content: "\f4fc";
}
.ts-icon.is-left-long-icon::before {
content: "\f30a";
}
.ts-icon.is-virus-covid-icon::before {
content: "\e4a8";
}
.ts-icon.is-xmarks-lines-icon::before {
content: "\e59a";
}
.ts-icon.is-recycle-icon::before {
content: "\f1b8";
}
.ts-icon.is-face-grin-tongue-wink-icon::before {
content: "\f58b";
}
.ts-icon.is-keybase-icon::before {
font-family: "IconsBrands";
content: "\f4f5";
}
.ts-icon.is-landmark-flag-icon::before {
content: "\e51c";
}
.ts-icon.is-square-caret-right-icon::before {
content: "\f152";
}
.ts-icon.is-chevron-left-icon::before {
content: "\f053";
}
.ts-icon.is-user-large-icon::before {
content: "\f406";
}
.ts-icon.is-d-and-d-icon::before {
font-family: "IconsBrands";
content: "\f38d";
}
.ts-icon.is-person-harassing-icon::before {
content: "\e549";
}
.ts-icon.is-themeisle-icon::before {
font-family: "IconsBrands";
content: "\f2b2";
}
.ts-icon.is-flag-usa-icon::before {
content: "\f74d";
}
.ts-icon.is-aviato-icon::before {
font-family: "IconsBrands";
content: "\f421";
}
.ts-icon.is-user-doctor-icon::before {
content: "\f0f0";
}
.ts-icon.is-user-tie-icon::before {
content: "\f508";
}
.ts-icon.is-arrow-trend-down-icon::before {
content: "\e097";
}
.ts-icon.is-plane-departure-icon::before {
content: "\f5b0";
}
.ts-icon.is-receipt-icon::before {
content: "\f543";
}
.ts-icon.is-road-circle-check-icon::before {
content: "\e564";
}
.ts-icon.is-triangle-exclamation-icon::before {
content: "\f071";
}
.ts-icon.is-vials-icon::before {
content: "\f493";
}
.ts-icon.is-border-top-left-icon::before {
content: "\f853";
}
.ts-icon.is-mortar-pestle-icon::before {
content: "\f5a7";
}
.ts-icon.is-foursquare-icon::before {
font-family: "IconsBrands";
content: "\f180";
}
.ts-icon.is-users-line-icon::before {
content: "\e592";
}
.ts-icon.is-l-icon::before {
content: "\4c";
}
.ts-icon.is-newspaper-icon::before {
content: "\f1ea";
}
.ts-icon.is-place-of-worship-icon::before {
content: "\f67f";
}
.ts-icon.is-fire-extinguisher-icon::before {
content: "\f134";
}
.ts-icon.is-hire-a-helper-icon::before {
font-family: "IconsBrands";
content: "\f3b0";
}
.ts-icon.is-otter-icon::before {
content: "\f700";
}
.ts-icon.is-align-left-icon::before {
content: "\f036";
}
.ts-icon.is-exclamation-icon::before {
content: "\21";
}
.ts-icon.is-unsplash-icon::before {
font-family: "IconsBrands";
content: "\e07c";
}
.ts-icon.is-bacterium-icon::before {
content: "\e05a";
}
.ts-icon.is-dochub-icon::before {
font-family: "IconsBrands";
content: "\f394";
}
.ts-icon.is-bookmark-icon::before {
content: "\f02e";
}
.ts-icon.is-forumbee-icon::before {
font-family: "IconsBrands";
content: "\f211";
}
.ts-icon.is-tarp-icon::before {
content: "\e57b";
}
.ts-icon.is-dribbble-icon::before {
font-family: "IconsBrands";
content: "\f17d";
}
.ts-icon.is-puzzle-piece-icon::before {
content: "\f12e";
}
.ts-icon.is-red-river-icon::before {
font-family: "IconsBrands";
content: "\f3e3";
}
.ts-icon.is-republican-icon::before {
content: "\f75e";
}
.ts-icon.is-thermometer-icon::before {
content: "\f491";
}
.ts-icon.is-user-large-slash-icon::before {
content: "\f4fa";
}
.ts-icon.is-equals-icon::before {
content: "\3d";
}
.ts-icon.is-medium-icon::before {
font-family: "IconsBrands";
content: "\f23a";
}
.ts-icon.is-screenpal-icon::before {
font-family: "IconsBrands";
content: "\e570";
}
.ts-icon.is-face-dizzy-icon::before {
content: "\f567";
}
.ts-icon.is-socks-icon::before {
content: "\f696";
}
.ts-icon.is-thumbs-down-icon::before {
content: "\f165";
}
.ts-icon.is-book-skull-icon::before {
content: "\f6b7";
}
.ts-icon.is-music-icon::before {
content: "\f001";
}
.ts-icon.is-person-burst-icon::before {
content: "\e53b";
}
.ts-icon.is-pump-soap-icon::before {
content: "\e06b";
}
.ts-icon.is-handshake-simple-icon::before {
content: "\f4c6";
}
.ts-icon.is-gopuram-icon::before {
content: "\f664";
}
.ts-icon.is-money-bill-icon::before {
content: "\f0d6";
}
.ts-icon.is-rss-icon::before {
content: "\f09e";
}
.ts-icon.is-clover-icon::before {
content: "\e139";
}
.ts-icon.is-bitbucket-icon::before {
font-family: "IconsBrands";
content: "\f171";
}
.ts-icon.is-chevron-right-icon::before {
content: "\f054";
}
.ts-icon.is-file-video-icon::before {
content: "\f1c8";
}
.ts-icon.is-virus-slash-icon::before {
content: "\e075";
}
.ts-icon.is-arrows-to-eye-icon::before {
content: "\e4bf";
}
.ts-icon.is-speaker-deck-icon::before {
font-family: "IconsBrands";
content: "\f83c";
}
.ts-icon.is-mound-icon::before {
content: "\e52d";
}
.ts-icon.is-mars-stroke-right-icon::before {
content: "\f22b";
}
.ts-icon.is-mattress-pillow-icon::before {
content: "\e525";
}
.ts-icon.is-square-gitlab-icon::before {
font-family: "IconsBrands";
content: "\e5ae";
}
.ts-icon.is-carrot-icon::before {
content: "\f787";
}
.ts-icon.is-box-archive-icon::before {
content: "\f187";
}
.ts-icon.is-bus-simple-icon::before {
content: "\f55e";
}
.ts-icon.is-deezer-icon::before {
font-family: "IconsBrands";
content: "\e077";
}
.ts-icon.is-docker-icon::before {
font-family: "IconsBrands";
content: "\f395";
}
.ts-icon.is-github-icon::before {
font-family: "IconsBrands";
content: "\f09b";
}
.ts-icon.is-vial-circle-check-icon::before {
content: "\e596";
}
.ts-icon.is-bath-icon::before {
content: "\f2cd";
}
.ts-icon.is-dharmachakra-icon::before {
content: "\f655";
}
.ts-icon.is-car-on-icon::before {
content: "\e4dd";
}
.ts-icon.is-compress-icon::before {
content: "\f066";
}
.ts-icon.is-question-icon::before {
content: "\3f";
}
.ts-icon.is-square-steam-icon::before {
font-family: "IconsBrands";
content: "\f1b7";
}
.ts-icon.is-arrow-left-long-icon::before {
content: "\f177";
}
.ts-icon.is-rotate-left-icon::before {
content: "\f2ea";
}
.ts-icon.is-file-pdf-icon::before {
content: "\f1c1";
}
.ts-icon.is-square-dribbble-icon::before {
font-family: "IconsBrands";
content: "\f397";
}
.ts-icon.is-tree-city-icon::before {
content: "\e587";
}
.ts-icon.is-filter-circle-xmark-icon::before {
content: "\e17b";
}
.ts-icon.is-glide-icon::before {
font-family: "IconsBrands";
content: "\f2a5";
}
.ts-icon.is-renren-icon::before {
font-family: "IconsBrands";
content: "\f18b";
}
.ts-icon.is-circle-question-icon::before {
content: "\f059";
}
.ts-icon.is-briefcase-medical-icon::before {
content: "\f469";
}
.ts-icon.is-confluence-icon::before {
font-family: "IconsBrands";
content: "\f78d";
}
.ts-icon.is-eye-low-vision-icon::before {
content: "\f2a8";
}
.ts-icon.is-atlassian-icon::before {
font-family: "IconsBrands";
content: "\f77b";
}
.ts-icon.is-space-awesome-icon::before {
font-family: "IconsBrands";
content: "\e5ac";
}
.ts-icon.is-file-arrow-down-icon::before {
content: "\f56d";
}
.ts-icon.is-face-laugh-wink-icon::before {
content: "\f59c";
}
.ts-icon.is-hips-icon::before {
font-family: "IconsBrands";
content: "\f452";
}
.ts-icon.is-house-medical-circle-check-icon::before {
content: "\e511";
}
.ts-icon.is-user-secret-icon::before {
content: "\f21b";
}
.ts-icon.is-child-reaching-icon::before {
content: "\e59d";
}
.ts-icon.is-square-phone-icon::before {
content: "\f098";
}
.ts-icon.is-tags-icon::before {
content: "\f02c";
}
.ts-icon.is-tower-cell-icon::before {
content: "\e585";
}
.ts-icon.is-won-sign-icon::before {
content: "\f159";
}
.ts-icon.is-wpressr-icon::before {
font-family: "IconsBrands";
content: "\f3e4";
}
.ts-icon.is-cloud-arrow-up-icon::before {
content: "\f0ee";
}
.ts-icon.is-face-smile-wink-icon::before {
content: "\f4da";
}
.ts-icon.is-inbox-icon::before {
content: "\f01c";
}
.ts-icon.is-cart-flatbed-suitcase-icon::before {
content: "\f59d";
}
.ts-icon.is-yelp-icon::before {
font-family: "IconsBrands";
content: "\f1e9";
}
.ts-icon.is-soundcloud-icon::before {
font-family: "IconsBrands";
content: "\f1be";
}
.ts-icon.is-manat-sign-icon::before {
content: "\e1d5";
}
.ts-icon.is-plane-up-icon::before {
content: "\e22d";
}
.ts-icon.is-fedora-icon::before {
font-family: "IconsBrands";
content: "\f798";
}
.ts-icon.is-wind-icon::before {
content: "\f72e";
}
.ts-icon.is-medal-icon::before {
content: "\f5a2";
}
.ts-icon.is-old-republic-icon::before {
font-family: "IconsBrands";
content: "\f510";
}
.ts-icon.is-pinterest-icon::before {
font-family: "IconsBrands";
content: "\f0d2";
}
.ts-icon.is-shuffle-icon::before {
content: "\f074";
}
.ts-icon.is-calendar-xmark-icon::before {
content: "\f273";
}
.ts-icon.is-mars-double-icon::before {
content: "\f227";
}
.ts-icon.is-gulp-icon::before {
font-family: "IconsBrands";
content: "\f3ae";
}
.ts-icon.is-clapperboard-icon::before {
content: "\e131";
}
.ts-icon.is-shield-dog-icon::before {
content: "\e573";
}
.ts-icon.is-black-tie-icon::before {
font-family: "IconsBrands";
content: "\f27e";
}
.ts-icon.is-meteor-icon::before {
content: "\f753";
}
.ts-icon.is-pen-fancy-icon::before {
content: "\f5ac";
}
.ts-icon.is-quinscape-icon::before {
font-family: "IconsBrands";
content: "\f459";
}
.ts-icon.is-stackpath-icon::before {
font-family: "IconsBrands";
content: "\f842";
}
.ts-icon.is-kaggle-icon::before {
font-family: "IconsBrands";
content: "\f5fa";
}
.ts-icon.is-cloud-moon-icon::before {
content: "\f6c3";
}
.ts-icon.is-safari-icon::before {
font-family: "IconsBrands";
content: "\f267";
}
.ts-icon.is-chalkboard-user-icon::before {
content: "\f51c";
}
.ts-icon.is-leanpub-icon::before {
font-family: "IconsBrands";
content: "\f212";
}
.ts-icon.is-dice-two-icon::before {
content: "\f528";
}
.ts-icon.is-people-carry-box-icon::before {
content: "\f4ce";
}
.ts-icon.is-table-cells-large-icon::before {
content: "\f009";
}
.ts-icon.is-upload-icon::before {
content: "\f093";
}
.ts-icon.is-check-to-slot-icon::before {
content: "\f772";
}
.ts-icon.is-readme-icon::before {
font-family: "IconsBrands";
content: "\f4d5";
}
.ts-icon.is-handshake-simple-slash-icon::before {
content: "\e05f";
}
.ts-icon.is-credit-card-icon::before {
content: "\f09d";
}
.ts-icon.is-hat-cowboy-side-icon::before {
content: "\f8c1";
}
.ts-icon.is-location-dot-icon::before {
content: "\f3c5";
}
.ts-icon.is-person-booth-icon::before {
content: "\f756";
}
.ts-icon.is-wand-magic-sparkles-icon::before {
content: "\e2ca";
}
.ts-icon.is-book-icon::before {
content: "\f02d";
}
.ts-icon.is-volume-low-icon::before {
content: "\f027";
}
.ts-icon.is-venus-double-icon::before {
content: "\f226";
}
.ts-icon.is-dice-d20-icon::before {
content: "\f6cf";
}
.ts-icon.is-eye-slash-icon::before {
content: "\f070";
}
.ts-icon.is-file-image-icon::before {
content: "\f1c5";
}
.ts-icon.is-house-medical-flag-icon::before {
content: "\e514";
}
.ts-icon.is-battery-full-icon::before {
content: "\f240";
}
.ts-icon.is-bitcoin-icon::before {
font-family: "IconsBrands";
content: "\f379";
}
.ts-icon.is-ember-icon::before {
font-family: "IconsBrands";
content: "\f423";
}
.ts-icon.is-openid-icon::before {
font-family: "IconsBrands";
content: "\f19b";
}
.ts-icon.is-person-rifle-icon::before {
content: "\e54e";
}
.ts-icon.is-window-restore-icon::before {
content: "\f2d2";
}
.ts-icon.is-angle-up-icon::before {
content: "\f106";
}
.ts-icon.is-futbol-icon::before {
content: "\f1e3";
}
.ts-icon.is-menorah-icon::before {
content: "\f676";
}
.ts-icon.is-server-icon::before {
content: "\f233";
}
.ts-icon.is-vest-patches-icon::before {
content: "\e086";
}
.ts-icon.is-angrycreative-icon::before {
font-family: "IconsBrands";
content: "\f36e";
}
.ts-icon.is-paper-plane-icon::before {
content: "\f1d8";
}
.ts-icon.is-paperclip-icon::before {
content: "\f0c6";
}
.ts-icon.is-file-import-icon::before {
content: "\f56f";
}
.ts-icon.is-galactic-senate-icon::before {
font-family: "IconsBrands";
content: "\f50d";
}
.ts-icon.is-shrimp-icon::before {
content: "\e448";
}
.ts-icon.is-wine-glass-icon::before {
content: "\f4e3";
}
.ts-icon.is-drum-icon::before {
content: "\f569";
}
.ts-icon.is-magnifying-glass-plus-icon::before {
content: "\f00e";
}
.ts-icon.is-cloudflare-icon::before {
font-family: "IconsBrands";
content: "\e07d";
}
.ts-icon.is-child-dress-icon::before {
content: "\e59c";
}
.ts-icon.is-hand-dots-icon::before {
content: "\f461";
}
.ts-icon.is-slideshare-icon::before {
font-family: "IconsBrands";
content: "\f1e7";
}
.ts-icon.is-sterling-sign-icon::before {
content: "\f154";
}
.ts-icon.is-airbnb-icon::before {
font-family: "IconsBrands";
content: "\f834";
}
.ts-icon.is-face-grimace-icon::before {
content: "\f57f";
}
.ts-icon.is-floppy-disk-icon::before {
content: "\f0c7";
}
.ts-icon.is-scroll-icon::before {
content: "\f70e";
}
.ts-icon.is-vine-icon::before {
font-family: "IconsBrands";
content: "\f1ca";
}
.ts-icon.is-circle-play-icon::before {
content: "\f144";
}
.ts-icon.is-angles-left-icon::before {
content: "\f100";
}
.ts-icon.is-fantasy-flight-games-icon::before {
font-family: "IconsBrands";
content: "\f6dc";
}
.ts-icon.is-tent-arrow-turn-left-icon::before {
content: "\e580";
}
.ts-icon.is-a-icon::before {
content: "\41";
}
.ts-icon.is-litecoin-sign-icon::before {
content: "\e1d3";
}
.ts-icon.is-lungs-virus-icon::before {
content: "\e067";
}
.ts-icon.is-piggy-bank-icon::before {
content: "\f4d3";
}
.ts-icon.is-stubber-icon::before {
font-family: "IconsBrands";
content: "\e5c7";
}
.ts-icon.is-face-frown-open-icon::before {
content: "\f57a";
}
.ts-icon.is-code-fork-icon::before {
content: "\e13b";
}
.ts-icon.is-cow-icon::before {
content: "\f6c8";
}
.ts-icon.is-html5-icon::before {
font-family: "IconsBrands";
content: "\f13b";
}
.ts-icon.is-mitten-icon::before {
content: "\f7b5";
}
.ts-icon.is-panorama-icon::before {
content: "\e209";
}
.ts-icon.is-signature-icon::before {
content: "\f5b7";
}
.ts-icon.is-square-caret-up-icon::before {
content: "\f151";
}
.ts-icon.is-bacteria-icon::before {
content: "\e059";
}
.ts-icon.is-t-icon::before {
content: "\54";
}
.ts-icon.is-circle-xmark-icon::before {
content: "\f057";
}
.ts-icon.is-fax-icon::before {
content: "\f1ac";
}
.ts-icon.is-line-icon::before {
font-family: "IconsBrands";
content: "\f3c0";
}
.ts-icon.is-magnet-icon::before {
content: "\f076";
}
.ts-icon.is-product-hunt-icon::before {
font-family: "IconsBrands";
content: "\f288";
}
.ts-icon.is-chess-queen-icon::before {
content: "\f445";
}
.ts-icon.is-glasses-icon::before {
content: "\f530";
}
.ts-icon.is-jet-fighter-up-icon::before {
content: "\e518";
}
.ts-icon.is-peace-icon::before {
content: "\f67c";
}
.ts-icon.is-square-person-confined-icon::before {
content: "\e577";
}
.ts-icon.is-telegram-icon::before {
font-family: "IconsBrands";
content: "\f2c6";
}
.ts-icon.is-tree-icon::before {
content: "\f1bb";
}
.ts-icon.is-file-invoice-icon::before {
content: "\f570";
}
.ts-icon.is-passport-icon::before {
content: "\f5ab";
}
.ts-icon.is-square-behance-icon::before {
font-family: "IconsBrands";
content: "\f1b5";
}
.ts-icon.is-tty-icon::before {
content: "\f1e4";
}
.ts-icon.is-keycdn-icon::before {
font-family: "IconsBrands";
content: "\f3ba";
}
.ts-icon.is-canadian-maple-leaf-icon::before {
font-family: "IconsBrands";
content: "\f785";
}
.ts-icon.is-face-grin-tongue-squint-icon::before {
content: "\f58a";
}
.ts-icon.is-mercury-icon::before {
content: "\f223";
}
.ts-icon.is-user-tag-icon::before {
content: "\f507";
}
.ts-icon.is-affiliatetheme-icon::before {
font-family: "IconsBrands";
content: "\f36b";
}
.ts-icon.is-pallet-icon::before {
content: "\f482";
}
.ts-icon.is-rug-icon::before {
content: "\e569";
}
.ts-icon.is-etsy-icon::before {
font-family: "IconsBrands";
content: "\f2d7";
}
.ts-icon.is-egg-icon::before {
content: "\f7fb";
}
.ts-icon.is-hands-icon::before {
content: "\f2a7";
}
.ts-icon.is-user-xmark-icon::before {
content: "\f235";
}
.ts-icon.is-yen-sign-icon::before {
content: "\f157";
}
.ts-icon.is-d-icon::before {
content: "\44";
}
.ts-icon.is-wikipedia-w-icon::before {
font-family: "IconsBrands";
content: "\f266";
}
.ts-icon.is-cc-visa-icon::before {
font-family: "IconsBrands";
content: "\f1f0";
}
.ts-icon.is-clock-icon::before {
content: "\f017";
}
.ts-icon.is-d-and-d-beyond-icon::before {
font-family: "IconsBrands";
content: "\f6ca";
}
.ts-icon.is-file-invoice-dollar-icon::before {
content: "\f571";
}
.ts-icon.is-radio-icon::before {
content: "\f8d7";
}
.ts-icon.is-registered-icon::before {
content: "\f25d";
}
.ts-icon.is-autoprefixer-icon::before {
font-family: "IconsBrands";
content: "\f41c";
}
.ts-icon.is-mug-hot-icon::before {
content: "\f7b6";
}
.ts-icon.is-internet-explorer-icon::before {
font-family: "IconsBrands";
content: "\f26b";
}
.ts-icon.is-file-circle-xmark-icon::before {
content: "\e5a1";
}
.ts-icon.is-ribbon-icon::before {
content: "\f4d6";
}
.ts-icon.is-square-facebook-icon::before {
font-family: "IconsBrands";
content: "\f082";
}
.ts-icon.is-stack-exchange-icon::before {
font-family: "IconsBrands";
content: "\f18d";
}
.ts-icon.is-ear-deaf-icon::before {
content: "\f2a4";
}
.ts-icon.is-play-icon::before {
content: "\f04b";
}
.ts-icon.is-circle-dot-icon::before {
content: "\f192";
}
.ts-icon.is-reply-all-icon::before {
content: "\f122";
}
.ts-icon.is-school-circle-exclamation-icon::before {
content: "\e56c";
}
.ts-icon.is-arrows-split-up-and-left-icon::before {
content: "\e4bc";
}
.ts-icon.is-flipboard-icon::before {
font-family: "IconsBrands";
content: "\f44d";
}
.ts-icon.is-linkedin-icon::before {
font-family: "IconsBrands";
content: "\f08c";
}
.ts-icon.is-person-swimming-icon::before {
content: "\f5c4";
}
.ts-icon.is-u-icon::before {
content: "\55";
}
.ts-icon.is-eraser-icon::before {
content: "\f12d";
}
.ts-icon.is-draft2digital-icon::before {
font-family: "IconsBrands";
content: "\f396";
}
.ts-icon.is-head-side-virus-icon::before {
content: "\e064";
}
.ts-icon.is-intercom-icon::before {
font-family: "IconsBrands";
content: "\f7af";
}
.ts-icon.is-square-instagram-icon::before {
font-family: "IconsBrands";
content: "\e055";
}
.ts-icon.is-circle-exclamation-icon::before {
content: "\f06a";
}
.ts-icon.is-hospital-user-icon::before {
content: "\f80d";
}
.ts-icon.is-hubspot-icon::before {
font-family: "IconsBrands";
content: "\f3b2";
}
.ts-icon.is-toolbox-icon::before {
content: "\f552";
}
.ts-icon.is-file-circle-minus-icon::before {
content: "\e4ed";
}
.ts-icon.is-mars-stroke-icon::before {
content: "\f229";
}
.ts-icon.is-mobile-retro-icon::before {
content: "\e527";
}
.ts-icon.is-square-icon::before {
content: "\f0c8";
}
.ts-icon.is-vimeo-icon::before {
font-family: "IconsBrands";
content: "\f40a";
}
.ts-icon.is-battery-quarter-icon::before {
content: "\f243";
}
.ts-icon.is-square-pen-icon::before {
content: "\f14b";
}
.ts-icon.is-chart-pie-icon::before {
content: "\f200";
}
.ts-icon.is-headphones-simple-icon::before {
content: "\f58f";
}
.ts-icon.is-elementor-icon::before {
font-family: "IconsBrands";
content: "\f430";
}
.ts-icon.is-jet-fighter-icon::before {
content: "\f0fb";
}
.ts-icon.is-wand-sparkles-icon::before {
content: "\f72b";
}
.ts-icon.is-digital-ocean-icon::before {
font-family: "IconsBrands";
content: "\f391";
}
.ts-icon.is-bell-slash-icon::before {
content: "\f1f6";
}
.ts-icon.is-creative-commons-sa-icon::before {
font-family: "IconsBrands";
content: "\f4ef";
}
.ts-icon.is-database-icon::before {
content: "\f1c0";
}
.ts-icon.is-paint-roller-icon::before {
content: "\f5aa";
}
.ts-icon.is-poo-storm-icon::before {
content: "\f75a";
}
.ts-icon.is-arrow-up-right-dots-icon::before {
content: "\e4b7";
}
.ts-icon.is-fingerprint-icon::before {
content: "\f577";
}
.ts-icon.is-forward-icon::before {
content: "\f04e";
}
.ts-icon.is-plane-icon::before {
content: "\f072";
}
.ts-icon.is-face-grin-tongue-icon::before {
content: "\f589";
}
.ts-icon.is-uikit-icon::before {
font-family: "IconsBrands";
content: "\f403";
}
.ts-icon.is-artstation-icon::before {
font-family: "IconsBrands";
content: "\f77a";
}
.ts-icon.is-zhihu-icon::before {
font-family: "IconsBrands";
content: "\f63f";
}
.ts-icon.is-firstdraft-icon::before {
font-family: "IconsBrands";
content: "\f3a1";
}
.ts-icon.is-cubes-icon::before {
content: "\f1b3";
}
.ts-icon.is-buysellads-icon::before {
font-family: "IconsBrands";
content: "\f20d";
}
.ts-icon.is-code-merge-icon::before {
content: "\f387";
}
.ts-icon.is-magnifying-glass-minus-icon::before {
content: "\f010";
}
.ts-icon.is-money-check-dollar-icon::before {
content: "\f53d";
}
.ts-icon.is-arrow-down-short-wide-icon::before {
content: "\f884";
}
.ts-icon.is-unlock-icon::before {
content: "\f09c";
}
.ts-icon.is-wodu-icon::before {
font-family: "IconsBrands";
content: "\e088";
}
.ts-icon.is-y-combinator-icon::before {
font-family: "IconsBrands";
content: "\f23b";
}
.ts-icon.is-person-pregnant-icon::before {
content: "\e31e";
}
.ts-icon.is-bangladeshi-taka-sign-icon::before {
content: "\e2e6";
}
.ts-icon.is-hand-fist-icon::before {
content: "\f6de";
}
.ts-icon.is-highlighter-icon::before {
content: "\f591";
}
.ts-icon.is-walkie-talkie-icon::before {
content: "\f8ef";
}
.ts-icon.is-arrow-down-wide-short-icon::before {
content: "\f160";
}
.ts-icon.is-spray-can-sparkles-icon::before {
content: "\f5d0";
}
.ts-icon.is-toggle-on-icon::before {
content: "\f205";
}
.ts-icon.is-user-group-icon::before {
content: "\f500";
}
.ts-icon.is-school-circle-xmark-icon::before {
content: "\e56d";
}
.ts-icon.is-circle-chevron-down-icon::before {
content: "\f13a";
}
.ts-icon.is-location-pin-lock-icon::before {
content: "\e51f";
}
.ts-icon.is-money-bill-transfer-icon::before {
content: "\e528";
}
.ts-icon.is-phone-icon::before {
content: "\f095";
}
.ts-icon.is-arrow-down-9-1-icon::before {
content: "\f886";
}
.ts-icon.is-creative-commons-pd-alt-icon::before {
font-family: "IconsBrands";
content: "\f4ed";
}
.ts-icon.is-file-powerpoint-icon::before {
content: "\f1c4";
}
.ts-icon.is-cloud-bolt-icon::before {
content: "\f76c";
}
.ts-icon.is-indian-rupee-sign-icon::before {
content: "\e1bc";
}
.ts-icon.is-buromobelexperte-icon::before {
font-family: "IconsBrands";
content: "\f37f";
}
.ts-icon.is-gripfire-icon::before {
font-family: "IconsBrands";
content: "\f3ac";
}
.ts-icon.is-instalod-icon::before {
font-family: "IconsBrands";
content: "\e081";
}
.ts-icon.is-mix-icon::before {
font-family: "IconsBrands";
content: "\f3cb";
}
.ts-icon.is-phone-flip-icon::before {
content: "\f879";
}
.ts-icon.is-circle-chevron-left-icon::before {
content: "\f137";
}
.ts-icon.is-star-of-david-icon::before {
content: "\f69a";
}
.ts-icon.is-viber-icon::before {
font-family: "IconsBrands";
content: "\f409";
}
.ts-icon.is-wifi-icon::before {
content: "\f1eb";
}
.ts-icon.is-bridge-circle-check-icon::before {
content: "\e4c9";
}
.ts-icon.is-tumblr-icon::before {
font-family: "IconsBrands";
content: "\f173";
}
.ts-icon.is-bolt-icon::before {
content: "\f0e7";
}
.ts-icon.is-shower-icon::before {
content: "\f2cc";
}
.ts-icon.is-sticker-mule-icon::before {
font-family: "IconsBrands";
content: "\f3f7";
}
.ts-icon.is-wand-magic-icon::before {
content: "\f0d0";
}
.ts-icon.is-yandex-international-icon::before {
font-family: "IconsBrands";
content: "\f414";
}
.ts-icon.is-message-icon::before {
content: "\f27a";
}
.ts-icon.is-fire-flame-curved-icon::before {
content: "\f7e4";
}
.ts-icon.is-phoenix-framework-icon::before {
font-family: "IconsBrands";
content: "\f3dc";
}
.ts-icon.is-right-long-icon::before {
content: "\f30b";
}
.ts-icon.is-face-tired-icon::before {
content: "\f5c8";
}
.ts-icon.is-people-robbery-icon::before {
content: "\e536";
}
.ts-icon.is-scroll-torah-icon::before {
content: "\f6a0";
}
.ts-icon.is-spotify-icon::before {
font-family: "IconsBrands";
content: "\f1bc";
}
.ts-icon.is-house-chimney-icon::before {
content: "\e3af";
}
.ts-icon.is-hotdog-icon::before {
content: "\f80f";
}
.ts-icon.is-person-half-dress-icon::before {
content: "\e548";
}
.ts-icon.is-reply-icon::before {
content: "\f3e5";
}
.ts-icon.is-at-icon::before {
content: "\40";
}
.ts-icon.is-marker-icon::before {
content: "\f5a1";
}
.ts-icon.is-square-github-icon::before {
font-family: "IconsBrands";
content: "\f092";
}
.ts-icon.is-z-icon::before {
content: "\5a";
}
.ts-icon.is-angellist-icon::before {
font-family: "IconsBrands";
content: "\f209";
}
.ts-icon.is-sink-icon::before {
content: "\e06d";
}
.ts-icon.is-square-reddit-icon::before {
font-family: "IconsBrands";
content: "\f1a2";
}
.ts-icon.is-truck-field-icon::before {
content: "\e58d";
}
.ts-icon.is-wheat-awn-icon::before {
content: "\e2cd";
}
.ts-icon.is-lightbulb-icon::before {
content: "\f0eb";
}
.ts-icon.is-eye-dropper-icon::before {
content: "\f1fb";
}
.ts-icon.is-bezier-curve-icon::before {
content: "\f55b";
}
.ts-icon.is-flag-checkered-icon::before {
content: "\f11e";
}
.ts-icon.is-jsfiddle-icon::before {
font-family: "IconsBrands";
content: "\f1cc";
}
.ts-icon.is-om-icon::before {
content: "\f679";
}
.ts-icon.is-torii-gate-icon::before {
content: "\f6a1";
}
.ts-icon.is-edge-legacy-icon::before {
font-family: "IconsBrands";
content: "\e078";
}
.ts-icon.is-train-subway-icon::before {
content: "\f239";
}
.ts-icon.is-hands-holding-circle-icon::before {
content: "\e4fb";
}
.ts-icon.is-grip-vertical-icon::before {
content: "\f58e";
}
.ts-icon.is-k-icon::before {
content: "\4b";
}
.ts-icon.is-taxi-icon::before {
content: "\f1ba";
}
.ts-icon.is-android-icon::before {
font-family: "IconsBrands";
content: "\f17b";
}
.ts-icon.is-instagram-icon::before {
font-family: "IconsBrands";
content: "\f16d";
}
.ts-icon.is-person-hiking-icon::before {
content: "\f6ec";
}
.ts-icon.is-shapes-icon::before {
content: "\f61f";
}
.ts-icon.is-creative-commons-by-icon::before {
font-family: "IconsBrands";
content: "\f4e7";
}
.ts-icon.is-camera-icon::before {
content: "\f030";
}
.ts-icon.is-kickstarter-icon::before {
font-family: "IconsBrands";
content: "\f3bb";
}
.ts-icon.is-m-icon::before {
content: "\4d";
}
.ts-icon.is-maximize-icon::before {
content: "\f31e";
}
.ts-icon.is-building-lock-icon::before {
content: "\e4d6";
}
.ts-icon.is-magnifying-glass-dollar-icon::before {
content: "\f688";
}
.ts-icon.is-compass-icon::before {
content: "\f14e";
}
.ts-icon.is-cc-stripe-icon::before {
font-family: "IconsBrands";
content: "\f1f5";
}
.ts-icon.is-edge-icon::before {
font-family: "IconsBrands";
content: "\f282";
}
.ts-icon.is-jira-icon::before {
font-family: "IconsBrands";
content: "\f7b1";
}
.ts-icon.is-tv-icon::before {
content: "\f26c";
}
.ts-icon.is-beer-mug-empty-icon::before {
content: "\f0fc";
}
.ts-icon.is-square-xmark-icon::before {
content: "\f2d3";
}
.ts-icon.is-tent-arrow-left-right-icon::before {
content: "\e57f";
}
.ts-icon.is-x-twitter-icon::before {
font-family: "IconsBrands";
content: "\e61b";
}
.ts-icon.is-plane-slash-icon::before {
content: "\e069";
}
.ts-icon.is-bottle-droplet-icon::before {
content: "\e4c4";
}
.ts-icon.is-face-laugh-icon::before {
content: "\f599";
}
.ts-icon.is-n-icon::before {
content: "\4e";
}
.ts-icon.is-tents-icon::before {
content: "\e582";
}
.ts-icon.is-b-icon::before {
content: "\42";
}
.ts-icon.is-face-grin-squint-tears-icon::before {
content: "\f586";
}
.ts-icon.is-stripe-icon::before {
font-family: "IconsBrands";
content: "\f429";
}
.ts-icon.is-diagram-project-icon::before {
content: "\f542";
}
.ts-icon.is-chromecast-icon::before {
font-family: "IconsBrands";
content: "\f838";
}
.ts-icon.is-delete-left-icon::before {
content: "\f55a";
}
.ts-icon.is-mask-ventilator-icon::before {
content: "\e524";
}
.ts-icon.is-p-icon::before {
content: "\50";
}
.ts-icon.is-schlix-icon::before {
font-family: "IconsBrands";
content: "\f3ea";
}
.ts-icon.is-sim-card-icon::before {
content: "\f7c4";
}
.ts-icon.is-bitcoin-sign-icon::before {
content: "\e0b4";
}
.ts-icon.is-microphone-lines-slash-icon::before {
content: "\f539";
}
.ts-icon.is-swift-icon::before {
font-family: "IconsBrands";
content: "\f8e1";
}
.ts-icon.is-ebay-icon::before {
font-family: "IconsBrands";
content: "\f4f4";
}
.ts-icon.is-glass-water-icon::before {
content: "\e4f4";
}
.ts-icon.is-opencart-icon::before {
font-family: "IconsBrands";
content: "\f23d";
}
.ts-icon.is-power-off-icon::before {
content: "\f011";
}
.ts-icon.is-first-order-alt-icon::before {
font-family: "IconsBrands";
content: "\f50a";
}
.ts-icon.is-house-chimney-user-icon::before {
content: "\e065";
}
.ts-icon.is-simplybuilt-icon::before {
font-family: "IconsBrands";
content: "\f215";
}
.ts-icon.is-star-of-life-icon::before {
content: "\f621";
}
.ts-icon.is-bowling-ball-icon::before {
content: "\f436";
}
.ts-icon.is-chess-king-icon::before {
content: "\f43f";
}
.ts-icon.is-circle-minus-icon::before {
content: "\f056";
}
.ts-icon.is-turn-up-icon::before {
content: "\f3bf";
}
.ts-icon.is-arrow-up-from-ground-water-icon::before {
content: "\e4b5";
}
.ts-icon.is-shopware-icon::before {
font-family: "IconsBrands";
content: "\f5b5";
}
.ts-icon.is-jedi-order-icon::before {
font-family: "IconsBrands";
content: "\f50e";
}
.ts-icon.is-hill-rockslide-icon::before {
content: "\e508";
}
.ts-icon.is-dumpster-icon::before {
content: "\f793";
}
.ts-icon.is-creative-commons-sampling-plus-icon::before {
font-family: "IconsBrands";
content: "\f4f1";
}
.ts-icon.is-joget-icon::before {
font-family: "IconsBrands";
content: "\f3b7";
}
.ts-icon.is-markdown-icon::before {
font-family: "IconsBrands";
content: "\f60f";
}
.ts-icon.is-repeat-icon::before {
content: "\f363";
}
.ts-icon.is-grav-icon::before {
font-family: "IconsBrands";
content: "\f2d6";
}
.ts-icon.is-freebsd-icon::before {
font-family: "IconsBrands";
content: "\f3a4";
}
.ts-icon.is-heart-circle-plus-icon::before {
content: "\e500";
}
.ts-icon.is-retweet-icon::before {
content: "\f079";
}
.ts-icon.is-anchor-icon::before {
content: "\f13d";
}
.ts-icon.is-face-laugh-beam-icon::before {
content: "\f59a";
}
.ts-icon.is-sort-up-icon::before {
content: "\f0de";
}
.ts-icon.is-user-minus-icon::before {
content: "\f503";
}
.ts-icon.is-diagram-predecessor-icon::before {
content: "\e477";
}
.ts-icon.is-align-right-icon::before {
content: "\f038";
}
.ts-icon.is-child-combatant-icon::before {
content: "\e4e0";
}
.ts-icon.is-discord-icon::before {
font-family: "IconsBrands";
content: "\f392";
}
.ts-icon.is-landmark-icon::before {
content: "\f66f";
}
.ts-icon.is-paragraph-icon::before {
content: "\f1dd";
}
.ts-icon.is-rocket-icon::before {
content: "\f135";
}
.ts-icon.is-train-tram-icon::before {
content: "\e5b4";
}
.ts-icon.is-adversal-icon::before {
font-family: "IconsBrands";
content: "\f36a";
}
.ts-icon.is-memory-icon::before {
content: "\f538";
}
.ts-icon.is-person-cane-icon::before {
content: "\e53c";
}
.ts-icon.is-check-icon::before {
content: "\f00c";
}
.ts-icon.is-file-prescription-icon::before {
content: "\f572";
}
.ts-icon.is-arrow-right-icon::before {
content: "\f061";
}
.ts-icon.is-comment-dots-icon::before {
content: "\f4ad";
}
.ts-icon.is-filter-icon::before {
content: "\f0b0";
}
.ts-icon.is-head-side-cough-slash-icon::before {
content: "\e062";
}
.ts-icon.is-hockey-puck-icon::before {
content: "\f453";
}
.ts-icon.is-rupiah-sign-icon::before {
content: "\e23d";
}
.ts-icon.is-trophy-icon::before {
content: "\f091";
}
.ts-icon.is-circle-radiation-icon::before {
content: "\f7ba";
}
.ts-icon.is-basketball-icon::before {
content: "\f434";
}
.ts-icon.is-file-circle-question-icon::before {
content: "\e4ef";
}
.ts-icon.is-oil-well-icon::before {
content: "\e532";
}
.ts-icon.is-arrow-trend-up-icon::before {
content: "\e098";
}
.ts-icon.is-bus-icon::before {
content: "\f207";
}
.ts-icon.is-e-icon::before {
content: "\45";
}
.ts-icon.is-gg-circle-icon::before {
font-family: "IconsBrands";
content: "\f261";
}
.ts-icon.is-kitchen-set-icon::before {
content: "\e51a";
}
.ts-icon.is-bowl-food-icon::before {
content: "\e4c6";
}
.ts-icon.is-i-icon::before {
content: "\49";
}
.ts-icon.is-studiovinari-icon::before {
font-family: "IconsBrands";
content: "\f3f8";
}
.ts-icon.is-toilet-portable-icon::before {
content: "\e583";
}
.ts-icon.is-users-rectangle-icon::before {
content: "\e594";
}
.ts-icon.is-connectdevelop-icon::before {
font-family: "IconsBrands";
content: "\f20e";
}
.ts-icon.is-minus-icon::before {
content: "\f068";
}
.ts-icon.is-mixcloud-icon::before {
font-family: "IconsBrands";
content: "\f289";
}
.ts-icon.is-image-icon::before {
content: "\f03e";
}
.ts-icon.is-folder-plus-icon::before {
content: "\f65e";
}
.ts-icon.is-qrcode-icon::before {
content: "\f029";
}
.ts-icon.is-school-icon::before {
content: "\f549";
}
.ts-icon.is-untappd-icon::before {
font-family: "IconsBrands";
content: "\f405";
}
.ts-icon.is-diaspora-icon::before {
font-family: "IconsBrands";
content: "\f791";
}
.ts-icon.is-meetup-icon::before {
font-family: "IconsBrands";
content: "\f2e0";
}
.ts-icon.is-dev-icon::before {
font-family: "IconsBrands";
content: "\f6cc";
}
.ts-icon.is-face-kiss-beam-icon::before {
content: "\f597";
}
.ts-icon.is-file-audio-icon::before {
content: "\f1c7";
}
.ts-icon.is-ruler-icon::before {
content: "\f545";
}
.ts-icon.is-video-icon::before {
content: "\f03d";
}
.ts-icon.is-crosshairs-icon::before {
content: "\f05b";
}
.ts-icon.is-hand-lizard-icon::before {
content: "\f258";
}
.ts-icon.is-house-lock-icon::before {
content: "\e510";
}
.ts-icon.is-napster-icon::before {
font-family: "IconsBrands";
content: "\f3d2";
}
.ts-icon.is-envelope-circle-check-icon::before {
content: "\e4e8";
}
.ts-icon.is-square-twitter-icon::before {
font-family: "IconsBrands";
content: "\f081";
}
.ts-icon.is-font-awesome-icon::before {
content: "\f2b4";
}
.ts-icon.is-circle-up-icon::before {
content: "\f35b";
}
.ts-icon.is-podcast-icon::before {
content: "\f2ce";
}
.ts-icon.is-weight-scale-icon::before {
content: "\f496";
}
.ts-icon.is-book-open-icon::before {
content: "\f518";
}
.ts-icon.is-servicestack-icon::before {
font-family: "IconsBrands";
content: "\f3ec";
}
.ts-icon.is-share-nodes-icon::before {
content: "\f1e0";
}
.ts-icon.is-traffic-light-icon::before {
content: "\f637";
}
.ts-icon.is-plug-circle-xmark-icon::before {
content: "\e560";
}
.ts-icon.is-photo-film-icon::before {
content: "\f87c";
}
.ts-icon.is-watchman-monitoring-icon::before {
font-family: "IconsBrands";
content: "\e087";
}
.ts-icon.is-ideal-icon::before {
font-family: "IconsBrands";
content: "\e013";
}
.ts-icon.is-kaaba-icon::before {
content: "\f66b";
}
.ts-icon.is-gifts-icon::before {
content: "\f79c";
}
.ts-icon.is-palette-icon::before {
content: "\f53f";
}
.ts-icon.is-underline-icon::before {
content: "\f0cd";
}
.ts-icon.is-cart-arrow-down-icon::before {
content: "\f218";
}
.ts-icon.is-comment-slash-icon::before {
content: "\f4b3";
}
.ts-icon.is-forward-fast-icon::before {
content: "\f050";
}
.ts-icon.is-heart-crack-icon::before {
content: "\f7a9";
}
.ts-icon.is-cart-plus-icon::before {
content: "\f217";
}
.ts-icon.is-locust-icon::before {
content: "\e520";
}
.ts-icon.is-flag-icon::before {
content: "\f024";
}
.ts-icon.is-bucket-icon::before {
content: "\e4cf";
}
.ts-icon.is-goodreads-icon::before {
font-family: "IconsBrands";
content: "\f3a8";
}
.ts-icon.is-mobile-screen-button-icon::before {
content: "\f3cd";
}
.ts-icon.is-reddit-icon::before {
font-family: "IconsBrands";
content: "\f1a1";
}
.ts-icon.is-temperature-half-icon::before {
content: "\f2c9";
}
.ts-icon.is-3-icon::before {
content: "\33";
}
.ts-icon.is-chart-column-icon::before {
content: "\e0e3";
}
.ts-icon.is-anchor-circle-xmark-icon::before {
content: "\e4ac";
}
.ts-icon.is-anchor-circle-check-icon::before {
content: "\e4aa";
}
.ts-icon.is-hand-holding-dollar-icon::before {
content: "\f4c0";
}
.ts-icon.is-sack-dollar-icon::before {
content: "\f81d";
}
.ts-icon.is-utensils-icon::before {
content: "\f2e7";
}
.ts-icon.is-align-justify-icon::before {
content: "\f039";
}
.ts-icon.is-weixin-icon::before {
font-family: "IconsBrands";
content: "\f1d7";
}
.ts-icon.is-terminal-icon::before {
content: "\f120";
}
.ts-icon.is-bell-icon::before {
content: "\f0f3";
}
.ts-icon.is-cc-paypal-icon::before {
font-family: "IconsBrands";
content: "\f1f4";
}
.ts-icon.is-hand-point-right-icon::before {
content: "\f0a4";
}
.ts-icon.is-salesforce-icon::before {
font-family: "IconsBrands";
content: "\f83b";
}
.ts-icon.is-steam-symbol-icon::before {
font-family: "IconsBrands";
content: "\f3f6";
}
.ts-icon.is-baseball-icon::before {
content: "\f433";
}
.ts-icon.is-cc-mastercard-icon::before {
font-family: "IconsBrands";
content: "\f1f1";
}
.ts-icon.is-mars-icon::before {
content: "\f222";
}
.ts-icon.is-money-bill-1-wave-icon::before {
content: "\f53b";
}
.ts-icon.is-trailer-icon::before {
content: "\e041";
}
.ts-icon.is-brush-icon::before {
content: "\f55d";
}
.ts-icon.is-qq-icon::before {
font-family: "IconsBrands";
content: "\f1d6";
}
.ts-icon.is-gear-icon::before {
content: "\f013";
}
.ts-icon.is-users-between-lines-icon::before {
content: "\e591";
}
.ts-icon.is-unity-icon::before {
font-family: "IconsBrands";
content: "\e049";
}
.ts-icon.is-usps-icon::before {
font-family: "IconsBrands";
content: "\f7e1";
}
.ts-icon.is-bullseye-icon::before {
content: "\f140";
}
.ts-icon.is-headphones-icon::before {
content: "\f025";
}
.ts-icon.is-person-circle-exclamation-icon::before {
content: "\e53f";
}
.ts-icon.is-cc-diners-club-icon::before {
font-family: "IconsBrands";
content: "\f24c";
}
.ts-icon.is-file-code-icon::before {
content: "\f1c9";
}
.ts-icon.is-filter-circle-dollar-icon::before {
content: "\f662";
}
.ts-icon.is-face-smile-beam-icon::before {
content: "\f5b8";
}
.ts-icon.is-earth-asia-icon::before {
content: "\f57e";
}
.ts-icon.is-italic-icon::before {
content: "\f033";
}
.ts-icon.is-person-drowning-icon::before {
content: "\e545";
}
.ts-icon.is-square-h-icon::before {
content: "\f0fd";
}
.ts-icon.is-umbrella-icon::before {
content: "\f0e9";
}
.ts-icon.is-bridge-water-icon::before {
content: "\e4ce";
}
.ts-icon.is-free-code-camp-icon::before {
font-family: "IconsBrands";
content: "\f2c5";
}
.ts-icon.is-git-alt-icon::before {
font-family: "IconsBrands";
content: "\f841";
}
.ts-icon.is-opera-icon::before {
font-family: "IconsBrands";
content: "\f26a";
}
.ts-icon.is-warehouse-icon::before {
content: "\f494";
}
.ts-icon.is-cc-amazon-pay-icon::before {
font-family: "IconsBrands";
content: "\f42d";
}
.ts-icon.is-car-tunnel-icon::before {
content: "\e4de";
}
.ts-icon.is-cc-amex-icon::before {
font-family: "IconsBrands";
content: "\f1f3";
}
.ts-icon.is-github-alt-icon::before {
font-family: "IconsBrands";
content: "\f113";
}
.ts-icon.is-users-icon::before {
content: "\f0c0";
}
.ts-icon.is-volume-high-icon::before {
content: "\f028";
}
.ts-icon.is-blender-phone-icon::before {
content: "\f6b6";
}
.ts-icon.is-building-circle-exclamation-icon::before {
content: "\e4d3";
}
.ts-icon.is-gauge-icon::before {
content: "\f624";
}
.ts-icon.is-less-than-icon::before {
content: "\3c";
}
.ts-icon.is-list-check-icon::before {
content: "\f0ae";
}
.ts-icon.is-pump-medical-icon::before {
content: "\e06a";
}
.ts-icon.is-up-right-from-square-icon::before {
content: "\f35d";
}
.ts-icon.is-bong-icon::before {
content: "\f55c";
}
.ts-icon.is-diamond-icon::before {
content: "\f219";
}
.ts-icon.is-masks-theater-icon::before {
content: "\f630";
}
.ts-icon.is-print-icon::before {
content: "\f02f";
}
.ts-icon.is-calendar-days-icon::before {
content: "\f073";
}
.ts-icon.is-creative-commons-zero-icon::before {
font-family: "IconsBrands";
content: "\f4f3";
}
.ts-icon.is-group-arrows-rotate-icon::before {
content: "\e4f6";
}
.ts-icon.is-money-bill-wheat-icon::before {
content: "\e52a";
}
.ts-icon.is-store-slash-icon::before {
content: "\e071";
}
.ts-icon.is-chart-gantt-icon::before {
content: "\e0e4";
}
.ts-icon.is-ethereum-icon::before {
font-family: "IconsBrands";
content: "\f42e";
}
.ts-icon.is-fill-icon::before {
content: "\f575";
}
.ts-icon.is-arrow-right-arrow-left-icon::before {
content: "\f0ec";
}
.ts-icon.is-arrow-down-long-icon::before {
content: "\f175";
}
.ts-icon.is-buy-n-large-icon::before {
font-family: "IconsBrands";
content: "\f8a6";
}
.ts-icon.is-dhl-icon::before {
font-family: "IconsBrands";
content: "\f790";
}
.ts-icon.is-dropbox-icon::before {
font-family: "IconsBrands";
content: "\f16b";
}
.ts-icon.is-itunes-note-icon::before {
font-family: "IconsBrands";
content: "\f3b5";
}
.ts-icon.is-apper-icon::before {
font-family: "IconsBrands";
content: "\f371";
}
.ts-icon.is-sitemap-icon::before {
content: "\f0e8";
}
.ts-icon.is-burger-icon::before {
content: "\f805";
}
.ts-icon.is-spray-can-icon::before {
content: "\f5bd";
}
.ts-icon.is-clipboard-user-icon::before {
content: "\f7f3";
}
.ts-icon.is-golang-icon::before {
font-family: "IconsBrands";
content: "\e40f";
}
.ts-icon.is-temperature-low-icon::before {
content: "\f76b";
}
.ts-icon.is-whatsapp-icon::before {
font-family: "IconsBrands";
content: "\f232";
}
.ts-icon.is-person-skating-icon::before {
content: "\f7c5";
}
.ts-icon.is-sailboat-icon::before {
content: "\e445";
}
.ts-icon.is-vk-icon::before {
font-family: "IconsBrands";
content: "\f189";
}
.ts-icon.is-plus-minus-icon::before {
content: "\e43c";
}
.ts-icon.is-arrow-up-from-water-pump-icon::before {
content: "\e4b6";
}
.ts-icon.is-arrow-up-a-z-icon::before {
content: "\f15e";
}
.ts-icon.is-app-store-ios-icon::before {
font-family: "IconsBrands";
content: "\f370";
}
.ts-icon.is-house-flood-water-icon::before {
content: "\e50e";
}
.ts-icon.is-right-left-icon::before {
content: "\f362";
}
.ts-icon.is-x-ray-icon::before {
content: "\f497";
}
.ts-icon.is-angular-icon::before {
font-family: "IconsBrands";
content: "\f420";
}
.ts-icon.is-cloud-sun-icon::before {
content: "\f6c4";
}
.ts-icon.is-heart-circle-minus-icon::before {
content: "\e4ff";
}
.ts-icon.is-less-than-equal-icon::before {
content: "\f537";
}
.ts-icon.is-poo-icon::before {
content: "\f2fe";
}
.ts-icon.is-arrows-up-down-left-right-icon::before {
content: "\f047";
}
.ts-icon.is-key-icon::before {
content: "\f084";
}
.ts-icon.is-npm-icon::before {
font-family: "IconsBrands";
content: "\f3d4";
}
.ts-icon.is-table-cells-icon::before {
content: "\f00a";
}
.ts-icon.is-truck-field-un-icon::before {
content: "\e58e";
}
.ts-icon.is-waze-icon::before {
font-family: "IconsBrands";
content: "\f83f";
}
.ts-icon.is-barcode-icon::before {
content: "\f02a";
}
.ts-icon.is-cannabis-icon::before {
content: "\f55f";
}
.ts-icon.is-horse-head-icon::before {
content: "\f7ab";
}
.ts-icon.is-unlock-keyhole-icon::before {
content: "\f13e";
}
.ts-icon.is-book-journal-whills-icon::before {
content: "\f66a";
}
.ts-icon.is-jar-icon::before {
content: "\e516";
}
.ts-icon.is-mug-saucer-icon::before {
content: "\f0f4";
}
.ts-icon.is-square-caret-down-icon::before {
content: "\f150";
}
.ts-icon.is-head-side-cough-icon::before {
content: "\e061";
}
.ts-icon.is-bore-hole-icon::before {
content: "\e4c3";
}
.ts-icon.is-magnifying-glass-chart-icon::before {
content: "\e522";
}
.ts-icon.is-sun-plant-wilt-icon::before {
content: "\e57a";
}
.ts-icon.is-address-card-icon::before {
content: "\f2bb";
}
.ts-icon.is-file-waveform-icon::before {
content: "\f478";
}
.ts-icon.is-venus-icon::before {
content: "\f221";
}
.ts-icon.is-map-location-dot-icon::before {
content: "\f5a0";
}
.ts-icon.is-cc-apple-pay-icon::before {
font-family: "IconsBrands";
content: "\f416";
}
.ts-icon.is-stapler-icon::before {
content: "\e5af";
}
.ts-icon.is-arrow-pointer-icon::before {
content: "\f245";
}
.ts-icon.is-react-icon::before {
font-family: "IconsBrands";
content: "\f41b";
}
.ts-icon.is-users-rays-icon::before {
content: "\e593";
}
.ts-icon.is-magento-icon::before {
font-family: "IconsBrands";
content: "\f3c4";
}
.ts-icon.is-file-arrow-up-icon::before {
content: "\f574";
}
.ts-icon.is-fish-icon::before {
content: "\f578";
}
.ts-icon.is-indent-icon::before {
content: "\f03c";
}
.ts-icon.is-school-circle-check-icon::before {
content: "\e56b";
}
.ts-icon.is-bilibili-icon::before {
font-family: "IconsBrands";
content: "\e3d9";
}
.ts-icon.is-broom-ball-icon::before {
content: "\f458";
}
.ts-icon.is-speakap-icon::before {
font-family: "IconsBrands";
content: "\f3f3";
}
.ts-icon.is-arrow-down-up-across-line-icon::before {
content: "\e4af";
}
.ts-icon.is-wordpress-icon::before {
font-family: "IconsBrands";
content: "\f19a";
}
.ts-icon.is-ear-listen-icon::before {
content: "\f2a2";
}
.ts-icon.is-kiwi-bird-icon::before {
content: "\f535";
}
.ts-icon.is-reddit-alien-icon::before {
font-family: "IconsBrands";
content: "\f281";
}
.ts-icon.is-ship-icon::before {
content: "\f21a";
}
.ts-icon.is-clock-rotate-left-icon::before {
content: "\f1da";
}
.ts-icon.is-desktop-icon::before {
content: "\f390";
}
.ts-icon.is-motorcycle-icon::before {
content: "\f21c";
}
.ts-icon.is-wave-square-icon::before {
content: "\f83e";
}
.ts-icon.is-circle-half-stroke-icon::before {
content: "\f042";
}
.ts-icon.is-fish-fins-icon::before {
content: "\e4f2";
}
.ts-icon.is-patreon-icon::before {
font-family: "IconsBrands";
content: "\f3d9";
}
.ts-icon.is-quote-left-icon::before {
content: "\f10d";
}
.ts-icon.is-road-spikes-icon::before {
content: "\e568";
}
.ts-icon.is-scissors-icon::before {
content: "\f0c4";
}
.ts-icon.is-subscript-icon::before {
content: "\f12c";
}
.ts-icon.is-download-icon::before {
content: "\f019";
}
.ts-icon.is-mosquito-net-icon::before {
content: "\e52c";
}
.ts-icon.is-worm-icon::before {
content: "\e599";
}
.ts-icon.is-bug-icon::before {
content: "\f188";
}
.ts-icon.is-peseta-sign-icon::before {
content: "\e221";
}
.ts-icon.is-apple-pay-icon::before {
font-family: "IconsBrands";
content: "\f415";
}
.ts-icon.is-resolving-icon::before {
font-family: "IconsBrands";
content: "\f3e7";
}
.ts-icon.is-tachograph-digital-icon::before {
content: "\f566";
}
.ts-icon.is-windows-icon::before {
font-family: "IconsBrands";
content: "\f17a";
}
.ts-icon.is-language-icon::before {
content: "\f1ab";
}
.ts-icon.is-wpexplorer-icon::before {
font-family: "IconsBrands";
content: "\f2de";
}
.ts-icon.is-comments-icon::before {
content: "\f086";
}
.ts-icon.is-dolly-icon::before {
content: "\f472";
}
.ts-icon.is-square-poll-horizontal-icon::before {
content: "\f682";
}
.ts-icon.is-usb-icon::before {
font-family: "IconsBrands";
content: "\f287";
}
.ts-icon.is-building-icon::before {
content: "\f1ad";
}
.ts-icon.is-soap-icon::before {
content: "\e06e";
}
.ts-icon.is-square-tumblr-icon::before {
font-family: "IconsBrands";
content: "\f174";
}
.ts-icon.is-yammer-icon::before {
font-family: "IconsBrands";
content: "\f840";
}
.ts-icon.is-perbyte-icon::before {
font-family: "IconsBrands";
content: "\e083";
}
.ts-icon.is-temperature-arrow-up-icon::before {
content: "\e040";
}
.ts-icon.is-wine-bottle-icon::before {
content: "\f72f";
}
.ts-icon.is-snowplow-icon::before {
content: "\f7d2";
}
.ts-icon.is-tent-icon::before {
content: "\e57d";
}
.ts-icon.is-diagram-successor-icon::before {
content: "\e47a";
}
.ts-icon.is-bugs-icon::before {
content: "\e4d0";
}
.ts-icon.is-chevron-down-icon::before {
content: "\f078";
}
.ts-icon.is-door-closed-icon::before {
content: "\f52a";
}
.ts-icon.is-firefox-icon::before {
font-family: "IconsBrands";
content: "\f269";
}
.ts-icon.is-folder-closed-icon::before {
content: "\e185";
}
.ts-icon.is-j-icon::before {
content: "\4a";
}
.ts-icon.is-arrows-to-circle-icon::before {
content: "\e4bd";
}
.ts-icon.is-cross-icon::before {
content: "\f654";
}
.ts-icon.is-not-equal-icon::before {
content: "\f53e";
}
.ts-icon.is-cent-sign-icon::before {
content: "\e3f5";
}
.ts-icon.is-chess-pawn-icon::before {
content: "\f443";
}
.ts-icon.is-fan-icon::before {
content: "\f863";
}
.ts-icon.is-sith-icon::before {
font-family: "IconsBrands";
content: "\f512";
}
.ts-icon.is-stairs-icon::before {
content: "\e289";
}
.ts-icon.is-accessible-icon-icon::before {
font-family: "IconsBrands";
content: "\f368";
}
.ts-icon.is-google-icon::before {
font-family: "IconsBrands";
content: "\f1a0";
}
.ts-icon.is-user-ninja-icon::before {
content: "\f504";
}
.ts-icon.is-fly-icon::before {
font-family: "IconsBrands";
content: "\f417";
}
.ts-icon.is-cloud-showers-heavy-icon::before {
content: "\f740";
}
.ts-icon.is-x-icon::before {
content: "\58";
}
.ts-icon.is-certificate-icon::before {
content: "\f0a3";
}
.ts-icon.is-creative-commons-nd-icon::before {
font-family: "IconsBrands";
content: "\f4eb";
}
.ts-icon.is-evernote-icon::before {
font-family: "IconsBrands";
content: "\f839";
}
.ts-icon.is-flask-icon::before {
content: "\f0c3";
}
.ts-icon.is-hill-avalanche-icon::before {
content: "\e507";
}
.ts-icon.is-houzz-icon::before {
font-family: "IconsBrands";
content: "\f27c";
}
.ts-icon.is-money-check-icon::before {
content: "\f53c";
}
.ts-icon.is-circle-h-icon::before {
content: "\f47e";
}
.ts-icon.is-venus-mars-icon::before {
content: "\f228";
}
.ts-icon.is-gauge-simple-high-icon::before {
content: "\f62a";
}
.ts-icon.is-plane-lock-icon::before {
content: "\e558";
}
.ts-icon.is-square-lastfm-icon::before {
font-family: "IconsBrands";
content: "\f203";
}
.ts-icon.is-volume-off-icon::before {
content: "\f026";
}
.ts-icon.is-camera-rotate-icon::before {
content: "\e0d8";
}
.ts-icon.is-face-grin-tears-icon::before {
content: "\f588";
}
.ts-icon.is-rotate-right-icon::before {
content: "\f2f9";
}
.ts-icon.is-square-vimeo-icon::before {
font-family: "IconsBrands";
content: "\f194";
}
.ts-icon.is-mask-face-icon::before {
content: "\e1d7";
}
.ts-icon.is-behance-icon::before {
font-family: "IconsBrands";
content: "\f1b4";
}
.ts-icon.is-code-pull-request-icon::before {
content: "\e13c";
}
.ts-icon.is-laptop-icon::before {
content: "\f109";
}
.ts-icon.is-truck-front-icon::before {
content: "\e2b7";
}
.ts-icon.is-arrow-rotate-right-icon::before {
content: "\f01e";
}
.ts-icon.is-square-viadeo-icon::before {
font-family: "IconsBrands";
content: "\f2aa";
}
.ts-icon.is-arrow-up-long-icon::before {
content: "\f176";
}
.ts-icon.is-cookie-icon::before {
content: "\f563";
}
.ts-icon.is-earth-europe-icon::before {
content: "\f7a2";
}
.ts-icon.is-face-frown-icon::before {
content: "\f119";
}
.ts-icon.is-link-slash-icon::before {
content: "\f127";
}
.ts-icon.is-centercode-icon::before {
font-family: "IconsBrands";
content: "\f380";
}
.ts-icon.is-rupee-sign-icon::before {
content: "\f156";
}
.ts-icon.is-road-icon::before {
content: "\f018";
}
.ts-icon.is-diamond-turn-right-icon::before {
content: "\f5eb";
}
.ts-icon.is-rocketchat-icon::before {
font-family: "IconsBrands";
content: "\f3e8";
}
.ts-icon.is-user-gear-icon::before {
content: "\f4fe";
}
.ts-icon.is-vnv-icon::before {
font-family: "IconsBrands";
content: "\f40b";
}
.ts-icon.is-w-icon::before {
content: "\57";
}
.ts-icon.is-xbox-icon::before {
font-family: "IconsBrands";
content: "\f412";
}
.ts-icon.is-bluetooth-icon::before {
font-family: "IconsBrands";
content: "\f293";
}
.ts-icon.is-shirtsinbulk-icon::before {
font-family: "IconsBrands";
content: "\f214";
}
.ts-icon.is-square-js-icon::before {
font-family: "IconsBrands";
content: "\f3b9";
}
.ts-icon.is-circle-arrow-down-icon::before {
content: "\f0ab";
}
.ts-icon.is-superscript-icon::before {
content: "\f12b";
}
.ts-icon.is-squarespace-icon::before {
font-family: "IconsBrands";
content: "\f5be";
}
.ts-icon.is-trash-can-icon::before {
content: "\f2ed";
}
.ts-icon.is-house-circle-check-icon::before {
content: "\e509";
}
.ts-icon.is-cloudscale-icon::before {
font-family: "IconsBrands";
content: "\f383";
}
.ts-icon.is-notdef-icon::before {
content: "\e1fe";
}
.ts-icon.is-plug-circle-bolt-icon::before {
content: "\e55b";
}
.ts-icon.is-synagogue-icon::before {
content: "\f69b";
}
.ts-icon.is-ban-smoking-icon::before {
content: "\f54d";
}
.ts-icon.is-calculator-icon::before {
content: "\f1ec";
}
.ts-icon.is-ellipsis-icon::before {
content: "\f141";
}
.ts-icon.is-euro-sign-icon::before {
content: "\f153";
}
.ts-icon.is-hurricane-icon::before {
content: "\f751";
}
.ts-icon.is-bars-progress-icon::before {
content: "\f828";
}
.ts-icon.is-plane-circle-xmark-icon::before {
content: "\e557";
}
.ts-icon.is-plug-circle-check-icon::before {
content: "\e55c";
}
.ts-icon.is-sd-card-icon::before {
content: "\f7c2";
}
.ts-icon.is-charging-station-icon::before {
content: "\f5e7";
}
.ts-icon.is-heart-circle-bolt-icon::before {
content: "\e4fc";
}
.ts-icon.is-house-fire-icon::before {
content: "\e50c";
}
.ts-icon.is-caret-down-icon::before {
content: "\f0d7";
}
.ts-icon.is-book-atlas-icon::before {
content: "\f558";
}
.ts-icon.is-file-excel-icon::before {
content: "\f1c3";
}
.ts-icon.is-hand-back-fist-icon::before {
content: "\f255";
}
.ts-icon.is-leaf-icon::before {
content: "\f06c";
}
.ts-icon.is-swatchbook-icon::before {
content: "\f5c3";
}
.ts-icon.is-ups-icon::before {
font-family: "IconsBrands";
content: "\f7e0";
}
.ts-icon.is-boxes-packing-icon::before {
content: "\e4c7";
}
.ts-icon.is-viruses-icon::before {
content: "\e076";
}
.ts-icon.is-face-rolling-eyes-icon::before {
content: "\f5a5";
}
.ts-icon.is-sort-down-icon::before {
content: "\f0dd";
}
.ts-icon.is-thumbs-up-icon::before {
content: "\f164";
}
.ts-icon.is-trade-federation-icon::before {
font-family: "IconsBrands";
content: "\f513";
}
.ts-icon.is-whiskey-glass-icon::before {
content: "\f7a0";
}
.ts-icon.is-diagram-next-icon::before {
content: "\e476";
}
.ts-icon.is-door-open-icon::before {
content: "\f52b";
}
.ts-icon.is-flask-vial-icon::before {
content: "\e4f3";
}
.ts-icon.is-house-medical-circle-exclamation-icon::before {
content: "\e512";
}
.ts-icon.is-invision-icon::before {
font-family: "IconsBrands";
content: "\f7b0";
}
.ts-icon.is-bity-icon::before {
font-family: "IconsBrands";
content: "\f37a";
}
.ts-icon.is-hand-middle-finger-icon::before {
content: "\f806";
}
.ts-icon.is-pied-piper-hat-icon::before {
font-family: "IconsBrands";
content: "\f4e5";
}
.ts-icon.is-sleigh-icon::before {
content: "\f7cc";
}
.ts-icon.is-sourcetree-icon::before {
font-family: "IconsBrands";
content: "\f7d3";
}
.ts-icon.is-c-icon::before {
content: "\43";
}
.ts-icon.is-blog-icon::before {
content: "\f781";
}
.ts-icon.is-fire-burner-icon::before {
content: "\e4f1";
}
.ts-icon.is-helicopter-symbol-icon::before {
content: "\e502";
}
.ts-icon.is-helmet-safety-icon::before {
content: "\f807";
}
.ts-icon.is-tooth-icon::before {
content: "\f5c9";
}
.ts-icon.is-truck-droplet-icon::before {
content: "\e58c";
}
.ts-icon.is-wirsindhandwerk-icon::before {
font-family: "IconsBrands";
content: "\e2d0";
}
.ts-icon.is-delicious-icon::before {
font-family: "IconsBrands";
content: "\f1a5";
}
.ts-icon.is-person-circle-xmark-icon::before {
content: "\e543";
}
.ts-icon.is-square-minus-icon::before {
content: "\f146";
}
.ts-icon.is-tablet-icon::before {
content: "\f3fb";
}
.ts-icon.is-frog-icon::before {
content: "\f52e";
}
.ts-icon.is-glide-g-icon::before {
font-family: "IconsBrands";
content: "\f2a6";
}
.ts-icon.is-parachute-box-icon::before {
content: "\f4cd";
}
.ts-icon.is-franc-sign-icon::before {
content: "\e18f";
}
.ts-icon.is-mobile-button-icon::before {
content: "\f10b";
}
.ts-icon.is-bolt-lightning-icon::before {
content: "\e0b7";
}
.ts-icon.is-trash-arrow-up-icon::before {
content: "\f829";
}
.ts-icon.is-colon-sign-icon::before {
content: "\e140";
}
.ts-icon.is-left-right-icon::before {
content: "\f337";
}
.ts-icon.is-shopify-icon::before {
font-family: "IconsBrands";
content: "\e057";
}
.ts-icon.is-google-drive-icon::before {
font-family: "IconsBrands";
content: "\f3aa";
}
.ts-icon.is-dice-one-icon::before {
content: "\f525";
}
.ts-icon.is-helicopter-icon::before {
content: "\f533";
}
.ts-icon.is-clone-icon::before {
content: "\f24d";
}
.ts-icon.is-crow-icon::before {
content: "\f520";
}
.ts-icon.is-rev-icon::before {
font-family: "IconsBrands";
content: "\f5b2";
}
.ts-icon.is-church-icon::before {
content: "\f51d";
}
.ts-icon.is-dong-sign-icon::before {
content: "\e169";
}
.ts-icon.is-face-grin-wide-icon::before {
content: "\f581";
}
.ts-icon.is-person-military-to-person-icon::before {
content: "\e54c";
}
.ts-icon.is-square-pinterest-icon::before {
font-family: "IconsBrands";
content: "\f0d3";
}
.ts-icon.is-copy-icon::before {
content: "\f0c5";
}
.ts-icon.is-microscope-icon::before {
content: "\f610";
}
.ts-icon.is-octopus-deploy-icon::before {
font-family: "IconsBrands";
content: "\e082";
}
.ts-icon.is-shield-cat-icon::before {
content: "\e572";
}
.ts-icon.is-window-minimize-icon::before {
content: "\f2d1";
}
.ts-icon.is-contao-icon::before {
font-family: "IconsBrands";
content: "\f26d";
}
.ts-icon.is-hands-bound-icon::before {
content: "\e4f9";
}
.ts-icon.is-hard-drive-icon::before {
content: "\f0a0";
}
.ts-icon.is-list-ol-icon::before {
content: "\f0cb";
}
.ts-icon.is-megaport-icon::before {
font-family: "IconsBrands";
content: "\f5a3";
}
.ts-icon.is-sliders-icon::before {
content: "\f1de";
}
.ts-icon.is-video-slash-icon::before {
content: "\f4e2";
}
.ts-icon.is-wine-glass-empty-icon::before {
content: "\f5ce";
}
.ts-icon.is-battle-net-icon::before {
font-family: "IconsBrands";
content: "\f835";
}
.ts-icon.is-arrows-turn-to-dots-icon::before {
content: "\e4c1";
}
.ts-icon.is-building-un-icon::before {
content: "\e4d9";
}
.ts-icon.is-creative-commons-nc-eu-icon::before {
font-family: "IconsBrands";
content: "\f4e9";
}
.ts-icon.is-facebook-icon::before {
font-family: "IconsBrands";
content: "\f09a";
}
.ts-icon.is-temperature-high-icon::before {
content: "\f769";
}
.ts-icon.is-algolia-icon::before {
font-family: "IconsBrands";
content: "\f36c";
}
.ts-icon.is-paste-icon::before {
content: "\f0ea";
}
.ts-icon.is-pen-ruler-icon::before {
content: "\f5ae";
}
.ts-icon.is-snowman-icon::before {
content: "\f7d0";
}
.ts-icon.is-critical-role-icon::before {
font-family: "IconsBrands";
content: "\f6c9";
}
.ts-icon.is-ferry-icon::before {
content: "\e4ea";
}
.ts-icon.is-road-circle-exclamation-icon::before {
content: "\e565";
}
.ts-icon.is-user-slash-icon::before {
content: "\f506";
}
.ts-icon.is-codiepie-icon::before {
font-family: "IconsBrands";
content: "\f284";
}
.ts-icon.is-building-ngo-icon::before {
content: "\e4d7";
}
.ts-icon.is-creative-commons-remix-icon::before {
font-family: "IconsBrands";
content: "\f4ee";
}
.ts-icon.is-hand-point-left-icon::before {
content: "\f0a5";
}
.ts-icon.is-supple-icon::before {
font-family: "IconsBrands";
content: "\f3f9";
}
.ts-icon.is-tape-icon::before {
content: "\f4db";
}
.ts-icon.is-weibo-icon::before {
font-family: "IconsBrands";
content: "\f18a";
}
.ts-icon.is-wheelchair-icon::before {
content: "\f193";
}
.ts-icon.is-arrow-up-1-9-icon::before {
content: "\f163";
}
.ts-icon.is-person-falling-icon::before {
content: "\e546";
}
.ts-icon.is-solar-panel-icon::before {
content: "\f5ba";
}
.ts-icon.is-arrows-down-to-people-icon::before {
content: "\e4b9";
}
.ts-icon.is-arrows-up-to-line-icon::before {
content: "\e4c2";
}
.ts-icon.is-car-burst-icon::before {
content: "\f5e1";
}
.ts-icon.is-heart-circle-exclamation-icon::before {
content: "\e4fe";
}
.ts-icon.is-mastodon-icon::before {
font-family: "IconsBrands";
content: "\f4f6";
}
.ts-icon.is-monument-icon::before {
content: "\f5a6";
}
.ts-icon.is-spider-icon::before {
content: "\f717";
}
.ts-icon.is-splotch-icon::before {
content: "\f5bc";
}
.ts-icon.is-9-icon::before {
content: "\39";
}
.ts-icon.is-drumstick-bite-icon::before {
content: "\f6d7";
}
.ts-icon.is-nfc-symbol-icon::before {
font-family: "IconsBrands";
content: "\e531";
}
.ts-icon.is-palfed-icon::before {
font-family: "IconsBrands";
content: "\f3d8";
}
.ts-icon.is-car-side-icon::before {
content: "\f5e4";
}
.ts-icon.is-handcuffs-icon::before {
content: "\e4f8";
}
.ts-icon.is-hands-bubbles-icon::before {
content: "\e05e";
}
.ts-icon.is-weebly-icon::before {
font-family: "IconsBrands";
content: "\f5cc";
}
.ts-icon.is-circle-down-icon::before {
content: "\f358";
}
.ts-icon.is-circle-right-icon::before {
content: "\f35a";
}
.ts-icon.is-maxcdn-icon::before {
font-family: "IconsBrands";
content: "\f136";
}
.ts-icon.is-neuter-icon::before {
content: "\f22c";
}
.ts-icon.is-phone-volume-icon::before {
content: "\f2a0";
}
.ts-icon.is-square-google-plus-icon::before {
font-family: "IconsBrands";
content: "\f0d4";
}
.ts-icon.is-tenge-sign-icon::before {
content: "\f7d7";
}
.ts-icon.is-chalkboard-icon::before {
content: "\f51b";
}
.ts-icon.is-cloudsmith-icon::before {
font-family: "IconsBrands";
content: "\f384";
}
.ts-icon.is-hand-pointer-icon::before {
content: "\f25a";
}
.ts-icon.is-s-icon::before {
content: "\53";
}
.ts-icon.is-briefcase-icon::before {
content: "\f0b1";
}
.ts-icon.is-pen-nib-icon::before {
content: "\f5ad";
}
.ts-icon.is-vial-virus-icon::before {
content: "\e597";
}
.ts-icon.is-building-columns-icon::before {
content: "\f19c";
}
.ts-icon.is-square-arrow-up-right-icon::before {
content: "\f14c";
}
.ts-icon.is-square-odnoklassniki-icon::before {
font-family: "IconsBrands";
content: "\f264";
}
.ts-icon.is-water-ladder-icon::before {
content: "\f5c5";
}
.ts-icon.is-redhat-icon::before {
font-family: "IconsBrands";
content: "\f7bc";
}
.ts-icon.is-cat-icon::before {
content: "\f6be";
}
.ts-icon.is-kip-sign-icon::before {
content: "\e1c4";
}
.ts-icon.is-person-digging-icon::before {
content: "\f85e";
}
.ts-icon.is-satellite-icon::before {
content: "\f7bf";
}
.ts-icon.is-slack-icon::before {
font-family: "IconsBrands";
content: "\f198";
}
.ts-icon.is-ubuntu-icon::before {
font-family: "IconsBrands";
content: "\f7df";
}
.ts-icon.is-file-lines-icon::before {
content: "\f15c";
}
.ts-icon.is-down-left-and-up-right-to-center-icon::before {
content: "\f422";
}
.ts-icon.is-plane-circle-check-icon::before {
content: "\e555";
}
.ts-icon.is-rainbow-icon::before {
content: "\f75b";
}
.ts-icon.is-sistrix-icon::before {
font-family: "IconsBrands";
content: "\f3ee";
}
.ts-icon.is-disease-icon::before {
content: "\f7fa";
}
.ts-icon.is-circle-chevron-up-icon::before {
content: "\f139";
}
.ts-icon.is-paypal-icon::before {
font-family: "IconsBrands";
content: "\f1ed";
}
.ts-icon.is-shield-virus-icon::before {
content: "\e06c";
}
.ts-icon.is-chess-knight-icon::before {
content: "\f441";
}
.ts-icon.is-code-branch-icon::before {
content: "\f126";
}
.ts-icon.is-dollar-sign-icon::before {
content: "\24";
}
.ts-icon.is-file-export-icon::before {
content: "\f56e";
}
.ts-icon.is-calendar-day-icon::before {
content: "\f783";
}
.ts-icon.is-face-meh-blank-icon::before {
content: "\f5a4";
}
.ts-icon.is-magnifying-glass-icon::before {
content: "\f002";
}
.ts-icon.is-mars-stroke-up-icon::before {
content: "\f22a";
}
.ts-icon.is-arrow-turn-up-icon::before {
content: "\f148";
}
.ts-icon.is-scribd-icon::before {
font-family: "IconsBrands";
content: "\f28a";
}
.ts-icon.is-lemon-icon::before {
content: "\f094";
}
.ts-icon.is-building-user-icon::before {
content: "\e4da";
}
.ts-icon.is-quora-icon::before {
font-family: "IconsBrands";
content: "\f2c4";
}
.ts-icon.is-vest-icon::before {
content: "\e085";
}
.ts-icon.is-caret-up-icon::before {
content: "\f0d8";
}
.ts-icon.is-calendar-check-icon::before {
content: "\f274";
}
.ts-icon.is-chess-rook-icon::before {
content: "\f447";
}
.ts-icon.is-cloud-icon::before {
content: "\f0c2";
}
.ts-icon.is-face-grin-stars-icon::before {
content: "\f587";
}
.ts-icon.is-imdb-icon::before {
font-family: "IconsBrands";
content: "\f2d8";
}
.ts-icon.is-yin-yang-icon::before {
content: "\f6ad";
}
.ts-icon.is-baby-icon::before {
content: "\f77c";
}
.ts-icon.is-fulcrum-icon::before {
font-family: "IconsBrands";
content: "\f50b";
}
.ts-icon.is-notes-medical-icon::before {
content: "\f481";
}
.ts-icon.is-square-plus-icon::before {
content: "\f0fe";
}
.ts-icon.is-arrow-turn-down-icon::before {
content: "\f149";
}
.ts-icon.is-compass-drafting-icon::before {
content: "\f568";
}
.ts-icon.is-map-pin-icon::before {
content: "\f276";
}
.ts-icon.is-mdb-icon::before {
font-family: "IconsBrands";
content: "\f8ca";
}
.ts-icon.is-ticket-simple-icon::before {
content: "\f3ff";
}
.ts-icon.is-chart-line-icon::before {
content: "\f201";
}
.ts-icon.is-chart-simple-icon::before {
content: "\e473";
}
.ts-icon.is-circle-arrow-left-icon::before {
content: "\f0a8";
}
.ts-icon.is-life-ring-icon::before {
content: "\f1cd";
}
.ts-icon.is-amilia-icon::before {
font-family: "IconsBrands";
content: "\f36d";
}
.ts-icon.is-mountain-icon::before {
content: "\f6fc";
}
.ts-icon.is-file-shield-icon::before {
content: "\e4f0";
}
.ts-icon.is-q-icon::before {
content: "\51";
}
.ts-icon.is-book-medical-icon::before {
content: "\f7e6";
}
.ts-icon.is-temperature-full-icon::before {
content: "\f2c7";
}
.ts-icon.is-gitlab-icon::before {
font-family: "IconsBrands";
content: "\f296";
}
.ts-icon.is-hand-point-up-icon::before {
content: "\f0a6";
}
.ts-icon.is-oil-can-icon::before {
content: "\f613";
}
.ts-icon.is-star-and-crescent-icon::before {
content: "\f699";
}
.ts-icon.is-erlang-icon::before {
font-family: "IconsBrands";
content: "\f39d";
}
.ts-icon.is-house-crack-icon::before {
content: "\e3b1";
}
.ts-icon.is-pagelines-icon::before {
font-family: "IconsBrands";
content: "\f18c";
}
.ts-icon.is-elevator-icon::before {
content: "\e16d";
}
.ts-icon.is-file-pen-icon::before {
content: "\f31c";
}
.ts-icon.is-icons-icon::before {
content: "\f86d";
}
.ts-icon.is-microsoft-icon::before {
font-family: "IconsBrands";
content: "\f3ca";
}
.ts-icon.is-pause-icon::before {
content: "\f04c";
}
.ts-icon.is-snowflake-icon::before {
content: "\f2dc";
}
.ts-icon.is-window-maximize-icon::before {
content: "\f2d0";
}
.ts-icon.is-arrow-rotate-left-icon::before {
content: "\f0e2";
}
.ts-icon.is-quote-right-icon::before {
content: "\f10e";
}
.ts-icon.is-pied-piper-icon::before {
font-family: "IconsBrands";
content: "\f2ae";
}
.ts-icon.is-microblog-icon::before {
font-family: "IconsBrands";
content: "\e01a";
}
.ts-icon.is-tent-arrows-down-icon::before {
content: "\e581";
}
.ts-icon.is-vial-icon::before {
content: "\f492";
}
.ts-icon.is-fort-awesome-icon::before {
font-family: "IconsBrands";
content: "\f286";
}
.ts-icon.is-creative-commons-sampling-icon::before {
font-family: "IconsBrands";
content: "\f4f0";
}
.ts-icon.is-envelope-open-icon::before {
content: "\f2b6";
}
.ts-icon.is-bottle-water-icon::before {
content: "\e4c5";
}
.ts-icon.is-dailymotion-icon::before {
font-family: "IconsBrands";
content: "\e052";
}
.ts-icon.is-guilded-icon::before {
font-family: "IconsBrands";
content: "\e07e";
}
.ts-icon.is-hands-praying-icon::before {
content: "\f684";
}
.ts-icon.is-java-icon::before {
font-family: "IconsBrands";
content: "\f4e4";
}
.ts-icon.is-microphone-lines-icon::before {
content: "\f3c9";
}
.ts-icon.is-spaghetti-monster-flying-icon::before {
content: "\f67b";
}
.ts-icon.is-coins-icon::before {
content: "\f51e";
}
.ts-icon.is-square-poll-vertical-icon::before {
content: "\f681";
}
.ts-icon.is-phoenix-squadron-icon::before {
font-family: "IconsBrands";
content: "\f511";
}
.ts-icon.is-dice-icon::before {
content: "\f522";
}
.ts-icon.is-pen-to-square-icon::before {
content: "\f044";
}
.ts-icon.is-person-arrow-up-from-line-icon::before {
content: "\e539";
}
.ts-icon.is-cloud-showers-water-icon::before {
content: "\e4e4";
}
.ts-icon.is-person-walking-with-cane-icon::before {
content: "\f29d";
}
.ts-icon.is-reacteurope-icon::before {
font-family: "IconsBrands";
content: "\f75d";
}
.ts-icon.is-trowel-bricks-icon::before {
content: "\e58a";
}
.ts-icon.is-ussunnah-icon::before {
font-family: "IconsBrands";
content: "\f407";
}
.ts-icon.is-battery-half-icon::before {
content: "\f242";
}
.ts-icon.is-earlybirds-icon::before {
font-family: "IconsBrands";
content: "\f39a";
}
.ts-icon.is-plug-circle-plus-icon::before {
content: "\e55f";
}
.ts-icon.is-avianex-icon::before {
font-family: "IconsBrands";
content: "\f374";
}
.ts-icon.is-git-icon::before {
font-family: "IconsBrands";
content: "\f1d3";
}
.ts-icon.is-h-icon::before {
content: "\48";
}
.ts-icon.is-square-whatsapp-icon::before {
font-family: "IconsBrands";
content: "\f40c";
}
.ts-icon.is-flickr-icon::before {
font-family: "IconsBrands";
content: "\f16e";
}
.ts-icon.is-toilet-paper-slash-icon::before {
content: "\e072";
}
.ts-icon.is-cloudversify-icon::before {
font-family: "IconsBrands";
content: "\f385";
}
.ts-icon.is-codepen-icon::before {
font-family: "IconsBrands";
content: "\f1cb";
}
.ts-icon.is-envelopes-bulk-icon::before {
content: "\f674";
}
.ts-icon.is-house-chimney-crack-icon::before {
content: "\f6f1";
}
.ts-icon.is-vr-cardboard-icon::before {
content: "\f729";
}
.ts-icon.is-clipboard-list-icon::before {
content: "\f46d";
}
.ts-icon.is-fire-icon::before {
content: "\f06d";
}
.ts-icon.is-landmark-dome-icon::before {
content: "\f752";
}
.ts-icon.is-php-icon::before {
font-family: "IconsBrands";
content: "\f457";
}
.ts-icon.is-square-threads-icon::before {
font-family: "IconsBrands";
content: "\e619";
}
.ts-icon.is-cart-flatbed-icon::before {
content: "\f474";
}
.ts-icon.is-comments-dollar-icon::before {
content: "\f653";
}
.ts-icon.is-face-grin-icon::before {
content: "\f580";
}
.ts-icon.is-osi-icon::before {
font-family: "IconsBrands";
content: "\f41a";
}
.ts-icon.is-code-commit-icon::before {
content: "\f386";
}
.ts-icon.is-bridge-circle-exclamation-icon::before {
content: "\e4ca";
}
.ts-icon.is-r-icon::before {
content: "\52";
}
.ts-icon.is-bowl-rice-icon::before {
content: "\e2eb";
}
.ts-icon.is-share-from-square-icon::before {
content: "\f14d";
}
.ts-icon.is-hackerrank-icon::before {
font-family: "IconsBrands";
content: "\f5f7";
}
.ts-icon.is-house-circle-xmark-icon::before {
content: "\e50b";
}
.ts-icon.is-person-walking-arrow-right-icon::before {
content: "\e552";
}
.ts-icon.is-anchor-lock-icon::before {
content: "\e4ad";
}
.ts-icon.is-people-pulling-icon::before {
content: "\e535";
}
.ts-icon.is-headset-icon::before {
content: "\f590";
}
.ts-icon.is-truck-arrow-right-icon::before {
content: "\e58b";
}
.ts-icon.is-hacker-news-icon::before {
font-family: "IconsBrands";
content: "\f1d4";
}
.ts-icon.is-people-group-icon::before {
content: "\e533";
}
.ts-icon.is-pepper-hot-icon::before {
content: "\f816";
}
.ts-icon.is-right-to-bracket-icon::before {
content: "\f2f6";
}
.ts-icon.is-trash-icon::before {
content: "\f1f8";
}
.ts-icon.is-virus-covid-slash-icon::before {
content: "\e4a9";
}
.ts-icon.is-folder-minus-icon::before {
content: "\f65d";
}
.ts-icon.is-app-store-icon::before {
font-family: "IconsBrands";
content: "\f36f";
}
.ts-icon.is-cmplid-icon::before {
font-family: "IconsBrands";
content: "\e360";
}
.ts-icon.is-google-plus-g-icon::before {
font-family: "IconsBrands";
content: "\f0d5";
}
.ts-icon.is-angles-up-icon::before {
content: "\f102";
}
.ts-icon.is-cuttlefish-icon::before {
font-family: "IconsBrands";
content: "\f38c";
}
.ts-icon.is-arrow-up-wide-short-icon::before {
content: "\f161";
}
.ts-icon.is-eye-icon::before {
content: "\f06e";
}
.ts-icon.is-ghost-icon::before {
content: "\f6e2";
}
.ts-icon.is-ice-cream-icon::before {
content: "\f810";
}
.ts-icon.is-medrt-icon::before {
font-family: "IconsBrands";
content: "\f3c8";
}
.ts-icon.is-arrow-right-to-city-icon::before {
content: "\e4b3";
}
.ts-icon.is-bullhorn-icon::before {
content: "\f0a1";
}
.ts-icon.is-closed-captioning-icon::before {
content: "\f20a";
}
.ts-icon.is-drupal-icon::before {
font-family: "IconsBrands";
content: "\f1a9";
}
.ts-icon.is-ellipsis-vertical-icon::before {
content: "\f142";
}
.ts-icon.is-genderless-icon::before {
content: "\f22d";
}
.ts-icon.is-i-cursor-icon::before {
content: "\f246";
}
.ts-icon.is-laravel-icon::before {
font-family: "IconsBrands";
content: "\f3bd";
}
.ts-icon.is-backward-icon::before {
content: "\f04a";
}
.ts-icon.is-temperature-quarter-icon::before {
content: "\f2ca";
}
.ts-icon.is-transgender-icon::before {
content: "\f225";
}
.ts-icon.is-location-crosshairs-icon::before {
content: "\f601";
}
.ts-icon.is-creative-commons-icon::before {
font-family: "IconsBrands";
content: "\f25e";
}
.ts-icon.is-cloud-moon-rain-icon::before {
content: "\f73c";
}
.ts-icon.is-hand-peace-icon::before {
content: "\f25b";
}
.ts-icon.is-hand-point-down-icon::before {
content: "\f0a7";
}
.ts-icon.is-weight-hanging-icon::before {
content: "\f5cd";
}
.ts-icon.is-cc-jcb-icon::before {
font-family: "IconsBrands";
content: "\f24b";
}
.ts-icon.is-clipboard-check-icon::before {
content: "\f46c";
}
.ts-icon.is-nutritionix-icon::before {
font-family: "IconsBrands";
content: "\f3d6";
}
.ts-icon.is-square-share-nodes-icon::before {
content: "\f1e1";
}
.ts-icon.is-baby-carriage-icon::before {
content: "\f77d";
}
.ts-icon.is-hashnode-icon::before {
font-family: "IconsBrands";
content: "\e499";
}
.ts-icon.is-circle-pause-icon::before {
content: "\f28b";
}
.ts-icon.is-ns8-icon::before {
font-family: "IconsBrands";
content: "\f3d5";
}
.ts-icon.is-award-icon::before {
content: "\f559";
}
.ts-icon.is-mendeley-icon::before {
font-family: "IconsBrands";
content: "\f7b3";
}
.ts-icon.is-shield-halved-icon::before {
content: "\f3ed";
}
.ts-icon.is-square-up-right-icon::before {
content: "\f360";
}
.ts-icon.is-user-shield-icon::before {
content: "\f505";
}
.ts-icon.is-jenkins-icon::before {
font-family: "IconsBrands";
content: "\f3b6";
}
.ts-icon.is-hammer-icon::before {
content: "\f6e3";
}
.ts-icon.is-optin-monster-icon::before {
font-family: "IconsBrands";
content: "\f23c";
}
.ts-icon.is-plug-icon::before {
content: "\f1e6";
}
.ts-icon.is-raspberry-pi-icon::before {
font-family: "IconsBrands";
content: "\f7bb";
}
.ts-icon.is-square-parking-icon::before {
content: "\f540";
}
.ts-icon.is-store-icon::before {
content: "\f54e";
}
.ts-icon.is-stumbleupon-circle-icon::before {
font-family: "IconsBrands";
content: "\f1a3";
}
.ts-icon.is-bandcamp-icon::before {
font-family: "IconsBrands";
content: "\f2d5";
}
.ts-icon.is-youtube-icon::before {
font-family: "IconsBrands";
content: "\f167";
}
.ts-icon.is-tornado-icon::before {
content: "\f76f";
}
.ts-icon.is-volleyball-icon::before {
content: "\f45f";
}
.ts-icon.is-cookie-bite-icon::before {
content: "\f564";
}
.ts-icon.is-arrow-down-icon::before {
content: "\f063";
}
.ts-icon.is-facebook-messenger-icon::before {
font-family: "IconsBrands";
content: "\f39f";
}
.ts-icon.is-hourglass-start-icon::before {
content: "\f251";
}
.ts-icon.is-odysee-icon::before {
font-family: "IconsBrands";
content: "\e5c6";
}
.ts-icon.is-seedling-icon::before {
content: "\f4d8";
}
.ts-icon.is-ankh-icon::before {
content: "\f644";
}
.ts-icon.is-stopwatch-20-icon::before {
content: "\e06f";
}
.ts-icon.is-clipboard-question-icon::before {
content: "\e4e3";
}
.ts-icon.is-hourglass-half-icon::before {
content: "\f252";
}
.ts-icon.is-text-slash-icon::before {
content: "\f87d";
}
.ts-icon.is-font-icon::before {
content: "\f031";
}
.ts-icon.is-js-icon::before {
font-family: "IconsBrands";
content: "\f3b8";
}
.ts-icon.is-layer-group-icon::before {
content: "\f5fd";
}
.ts-icon.is-pen-clip-icon::before {
content: "\f305";
}
.ts-icon.is-pinterest-p-icon::before {
font-family: "IconsBrands";
content: "\f231";
}
.ts-icon.is-school-lock-icon::before {
content: "\e56f";
}
.ts-icon.is-tarp-droplet-icon::before {
content: "\e57c";
}
.ts-icon.is-bahai-icon::before {
content: "\f666";
}
.ts-icon.is-jar-wheat-icon::before {
content: "\e517";
}
.ts-icon.is-hospital-icon::before {
content: "\f0f8";
}
.ts-icon.is-align-center-icon::before {
content: "\f037";
}
.ts-icon.is-check-double-icon::before {
content: "\f560";
}
.ts-icon.is-handshake-angle-icon::before {
content: "\f4c4";
}
.ts-icon.is-hotjar-icon::before {
font-family: "IconsBrands";
content: "\f3b1";
}
.ts-icon.is-person-rays-icon::before {
content: "\e54d";
}
.ts-icon.is-car-battery-icon::before {
content: "\f5df";
}
.ts-icon.is-sheet-plastic-icon::before {
content: "\e571";
}
.ts-icon.is-calendar-week-icon::before {
content: "\f784";
}
.ts-icon.is-border-none-icon::before {
content: "\f850";
}
.ts-icon.is-building-circle-check-icon::before {
content: "\e4d2";
}
.ts-icon.is-deviantart-icon::before {
font-family: "IconsBrands";
content: "\f1bd";
}
.ts-icon.is-person-skiing-nordic-icon::before {
content: "\f7ca";
}
.ts-icon.is-satellite-dish-icon::before {
content: "\f7c0";
}
.ts-icon.is-truck-plane-icon::before {
content: "\e58f";
}
.ts-icon.is-arrows-rotate-icon::before {
content: "\f021";
}
.ts-icon.is-gift-icon::before {
content: "\f06b";
}
.ts-icon.is-hot-tub-person-icon::before {
content: "\f593";
}
.ts-icon.is-house-signal-icon::before {
content: "\e012";
}
.ts-icon.is-spa-icon::before {
content: "\f5bb";
}
.ts-icon.is-up-down-left-right-icon::before {
content: "\f0b2";
}
.ts-icon.is-file-medical-icon::before {
content: "\f477";
}
.ts-icon.is-monero-icon::before {
font-family: "IconsBrands";
content: "\f3d0";
}
.ts-icon.is-money-bill-wave-icon::before {
content: "\f53a";
}
.ts-icon.is-playstation-icon::before {
font-family: "IconsBrands";
content: "\f3df";
}
.ts-icon.is-water-icon::before {
content: "\f773";
}
.ts-icon.is-biohazard-icon::before {
content: "\f780";
}
.ts-icon.is-star-icon::before {
content: "\f005";
}
.ts-icon.is-steam-icon::before {
font-family: "IconsBrands";
content: "\f1b6";
}
.ts-icon.is-square-rss-icon::before {
content: "\f143";
}
.ts-icon.is-hand-holding-droplet-icon::before {
content: "\f4c1";
}
.ts-icon.is-images-icon::before {
content: "\f302";
}
.ts-icon.is-industry-icon::before {
content: "\f275";
}
.ts-icon.is-link-icon::before {
content: "\f0c1";
}
.ts-icon.is-blogger-icon::before {
font-family: "IconsBrands";
content: "\f37c";
}
.ts-icon.is-square-root-variable-icon::before {
content: "\f698";
}
.ts-icon.is-square-virus-icon::before {
content: "\e578";
}
.ts-icon.is-file-csv-icon::before {
content: "\f6dd";
}
.ts-icon.is-comment-icon::before {
content: "\f075";
}
.ts-icon.is-person-circle-plus-icon::before {
content: "\e541";
}
.ts-icon.is-text-width-icon::before {
content: "\f035";
}
.ts-icon.is-backward-fast-icon::before {
content: "\f049";
}
.ts-icon.is-google-play-icon::before {
font-family: "IconsBrands";
content: "\f3ab";
}
.ts-icon.is-road-circle-xmark-icon::before {
content: "\e566";
}
.ts-icon.is-square-youtube-icon::before {
font-family: "IconsBrands";
content: "\f431";
}
.ts-icon.is-temperature-three-quarters-icon::before {
content: "\f2c8";
}
.ts-icon.is-y-icon::before {
content: "\59";
}
.ts-icon.is-file-circle-check-icon::before {
content: "\e5a0";
}
.ts-icon.is-house-flag-icon::before {
content: "\e50d";
}
.ts-icon.is-broom-icon::before {
content: "\f51a";
}
.ts-icon.is-odnoklassniki-icon::before {
font-family: "IconsBrands";
content: "\f263";
}
.ts-icon.is-wizards-of-the-coast-icon::before {
font-family: "IconsBrands";
content: "\f730";
}
.ts-icon.is-arrow-up-9-1-icon::before {
content: "\f887";
}
.ts-icon.is-skull-icon::before {
content: "\f54c";
}
.ts-icon.is-cart-shopping-icon::before {
content: "\f07a";
}
.ts-icon.is-hands-asl-interpreting-icon::before {
content: "\f2a3";
}
.ts-icon.is-padlet-icon::before {
font-family: "IconsBrands";
content: "\e4a0";
}
.ts-icon.is-spinner-icon::before {
content: "\f110";
}
.ts-icon.is-angle-down-icon::before {
content: "\f107";
}
.ts-icon.is-fonticons-icon::before {
font-family: "IconsBrands";
content: "\f280";
}
.ts-icon.is-phone-slash-icon::before {
content: "\f3dd";
}
.ts-icon.is-shop-lock-icon::before {
content: "\e4a5";
}
.ts-icon.is-stack-overflow-icon::before {
font-family: "IconsBrands";
content: "\f16c";
}
.ts-icon.is-wpbeginner-icon::before {
font-family: "IconsBrands";
content: "\f297";
}
.ts-icon.is-capsules-icon::before {
content: "\f46b";
}
.ts-icon.is-toilet-paper-icon::before {
content: "\f71e";
}
.ts-icon.is-handshake-icon::before {
content: "\f2b5";
}
.ts-icon.is-face-smile-icon::before {
content: "\f118";
}
.ts-icon.is-heart-icon::before {
content: "\f004";
}
.ts-icon.is-person-breastfeeding-icon::before {
content: "\e53a";
}
.ts-icon.is-plant-wilt-icon::before {
content: "\e5aa";
}
.ts-icon.is-truck-icon::before {
content: "\f0d1";
}
.ts-icon.is-users-viewfinder-icon::before {
content: "\e595";
}
.ts-icon.is-bars-staggered-icon::before {
content: "\f550";
}
.ts-icon.is-outdent-icon::before {
content: "\f03b";
}
.ts-icon.is-address-book-icon::before {
content: "\f2b9";
}
.ts-icon.is-up-down-icon::before {
content: "\f338";
}
.ts-icon.is-wpforms-icon::before {
font-family: "IconsBrands";
content: "\f298";
}
.ts-icon.is-square-pied-piper-icon::before {
font-family: "IconsBrands";
content: "\e01e";
}
.ts-icon.is-file-circle-plus-icon::before {
content: "\e494";
}
.ts-icon.is-fort-awesome-alt-icon::before {
font-family: "IconsBrands";
content: "\f3a3";
}
.ts-icon.is-vihara-icon::before {
content: "\f6a7";
}
.ts-icon.is-battery-three-quarters-icon::before {
content: "\f241";
}
.ts-icon.is-brazilian-real-sign-icon::before {
content: "\e46c";
}
.ts-icon.is-children-icon::before {
content: "\e4e1";
}
.ts-icon.is-file-circle-exclamation-icon::before {
content: "\e4eb";
}
.ts-icon.is-suitcase-rolling-icon::before {
content: "\f5c1";
}
.ts-icon.is-box-tissue-icon::before {
content: "\e05b";
}
.ts-icon.is-arrows-spin-icon::before {
content: "\e4bb";
}
.ts-icon.is-book-open-reader-icon::before {
content: "\f5da";
}
.ts-icon.is-spell-check-icon::before {
content: "\f891";
}
.ts-icon.is-square-caret-left-icon::before {
content: "\f191";
}
.ts-icon.is-up-right-and-down-left-from-center-icon::before {
content: "\f424";
}
.ts-icon.is-arrow-up-from-bracket-icon::before {
content: "\e09a";
}
.ts-icon.is-user-lock-icon::before {
content: "\f502";
}
.ts-icon.is-person-military-rifle-icon::before {
content: "\e54b";
}
.ts-icon.is-crop-simple-icon::before {
content: "\f565";
}
.ts-icon.is-network-wired-icon::before {
content: "\f6ff";
}
.ts-icon.is-rockrms-icon::before {
font-family: "IconsBrands";
content: "\f3e9";
}
.ts-icon.is-tablet-screen-button-icon::before {
content: "\f3fa";
}
.ts-icon.is-arrow-down-up-lock-icon::before {
content: "\e4b0";
}
.ts-icon.is-paintbrush-icon::before {
content: "\f1fc";
}
.ts-icon.is-gitkraken-icon::before {
font-family: "IconsBrands";
content: "\f3a6";
}
.ts-icon.is-shop-slash-icon::before {
content: "\e070";
}
.ts-icon.is-circle-dollar-to-slot-icon::before {
content: "\f4b9";
}
.ts-icon.is-toilets-portable-icon::before {
content: "\e584";
}
.ts-icon.is-person-skiing-icon::before {
content: "\f7c9";
}
.ts-icon.is-stopwatch-icon::before {
content: "\f2f2";
}
.ts-icon.is-compact-disc-icon::before {
content: "\f51f";
}
.ts-icon.is-money-bill-1-icon::before {
content: "\f3d1";
}
.ts-icon.is-researchgate-icon::before {
font-family: "IconsBrands";
content: "\f4f8";
}
.ts-icon.is-star-half-stroke-icon::before {
content: "\f5c0";
}
.ts-icon.is-clipboard-icon::before {
content: "\f328";
}
.ts-icon.is-chart-bar-icon::before {
content: "\f080";
}
.ts-icon.is-face-grin-wink-icon::before {
content: "\f58c";
}
.ts-icon.is-g-icon::before {
content: "\47";
}
.ts-icon.is-stroopwafel-icon::before {
content: "\f551";
}
.ts-icon.is-wrench-icon::before {
content: "\f0ad";
}
.ts-icon.is-creative-commons-pd-icon::before {
font-family: "IconsBrands";
content: "\f4ec";
}
.ts-icon.is-arrow-up-right-from-square-icon::before {
content: "\f08e";
}
.ts-icon.is-chair-icon::before {
content: "\f6c0";
}
.ts-icon.is-the-red-yeti-icon::before {
font-family: "IconsBrands";
content: "\f69d";
}
.ts-icon.is-adn-icon::before {
font-family: "IconsBrands";
content: "\f170";
}
.ts-icon.is-head-side-mask-icon::before {
content: "\e063";
}
.ts-icon.is-pager-icon::before {
content: "\f815";
}
.ts-icon.is-child-icon::before {
content: "\f1ae";
}
.ts-icon.is-earth-oceania-icon::before {
content: "\e47b";
}
.ts-icon.is-golf-ball-tee-icon::before {
content: "\f450";
}
.ts-icon.is-strikethrough-icon::before {
content: "\f0cc";
}
.ts-icon.is-wallet-icon::before {
content: "\f555";
}
.ts-icon.is-chess-bishop-icon::before {
content: "\f43a";
}
.ts-icon.is-expand-icon::before {
content: "\f065";
}
.ts-icon.is-minimize-icon::before {
content: "\f78c";
}
.ts-icon.is-square-snapchat-icon::before {
font-family: "IconsBrands";
content: "\f2ad";
}
.ts-icon.is-bridge-lock-icon::before {
content: "\e4cc";
}
.ts-icon.is-node-icon::before {
font-family: "IconsBrands";
content: "\f419";
}
.ts-icon.is-peso-sign-icon::before {
content: "\e222";
}
.ts-icon.is-rectangle-xmark-icon::before {
content: "\f410";
}
.ts-icon.is-universal-access-icon::before {
content: "\f29a";
}
.ts-icon.is-yoast-icon::before {
font-family: "IconsBrands";
content: "\f2b1";
}
.ts-icon.is-globe-icon::before {
content: "\f0ac";
}
.ts-icon.is-rectangle-list-icon::before {
content: "\f022";
}
.ts-icon.is-suse-icon::before {
font-family: "IconsBrands";
content: "\f7d6";
}
.ts-icon.is-comment-medical-icon::before {
content: "\f7f5";
}
.ts-icon.is-business-time-icon::before {
content: "\f64a";
}
.ts-icon.is-face-grin-squint-icon::before {
content: "\f585";
}
.ts-icon.is-hand-spock-icon::before {
content: "\f259";
}
.ts-icon.is-linode-icon::before {
font-family: "IconsBrands";
content: "\f2b8";
}
.ts-icon.is-magnifying-glass-location-icon::before {
content: "\f689";
}
.ts-icon.is-thumbtack-icon::before {
content: "\f08d";
}
.ts-icon.is-aws-icon::before {
font-family: "IconsBrands";
content: "\f375";
}
.ts-icon.is-location-arrow-icon::before {
content: "\f124";
}
.ts-icon.is-route-icon::before {
content: "\f4d7";
}
.ts-icon.is-smog-icon::before {
content: "\f75f";
}
.ts-icon.is-strava-icon::before {
font-family: "IconsBrands";
content: "\f428";
}
.ts-icon.is-user-astronaut-icon::before {
content: "\f4fb";
}
.ts-icon.is-folder-tree-icon::before {
content: "\f802";
}
.ts-icon.is-gamepad-icon::before {
content: "\f11b";
}
.ts-icon.is-tractor-icon::before {
content: "\f722";
}
.ts-icon.is-bone-icon::before {
content: "\f5d7";
}
.ts-icon.is-goodreads-g-icon::before {
font-family: "IconsBrands";
content: "\f3a9";
}
.ts-icon.is-hourglass-end-icon::before {
content: "\f253";
}
.ts-icon.is-person-walking-luggage-icon::before {
content: "\e554";
}
.ts-icon.is-pied-piper-alt-icon::before {
font-family: "IconsBrands";
content: "\f1a8";
}
.ts-icon.is-florin-sign-icon::before {
content: "\e184";
}
.ts-icon.is-prescription-icon::before {
content: "\f5b1";
}
.ts-icon.is-person-circle-question-icon::before {
content: "\e542";
}
.ts-icon.is-galactic-republic-icon::before {
font-family: "IconsBrands";
content: "\f50c";
}
.ts-icon.is-r-project-icon::before {
font-family: "IconsBrands";
content: "\f4f7";
}
.ts-icon.is-share-icon::before {
content: "\f064";
}
.ts-icon.is-tiktok-icon::before {
font-family: "IconsBrands";
content: "\e07b";
}
.ts-icon.is-file-contract-icon::before {
content: "\f56c";
}
.ts-icon.is-dice-three-icon::before {
content: "\f527";
}
.ts-icon.is-gas-pump-icon::before {
content: "\f52f";
}
.ts-icon.is-mandalorian-icon::before {
font-family: "IconsBrands";
content: "\f50f";
}
.ts-icon.is-user-pen-icon::before {
content: "\f4ff";
}
.ts-icon.is-yarn-icon::before {
font-family: "IconsBrands";
content: "\f7e3";
}
.ts-icon.is-book-bible-icon::before {
content: "\f647";
}
.ts-icon.is-note-sticky-icon::before {
content: "\f249";
}
.ts-icon.is-gavel-icon::before {
content: "\f0e3";
}
.ts-icon.is-deskpro-icon::before {
font-family: "IconsBrands";
content: "\f38f";
}
.ts-icon.is-users-gear-icon::before {
content: "\f509";
}
.ts-icon.is-cruzeiro-sign-icon::before {
content: "\e152";
}
.ts-icon.is-bold-icon::before {
content: "\f032";
}
.ts-icon.is-toggle-off-icon::before {
content: "\f204";
}
.ts-icon.is-teeth-icon::before {
content: "\f62e";
}
.ts-icon.is-arrow-right-to-bracket-icon::before {
content: "\f090";
}
.ts-icon.is-asterisk-icon::before {
content: "\2a";
}
.ts-icon.is-road-bridge-icon::before {
content: "\e563";
}
.ts-icon.is-0-icon::before {
content: "\30";
}
.ts-icon.is-threads-icon::before {
font-family: "IconsBrands";
content: "\e618";
}
.ts-icon.is-fonticons-fi-icon::before {
font-family: "IconsBrands";
content: "\f3a2";
}
.ts-icon.is-house-circle-exclamation-icon::before {
content: "\e50a";
}
.ts-icon.is-house-user-icon::before {
content: "\e1b0";
}
.ts-icon.is-people-arrows-icon::before {
content: "\e068";
}
.ts-icon.is-ruble-sign-icon::before {
content: "\f158";
}
.ts-icon.is-face-grin-beam-icon::before {
content: "\f582";
}
.ts-icon.is-comment-sms-icon::before {
content: "\f7cd";
}
.ts-icon.is-jedi-icon::before {
content: "\f669";
}
.ts-icon.is-lock-icon::before {
content: "\f023";
}
.ts-icon.is-record-vinyl-icon::before {
content: "\f8d9";
}
.ts-icon.is-searchengin-icon::before {
font-family: "IconsBrands";
content: "\f3eb";
}
.ts-icon.is-van-shuttle-icon::before {
content: "\f5b6";
}
.ts-icon.is-atom-icon::before {
content: "\f5d2";
}
.ts-icon.is-person-military-pointing-icon::before {
content: "\e54a";
}
.ts-icon.is-tablet-button-icon::before {
content: "\f10a";
}
.ts-icon.is-cc-discover-icon::before {
font-family: "IconsBrands";
content: "\f1f2";
}
.ts-icon.is-bug-slash-icon::before {
content: "\e490";
}
.ts-icon.is-circle-left-icon::before {
content: "\f359";
}
.ts-icon.is-grunt-icon::before {
font-family: "IconsBrands";
content: "\f3ad";
}
.ts-icon.is-whmcs-icon::before {
font-family: "IconsBrands";
content: "\f40d";
}
.ts-icon.is-angle-right-icon::before {
content: "\f105";
}
.ts-icon.is-volcano-icon::before {
content: "\f770";
}
.ts-icon.is-fire-flame-simple-icon::before {
content: "\f46a";
}
.ts-icon.is-screwdriver-icon::before {
content: "\f54a";
}
.ts-icon.is-bread-slice-icon::before {
content: "\f7ec";
}
.ts-icon.is-chart-area-icon::before {
content: "\f1fe";
}
.ts-icon.is-dumbbell-icon::before {
content: "\f44b";
}
.ts-icon.is-file-word-icon::before {
content: "\f1c2";
}
.ts-icon.is-hornbill-icon::before {
font-family: "IconsBrands";
content: "\f592";
}
.ts-icon.is-joint-icon::before {
content: "\f595";
}
.ts-icon.is-wolf-pack-battalion-icon::before {
font-family: "IconsBrands";
content: "\f514";
}
.ts-icon.is-2-icon::before {
content: "\32";
}
.ts-icon.is-trash-can-arrow-up-icon::before {
content: "\f82a";
}
.ts-icon.is-truck-pickup-icon::before {
content: "\f63c";
}
.ts-icon.is-bacon-icon::before {
content: "\f7e5";
}
.ts-icon.is-nimblr-icon::before {
font-family: "IconsBrands";
content: "\f5a8";
}
.ts-icon.is-mountain-sun-icon::before {
content: "\e52f";
}
.ts-icon.is-user-plus-icon::before {
content: "\f234";
}
.ts-icon.is-arrow-down-a-z-icon::before {
content: "\f15d";
}
.ts-icon.is-crop-icon::before {
content: "\f125";
}
.ts-icon.is-mosquito-icon::before {
content: "\e52b";
}
.ts-icon.is-person-through-window-icon::before {
content: "\e5a9";
}
.ts-icon.is-person-walking-icon::before {
content: "\f554";
}
.ts-icon.is-slash-icon::before {
content: "\f715";
}
.ts-icon.is-amazon-icon::before {
font-family: "IconsBrands";
content: "\f270";
}
.ts-icon.is-border-all-icon::before {
content: "\f84c";
}
.ts-icon.is-get-pocket-icon::before {
font-family: "IconsBrands";
content: "\f265";
}
.ts-icon.is-prescription-bottle-medical-icon::before {
content: "\f486";
}
.ts-icon.is-angles-right-icon::before {
content: "\f101";
}
.ts-icon.is-chrome-icon::before {
font-family: "IconsBrands";
content: "\f268";
}
.ts-icon.is-expeditedssl-icon::before {
font-family: "IconsBrands";
content: "\f23e";
}
.ts-icon.is-backward-step-icon::before {
content: "\f048";
}
.ts-icon.is-campground-icon::before {
content: "\f6bb";
}
.ts-icon.is-buffer-icon::before {
font-family: "IconsBrands";
content: "\f837";
}
.ts-icon.is-circle-arrow-right-icon::before {
content: "\f0a9";
}
.ts-icon.is-deploydog-icon::before {
font-family: "IconsBrands";
content: "\f38e";
}
.ts-icon.is-fedex-icon::before {
font-family: "IconsBrands";
content: "\f797";
}
.ts-icon.is-heading-icon::before {
content: "\f1dc";
}
.ts-icon.is-mask-icon::before {
content: "\f6fa";
}
.ts-icon.is-anchor-circle-exclamation-icon::before {
content: "\e4ab";
}
.ts-icon.is-creative-commons-nc-icon::before {
font-family: "IconsBrands";
content: "\f4e8";
}
.ts-icon.is-feather-icon::before {
content: "\f52d";
}
.ts-icon.is-hashtag-icon::before {
content: "\23";
}
.ts-icon.is-robot-icon::before {
content: "\f544";
}
.ts-icon.is-street-view-icon::before {
content: "\f21d";
}
.ts-icon.is-btc-icon::before {
font-family: "IconsBrands";
content: "\f15a";
}
.ts-icon.is-stumbleupon-icon::before {
font-family: "IconsBrands";
content: "\f1a4";
}
.ts-icon.is-apple-whole-icon::before {
content: "\f5d1";
}
.ts-icon.is-calendar-plus-icon::before {
content: "\f271";
}
.ts-icon.is-face-surprise-icon::before {
content: "\f5c2";
}
.ts-icon.is-money-bill-trend-up-icon::before {
content: "\e529";
}
.ts-icon.is-person-walking-arrow-loop-left-icon::before {
content: "\e551";
}
.ts-icon.is-ranking-star-icon::before {
content: "\e561";
}
.ts-icon.is-sass-icon::before {
font-family: "IconsBrands";
content: "\f41e";
}
.ts-icon.is-42-group-icon::before {
font-family: "IconsBrands";
content: "\e080";
}
.ts-icon.is-train-icon::before {
content: "\f238";
}
.ts-icon.is-stethoscope-icon::before {
content: "\f0f1";
}
.ts-icon.is-skype-icon::before {
font-family: "IconsBrands";
content: "\f17e";
}
.ts-icon.is-hands-holding-child-icon::before {
content: "\e4fa";
}
.ts-icon.is-list-ul-icon::before {
content: "\f0ca";
}
.ts-icon.is-rotate-icon::before {
content: "\f2f1";
}
.ts-icon.is-id-card-clip-icon::before {
content: "\f47f";
}
.ts-icon.is-folder-icon::before {
content: "\f07b";
}
.ts-icon.is-copyright-icon::before {
content: "\f1f9";
}
.ts-icon.is-meta-icon::before {
font-family: "IconsBrands";
content: "\e49b";
}
.ts-icon.is-democrat-icon::before {
content: "\f747";
}
.ts-icon.is-bed-icon::before {
content: "\f236";
}
.ts-icon.is-binoculars-icon::before {
content: "\f1e5";
}
.ts-icon.is-skull-crossbones-icon::before {
content: "\f714";
}
.ts-icon.is-stop-icon::before {
content: "\f04d";
}
.ts-icon.is-tablets-icon::before {
content: "\f490";
}
.ts-icon.is-trademark-icon::before {
content: "\f25c";
}
.ts-icon.is-arrows-down-to-line-icon::before {
content: "\e4b8";
}
.ts-icon.is-info-icon::before {
content: "\f129";
}
.ts-icon.is-martini-glass-empty-icon::before {
content: "\f000";
}
.ts-icon.is-medapps-icon::before {
font-family: "IconsBrands";
content: "\f3c6";
}
.ts-icon.is-nfc-directional-icon::before {
font-family: "IconsBrands";
content: "\e530";
}
.ts-icon.is-square-full-icon::before {
content: "\f45c";
}
.ts-icon.is-icicles-icon::before {
content: "\f7ad";
}
.ts-icon.is-circle-user-icon::before {
content: "\f2bd";
}
.ts-icon.is-person-falling-burst-icon::before {
content: "\e547";
}
.ts-icon.is-arrow-right-long-icon::before {
content: "\f178";
}
.ts-icon.is-file-icon::before {
content: "\f15b";
}
.ts-icon.is-drum-steelpan-icon::before {
content: "\f56a";
}
.ts-icon.is-vuejs-icon::before {
font-family: "IconsBrands";
content: "\f41f";
}
.ts-icon.is-suitcase-icon::before {
content: "\f0f2";
}
.ts-icon.is-face-grin-hearts-icon::before {
content: "\f584";
}
.ts-icon.is-gauge-high-icon::before {
content: "\f625";
}
.ts-icon.is-school-flag-icon::before {
content: "\e56e";
}
.ts-icon.is-shirt-icon::before {
content: "\f553";
}
.ts-icon.is-caravan-icon::before {
content: "\f8ff";
}
.ts-icon.is-calendar-icon::before {
content: "\f133";
}
.ts-icon.is-smoking-icon::before {
content: "\f48d";
}
.ts-icon.is-8-icon::before {
content: "\38";
}
.ts-icon.is-crutch-icon::before {
content: "\f7f7";
}
.ts-icon.is-guitar-icon::before {
content: "\f7a6";
}
.ts-icon.is-hand-holding-heart-icon::before {
content: "\f4be";
}
.ts-icon.is-road-barrier-icon::before {
content: "\e562";
}
.ts-icon.is-skyatlas-icon::before {
font-family: "IconsBrands";
content: "\f216";
}
.ts-icon.is-cloud-rain-icon::before {
content: "\f73d";
}
.ts-icon.is-gg-icon::before {
font-family: "IconsBrands";
content: "\f260";
}
.ts-icon.is-person-snowboarding-icon::before {
content: "\f7ce";
}
.ts-icon.is-plus-icon::before {
content: "\2b";
}
.ts-icon.is-section-icon::before {
content: "\e447";
}
.ts-icon.is-hands-clapping-icon::before {
content: "\e1a8";
}
.ts-icon.is-table-list-icon::before {
content: "\f00b";
}
.ts-icon.is-square-git-icon::before {
font-family: "IconsBrands";
content: "\f1d2";
}
.ts-icon.is-file-signature-icon::before {
content: "\f573";
}
.ts-icon.is-plug-circle-minus-icon::before {
content: "\e55e";
}
.ts-icon.is-square-font-awesome-icon::before {
font-family: "IconsBrands";
content: "\e5ad";
}
.ts-icon.is-syringe-icon::before {
content: "\f48e";
}
.ts-icon.is-table-icon::before {
content: "\f0ce";
}
.ts-icon.is-turkish-lira-sign-icon::before {
content: "\e2bb";
}
.ts-icon.is-code-compare-icon::before {
content: "\e13a";
}
.ts-icon.is-location-pin-icon::before {
content: "\f041";
}
.ts-icon.is-xing-icon::before {
font-family: "IconsBrands";
content: "\f168";
}
.ts-icon.is-500px-icon::before {
font-family: "IconsBrands";
content: "\f26e";
}
.ts-icon.is-earth-americas-icon::before {
content: "\f57d";
}
.ts-icon.is-caret-left-icon::before {
content: "\f0d9";
}
.ts-icon.is-hanukiah-icon::before {
content: "\f6e6";
}
.ts-icon.is-khanda-icon::before {
content: "\f66d";
}
.ts-icon.is-ruler-combined-icon::before {
content: "\f546";
}
.ts-icon.is-shekel-sign-icon::before {
content: "\f20b";
}
.ts-icon.is-dice-d6-icon::before {
content: "\f6d1";
}
.ts-icon.is-house-medical-icon::before {
content: "\e3b2";
}
.ts-icon.is-face-laugh-squint-icon::before {
content: "\f59b";
}
.ts-icon.is-down-long-icon::before {
content: "\f309";
}
.ts-icon.is-crown-icon::before {
content: "\f521";
}
.ts-icon.is-facebook-f-icon::before {
font-family: "IconsBrands";
content: "\f39e";
}
.ts-icon.is-brain-icon::before {
content: "\f5dc";
}
.ts-icon.is-land-mine-on-icon::before {
content: "\e51b";
}
.ts-icon.is-viacoin-icon::before {
font-family: "IconsBrands";
content: "\f237";
}
.ts-icon.is-faucet-drip-icon::before {
content: "\e006";
}
.ts-icon.is-building-circle-xmark-icon::before {
content: "\e4d4";
}
.ts-icon.is-cloud-sun-rain-icon::before {
content: "\f743";
}
.ts-icon.is-handshake-slash-icon::before {
content: "\e060";
}
.ts-icon.is-5-icon::before {
content: "\35";
}
.ts-icon.is-ticket-icon::before {
content: "\f145";
}
.ts-icon.is-v-icon::before {
content: "\56";
}
.ts-icon.is-dove-icon::before {
content: "\f4ba";
}
.ts-icon.is-road-lock-icon::before {
content: "\e567";
}
.ts-icon.is-css3-icon::before {
font-family: "IconsBrands";
content: "\f13c";
}
.ts-icon.is-microphone-icon::before {
content: "\f130";
}
.ts-icon.is-shield-heart-icon::before {
content: "\e574";
}
.ts-icon.is-ruler-horizontal-icon::before {
content: "\f547";
}
.ts-icon.is-gauge-simple-icon::before {
content: "\f629";
}
.ts-icon.is-vector-square-icon::before {
content: "\f5cb";
}
.ts-icon.is-xmark-icon::before {
content: "\f00d";
}
.ts-icon.is-apple-icon::before {
font-family: "IconsBrands";
content: "\f179";
}
.ts-icon.is-scale-balanced-icon::before {
content: "\f24e";
}
.ts-icon.is-bluetooth-b-icon::before {
font-family: "IconsBrands";
content: "\f294";
}
.ts-icon.is-book-quran-icon::before {
content: "\f687";
}
.ts-icon.is-screwdriver-wrench-icon::before {
content: "\f7d9";
}
.ts-icon.is-square-xing-icon::before {
font-family: "IconsBrands";
content: "\f169";
}
.ts-icon.is-bars-icon::before {
content: "\f0c9";
}
.ts-icon.is-heart-pulse-icon::before {
content: "\f21e";
}
.ts-icon.is-hippo-icon::before {
content: "\f6ed";
}
.ts-icon.is-naira-sign-icon::before {
content: "\e1f6";
}
.ts-icon.is-restroom-icon::before {
content: "\f7bd";
}
.ts-icon.is-asymmetrik-icon::before {
font-family: "IconsBrands";
content: "\f372";
}
.ts-icon.is-circle-plus-icon::before {
content: "\f055";
}
.ts-icon.is-house-icon::before {
content: "\f015";
}
.ts-icon.is-person-dress-burst-icon::before {
content: "\e544";
}
.ts-icon.is-wix-icon::before {
font-family: "IconsBrands";
content: "\f5cf";
}
.ts-icon.is-bag-shopping-icon::before {
content: "\f290";
}
.ts-icon.is-couch-icon::before {
content: "\f4b8";
}
.ts-icon.is-empire-icon::before {
font-family: "IconsBrands";
content: "\f1d1";
}
.ts-icon.is-guarani-sign-icon::before {
content: "\e19a";
}
.ts-icon.is-truck-moving-icon::before {
content: "\f4df";
}
.ts-icon.is-circle-nodes-icon::before {
content: "\e4e2";
}
.ts-icon.is-building-wheat-icon::before {
content: "\e4db";
}
.ts-icon.is-circle-notch-icon::before {
content: "\f1ce";
}
.ts-icon.is-voicemail-icon::before {
content: "\f897";
}
.ts-icon.is-baht-sign-icon::before {
content: "\e0ac";
}
.ts-icon.is-square-font-awesome-stroke-icon::before {
font-family: "IconsBrands";
content: "\f35c";
}
.ts-icon.is-bimobject-icon::before {
font-family: "IconsBrands";
content: "\f378";
}
.ts-icon.is-table-tennis-paddle-ball-icon::before {
content: "\f45d";
}
.ts-icon.is-square-envelope-icon::before {
content: "\f199";
}
/* ==========================================================================
Variables
========================================================================== */
@font-face {
font-family: "Icons";
src: url("fonts/icons/fa-solid-900.woff2") format("woff2"), url("fonts/icons/fa-solid-900.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-variant: normal;
text-decoration: inherit;
text-transform: none;
}
@font-face {
font-family: "IconsBrands";
src: url("fonts/icons/fa-brands-400.woff2") format("woff2"), url("fonts/icons/fa-brands-400.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-variant: normal;
text-decoration: inherit;
text-transform: none;
}
@font-face {
font-family: "IconsRegular";
src: url("fonts/icons/fa-regular-400.woff2") format("woff2"), url("fonts/icons/fa-regular-400.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-variant: normal;
text-decoration: inherit;
text-transform: none;
}
@keyframes ts-icon-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.ts-icon {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-icon {
font-family: "Icons";
font-weight: normal;
font-style: normal;
display: inline;
text-decoration: none;
text-align: center;
width: 1.18em;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
color: var(--accent-color, inherit);
}
.ts-icon:before {
display: inline-block; /** Remove text-decoration artifacts */
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Regular
*/
.ts-icon.is-regular {
font-family: "IconsRegular";
}
/**
* Circular
*/
.ts-icon.is-circular,
.ts-icon.is-rounded {
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 500em !important;
line-height: 1 !important;
box-sizing: border-box;
padding: 0.5em 0.5em !important;
box-shadow: 0em 0em 0em 0.1em var(--ts-gray-300) inset;
width: 2em !important;
height: 2em !important;
}
.ts-icon.is-rounded {
border-radius: var(--ts-border-radius-element) !important;
}
/**
* Spinning
*/
.ts-icon.is-spinning {
display: inline-block;
animation: ts-icon-spin 2s linear infinite;
}
/**
* Negative
*/
.ts-icon.is-negative {
color: var(--ts-negative-500);
}
/**
* Disabled
*/
.ts-icon.is-disabled {
opacity: 0.25;
pointer-events: none;
}
/**
* Squared
*/
.ts-icon.is-squared {
background: var(--ts-gray-100);
border-radius: var(--ts-border-radius-element);
font-size: 1.3em;
width: 3rem;
height: 3rem;
align-items: center;
justify-content: center;
display: inline-flex;
}
/**
* Secondary
*/
.ts-icon.is-secondary {
color: var(--ts-gray-500);
}
/**
* Sizes
*/
.ts-icon.is-small {
font-size: var(--ts-font-size-13px);
}
.ts-icon.is-large {
font-size: var(--ts-font-size-18px);
}
.ts-icon.is-big {
font-size: var(--ts-font-size-24px);
}
.ts-icon.is-huge {
font-size: var(--ts-font-size-30px);
}
/**
* Heading
*/
.ts-icon.is-heading {
line-height: 1;
font-size: var(--ts-font-size-75px);
}
/**
* Spaced
*/
.ts-icon.is-spaced {
margin-left: 0.45rem;
margin-right: 0.45rem;
}
.ts-icon.is-start-spaced {
margin-left: 0.45rem;
}
.ts-icon.is-end-spaced {
margin-right: 0.45rem;
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-divider {
border-top: 1px solid var(--ts-gray-300);
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Vertical
*/
.ts-divider.is-vertical {
border-top: 0;
border-left: 1px solid var(--ts-gray-300);
}
/**
* Section
*/
.ts-divider.is-section {
margin: 1rem 0;
}
/**
* Text
*/
.ts-divider:is(.is-center-text, .is-start-text, .is-end-text) {
display: flex;
align-items: center;
border-top: 0;
gap: 1rem;
color: var(--ts-gray-800);
}
.ts-divider:is(.is-center-text, .is-start-text, .is-end-text)::before,
.ts-divider:is(.is-center-text, .is-start-text, .is-end-text)::after {
content: "";
height: 1px;
background-color: var(--ts-gray-300);
flex-grow: 1;
}
.ts-divider.is-start-text::before {
display: none;
}
.ts-divider.is-end-text::after {
display: none;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-input {
--border-radius: var(--ts-border-radius-element);
--height: var(--ts-input-height-medium);
}
/* ==========================================================================
Base
========================================================================== */
.ts-input {
position: relative;
display: flex;
width: 100%;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-input input {
padding: 0 1rem;
height: var(--height);
}
.ts-input input,
.ts-input textarea {
margin: 0;
width: 100%;
overflow: visible;
font: inherit;
outline: none;
box-sizing: border-box;
resize: none;
font-size: var(--ts-font-size-14px);
line-height: 1.5;
color: var(--ts-gray-800);
background: var(--ts-gray-50);
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
appearance: none;
-webkit-appearance: none;
}
.ts-input textarea {
padding: 0.467rem 1rem;
}
.ts-input input:focus,
.ts-input textarea:focus {
outline: 0;
}
/**
* Input
*/
.ts-input input,
.ts-input textarea {
border-radius: var(--border-radius);
border: 1px solid var(--ts-gray-300);
}
.ts-input input:focus,
.ts-input textarea:focus {
border-color: var(--ts-primary-600);
}
.ts-input input::-webkit-inner-spin-button,
.ts-input input::-webkit-calendar-picker-indicator {
opacity: 0.4;
line-height: 1;
}
/**
* Color
*/
.ts-input input[type="color"] {
position: relative;
padding: 0;
aspect-ratio: 1 / 1;
overflow: hidden;
cursor: pointer;
width: auto;
}
.ts-input input[type="color"]::-webkit-color-swatch {
padding: 0;
position: absolute;
top: 4px;
left: 4px;
right: 4px;
bottom: 4px;
border: 0;
border-radius: var(--border-radius);
width: auto;
height: auto;
}
.ts-input input[type="color"]::-moz-color-swatch {
padding: 0;
position: absolute;
top: 4px;
left: 4px;
right: 4px;
bottom: 4px;
border: 0;
border-radius: var(--border-radius);
width: auto;
height: auto;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Solid
*/
.ts-input.is-solid input,
.ts-input.is-solid textarea {
border-radius: var(--border-radius);
border: 1px solid transparent;
background: var(--ts-gray-100);
}
.ts-input.is-solid input:focus,
.ts-input.is-solid textarea:focus {
background: var(--ts-gray-50);
border: 1px solid var(--ts-gray-300);
}
/**
* Underlined
*/
.ts-input.is-underlined input,
.ts-input.is-underlined textarea {
border-radius: var(--border-radius) var(--border-radius) 0 0;
border: 2px solid transparent;
background: var(--ts-gray-100);
border-bottom: 2px solid var(--ts-gray-400);
}
.ts-input.is-underlined input:focus,
.ts-input.is-underlined textarea:focus {
border-bottom-color: var(--ts-primary-600);
}
/**
* Resizable
*/
.ts-input.is-resizable input,
.ts-input.is-resizable textarea {
min-height: 5rem;
resize: vertical;
}
/**
* Circular
*/
.ts-input.is-circular {
--border-radius: 100rem;
}
/**
* Basic
*/
.ts-input.is-basic input {
padding: 0;
border: 0;
background: transparent;
}
/**
* Labeled
*/
.ts-input:is(.is-start-labeled, .is-end-labeled, .is-labeled) :is(.input, .label) {
border-radius: var(--border-radius);
}
.ts-input:is(.is-start-labeled, .is-end-labeled, .is-labeled) .label {
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
background: var(--ts-gray-100);
padding: 0 0.6rem;
font-size: var(--ts-font-size-14px);
color: var(--ts-gray-800);
border: 1px solid var(--ts-gray-300);
}
.ts-input:is(.is-start-labeled, .is-labeled) .label {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-right-width: 0;
}
.ts-input:is(.is-start-labeled, .is-labeled) input {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.ts-input:is(.is-end-labeled, .is-labeled) .label {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-left-width: 0;
}
.ts-input:is(.is-end-labeled, .is-labeled) input {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.ts-input.is-labeled .label:first-child {
border-left-width: 1px;
border-top-left-radius: var(--border-radius);
border-bottom-left-radius: var(--border-radius);
}
.ts-input.is-labeled .label:last-child {
border-right-width: 1px;
border-top-right-radius: var(--border-radius);
border-bottom-right-radius: var(--border-radius);
}
/** Underlined */
.ts-input:is(.is-start-labeled, .is-labeled, .is-end-labeled).is-underlined .label {
border: 0;
border-bottom: 2px solid var(--ts-gray-400);
background: var(--ts-gray-200);
}
.ts-input:is(.is-start-labeled, .is-labeled).is-underlined .label {
border-bottom-left-radius: 0;
}
.ts-input:is(.is-end-labeled, .is-labeled).is-underlined .label {
border-bottom-right-radius: 0;
}
.ts-input:is(.is-start-labeled, .is-labeled).is-underlined input {
border-left: 0;
}
.ts-input:is(.is-end-labeled, .is-labeled).is-underlined input {
border-right: 0;
}
/** Solid */
.ts-input:is(.is-start-labeled, .is-labeled, .is-end-labeled).is-solid .label {
border-color: transparent;
background: var(--ts-gray-200);
}
.ts-input:is(.is-start-labeled, .is-labeled, .is-end-labeled).is-solid:focus-within .label {
border-color: var(--ts-gray-300);
}
/**
* Action Icon
*/
.ts-input.is-end-action-icon :where(a, button).ts-icon {
position: absolute;
top: 0;
bottom: 0;
display: flex !important;
align-items: center;
justify-content: center;
color: var(--ts-gray-800);
z-index: 1;
}
.ts-input.is-end-action-icon :where(a, button).ts-icon {
padding: 0 1.5rem;
border-radius: var(--border-radius);
background: var(--ts-gray-100);
top: 50%;
transform: translateY(-50%);
right: 0.35rem;
padding: 0;
aspect-ratio: 1.1 / 1;
height: 75%;
width: auto;
font-size: 1em;
}
.ts-input.is-end-action-icon :where(a, button).ts-icon:hover {
opacity: 0.9;
}
.ts-input.is-end-action-icon input {
padding-right: 3rem;
box-sizing: border-box;
}
/**
* Icon
*/
.ts-input.is-start-icon .ts-icon:not(a):not(button),
.ts-input.is-end-icon .ts-icon:not(a):not(button),
.ts-input.is-icon .ts-icon:not(a):not(button) {
position: absolute;
top: 0;
bottom: 0;
display: flex !important;
align-items: center;
justify-content: center;
color: var(--ts-gray-800);
z-index: 1;
}
.ts-input.is-start-icon .ts-icon:not(a):not(button),
.ts-input.is-icon .ts-icon:not(a):not(button):first-child {
left: 1rem;
}
.ts-input.is-start-icon input,
.ts-input.is-icon input {
padding-left: 2.8rem;
box-sizing: border-box;
}
.ts-input.is-end-icon .ts-icon:not(a):not(button),
.ts-input.is-icon .ts-icon:not(a):not(button):last-child {
right: 1rem;
}
.ts-input.is-end-icon input,
.ts-input.is-icon input {
padding-right: 2.8rem;
box-sizing: border-box;
}
/**
* Negative
*/
.ts-input.is-negative :is(input, textarea) {
color: var(--ts-negative-600);
border-color: var(--ts-negative-400);
font-weight: 500;
}
.ts-input.is-negative .label {
border-color: var(--ts-negative-400);
}
/** Solid */
.ts-input.is-negative.is-solid:is(.is-start-labeled, .is-labeled, .is-end-labeled) .label {
border-color: var(--ts-negative-400);
}
.ts-input.is-negative.is-solid input:focus,
.ts-input.is-negative.is-solid textarea:focus {
background: var(--ts-gray-100);
border: 1px solid var(--ts-negative-400);
}
/** Underlined */
.ts-input.is-negative.is-underlined :is(.label, input, textarea) {
border-color: transparent;
border-bottom-color: var(--ts-negative-400);
}
/**
* Disabled
*/
.ts-input:has(:disabled),
fieldset:disabled .ts-input {
pointer-events: none;
opacity: 0.5;
user-select: none;
}
.ts-input.is-underlined:has(:disabled),
fieldset:disabled .ts-input.is-underlined {
border-bottom-color: var(--ts-gray-300);
}
/**
* Fluid
*/
.ts-input.is-fluid {
display: flex;
width: 100%;
}
.ts-input.is-fluid input,
.ts-input.is-fluid textarea {
width: 100%;
}
/**
* Dense
*/
.ts-input.is-dense input {
--height: var(--ts-input-height-medium-dense);
}
.ts-input.is-dense.is-small input {
--height: var(--ts-input-height-small-dense);
}
.ts-input.is-dense.is-large input {
--height: var(--ts-input-height-large-dense);
}
/**
* Relaxed
*/
.ts-input.is-relaxed input {
--height: var(--ts-input-height-large);
}
/**
* Sizes
*/
.ts-input.is-small input {
--height: var(--ts-input-height-small);
}
.ts-input.is-large input {
--height: var(--ts-input-height-large);
}
.ts-input.is-small :is(input, textarea, .ts-icon) {
font-size: var(--ts-font-size-13px);
}
.ts-input.is-large :is(input, textarea, .ts-icon) {
font-size: var(--ts-font-size-17px);
}
/* ==========================================================================
Data Input
========================================================================== */
.ts-taginput {
--border-radius: 0.4rem;
--height: var(--ts-input-height-medium);
}
.ts-taginput {
padding: 0.25rem 1rem;
min-height: var(--height);
border-radius: var(--border-radius);
border: 1px solid var(--ts-gray-300);
align-items: center;
display: flex;
cursor: text;
}
.ts-taginput.is-focused {
border-color: var(--ts-primary-600);
}
.ts-taginput .content {
align-items: center;
display: flex;
}
.ts-taginput .append {
margin: 0;
overflow: visible;
font: inherit;
outline: none;
/* border: none;*/
box-sizing: border-box;
resize: none;
font-size: var(--ts-font-size-14px);
line-height: 1.5;
color: var(--ts-gray-800);
background: var(--ts-gray-50);
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
appearance: none;
-webkit-appearance: none;
width: 10px;
}
.ts-taginput input:not(.append) {
display: none;
}
.ts-input[data-tocas="input-chips"] {
border: 1px solid var(--ts-gray-300);
border-radius: var(--border-radius);
min-height: var(--height);
padding: 0.25rem 1rem;
background: var(--ts-gray-50);
box-sizing: border-box;
color: var(--ts-gray-800);
font: inherit;
font-size: var(--ts-font-size-14px);
outline: none;
overflow: visible;
resize: none;
width: 100%;
cursor: text;
}
.ts-input[data-tocas="input-chips"] input:not(.append) {
display: none;
}
.ts-input[data-tocas="input-chips"] .content {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.5rem;
}
.ts-input[data-tocas="input-chips"] .content .ts-chip {
cursor: default;
user-select: none;
}
.ts-input[data-tocas="input-chips"] input.append {
border: 0;
height: auto;
line-height: 1.7;
padding: 0;
border-radius: 0;
width: 1px;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-file {
--height: var(--ts-input-height-medium);
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-file {
display: flex;
width: 100%;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-file input {
height: var(--height);
line-height: calc(var(--height) - 1px);
font-size: var(--ts-font-size-14px);
color: var(--ts-gray-800);
padding: 0 1rem;
padding-left: 0.6rem;
background: var(--ts-gray-50);
border: 1px solid var(--ts-gray-300);
border-radius: var(--ts-border-radius-element);
width: 100%;
}
.ts-file input::file-selector-button,
.ts-file input::-webkit-file-upload-button {
border: 0;
min-width: 75px;
/** Firefox */
font-family: "Noto Sans TC", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", "Microsoft JhengHei", wf_SegoeUI, "Segoe UI",
Segoe, "Segoe WP", Tahoma, Verdana, Ubuntu, "Bitstream Vera Sans", "DejaVu Sans", , "LiHei Pro", "WenQuanYi Micro Hei", "Droid Sans Fallback", "AR PL UMing TW",
Roboto, "Hiragino Maru Gothic ProN", , "ヒラギノ丸ゴ ProN W4", Meiryo, "Droid Sans", sans-serif;
font-size: var(--ts-relative-small);
line-height: 1.5;
font-weight: 500;
text-decoration: none;
display: inline-block;
text-align: center;
padding: 0.2em 0.5rem;
border-radius: var(--ts-border-radius-secondary);
margin-right: 0.5rem;
color: var(--accent-foreground-color, var(--ts-gray-800));
background: var(--accent-color, var(--ts-gray-200));
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Underlined
*/
.ts-file.is-underlined input {
border-radius: var(--ts-border-radius-element) var(--ts-border-radius-element) 0 0;
border: 2px solid transparent;
background: var(--ts-gray-100);
border-bottom: 2px solid var(--ts-gray-400);
}
/**
* Solid
*/
.ts-file.is-solid input {
background: var(--ts-gray-100);
border-color: transparent;
}
.ts-file:is(.is-solid, .is-underlined) input::file-selector-button,
.ts-file:is(.is-solid, .is-underlined) input::-webkit-file-upload-button {
background: var(--accent-color, var(--ts-gray-300));
}
/**
* Disabled
*/
.ts-file:has(:disabled),
fieldset:disabled .ts-file {
pointer-events: none;
opacity: 0.5;
user-select: none;
}
/**
* Negative
*/
.ts-file.is-negative input {
border-color: var(--ts-negative-400);
color: var(--ts-negative-600);
font-weight: 500;
}
.ts-file.is-negative.is-underlined input {
border-color: transparent;
border-bottom-color: var(--ts-negative-400);
}
/**
* Sizes
*/
.ts-file.is-small input {
--height: var(--ts-input-height-small);
}
.ts-file.is-large input {
--height: var(--ts-input-height-large);
}
.ts-file.is-small :is(input, input::file-selector-button, input::-webkit-file-upload-button) {
font-size: var(--ts-font-size-13px);
}
.ts-file.is-large :is(input, input::file-selector-button, input::-webkit-file-upload-button) {
font-size: var(--ts-font-size-17px);
}
/**
* Dense
*/
.ts-file.is-dense input {
--height: var(--ts-input-height-medium-dense);
}
.ts-file.is-dense input::file-selector-button,
.ts-file.is-dense input::-webkit-file-upload-button {
padding-top: 0.15rem;
padding-bottom: 0.15rem;
}
.ts-file.is-small.is-dense input {
--height: var(--ts-input-height-small-dense);
}
.ts-file.is-large.is-dense input {
--height: var(--ts-input-height-large-dense);
}
/* ==========================================================================
Variables
========================================================================== */
.ts-notice {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-notice {
background: var(--accent-color, var(--ts-gray-800));
border: 1px solid transparent;
color: var(--accent-foreground-color, var(--ts-gray-50));
display: block;
padding: 0.45rem 1rem;
font-size: var(--ts-font-size-14px);
border-radius: var(--ts-border-radius-element);
}
/* ==========================================================================
Structure
========================================================================== */
.ts-notice .title {
background: var(--accent-foreground-color, var(--ts-gray-50));
color: var(--accent-color, var(--ts-gray-800));
border-radius: var(--ts-border-radius-secondary);
padding: 0.3rem 0.5rem;
margin-right: 0.6rem;
margin-top: 0.05rem;
font-size: var(--ts-font-size-14px);
text-align: justify;
line-height: 1;
white-space: nowrap;
display: inline-block;
}
.ts-notice .content {
display: inline;
}
.ts-notice a {
text-decoration: underline;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Negative
*/
.ts-notice.is-negative {
background: var(--ts-negative-500);
color: var(--ts-white);
}
.ts-notice.is-negative .title {
background: var(--ts-white);
color: var(--ts-negative-600);
}
/**
* Outlined
*/
.ts-notice.is-outlined {
background: transparent;
border-color: var(--ts-gray-300);
color: var(--accent-color, var(--ts-gray-800));
}
.ts-notice.is-outlined .title {
background: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
}
.ts-notice.is-outlined.is-negative .title {
background: var(--ts-negative-500);
color: var(--ts-gray-50);
}
/**
* Sizes
*/
.ts-notice.is-small,
.ts-notice.is-small .title {
font-size: var(--ts-font-size-13px);
}
.ts-notice.is-large,
.ts-notice.is-large .title {
font-size: var(--ts-font-size-17px);
}
/**
* Dense
*/
.ts-notice.is-dense {
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
.ts-notice.is-dense .title {
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-checkbox {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-checkbox {
display: inline-flex;
align-items: flex-start;
cursor: pointer;
user-select: none;
color: inherit;
vertical-align: middle;
margin-top: -3px;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-checkbox input {
position: relative;
border: none;
margin: 0;
padding: 0;
width: auto;
overflow: visible;
background: transparent;
color: inherit;
font: inherit;
line-height: normal;
border-radius: 0;
outline: none;
box-sizing: border-box;
user-select: none;
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
appearance: none;
-webkit-appearance: none;
}
.ts-checkbox input {
min-height: 1.15rem;
min-width: 1.15rem;
margin-top: 5px;
border-radius: var(--ts-border-radius-secondary);
border: 1px solid var(--ts-gray-200);
background: var(--ts-gray-200);
margin-right: 0.5rem;
cursor: pointer;
}
.ts-checkbox input:checked {
background: var(--accent-color, var(--ts-primary-700));
border-color: var(--accent-color, var(--ts-primary-700));
}
.ts-checkbox input:focus {
outline: 0;
}
.ts-checkbox input::after {
position: absolute;
display: none;
content: "\f00c";
font-family: "Icons";
font-weight: normal;
font-style: normal;
text-decoration: inherit;
text-align: center;
left: 0;
right: 0;
bottom: 0;
top: 0;
transform: scale(0.8);
z-index: 1;
align-items: center;
justify-content: center;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
font-size: 1rem;
color: var(--accent-foreground-color, var(--ts-white));
}
.ts-checkbox input:checked::after {
display: flex;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Disabled
*/
.ts-checkbox:has(:disabled),
fieldset:disabled .ts-checkbox {
pointer-events: none;
opacity: 0.5;
user-select: none;
}
.ts-checkbox input:disabled,
fieldset:disabled .ts-checkbox input {
background: var(--ts-gray-200);
border-color: var(--ts-gray-200);
}
/**
* Solo
*/
.ts-checkbox.is-solo input {
margin-right: 0;
margin-top: 0;
}
/**
* Negative
*/
.ts-checkbox.is-negative input {
border-color: var(--ts-negative-600);
border-width: 2px;
}
/**
* Indeterminate
*/
.ts-checkbox.is-indeterminate input::after {
content: "\f068";
}
/**
* Sizes
*/
.ts-checkbox.is-small input {
min-height: 0.95rem;
min-width: 0.95rem;
}
.ts-checkbox.is-small input::after {
font-size: var(--ts-font-size-12px);
}
.ts-checkbox.is-small {
font-size: var(--ts-font-size-14px);
}
.ts-checkbox.is-large input {
min-height: 1.3rem;
min-width: 1.3rem;
}
.ts-checkbox.is-large {
font-size: var(--ts-font-size-17px);
}
.ts-checkbox.is-large input::after {
font-size: var(--ts-font-size-16px);
}
/* ==========================================================================
Variables
========================================================================== */
.ts-radio {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-radio {
display: inline-flex;
align-items: flex-start;
cursor: pointer;
user-select: none;
color: inherit;
vertical-align: middle;
margin-top: -3px;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-radio input {
border: none;
margin: 0;
padding: 0;
width: auto;
overflow: visible;
background: transparent;
color: inherit;
font: inherit;
line-height: normal;
border-radius: 0;
outline: none;
box-sizing: border-box;
user-select: none;
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
appearance: none;
-webkit-appearance: none;
}
.ts-radio input {
position: relative;
min-height: 1.15rem;
min-width: 1.15rem;
margin-top: 5px;
border-radius: 100rem;
border: 1px solid var(--ts-gray-200);
background: var(--ts-gray-200);
margin-right: 0.5rem;
cursor: pointer;
}
.ts-radio input:checked {
background: var(--accent-color, var(--ts-primary-700));
background: var(--accent-color, var(--ts-primary-700));
}
.ts-radio input:focus {
outline: 0;
}
.ts-radio input::after {
position: absolute;
display: none;
content: "\f111";
font-family: "Icons";
font-weight: normal;
font-style: normal;
text-decoration: inherit;
text-align: center;
left: 0;
right: 0;
bottom: 0;
top: 0;
transform: scale(0.5);
z-index: 1;
align-items: center;
justify-content: center;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
font-size: 1rem;
color: var(--accent-foreground-color, var(--ts-white));
}
.ts-radio input:checked::after {
display: flex;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Disabled
*/
.ts-radio:has(:disabled),
fieldset:disabled .ts-radio {
pointer-events: none;
opacity: 0.5;
user-select: none;
}
.ts-radio input:disabled,
fieldset:disabled .ts-radio input {
background: var(--ts-gray-200);
border-color: var(--ts-gray-200);
}
/**
* Solo
*/
.ts-radio.is-solo input {
margin-right: 0;
margin-top: 0;
}
/**
* Negative
*/
.ts-radio.is-negative input {
border-color: var(--ts-negative-600);
border-width: 2px;
}
/**
* Sizes
*/
.ts-radio.is-small input {
min-height: 0.95rem;
min-width: 0.95rem;
}
.ts-radio.is-small input::after {
font-size: var(--ts-font-size-14px);
}
.ts-radio.is-small {
font-size: var(--ts-font-size-14px);
}
.ts-radio.is-large input {
min-height: 1.3rem;
min-width: 1.3rem;
}
.ts-radio.is-large {
font-size: var(--ts-font-size-17px);
}
.ts-radio.is-large input::after {
font-size: var(--ts-font-size-18px);
}
/* ==========================================================================
Variables
========================================================================== */
@keyframes ts-progress-active {
from {
opacity: 0.8;
width: 0%;
}
to {
opacity: 0;
width: 100%;
}
}
@keyframes ts-progress-animation {
from {
background-position: 0px;
}
to {
background-position: 40px;
}
}
@keyframes ts-progress-indeterminate {
0% {
margin-left: -10%;
margin-right: 100%;
}
40% {
margin-left: 25%;
margin-right: 0%;
}
100% {
margin-left: 100%;
margin-right: 0;
}
}
.ts-progress {
--accent-color: initial;
--accent-foreground-color: initial;
}
.ts-progress .bar {
--value: 0;
}
/* ==========================================================================
Base
========================================================================== */
.ts-progress {
position: relative;
display: flex;
border-radius: var(--ts-border-radius-element);
background: var(--ts-gray-300);
overflow: hidden;
min-height: 1.6rem;
line-height: 1;
}
.ts-progress .bar {
position: relative;
display: inline-flex;
align-items: center;
justify-content: flex-end;
background: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
padding: 0rem 0.5rem;
font-size: var(--ts-font-size-14px);
border-radius: var(--ts-border-radius-element);
min-width: fit-content;
text-align: right;
transition: width 1s ease-out;
width: calc(var(--value) * 1%);
z-index: 1;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Active
*/
.ts-progress.is-active .bar::after {
position: absolute;
top: 0;
bottom: 0;
left: 0;
content: "";
background: #5a5a5a;
border-radius: var(--ts-border-radius-element);
animation: ts-progress-active 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
/**
* Empty
*/
.ts-progress.is-empty .bar {
background: transparent;
color: var(--ts-gray-800);
}
/**
* Processing
*/
.ts-progress.is-processing {
background-size: 40px 40px;
background-image: linear-gradient(135deg, #9e9e9e 25%, #949494 25%, #949494 50%, #9e9e9e 50%, #9e9e9e 75%, #949494 75%, #949494 100%);
animation: ts-progress-animation 2s linear 0s infinite;
}
/**
* Indeterminate
*/
.ts-progress.is-indeterminate .bar {
animation: ts-progress-indeterminate 2s cubic-bezier(0.4, 0, 0.2, 1) 0s infinite;
width: 100% !important;
min-width: 0;
}
.ts-progress.is-indeterminate .bar .text {
visibility: hidden;
}
/**
* Queried
*/
.ts-progress.is-queried .bar {
animation: ts-progress-indeterminate 2s cubic-bezier(0.4, 0, 0.2, 1) 0s infinite;
animation-direction: reverse;
width: 100% !important;
min-width: 0;
}
.ts-progress.is-queried .bar .text {
visibility: hidden;
}
/**
* Secondary
*/
.ts-progress .bar.is-secondary {
position: absolute;
top: 0;
bottom: 0;
z-index: 0;
background: var(--ts-gray-400);
color: var(--ts-gray-800);
}
/**
* Sizes
*/
.ts-progress.is-tiny {
min-height: 0.7rem;
}
.ts-progress.is-tiny .bar .text {
font-size: 0.8em;
}
.ts-progress.is-small {
min-height: 1.2rem;
}
.ts-progress.is-small .bar .text {
font-size: 0.85em;
}
.ts-progress.is-large .bar {
min-height: calc(1.75rem + 1.75rem / 4);
}
/* ==========================================================================
Variables
========================================================================== */
.ts-badge {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-badge {
font-size: var(--ts-font-size-14px);
border-radius: 100rem;
padding: 0.225rem 0.5rem;
line-height: 1;
border: 1px solid transparent;
background: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
font-weight: 400;
display: inline-block;
white-space: nowrap;
text-decoration: none;
vertical-align: middle;
align-self: center;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Secondary
*/
.ts-badge.is-secondary {
background: var(--ts-gray-200);
color: var(--accent-color, var(--ts-gray-800));
}
/**
* Outlined
*/
.ts-badge.is-outlined {
background: transparent;
border-color: var(--ts-gray-300);
color: var(--accent-color, var(--ts-gray-800));
}
/**
* Negative
*/
.ts-badge.is-negative {
background: var(--ts-negative-500);
color: var(--ts-white);
}
.ts-badge.is-negative.is-outlined {
background: transparent;
border-color: var(--ts-negative-500);
color: var(--ts-negative-700);
}
/**
* Sizes
*/
.ts-badge.is-small {
font-size: var(--ts-font-size-12px);
}
.ts-badge.is-large {
font-size: var(--ts-font-size-16px);
}
/**
* Dense
*/
.ts-badge.is-dense {
padding-top: 0.125rem;
padding-bottom: 0.125rem;
}
/**
* Spaced
*/
.ts-badge.is-spaced {
margin-left: 0.45rem;
margin-right: 0.45rem;
}
.ts-badge.is-start-spaced {
margin-left: 0.45rem;
}
.ts-badge.is-end-spaced {
margin-right: 0.45rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-pagination {
--accent-color: initial;
--accent-foreground-color: initial;
--horizontal-padding-multiplier: 1;
}
/* ==========================================================================
Base
========================================================================== */
.ts-pagination {
background: var(--ts-gray-200);
display: inline-flex;
padding: 0.25rem 0.5rem;
border-radius: 100rem;
color: var(--ts-gray-800);
border: 1px solid var(--ts-gray-200);
gap: calc(0.15rem * var(--horizontal-padding-multiplier));
}
/* ==========================================================================
Structure
========================================================================== */
.ts-pagination .item {
border-radius: 100rem;
padding: 0.5rem 0.7rem;
line-height: 1;
color: var(--ts-gray-800);
cursor: pointer;
text-decoration: none;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Active
*/
.ts-pagination .item.is-active {
background: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
pointer-events: none;
}
/**
* Relaxed
*/
.ts-pagination.is-relaxed {
--horizontal-padding-multiplier: 2;
}
/**
* Skipped
*/
.ts-pagination .item.is-skipped {
padding: 0.5rem 0rem;
color: var(--ts-gray-600);
pointer-events: none;
}
.ts-pagination .item.is-skipped::after {
display: inline-block;
content: "...";
}
/**
* Fluid
*/
.ts-pagination.is-fluid {
display: flex;
}
/**
* Disabled
*/
.ts-pagination .item.is-disabled,
.ts-pagination .item:disabled {
opacity: 0.5;
pointer-events: none;
user-select: none;
}
/**
* Aligns
*/
/*.ts-pagination.is-end-aligned {
margin-left: auto;
}*/
/**
* Next & Back
*/
.ts-pagination .item.is-back,
.ts-pagination .item.is-next,
.ts-pagination .item.is-first,
.ts-pagination .item.is-last {
font-family: "Icons";
font-weight: normal;
font-style: normal;
text-decoration: inherit;
text-align: center;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
.ts-pagination .item.is-back::before,
.ts-pagination .item.is-next::after,
.ts-pagination .item.is-first::before,
.ts-pagination .item.is-last::after {
font-size: 13px;
}
.ts-pagination .item.is-back::before {
content: "\f053";
}
.ts-pagination .item.is-next {
margin-left: auto;
}
.ts-pagination .item.is-next::after {
content: "\f054";
}
.ts-pagination .item.is-first::before {
content: "\f048";
}
.ts-pagination .item.is-last::after {
content: "\f051";
}
/**
* Secondary
*/
.ts-pagination.is-secondary {
padding: 0;
background: transparent;
border-color: transparent;
}
/**
* Outlined
*/
.ts-pagination.is-outlined {
padding: 0;
background: transparent;
border-color: transparent;
gap: calc(0.45rem * var(--horizontal-padding-multiplier));
}
.ts-pagination.is-outlined .item {
border: 1px solid var(--ts-gray-300);
}
.ts-pagination.is-outlined .item:is(.is-back, .is-next, .is-first, .is-last, .is-skipped) {
border: 0;
}
.ts-pagination.is-outlined .item.is-active {
background: inherit;
color: inherit;
font-weight: 500;
border-color: transparent;
}
/**
* Sizes
*/
.ts-pagination.is-small {
font-size: var(--ts-font-size-13px);
}
.ts-pagination.is-large {
font-size: var(--ts-font-size-17px);
}
/**
* Dense
*/
.ts-pagination.is-dense {
padding-top: 0.15rem;
padding-bottom: 0.15rem;
}
.ts-pagination.is-dense .item {
padding-top: 0.3rem;
padding-bottom: 0.3rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-select {
--object-distance-vertical: 0.4rem;
--object-distance-horizontal: 0.8rem;
--height: var(--ts-input-height-medium);
}
/* ==========================================================================
Base
========================================================================== */
.ts-select {
position: relative;
display: inline-flex;
background: var(--ts-gray-50);
border: 1px solid var(--ts-gray-300);
border-radius: var(--ts-border-radius-element);
cursor: pointer;
height: var(--height);
}
/* ==========================================================================
Structure
========================================================================== */
.ts-select select {
border: none;
margin: 0;
background: inherit;
font: inherit;
outline: none;
box-sizing: border-box;
user-select: none;
border-radius: var(--ts-border-radius-element);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
appearance: none;
-webkit-appearance: none;
}
.ts-select select:focus {
outline: 0;
}
.ts-select select,
.ts-select .content {
line-height: 1.5;
font-size: var(--ts-font-size-14px);
color: var(--ts-gray-800);
padding: 0 1rem;
padding-right: 2.5rem;
width: 100%;
cursor: pointer;
}
.ts-select .content {
user-select: none;
display: flex;
gap: var(--object-distance-vertical) var(--object-distance-horizontal);
align-items: center;
overflow: hidden;
}
.ts-select .content,
.ts-select .content * {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
flex-shrink: 0;
}
.ts-select .content .ts-icon {
font-size: 1.1em;
}
.ts-select select option {
background: inherit;
}
.ts-select::after {
pointer-events: none;
position: absolute;
top: 0;
right: 1rem;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
color: var(--ts-gray-600);
font-family: "Icons";
font-weight: normal;
font-style: normal;
text-decoration: inherit;
text-align: center;
width: 1.18em;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
content: "\f078";
font-size: 13px;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Relaxed
*/
.ts-select.is-relaxed {
--height: var(--ts-input-height-large);
}
/**
* Multiple
*/
.ts-select:has(select[multiple]) {
height: auto;
}
.ts-select:has(select[multiple])::after {
content: none;
}
.ts-select select[multiple] {
padding: 0.5rem 0.5rem;
overflow-y: auto;
}
.ts-select select[multiple] option {
border-radius: var(--ts-border-radius-element);
padding: 0.3rem 0.5rem;
margin: 0.1rem 0;
}
.ts-select select[multiple] option:checked {
background: var(--ts-primary-700);
color: var(--ts-white);
}
/**
* Solid
*/
.ts-select.is-solid {
background: var(--ts-gray-100);
border-color: transparent;
}
/** Focus */
.ts-select:focus-within {
border-color: var(--ts-primary-600);
}
/**
* Underlined
*/
.ts-select.is-underlined {
border-radius: var(--ts-border-radius-element) var(--ts-border-radius-element) 0 0;
border: 2px solid transparent;
background: var(--ts-gray-100);
border-bottom: 2px solid var(--ts-gray-400);
}
.ts-select.is-underlined select option {
background: var(--ts-gray-50);
}
.ts-select.is-underlined:focus-within {
border-bottom-color: var(--ts-primary-600);
}
/**
* Active
*/
.ts-select.is-active {
border-color: var(--ts-primary-600);
}
/** If select is-active then open child .ts-dropdown also */
.ts-select.is-active .ts-dropdown {
display: inline-flex;
}
.ts-select.is-underlined.is-active {
border-color: transparent;
border-bottom-color: var(--ts-primary-600);
}
/**
* Basic
*/
.ts-select.is-basic {
padding: 0;
background: transparent;
border-color: transparent;
min-height: initial;
}
.ts-select.is-basic select,
.ts-select.is-basic .content {
line-height: 1;
padding: 0 1.4rem 0 0;
}
.ts-select.is-basic::after {
right: 0;
font-size: 12px;
padding-top: 2px;
}
/**
* Disabled
*/
.ts-select.is-disabled,
.ts-select:has(:disabled) {
pointer-events: none;
opacity: 0.5;
user-select: none;
}
/**
* Fluid
*/
ts-select.is-fluid,
.ts-select.is-fluid {
width: 100%;
}
/**
* Negative
*/
.ts-select.is-negative {
border-color: var(--ts-negative-400);
}
.ts-select.is-negative select {
color: var(--ts-negative-600);
font-weight: 500;
}
.ts-select.is-negative.is-underlined {
border-color: transparent;
border-bottom-color: var(--ts-negative-400);
}
/**
* Sizes
*/
.ts-select.is-small {
--height: var(--ts-input-height-small);
}
.ts-select.is-large {
--height: var(--ts-input-height-large);
}
.ts-select.is-small select {
font-size: var(--ts-font-size-13px);
}
.ts-select.is-large select {
font-size: var(--ts-font-size-17px);
}
/**
* Dense
*/
.ts-select.is-dense {
--height: var(--ts-input-height-medium-dense);
}
.ts-select.is-dense.is-small {
--height: var(--ts-input-height-small-dense);
}
.ts-select.is-dense.is-large {
--height: var(--ts-input-height-large-dense);
}
/**
* Wrappable
*/
.ts-select.is-wrappable {
min-height: var(--height);
height: auto;
padding: 0.184em 0;
}
.ts-select.is-wrappable .content {
flex-wrap: wrap;
}
.ts-select.is-wrappable::after {
top: 0.5em;
bottom: initial;
}
/* ==========================================================================
Enhanced
========================================================================== */
ts-select {
display: inline-block;
}
ts-select.is-fluid {
display: block;
}
.ts-select[data-tocas="input-select"] select {
display: none;
}
.ts-select[data-tocas="input-combo"] {
cursor: text;
}
.ts-select[data-tocas="input-combo"] select {
display: none;
}
.ts-select input.append {
border: 0;
position: absolute;
left: 0;
right: 0;
bottom: 0;
top: 0;
color: var(--ts-gray-800);
font-size: var(--ts-font-size-14px);
padding: 0 2.5rem 0 0.9rem;
width: 100%;
z-index: 1;
background: transparent;
outline: none;
}
.ts-select .content.is-ghosting {
opacity: 0.5;
}
.ts-select .content.is-hidden {
visibility: hidden;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-fieldset {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-fieldset {
border: 1px solid var(--accent-color, var(--ts-gray-300));
border-radius: var(--ts-border-radius-element);
padding: 1rem;
padding-top: 0.5rem;
color: inherit;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-fieldset legend {
color: var(--accent-color, var(--ts-gray-600));
padding: 0 0.7em;
margin-left: -0.7em;
font-weight: normal;
pointer-events: none;
user-select: none;
}
/**
* Dense
*/
.ts-fieldset.is-dense {
padding-bottom: 0.5rem;
padding-top: 0.25rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-text {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-text {
color: var(--accent-color, inherit);
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Editable
*/
.ts-text.is-editable {
text-decoration-style: dotted;
text-decoration-line: underline;
text-decoration-color: var(--ts-gray-500);
cursor: pointer;
}
/**
* Line Clamps
*/
.ts-text:is(.is-1-lines, .is-2-lines, .is-3-lines, .is-4-lines, .is-5-lines) {
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
word-break: break-all;
}
.ts-text.is-1-lines {
-webkit-line-clamp: 1;
}
.ts-text.is-2-lines {
-webkit-line-clamp: 2;
}
.ts-text.is-3-lines {
-webkit-line-clamp: 3;
}
.ts-text.is-4-lines {
-webkit-line-clamp: 4;
}
.ts-text.is-5-lines {
-webkit-line-clamp: 5;
}
/**
* Secondary
*/
.ts-text.is-secondary {
color: var(--ts-gray-500);
}
/**
* Bold
*/
.ts-text.is-bold {
font-weight: 500 !important;
}
/**
* Heavy
*/
.ts-text.is-heavy {
font-weight: bold !important;
}
/**
* Italic
*/
.ts-text.is-italic {
font-style: italic !important;
}
/**
* Deleted
*/
.ts-text.is-deleted {
text-decoration: line-through !important;
}
/**
* Underlined
*/
.ts-text.is-underlined {
text-decoration: underline !important;
}
/**
* Link
*/
.ts-text.is-link.is-link.is-link {
color: var(--accent-color, var(--ts-link-700));
}
.ts-text.is-link {
text-decoration: underline;
}
.ts-text.is-link:hover {
color: inherit;
}
.ts-text.is-link:active {
color: inherit;
}
.ts-text.is-link:visited {
color: inherit;
}
/**
* Undecorated
*/
.ts-text.is-undecorated {
text-decoration: none;
}
.ts-text.is-undecorated:hover {
text-decoration: underline;
}
/**
* Icon Link
*/
.ts-text.is-icon-link {
display: flex;
gap: 0.25rem;
}
/**
* External Link
*/
.ts-text.is-external-link::after {
font-family: "Icons";
font-weight: normal;
font-style: normal;
display: inline;
text-decoration: inherit;
text-align: center;
width: 1.18em;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
content: "\f35d";
font-size: 0.8em;
margin-left: 0.25rem;
}
/**
* Code
*/
.ts-text.is-code {
border-radius: var(--ts-border-radius-secondary);
background: var(--ts-gray-200);
padding: 0 0.2rem;
font-size: var(--ts-font-size-14px);
color: var(--ts-gray-800);
}
/**
* Mark
*/
.ts-text.is-mark {
border-radius: var(--ts-border-radius-secondary);
background: var(--ts-warning-500);
padding: 0 0.25rem;
color: var(--ts-black);
font-size: var(--ts-font-size-14px);
}
/**
* Key
*/
.ts-text.is-key {
border-radius: var(--ts-border-radius-secondary);
background: var(--ts-gray-100);
padding: 0 0.35rem;
color: var(--ts-gray-800);
border-bottom: 3px solid var(--ts-gray-300);
font-size: var(--ts-font-size-14px);
}
/**
* Sup
*/
.ts-text.is-sup {
font-size: 12px;
vertical-align: top;
opacity: 0.8;
}
/**
* Sub
*/
.ts-text.is-sub {
font-size: 12px;
vertical-align: bottom;
opacity: 0.8;
}
/**
* Truncated
*/
.ts-text.is-truncated {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
display: block;
}
/**
* Uppercased
*/
.ts-text.is-uppercased {
text-transform: uppercase;
}
/**
* Lowercased
*/
.ts-text.is-lowercased {
text-transform: lowercase;
}
/**
* Aligns
*/
.ts-text.is-center-aligned {
text-align: center;
}
.ts-text.is-start-aligned {
text-align: left;
}
.ts-text.is-end-aligned {
text-align: right;
}
.ts-text.is-justify-aligned {
text-align: justify;
}
/**
* Label
*/
.ts-text.is-label {
font-weight: 500;
color: var(--ts-gray-800);
font-size: var(--ts-font-size-14px);
line-height: 1;
}
/**
* Description
*/
.ts-text.is-description {
color: var(--ts-gray-500);
font-size: var(--ts-font-size-14px);
}
/**
* Disabled
*/
.ts-text.is-disabled {
opacity: 0.5;
pointer-events: none;
user-select: none;
}
/**
* Required
*/
.ts-text.is-required::after {
content: " *";
font-weight: bold;
color: var(--ts-negative-600);
}
/**
* Sizes
*/
.ts-text.is-tiny {
font-size: var(--ts-font-size-13px);
}
.ts-text.is-small {
font-size: var(--ts-font-size-14px);
}
.ts-text.is-medium {
font-size: var(--ts-font-size-15px);
}
.ts-text.is-large {
font-size: var(--ts-font-size-17px);
}
.ts-text.is-big {
font-size: var(--ts-font-size-20px);
}
.ts-text.is-huge {
font-size: var(--ts-font-size-24px);
}
.ts-text.is-massive {
font-size: var(--ts-font-size-30px);
}
/**
* Negative
*/
.ts-text.is-negative {
color: var(--ts-negative-600);
}
.ts-text.is-negative.is-secondary {
color: var(--ts-negative-500);
}
/* ==========================================================================
Variables
========================================================================== */
.ts-tab {
--horizontal-padding-multiplier: 1;
--vertical-padding-multiplier: 1;
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-tab {
margin-bottom: -1px; /** For border merge */
user-select: none;
display: flex;
flex-wrap: wrap;
z-index: 1; /** For cover divider */
}
/* ==========================================================================
Structure
========================================================================== */
.ts-tab .item {
text-decoration: none;
color: var(--ts-gray-800);
padding: calc(0.5rem * var(--vertical-padding-multiplier)) calc(1rem * var(--horizontal-padding-multiplier));
display: inline-flex;
border-bottom: 3px solid transparent;
text-align: center;
justify-content: center;
cursor: pointer;
gap: 0.5rem;
line-height: 1.8;
align-items: center;
}
.ts-tab .ts-icon {
font-size: 1.1em;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Active
*/
.ts-tab .item.is-active {
border-bottom-color: var(--accent-color, var(--ts-gray-800));
cursor: default;
}
/**
* Disabled
*/
.ts-tab .item:disabled,
.ts-tab .item.is-disabled {
opacity: 0.5;
pointer-events: none;
user-select: none;
}
/**
* Evenly Divided (Use Fluid instead)
*/
/*.ts-tab.is-evenly-divided .item {
flex: 1;
}*/
/**
* Pilled
*/
.ts-tab.is-pilled .item {
border-radius: 100rem;
padding: calc(0.25rem * var(--vertical-padding-multiplier)) calc(1rem * var(--horizontal-padding-multiplier));
border-bottom: 0;
}
.ts-tab.is-pilled .item.is-active {
background: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
}
.ts-tab.is-pilled.is-secondary .item.is-active {
background: var(--ts-gray-200);
color: var(--accent-color, var(--ts-gray-800));
}
/**
* Aligns
*/
.ts-tab.is-start-aligned {
justify-content: flex-start;
}
.ts-tab.is-center-aligned {
justify-content: center;
}
.ts-tab.is-end-aligned {
justify-content: flex-end;
}
/**
* Short Indicated
*/
.ts-tab.is-short-indicated {
gap: calc(1.6rem * var(--horizontal-padding-multiplier));
}
.ts-tab.is-short-indicated .item {
padding-left: 0;
padding-right: 0;
}
/**
* Very Short Indicated
*/
.ts-tab.is-very-short-indicated {
gap: calc(1.6rem * var(--horizontal-padding-multiplier));
cursor: pointer;
}
.ts-tab.is-very-short-indicated .item.is-active {
border-bottom-color: transparent;
}
.ts-tab.is-very-short-indicated .item {
padding-left: 0;
padding-right: 0;
}
.ts-tab.is-very-short-indicated .item {
position: relative;
}
.ts-tab.is-very-short-indicated .item.is-active::after {
position: absolute;
background: var(--accent-color, var(--ts-gray-800));
bottom: -3px;
content: "";
height: 3px;
left: 50%;
transform: translateX(-50%);
width: 16px;
}
/**
* Segmented
*/
.ts-tab.is-segmented {
--height: var(--ts-input-height-medium);
border: 1px solid var(--ts-gray-300);
border-radius: var(--ts-border-radius-element);
display: inline-flex;
align-items: center;
padding: 0 0.25rem;
height: var(--height);
}
.ts-tab.is-segmented .item {
padding: 0.45rem calc(0.9rem * var(--horizontal-padding-multiplier));
border-radius: var(--ts-border-radius-secondary);
user-select: none;
line-height: 1;
border-bottom: 0;
}
.ts-tab.is-segmented .item.is-active {
background: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
}
/**
* Fluid
*/
.ts-tab.is-fluid {
display: flex;
}
.ts-tab.is-fluid .item {
flex: 1;
}
/**
* Tall
*/
.ts-tab.is-tall {
--vertical-padding-multiplier: 1.6;
}
/**
* Sizes
*/
.ts-tab.is-small .item {
font-size: var(--ts-font-size-14px);
}
.ts-tab.is-large .item {
font-size: var(--ts-font-size-17px);
}
.ts-tab.is-small.is-segmented {
--height: var(--ts-input-height-small);
}
.ts-tab.is-large.is-segmented {
--height: var(--ts-input-height-large);
}
/**
* Dense
*/
.ts-tab.is-dense .item {
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
.ts-tab.is-dense.is-segmented .item {
padding-top: 0.35rem;
padding-bottom: 0.35rem;
}
.ts-tab.is-dense.is-pilled .item {
padding-top: 0.05rem;
padding-bottom: 0.05rem;
}
.ts-tab.is-segmented.is-dense {
--height: var(--ts-input-height-medium-dense);
}
.ts-tab.is-segmented.is-small.is-dense {
--height: var(--ts-input-height-small-dense);
}
.ts-tab.is-segmented.is-large.is-dense {
--height: var(--ts-input-height-large-dense);
}
/**
* Relaxed
*/
.ts-tab.is-relaxed {
--horizontal-padding-multiplier: 1.6;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-box {
--accent-color: initial;
--accent-foreground-color: initial;
--ts-indicator-color: var(--accent-color, var(--ts-gray-900));
}
/* ==========================================================================
Base
========================================================================== */
.ts-box {
display: block;
position: relative;
text-decoration: none;
color: inherit;
border: 1px solid var(--ts-gray-300);
border-radius: var(--ts-border-radius-container);
overflow: hidden;
background: var(--ts-gray-50);
}
a.ts-box:hover {
border-color: var(--ts-gray-400);
}
/* ==========================================================================
Structure
========================================================================== */
.ts-box .symbol .ts-icon {
position: absolute;
right: 0;
bottom: 0;
overflow: hidden;
width: 0.8em;
height: 0.8em;
margin-left: 0;
margin-right: 0;
pointer-events: none;
font-size: 8em;
line-height: 1.1em;
opacity: 0.1;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Horizontal
*/
.ts-box.is-horizontal {
display: flex;
flex-direction: row;
}
/**
* Collapsed
*/
.ts-box.is-collapsed {
width: fit-content;
}
/**
* Indicated
*/
.ts-box.is-top-indicated {
border-top: 3px solid var(--ts-indicator-color);
}
.ts-box.is-bottom-indicated {
border-bottom: 3px solid var(--ts-indicator-color);
}
.ts-box.is-left-indicated {
border-left: 3px solid var(--ts-indicator-color);
}
.ts-box.is-right-indicated {
border-right: 3px solid var(--ts-indicator-color);
}
/**
* Emphasises
*/
.ts-box[class*="-indicated"].is-negative {
--ts-indicator-color: var(--ts-negative-500);
}
.ts-box[class*="-indicated"].is-positive {
--ts-indicator-color: var(--ts-positive-500);
}
.ts-box[class*="-indicated"].is-warning {
--ts-indicator-color: var(--ts-warning-500);
}
/**
* Elevated
*/
.ts-box.is-elevated {
box-shadow: var(--ts-elevated-shadow);
}
/**
* Squared
*/
.ts-box.is-squared {
border-radius: 0;
}
/**
* Hollowed
*/
.ts-box.is-hollowed {
border: 4px dashed var(--ts-gray-300);
background: transparent;
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-content {
padding: 1rem 1rem;
color: inherit;
display: block;
text-decoration: none;
box-sizing: border-box;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Fitted
*/
.ts-content.is-fitted {
padding: 0;
}
.ts-content.is-vertically-fitted {
padding-top: 0;
padding-bottom: 0;
}
.ts-content.is-horizontally-fitted {
padding-left: 0;
padding-right: 0;
}
/**
* Dark
*/
.ts-content.has-dark {
background: var(--ts-gray-50);
color: var(--ts-gray-800);
}
/**
* Secondary
*/
.ts-content.is-secondary {
background: var(--ts-gray-75);
}
/**
* Tertiary
*/
.ts-content.is-tertiary {
background: var(--ts-gray-100);
}
/**
* Aligns
*/
.ts-content.is-start-aligned {
text-align: left;
}
.ts-content.is-end-aligned {
text-align: right;
}
.ts-content.is-center-aligned {
text-align: center;
}
/**
* Interactive
*/
.ts-content.is-interactive {
display: block;
text-decoration: none;
}
.ts-content.is-interactive:hover {
cursor: pointer;
}
.ts-content.is-interactive:hover:not(.is-active) {
background: var(--ts-gray-75);
}
/**
* Active
*/
.ts-content.is-active {
background: var(--ts-gray-200);
}
/**
* Disabled
*/
.ts-content.is-disabled {
opacity: 0.5;
pointer-events: none;
user-select: none;
}
/**
* Rounded
*/
.ts-content.is-rounded {
border-radius: var(--ts-border-radius-container);
}
/**
* Padded
*/
.ts-content.is-padded {
padding: 1.5rem;
}
.ts-content.is-horizontally-padded {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
.ts-content.is-vertically-padded {
padding-top: 1.5rem;
padding-bottom: 1.5rem;
}
.ts-content.is-very-padded {
padding: 3.5rem;
}
.ts-content.is-horizontally-very-padded {
padding-left: 3.5rem;
padding-right: 3.5rem;
}
.ts-content.is-vertically-very-padded {
padding-top: 3.5rem;
padding-bottom: 3.5rem;
}
/**
* Compact
*/
.ts-content.is-compact {
padding: 0.5rem;
}
/**
* Dense
*/
.ts-content.is-dense {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-image {
position: relative;
display: inline-block;
max-width: 100%;
vertical-align: top;
text-decoration: none;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-image img {
vertical-align: top;
}
:where(.ts-image img:not([width])) {
width: 100%;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Circular
*/
.ts-image.is-circular img {
border-radius: 100rem !important;
}
/**
* Disabled
*/
.ts-image.is-disabled img {
opacity: 0.5;
pointer-events: none;
}
/**
* Rounded
*/
.ts-image.is-rounded img {
border-radius: var(--ts-border-radius-element) !important;
}
/**
* Bordered
*/
.ts-image.is-bordered img {
border: 1px solid var(--ts-gray-300);
}
/**
* Covered
*/
.ts-image.is-covered img {
object-fit: cover;
}
/**
* Full
*/
.ts-image.is-full-width,
.ts-image.is-full-width img {
width: 100%;
}
.ts-image.is-full-height,
.ts-image.is-full-height img {
height: 100%;
}
/**
* Centered
*/
.ts-image.is-centered {
display: block;
}
.ts-image.is-centered img {
display: block;
margin-left: auto;
margin-right: auto;
}
/**
* Spaced
*/
.ts-image.is-spaced {
margin-left: 0.45rem;
margin-right: 0.45rem;
}
.ts-image.is-start-spaced {
margin-left: 0.45rem;
}
.ts-image.is-end-spaced {
margin-right: 0.45rem;
}
/**
* Aspect Ratio
*/
.ts-image.is-1-by-1 img {
aspect-ratio: 1 / 1;
}
.ts-image.is-4-by-3 img {
aspect-ratio: 4 / 3;
}
.ts-image.is-16-by-9 img {
aspect-ratio: 16 / 9;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-switch {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-switch {
display: inline-flex;
align-items: flex-start;
cursor: pointer;
user-select: none;
color: inherit;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-switch input {
position: relative;
appearance: none;
-webkit-appearance: none;
cursor: pointer;
margin: 0;
margin-right: 0.5rem;
margin-top: 3px;
}
.ts-switch input::after {
display: block;
content: "";
height: 22px;
width: 38px;
border-radius: 100rem;
background: var(--ts-gray-300);
transition: background 0.1s ease;
}
.ts-switch input::before {
position: absolute;
display: block;
content: "";
height: 15px;
width: 15px;
border-radius: 100rem;
top: 3.5px;
left: 4px;
background: var(--ts-white);
transition: left 0.1s ease;
z-index: 1;
}
.ts-switch input:checked::after {
background: var(--accent-color, var(--ts-primary-700));
}
.ts-switch input:checked::before {
background: var(--accent-foreground-color, var(--ts-white));
left: 19px;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Disabled
*/
.ts-switch:has(:disabled),
fieldset:disabled .ts-switch {
opacity: 0.5;
pointer-events: none;
user-select: none;
}
/**
* Solo
*/
.ts-switch.is-solo input {
margin-right: 0;
margin-top: 0;
}
/**
* Negative
*/
.ts-switch.is-negative input {
border-radius: 100rem;
border: 2px solid var(--ts-negative-600);
}
/**
* Sizes
*/
.ts-switch.is-small {
font-size: var(--ts-font-size-14px);
}
.ts-switch.is-small input::after {
height: 19px;
width: 31px;
}
.ts-switch.is-small input::before {
height: 12px;
width: 12px;
top: 3.5px;
}
.ts-switch.is-small input:checked::before {
left: 15px;
}
.ts-switch.is-large {
font-size: var(--ts-font-size-17px);
}
.ts-switch.is-large input::after {
height: 25px;
width: 46px;
}
.ts-switch.is-large input::before {
height: 18px;
width: 18px;
top: 3.5px;
}
.ts-switch.is-large input:checked::before {
left: 24px;
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-meta {
display: inline-flex;
flex-wrap: wrap;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-meta .item {
color: inherit;
text-decoration: none;
}
.ts-meta .item:not(:last-child)::after {
margin: 0 0;
content: "";
color: var(--ts-gray-500);
text-decoration: none;
pointer-events: none;
user-select: none;
display: inline-block;
}
.ts-meta a.item:hover {
text-decoration: underline;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Aligns
*/
.ts-meta:is(.is-start-aligned, .is-center-aligned, .is-end-aligned) {
display: flex;
}
.ts-meta.is-start-aligned {
justify-content: flex-start;
}
.ts-meta.is-center-aligned {
justify-content: center;
}
.ts-meta.is-end-aligned {
justify-content: flex-end;
}
/**
* Secondary
*/
.ts-meta.is-secondary .item {
color: var(--ts-gray-500);
}
/**
* Sizes
*/
.ts-meta.is-small {
font-size: var(--ts-font-size-14px);
}
.ts-meta.is-large {
font-size: var(--ts-font-size-17px);
}
/* ==========================================================================
Variables
========================================================================== */
.ts-selection {
--height: var(--ts-input-height-medium);
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-selection {
border: 1px solid var(--ts-gray-100);
border-radius: var(--ts-border-radius-element);
padding: 0 0.35rem;
display: inline-flex;
background: var(--ts-gray-100);
box-sizing: border-box;
height: var(--height);
align-items: center;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-selection .item {
display: flex;
}
.ts-selection .item .text {
display: inline-flex;
padding: 0.25rem 1rem;
border-radius: var(--ts-border-radius-secondary);
font-size: var(--ts-absolute-small);
color: var(--ts-gray-800);
border-color: var(--ts-gray-100);
user-select: none;
cursor: pointer;
align-items: center;
justify-content: center;
text-align: center;
line-height: 1.5;
}
.ts-selection .item input {
display: none;
}
.ts-selection input:checked + .text {
background: var(--accent-color, var(--ts-primary-700));
border-color: var(--accent-color, var(--ts-primary-700));
color: var(--accent-foreground-color, var(--ts-white));
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Disabled
*/
.ts-selection:not(:has(:enabled)) {
pointer-events: none;
opacity: 0.5;
user-select: none;
}
.ts-selection .item:has(:disabled) {
pointer-events: none;
opacity: 0.5;
user-select: none;
}
/**
* Circular
*/
.ts-selection.is-circular {
border-radius: 100rem;
}
.ts-selection.is-circular .item .text {
border-radius: 100rem;
}
/**
* Fluid
*/
.ts-selection.is-fluid {
width: 100%;
}
.ts-selection.is-fluid .item {
flex: 1;
}
.ts-selection.is-fluid .item .text {
width: 100%;
}
/**
* Sizes
*/
.ts-selection.is-small {
--height: var(--ts-input-height-small);
}
.ts-selection.is-small .item .text {
font-size: var(--ts-font-size-13px);
}
.ts-selection.is-large {
--height: var(--ts-input-height-large);
}
.ts-selection.is-large .item .text {
font-size: var(--ts-font-size-17px);
}
/**
* Dense
*/
.ts-selection.is-dense {
--height: var(--ts-input-height-medium-dense);
}
.ts-selection.is-dense.is-small {
--height: var(--ts-input-height-small-dense);
}
.ts-selection.is-dense.is-small {
--height: var(--ts-input-height-large-dense);
}
.ts-selection.is-dense .item .text {
padding-top: 0.1rem;
padding-bottom: 0.1rem;
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-table,
.ts-table :is(thead, tbody, tfoot, tr, th, td) {
width: auto;
height: auto;
margin: 0;
padding: 0;
border: none;
border-collapse: collapse;
border-spacing: 0;
border-color: inherit;
vertical-align: inherit;
text-align: left;
font-weight: inherit;
font-size: 14px;
-webkit-border-horizontal-spacing: 0;
-webkit-border-vertical-spacing: 0;
}
.ts-table {
width: 100%;
color: inherit;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-table thead tr {
border-bottom: 1px solid var(--ts-gray-300);
}
.ts-table tfoot tr {
border-top: 1px solid var(--ts-gray-300);
}
.ts-table tr th {
background: var(--ts-gray-100);
}
.ts-table :is(thead, tfoot) tr th {
padding: 0.5rem 1rem;
color: var(--ts-gray-600);
font-weight: 500;
}
.ts-table tbody tr + tr {
border-top: 1px solid var(--ts-gray-300);
}
.ts-table tbody tr td {
padding: 0.5rem 1rem;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Sizes
*/
.ts-table.is-small,
.ts-table.is-small :is(thead, tbody, tfoot, tr, th, td) {
font-size: var(--ts-font-size-13px);
}
.ts-table.is-large,
.ts-table.is-large :is(thead, tbody, tfoot, tr, th, td) {
font-size: var(--ts-font-size-16px);
}
/**
* Collapsed
*/
.ts-table.is-collapsed {
width: auto;
}
.ts-table :is(th, td).is-collapsed {
width: 1px;
white-space: nowrap;
}
/**
* Truncated
*/
.ts-table.is-truncated {
table-layout: fixed;
}
.ts-table.is-truncated td {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/**
* Basic
*/
.ts-table:is(.is-basic, .is-very-basic) tr th {
background: transparent;
}
.ts-table.is-very-basic tbody :is(th, td, tr) {
border-color: transparent;
}
/**
* Definition
*/
.ts-table.is-definition tr th:not(:first-child) {
background: var(--ts-gray-100);
}
.ts-table.is-definition tr th:first-child {
background: transparent;
}
.ts-table.is-definition tr td:first-child {
background: var(--ts-gray-100);
}
/**
* Celled
*/
.ts-table.is-celled tr :is(td, th):not(:last-child) {
border-right: 1px solid var(--ts-gray-300);
}
/**
* Striped
*/
.ts-table.is-striped > tbody > tr:nth-child(even) {
background: var(--ts-gray-75);
}
/**
* Empty
*/
.ts-table td.is-empty {
color: var(--ts-gray-300);
font-weight: 500;
}
.ts-table td.is-empty::after {
content: "—";
}
/**
* Insetted
*/
.ts-table td.is-insetted {
box-shadow: inset 0px 0px 10px 0px rgb(0 0 0 / 5%);
}
/**
* Aligns
*/
.ts-table :is(tr, th, td).is-start-aligned {
text-align: left;
}
.ts-table :is(th, td).is-center-aligned {
text-align: center;
}
.ts-table :is(th, td).is-end-aligned {
text-align: right;
}
.ts-table.is-top-aligned :is(th, td) {
vertical-align: top;
}
.ts-table :is(th, td).is-top-aligned {
vertical-align: top;
}
.ts-table :is(th, td).is-middle-aligned {
vertical-align: middle;
}
.ts-table tr.is-middle-aligned td {
vertical-align: middle;
}
.ts-table :is(th, td).is-bottom-aligned {
vertical-align: bottom;
}
/**
* Secondary
*/
.ts-table :is(tr, tr th, tr td).is-secondary {
background: var(--ts-gray-75);
}
/**
* Tertiary
*/
.ts-table :is(tr, tr th, tr td).is-tertiary {
background: var(--ts-gray-100);
}
/**
* Active
*/
.ts-table :is(tr, tr th, tr td).is-active {
background: var(--ts-gray-300);
}
/**
* Disabled
*/
.ts-table :is(tr, tr th, tr td).is-disabled {
opacity: 0.5;
user-select: none;
pointer-events: none;
}
/**
* Single Line
*/
.ts-table.is-single-line :is(tr, tr th, tr td),
.ts-table :is(tr, tr th, tr td).is-single-line {
white-space: nowrap;
}
/**
* Indicated
*/
.ts-table :is(tr, tr th, tr td).is-indicated {
box-shadow: 2px 0 0 var(--ts-gray-900) inset;
}
.ts-table :is(tr, tr th, tr td).is-indicated.is-negative {
box-shadow: 2px 0 0 var(--ts-negative-600) inset;
}
.ts-table :is(tr, tr th, tr td).is-indicated.is-positive {
box-shadow: 2px 0 0 var(--ts-positive-600) inset;
}
.ts-table :is(tr, tr th, tr td).is-indicated.is-warning {
box-shadow: 2px 0 0 var(--ts-warning-600) inset;
}
/**
* Sticked
*/
.ts-table.is-sticked tr *:is(td, th):first-child {
padding-left: 0;
}
.ts-table.is-sticked tr *:is(td, th):last-child {
padding-right: 0;
}
/**
* Density
*/
.ts-table.is-relaxed :is(thead, tfoot) tr th {
padding-top: 0.8rem;
padding-bottom: 0.8rem;
}
.ts-table.is-relaxed tbody tr td {
padding-top: 0.8rem;
padding-bottom: 0.8rem;
}
.ts-table.is-dense :is(thead, tfoot) tr th {
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
.ts-table.is-dense tbody tr td {
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
/**
* Compact
*/
.ts-table :is(thead, tfoot) tr th.is-compact {
padding-left: 0.5rem;
padding-right: 0.5rem;
}
.ts-table.is-compact :is(thead, tfoot) tr th {
padding-left: 0.5rem;
padding-right: 0.5rem;
}
.ts-table.is-compact tbody tr td {
padding-left: 0.5rem;
padding-right: 0.5rem;
}
.ts-table tbody tr td.is-compact {
padding-left: 0.5rem;
padding-right: 0.5rem;
}
/**
* Padded
*/
.ts-table.is-padded tbody tr td {
padding: 1rem 1.5rem;
}
.ts-table.is-padded :is(thead, tfoot) tr th {
padding: 1rem 1.5rem;
}
.ts-table.is-horizontally-padded tbody tr td {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
.ts-table.is-horizontally-padded :is(thead, tfoot) tr th {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
.ts-table tbody tr td.is-vertically-padded {
padding-top: 1rem;
padding-bottom: 1rem;
}
.ts-table tbody tr td.is-padded {
padding: 1rem 1.5rem;
}
.ts-table tbody tr td.is-vertically-padded {
padding-top: 1rem;
padding-bottom: 1rem;
}
.ts-table tbody tr td.is-horizontally-padded {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
/**
* Fitted
*/
.ts-table.is-fitted :is(thead, tfoot) tr th {
padding: 0;
}
.ts-table.is-fitted tbody tr td {
padding: 0;
}
.ts-table tbody tr td.is-fitted {
padding: 0;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-procedure {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-procedure {
display: flex;
align-items: center;
justify-content: center;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-procedure .item {
text-decoration: none;
display: flex;
align-items: center;
flex: 1 0 auto;
color: var(--ts-gray-800);
counter-increment: ordered;
}
.ts-procedure .item:last-child {
flex: 0 0 auto;
}
.ts-procedure .item .indicator {
position: relative;
border-radius: 100rem;
border: 2px solid var(--ts-gray-300);
color: var(--ts-gray-800);
height: 2rem;
width: 2rem;
display: inline-flex;
line-height: 1;
align-items: center;
justify-content: center;
font-weight: bold;
margin-right: 1rem;
background: transparent;
}
.ts-procedure:not(.is-compact) .item .indicator:empty::after {
content: counter(ordered, decimal);
}
.ts-procedure .item .content {
display: flex;
align-items: center;
}
.ts-procedure .item .label {
color: var(--ts-gray-800);
font-weight: 500;
}
.ts-procedure .item .label .description {
color: var(--ts-gray-600);
font-size: var(--ts-font-size-14px);
font-weight: normal;
}
.ts-procedure .item::after {
height: 2px;
content: "";
flex: 1 1 0%;
background: var(--ts-gray-300);
margin: 0 1rem;
pointer-events: none;
}
.ts-procedure .item:last-child::after {
display: none;
}
.ts-procedure .item .indicator .ts-icon {
font-size: var(--ts-font-size-14px);
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Active
*/
.ts-procedure .item.is-active .indicator {
background: var(--accent-color, var(--ts-gray-800));
border-color: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
}
/**
* Stacked
*/
.ts-procedure.is-stacked .item .content {
flex-direction: column;
justify-content: center;
gap: 0.25rem;
}
.ts-procedure.is-stacked .item .indicator {
margin-right: 0;
}
.ts-procedure.is-stacked .item::after {
margin-bottom: 2rem;
}
/**
* Processing
*/
.ts-procedure .item.is-processing .indicator {
background: transparent;
border-color: var(--accent-color, var(--ts-gray-800));
color: var(--ts-gray-800);
}
/**
* Completed
*/
.ts-procedure .item.is-completed::after {
background: var(--accent-color, var(--ts-gray-800));
}
.ts-procedure .item.is-completed .indicator {
font-family: "Icons";
font-weight: normal;
font-style: normal;
text-decoration: inherit;
text-align: center;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
background: var(--accent-color, var(--ts-gray-800));
border-color: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
}
.ts-procedure .item.is-completed .indicator::after,
.ts-procedure .item.is-completed .indicator * {
display: none;
}
.ts-procedure .item.is-completed .indicator::before {
content: "\f00c";
}
/**
* Completed Half Line
*/
.ts-procedure .item.is-completed .line.is-half {
position: relative;
}
.ts-procedure .item.is-completed .line.is-half::before {
content: " ";
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 50%;
background: var(--ts-gray-300);
}
/**
* Disabled
*/
.ts-procedure .item.is-disabled {
pointer-events: none;
opacity: 0.5;
user-select: none;
}
.ts-procedure .item.is-disabled .indicator {
background: transparent;
border-color: var(--ts-gray-300);
}
/**
* Negative
*/
.ts-procedure .item.is-negative .indicator {
background: var(--ts-negative-500);
color: var(--ts-white);
border-color: var(--ts-negative-500);
}
.ts-procedure .item.is-negative .label {
color: var(--ts-negative-500);
}
/**
* Compact
*/
.ts-procedure.is-compact .item .indicator {
height: 1rem;
width: 1rem;
padding: 0;
}
.ts-procedure.is-compact .item.is-completed .indicator::after,
.ts-procedure.is-compact .item.is-completed .indicator::before,
.ts-procedure.is-compact .item.is-completed .indicator * {
display: none;
}
/**
* Unordered
*/
.ts-procedure.is-unordered .item .indicator {
background: var(--ts-gray-200);
border-color: var(--ts-gray-200);
}
.ts-procedure.is-unordered .item.is-completed::after {
background: var(--ts-gray-300);
}
.ts-procedure.is-unordered .item.is-active .indicator {
background: var(--accent-color, var(--ts-gray-800));
border-color: var(--accent-color, var(--ts-gray-800));
}
.ts-procedure.is-unordered .item.is-completed .indicator {
background: var(--ts-gray-200);
border-color: var(--ts-gray-200);
color: var(--ts-gray-800);
}
/**
* Compact
*/
.ts-procedure.is-compact .item.is-completed .indicator {
background: var(--accent-color, var(--ts-gray-800));
border-color: var(--accent-color, var(--ts-gray-800));
}
.ts-procedure.is-compact .item.is-active .indicator {
background: transparent;
border-color: var(--accent-color, var(--ts-gray-800));
}
.ts-procedure.is-compact .item.is-active .indicator::after {
content: "";
background: var(--accent-color, var(--ts-gray-800));
position: absolute;
top: 2px;
left: 2px;
right: 2px;
bottom: 2px;
border-radius: 100rem;
display: block;
}
/**
* Vertical
*/
.ts-procedure.is-vertical {
flex-direction: column;
}
.ts-procedure.is-vertical .item {
flex-direction: column;
align-items: flex-start;
flex: 1 0 auto;
-webkit-box-pack: start;
justify-content: flex-start;
display: flex;
width: 100%;
}
.ts-procedure.is-vertical .item::after {
height: auto;
min-height: 1.5rem;
width: 2px;
margin: 0.5rem 0 0.5rem 0.9rem;
}
.ts-procedure.is-vertical.is-compact .item::after {
margin: 0rem 0 0rem 0.4rem;
}
/**
* Sizes
*/
.ts-procedure.is-small {
font-size: var(--ts-font-size-14px);
}
.ts-procedure.is-large {
font-size: var(--ts-font-size-17px);
}
/* ==========================================================================
Variables
========================================================================== */
.ts-grid {
--gap: 1rem;
--1-wide: calc((100% / (16 / 1)) - var(--gap) + (var(--gap) / (16 / 1)));
--2-wide: calc((100% / (16 / 2)) - var(--gap) + (var(--gap) / (16 / 2)));
--3-wide: calc((100% / (16 / 3)) - var(--gap) + (var(--gap) / (16 / 3)));
--4-wide: calc((100% / (16 / 4)) - var(--gap) + (var(--gap) / (16 / 4)));
--5-wide: calc((100% / (16 / 5)) - var(--gap) + (var(--gap) / (16 / 5)));
--6-wide: calc((100% / (16 / 6)) - var(--gap) + (var(--gap) / (16 / 6)));
--7-wide: calc((100% / (16 / 7)) - var(--gap) + (var(--gap) / (16 / 7)));
--8-wide: calc((100% / (16 / 8)) - var(--gap) + (var(--gap) / (16 / 8)));
--9-wide: calc((100% / (16 / 9)) - var(--gap) + (var(--gap) / (16 / 9)));
--10-wide: calc((100% / (16 / 10)) - var(--gap) + (var(--gap) / (16 / 10)));
--11-wide: calc((100% / (16 / 11)) - var(--gap) + (var(--gap) / (16 / 11)));
--12-wide: calc((100% / (16 / 12)) - var(--gap) + (var(--gap) / (16 / 12)));
--13-wide: calc((100% / (16 / 13)) - var(--gap) + (var(--gap) / (16 / 13)));
--14-wide: calc((100% / (16 / 14)) - var(--gap) + (var(--gap) / (16 / 14)));
--15-wide: calc((100% / (16 / 15)) - var(--gap) + (var(--gap) / (16 / 15)));
--16-wide: calc((100% / (16 / 16)) - var(--gap) + (var(--gap) / (16 / 16)));
--1-columns: calc((100% / 1) - var(--gap) + (var(--gap) / 1));
--2-columns: calc((100% / 2) - var(--gap) + (var(--gap) / 2));
--3-columns: calc((100% / 3) - var(--gap) + (var(--gap) / 3));
--4-columns: calc((100% / 4) - var(--gap) + (var(--gap) / 4));
--5-columns: calc((100% / 5) - var(--gap) + (var(--gap) / 5));
--6-columns: calc((100% / 6) - var(--gap) + (var(--gap) / 6));
--7-columns: calc((100% / 7) - var(--gap) + (var(--gap) / 7));
--8-columns: calc((100% / 8) - var(--gap) + (var(--gap) / 8));
--9-columns: calc((100% / 9) - var(--gap) + (var(--gap) / 9));
--10-columns: calc((100% / 10) - var(--gap) + (var(--gap) / 10));
}
/* ==========================================================================
Base
========================================================================== */
/* ==========================================================================
Structure
========================================================================== */
.ts-grid {
display: flex;
flex-wrap: wrap;
color: inherit;
gap: var(--gap);
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Columns
*/
.ts-grid.is-1-columns > .column {
flex: var(--1-columns);
max-width: var(--1-columns);
}
.ts-grid.is-2-columns > .column {
flex: var(--2-columns);
max-width: var(--2-columns);
}
.ts-grid.is-3-columns > .column {
flex: var(--3-columns);
max-width: var(--3-columns);
}
.ts-grid.is-4-columns > .column {
flex: var(--4-columns);
max-width: var(--4-columns);
}
.ts-grid.is-5-columns > .column {
flex: var(--5-columns);
max-width: var(--5-columns);
}
.ts-grid.is-6-columns > .column {
flex: var(--6-columns);
max-width: var(--6-columns);
}
.ts-grid.is-7-columns > .column {
flex: var(--7-columns);
max-width: var(--7-columns);
}
.ts-grid.is-8-columns > .column {
flex: var(--8-columns);
max-width: var(--8-columns);
}
.ts-grid.is-9-columns > .column {
flex: var(--9-columns);
max-width: var(--9-columns);
}
.ts-grid.is-10-columns > .column {
flex: var(--10-columns);
max-width: var(--10-columns);
}
/**
* Relaxed
*/
.ts-grid.is-relaxed {
--gap: 2rem;
}
.ts-grid.is-compact {
--gap: 0.5rem;
}
/**
* Divided
*/
.ts-grid.is-divided > .column {
position: relative;
}
.ts-grid.is-divided > .column:not(:last-child)::after {
position: absolute;
content: "";
top: 0;
bottom: 0;
right: calc(var(--gap) / 2 * -1);
border-right: 1px solid var(--ts-gray-300);
}
/**
* Evenly Divided
*/
.ts-grid.is-evenly-divided > .column {
flex: var(--1-wide);
width: var(--1-wide);
}
/**
* Truncated
*/
.ts-grid .column.is-truncated {
overflow: hidden;
}
/**
* Stretched
*/
.ts-grid.is-stretched > .column {
display: inline-flex !important;
align-self: stretch;
flex-direction: column;
}
.ts-grid.is-stretched > .column > * {
flex-grow: 1;
}
/**
* Space Around
*/
.ts-grid.is-spaced-between {
justify-content: space-between;
}
.ts-grid.is-spaced-around {
justify-content: space-around;
}
/**
* Reverse
*/
.ts-grid.is-reversed {
flex-direction: row-reverse;
flex-wrap: wrap-reverse;
}
/**
* Aligns
*/
.ts-grid.is-start-aligned {
justify-content: flex-start;
}
.ts-grid.is-center-aligned {
justify-content: center;
}
.ts-grid.is-end-aligned {
justify-content: flex-end;
}
.ts-grid.is-top-aligned {
align-items: flex-start;
}
.ts-grid.is-middle-aligned {
align-items: center;
}
.ts-grid.is-bottom-aligned {
align-items: flex-end;
}
.ts-grid .column.is-start-aligned {
display: flex;
flex-direction: column;
align-items: flex-start;
}
.ts-grid .column.is-center-aligned {
display: flex;
flex-direction: column;
align-items: center;
}
.ts-grid .column.is-end-aligned {
display: flex;
flex-direction: column;
align-items: flex-end;
}
/**
* Ordering
*/
.ts-grid .column.is-first {
order: -1;
}
.ts-grid .column.is-last {
order: 1;
}
.ts-grid .column.is-order-1 {
order: 1;
}
.ts-grid .column.is-order-2 {
order: 2;
}
.ts-grid .column.is-order-3 {
order: 3;
}
.ts-grid .column.is-order-4 {
order: 4;
}
.ts-grid .column.is-order-5 {
order: 5;
}
.ts-grid .column.is-order-6 {
order: 6;
}
.ts-grid .column.is-order-7 {
order: 7;
}
.ts-grid .column.is-order-8 {
order: 8;
}
.ts-grid .column.is-order-9 {
order: 9;
}
.ts-grid .column.is-order-10 {
order: 10;
}
/**
* Wides
*/
/*.ts-grid .column {
}*/
.ts-grid .column.is-1-wide {
width: var(--1-wide);
max-width: var(--1-wide);
}
.ts-grid .column.is-2-wide {
width: var(--2-wide);
max-width: var(--2-wide);
}
.ts-grid .column.is-3-wide {
width: var(--3-wide);
max-width: var(--3-wide);
}
.ts-grid .column.is-4-wide {
width: var(--4-wide);
max-width: var(--4-wide);
}
.ts-grid .column.is-5-wide {
width: var(--5-wide);
max-width: var(--5-wide);
}
.ts-grid .column.is-6-wide {
width: var(--6-wide);
max-width: var(--6-wide);
}
.ts-grid .column.is-7-wide {
width: var(--7-wide);
max-width: var(--7-wide);
}
.ts-grid .column.is-8-wide {
width: var(--8-wide);
max-width: var(--8-wide);
}
.ts-grid .column.is-9-wide {
width: var(--9-wide);
max-width: var(--9-wide);
}
.ts-grid .column.is-10-wide {
width: var(--10-wide);
max-width: var(--10-wide);
}
.ts-grid .column.is-11-wide {
width: var(--11-wide);
max-width: var(--11-wide);
}
.ts-grid .column.is-12-wide {
width: var(--12-wide);
max-width: var(--12-wide);
}
.ts-grid .column.is-13-wide {
width: var(--13-wide);
max-width: var(--13-wide);
}
.ts-grid .column.is-14-wide {
width: var(--14-wide);
max-width: var(--14-wide);
}
.ts-grid .column.is-15-wide {
width: var(--15-wide);
max-width: var(--15-wide);
}
.ts-grid .column.is-16-wide {
width: var(--16-wide);
max-width: var(--16-wide);
}
/**
* Fluid
*/
.ts-grid .column.is-fluid {
flex: 1;
min-width: 0;
flex-grow: 1;
}
/**
* Stacked
*/
.ts-grid.is-stacked > .column {
flex: var(--16-wide);
max-width: var(--16-wide);
}
/* ==========================================================================
Variables
========================================================================== */
.ts-rating {
--accent-color: initial;
--accent-foreground-color: initial;
--color: var(--accent-color, inherit);
}
/* ==========================================================================
Base
========================================================================== */
.ts-rating {
display: inline-flex;
gap: 0.2rem;
user-select: none;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-rating :is(.star, .heart) {
position: relative;
color: var(--ts-gray-200);
text-decoration: none;
}
.ts-rating :is(.star, .heart).is-active,
.ts-rating.is-input :is(.star, .heart):checked,
.ts-rating.is-input :is(.star, .heart):hover {
color: var(--color);
}
/* Issue #924 */
.ts-rating.is-input :is(.star, .heart):has(~ :is(.star, .heart):hover),
.ts-rating.is-input :is(.star, .heart):has(~ :is(.star, .heart):checked) {
color: var(--color);
}
.ts-rating.is-yellow {
--color: #e3c81b;
}
.ts-rating.is-red {
--color: #ff1100;
}
.ts-rating :is(.star, .heart)::after,
.ts-rating :is(.star, .heart)::before {
font-family: "Icons";
font-weight: normal;
font-style: normal;
display: inline;
text-decoration: inherit;
text-align: center;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
}
.ts-rating .star::after {
content: "\f005";
z-index: 0;
}
.ts-rating .heart::after {
content: "\f004";
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Half
*/
.ts-rating .star.is-active.is-half::after {
color: var(--ts-gray-200);
}
.ts-rating .star.is-active.is-half::before {
color: var(--color);
}
.ts-rating .star.is-active.is-half::before {
content: "\f089";
position: absolute;
left: 0;
top: 0;
z-index: 1;
}
/**
* Disabled
*/
.ts-rating .item:disabled {
pointer-events: none;
}
/**
* Input
*/
.ts-rating.is-input input {
appearance: none;
margin: 0;
cursor: pointer;
font-size: 1rem;
transition: color 0.1s ease, opacity 0.1s ease;
}
.ts-rating.is-input input:hover:not(:focus) ~ input,
.ts-rating.is-input input:hover:focus ~ input {
opacity: 0.7;
}
.ts-rating.is-input input:hover:not(:focus) {
transform: scale(1.1);
}
/**
* Sizes
*/
.ts-rating.is-small {
font-size: var(--ts-font-size-13px);
}
.ts-rating.is-large {
font-size: var(--ts-font-size-18px);
}
/* ==========================================================================
Variables
========================================================================== */
.ts-chip {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-chip {
vertical-align: middle;
text-decoration: none;
}
.ts-chip,
.ts-chip.is-input .content,
.ts-chip.is-toggle .content {
background: var(--ts-gray-200);
padding: 0.1rem 0.6rem;
border: 1px solid var(--ts-gray-200);
border-radius: var(--ts-border-radius-element);
font-size: var(--ts-font-size-14px);
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
line-height: 1.75;
min-height: 22px;
/*min-width: 55px;*/
color: var(--accent-color, var(--ts-gray-800));
}
.ts-chip.is-input,
.ts-chip.is-toggle {
background: initial;
padding: initial;
border: initial;
font-size: initial;
display: initial;
gap: initial;
line-height: initial;
min-height: initial;
min-width: initial;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-chip img {
width: 24px;
height: 24px;
border-radius: var(--ts-border-radius-element);
margin-left: -5px;
}
.ts-chip input {
display: none;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Outlined
*/
.ts-chip.is-outlined,
.ts-chip.is-outlined .content {
background: transparent;
border-color: var(--ts-gray-300);
}
/**
* Circular
*/
.ts-chip.is-circular,
.ts-chip.is-circular .content {
border-radius: 100rem;
}
/**
* Input
*/
.ts-chip.is-input,
.ts-chip.is-toggle {
cursor: pointer;
user-select: none;
}
/**
* Toggle
*/
.ts-chip.is-toggle input:checked + .content {
background: var(--accent-color, var(--ts-gray-800));
border-color: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
}
.ts-chip.is-toggle.is-secondary input:checked + .content {
color: var(--accent-color, var(--ts-gray-800));
background: var(--ts-gray-200);
border-color: var(--accent-color, var(--ts-gray-600));
}
/**
* Input
*/
.ts-chip.is-input input:checked + .content {
background: var(--accent-color, var(--ts-primary-700));
border-color: var(--accent-color, var(--ts-primary-700));
color: var(--accent-foreground-color, var(--ts-white));
}
.ts-chip.is-input.is-secondary input:checked + .content {
color: var(--accent-color, var(--ts-primary-600));
background: var(--ts-gray-100);
border-color: var(--accent-color, var(--ts-primary-600));
}
.ts-chip.is-input input:checked + .content::before {
font-family: "Icons";
font-weight: normal;
font-style: normal;
display: inline;
text-decoration: inherit;
text-align: center;
width: 1.18em;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
content: "\f00c";
font-size: 12px;
}
.ts-chip.is-input.is-start-icon input:checked + .content::before,
.ts-chip.is-input.is-end-icon input:checked + .content::before {
display: none;
}
.ts-chip.is-input.is-start-icon input:checked + .content .ts-icon::before,
.ts-chip.is-input.is-end-icon input:checked + .content .ts-icon::before {
content: "\f00c";
}
/**
* Disabled
*/
.ts-chip:has(:disabled),
.ts-chip.is-disabled,
fieldset:disabled .ts-chip {
pointer-events: none;
opacity: 0.5;
user-select: none;
}
/**
* Fluid
*/
.ts-chip.is-fluid {
display: flex;
}
.ts-chip.is-fluid .content {
width: 100%;
}
/**
* Sizes
*/
.ts-chip.is-small,
.ts-chip.is-small .content {
font-size: var(--ts-font-size-12px);
}
.ts-chip.is-large,
.ts-chip.is-large .content {
font-size: var(--ts-font-size-16px);
}
/**
* Dense
*/
.ts-chip.is-dense {
padding-top: 0.1rem;
padding-bottom: 0.1rem;
}
.ts-chip.is-dense:is(.is-input, .is-toggle) .content {
min-height: 20px;
padding-top: 0.1rem;
padding-bottom: 0.1rem;
}
/**
* Spaced
*/
.ts-chip.is-start-spaced {
margin-left: 0.45rem;
}
.ts-chip.is-end-spaced {
margin-right: 0.45rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-close {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-close {
border: none;
margin: 0;
padding: 0;
overflow: visible;
font: inherit;
outline: none;
box-sizing: border-box;
user-select: none;
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
appearance: none;
}
.ts-close {
font-family: "Icons";
font-weight: normal;
font-style: normal;
text-align: center;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
display: inline-flex;
align-items: center;
justify-content: center;
text-decoration: none;
cursor: pointer;
height: 18px;
width: 18px;
font-size: var(--ts-font-size-12px);
line-height: 1;
background: var(--accent-color, var(--ts-gray-600));
color: var(--accent-foreground-color, var(--ts-gray-100));
border-radius: 100rem;
}
.ts-close::before {
content: "\f00d";
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Disabled
*/
.ts-close:disabled,
.ts-close.is-disabled,
fieldset:disabled .ts-close {
pointer-events: none;
opacity: 0.5;
user-select: none;
}
/**
* Secondary
*/
.ts-close.is-secondary {
background: var(--ts-gray-300);
color: var(--ts-gray-800);
}
/**
* Tertiary
*/
.ts-close.is-tertiary {
background: var(--ts-gray-300);
color: var(--ts-gray-50);
}
/**
* Rounded
*/
.ts-close.is-rounded {
border-radius: var(--ts-border-radius-element);
}
/**
* Sizes
*/
.ts-close.is-small {
height: 16px;
width: 16px;
}
.ts-close.is-large {
height: 22px;
width: 22px;
font-size: var(--ts-font-size-14px);
}
.ts-close.is-big {
height: 27px;
width: 27px;
font-size: var(--ts-font-size-17px);
}
/**
* Spaced
*/
.ts-close.is-spaced {
margin-left: 0.45rem;
margin-right: 0.45rem;
}
.ts-close.is-start-spaced {
margin-left: 0.45rem;
}
.ts-close.is-end-spaced {
margin-right: 0.45rem;
}
/* ==========================================================================
Variables
========================================================================== */
@keyframes ts-loading-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.ts-loading {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-loading {
display: inline-block;
text-align: center;
color: var(--accent-color, var(--ts-gray-600));
}
.ts-loading::after {
font-family: "Icons";
font-weight: normal;
font-style: normal;
text-decoration: inherit;
display: inline-block;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
animation: ts-loading-spin 2s linear infinite;
font-size: 2rem;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-loading::after {
content: "\f110";
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Notched
*/
.ts-loading.is-notched::after {
content: "\f1ce";
}
/**
* Centered
*/
.ts-loading.is-centered {
display: flex;
justify-content: center;
}
/**
* Sizes
*/
.ts-loading.is-small::after {
font-size: 1rem;
}
.ts-loading.is-large::after {
font-size: 2.8rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-breadcrumb {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-breadcrumb {
display: flex;
gap: 0.7rem;
color: var(--ts-gray-800);
line-height: 1;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-breadcrumb .item {
position: relative;
text-decoration: none;
color: var(--ts-gray-800);
padding-right: 1.1rem;
}
.ts-breadcrumb .item:last-child {
padding-right: 0;
}
.ts-breadcrumb .item .ts-icon {
display: inline-block;
text-decoration: none;
}
.ts-breadcrumb a.item:hover {
text-decoration: underline;
}
.ts-breadcrumb .item::after {
position: absolute;
user-select: none;
margin-left: 0.7rem;
display: inline-block;
pointer-events: none;
content: "/";
color: var(--ts-gray-500);
}
.ts-breadcrumb .item:last-child::after {
display: none;
}
.ts-breadcrumb .divider .ts-icon {
font-size: 12px;
color: var(--ts-gray-500);
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Stepped
*/
.ts-breadcrumb.is-stepped .item {
color: var(--ts-gray-500);
}
/**
* Active
*/
.ts-breadcrumb .item.is-active {
color: var(--accent-color, var(--ts-gray-800));
font-weight: 500;
}
/**
* Customized
*/
.ts-breadcrumb.is-customized .item::after {
content: "";
}
.ts-breadcrumb.is-customized .item {
padding-right: 0;
}
/**
* Chevroned
*/
.ts-breadcrumb.is-chevroned .item::after {
content: "\f054";
font-size: var(--ts-font-size-12px);
line-height: 1.4;
}
/**
* Hyphenated
*/
.ts-breadcrumb.is-hyphenated .item::after {
content: "-";
}
.ts-breadcrumb:is(.is-chevroned, .is-hyphenated) .item::after {
font-family: "Icons";
font-weight: normal;
font-style: normal;
text-align: center;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
}
/**
* Sizes
*/
.ts-breadcrumb.is-small {
font-size: var(--ts-font-size-14px);
}
.ts-breadcrumb.is-large {
font-size: var(--ts-font-size-17px);
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-list {
color: inherit;
display: flex;
flex-direction: column;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-list .item {
display: inline-block;
}
/* ==========================================================================
Variations
========================================================================== */
.ts-list:is(.is-ordered, .is-unordered) {
margin-left: 1.2rem;
}
.ts-list:is(.is-unordered, .is-ordered) .item {
display: list-item;
}
/**
* Unordered
*/
.ts-list.is-unordered > .item,
.ts-list.is-unordered > *:not(.ts-list) > .item {
list-style-type: disc;
}
/**
* Ordered
*/
.ts-list.is-ordered > .item,
.ts-list.is-ordered > *:not(.ts-list) > .item {
list-style-type: decimal;
}
/**
* Sizes
*/
.ts-list.is-small {
font-size: var(--ts-font-size-14px);
}
.ts-list.is-large {
font-size: var(--ts-font-size-17px);
}
/* ==========================================================================
https://flagicons.lipis.dev/
========================================================================== */
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-flag {
display: inline-block;
background-size: contain;
background-position: 50%;
background-repeat: no-repeat;
vertical-align: middle;
text-decoration: inherit;
backface-visibility: hidden;
text-decoration: none;
background-size: cover;
box-sizing: border-box;
width: 1.4rem;
aspect-ratio: 4 / 3;
}
/* ==========================================================================
Structure
========================================================================== */
/**
* Section header
*/
/* ==========================================================================
Variations
========================================================================== */
/**
* Sqaured
*/
.ts-flag.is-squared {
aspect-ratio: 1 / 1;
}
/**
* Sizes
*/
.ts-flag.is-small {
width: 1.27rem;
}
.ts-flag.is-large {
width: 1.6rem;
}
.ts-flag.is-small:is(.is-squared, .is-circular) {
width: 0.95rem;
}
.ts-flag:is(.is-squared, .is-circular) {
width: 1.05rem;
}
.ts-flag.is-large:is(.is-squared, .is-circular) {
width: 1.2rem;
}
/**
* Rounded
*/
.ts-flag.is-rounded {
border-radius: var(--ts-border-radius-secondary);
}
/**
* Bordered
*/
.ts-flag.is-bordered {
box-shadow: 0 0 0 1px rgb(0 0 0 / 12%); /*var(--ts-gray-300)*/
}
/**
* Circular
*/
.ts-flag.is-circular {
border-radius: 100rem;
aspect-ratio: 1 / 1;
}
/**
* Disabled
*/
.ts-flag.is-disabled {
opacity: 0.5;
user-select: none;
}
/**
* Spaced
*/
.ts-flag.is-spaced {
margin-left: 0.45rem;
margin-right: 0.45rem;
}
.ts-flag.is-start-spaced {
margin-left: 0.45rem;
}
.ts-flag.is-end-spaced {
margin-right: 0.45rem;
}
/* ==========================================================================
Countires
========================================================================== */
.ts-flag:is(.is-ad-flag, .is-andorra-flag) {
background-image: url("./flags/4x3/ad.svg");
}
.ts-flag:is(.is-ad-flag, .is-andorra-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ad.svg");
}
.ts-flag:is(.is-ae-flag, .is-uae-flag, .is-united-arab-emirates-flag) {
background-image: url("./flags/4x3/ae.svg");
}
.ts-flag:is(.is-ae-flag, .is-uae-flag, .is-united-arab-emirates-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ae.svg");
}
.ts-flag:is(.is-af-flag, .is-afghanistan-flag) {
background-image: url("./flags/4x3/af.svg");
}
.ts-flag:is(.is-af-flag, .is-afghanistan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/af.svg");
}
.ts-flag:is(.is-ag-flag, .is-antigua-flag) {
background-image: url("./flags/4x3/ag.svg");
}
.ts-flag:is(.is-ag-flag, .is-antigua-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ag.svg");
}
.ts-flag:is(.is-ai-flag, .is-anguilla-flag) {
background-image: url("./flags/4x3/ai.svg");
}
.ts-flag:is(.is-ai-flag, .is-anguilla-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ai.svg");
}
.ts-flag:is(.is-al-flag, .is-albania-flag) {
background-image: url("./flags/4x3/al.svg");
}
.ts-flag:is(.is-al-flag, .is-albania-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/al.svg");
}
.ts-flag:is(.is-am-flag, .is-armenia-flag) {
background-image: url("./flags/4x3/am.svg");
}
.ts-flag:is(.is-am-flag, .is-armenia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/am.svg");
}
.ts-flag:is(.is-ao-flag, .is-angola-flag) {
background-image: url("./flags/4x3/ao.svg");
}
.ts-flag:is(.is-ao-flag, .is-angola-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ao.svg");
}
.ts-flag:is(.is-aq-flag, .is-antarctica-flag) {
background-image: url("./flags/4x3/aq.svg");
}
.ts-flag:is(.is-aq-flag, .is-antarctica-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/aq.svg");
}
.ts-flag:is(.is-ar-flag, .is-argentina-flag) {
background-image: url("./flags/4x3/ar.svg");
}
.ts-flag:is(.is-ar-flag, .is-argentina-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ar.svg");
}
.ts-flag:is(.is-as-flag, .is-american-samoa-flag) {
background-image: url("./flags/4x3/as.svg");
}
.ts-flag:is(.is-as-flag, .is-american-samoa-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/as.svg");
}
.ts-flag:is(.is-at-flag, .is-austria-flag) {
background-image: url("./flags/4x3/at.svg");
}
.ts-flag:is(.is-at-flag, .is-austria-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/at.svg");
}
.ts-flag:is(.is-au-flag, .is-australia-flag) {
background-image: url("./flags/4x3/au.svg");
}
.ts-flag:is(.is-au-flag, .is-australia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/au.svg");
}
.ts-flag:is(.is-aw-flag, .is-aruba-flag) {
background-image: url("./flags/4x3/aw.svg");
}
.ts-flag:is(.is-aw-flag, .is-aruba-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/aw.svg");
}
.ts-flag:is(.is-ax-flag, .is-aland-islands-flag) {
background-image: url("./flags/4x3/ax.svg");
}
.ts-flag:is(.is-ax-flag, .is-aland-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ax.svg");
}
.ts-flag:is(.is-az-flag, .is-azerbaijan-flag) {
background-image: url("./flags/4x3/az.svg");
}
.ts-flag:is(.is-az-flag, .is-azerbaijan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/az.svg");
}
.ts-flag:is(.is-ba-flag, .is-bosnia-flag) {
background-image: url("./flags/4x3/ba.svg");
}
.ts-flag:is(.is-ba-flag, .is-bosnia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ba.svg");
}
.ts-flag:is(.is-bb-flag, .is-barbados-flag) {
background-image: url("./flags/4x3/bb.svg");
}
.ts-flag:is(.is-bb-flag, .is-barbados-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bb.svg");
}
.ts-flag:is(.is-bd-flag, .is-bangladesh-flag) {
background-image: url("./flags/4x3/bd.svg");
}
.ts-flag:is(.is-bd-flag, .is-bangladesh-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bd.svg");
}
.ts-flag:is(.is-be-flag, .is-belgium-flag) {
background-image: url("./flags/4x3/be.svg");
}
.ts-flag:is(.is-be-flag, .is-belgium-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/be.svg");
}
.ts-flag:is(.is-bf-flag, .is-burkina-faso-flag) {
background-image: url("./flags/4x3/bf.svg");
}
.ts-flag:is(.is-bf-flag, .is-burkina-faso-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bf.svg");
}
.ts-flag:is(.is-bg-flag, .is-bulgaria-flag) {
background-image: url("./flags/4x3/bg.svg");
}
.ts-flag:is(.is-bg-flag, .is-bulgaria-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bg.svg");
}
.ts-flag:is(.is-bh-flag, .is-bahrain-flag) {
background-image: url("./flags/4x3/bh.svg");
}
.ts-flag:is(.is-bh-flag, .is-bahrain-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bh.svg");
}
.ts-flag:is(.is-bi-flag, .is-burundi-flag) {
background-image: url("./flags/4x3/bi.svg");
}
.ts-flag:is(.is-bi-flag, .is-burundi-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bi.svg");
}
.ts-flag:is(.is-bj-flag, .is-benin-flag) {
background-image: url("./flags/4x3/bj.svg");
}
.ts-flag:is(.is-bj-flag, .is-benin-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bj.svg");
}
.ts-flag:is(.is-bl-flag, .is-saint-barthélemy-flag, .is-saint-barthelemy-flag) {
background-image: url("./flags/4x3/bl.svg");
}
.ts-flag:is(.is-bl-flag, .is-saint-barthélemy-flag, .is-saint-barthelemy-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bl.svg");
}
.ts-flag:is(.is-bm-flag, .is-bermuda-flag) {
background-image: url("./flags/4x3/bm.svg");
}
.ts-flag:is(.is-bm-flag, .is-bermuda-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bm.svg");
}
.ts-flag:is(.is-bn-flag, .is-brunei-flag) {
background-image: url("./flags/4x3/bn.svg");
}
.ts-flag:is(.is-bn-flag, .is-brunei-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bn.svg");
}
.ts-flag:is(.is-bo-flag, .is-bolivia-flag) {
background-image: url("./flags/4x3/bo.svg");
}
.ts-flag:is(.is-bo-flag, .is-bolivia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bo.svg");
}
.ts-flag:is(.is-bq-flag, .is-caribbean-netherlands-flag) {
background-image: url("./flags/4x3/bq.svg");
}
.ts-flag:is(.is-bq-flag, .is-caribbean-netherlands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bq.svg");
}
.ts-flag:is(.is-br-flag, .is-brazil-flag) {
background-image: url("./flags/4x3/br.svg");
}
.ts-flag:is(.is-br-flag, .is-brazil-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/br.svg");
}
.ts-flag:is(.is-bs-flag, .is-bahamas-flag) {
background-image: url("./flags/4x3/bs.svg");
}
.ts-flag:is(.is-bs-flag, .is-bahamas-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bs.svg");
}
.ts-flag:is(.is-bt-flag, .is-bhutan-flag) {
background-image: url("./flags/4x3/bt.svg");
}
.ts-flag:is(.is-bt-flag, .is-bhutan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bt.svg");
}
.ts-flag:is(.is-bv-flag, .is-bouvet-island-flag) {
background-image: url("./flags/4x3/bv.svg");
}
.ts-flag:is(.is-bv-flag, .is-bouvet-island-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bv.svg");
}
.ts-flag:is(.is-bw-flag, .is-botswana-flag) {
background-image: url("./flags/4x3/bw.svg");
}
.ts-flag:is(.is-bw-flag, .is-botswana-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bw.svg");
}
.ts-flag:is(.is-by-flag, .is-belarus-flag) {
background-image: url("./flags/4x3/by.svg");
}
.ts-flag:is(.is-by-flag, .is-belarus-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/by.svg");
}
.ts-flag:is(.is-bz-flag, .is-belize-flag) {
background-image: url("./flags/4x3/bz.svg");
}
.ts-flag:is(.is-bz-flag, .is-belize-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/bz.svg");
}
.ts-flag:is(.is-ca-flag, .is-canada-flag) {
background-image: url("./flags/4x3/ca.svg");
}
.ts-flag:is(.is-ca-flag, .is-canada-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ca.svg");
}
.ts-flag:is(.is-cc-flag, .is-cocos-islands-flag) {
background-image: url("./flags/4x3/cc.svg");
}
.ts-flag:is(.is-cc-flag, .is-cocos-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cc.svg");
}
.ts-flag:is(.is-cd-flag, .is-congo-flag) {
background-image: url("./flags/4x3/cd.svg");
}
.ts-flag:is(.is-cd-flag, .is-congo-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cd.svg");
}
.ts-flag:is(.is-cf-flag, .is-central-african-republic-flag) {
background-image: url("./flags/4x3/cf.svg");
}
.ts-flag:is(.is-cf-flag, .is-central-african-republic-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cf.svg");
}
.ts-flag:is(.is-cg-flag, .is-congo-brazzaville-flag) {
background-image: url("./flags/4x3/cg.svg");
}
.ts-flag:is(.is-cg-flag, .is-congo-brazzaville-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cg.svg");
}
.ts-flag:is(.is-ch-flag, .is-switzerland-flag) {
background-image: url("./flags/4x3/ch.svg");
}
.ts-flag:is(.is-ch-flag, .is-switzerland-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ch.svg");
}
.ts-flag:is(.is-ci-flag, .is-cote-divoire-flag) {
background-image: url("./flags/4x3/ci.svg");
}
.ts-flag:is(.is-ci-flag, .is-cote-divoire-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ci.svg");
}
.ts-flag:is(.is-ck-flag, .is-cook-islands-flag) {
background-image: url("./flags/4x3/ck.svg");
}
.ts-flag:is(.is-ck-flag, .is-cook-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ck.svg");
}
.ts-flag:is(.is-cl-flag, .is-chile-flag) {
background-image: url("./flags/4x3/cl.svg");
}
.ts-flag:is(.is-cl-flag, .is-chile-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cl.svg");
}
.ts-flag:is(.is-cm-flag, .is-cameroon-flag) {
background-image: url("./flags/4x3/cm.svg");
}
.ts-flag:is(.is-cm-flag, .is-cameroon-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cm.svg");
}
.ts-flag:is(.is-cn-flag, .is-china-flag, .is-peoples-republic-of-china-flag) {
background-image: url("./flags/4x3/cn.svg");
}
.ts-flag:is(.is-cn-flag, .is-china-flag, .is-peoples-republic-of-china-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cn.svg");
}
.ts-flag:is(.is-co-flag, .is-colombia-flag) {
background-image: url("./flags/4x3/co.svg");
}
.ts-flag:is(.is-co-flag, .is-colombia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/co.svg");
}
.ts-flag:is(.is-cr-flag, .is-costa-rica-flag) {
background-image: url("./flags/4x3/cr.svg");
}
.ts-flag:is(.is-cr-flag, .is-costa-rica-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cr.svg");
}
.ts-flag:is(.is-cu-flag, .is-cuba-flag) {
background-image: url("./flags/4x3/cu.svg");
}
.ts-flag:is(.is-cu-flag, .is-cuba-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cu.svg");
}
.ts-flag:is(.is-cv-flag, .is-cape-verde-flag) {
background-image: url("./flags/4x3/cv.svg");
}
.ts-flag:is(.is-cv-flag, .is-cape-verde-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cv.svg");
}
.ts-flag:is(.is-cw-flag, .is-curaçao-flag, .is-curacao-flag) {
background-image: url("./flags/4x3/cw.svg");
}
.ts-flag:is(.is-cw-flag, .is-curaçao-flag, .is-curacao-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cw.svg");
}
.ts-flag:is(.is-cx-flag, .is-christmas-island-flag) {
background-image: url("./flags/4x3/cx.svg");
}
.ts-flag:is(.is-cx-flag, .is-christmas-island-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cx.svg");
}
.ts-flag:is(.is-cy-flag, .is-cyprus-flag) {
background-image: url("./flags/4x3/cy.svg");
}
.ts-flag:is(.is-cy-flag, .is-cyprus-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cy.svg");
}
.ts-flag:is(.is-cz-flag, .is-czech-republic-flag) {
background-image: url("./flags/4x3/cz.svg");
}
.ts-flag:is(.is-cz-flag, .is-czech-republic-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/cz.svg");
}
.ts-flag:is(.is-de-flag, .is-germany-flag) {
background-image: url("./flags/4x3/de.svg");
}
.ts-flag:is(.is-de-flag, .is-germany-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/de.svg");
}
.ts-flag:is(.is-dj-flag, .is-djibouti-flag) {
background-image: url("./flags/4x3/dj.svg");
}
.ts-flag:is(.is-dj-flag, .is-djibouti-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/dj.svg");
}
.ts-flag:is(.is-dk-flag, .is-denmark-flag) {
background-image: url("./flags/4x3/dk.svg");
}
.ts-flag:is(.is-dk-flag, .is-denmark-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/dk.svg");
}
.ts-flag:is(.is-dm-flag, .is-dominica-flag) {
background-image: url("./flags/4x3/dm.svg");
}
.ts-flag:is(.is-dm-flag, .is-dominica-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/dm.svg");
}
.ts-flag:is(.is-do-flag, .is-dominican-republic-flag) {
background-image: url("./flags/4x3/do.svg");
}
.ts-flag:is(.is-do-flag, .is-dominican-republic-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/do.svg");
}
.ts-flag:is(.is-dz-flag, .is-algeria-flag) {
background-image: url("./flags/4x3/dz.svg");
}
.ts-flag:is(.is-dz-flag, .is-algeria-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/dz.svg");
}
.ts-flag:is(.is-ec-flag, .is-ecuador-flag) {
background-image: url("./flags/4x3/ec.svg");
}
.ts-flag:is(.is-ec-flag, .is-ecuador-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ec.svg");
}
.ts-flag:is(.is-ee-flag, .is-estonia-flag) {
background-image: url("./flags/4x3/ee.svg");
}
.ts-flag:is(.is-ee-flag, .is-estonia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ee.svg");
}
.ts-flag:is(.is-eg-flag, .is-egypt-flag) {
background-image: url("./flags/4x3/eg.svg");
}
.ts-flag:is(.is-eg-flag, .is-egypt-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/eg.svg");
}
.ts-flag:is(.is-eh-flag, .is-western-sahara-flag) {
background-image: url("./flags/4x3/eh.svg");
}
.ts-flag:is(.is-eh-flag, .is-western-sahara-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/eh.svg");
}
.ts-flag:is(.is-er-flag, .is-eritrea-flag) {
background-image: url("./flags/4x3/er.svg");
}
.ts-flag:is(.is-er-flag, .is-eritrea-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/er.svg");
}
.ts-flag:is(.is-es-flag, .is-spain-flag) {
background-image: url("./flags/4x3/es.svg");
}
.ts-flag:is(.is-es-flag, .is-spain-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/es.svg");
}
.ts-flag:is(.is-es-ct-flag, .is-scotland-flag) {
background-image: url("./flags/4x3/es-ct.svg");
}
.ts-flag:is(.is-es-ct-flag, .is-scotland-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/es-ct.svg");
}
.ts-flag:is(.is-et-flag, .is-ethiopia-flag) {
background-image: url("./flags/4x3/et.svg");
}
.ts-flag:is(.is-et-flag, .is-ethiopia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/et.svg");
}
.ts-flag:is(.is-eu-flag, .is-european-union-flag) {
background-image: url("./flags/4x3/eu.svg");
}
.ts-flag:is(.is-eu-flag, .is-european-union-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/eu.svg");
}
.ts-flag:is(.is-fi-flag, .is-finland-flag) {
background-image: url("./flags/4x3/fi.svg");
}
.ts-flag:is(.is-fi-flag, .is-finland-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/fi.svg");
}
.ts-flag:is(.is-fj-flag, .is-fiji-flag) {
background-image: url("./flags/4x3/fj.svg");
}
.ts-flag:is(.is-fj-flag, .is-fiji-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/fj.svg");
}
.ts-flag:is(.is-fk-flag, .is-falkland-islands-flag) {
background-image: url("./flags/4x3/fk.svg");
}
.ts-flag:is(.is-fk-flag, .is-falkland-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/fk.svg");
}
.ts-flag:is(.is-fm-flag, .is-micronesia-flag) {
background-image: url("./flags/4x3/fm.svg");
}
.ts-flag:is(.is-fm-flag, .is-micronesia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/fm.svg");
}
.ts-flag:is(.is-fo-flag, .is-faroe-islands-flag) {
background-image: url("./flags/4x3/fo.svg");
}
.ts-flag:is(.is-fo-flag, .is-faroe-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/fo.svg");
}
.ts-flag:is(.is-fr-flag, .is-france-flag) {
background-image: url("./flags/4x3/fr.svg");
}
.ts-flag:is(.is-fr-flag, .is-france-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/fr.svg");
}
.ts-flag:is(.is-ga-flag, .is-gabon-flag) {
background-image: url("./flags/4x3/ga.svg");
}
.ts-flag:is(.is-ga-flag, .is-gabon-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ga.svg");
}
.ts-flag:is(.is-gb-flag, .is-united-kingdom-flag) {
background-image: url("./flags/4x3/gb.svg");
}
.ts-flag:is(.is-gb-flag, .is-united-kingdom-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gb.svg");
}
.ts-flag:is(.is-gb-eng-flag, .is-england-flag) {
background-image: url("./flags/4x3/gb-eng.svg");
}
.ts-flag:is(.is-gb-eng-flag, .is-england-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gb-eng.svg");
}
.ts-flag:is(.is-gb-nir-flag, .is-northern-ireland-flag) {
background-image: url("./flags/4x3/gb-nir.svg");
}
.ts-flag:is(.is-gb-nir-flag, .is-northern-ireland-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gb-nir.svg");
}
.ts-flag:is(.is-gb-sct-flag, .is-scotland-flag) {
background-image: url("./flags/4x3/gb-sct.svg");
}
.ts-flag:is(.is-gb-sct-flag, .is-scotland-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gb-sct.svg");
}
.ts-flag:is(.is-gb-wls-flag, .is-wales-flag) {
background-image: url("./flags/4x3/gb-wls.svg");
}
.ts-flag:is(.is-gb-wls-flag, .is-wales-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gb-wls.svg");
}
.ts-flag:is(.is-gd-flag, .is-grenada-flag) {
background-image: url("./flags/4x3/gd.svg");
}
.ts-flag:is(.is-gd-flag, .is-grenada-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gd.svg");
}
.ts-flag:is(.is-ge-flag, .is-georgia-flag) {
background-image: url("./flags/4x3/ge.svg");
}
.ts-flag:is(.is-ge-flag, .is-georgia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ge.svg");
}
.ts-flag:is(.is-gf-flag, .is-french-guiana-flag) {
background-image: url("./flags/4x3/gf.svg");
}
.ts-flag:is(.is-gf-flag, .is-french-guiana-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gf.svg");
}
.ts-flag:is(.is-gg-flag, .is-guernsey-flag) {
background-image: url("./flags/4x3/gg.svg");
}
.ts-flag:is(.is-gg-flag, .is-guernsey-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gg.svg");
}
.ts-flag:is(.is-gh-flag, .is-ghana-flag) {
background-image: url("./flags/4x3/gh.svg");
}
.ts-flag:is(.is-gh-flag, .is-ghana-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gh.svg");
}
.ts-flag:is(.is-gi-flag, .is-gibraltar-flag) {
background-image: url("./flags/4x3/gi.svg");
}
.ts-flag:is(.is-gi-flag, .is-gibraltar-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gi.svg");
}
.ts-flag:is(.is-gl-flag, .is-greenland-flag) {
background-image: url("./flags/4x3/gl.svg");
}
.ts-flag:is(.is-gl-flag, .is-greenland-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gl.svg");
}
.ts-flag:is(.is-gm-flag, .is-gambia-flag) {
background-image: url("./flags/4x3/gm.svg");
}
.ts-flag:is(.is-gm-flag, .is-gambia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gm.svg");
}
.ts-flag:is(.is-gn-flag, .is-guinea-flag) {
background-image: url("./flags/4x3/gn.svg");
}
.ts-flag:is(.is-gn-flag, .is-guinea-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gn.svg");
}
.ts-flag:is(.is-gp-flag, .is-guadeloupe-flag) {
background-image: url("./flags/4x3/gp.svg");
}
.ts-flag:is(.is-gp-flag, .is-guadeloupe-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gp.svg");
}
.ts-flag:is(.is-gq-flag, .is-equatorial-guinea-flag) {
background-image: url("./flags/4x3/gq.svg");
}
.ts-flag:is(.is-gq-flag, .is-equatorial-guinea-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gq.svg");
}
.ts-flag:is(.is-gr-flag, .is-greece-flag) {
background-image: url("./flags/4x3/gr.svg");
}
.ts-flag:is(.is-gr-flag, .is-greece-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gr.svg");
}
.ts-flag:is(.is-gs-flag, .is-sandwich-islands-flag) {
background-image: url("./flags/4x3/gs.svg");
}
.ts-flag:is(.is-gs-flag, .is-sandwich-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gs.svg");
}
.ts-flag:is(.is-gt-flag, .is-guatemala-flag) {
background-image: url("./flags/4x3/gt.svg");
}
.ts-flag:is(.is-gt-flag, .is-guatemala-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gt.svg");
}
.ts-flag:is(.is-gu-flag, .is-guam-flag) {
background-image: url("./flags/4x3/gu.svg");
}
.ts-flag:is(.is-gu-flag, .is-guam-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gu.svg");
}
.ts-flag:is(.is-gw-flag, .is-guinea-bissau-flag) {
background-image: url("./flags/4x3/gw.svg");
}
.ts-flag:is(.is-gw-flag, .is-guinea-bissau-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gw.svg");
}
.ts-flag:is(.is-gy-flag, .is-guyana-flag) {
background-image: url("./flags/4x3/gy.svg");
}
.ts-flag:is(.is-gy-flag, .is-guyana-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/gy.svg");
}
.ts-flag:is(.is-hk-flag, .is-hong-kong-flag) {
background-image: url("./flags/4x3/hk.svg");
}
.ts-flag:is(.is-hk-flag, .is-hong-kong-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/hk.svg");
}
.ts-flag:is(.is-hm-flag, .is-heard-island-flag) {
background-image: url("./flags/4x3/hm.svg");
}
.ts-flag:is(.is-hm-flag, .is-heard-island-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/hm.svg");
}
.ts-flag:is(.is-hn-flag, .is-honduras-flag) {
background-image: url("./flags/4x3/hn.svg");
}
.ts-flag:is(.is-hn-flag, .is-honduras-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/hn.svg");
}
.ts-flag:is(.is-hr-flag, .is-croatia-flag) {
background-image: url("./flags/4x3/hr.svg");
}
.ts-flag:is(.is-hr-flag, .is-croatia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/hr.svg");
}
.ts-flag:is(.is-ht-flag, .is-haiti-flag) {
background-image: url("./flags/4x3/ht.svg");
}
.ts-flag:is(.is-ht-flag, .is-haiti-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ht.svg");
}
.ts-flag:is(.is-hu-flag, .is-hungary-flag) {
background-image: url("./flags/4x3/hu.svg");
}
.ts-flag:is(.is-hu-flag, .is-hungary-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/hu.svg");
}
.ts-flag:is(.is-id-flag, .is-indonesia-flag) {
background-image: url("./flags/4x3/id.svg");
}
.ts-flag:is(.is-id-flag, .is-indonesia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/id.svg");
}
.ts-flag:is(.is-ie-flag, .is-ireland-flag) {
background-image: url("./flags/4x3/ie.svg");
}
.ts-flag:is(.is-ie-flag, .is-ireland-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ie.svg");
}
.ts-flag:is(.is-il-flag, .is-israel-flag) {
background-image: url("./flags/4x3/il.svg");
}
.ts-flag:is(.is-il-flag, .is-israel-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/il.svg");
}
.ts-flag:is(.is-im-flag, .is-isle-of-man-flag) {
background-image: url("./flags/4x3/im.svg");
}
.ts-flag:is(.is-im-flag, .is-isle-of-man-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/im.svg");
}
.ts-flag:is(.is-in-flag, .is-india-flag) {
background-image: url("./flags/4x3/in.svg");
}
.ts-flag:is(.is-in-flag, .is-india-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/in.svg");
}
.ts-flag:is(.is-io-flag, .is-indian-ocean-territory-flag) {
background-image: url("./flags/4x3/io.svg");
}
.ts-flag:is(.is-io-flag, .is-indian-ocean-territory-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/io.svg");
}
.ts-flag:is(.is-iq-flag, .is-iraq-flag) {
background-image: url("./flags/4x3/iq.svg");
}
.ts-flag:is(.is-iq-flag, .is-iraq-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/iq.svg");
}
.ts-flag:is(.is-ir-flag, .is-iran-flag) {
background-image: url("./flags/4x3/ir.svg");
}
.ts-flag:is(.is-ir-flag, .is-iran-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ir.svg");
}
.ts-flag:is(.is-is-flag, .is-iceland-flag) {
background-image: url("./flags/4x3/is.svg");
}
.ts-flag:is(.is-is-flag, .is-iceland-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/is.svg");
}
.ts-flag:is(.is-it-flag, .is-italy-flag) {
background-image: url("./flags/4x3/it.svg");
}
.ts-flag:is(.is-it-flag, .is-italy-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/it.svg");
}
.ts-flag:is(.is-je-flag, .is-jersey-flag) {
background-image: url("./flags/4x3/je.svg");
}
.ts-flag:is(.is-je-flag, .is-jersey-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/je.svg");
}
.ts-flag:is(.is-jm-flag, .is-jamaica-flag) {
background-image: url("./flags/4x3/jm.svg");
}
.ts-flag:is(.is-jm-flag, .is-jamaica-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/jm.svg");
}
.ts-flag:is(.is-jo-flag, .is-jordan-flag) {
background-image: url("./flags/4x3/jo.svg");
}
.ts-flag:is(.is-jo-flag, .is-jordan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/jo.svg");
}
.ts-flag:is(.is-jp-flag, .is-japan-flag) {
background-image: url("./flags/4x3/jp.svg");
}
.ts-flag:is(.is-jp-flag, .is-japan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/jp.svg");
}
.ts-flag:is(.is-ke-flag, .is-kenya-flag) {
background-image: url("./flags/4x3/ke.svg");
}
.ts-flag:is(.is-ke-flag, .is-kenya-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ke.svg");
}
.ts-flag:is(.is-kg-flag, .is-kyrgyzstan-flag) {
background-image: url("./flags/4x3/kg.svg");
}
.ts-flag:is(.is-kg-flag, .is-kyrgyzstan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/kg.svg");
}
.ts-flag:is(.is-kh-flag, .is-cambodia-flag) {
background-image: url("./flags/4x3/kh.svg");
}
.ts-flag:is(.is-kh-flag, .is-cambodia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/kh.svg");
}
.ts-flag:is(.is-ki-flag, .is-kiribati-flag) {
background-image: url("./flags/4x3/ki.svg");
}
.ts-flag:is(.is-ki-flag, .is-kiribati-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ki.svg");
}
.ts-flag:is(.is-km-flag, .is-comoros-flag) {
background-image: url("./flags/4x3/km.svg");
}
.ts-flag:is(.is-km-flag, .is-comoros-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/km.svg");
}
.ts-flag:is(.is-kn-flag, .is-saint-kitts-and-nevis-flag, .is-saint-kitts-flag, .is-nevis-flag) {
background-image: url("./flags/4x3/kn.svg");
}
.ts-flag:is(.is-kn-flag, .is-saint-kitts-and-nevis-flag, .is-saint-kitts-flag, .is-nevis-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/kn.svg");
}
.ts-flag:is(.is-kp-flag, .is-north-korea-flag) {
background-image: url("./flags/4x3/kp.svg");
}
.ts-flag:is(.is-kp-flag, .is-north-korea-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/kp.svg");
}
.ts-flag:is(.is-kr-flag, .is-south-korea-flag, .is-korea-flag) {
background-image: url("./flags/4x3/kr.svg");
}
.ts-flag:is(.is-kr-flag, .is-south-korea-flag, .is-korea-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/kr.svg");
}
.ts-flag:is(.is-kw-flag, .is-kuwait-flag) {
background-image: url("./flags/4x3/kw.svg");
}
.ts-flag:is(.is-kw-flag, .is-kuwait-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/kw.svg");
}
.ts-flag:is(.is-ky-flag, .is-cayman-islands-flag) {
background-image: url("./flags/4x3/ky.svg");
}
.ts-flag:is(.is-ky-flag, .is-cayman-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ky.svg");
}
.ts-flag:is(.is-kz-flag, .is-kazakhstan-flag) {
background-image: url("./flags/4x3/kz.svg");
}
.ts-flag:is(.is-kz-flag, .is-kazakhstan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/kz.svg");
}
.ts-flag:is(.is-la-flag, .is-laos-flag) {
background-image: url("./flags/4x3/la.svg");
}
.ts-flag:is(.is-la-flag, .is-laos-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/la.svg");
}
.ts-flag:is(.is-lb-flag, .is-lebanon-flag) {
background-image: url("./flags/4x3/lb.svg");
}
.ts-flag:is(.is-lb-flag, .is-lebanon-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/lb.svg");
}
.ts-flag:is(.is-lc-flag, .is-saint-lucia-flag) {
background-image: url("./flags/4x3/lc.svg");
}
.ts-flag:is(.is-lc-flag, .is-saint-lucia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/lc.svg");
}
.ts-flag:is(.is-li-flag, .is-liechtenstein-flag) {
background-image: url("./flags/4x3/li.svg");
}
.ts-flag:is(.is-li-flag, .is-liechtenstein-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/li.svg");
}
.ts-flag:is(.is-lk-flag, .is-sri-lanka-flag) {
background-image: url("./flags/4x3/lk.svg");
}
.ts-flag:is(.is-lk-flag, .is-sri-lanka-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/lk.svg");
}
.ts-flag:is(.is-lr-flag, .is-liberia-flag) {
background-image: url("./flags/4x3/lr.svg");
}
.ts-flag:is(.is-lr-flag, .is-liberia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/lr.svg");
}
.ts-flag:is(.is-ls-flag, .is-lesotho-flag) {
background-image: url("./flags/4x3/ls.svg");
}
.ts-flag:is(.is-ls-flag, .is-lesotho-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ls.svg");
}
.ts-flag:is(.is-lt-flag, .is-lithuania-flag) {
background-image: url("./flags/4x3/lt.svg");
}
.ts-flag:is(.is-lt-flag, .is-lithuania-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/lt.svg");
}
.ts-flag:is(.is-lu-flag, .is-luxembourg-flag) {
background-image: url("./flags/4x3/lu.svg");
}
.ts-flag:is(.is-lu-flag, .is-luxembourg-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/lu.svg");
}
.ts-flag:is(.is-lv-flag, .is-latvia-flag) {
background-image: url("./flags/4x3/lv.svg");
}
.ts-flag:is(.is-lv-flag, .is-latvia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/lv.svg");
}
.ts-flag:is(.is-ly-flag, .is-libya-flag) {
background-image: url("./flags/4x3/ly.svg");
}
.ts-flag:is(.is-ly-flag, .is-libya-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ly.svg");
}
.ts-flag:is(.is-ma-flag, .is-morocco-flag) {
background-image: url("./flags/4x3/ma.svg");
}
.ts-flag:is(.is-ma-flag, .is-morocco-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ma.svg");
}
.ts-flag:is(.is-mc-flag, .is-monaco-flag) {
background-image: url("./flags/4x3/mc.svg");
}
.ts-flag:is(.is-mc-flag, .is-monaco-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mc.svg");
}
.ts-flag:is(.is-md-flag, .is-moldova-flag) {
background-image: url("./flags/4x3/md.svg");
}
.ts-flag:is(.is-md-flag, .is-moldova-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/md.svg");
}
.ts-flag:is(.is-me-flag, .is-montenegro-flag) {
background-image: url("./flags/4x3/me.svg");
}
.ts-flag:is(.is-me-flag, .is-montenegro-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/me.svg");
}
.ts-flag:is(.is-mf-flag, .is-saint-martin-flag) {
background-image: url("./flags/4x3/mf.svg");
}
.ts-flag:is(.is-mf-flag, .is-saint-martin-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mf.svg");
}
.ts-flag:is(.is-mg-flag, .is-madagascar-flag) {
background-image: url("./flags/4x3/mg.svg");
}
.ts-flag:is(.is-mg-flag, .is-madagascar-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mg.svg");
}
.ts-flag:is(.is-mh-flag, .is-marshall-islands-flag) {
background-image: url("./flags/4x3/mh.svg");
}
.ts-flag:is(.is-mh-flag, .is-marshall-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mh.svg");
}
.ts-flag:is(.is-mk-flag, .is-macedonia-flag) {
background-image: url("./flags/4x3/mk.svg");
}
.ts-flag:is(.is-mk-flag, .is-macedonia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mk.svg");
}
.ts-flag:is(.is-ml-flag, .is-mali-flag) {
background-image: url("./flags/4x3/ml.svg");
}
.ts-flag:is(.is-ml-flag, .is-mali-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ml.svg");
}
.ts-flag:is(.is-mm-flag, .is-burma-flag, .is-myanmar-flag) {
background-image: url("./flags/4x3/mm.svg");
}
.ts-flag:is(.is-mm-flag, .is-burma-flag, .is-myanmar-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mm.svg");
}
.ts-flag:is(.is-mn-flag, .is-mongolia-flag) {
background-image: url("./flags/4x3/mn.svg");
}
.ts-flag:is(.is-mn-flag, .is-mongolia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mn.svg");
}
.ts-flag:is(.is-mo-flag, .is-macau-flag) {
background-image: url("./flags/4x3/mo.svg");
}
.ts-flag:is(.is-mo-flag, .is-macau-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mo.svg");
}
.ts-flag:is(.is-mp-flag, .is-northern-mariana-islands-flag) {
background-image: url("./flags/4x3/mp.svg");
}
.ts-flag:is(.is-mp-flag, .is-northern-mariana-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mp.svg");
}
.ts-flag:is(.is-mq-flag, .is-martinique-flag) {
background-image: url("./flags/4x3/mq.svg");
}
.ts-flag:is(.is-mq-flag, .is-martinique-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mq.svg");
}
.ts-flag:is(.is-mr-flag, .is-mauritania-flag) {
background-image: url("./flags/4x3/mr.svg");
}
.ts-flag:is(.is-mr-flag, .is-mauritania-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mr.svg");
}
.ts-flag:is(.is-ms-flag, .is-montserrat-flag) {
background-image: url("./flags/4x3/ms.svg");
}
.ts-flag:is(.is-ms-flag, .is-montserrat-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ms.svg");
}
.ts-flag:is(.is-mt-flag, .is-malta-flag) {
background-image: url("./flags/4x3/mt.svg");
}
.ts-flag:is(.is-mt-flag, .is-malta-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mt.svg");
}
.ts-flag:is(.is-mu-flag, .is-mauritius-flag) {
background-image: url("./flags/4x3/mu.svg");
}
.ts-flag:is(.is-mu-flag, .is-mauritius-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mu.svg");
}
.ts-flag:is(.is-mv-flag, .is-maldives-flag) {
background-image: url("./flags/4x3/mv.svg");
}
.ts-flag:is(.is-mv-flag, .is-maldives-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mv.svg");
}
.ts-flag:is(.is-mw-flag, .is-malawi-flag) {
background-image: url("./flags/4x3/mw.svg");
}
.ts-flag:is(.is-mw-flag, .is-malawi-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mw.svg");
}
.ts-flag:is(.is-mx-flag, .is-mexico-flag) {
background-image: url("./flags/4x3/mx.svg");
}
.ts-flag:is(.is-mx-flag, .is-mexico-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mx.svg");
}
.ts-flag:is(.is-my-flag, .is-malaysia-flag) {
background-image: url("./flags/4x3/my.svg");
}
.ts-flag:is(.is-my-flag, .is-malaysia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/my.svg");
}
.ts-flag:is(.is-mz-flag, .is-mozambique-flag) {
background-image: url("./flags/4x3/mz.svg");
}
.ts-flag:is(.is-mz-flag, .is-mozambique-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/mz.svg");
}
.ts-flag:is(.is-na-flag, .is-namibia-flag) {
background-image: url("./flags/4x3/na.svg");
}
.ts-flag:is(.is-na-flag, .is-namibia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/na.svg");
}
.ts-flag:is(.is-nc-flag, .is-new-caledonia-flag) {
background-image: url("./flags/4x3/nc.svg");
}
.ts-flag:is(.is-nc-flag, .is-new-caledonia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/nc.svg");
}
.ts-flag:is(.is-ne-flag, .is-niger-flag) {
background-image: url("./flags/4x3/ne.svg");
}
.ts-flag:is(.is-ne-flag, .is-niger-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ne.svg");
}
.ts-flag:is(.is-nf-flag, .is-norfolk-island-flag) {
background-image: url("./flags/4x3/nf.svg");
}
.ts-flag:is(.is-nf-flag, .is-norfolk-island-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/nf.svg");
}
.ts-flag:is(.is-ng-flag, .is-nigeria-flag) {
background-image: url("./flags/4x3/ng.svg");
}
.ts-flag:is(.is-ng-flag, .is-nigeria-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ng.svg");
}
.ts-flag:is(.is-ni-flag, .is-nicaragua-flag) {
background-image: url("./flags/4x3/ni.svg");
}
.ts-flag:is(.is-ni-flag, .is-nicaragua-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ni.svg");
}
.ts-flag:is(.is-nl-flag, .is-netherlands-flag) {
background-image: url("./flags/4x3/nl.svg");
}
.ts-flag:is(.is-nl-flag, .is-netherlands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/nl.svg");
}
.ts-flag:is(.is-no-flag, .is-norway-flag) {
background-image: url("./flags/4x3/no.svg");
}
.ts-flag:is(.is-no-flag, .is-norway-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/no.svg");
}
.ts-flag:is(.is-np-flag, .is-nepal-flag) {
background-image: url("./flags/4x3/np.svg");
}
.ts-flag:is(.is-np-flag, .is-nepal-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/np.svg");
}
.ts-flag:is(.is-nr-flag, .is-nauru-flag) {
background-image: url("./flags/4x3/nr.svg");
}
.ts-flag:is(.is-nr-flag, .is-nauru-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/nr.svg");
}
.ts-flag:is(.is-nu-flag, .is-niue-flag) {
background-image: url("./flags/4x3/nu.svg");
}
.ts-flag:is(.is-nu-flag, .is-niue-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/nu.svg");
}
.ts-flag:is(.is-nz-flag, .is-new-zealand-flag) {
background-image: url("./flags/4x3/nz.svg");
}
.ts-flag:is(.is-nz-flag, .is-new-zealand-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/nz.svg");
}
.ts-flag:is(.is-om-flag, .is-oman-flag) {
background-image: url("./flags/4x3/om.svg");
}
.ts-flag:is(.is-om-flag, .is-oman-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/om.svg");
}
.ts-flag:is(.is-pa-flag, .is-panama-flag) {
background-image: url("./flags/4x3/pa.svg");
}
.ts-flag:is(.is-pa-flag, .is-panama-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/pa.svg");
}
.ts-flag:is(.is-pe-flag, .is-peru-flag) {
background-image: url("./flags/4x3/pe.svg");
}
.ts-flag:is(.is-pe-flag, .is-peru-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/pe.svg");
}
.ts-flag:is(.is-pf-flag, .is-french-polynesia-flag) {
background-image: url("./flags/4x3/pf.svg");
}
.ts-flag:is(.is-pf-flag, .is-french-polynesia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/pf.svg");
}
.ts-flag:is(.is-pg-flag, .is-new-guinea-flag) {
background-image: url("./flags/4x3/pg.svg");
}
.ts-flag:is(.is-pg-flag, .is-new-guinea-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/pg.svg");
}
.ts-flag:is(.is-ph-flag, .is-philippines-flag) {
background-image: url("./flags/4x3/ph.svg");
}
.ts-flag:is(.is-ph-flag, .is-philippines-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ph.svg");
}
.ts-flag:is(.is-pk-flag, .is-pakistan-flag) {
background-image: url("./flags/4x3/pk.svg");
}
.ts-flag:is(.is-pk-flag, .is-pakistan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/pk.svg");
}
.ts-flag:is(.is-pl-flag, .is-poland-flag) {
background-image: url("./flags/4x3/pl.svg");
}
.ts-flag:is(.is-pl-flag, .is-poland-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/pl.svg");
}
.ts-flag:is(.is-pm-flag, .is-saint-pierre-flag) {
background-image: url("./flags/4x3/pm.svg");
}
.ts-flag:is(.is-pm-flag, .is-saint-pierre-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/pm.svg");
}
.ts-flag:is(.is-pn-flag, .is-pitcairn-islands-flag) {
background-image: url("./flags/4x3/pn.svg");
}
.ts-flag:is(.is-pn-flag, .is-pitcairn-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/pn.svg");
}
.ts-flag:is(.is-pr-flag, .is-puerto-rico-flag) {
background-image: url("./flags/4x3/pr.svg");
}
.ts-flag:is(.is-pr-flag, .is-puerto-rico-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/pr.svg");
}
.ts-flag:is(.is-ps-flag, .is-palestine-flag) {
background-image: url("./flags/4x3/ps.svg");
}
.ts-flag:is(.is-ps-flag, .is-palestine-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ps.svg");
}
.ts-flag:is(.is-pt-flag, .is-portugal-flag) {
background-image: url("./flags/4x3/pt.svg");
}
.ts-flag:is(.is-pt-flag, .is-portugal-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/pt.svg");
}
.ts-flag:is(.is-pw-flag, .is-palau-flag) {
background-image: url("./flags/4x3/pw.svg");
}
.ts-flag:is(.is-pw-flag, .is-palau-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/pw.svg");
}
.ts-flag:is(.is-py-flag, .is-paraguay-flag) {
background-image: url("./flags/4x3/py.svg");
}
.ts-flag:is(.is-py-flag, .is-paraguay-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/py.svg");
}
.ts-flag:is(.is-qa-flag, .is-qatar-flag) {
background-image: url("./flags/4x3/qa.svg");
}
.ts-flag:is(.is-qa-flag, .is-qatar-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/qa.svg");
}
.ts-flag:is(.is-re-flag, .is-reunion-flag) {
background-image: url("./flags/4x3/re.svg");
}
.ts-flag:is(.is-re-flag, .is-reunion-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/re.svg");
}
.ts-flag:is(.is-ro-flag, .is-romania-flag) {
background-image: url("./flags/4x3/ro.svg");
}
.ts-flag:is(.is-ro-flag, .is-romania-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ro.svg");
}
.ts-flag:is(.is-rs-flag, .is-serbia-flag) {
background-image: url("./flags/4x3/rs.svg");
}
.ts-flag:is(.is-rs-flag, .is-serbia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/rs.svg");
}
.ts-flag:is(.is-ru-flag, .is-russia-flag) {
background-image: url("./flags/4x3/ru.svg");
}
.ts-flag:is(.is-ru-flag, .is-russia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ru.svg");
}
.ts-flag:is(.is-rw-flag, .is-rwanda-flag) {
background-image: url("./flags/4x3/rw.svg");
}
.ts-flag:is(.is-rw-flag, .is-rwanda-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/rw.svg");
}
.ts-flag:is(.is-sa-flag, .is-saudi-arabia-flag) {
background-image: url("./flags/4x3/sa.svg");
}
.ts-flag:is(.is-sa-flag, .is-saudi-arabia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sa.svg");
}
.ts-flag:is(.is-sb-flag, .is-solomon-islands-flag) {
background-image: url("./flags/4x3/sb.svg");
}
.ts-flag:is(.is-sb-flag, .is-solomon-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sb.svg");
}
.ts-flag:is(.is-sc-flag, .is-seychelles-flag) {
background-image: url("./flags/4x3/sc.svg");
}
.ts-flag:is(.is-sc-flag, .is-seychelles-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sc.svg");
}
.ts-flag:is(.is-sd-flag, .is-sudan-flag) {
background-image: url("./flags/4x3/sd.svg");
}
.ts-flag:is(.is-sd-flag, .is-sudan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sd.svg");
}
.ts-flag:is(.is-se-flag, .is-sweden-flag) {
background-image: url("./flags/4x3/se.svg");
}
.ts-flag:is(.is-se-flag, .is-sweden-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/se.svg");
}
.ts-flag:is(.is-sg-flag, .is-singapore-flag) {
background-image: url("./flags/4x3/sg.svg");
}
.ts-flag:is(.is-sg-flag, .is-singapore-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sg.svg");
}
.ts-flag:is(.is-sh-flag, .is-saint-helena-flag) {
background-image: url("./flags/4x3/sh.svg");
}
.ts-flag:is(.is-sh-flag, .is-saint-helena-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sh.svg");
}
.ts-flag:is(.is-si-flag, .is-slovenia-flag) {
background-image: url("./flags/4x3/si.svg");
}
.ts-flag:is(.is-si-flag, .is-slovenia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/si.svg");
}
.ts-flag:is(.is-sj-flag, .is-jan-mayen-and-svalbard-flag, .is-svalbard-flag, .is-jan-mayen-flag) {
background-image: url("./flags/4x3/sj.svg");
}
.ts-flag:is(.is-sj-flag, .is-jan-mayen-and-svalbard-flag, .is-svalbard-flag, .is-jan-mayen-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sj.svg");
}
.ts-flag:is(.is-sk-flag, .is-slovakia-flag) {
background-image: url("./flags/4x3/sk.svg");
}
.ts-flag:is(.is-sk-flag, .is-slovakia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sk.svg");
}
.ts-flag:is(.is-sl-flag, .is-sierra-leone-flag) {
background-image: url("./flags/4x3/sl.svg");
}
.ts-flag:is(.is-sl-flag, .is-sierra-leone-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sl.svg");
}
.ts-flag:is(.is-sm-flag, .is-san-marino-flag) {
background-image: url("./flags/4x3/sm.svg");
}
.ts-flag:is(.is-sm-flag, .is-san-marino-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sm.svg");
}
.ts-flag:is(.is-sn-flag, .is-senegal-flag) {
background-image: url("./flags/4x3/sn.svg");
}
.ts-flag:is(.is-sn-flag, .is-senegal-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sn.svg");
}
.ts-flag:is(.is-so-flag, .is-somalia-flag) {
background-image: url("./flags/4x3/so.svg");
}
.ts-flag:is(.is-so-flag, .is-somalia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/so.svg");
}
.ts-flag:is(.is-sr-flag, .is-suriname-flag) {
background-image: url("./flags/4x3/sr.svg");
}
.ts-flag:is(.is-sr-flag, .is-suriname-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sr.svg");
}
.ts-flag:is(.is-ss-flag, .is-south-sudan-flag) {
background-image: url("./flags/4x3/ss.svg");
}
.ts-flag:is(.is-ss-flag, .is-south-sudan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ss.svg");
}
.ts-flag:is(.is-st-flag, .is-sao-tome-flag) {
background-image: url("./flags/4x3/st.svg");
}
.ts-flag:is(.is-st-flag, .is-sao-tome-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/st.svg");
}
.ts-flag:is(.is-sv-flag, .is-el-salvador-flag) {
background-image: url("./flags/4x3/sv.svg");
}
.ts-flag:is(.is-sv-flag, .is-el-salvador-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sv.svg");
}
.ts-flag:is(.is-sx-flag, .is-sint-maarten-flag) {
background-image: url("./flags/4x3/sx.svg");
}
.ts-flag:is(.is-sx-flag, .is-sint-maarten-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sx.svg");
}
.ts-flag:is(.is-sy-flag, .is-syria-flag) {
background-image: url("./flags/4x3/sy.svg");
}
.ts-flag:is(.is-sy-flag, .is-syria-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sy.svg");
}
.ts-flag:is(.is-sz-flag, .is-swaziland-flag) {
background-image: url("./flags/4x3/sz.svg");
}
.ts-flag:is(.is-sz-flag, .is-swaziland-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/sz.svg");
}
.ts-flag:is(.is-tc-flag, .is-caicos-islands-flag) {
background-image: url("./flags/4x3/tc.svg");
}
.ts-flag:is(.is-tc-flag, .is-caicos-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tc.svg");
}
.ts-flag:is(.is-td-flag, .is-chad-flag) {
background-image: url("./flags/4x3/td.svg");
}
.ts-flag:is(.is-td-flag, .is-chad-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/td.svg");
}
.ts-flag:is(.is-tf-flag, .is-french-territories-flag) {
background-image: url("./flags/4x3/tf.svg");
}
.ts-flag:is(.is-tf-flag, .is-french-territories-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tf.svg");
}
.ts-flag:is(.is-tg-flag, .is-togo-flag) {
background-image: url("./flags/4x3/tg.svg");
}
.ts-flag:is(.is-tg-flag, .is-togo-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tg.svg");
}
.ts-flag:is(.is-th-flag, .is-thailand-flag) {
background-image: url("./flags/4x3/th.svg");
}
.ts-flag:is(.is-th-flag, .is-thailand-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/th.svg");
}
.ts-flag:is(.is-tj-flag, .is-tajikistan-flag) {
background-image: url("./flags/4x3/tj.svg");
}
.ts-flag:is(.is-tj-flag, .is-tajikistan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tj.svg");
}
.ts-flag:is(.is-tk-flag, .is-tokelau-flag) {
background-image: url("./flags/4x3/tk.svg");
}
.ts-flag:is(.is-tk-flag, .is-tokelau-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tk.svg");
}
.ts-flag:is(.is-tl-flag, .is-timorleste-flag) {
background-image: url("./flags/4x3/tl.svg");
}
.ts-flag:is(.is-tl-flag, .is-timorleste-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tl.svg");
}
.ts-flag:is(.is-tm-flag, .is-turkmenistan-flag) {
background-image: url("./flags/4x3/tm.svg");
}
.ts-flag:is(.is-tm-flag, .is-turkmenistan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tm.svg");
}
.ts-flag:is(.is-tn-flag, .is-tunisia-flag) {
background-image: url("./flags/4x3/tn.svg");
}
.ts-flag:is(.is-tn-flag, .is-tunisia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tn.svg");
}
.ts-flag:is(.is-to-flag, .is-tonga-flag) {
background-image: url("./flags/4x3/to.svg");
}
.ts-flag:is(.is-to-flag, .is-tonga-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/to.svg");
}
.ts-flag:is(.is-tr-flag, .is-turkey-flag) {
background-image: url("./flags/4x3/tr.svg");
}
.ts-flag:is(.is-tr-flag, .is-turkey-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tr.svg");
}
.ts-flag:is(.is-tt-flag, .is-trinidad-flag) {
background-image: url("./flags/4x3/tt.svg");
}
.ts-flag:is(.is-tt-flag, .is-trinidad-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tt.svg");
}
.ts-flag:is(.is-tv-flag, .is-tuvalu-flag) {
background-image: url("./flags/4x3/tv.svg");
}
.ts-flag:is(.is-tv-flag, .is-tuvalu-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tv.svg");
}
.ts-flag:is(.is-tw-flag, .is-taiwan-flag, .is-republic-of-china-flag, .is-formosa-flag) {
background-image: url("./flags/4x3/tw.svg");
}
.ts-flag:is(.is-tw-flag, .is-taiwan-flag, .is-republic-of-china-flag, .is-formosa-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tw.svg");
}
.ts-flag:is(.is-tz-flag, .is-tanzania-flag) {
background-image: url("./flags/4x3/tz.svg");
}
.ts-flag:is(.is-tz-flag, .is-tanzania-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/tz.svg");
}
.ts-flag:is(.is-ua-flag, .is-ukraine-flag) {
background-image: url("./flags/4x3/ua.svg");
}
.ts-flag:is(.is-ua-flag, .is-ukraine-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ua.svg");
}
.ts-flag:is(.is-ug-flag, .is-uganda-flag) {
background-image: url("./flags/4x3/ug.svg");
}
.ts-flag:is(.is-ug-flag, .is-uganda-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ug.svg");
}
.ts-flag:is(.is-um-flag, .is-us-minor-islands-flag) {
background-image: url("./flags/4x3/um.svg");
}
.ts-flag:is(.is-um-flag, .is-us-minor-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/um.svg");
}
.ts-flag:is(.is-un-flag, .is-united-nations-flag) {
background-image: url("./flags/4x3/un.svg");
}
.ts-flag:is(.is-un-flag, .is-united-nations-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/un.svg");
}
.ts-flag:is(.is-us-flag, .is-united-states-flag, .is-america-flag, .is-usa-flag) {
background-image: url("./flags/4x3/us.svg");
}
.ts-flag:is(.is-us-flag, .is-united-states-flag, .is-america-flag, .is-usa-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/us.svg");
}
.ts-flag:is(.is-uy-flag, .is-uruguay-flag) {
background-image: url("./flags/4x3/uy.svg");
}
.ts-flag:is(.is-uy-flag, .is-uruguay-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/uy.svg");
}
.ts-flag:is(.is-uz-flag, .is-uzbekistan-flag) {
background-image: url("./flags/4x3/uz.svg");
}
.ts-flag:is(.is-uz-flag, .is-uzbekistan-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/uz.svg");
}
.ts-flag:is(.is-va-flag, .is-vatican-city-flag) {
background-image: url("./flags/4x3/va.svg");
}
.ts-flag:is(.is-va-flag, .is-vatican-city-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/va.svg");
}
.ts-flag:is(.is-vc-flag, .is-saint-vincent-flag) {
background-image: url("./flags/4x3/vc.svg");
}
.ts-flag:is(.is-vc-flag, .is-saint-vincent-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/vc.svg");
}
.ts-flag:is(.is-ve-flag, .is-venezuela-flag) {
background-image: url("./flags/4x3/ve.svg");
}
.ts-flag:is(.is-ve-flag, .is-venezuela-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ve.svg");
}
.ts-flag:is(.is-vg-flag, .is-british-virgin-islands-flag) {
background-image: url("./flags/4x3/vg.svg");
}
.ts-flag:is(.is-vg-flag, .is-british-virgin-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/vg.svg");
}
.ts-flag:is(.is-vi-flag, .is-us-virgin-islands-flag) {
background-image: url("./flags/4x3/vi.svg");
}
.ts-flag:is(.is-vi-flag, .is-us-virgin-islands-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/vi.svg");
}
.ts-flag:is(.is-vn-flag, .is-vietnam-flag) {
background-image: url("./flags/4x3/vn.svg");
}
.ts-flag:is(.is-vn-flag, .is-vietnam-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/vn.svg");
}
.ts-flag:is(.is-vu-flag, .is-vanuatu-flag) {
background-image: url("./flags/4x3/vu.svg");
}
.ts-flag:is(.is-vu-flag, .is-vanuatu-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/vu.svg");
}
.ts-flag:is(.is-wf-flag, .is-wallis-and-futuna-flag, .is-wallis-flag, .is-futuna-flag) {
background-image: url("./flags/4x3/wf.svg");
}
.ts-flag:is(.is-wf-flag, .is-wallis-and-futuna-flag, .is-wallis-flag, .is-futuna-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/wf.svg");
}
.ts-flag:is(.is-ws-flag, .is-samoa-flag) {
background-image: url("./flags/4x3/ws.svg");
}
.ts-flag:is(.is-ws-flag, .is-samoa-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ws.svg");
}
.ts-flag:is(.is-ye-flag, .is-yemen-flag) {
background-image: url("./flags/4x3/ye.svg");
}
.ts-flag:is(.is-ye-flag, .is-yemen-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/ye.svg");
}
.ts-flag:is(.is-yt-flag, .is-mayotte-flag) {
background-image: url("./flags/4x3/yt.svg");
}
.ts-flag:is(.is-yt-flag, .is-mayotte-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/yt.svg");
}
.ts-flag:is(.is-za-flag, .is-south-africa-flag) {
background-image: url("./flags/4x3/za.svg");
}
.ts-flag:is(.is-za-flag, .is-south-africa-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/za.svg");
}
.ts-flag:is(.is-zm-flag, .is-zambia-flag) {
background-image: url("./flags/4x3/zm.svg");
}
.ts-flag:is(.is-zm-flag, .is-zambia-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/zm.svg");
}
.ts-flag:is(.is-zw-flag, .is-zimbabwe-flag) {
background-image: url("./flags/4x3/zw.svg");
}
.ts-flag:is(.is-zw-flag, .is-zimbabwe-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/zw.svg");
}
.ts-flag:is(.is-zz-flag, .is-unknown-flag) {
background-image: url("./flags/4x3/zz.svg");
}
.ts-flag:is(.is-zz-flag, .is-unknown-flag):is(.is-squared, .is-circular) {
background-image: url("./flags/1x1/zz.svg");
}
/* ==========================================================================
Variables
========================================================================== */
.ts-statistic {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-statistic {
display: flex;
color: inherit;
gap: 0.5rem;
align-items: center;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-statistic .value {
display: inline-flex;
font-size: var(--ts-relative-massive);
font-weight: 500;
line-height: 1.4;
align-items: center;
color: var(--accent-color, inherit);
}
.ts-statistic .unit {
font-size: var(--ts-relative-medium);
color: var(--ts-gray-600);
}
.ts-statistic .comparison {
font-size: var(--ts-relative-medium);
display: flex;
align-items: center;
justify-content: center;
color: var(--ts-gray-600);
}
.ts-statistic .comparison::before {
font-family: "Icons";
margin-right: 0.35rem;
margin-top: 2px;
font-size: 1rem;
}
.ts-statistic .ts-icon {
font-size: var(--ts-relative-massive);
margin-right: 0.5rem;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Aligns
*/
.ts-statistic.is-start-aligned > .value {
justify-content: flex-start;
}
.ts-statistic.is-center-aligned > .value {
justify-content: center;
}
/**
* Centered
*/
.ts-statistic.is-centered {
display: flex;
align-items: center;
justify-content: center;
}
/**
* Text
*/
.ts-statistic > .value.is-text {
font-size: 1em;
min-height: calc(2.125rem + 0.3rem);
}
/**
* Comparisons
*/
.ts-statistic .comparison.is-increased::before {
content: "\f0d8";
}
.ts-statistic .comparison.is-decreased::before {
content: "\f0d7";
}
.ts-statistic.is-increased .value::before,
.ts-statistic.is-decreased .value::before {
font-family: "Icons";
margin-right: 0.5rem;
}
.ts-statistic.is-increased .value::before {
content: "\f0d8";
}
.ts-statistic.is-decreased .value::before {
content: "\f0d7";
}
/**
* Fluid
*/
.ts-statistic.is-fluid {
width: 100%;
}
/**
* Sizes
*/
.ts-statistic.is-mini.is-mini.is-mini {
font-size: 0.8125rem;
}
.ts-statistic.is-tiny.is-tiny.is-tiny {
font-size: 0.875rem;
}
.ts-statistic.is-small.is-small.is-small {
font-size: 0.9375rem;
}
.ts-statistic.is-large.is-large.is-large {
font-size: 1.125rem;
}
.ts-statistic.is-big.is-big.is-big {
font-size: 1.375rem;
}
.ts-statistic.is-huge.is-huge.is-huge {
font-size: 1.75rem;
}
.ts-statistic.is-massive.is-massive.is-massive {
font-size: 2rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-app-sidebar {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-app-sidebar {
margin-right: 1.5rem;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-app-sidebar .item {
padding: 0.7rem 1.5rem;
display: flex;
font-weight: 500;
color: var(--ts-gray-800);
text-decoration: none;
}
.ts-app-sidebar .header {
font-weight: bold;
padding: 0.75rem 1.5rem;
font-size: var(--ts-font-size-15px);
color: var(--ts-gray-500);
}
.ts-app-sidebar .item + .header {
margin-top: 1.5rem;
}
.ts-app-sidebar .item .ts-icon {
margin-right: 1rem;
font-size: 1.1em;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Active
*/
.ts-app-sidebar .item.is-active {
background: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
border-radius: 0px 100rem 100rem 0;
}
/**
* Disabled
*/
.ts-app-sidebar .item.is-disabled,
.ts-app-sidebar .item:disabled {
opacity: 0.5;
pointer-events: none;
user-select: none;
}
/**
* Dense
*/
.ts-app-sidebar.is-dense .item {
padding-top: 0.4rem;
padding-bottom: 0.4rem;
}
.ts-app-sidebar.is-dense .item + .header {
margin-top: 0.5rem;
}
.ts-app-sidebar.is-dense .header {
padding-top: 0.45rem;
padding-bottom: 0.45rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-app-navbar {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-app-navbar {
display: inline-flex;
align-items: center;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-app-navbar .item {
color: var(--ts-gray-500);
text-decoration: none;
text-align: center;
display: inline-flex;
gap: 0.3rem;
align-items: center;
justify-content: center;
flex-direction: column;
margin: 0 0;
padding-left: 1rem;
padding-right: 1rem;
font-weight: 500;
font-size: 14px;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: transparent;
}
.ts-app-navbar .item .ts-icon {
line-height: 1.2;
font-size: 1.2rem;
}
.ts-app-navbar .item .label {
line-height: 1;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Fluid
*/
.ts-app-navbar.is-fluid {
display: flex;
}
.ts-app-navbar.is-fluid .item {
flex: 1;
}
/**
* Unlabeled
*/
.ts-app-navbar.is-unlabeled .item:not(.is-active) .label {
display: none;
}
/**
* Active
*/
.ts-app-navbar .item.is-active {
color: var(--accent-color, var(--ts-gray-800));
}
.ts-app-navbar .item.is-active .ts-icon {
--accent-color: inherit;
--accent-foreground-color: inherit;
}
/**
* Disabled
*/
.ts-app-navbar .item.is-disabled,
.ts-app-navbar .item:disabled {
opacity: 0.5;
pointer-events: none;
user-select: none;
}
/**
* Vertical
*/
.ts-app-navbar.is-vertical {
flex-direction: column;
}
.ts-app-navbar.is-vertical .item {
padding-top: 0.8rem;
padding-bottom: 0.8rem;
padding-left: 0;
padding-right: 0;
}
.ts-app-navbar.is-vertical .item:first-child {
padding-top: 0;
}
/**
* Indicated
*/
.ts-app-navbar.is-indicated .item {
color: var(--ts-gray-800);
}
.ts-app-navbar.is-indicated .item .ts-icon {
padding: 0.25rem 1rem;
line-height: 1.2;
font-size: 1.2rem;
display: flex;
min-height: 26px;
align-items: center;
justify-content: center;
width: auto;
border-radius: 100rem;
}
.ts-app-navbar.is-indicated .item.is-active .ts-icon {
background: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
}
/**
* Dense
*/
.ts-app-navbar.is-dense .item {
gap: 0.25rem;
}
.ts-app-navbar.is-dense.is-indicated .item .ts-icon {
padding-top: 0.15rem;
padding-bottom: 0.15rem;
min-height: 25px;
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-snackbar {
background: var(--ts-static-gray-800);
color: var(--ts-white);
display: inline-flex;
padding: 0.35rem 1rem;
border-radius: var(--ts-border-radius-element);
font-size: var(--ts-absolute-small);
}
/* ==========================================================================
Structure
========================================================================== */
.ts-snackbar .content {
margin: 0.25rem 0;
}
.ts-snackbar .action {
border: none;
margin: 0;
padding: 0;
width: auto;
overflow: visible;
background: transparent;
font: inherit;
line-height: normal;
outline: none;
box-sizing: border-box;
user-select: none;
margin-right: -0.5rem;
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
appearance: none;
-webkit-appearance: none;
margin-left: 1rem;
align-self: flex-start;
padding: 0.6em 1em;
font-weight: 500;
line-height: 1;
white-space: nowrap;
color: var(--ts-primary-400);
border-radius: var(--ts-border-radius-element);
font-size: var(--ts-absolute-small);
cursor: pointer;
}
.ts-snackbar .close {
border: none;
margin: 0;
padding: 0;
overflow: visible;
color: inherit;
font: inherit;
border-radius: 0;
outline: none;
box-sizing: border-box;
user-select: none;
appearance: none;
-webkit-appearance: none;
font-family: "Icons";
font-weight: normal;
font-style: normal;
text-decoration: inherit;
text-align: center;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
display: inline-flex;
align-items: center;
justify-content: center;
cursor: pointer;
font-size: var(--ts-font-size-18px);
line-height: 1;
background: transparent;
height: 32px;
width: 32px;
padding-top: 1px;
margin-left: 1rem;
margin-right: -0.5rem;
}
.ts-snackbar .action + .close {
margin-left: 0.5rem;
}
.ts-snackbar .close::before {
content: "\f00d";
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Negative
*/
.ts-snackbar .action.is-negative {
color: var(--ts-negative-500);
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
details.ts-accordion {
color: inherit;
box-sizing: border-box;
}
/* ==========================================================================
Structure
========================================================================== */
details.ts-accordion summary {
list-style-type: none;
}
details.ts-accordion summary::-webkit-details-marker {
display: none;
}
details.ts-accordion summary::marker {
display: none;
}
details.ts-accordion summary {
display: flex;
align-items: center;
user-select: none;
cursor: pointer;
}
details.ts-accordion summary::before {
font-family: "Icons";
font-weight: normal;
font-style: normal;
display: inline;
text-decoration: inherit;
text-align: center;
width: 1.18em;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
display: block;
margin-right: 0.7rem;
color: var(--ts-gray-600);
transform: rotate(270deg);
content: "\f078";
line-height: 1;
font-size: 14px;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Open
*/
details.ts-accordion[open] summary::before {
transform: rotate(0deg);
}
details.ts-accordion[open] summary {
margin-bottom: 0.5rem;
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
/* ==========================================================================
Structure
========================================================================== */
.ts-mask {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgb(0 0 0 / 50%);
color: var(--ts-gray-50);
z-index: var(--ts-z-mask);
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Vertical Aligns
*/
.ts-mask.is-top {
top: 0;
bottom: initial;
}
.ts-mask.is-middle {
top: 50%;
transform: translateY(-50%);
bottom: initial;
}
.ts-mask.is-bottom {
bottom: 0;
top: initial;
}
/**
* Blurring
*/
.ts-mask.is-blurring {
backdrop-filter: blur(3px);
}
/**
* Secondary
*/
.ts-mask.is-secondary {
background: transparent;
color: var(--ts-gray-800);
}
/**
* Faded
*/
.ts-mask.is-faded.is-top {
background: linear-gradient(to bottom, rgb(0 0 0 / 50%) 0%, rgba(0, 0, 0, 0) 100%);
}
.ts-mask.is-faded.is-bottom {
background: linear-gradient(to top, rgb(0 0 0 / 50%) 0%, rgba(0, 0, 0, 0) 100%);
}
/* ==========================================================================
Variables
========================================================================== */
@keyframes ts-placeholder-shimmer {
0% {
background-position: -1000px 0;
}
100% {
background-position: 1000px 0;
}
}
@keyframes ts-placeholder-blink {
30% {
opacity: 0;
}
}
/* ==========================================================================
Base
========================================================================== */
.ts-placeholder {
position: relative;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-placeholder .text,
.ts-placeholder .image.is-header::after,
.ts-placeholder .image.is-header::before,
.ts-placeholder .image {
background: var(--ts-gray-200);
height: 0.8em;
width: 45%;
margin: 0.8em 0;
}
.ts-placeholder:first-child > *:first-child {
margin-top: 0;
}
.ts-placeholder:last-child > *:last-child {
margin-bottom: 0;
}
.ts-placeholder .image {
height: 150px;
width: 100%;
}
.ts-placeholder .text:nth-child(1) {
width: 43%;
}
.ts-placeholder .text:nth-child(2) {
width: 78%;
}
.ts-placeholder .text:nth-child(3) {
width: 70%;
}
.ts-placeholder .text:nth-child(4) {
width: 80%;
}
.ts-placeholder .text:nth-child(5) {
width: 60%;
}
.ts-placeholder .text:nth-child(6) {
width: 44%;
}
.ts-placeholder .text:nth-child(7) {
width: 63%;
}
.ts-placeholder .text:nth-child(8) {
width: 49%;
}
.ts-placeholder .text:nth-child(9) {
width: 72%;
}
.ts-placeholder .text:nth-child(10) {
width: 61%;
}
.ts-placeholder .text:nth-child(11) {
width: 45%;
}
.ts-placeholder .text:nth-child(12) {
width: 55%;
}
.ts-placeholder .text:nth-child(13) {
width: 56%;
}
.ts-placeholder .text:nth-child(14) {
width: 57%;
}
.ts-placeholder .text:nth-child(15) {
width: 73%;
}
.ts-placeholder .text:nth-child(16) {
width: 59%;
}
.ts-placeholder .text:nth-child(17) {
width: 47%;
}
.ts-placeholder .text:nth-child(18) {
width: 77%;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Header
*/
.ts-placeholder .text.is-header {
background: var(--ts-gray-300);
}
.ts-placeholder .image.is-header {
width: 36px;
height: 36px;
position: static;
}
.ts-placeholder .image.is-header::after,
.ts-placeholder .image.is-header::before {
position: absolute;
content: "";
margin: 0;
}
.ts-placeholder .image.is-header::after {
top: 0;
left: calc(36px + 1rem);
width: 65%;
background: var(--ts-gray-300);
}
.ts-placeholder .image.is-header::before {
top: 25px;
left: calc(36px + 1rem);
width: 55%;
}
/**
* Preparing
*/
.ts-placeholder.is-preparing .text,
.ts-placeholder.is-preparing .text.is-header,
.ts-placeholder.is-preparing .image.is-header::after,
.ts-placeholder.is-preparing .image.is-header::before,
.ts-placeholder.is-preparing .image {
animation-duration: 1.8s;
animation-fill-mode: alternate;
animation-iteration-count: infinite;
animation-name: ts-placeholder-blink;
animation-timing-function: linear;
}
/**
* Loading
*/
.ts-placeholder.is-loading .text,
.ts-placeholder.is-loading .text.is-header,
.ts-placeholder.is-loading .image.is-header::after,
.ts-placeholder.is-loading .image.is-header::before,
.ts-placeholder.is-loading .image {
animation-duration: 1.2s;
animation-fill-mode: forwards;
animation-iteration-count: infinite;
animation-name: ts-placeholder-shimmer;
animation-timing-function: linear;
background: linear-gradient(to right, var(--ts-gray-200) 8%, var(--ts-gray-300) 18%, var(--ts-gray-200) 33%);
background-size: 1000px 200px;
}
.ts-placeholder.is-loading .text.is-header {
background: linear-gradient(to right, var(--ts-gray-300) 8%, var(--ts-gray-400) 18%, var(--ts-gray-300) 33%);
background-size: 1000px 200px;
}
/**
* Rounded
*/
.ts-placeholder.is-rounded * {
border-radius: var(--ts-border-radius-element);
}
/**
* Widthes
*/
.ts-placeholder .text.is-short {
width: 30%;
}
.ts-placeholder .text.is-very-short {
width: 30%;
}
.ts-placeholder .text.is-extra-short {
width: 20%;
}
.ts-placeholder .text.is-long {
width: 70%;
}
.ts-placeholder .text.is-very-long {
width: 80%;
}
.ts-placeholder .text.is-extra-long {
width: 90%;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-header {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-header {
font-weight: 500;
font-size: var(--ts-font-size-17px);
color: var(--accent-color, inherit);
line-height: 1.5;
display: flex;
align-items: center;
}
/* ==========================================================================
Structure
========================================================================== */
a.ts-header {
text-decoration: none;
}
a.ts-header:hover {
text-decoration: underline;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Truncated
*/
.ts-header.is-truncated {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
display: block;
}
/**
* Negative
*/
.ts-header.is-negative {
color: var(--ts-negative-600);
}
/**
* Heavy
*/
.ts-header.is-heavy {
font-weight: bold !important;
}
/**
* Aligns
*/
.ts-header.is-center-aligned {
text-align: center;
justify-content: center;
}
.ts-header.is-start-aligned {
text-align: left;
justify-content: flex-start;
}
.ts-header.is-end-aligned {
text-align: right;
justify-content: flex-end;
}
/**
* Uppercased
*/
.ts-header.is-uppercased {
text-transform: uppercase;
}
/**
* Lowercased
*/
.ts-header.is-lowercased {
text-transform: lowercase;
}
/**
* Icon
*/
.ts-header.is-icon {
text-align: center;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.ts-header.is-icon .ts-icon {
font-size: 3em;
width: auto;
line-height: 1;
margin-bottom: 0.5rem;
}
/**
* Side Icon
*/
.ts-header:is(.is-start-icon, .is-end-icon) .ts-icon {
font-size: 1.25em;
}
.ts-header.is-start-icon .ts-icon {
margin-right: 0.6rem;
}
.ts-header.is-end-icon .ts-icon {
margin-left: 0.6rem;
}
/**
* Secondary
*/
.ts-header.is-secondary {
color: var(--ts-gray-500);
}
/**
* Sizes
*/
.ts-header.is-large {
font-size: var(--ts-font-size-20px);
}
.ts-header.is-big {
font-size: var(--ts-font-size-24px);
}
.ts-header.is-huge {
font-size: var(--ts-font-size-30px);
}
.ts-header.is-massive {
font-size: var(--ts-font-size-33px);
}
/**
* Tight
*/
.ts-header.is-tight {
line-height: 1.3;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-segment {
--accent-color: initial;
--accent-foreground-color: initial;
--ts-indicator-color: var(--accent-color, var(--ts-gray-900));
}
/* ==========================================================================
Base
========================================================================== */
.ts-segment {
display: block;
text-decoration: none;
color: inherit;
border: 1px solid var(--ts-gray-300);
border-radius: var(--ts-border-radius-container);
overflow: hidden;
padding: 1rem;
box-sizing: border-box;
background: var(--ts-gray-50);
}
a.ts-segment:hover {
border-color: var(--ts-gray-400);
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Collapsed
*/
.ts-segment.is-collapsed {
width: fit-content;
}
/**
* Indicated
*/
.ts-segment.is-top-indicated {
border-top: 3px solid var(--ts-indicator-color);
}
.ts-segment.is-bottom-indicated {
border-bottom: 3px solid var(--ts-indicator-color);
}
.ts-segment.is-left-indicated {
border-left: 3px solid var(--ts-indicator-color);
}
.ts-segment.is-right-indicated {
border-right: 3px solid var(--ts-indicator-color);
}
/**
* Secondary
*/
.ts-segment.is-secondary {
background: var(--ts-gray-75);
}
/**
* Tertiary
*/
.ts-segment.is-tertiary {
background: var(--ts-gray-100);
}
/**
* Aligns
*/
.ts-segment.is-start-aligned {
text-align: left;
}
.ts-segment.is-end-aligned {
text-align: right;
}
.ts-segment.is-center-aligned {
text-align: center;
}
/**
* Emphasises
*/
.ts-segment[class*="-indicated"].is-negative {
--ts-indicator-color: var(--ts-negative-500);
}
.ts-segment[class*="-indicated"].is-positive {
--ts-indicator-color: var(--ts-positive-500);
}
.ts-segment[class*="-indicated"].is-warning {
--ts-indicator-color: var(--ts-warning-500);
}
/**
* Elevated
*/
.ts-segment.is-elevated {
box-shadow: 0px 1px 5px 0 #00000024;
}
.ts-segment.is-very-elevated {
box-shadow: rgb(0 0 0 / 20%) 0px 3px 3px -2px, rgb(0 0 0 / 14%) 0px 3px 4px 0px, rgb(0 0 0 / 12%) 0px 1px 8px 0px;
}
/**
* Padded
*/
.ts-segment.is-padded {
padding: 1.5rem;
}
.ts-segment.is-horizontally-padded {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
.ts-segment.is-vertically-padded {
padding-top: 1.5rem;
padding-bottom: 1.5rem;
}
.ts-segment.is-very-padded {
padding: 3.5rem;
}
.ts-segment.is-horizontally-very-padded {
padding-left: 3.5rem;
padding-right: 3.5rem;
}
.ts-segment.is-vertically-very-padded {
padding-top: 3.5rem;
padding-bottom: 3.5rem;
}
/**
* Dense
*/
.ts-segment.is-dense {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-quote {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-quote {
position: relative;
padding-left: 3rem;
padding-top: 1rem;
color: inherit;
}
.ts-quote::before {
content: "“";
position: absolute;
top: 0em;
left: 0px;
font-size: 5rem;
font-family: Georgia, "Times New Roman", Times;
color: var(--accent-color, var(--ts-gray-300));
line-height: 1;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-quote .cite {
font-style: normal;
color: var(--ts-gray-600);
margin-top: 1rem;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Heading
*/
.ts-quote.is-heading {
font-size: var(--ts-font-size-20px);
font-weight: 500;
color: var(--ts-gray-800);
padding: 0;
text-align: center;
}
.ts-quote.is-heading::before {
background: var(--accent-color, var(--ts-gray-100));
color: var(--accent-foreground-color, var(--ts-gray-800));
border-radius: 50%;
content: "”";
display: block;
font-size: 3.3rem;
font-weight: bold;
line-height: 1.2;
margin: 0 auto 0.5rem auto;
text-align: center;
height: 2.6rem;
width: 2.6rem;
position: relative;
}
.ts-quote.is-heading .cite {
font-size: 15px;
font-weight: normal;
margin-top: 0;
}
/**
* Secondary
*/
.ts-quote.is-secondary {
border-left: 5px solid var(--accent-color, var(--ts-gray-300));
padding: 0 0 0 2rem;
}
.ts-quote.is-secondary::before {
display: none;
}
/**
* Sizes
*/
.ts-quote.is-small {
font-size: var(--ts-font-size-14px);
}
.ts-quote.is-large {
font-size: var(--ts-font-size-17px);
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-app-layout {
display: flex;
flex-direction: row;
color: inherit;
height: 100%;
width: 100%;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-app-layout .cell {
flex-shrink: 0;
background: var(--ts-page-background-default);
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Full
*/
.ts-app-layout.is-full {
height: 100vh;
width: 100vw;
}
/**
* Horizontal
*/
.ts-app-layout.is-horizontal {
display: flex;
flex-direction: row;
}
.ts-app-layout.is-horizontal > .cell:not(:last-child) {
border-right: 1px solid var(--ts-gray-300);
}
.ts-app-layout .cell.is-horizontal {
display: flex;
flex-direction: row;
}
.ts-app-layout .cell.is-horizontal > .cell:not(:last-child) {
border-right: 1px solid var(--ts-gray-300);
}
/**
* Vertical
*/
.ts-app-layout.is-vertical {
display: flex;
flex-direction: column;
}
.ts-app-layout.is-vertical > .cell:not(:last-child) {
border-bottom: 1px solid var(--ts-gray-300);
}
.ts-app-layout .cell.is-vertical {
display: flex;
flex-direction: column;
}
.ts-app-layout .cell.is-vertical > .cell:not(:last-child) {
border-bottom: 1px solid var(--ts-gray-300);
}
/**
* Scrollable
*/
.ts-app-layout .cell.is-scrollable {
overflow-y: auto;
}
/**
* Fluid
*/
.ts-app-layout .cell.is-fluid {
flex: 1;
flex-shrink: 1;
}
/**
* Secondary
*/
.ts-app-layout .cell.is-secondary {
background: var(--ts-page-background-secondary);
}
/**
* Tertiary
*/
.ts-app-layout .cell.is-tertiary {
background: var(--ts-page-background-tertiary);
}
/* ==========================================================================
Variables
========================================================================== */
.ts-avatar {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-avatar {
display: inline-flex;
width: 32px;
height: 32px;
border-radius: var(--ts-border-radius-element);
overflow: hidden;
align-items: center;
justify-content: center;
vertical-align: middle;
border: 1px solid transparent;
white-space: nowrap;
overflow: hidden;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-avatar img {
width: 100%;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Circular
*/
.ts-avatar.is-circular,
.ts-avatar.is-circular img {
border-radius: 100rem;
}
/**
* Text
*/
.ts-avatar.is-text {
background: var(--accent-color, var(--ts-gray-200));
display: inline-flex;
align-items: center;
justify-content: center;
color: var(--accent-foreground-color, var(--ts-gray-600));
font-weight: 500;
font-size: 1.1rem;
}
/**
* Bordered
*/
.ts-avatar.is-bordered {
border-color: var(--ts-gray-300);
}
/**
* Group
*/
.ts-avatar.is-group {
height: initial;
width: initial;
justify-content: flex-end;
flex-direction: row-reverse;
}
.ts-avatar.is-group .ts-avatar:not(:last-child) {
margin-inline-start: -0.6rem;
}
/**
* Sizes
*/
.ts-avatar.is-small {
width: 24px;
height: 24px;
}
.ts-avatar.is-large {
width: 48px;
height: 48px;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-wrap {
--gap: 1rem;
}
/* ==========================================================================
Base
========================================================================== */
.ts-wrap {
display: flex;
gap: var(--gap);
flex-wrap: wrap;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Vertical
*/
.ts-wrap.is-vertical {
flex-direction: column;
flex-wrap: initial;
}
/**
* Aligns
*/
.ts-wrap.is-top-aligned {
align-items: flex-start;
}
.ts-wrap.is-middle-aligned {
align-items: center;
}
.ts-wrap.is-bottom-aligned {
align-items: flex-end;
}
.ts-wrap.is-start-aligned {
justify-content: flex-start;
}
.ts-wrap.is-center-aligned {
justify-content: center;
}
.ts-wrap.is-end-aligned {
justify-content: flex-end;
}
.ts-wrap.is-start-aligned.is-vertical {
align-items: flex-start;
}
.ts-wrap.is-center-aligned.is-vertical {
align-items: center;
}
.ts-wrap.is-end-aligned.is-vertical {
align-items: flex-end;
}
/**
* Relaxed
*/
.ts-wrap.is-relaxed {
--gap: 2rem;
}
/**
* Compact
*/
.ts-wrap.is-compact {
--gap: 0.5rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-container {
--ts-container-gap: 1rem;
}
/* ==========================================================================
Base
========================================================================== */
.ts-container {
margin: 0 auto;
padding: 0 var(--ts-container-gap);
max-width: 1180px;
width: 100%;
color: inherit;
box-sizing: border-box;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Fluid
*/
.ts-container.is-padded {
--ts-container-gap: 2rem;
}
.ts-container.is-fitted {
--ts-container-gap: 0;
}
/**
* Narrow
*/
.ts-container.is-narrow {
max-width: 910px;
}
.ts-container.is-very-narrow {
max-width: 720px;
}
/**
* Fluid
*/
.ts-container.is-fluid {
max-width: 100%;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-control {
--label-width: 220px;
}
/* ==========================================================================
Base
========================================================================== */
.ts-control {
color: inherit;
display: grid;
grid-template-columns: var(--label-width) 1fr;
gap: 2rem;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-control > .label {
word-break: break-all;
color: var(--ts-gray-800);
font-weight: 500;
text-align: right;
line-height: 2.4;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.ts-control > .content {
max-width: 75%;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Padded
*/
.ts-control > .content.is-padded {
padding-top: 0.45rem;
}
/**
* Padded
*/
.ts-control.is-stacked {
grid-template-columns: 1fr;
gap: 1rem;
}
.ts-control.is-stacked > .label {
text-align: left;
line-height: 1.4;
}
.ts-control.is-stacked > .content {
width: 100%;
max-width: 100%;
}
/**
* Fluid
*/
.ts-control > .content.is-fluid {
max-width: initial;
}
/**
* Aligns
*/
.ts-control > .label.is-start-aligned {
text-align: left;
}
/**
* Wide
*/
.ts-control.is-wide {
--label-width: 150px;
}
.ts-control.is-wide > .content {
max-width: 90%;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-menu {
--object-distance: 0.8rem;
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-menu {
color: inherit;
display: flex;
flex-direction: column;
}
.ts-menu .item {
font-family: inherit;
appearance: none;
border: unset;
font-size: inherit;
text-align: inherit;
background: transparent;
color: inherit;
line-height: 1;
text-decoration: none;
display: flex;
align-items: center;
padding: 0.8rem 1rem;
gap: var(--object-distance);
}
.ts-menu .item .ts-icon {
font-size: 1.1em;
}
.ts-menu .item .ts-badge {
margin-left: auto;
margin-top: -1px;
}
.ts-menu .item .ts-avatar {
margin-top: -0.4rem;
margin-bottom: -0.4rem;
}
.ts-menu .item .description {
font-size: var(--ts-relative-small);
color: var(--ts-gray-500);
text-align: right;
margin-left: auto;
float: right;
}
.ts-menu .item:hover {
cursor: pointer;
background: var(--ts-gray-75);
}
.ts-menu .item :where(.ts-row, .ts-grid) {
flex: 1;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Active
*/
.ts-menu .item.is-active {
background: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
}
/**
* Disabled
*/
.ts-menu .item.is-disabled,
.ts-menu .item:disabled {
opacity: 0.5;
pointer-events: none;
user-select: none;
}
/**
* Selected
*/
.ts-menu .item.is-selected {
background: var(--accent-color, var(--ts-primary-700));
color: var(--accent-foreground-color, var(--ts-white));
}
/**
* Separated
*/
.ts-menu.is-separated {
gap: 0.25rem;
}
.ts-menu.is-separated .item {
border-radius: var(--ts-border-radius-element);
}
/**
* Icon
*/
.ts-menu.is-start-icon .item .ts-icon {
min-width: 1rem;
text-align: center;
display: inline-block;
margin-top: 2px;
}
.ts-menu.is-end-icon .item .ts-icon {
margin-left: auto;
min-width: 1rem;
text-align: center;
display: inline-block;
margin-top: 2px;
}
/**
* Collapsed
*/
.ts-menu.is-collapsed {
width: fit-content;
}
/**
* Density
*/
.ts-menu.is-relaxed .item {
padding-top: 1.1rem;
padding-bottom: 1.1rem;
}
.ts-menu.is-dense .item {
padding-top: 0.65rem;
padding-bottom: 0.65rem;
}
/**
* Sizes
*/
.ts-menu.is-small {
font-size: var(--ts-font-size-14px);
}
.ts-menu.is-large {
font-size: var(--ts-font-size-16px);
}
/**
* Horizontally Padded
*/
.ts-menu.is-horizontally-padded .item {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
.ts-menu.is-horizontally-very-padded .item {
padding-left: 3.5rem;
padding-right: 3.5rem;
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-checklist {
margin-right: 1.5rem;
display: flex;
gap: 0.5rem;
flex-direction: column;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-checklist .item {
position: relative;
color: var(--ts-gray-800);
text-decoration: none;
padding-left: 28px;
}
.ts-checklist .item::before {
font-family: "Icons";
font-weight: normal;
font-style: normal;
text-decoration: inherit;
text-align: center;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
font-size: var(--ts-font-size-12px);
border-radius: 100rem;
line-height: 1;
height: 20px;
width: 20px;
padding: 0.25rem;
display: inline-block;
transform: scale(0.9);
padding-top: 0.3rem;
padding-bottom: 0.1rem;
vertical-align: middle;
position: absolute;
left: 0;
top: 3px;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Positive
*/
.ts-checklist .item.is-positive::before {
content: "\f00c";
background: var(--ts-tonal-positive-400);
color: var(--ts-tonal-positive-800);
}
/**
* Negative
*/
.ts-checklist .item.is-negative::before {
content: "\f00d";
background: var(--ts-tonal-negative-400);
color: var(--ts-tonal-negative-800);
}
/**
* Added
*/
.ts-checklist .item.is-added::before {
content: "\f067";
background: var(--ts-tonal-positive-400);
color: var(--ts-tonal-positive-800);
}
/**
* Removed
*/
.ts-checklist .item.is-removed::before {
content: "\f068";
background: var(--ts-tonal-negative-400);
color: var(--ts-tonal-negative-800);
}
/**
* Info
*/
.ts-checklist .item.is-info::before {
content: "\f129";
background: var(--ts-tonal-primary-400);
color: var(--ts-tonal-primary-800);
}
/**
* Info
*/
.ts-checklist .item.is-warning::before {
content: "\21";
background: var(--ts-tonal-warning-400);
color: var(--ts-tonal-warning-800);
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-imageset {
display: grid;
gap: 1rem;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-imageset .item {
min-height: min-content;
}
.ts-imageset .item img {
width: 100%;
height: 100%;
vertical-align: top;
object-fit: cover;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Images
*/
/** 2 */
.ts-imageset.is-2-images {
grid-template-columns: repeat(1, 1fr);
}
/** 3 */
.ts-imageset.is-3-images {
grid-template-columns: repeat(2, 1fr);
grid-template-rows: 1.777fr 1fr;
}
.ts-imageset.ts-imageset.is-3-images .item:first-child {
grid-column: 1 / 3;
}
/** 4 */
.ts-imageset.is-4-images {
grid-template-columns: repeat(3, 1fr);
grid-template-rows: 1.777fr 1fr;
}
.ts-imageset.ts-imageset.is-4-images .item:first-child {
grid-column: 1 / 4;
}
/**
* Portrait
*/
.ts-imageset.is-portrait .item img {
object-position: top;
}
/** 2 */
.ts-imageset.is-portrait.is-2-images {
grid-template-columns: repeat(2, 1fr);
}
/** 3 */
.ts-imageset.is-portrait.is-3-images {
grid-template-columns: 1.4fr 1fr;
grid-template-rows: repeat(2, 1fr);
}
.ts-imageset.is-portrait.is-3-images .item:first-child {
grid-row: 1 / 3;
grid-column: initial;
}
/** 4 */
.ts-imageset.is-portrait.is-4-images {
grid-template-columns: 1.4fr 1fr;
grid-template-rows: repeat(3, 1fr);
}
.ts-imageset.is-portrait.is-4-images .item:first-child {
grid-row: 1 / 4;
grid-column: initial;
}
/**
* Rounded
*/
.ts-imageset.is-rounded .item img {
border-radius: 0.4rem;
}
/**
* Circular
*/
.ts-imageset.is-circular.is-portrait .item:first-child img {
border-top-left-radius: 0.4rem;
border-bottom-left-radius: 0.4rem;
}
.ts-imageset.is-circular.is-portrait .item:nth-child(2) img {
border-top-right-radius: 0.4rem;
}
.ts-imageset.is-circular.is-portrait .item:last-child img {
border-bottom-right-radius: 0.4rem;
}
.ts-imageset.is-circular:not(.is-portrait) .item:first-child img {
border-top-right-radius: 0.4rem;
border-top-left-radius: 0.4rem;
}
.ts-imageset.is-circular:not(.is-portrait) .item:nth-child(2) img {
border-bottom-left-radius: 0.4rem;
}
.ts-imageset.is-circular:not(.is-portrait) .item:last-child img {
border-bottom-right-radius: 0.4rem;
}
/**
* Relaxed
*/
.ts-imageset.is-relaxed {
gap: 1.5rem;
}
/**
* Compact
*/
.ts-imageset.is-compact {
gap: 0.5rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-iconset {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-iconset {
display: flex;
gap: 1rem;
line-height: 1.7;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-iconset .ts-icon {
width: 3rem;
min-width: 3rem;
height: 3rem;
background: var(--accent-color, var(--ts-gray-100));
color: var(--accent-foreground-color, inherit);
justify-content: center;
align-items: center;
font-size: 1.4rem;
display: flex;
border-radius: var(--ts-border-radius-element);
}
.ts-iconset .content .title {
font-weight: 500;
line-height: 1.4;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Circular
*/
.ts-iconset.is-circular .ts-icon {
border-radius: 100rem;
}
/**
* Outlined
*/
.ts-iconset.is-outlined .ts-icon {
background: transparent;
color: var(--accent-color, inherit);
border: 2px solid var(--ts-gray-300);
box-sizing: border-box;
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-conversation {
display: flex;
gap: 1rem;
--brand-color: var(--ts-primary-600);
}
/**
* Avatar
*/
.ts-conversation .avatar img {
width: 40px;
border-radius: var(--ts-border-radius-element);
}
/**
* Bubble
*/
.ts-conversation .bubble {
position: relative;
background: var(--ts-gray-100);
border-radius: var(--ts-border-radius-container);
line-height: 1.5;
padding: 0.5rem 0.8rem;
font-size: var(--ts-font-size-14px);
overflow: hidden;
}
/** Clearfix for meta */
.ts-conversation .bubble::after {
content: "";
display: block;
clear: both;
}
/**
* Author
*/
.ts-conversation .bubble .author {
font-weight: 500;
color: var(--brand-color);
}
/**
* Meta
*/
.ts-conversation .bubble .meta {
position: relative;
float: right;
line-height: 1.5;
bottom: -3px;
margin-left: 0.6rem;
display: inline-flex;
gap: 0.65rem;
align-items: center;
justify-content: flex-end;
font-size: var(--ts-font-size-14px);
color: var(--ts-gray-500);
}
.ts-conversation .bubble .meta.is-floated {
position: absolute;
bottom: 0.5rem;
right: 0.5rem;
background: rgba(0, 0, 0, 0.2);
border-radius: var(--ts-border-radius-element);
padding: 0.1rem 0.4rem;
color: var(--ts-white);
}
/**
* Text
*/
.ts-conversation .bubble .text {
display: inline;
}
.ts-conversation .bubble .text a {
color: var(--ts-link-700);
}
/**
* Actions
*/
/**
* Meta
*/
/**
* Quote
*/
.ts-conversation .bubble .quote {
--brand-color: var(--ts-positive-600);
border-left: 2px solid var(--brand-color);
margin: 0.5rem 0;
padding-left: 0.8rem;
}
.ts-conversation .bubble .quote .author {
font-weight: 500;
color: var(--brand-color);
}
/**
* Preview
*/
.ts-conversation .bubble .preview {
padding-left: 0.8rem;
border-left: 2px solid var(--brand-color);
margin: 0.5rem 0;
display: flex;
flex-direction: column;
gap: 0.25rem;
--brand-color: #1074c5;
}
.ts-conversation .bubble .site {
font-weight: 500;
color: var(--brand-color);
}
.ts-conversation .bubble .title {
font-weight: 500;
}
.ts-conversation .bubble .embed {
overflow: hidden;
border-radius: var(--ts-border-radius-container);
}
.ts-conversation .bubble .embed > * {
width: 100%;
object-fit: cover;
vertical-align: top;
}
/**
* Object
*/
.ts-conversation .bubble .object {
margin: 0.4rem -0.8rem;
}
/* ==========================================================================
Variations
========================================================================== */
/**
*
*/
.ts-conversation:is(.is-sent, .is-sending, .is-error, .is-read, .is-warning) .bubble .meta::after {
color: var(--ts-gray-500);
font-family: "Icons";
font-weight: normal;
font-style: normal;
text-decoration: inherit;
text-align: center;
width: 1.18em;
-webkit-font-smoothing: antialiased;
backface-visibility: hidden;
font-size: var(--ts-font-size-13px);
}
.ts-conversation.is-sent .bubble .meta::after {
content: "\f00c";
}
.ts-conversation.is-sending .bubble .meta::after {
content: "\f017";
}
.ts-conversation.is-read .bubble .meta::after {
content: "\f560";
}
.ts-conversation.is-error .bubble .meta::after {
content: "\f071";
color: var(--ts-negative-400);
}
/**
* Self
*/
.ts-conversation.is-self {
flex-direction: row-reverse;
}
.ts-conversation.is-self .bubble {
background: #e8fbd1;
color: var(--ts-black);
}
.ts-conversation.is-self .bubble .author {
color: #538e0b;
}
.ts-conversation.is-self .bubble .meta,
.ts-conversation.is-self .bubble .meta::after {
color: #538e0b;
}
/**
* Object Only
*/
.ts-conversation.is-object-only .bubble {
padding: 0;
}
.ts-conversation.is-object-only .bubble .object {
margin: 0;
}
.ts-conversation.is-object-only .bubble .meta {
position: absolute;
bottom: 0.5rem;
right: 0.5rem;
background: rgba(0, 0, 0, 0.2);
border-radius: var(--ts-border-radius-element);
padding: 0.1rem 0.4rem;
color: var(--ts-white);
}
.ts-conversation.is-object-only .bubble .meta::after {
color: var(--ts-white);
}
/* ==========================================================================
Variables
========================================================================== */
dialog.ts-modal {
--width: 380px;
}
/* ==========================================================================
Base
========================================================================== */
dialog.ts-modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: none;
align-items: center;
justify-content: center;
overflow-y: auto;
padding: 2rem 1rem;
background: rgb(0 0 0 / 50%);
height: auto;
width: auto;
z-index: var(--ts-z-modal);
}
dialog.ts-modal:modal,
dialog.ts-modal:popover-open {
background: transparent;
}
dialog.ts-modal::backdrop {
background: rgb(0 0 0 / 50%);
}
/* ==========================================================================
Structure
========================================================================== */
dialog.ts-modal > .content {
background: var(--ts-gray-50);
border-radius: var(--ts-border-radius-container);
box-shadow: var(--ts-elevated-shadow-modal);
width: var(--width);
margin: auto;
overflow: hidden;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Open
*/
dialog.ts-modal[open],
dialog.ts-modal:popover-open {
display: flex;
}
/**
* Sizes
*/
dialog.ts-modal.is-small {
--width: 280px;
}
dialog.ts-modal.is-large {
--width: 580px;
}
dialog.ts-modal.is-big {
--width: 780px;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-gauge {
--length: 0.8;
--value: 0;
--size: 5rem;
--thickness: calc(var(--size) / 10);
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-gauge,
.ts-gauge .bar {
position: relative;
display: inline-grid;
height: var(--size);
width: var(--size);
place-content: center;
border-radius: 9999px;
background-color: transparent;
vertical-align: middle;
box-sizing: content-box;
}
.ts-gauge {
--value: 100;
transform: rotate(216deg);
}
/* ==========================================================================
Structure
========================================================================== */
.ts-gauge::before,
.ts-gauge .bar::before {
position: absolute;
border-radius: 9999px;
content: "";
}
.ts-gauge .bar::before {
top: 0;
right: 0;
bottom: 0;
left: 0;
background: conic-gradient(var(--accent-color, currentColor) calc(var(--value) * 1% * var(--length)), #0000 0);
-webkit-mask: radial-gradient(farthest-side, #0000 calc(99% - var(--thickness)), rgb(0 0 0 / 85%) calc(100% - var(--thickness)));
mask: radial-gradient(farthest-side, #0000 calc(99% - var(--thickness)), rgb(0 0 0 / 85%) calc(100% - var(--thickness)));
}
.ts-gauge::before {
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-mask: radial-gradient(farthest-side, #f000 calc(99% - var(--thickness)), #0000001a calc(100% - var(--thickness)));
mask: radial-gradient(farthest-side, #f000 calc(99% - var(--thickness)), #0000001a calc(100% - var(--thickness)));
background: conic-gradient(currentColor calc(var(--value) * var(--length) * 1%), #0000 0);
}
.ts-gauge .bar .text {
transform: rotate(-216deg);
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Circular
*/
.ts-gauge.is-circular {
transform: initial;
--length: 1;
}
.ts-gauge.is-circular .bar .text {
transform: initial;
}
/**
* Uplifted
*/
.ts-gauge.is-uplifted {
transform: rotate(180deg);
--length: 0.7;
}
.ts-gauge.is-uplifted .bar .text {
transform: rotate(-180deg);
}
/**
* Centered
*/
.ts-gauge.is-centered {
margin: 0 auto;
display: grid;
}
/**
* Sizes
*/
.ts-gauge.is-small {
--size: 4rem;
}
.ts-gauge.is-large {
--size: 6rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-tooltip {
--ts-tooltip-x: 0;
}
/* ==========================================================================
Base
========================================================================== */
.ts-tooltip {
position: fixed;
background: var(--ts-gray-600);
padding: 0.1rem 0.35rem;
font-size: var(--ts-font-size-13px);
border-radius: var(--ts-border-radius-secondary);
color: var(--ts-gray-50);
visibility: hidden;
font-weight: normal;
z-index: var(--ts-z-tooltip);
max-width: min(300px, calc(100vw - 2rem));
pointer-events: none;
margin: 0;
border: 0;
width: fit-content;
height: fit-content;
overflow: visible;
}
.ts-tooltip.is-visible {
visibility: visible;
}
.ts-tooltip .arrow {
position: absolute;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
pointer-events: none;
}
.ts-tooltip[class*="is-bottom"] .arrow {
top: -4px;
border-width: 0 5px 5px;
border-bottom-color: var(--ts-gray-600);
}
.ts-tooltip[class*="is-top"] .arrow {
bottom: -4px;
border-width: 5px 5px 0;
border-top-color: var(--ts-gray-600);
}
.ts-tooltip[class$="start"] .arrow {
left: 10px;
}
.ts-tooltip[class$="end"] .arrow {
right: 10px;
}
.ts-tooltip:not([class$="start"]):not([class$="end"]) .arrow {
left: calc(var(--ts-tooltip-x) - 2.5px);
}
/* ==========================================================================
Variations
========================================================================== */
/* ==========================================================================
Variables
========================================================================== */
.ts-dropdown {
--object-distance: 0.8rem;
--min-width: 10rem;
--ts-dropdown-min-width: 0px;
--ts-dropdown-position: absolute;
--accent-color: initial;
--accent-foreground-color: initial;
}
.ts-dropdown .item {
--indented-padding: 0px;
--padding-multiplier: 1;
--color: inherit;
}
.ts-dropdown .item .ts-icon {
--color: inherit;
}
/* ==========================================================================
Base
========================================================================== */
.ts-dropdown {
position: var(--ts-dropdown-position);
display: none;
color: inherit;
flex-direction: column;
z-index: var(--ts-z-dropdown);
border: 1px solid var(--ts-gray-300);
border-radius: var(--ts-border-radius-element);
background: var(--ts-gray-50);
box-shadow: var(--ts-elevated-shadow);
font-size: var(--ts-font-size-14px);
padding: 0.4rem 0;
white-space: nowrap;
min-width: max(var(--ts-dropdown-min-width), var(--min-width));
margin: 0;
width: fit-content;
height: fit-content;
overflow: auto;
overflow-x: hidden;
}
.ts-dropdown > .item {
font-family: inherit;
appearance: none;
border: unset;
font-size: inherit;
text-align: inherit;
background: transparent;
color: var(--color);
line-height: 1;
text-decoration: none;
display: flex;
align-items: center;
padding: 0.65rem calc(1rem * var(--padding-multiplier));
padding-left: calc((1rem + var(--indented-padding)) * var(--padding-multiplier));
gap: var(--object-distance);
min-width: 0;
}
.ts-dropdown .item .ts-icon {
color: var(--color);
font-size: 1.1em;
}
.ts-dropdown .item .ts-avatar {
margin-top: -0.4rem;
margin-bottom: -0.4rem;
margin-left: -0.2rem;
}
.ts-dropdown .item .description {
font-size: var(--ts-relative-small);
color: var(--ts-gray-500);
text-align: right;
margin-left: auto;
float: right;
}
.ts-dropdown .item:hover {
cursor: pointer;
background: var(--ts-gray-75);
}
.ts-dropdown .item :where(.ts-row, .ts-grid) {
flex: 1;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Active
*/
.ts-dropdown .item.is-active {
background: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
}
/**
* Header
*/
.ts-dropdown .item.is-header {
color: var(--ts-gray-500);
pointer-events: none;
user-select: none;
}
.ts-dropdown .item.is-header:hover {
cursor: default;
background: transparent;
}
/**
* Indented
*/
.ts-dropdown .item.is-indented {
--indented-padding: 0.5rem;
}
/**
* Disabled
*/
.ts-dropdown .item[disabled],
.ts-dropdown .item.is-disabled {
opacity: 0.5;
pointer-events: none;
user-select: none;
}
/**
* Selected
*/
.ts-dropdown .item.is-selected {
background: var(--accent-color, var(--ts-primary-700));
color: var(--accent-foreground-color, var(--ts-white));
}
.ts-dropdown .item.is-selected .ts-icon {
color: inherit;
}
.ts-dropdown .item.is-selected .description {
color: inherit;
opacity: 0.8;
}
/**
* Separated
*/
.ts-dropdown.is-separated {
gap: 0.25rem;
padding-left: 0.4rem;
padding-right: 0.4rem;
}
.ts-dropdown.is-separated .item {
--padding-multiplier: 0.8;
border-radius: var(--ts-border-radius-secondary);
}
/**
* Icon
*/
.ts-dropdown.is-start-icon .item .ts-icon {
min-width: 1rem;
text-align: center;
display: inline-block;
margin-top: 1px;
}
.ts-dropdown.is-end-icon .item .ts-icon {
margin-left: auto;
min-width: 1rem;
text-align: center;
display: inline-block;
margin-top: 1px;
}
/**
* Density
*/
.ts-dropdown.is-relaxed .item {
padding-top: 0.8rem;
padding-bottom: 0.8rem;
}
.ts-dropdown.is-dense .item {
padding-top: 0.55rem;
padding-bottom: 0.55rem;
}
/**
* Visible
*/
.ts-dropdown.is-visible {
display: inline-flex;
}
/**
* Scrollable
*/
.ts-dropdown.is-scrollable {
overflow: auto;
overflow-x: hidden;
}
/** (Below 766px) */
@media screen and (max-width: 766px) {
.ts-dropdown.is-scrollable {
max-height: 10rem;
}
}
/** (Above 766px) */
@media screen and (min-width: 766px) {
.ts-dropdown.is-scrollable {
max-height: 15rem;
}
}
/** (Above 993px) */
@media screen and (min-width: 993px) {
.ts-dropdown.is-scrollable {
max-height: 19rem;
}
}
/**
* Positions
*/
.ts-dropdown.is-top-left {
bottom: calc(100% + 0.5rem);
left: 0;
}
.ts-dropdown.is-bottom-left {
top: calc(100% + 0.5rem);
left: 0;
}
.ts-dropdown.is-bottom-center {
left: 50%;
transform: translateX(-50%);
top: calc(100% + 0.5rem);
}
.ts-dropdown.is-top-center {
left: 50%;
transform: translateX(-50%);
bottom: calc(100% + 0.5rem);
}
.ts-dropdown.is-top-right {
bottom: calc(100% + 0.5rem);
right: 0;
}
.ts-dropdown.is-bottom-right {
top: calc(100% + 0.5rem);
right: 0;
}
.ts-dropdown.is-top {
bottom: calc(100% + 0.5rem);
left: 0;
right: 0;
min-width: min-content;
}
.ts-dropdown.is-bottom {
top: calc(100% + 0.5rem);
left: 0;
right: 0;
min-width: min-content;
}
/**
* Checkbox
*/
/*
.ts-dropdown .item.is-checked {
color: var(--accent-color, var(--ts-primary-700));
}
.ts-dropdown .item .checkbox {
position: relative;
background: var(--ts-gray-200);
border: 1px solid var(--ts-gray-200);
border-radius: 0.2rem;
box-sizing: border-box;
color: inherit;
cursor: pointer;
font: inherit;
line-height: normal;
min-height: 1.15rem;
min-width: 1.15rem;
overflow: visible;
padding: 0;
user-select: none;
width: auto;
}
.ts-dropdown .item .checkbox::after {
display: none;
font-family: Icons;
font-size: 1rem;
font-style: normal;
font-weight: 400;
justify-content: center;
left: 0;
position: absolute;
right: 0;
text-align: center;
text-decoration: inherit;
top: 0;
transform: scale(0.8);
z-index: 1;
-webkit-font-smoothing: antialiased;
align-items: center;
backface-visibility: hidden;
bottom: 0;
color: var(--accent-foreground-color, var(--ts-white));
content: "\f00c";
}
.ts-dropdown .item.is-checked .checkbox {
background: var(--accent-color, var(--ts-primary-700));
border-color: var(--accent-color, var(--ts-primary-700));
}
.ts-dropdown .item.is-checked .checkbox::after {
display: flex;
}
*/
/* ==========================================================================
Variables
========================================================================== */
.ts-app-topbar {
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-app-topbar {
display: grid;
grid-template-columns: 1fr auto 1fr;
padding: 0.5rem 1rem;
background: var(--accent-color, var(--ts-static-gray-900));
color: var(--accent-foreground-color, var(--ts-white));
min-height: 50px;
align-items: center;
gap: 0.5rem;
}
.ts-app-topbar :is(.start, .end, .center) > .item {
border-radius: 100em;
text-decoration: none;
width: 38px;
height: 38px;
display: flex;
font-size: var(--ts-font-size-17px);
align-items: center;
justify-content: center;
margin-top: -0.1rem;
margin-bottom: -0.1rem;
}
.ts-app-topbar :is(.start, .end, .center) .item.is-text {
font-size: var(--ts-font-size-16px);
font-weight: 500;
width: auto;
height: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
border-radius: 0;
margin: 0;
display: block;
}
.ts-app-topbar :is(.start, .end) {
display: flex;
align-items: center;
gap: 0.25rem;
}
.ts-app-topbar .start {
justify-content: flex-start;
grid-column: 1 / 2;
}
.ts-app-topbar .start > .item:not(.is-text):first-child {
margin-left: -0.75rem;
}
.ts-app-topbar .center {
justify-content: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
grid-column: 2 / 3;
}
.ts-app-topbar .end {
justify-content: flex-end;
grid-column: 3 / 3;
}
.ts-app-topbar .end > .item:not(.is-text):last-child {
margin-right: -0.75rem;
}
.ts-app-topbar .content {
grid-column: 1 / 4;
}
/* ==========================================================================
Variations
========================================================================== */
/* ==========================================================================
Variables
========================================================================== */
dialog.ts-app-drawer {
--width: 380px;
}
/* ==========================================================================
Base
========================================================================== */
dialog.ts-app-drawer {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgb(0 0 0 / 50%);
display: none;
overflow-y: auto;
height: auto;
width: auto;
z-index: var(--ts-z-app-drawer);
}
dialog.ts-app-drawer:modal,
dialog.ts-app-drawer:popover-open {
background: transparent;
}
dialog.ts-app-drawer::backdrop {
background: rgb(0 0 0 / 50%);
}
/* ==========================================================================
Structure
========================================================================== */
.ts-app-drawer > .content {
background: var(--ts-gray-50);
box-shadow: var(--ts-elevated-shadow-drawer);
width: var(--width);
overflow: hidden;
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Visible
*/
dialog.ts-app-drawer[open],
dialog.ts-app-drawer:popover-open {
display: flex;
}
/**
* Positions
*/
.ts-app-drawer.is-bottom {
align-items: flex-end;
justify-content: center;
}
.ts-app-drawer.is-bottom {
--width: 100%;
}
.ts-app-drawer.is-right {
justify-content: flex-end;
}
.ts-app-drawer.is-left {
justify-content: flex-start;
}
/**
* Sizes
*/
.ts-app-drawer.is-small {
--width: 280px;
}
.ts-app-drawer.is-large {
--width: 580px;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-timeline {
--ts-timeline-top-line-height: 14px;
--ts-timeline-top-distance: calc(var(--ts-timeline-top-line-height) + 2px);
--ts-timeline-content-distance: 1rem;
--accent-color: initial;
--accent-foreground-color: initial;
}
/* ==========================================================================
Base
========================================================================== */
.ts-timeline {
display: grid;
grid-template-columns: min-content min-content auto;
gap: 0rem 1rem;
}
/* ==========================================================================
Structure
========================================================================== */
/**
* Item
*/
.ts-timeline > .item {
display: contents;
}
.ts-timeline > .item.is-secondary {
--ts-timeline-top-line-height: 2px;
--ts-timeline-top-distance: calc(var(--ts-timeline-top-line-height) - 4px);
}
.ts-timeline > .item:first-child,
.ts-timeline > .item.is-break + .item {
--ts-timeline-top-distance: 0;
}
/**
* Aside
*/
.ts-timeline > .item .aside {
margin-top: var(--ts-timeline-top-distance);
margin-bottom: 0.5rem;
white-space: nowrap;
text-align: right;
}
/**
* Indicator
*/
.ts-timeline > .item .indicator {
display: flex;
flex-direction: column;
align-items: center;
gap: 2px;
grid-column: 1 / 3;
}
.ts-timeline > .item .aside + .indicator {
grid-column: 2 / 3;
}
.ts-timeline > .item.is-break + .item.is-secondary .indicator,
.ts-timeline > .item.is-secondary:first-child .indicator {
margin-top: 6px;
}
.ts-timeline > .item .indicator::before {
display: block;
content: "";
background: var(--ts-gray-300);
pointer-events: none;
min-height: var(--ts-timeline-top-line-height);
width: 2px;
}
.ts-timeline > .item .indicator::after {
display: block;
flex: 1;
content: "";
background: var(--ts-gray-300);
pointer-events: none;
min-height: 0;
height: 100%;
width: 2px;
}
.ts-timeline > .item:last-child .indicator::after {
display: none;
}
.ts-timeline > .item:first-child .indicator::before,
.ts-timeline > .item.is-break + .item .indicator::before {
display: none;
}
.ts-timeline > .item:last-child .content,
.ts-timeline > .item.is-break + .item .content {
margin-bottom: 0;
}
/**
* Content
*/
.ts-timeline > .item .content {
flex: 1;
margin-top: var(--ts-timeline-top-distance);
margin-bottom: var(--ts-timeline-content-distance);
}
/**
* Break
*/
.ts-timeline > .item.is-break {
display: flex;
grid-column: 1 / 4;
height: 4px;
background: var(--ts-gray-300);
}
.ts-timeline > .item.is-break:not(:last-child) {
margin-bottom: var(--ts-timeline-content-distance);
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Icon Indicator
*/
.ts-timeline > .item .indicator .ts-icon {
aspect-ratio: 1/1;
width: 30px;
height: 30px;
font-size: var(--ts-font-size-14px);
display: flex;
align-items: center;
justify-content: center;
line-height: 1;
background: var(--ts-gray-100);
border-radius: 100rem;
color: var(--ts-gray-600);
}
.ts-timeline > .item.is-secondary .indicator .ts-icon {
aspect-ratio: 1/1;
width: 16px;
height: 16px;
background: initial;
}
.ts-timeline > .item .indicator.is-icon ~ .content::after {
width: 3px;
left: -45px;
}
/**
* Negative
*/
.ts-timeline > .item.is-negative .indicator .ts-icon {
background: var(--ts-negative-500);
color: var(--ts-white);
}
.ts-timeline > .item.is-negative.is-secondary .indicator .ts-icon {
background: initial;
color: var(--ts-negative-500);
}
/**
* Active
*/
.ts-timeline > .item.is-active .indicator .ts-icon {
background: var(--accent-color, var(--ts-gray-800));
color: var(--accent-foreground-color, var(--ts-gray-50));
}
.ts-timeline > .item.is-active.is-secondary .indicator .ts-icon {
background: initial;
color: var(--ts-gray-800);
}
/**
* Disabled
*/
.ts-timeline > .item.is-disabled :is(.aside, .content, .indicator) {
pointer-events: none;
opacity: 0.5;
user-select: none;
}
/**
* Compact
*/
.ts-timeline.is-compact {
--ts-timeline-content-distance: 0.5rem;
}
/* ==========================================================================
Variables
========================================================================== */
.ts-blankslate {
--accent-color: initial;
--accent-foreground-color: initial;
--padding: 3.5rem;
--icon-size: var(--ts-font-size-55px);
--header-font-size: var(--ts-font-size-17px);
--description-font-size: var(--ts-font-size-15px);
--header-distance: var(--ts-space-gap);
--description-distance: 0.25rem;
--icon-description-distance: var(--ts-space-gap);
}
/* ==========================================================================
Base
========================================================================== */
.ts-blankslate {
padding-bottom: var(--padding);
padding-top: var(--padding);
padding-left: 1rem;
padding-right: 1rem;
text-align: center;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-blankslate > .ts-icon {
font-size: var(--icon-size);
color: var(--accent-color, var(--ts-gray-800));
margin-top: 0.25rem;
display: inline-block;
line-height: 1;
}
.ts-blankslate .header {
color: var(--accent-color, var(--ts-gray-800));
font-size: var(--header-font-size);
font-weight: 500;
line-height: 1.6;
}
.ts-blankslate > .ts-icon + .header {
margin-top: var(--header-distance);
}
.ts-blankslate > .ts-icon + .description {
margin-top: var(--icon-description-distance);
}
.ts-blankslate .description {
color: var(--ts-gray-500);
font-size: var(--description-font-size);
margin-top: var(--description-distance);
}
.ts-blankslate .action {
margin-top: var(--ts-space-gap-large);
}
.ts-blankslate .action + .action {
margin-top: var(--ts-space-gap);
}
/* ==========================================================================
Variations
========================================================================== */
/**
* Narrow
*/
.ts-blankslate.is-narrow {
margin: 0 auto;
max-width: 430px;
}
/**
* Spacious
*/
.ts-blankslate.is-spacious {
--padding: 3.5rem;
}
/**
* Interactive
*/
.ts-blankslate.is-interactive {
display: block;
text-decoration: none;
}
.ts-blankslate.is-interactive:hover {
cursor: pointer;
background: var(--ts-gray-75);
}
/**
* Secondary
*/
.ts-blankslate.is-secondary > .ts-icon {
color: var(--ts-gray-500);
}
.ts-blankslate.is-secondary .header {
color: var(--ts-gray-500);
}
/**
* Sizes
*/
.ts-blankslate.is-small {
--padding: 1.5rem;
--icon-size: var(--ts-font-size-45px);
--header-font-size: var(--ts-font-size-16px);
--description-font-size: var(--ts-font-size-14px);
--header-distance: var(--ts-space-gap-small);
--description-distance: 0;
--icon-description-distance: var(--ts-space-gap-small);
}
.ts-blankslate.is-large {
--icon-size: var(--ts-font-size-65px);
--header-font-size: var(--ts-font-size-18px);
--header-distance: var(--ts-space-gap);
}
/* ==========================================================================
Variables
========================================================================== */
/* ==========================================================================
Base
========================================================================== */
.ts-app-center {
display: grid;
align-items: center;
justify-content: center;
height: 100%;
width: 100%;
margin: 0;
flex-direction: column;
color: inherit;
overflow-y: auto;
}
/* ==========================================================================
Structure
========================================================================== */
.ts-app-center > .content {
}
/**
* Padded
*/
.has-padded {
padding: var(--ts-space-gap) !important;
}
.has-padded-small {
padding: var(--ts-space-gap-small) !important;
}
.has-padded-large {
padding: var(--ts-space-gap-large) !important;
}
.has-padded-big {
padding: var(--ts-space-gap-big) !important;
}
.has-padded-huge {
padding: var(--ts-space-gap-huge) !important;
}
/** Horizontally */
.has-horizontally-padded {
padding-left: var(--ts-space-gap) !important;
padding-right: var(--ts-space-gap) !important;
}
.has-horizontally-padded-small {
padding-left: var(--ts-space-gap-small) !important;
padding-right: var(--ts-space-gap-small) !important;
}
.has-horizontally-padded-large {
padding-left: var(--ts-space-gap-large) !important;
padding-right: var(--ts-space-gap-large) !important;
}
.has-horizontally-padded-big {
padding-left: var(--ts-space-gap-big) !important;
padding-right: var(--ts-space-gap-big) !important;
}
.has-horizontally-padded-huge {
padding-left: var(--ts-space-gap-huge) !important;
padding-right: var(--ts-space-gap-huge) !important;
}
/** Vertically */
.has-vertically-padded {
padding-top: var(--ts-space-gap) !important;
padding-bottom: var(--ts-space-gap) !important;
}
.has-vertically-padded-small {
padding-top: var(--ts-space-gap-small) !important;
padding-bottom: var(--ts-space-gap-small) !important;
}
.has-vertically-padded-large {
padding-top: var(--ts-space-gap-large) !important;
padding-bottom: var(--ts-space-gap-large) !important;
}
.has-vertically-padded-big {
padding-top: var(--ts-space-gap-big) !important;
padding-bottom: var(--ts-space-gap-big) !important;
}
.has-vertically-padded-huge {
padding-top: var(--ts-space-gap-huge) !important;
padding-bottom: var(--ts-space-gap-huge) !important;
}
/** Bottom */
.has-bottom-padded {
padding-bottom: var(--ts-space-gap) !important;
}
.has-bottom-padded-small {
padding-bottom: var(--ts-space-gap-small) !important;
}
.has-bottom-padded-large {
padding-bottom: var(--ts-space-gap-large) !important;
}
.has-bottom-padded-big {
padding-bottom: var(--ts-space-gap-big) !important;
}
.has-bottom-padded-huge {
padding-bottom: var(--ts-space-gap-huge) !important;
}
/** Top */
.has-top-padded {
padding-top: var(--ts-space-gap) !important;
}
.has-top-padded-small {
padding-top: var(--ts-space-gap-small) !important;
}
.has-top-padded-large {
padding-top: var(--ts-space-gap-large) !important;
}
.has-top-padded-big {
padding-top: var(--ts-space-gap-big) !important;
}
.has-top-padded-huge {
padding-top: var(--ts-space-gap-huge) !important;
}
/** Start */
.has-start-padded {
padding-left: var(--ts-space-gap) !important;
}
.has-start-padded-small {
padding-left: var(--ts-space-gap-small) !important;
}
.has-start-padded-large {
padding-left: var(--ts-space-gap-large) !important;
}
.has-start-padded-big {
padding-left: var(--ts-space-gap-big) !important;
}
.has-start-padded-huge {
padding-left: var(--ts-space-gap-huge) !important;
}
/** End */
.has-end-padded {
padding-right: var(--ts-space-gap) !important;
}
.has-end-padded-small {
padding-right: var(--ts-space-gap-small) !important;
}
.has-end-padded-large {
padding-right: var(--ts-space-gap-large) !important;
}
.has-end-padded-big {
padding-right: var(--ts-space-gap-big) !important;
}
.has-end-padded-huge {
padding-right: var(--ts-space-gap-huge) !important;
}
/**
* Fitted
*/
.has-fitted {
padding: 0 !important;
}
.has-vertically-fitted {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.has-horizontally-fitted {
padding-left: 0 !important;
padding-right: 0 !important;
}
.has-start-fitted {
padding-right: 0 !important;
}
.has-end-fitted {
padding-left: 0 !important;
}
.has-top-fitted {
padding-top: 0 !important;
}
.has-bottom-fitted {
padding-bottom: 0 !important;
}
/**
* Spaced
*/
.has-spaced {
margin: 1rem !important;
}
.has-spaced-small {
margin: var(--ts-space-gap-small) !important;
}
.has-spaced-large {
margin: var(--ts-space-gap-large) !important;
}
.has-spaced-big {
margin: var(--ts-space-gap-big) !important;
}
.has-spaced-huge {
margin: var(--ts-space-gap-huge) !important;
}
/** Horizontally */
.has-horizontally-spaced {
margin-left: var(--ts-space-gap) !important;
margin-right: var(--ts-space-gap) !important;
}
.has-horizontally-spaced-small {
margin-left: var(--ts-space-gap-small) !important;
margin-right: var(--ts-space-gap-small) !important;
}
.has-horizontally-spaced-large {
margin-left: var(--ts-space-gap-large) !important;
margin-right: var(--ts-space-gap-large) !important;
}
.has-horizontally-spaced-big {
margin-left: var(--ts-space-gap-big) !important;
margin-right: var(--ts-space-gap-big) !important;
}
.has-horizontally-spaced-huge {
margin-left: var(--ts-space-gap-huge) !important;
margin-right: var(--ts-space-gap-huge) !important;
}
/** Vertically */
.has-vertically-spaced {
margin-top: var(--ts-space-gap) !important;
margin-bottom: var(--ts-space-gap) !important;
}
.has-vertically-spaced-small {
margin-top: var(--ts-space-gap-small) !important;
margin-bottom: var(--ts-space-gap-small) !important;
}
.has-vertically-spaced-large {
margin-top: var(--ts-space-gap-large) !important;
margin-bottom: var(--ts-space-gap-large) !important;
}
.has-vertically-spaced-big {
margin-top: var(--ts-space-gap-big) !important;
margin-bottom: var(--ts-space-gap-big) !important;
}
.has-vertically-spaced-huge {
margin-top: var(--ts-space-gap-huge) !important;
margin-bottom: var(--ts-space-gap-huge) !important;
}
/** Bottom */
.has-bottom-spaced {
margin-bottom: var(--ts-space-gap) !important;
}
.has-bottom-spaced-small {
margin-bottom: var(--ts-space-gap-small) !important;
}
.has-bottom-spaced-large {
margin-bottom: var(--ts-space-gap-large) !important;
}
.has-bottom-spaced-big {
margin-bottom: var(--ts-space-gap-big) !important;
}
.has-bottom-spaced-huge {
margin-bottom: var(--ts-space-gap-huge) !important;
}
/** Top */
.has-top-spaced {
margin-top: var(--ts-space-gap) !important;
}
.has-top-spaced-small {
margin-top: var(--ts-space-gap-small) !important;
}
.has-top-spaced-large {
margin-top: var(--ts-space-gap-large) !important;
}
.has-top-spaced-big {
margin-top: var(--ts-space-gap-big) !important;
}
.has-top-spaced-huge {
margin-top: var(--ts-space-gap-huge) !important;
}
/** Start */
.has-start-spaced {
margin-left: var(--ts-space-gap) !important;
}
.has-start-spaced-small {
margin-left: var(--ts-space-gap-small) !important;
}
.has-start-spaced-large {
margin-left: var(--ts-space-gap-large) !important;
}
.has-start-spaced-big {
margin-left: var(--ts-space-gap-big) !important;
}
.has-start-spaced-huge {
margin-left: var(--ts-space-gap-huge) !important;
}
/** End */
.has-end-spaced {
margin-right: var(--ts-space-gap) !important;
}
.has-end-spaced-small {
margin-right: var(--ts-space-gap-small) !important;
}
.has-end-spaced-large {
margin-right: var(--ts-space-gap-large) !important;
}
.has-end-spaced-big {
margin-right: var(--ts-space-gap-big) !important;
}
.has-end-spaced-huge {
margin-right: var(--ts-space-gap-huge) !important;
}
/** Auto */
.has-top-spaced-auto {
margin-top: auto !important;
}
.has-bottom-spaced-auto {
margin-bottom: auto !important;
}
.has-start-spaced-auto {
margin-left: auto !important;
}
.has-end-spaced-auto {
margin-right: auto !important;
}
.has-vertically-spaced-auto {
margin-top: auto !important;
margin-bottom: auto !important;
}
.has-horizontally-spaced-auto {
margin-left: auto !important;
margin-right: auto !important;
}
/**
* Hidden
*/
.has-hidden {
display: none !important;
}
.has-invisible {
visibility: hidden !important;
}
/**
* Edged
*/
.has-edged {
border-left: 0 !important;
border-right: 0 !important;
border-radius: 0 !important;
}
/*.has-topleft-borderless {
border: 0 !important;
}
.has-borderless {
border: 0 !important;
}
.has-borderless-x { or horizontal
border-left: 0 !important;
border-right: 0 !important;
}
.has-radiusless {
border-radius: 0 !important;
}*/
/**
* Line Height
*/
.has-leading-small {
line-height: 1.4 !important;
}
.has-leading-none {
line-height: 1 !important;
}
.has-leading-large {
line-height: 1.9 !important;
}
/**
* Flex
*/
.has-flex-center {
display: flex !important;
align-items: center !important;
justify-content: center !important;
flex-direction: column !important;
}
/**
* Font Size
*/
.has-text-14px {
font-size: var(--ts-font-size-14px) !important;
}
.has-text-15px {
font-size: var(--ts-font-size-15px) !important;
}
.has-text-16px {
font-size: var(--ts-font-size-16px) !important;
}
/**
* Text Color
*/
.has-text-white {
color: var(--ts-white) !important;
}
.has-text-black {
color: var(--ts-black) !important;
}
/**
* Cursor
*/
.has-cursor-auto {
cursor: auto !important;
}
.has-cursor-default {
cursor: default !important;
}
.has-cursor-pointer {
cursor: pointer !important;
}
.has-cursor-not-allowed {
cursor: not-allowed !important;
}
/**
* User Select
*/
.has-select-none {
user-select: none !important;
}
.has-select-all {
user-select: all !important;
}
/**
* Pointer Events
*/
.has-pointer-events-none {
pointer-events: none !important;
}
/**
* Hover
*/
.has-hover-fadein {
opacity: 0.7;
}
.has-hover-fadein:hover {
opacity: 1;
}
.has-hover-fadeout {
opacity: 1;
}
.has-hover-fadeout:hover {
opacity: 0.7;
}
.has-hover-target {
text-decoration: none;
color: inherit;
}
.has-hover-target:hover .has-target-link {
color: var(--ts-link-700);
}
.has-hover-target:hover .has-target-underline {
text-decoration: underline;
}
/**
* Link Overlay
*/
.has-stretched-link {
position: relative;
}
.has-stretched-link a[href]:not(.has-link-target),
.has-stretched-link button:not(.has-link-target) {
position: relative;
z-index: 1;
}
.has-stretched-link .has-link-target {
position: static;
text-decoration: none;
}
.has-stretched-link .has-link-target:hover {
text-decoration: none;
}
.has-stretched-link .has-link-target::before {
content: "";
cursor: inherit;
display: block;
position: absolute;
top: 0px;
left: 0px;
z-index: 0;
width: 100%;
height: 100%;
}
/**
* Word Break
*/
.has-break-all {
word-break: break-all !important;
}
.has-break-words {
overflow-wrap: break-word !important;
}
.has-break-keep {
word-break: keep-all !important;
}
/**
* Overflow
*/
.has-overflow-hidden {
overflow: hidden !important;
}
/**
* Sizes
*/
.has-full-size {
width: 100% !important;
height: 100% !important;
}
.has-full-width {
width: 100% !important;
}
.has-full-height {
height: 100% !important;
}
/**
* Accent
*/
.is-accent {
--accent-color: var(--ts-accent-color);
--accent-foreground-color: var(--ts-accent-foreground-color);
}
/* ==========================================================================
Variables
========================================================================== */
.ts-popover {
--ts-popover-position: fixed;
}
/* ==========================================================================
Base
========================================================================== */
.ts-popover {
display: block;
position: fixed;
text-decoration: none;
color: inherit;
border: 1px solid var(--ts-gray-300);
border-radius: var(--ts-border-radius-element);
overflow: hidden;
background: var(--ts-gray-50);
box-shadow: var(--ts-elevated-shadow);
}
/* ==========================================================================
Structure
========================================================================== */
/* ==========================================================================
Variables
========================================================================== */
html {
--ts-white: #fff;
--ts-black: #333;
--ts-accent-color: unset;
--ts-accent-foreground-color: var(--ts-white);
--ts-breakpoint-mobile-min: 0px;
--ts-breakpoint-mobile-max: 767.98px;
--ts-breakpoint-tablet-min: 768px;
--ts-breakpoint-tablet-max: 1023.98px;
--ts-breakpoint-desktop-min: 1024px;
--ts-breakpoint-desktop-max: 1279.98px;
--ts-breakpoint-widescreen-min: 1280px;
--ts-breakpoint-widescreen-max: 9999px;
--ts-light-gray-50: rgb(255, 255, 255);
--ts-light-gray-75: rgb(250, 250, 250);
--ts-light-gray-100: rgb(242, 242, 242);
--ts-light-gray-200: rgb(238, 238, 238);
--ts-light-gray-300: rgb(225, 225, 225);
--ts-light-gray-400: rgb(215, 215, 215);
--ts-light-gray-500: rgb(118, 118, 118);
--ts-light-gray-600: rgb(90, 90, 90);
--ts-light-gray-700: rgb(70, 70, 70);
--ts-light-gray-800: rgb(55, 55, 55);
--ts-light-gray-900: rgb(48, 48, 48);
--ts-dark-gray-50: rgb(39, 39, 39);
--ts-dark-gray-75: rgb(47, 47, 47);
--ts-dark-gray-100: rgb(51, 51, 51);
--ts-dark-gray-200: rgb(56, 56, 56);
--ts-dark-gray-300: rgb(71, 71, 71);
--ts-dark-gray-400: rgb(92, 92, 92);
--ts-dark-gray-500: rgb(189, 189, 189);
--ts-dark-gray-600: rgb(229, 229, 229);
--ts-dark-gray-700: rgb(233, 233, 233);
--ts-dark-gray-800: rgb(238, 238, 238);
--ts-dark-gray-900: rgb(255, 255, 255);
--ts-static-gray-50: var(--ts-light-gray-50);
--ts-static-gray-75: var(--ts-light-gray-75);
--ts-static-gray-100: var(--ts-light-gray-100);
--ts-static-gray-200: var(--ts-light-gray-200);
--ts-static-gray-300: var(--ts-light-gray-300);
--ts-static-gray-400: var(--ts-light-gray-400);
--ts-static-gray-500: var(--ts-light-gray-500);
--ts-static-gray-600: var(--ts-light-gray-600);
--ts-static-gray-700: var(--ts-light-gray-700);
--ts-static-gray-800: var(--ts-light-gray-800);
--ts-static-gray-900: var(--ts-light-gray-900);
--ts-static-primary-400: #40a9ff;
--ts-static-primary-500: #1890ff;
--ts-static-primary-600: #096dd9;
--ts-static-primary-700: #0050b3;
--ts-static-primary-800: #003a8c;
--ts-static-primary-900: #002766;
--ts-static-warning-400: #ffec3d;
--ts-static-warning-500: #fadb14;
--ts-static-warning-600: #d4b106;
--ts-static-warning-700: #ad8b00;
--ts-static-warning-800: #876800;
--ts-static-warning-900: #614700;
--ts-static-positive-400: #73d13d;
--ts-static-positive-500: #52c41a;
--ts-static-positive-600: #389e0d;
--ts-static-positive-700: #237804;
--ts-static-positive-800: #135200;
--ts-static-positive-900: #092b00;
--ts-static-negative-400: #ff4d4f;
--ts-static-negative-500: #f5222d;
--ts-static-negative-600: #cf1322;
--ts-static-negative-700: #a8071a;
--ts-static-negative-800: #820014;
--ts-static-negative-900: #5c0011;
--ts-primary-400: #40a9ff;
--ts-primary-500: #1890ff;
--ts-primary-600: #096dd9;
--ts-primary-700: #0050b3;
--ts-primary-800: #003a8c;
--ts-primary-900: #002766;
--ts-link-700: #0050b3;
--ts-warning-400: #ffec3d;
--ts-warning-500: #fadb14;
--ts-warning-600: #d4b106;
--ts-warning-700: #ad8b00;
--ts-warning-800: #876800;
--ts-warning-900: #614700;
--ts-positive-400: #73d13d;
--ts-positive-500: #52c41a;
--ts-positive-600: #389e0d;
--ts-positive-700: #237804;
--ts-positive-800: #135200;
--ts-positive-900: #092b00;
--ts-negative-400: #ff4d4f;
--ts-negative-500: #f5222d;
--ts-negative-600: #cf1322;
--ts-negative-700: #a8071a;
--ts-negative-800: #820014;
--ts-negative-900: #5c0011;
--ts-z-app-drawer: 102;
--ts-z-dropdown: 103;
--ts-z-mask: 101;
--ts-z-modal: 102;
--ts-z-tooltip: 104;
--ts-border-radius-container: 0.4rem;
--ts-border-radius-element: 0.4rem;
--ts-border-radius-secondary: 0.3rem;
--ts-page-background-default: var(--ts-gray-50);
--ts-page-background-secondary: var(--ts-gray-75);
--ts-page-background-tertiary: var(--ts-gray-100);
--ts-elevated-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
--ts-elevated-shadow-modal: 0 0 20px rgba(0, 0, 0, 0.1);
--ts-elevated-shadow-drawer: 0 0 20px rgba(0, 0, 0, 0.1);
}
/**
* Sizes
*/
html {
--ts-input-height-large: 42px;
--ts-input-height-large-dense: 37px;
--ts-input-height-medium: 37px;
--ts-input-height-medium-dense: 32px;
--ts-input-height-small: 32px;
--ts-input-height-small-dense: 32px;
--ts-font-size-mini: calc(12 / 15 * 1rem);
--ts-font-size-tiny: calc(13 / 15 * 1rem);
--ts-font-size-small: calc(14 / 15 * 1rem);
--ts-font-size-medium: calc(15 / 15 * 1rem);
--ts-font-size-large: calc(18 / 15 * 1rem);
--ts-font-size-big: calc(20 / 15 * 1rem);
--ts-font-size-huge: calc(24 / 15 * 1rem);
--ts-font-size-massive: calc(30 / 15 * 1rem);
--ts-font-size-12px: calc(12 / 15 * 1rem);
--ts-font-size-13px: calc(13 / 15 * 1rem);
--ts-font-size-14px: calc(14 / 15 * 1rem);
--ts-font-size-15px: calc(15 / 15 * 1rem);
--ts-font-size-16px: calc(16 / 15 * 1rem);
--ts-font-size-17px: calc(17 / 15 * 1rem);
--ts-font-size-18px: calc(18 / 15 * 1rem);
--ts-font-size-20px: calc(20 / 15 * 1rem);
--ts-font-size-24px: calc(24 / 15 * 1rem);
--ts-font-size-25px: calc(25 / 15 * 1rem);
--ts-font-size-30px: calc(30 / 15 * 1rem);
--ts-font-size-33px: calc(33 / 15 * 1rem);
--ts-font-size-38px: calc(38 / 15 * 1rem);
--ts-font-size-45px: calc(45 / 15 * 1rem);
--ts-font-size-55px: calc(55 / 15 * 1rem);
--ts-font-size-65px: calc(65 / 15 * 1rem);
--ts-font-size-75px: calc(75 / 15 * 1rem);
--ts-absolute-mini: calc(12 / 15 * 1rem);
--ts-absolute-tiny: calc(13 / 15 * 1rem);
--ts-absolute-small: calc(14 / 15 * 1rem);
--ts-absolute-medium: calc(15 / 15 * 1rem);
--ts-absolute-large: calc(18 / 15 * 1rem);
--ts-absolute-big: calc(20 / 15 * 1rem);
--ts-absolute-huge: calc(24 / 15 * 1rem);
--ts-absolute-massive: calc(30 / 15 * 1rem);
--ts-relative-mini: calc(12 / 15 * 1em);
--ts-relative-tiny: calc(13 / 15 * 1em);
--ts-relative-small: calc(14 / 15 * 1em);
--ts-relative-medium: calc(15 / 15 * 1em);
--ts-relative-large: calc(18 / 15 * 1em);
--ts-relative-big: calc(20 / 15 * 1em);
--ts-relative-huge: calc(24 / 15 * 1em);
--ts-relative-massive: calc(30 / 15 * 1em);
--ts-space-gap: 1rem;
--ts-space-gap-small: 0.5rem;
--ts-space-gap-large: 1.5rem;
--ts-space-gap-big: 3rem;
--ts-space-gap-huge: 4.5rem;
}
/* ==========================================================================
Color Schemes
========================================================================== */
/**
* Light
*/
html,
html.is-light,
.has-light,
html.is-dark .has-inverted {
color-scheme: light;
--ts-gray-50: var(--ts-light-gray-50);
--ts-gray-75: var(--ts-light-gray-75);
--ts-gray-100: var(--ts-light-gray-100);
--ts-gray-200: var(--ts-light-gray-200);
--ts-gray-300: var(--ts-light-gray-300);
--ts-gray-400: var(--ts-light-gray-400);
--ts-gray-500: var(--ts-light-gray-500);
--ts-gray-600: var(--ts-light-gray-600);
--ts-gray-700: var(--ts-light-gray-700);
--ts-gray-800: var(--ts-light-gray-800);
--ts-gray-900: var(--ts-light-gray-900);
--ts-tonal-positive-400: #cdffbe;
--ts-tonal-positive-800: #357016;
--ts-tonal-negative-400: #ffbebe;
--ts-tonal-negative-800: #701616;
--ts-tonal-primary-400: #d9edff;
--ts-tonal-primary-800: #005cde;
--ts-tonal-warning-400: #fff7ae;
--ts-tonal-warning-800: #866800;
--ts-page-background-default: var(--ts-gray-50);
--ts-page-background-secondary: var(--ts-gray-75);
--ts-page-background-tertiary: var(--ts-gray-100);
--ts-elevated-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
--ts-elevated-shadow-modal: 0 0 20px rgba(0, 0, 0, 0.1);
--ts-elevated-shadow-drawer: 0 0 20px rgba(0, 0, 0, 0.1);
}
html.is-light .has-inverted,
.has-inverted,
html.is-dark,
.has-dark {
color-scheme: dark;
--ts-gray-50: var(--ts-dark-gray-50);
--ts-gray-75: var(--ts-dark-gray-75);
--ts-gray-100: var(--ts-dark-gray-100);
--ts-gray-200: var(--ts-dark-gray-200);
--ts-gray-300: var(--ts-dark-gray-300);
--ts-gray-400: var(--ts-dark-gray-400);
--ts-gray-500: var(--ts-dark-gray-500);
--ts-gray-600: var(--ts-dark-gray-600);
--ts-gray-700: var(--ts-dark-gray-700);
--ts-gray-800: var(--ts-dark-gray-800);
--ts-gray-900: var(--ts-dark-gray-900);
--ts-link-700: #a6a6f6;
--ts-tonal-positive-400: #92d34f;
--ts-tonal-positive-800: #0e4600;
--ts-tonal-negative-400: #d60000;
--ts-tonal-negative-800: #fff;
--ts-tonal-primary-400: #0a6ffd;
--ts-tonal-primary-800: #ffffff;
--ts-tonal-warning-400: #edff00;
--ts-tonal-warning-800: #463f00;
--ts-page-background-default: var(--ts-dark-gray-50);
--ts-page-background-secondary: rgb(30, 30, 30);
--ts-page-background-tertiary: rgb(23, 23, 23);
--ts-elevated-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.25);
--ts-elevated-shadow-modal: 0 0 20px rgba(0, 0, 0, 0.5);
--ts-elevated-shadow-drawer: 0 0 20px rgba(0, 0, 0, 0.2);
}
/**
* Hidden
*/
html.is-light .has-light-hidden,
html.is-dark .has-dark-hidden {
display: none !important;
}
@media (prefers-color-scheme: light) {
html:not(.is-dark) .has-light-hidden {
display: none !important;
}
}
@media (prefers-color-scheme: dark) {
html:not(.is-light) .has-dark-hidden {
display: none !important;
}
}
/**
* Dark
*/
@media (prefers-color-scheme: dark) {
html:not(.is-light) {
color-scheme: dark;
--ts-gray-50: var(--ts-dark-gray-50);
--ts-gray-75: var(--ts-dark-gray-75);
--ts-gray-100: var(--ts-dark-gray-100);
--ts-gray-200: var(--ts-dark-gray-200);
--ts-gray-300: var(--ts-dark-gray-300);
--ts-gray-400: var(--ts-dark-gray-400);
--ts-gray-500: var(--ts-dark-gray-500);
--ts-gray-600: var(--ts-dark-gray-600);
--ts-gray-700: var(--ts-dark-gray-700);
--ts-gray-800: var(--ts-dark-gray-800);
--ts-gray-900: var(--ts-dark-gray-900);
--ts-primary-400: #40a9ff;
--ts-primary-500: #2492f7;
--ts-primary-600: #2282e9;
--ts-primary-700: #0e52a5;
--ts-primary-800: #003a8c;
--ts-primary-900: #002766;
--ts-link-700: #afafff;
--ts-tonal-positive-400: #92d34f;
--ts-tonal-positive-800: #0e4600;
--ts-tonal-negative-400: #d60000;
--ts-tonal-negative-800: #fff;
--ts-tonal-primary-400: #0a6ffd;
--ts-tonal-primary-800: #ffffff;
--ts-tonal-warning-400: #edff00;
--ts-tonal-warning-800: #463f00;
--ts-page-background-default: var(--ts-dark-gray-50);
--ts-page-background-secondary: rgb(30, 30, 30);
--ts-page-background-tertiary: rgb(23, 23, 23);
--ts-elevated-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.25);
--ts-elevated-shadow-modal: 0 0 20px rgba(0, 0, 0, 0.5);
--ts-elevated-shadow-drawer: 0 0 20px rgba(0, 0, 0, 0.2);
}
html:not(.is-light) .has-inverted {
color-scheme: light;
--ts-gray-50: var(--ts-light-gray-50);
--ts-gray-75: var(--ts-light-gray-75);
--ts-gray-100: var(--ts-light-gray-100);
--ts-gray-200: var(--ts-light-gray-200);
--ts-gray-300: var(--ts-light-gray-300);
--ts-gray-400: var(--ts-light-gray-400);
--ts-gray-500: var(--ts-light-gray-500);
--ts-gray-600: var(--ts-light-gray-600);
--ts-gray-700: var(--ts-light-gray-700);
--ts-gray-800: var(--ts-light-gray-800);
--ts-gray-900: var(--ts-light-gray-900);
--ts-tonal-positive-400: #cdffbe;
--ts-tonal-positive-800: #357016;
--ts-tonal-negative-400: #ffbebe;
--ts-tonal-negative-800: #701616;
--ts-tonal-primary-400: #d9edff;
--ts-tonal-primary-800: #005cde;
--ts-tonal-warning-400: #fff7ae;
--ts-tonal-warning-800: #866800;
--ts-page-background-default: var(--ts-gray-50);
--ts-page-background-secondary: var(--ts-gray-75);
--ts-page-background-tertiary: var(--ts-gray-100);
--ts-elevated-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
--ts-elevated-shadow-modal: 0 0 20px rgba(0, 0, 0, 0.1);
--ts-elevated-shadow-drawer: 0 0 20px rgba(0, 0, 0, 0.1);
}
}
/* ==========================================================================
Scales
========================================================================== */
html.is-small,
html.is-small body {
font-size: 14px;
}
html.is-medium,
html.is-medium body {
font-size: 15px;
}
html.is-large,
html.is-large body {
font-size: 16px;
}
/* ==========================================================================
Radius
========================================================================== */
html.is-circular {
--ts-border-radius-container: 1rem;
--ts-border-radius-element: 0.7rem;
--ts-border-radius-secondary: 0.4rem;
}
/* ==========================================================================
Background Color
========================================================================== */
html.is-secondary,
html.is-secondary body {
background-color: var(--ts-page-background-secondary);
}
/* ==========================================================================
Rounded
========================================================================== */
html.is-rounded {
}