tdesign-mobile-vue
Version:
tdesign-mobile-vue
30,484 lines • 780 kB
CSS
.t-safe-area-top {
padding-top: constant(safe-area-inset-top);
padding-top: env(safe-area-inset-top);
}
.t-safe-area-bottom {
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
:root,
:root[theme-mode='light'] {
--td-brand-color-1: #f2f3ff;
--td-brand-color-2: #d9e1ff;
--td-brand-color-3: #b5c7ff;
--td-brand-color-4: #8eabff;
--td-brand-color-5: #618dff;
--td-brand-color-6: #366ef4;
--td-brand-color-7: #0052d9;
--td-brand-color-8: #003cab;
--td-brand-color-9: #002a7c;
--td-brand-color-10: #001a57;
--td-warning-color-1: #fff1e9;
--td-warning-color-2: #ffd9c2;
--td-warning-color-3: #ffb98c;
--td-warning-color-4: #fa9550;
--td-warning-color-5: #e37318;
--td-warning-color-6: #be5a00;
--td-warning-color-7: #954500;
--td-warning-color-8: #713300;
--td-warning-color-9: #532300;
--td-warning-color-10: #3b1700;
--td-error-color-1: #fff0ed;
--td-error-color-2: #ffd8d2;
--td-error-color-3: #ffb9b0;
--td-error-color-4: #ff9285;
--td-error-color-5: #f6685d;
--td-error-color-6: #d54941;
--td-error-color-7: #ad352f;
--td-error-color-8: #881f1c;
--td-error-color-9: #68070a;
--td-error-color-10: #490002;
--td-success-color-1: #e3f9e9;
--td-success-color-2: #c6f3d7;
--td-success-color-3: #92dab2;
--td-success-color-4: #56c08d;
--td-success-color-5: #2ba471;
--td-success-color-6: #008858;
--td-success-color-7: #006c45;
--td-success-color-8: #005334;
--td-success-color-9: #003b23;
--td-success-color-10: #002515;
--td-gray-color-1: #f3f3f3;
--td-gray-color-2: #eee;
--td-gray-color-3: #e7e7e7;
--td-gray-color-4: #dcdcdc;
--td-gray-color-5: #c5c5c5;
--td-gray-color-6: #a6a6a6;
--td-gray-color-7: #8b8b8b;
--td-gray-color-8: #777;
--td-gray-color-9: #5e5e5e;
--td-gray-color-10: #4b4b4b;
--td-gray-color-11: #383838;
--td-gray-color-12: #2c2c2c;
--td-gray-color-13: #242424;
--td-gray-color-14: #181818;
--td-font-white-1: #ffffff;
--td-font-white-2: rgba(255, 255, 255, 0.55);
--td-font-white-3: rgba(255, 255, 255, 0.35);
--td-font-white-4: rgba(255, 255, 255, 0.22);
--td-font-gray-1: rgba(0, 0, 0, 0.9);
--td-font-gray-2: rgba(0, 0, 0, 0.6);
--td-font-gray-3: rgba(0, 0, 0, 0.4);
--td-font-gray-4: rgba(0, 0, 0, 0.26);
--td-brand-color: var(--td-brand-color-7);
--td-warning-color: var(--td-warning-color-5);
--td-error-color: var(--td-error-color-6);
--td-success-color: var(--td-success-color-5);
--td-brand-color-focus: var(--td-brand-color-1);
--td-brand-color-active: var(--td-brand-color-8);
--td-brand-color-disabled: var(--td-brand-color-3);
--td-brand-color-light: var(--td-brand-color-1);
--td-brand-color-light-active: var(--td-brand-color-2);
--td-warning-color-active: var(--td-warning-color-6);
--td-warning-color-disabled: var(--td-warning-color-3);
--td-warning-color-focus: var(--td-warning-color-2);
--td-warning-color-light: var(--td-warning-color-1);
--td-warning-color-light-active: var(--td-warning-color-2);
--td-error-color-focus: var(--td-error-color-2);
--td-error-color-active: var(--td-error-color-7);
--td-error-color-disabled: var(--td-error-color-3);
--td-error-color-light: var(--td-error-color-1);
--td-error-color-light-active: var(--td-error-color-2);
--td-success-color-focus: var(--td-success-color-2);
--td-success-color-active: var(--td-success-color-6);
--td-success-color-disabled: var(--td-success-color-3);
--td-success-color-light: var(--td-success-color-1);
--td-success-color-light-active: var(--td-success-color-2);
--td-mask-active: rgba(0, 0, 0, 0.6);
--td-mask-disabled: rgba(255, 255, 255, 0.6);
--td-mask-background: rgba(255, 255, 255, 0.96);
--td-bg-color-page: var(--td-gray-color-1);
--td-bg-color-container: var(--td-font-white-1);
--td-bg-color-container-active: var(--td-gray-color-3);
--td-bg-color-secondarycontainer: var(--td-gray-color-1);
--td-bg-color-secondarycontainer-active: var(--td-gray-color-4);
--td-bg-color-component: var(--td-gray-color-3);
--td-bg-color-component-active: var(--td-gray-color-6);
--td-bg-color-component-disabled: var(--td-gray-color-2);
--td-bg-color-secondarycomponent: var(--td-gray-color-4);
--td-bg-color-secondarycomponent-active: var(--td-gray-color-6);
--td-bg-color-specialcomponent: #fff;
--td-text-color-primary: var(--td-font-gray-1);
--td-text-color-secondary: var(--td-font-gray-2);
--td-text-color-placeholder: var(--td-font-gray-3);
--td-text-color-disabled: var(--td-font-gray-4);
--td-text-color-anti: var(--td-font-white-1);
--td-text-color-brand: var(--td-brand-color);
--td-text-color-link: var(--td-brand-color);
--td-text-color-watermark: rgba(0, 0, 0, 0.1);
--td-border-level-1-color: var(--td-gray-color-3);
--td-component-stroke: var(--td-gray-color-3);
--td-border-level-2-color: var(--td-gray-color-4);
--td-component-border: var(--td-gray-color-4);
--td-shadow-1: 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.12);
--td-shadow-2: 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 8px 10px 1px rgba(0, 0, 0, 0.06), 0 5px 5px -3px rgba(0, 0, 0, 0.1);
--td-shadow-3: 0 6px 30px 5px rgba(0, 0, 0, 0.05), 0 16px 24px 2px rgba(0, 0, 0, 0.04), 0 8px 10px -5px rgba(0, 0, 0, 0.08);
--td-shadow-4: 0 2px 8px 0 rgba(0, 0, 0, 0.06);
--td-shadow-inset-top: inset 0 0.5px 0 #dcdcdc;
--td-shadow-inset-right: inset 0.5px 0 0 #dcdcdc;
--td-shadow-inset-bottom: inset 0 -0.5px 0 #dcdcdc;
--td-shadow-inset-left: inset -0.5px 0 0 #dcdcdc;
--td-table-shadow-color: rgba(0, 0, 0, 0.08);
--td-scrollbar-color: rgba(0, 0, 0, 0.1);
--td-scrollbar-hover-color: rgba(0, 0, 0, 0.3);
--td-scroll-track-color: #fff;
}
:root.dark,
:root[theme-mode='dark'] {
--td-brand-color-1: #1b2f51;
--td-brand-color-2: #173463;
--td-brand-color-3: #143975;
--td-brand-color-4: #103d88;
--td-brand-color-5: #0d429a;
--td-brand-color-6: #054bbe;
--td-brand-color-7: #2667d4;
--td-brand-color-8: #4582e6;
--td-brand-color-9: #699ef5;
--td-brand-color-10: #96bbf8;
--td-warning-color-1: #4f2a1d;
--td-warning-color-2: #582f21;
--td-warning-color-3: #733c23;
--td-warning-color-4: #a75d2b;
--td-warning-color-5: #cf6e2d;
--td-warning-color-6: #dc7633;
--td-warning-color-7: #e8935c;
--td-warning-color-8: #ecbf91;
--td-warning-color-9: #eed7bf;
--td-warning-color-10: #f3e9dc;
--td-error-color-1: #472324;
--td-error-color-2: #5e2a2d;
--td-error-color-3: #703439;
--td-error-color-4: #83383e;
--td-error-color-5: #a03f46;
--td-error-color-6: #c64751;
--td-error-color-7: #de6670;
--td-error-color-8: #ec888e;
--td-error-color-9: #edb1b6;
--td-error-color-10: #eeced0;
--td-success-color-1: #193a2a;
--td-success-color-2: #1a4230;
--td-success-color-3: #17533d;
--td-success-color-4: #0d7a55;
--td-success-color-5: #059465;
--td-success-color-6: #43af8a;
--td-success-color-7: #46bf96;
--td-success-color-8: #80d2b6;
--td-success-color-9: #b4e1d3;
--td-success-color-10: #deede8;
--td-gray-color-1: #f3f3f3;
--td-gray-color-2: #eee;
--td-gray-color-3: #e8e8e8;
--td-gray-color-4: #ddd;
--td-gray-color-5: #c6c6c6;
--td-gray-color-6: #a6a6a6;
--td-gray-color-7: #8b8b8b;
--td-gray-color-8: #777;
--td-gray-color-9: #5e5e5e;
--td-gray-color-10: #4b4b4b;
--td-gray-color-11: #383838;
--td-gray-color-12: #2c2c2c;
--td-gray-color-13: #242424;
--td-gray-color-14: #181818;
--td-font-white-1: rgba(255, 255, 255, 0.9);
--td-font-white-2: rgba(255, 255, 255, 0.55);
--td-font-white-3: rgba(255, 255, 255, 0.35);
--td-font-white-4: rgba(255, 255, 255, 0.22);
--td-font-gray-1: rgba(0, 0, 0, 0.9);
--td-font-gray-2: rgba(0, 0, 0, 0.6);
--td-font-gray-3: rgba(0, 0, 0, 0.4);
--td-font-gray-4: rgba(0, 0, 0, 0.26);
--td-brand-color: var(--td-brand-color-8);
--td-warning-color: var(--td-warning-color-5);
--td-error-color: var(--td-error-color-6);
--td-success-color: var(--td-success-color-5);
--td-brand-color-focus: var(--td-brand-color-1);
--td-brand-color-active: var(--td-brand-color-9);
--td-brand-color-disabled: var(--td-brand-color-3);
--td-brand-color-light: var(--td-brand-color-1);
--td-brand-color-light-active: var(--td-brand-color-2);
--td-warning-color-focus: var(--td-warning-color-2);
--td-warning-color-active: var(--td-warning-color-4);
--td-warning-color-disabled: var(--td-warning-color-3);
--td-warning-color-light: var(--td-warning-color-1);
--td-warning-color-light-active: var(--td-warning-color-2);
--td-error-color-focus: var(--td-error-color-2);
--td-error-color-active: var(--td-error-color-5);
--td-error-color-disabled: var(--td-error-color-3);
--td-error-color-light: var(--td-error-color-1);
--td-error-color-light-active: var(--td-error-color-2);
--td-success-color-focus: var(--td-success-color-2);
--td-success-color-active: var(--td-success-color-4);
--td-success-color-disabled: var(--td-success-color-3);
--td-success-color-light: var(--td-success-color-1);
--td-success-color-light-active: var(--td-success-color-2);
--td-mask-active: rgba(0, 0, 0, 0.4);
--td-mask-disabled: rgba(0, 0, 0, 0.6);
--td-mask-background: rgba(36, 36, 36, 0.96);
--td-bg-color-page: var(--td-gray-color-14);
--td-bg-color-container: var(--td-gray-color-13);
--td-bg-color-secondarycontainer: var(--td-gray-color-12);
--td-bg-color-component: var(--td-gray-color-11);
--td-bg-color-container-active: var(--td-gray-color-12);
--td-bg-color-secondarycontainer-active: var(--td-gray-color-11);
--td-bg-color-component-active: var(--td-gray-color-10);
--td-bg-color-component-disabled: var(--td-gray-color-12);
--td-bg-color-specialcomponent: transparent;
--td-text-color-primary: var(--td-font-white-1);
--td-text-color-secondary: var(--td-font-white-2);
--td-text-color-placeholder: var(--td-font-white-3);
--td-text-color-disabled: var(--td-font-white-4);
--td-text-color-anti: var(--td-font-white-1);
--td-text-color-brand: var(--td-brand-color-8);
--td-text-color-link: var(--td-brand-color-8);
--td-text-color-watermark: rgba(255, 255, 255, 0.1);
--td-border-level-1-color: var(--td-gray-color-11);
--td-component-stroke: var(--td-gray-color-11);
--td-border-level-2-color: var(--td-gray-color-9);
--td-component-border: var(--td-gray-color-9);
--td-shadow-1: 0 4px 6px rgba(0, 0, 0, 0.06), 0 1px 10px rgba(0, 0, 0, 0.08), 0 2px 4px rgba(0, 0, 0, 0.12);
--td-shadow-2: 0 8px 10px rgba(0, 0, 0, 0.12), 0 3px 14px rgba(0, 0, 0, 0.1), 0 5px 5px rgba(0, 0, 0, 0.16);
--td-shadow-3: 0 16px 24px rgba(0, 0, 0, 0.14), 0 6px 30px rgba(0, 0, 0, 0.12), 0 8px 10px rgba(0, 0, 0, 0.2);
--td-shadow-inset-top: inset 0 0.5px 0 #5e5e5e;
--td-shadow-inset-right: inset 0.5px 0 0 #5e5e5e;
--td-shadow-inset-bottom: inset 0 -0.5px 0 #5e5e5e;
--td-shadow-inset-left: inset -0.5px 0 0 #5e5e5e;
--td-table-shadow-color: rgba(0, 0, 0, 0.55);
--td-scrollbar-color: rgba(255, 255, 255, 0.1);
--td-scroll-track-color: #333;
}
:root {
--td-radius-small: 3px;
--td-radius-default: 6px;
--td-radius-large: 9px;
--td-radius-extraLarge: 12px;
--td-radius-round: 999px;
--td-radius-circle: 50%;
}
:root {
--td-font-family: PingFang SC, Microsoft YaHei, Arial Regular;
--td-font-family-medium: PingFang SC, Microsoft YaHei, Arial Medium;
--td-font-size-link-small: 12px;
--td-font-size-link-medium: 14px;
--td-font-size-link-large: 16px;
--td-font-size-mark-extraSmall: 10px;
--td-font-size-mark-small: 12px;
--td-font-size-mark-medium: 14px;
--td-font-size-mark-large: 16px;
--td-font-size-body-extraSmall: 10px;
--td-font-size-body-small: 12px;
--td-font-size-body-medium: 14px;
--td-font-size-body-large: 16px;
--td-font-size-title-small: 14px;
--td-font-size-title-medium: 16px;
--td-font-size-title-large: 18px;
--td-font-size-title-extraLarge: 20px;
--td-font-size-headline-small: 24px;
--td-font-size-headline-medium: 28px;
--td-font-size-headline-large: 36px;
--td-font-size-display-medium: 48px;
--td-font-size-display-large: 64px;
--td-line-height-link-small: 20px;
--td-line-height-link-medium: 22px;
--td-line-height-link-large: 24px;
--td-line-height-mark-extraSmall: 16px;
--td-line-height-mark-small: 20px;
--td-line-height-mark-medium: 22px;
--td-line-height-mark-large: 24px;
--td-line-height-body-extraSmall: 16px;
--td-line-height-body-small: 20px;
--td-line-height-body-medium: 22px;
--td-line-height-body-large: 24px;
--td-line-height-title-small: 22px;
--td-line-height-title-medium: 24px;
--td-line-height-title-large: 26px;
--td-line-height-title-extraLarge: 28px;
--td-line-height-headline-small: 32px;
--td-line-height-headline-medium: 36px;
--td-line-height-headline-large: 44px;
--td-line-height-display-medium: 56px;
--td-line-height-display-large: 72px;
--td-font-link-small: var(--td-font-size-link-small) / var(--td-line-height-link-small) var(--td-font-family);
--td-font-link-medium: var(--td-font-size-link-medium) / var(--td-line-height-link-medium) var(--td-font-family);
--td-font-link-large: var(--td-font-size-link-large) / var(--td-line-height-link-large) var(--td-font-family);
--td-font-mark-extraSmall: 600 var(--td-font-size-mark-extraSmall) / var(--td-line-height-mark-extraSmall) var(--td-font-family);
--td-font-mark-small: 600 var(--td-font-size-mark-small) / var(--td-line-height-mark-small) var(--td-font-family);
--td-font-mark-medium: 600 var(--td-font-size-mark-medium) / var(--td-line-height-mark-medium) var(--td-font-family);
--td-font-mark-large: 600 var(--td-font-size-mark-large) / var(--td-line-height-mark-large) var(--td-font-family);
--td-font-body-extraSmall: var(--td-font-size-body-extraSmall) / var(--td-line-height-body-extraSmall) var(--td-font-family);
--td-font-body-small: var(--td-font-size-body-small) / var(--td-line-height-body-small) var(--td-font-family);
--td-font-body-medium: var(--td-font-size-body-medium) / var(--td-line-height-body-medium) var(--td-font-family);
--td-font-body-large: var(--td-font-size-body-large) / var(--td-line-height-body-large) var(--td-font-family);
--td-font-title-small: 600 var(--td-font-size-title-small) / var(--td-line-height-title-small) var(--td-font-family);
--td-font-title-medium: 600 var(--td-font-size-title-medium) / var(--td-line-height-title-medium) var(--td-font-family);
--td-font-title-large: 600 var(--td-font-size-title-large) / var(--td-line-height-title-large) var(--td-font-family);
--td-font-title-extraLarge: 600 var(--td-font-size-title-extraLarge) / var(--td-line-height-title-extraLarge) var(--td-font-family);
--td-font-headline-small: 600 var(--td-font-size-headline-small) / var(--td-line-height-headline-small) var(--td-font-family);
--td-font-headline-medium: 600 var(--td-font-size-headline-medium) / var(--td-line-height-headline-medium) var(--td-font-family);
--td-font-headline-large: 600 var(--td-font-size-headline-large) / var(--td-line-height-headline-large) var(--td-font-family);
--td-font-display-medium: 600 var(--td-font-size-display-medium) / var(--td-line-height-display-medium) var(--td-font-family);
--td-font-display-large: 600 var(--td-font-size-display-large) / var(--td-line-height-display-large) var(--td-font-family);
--td-font-size: 10px;
--td-font-size-xs: var(--td-font-size-body-extraSmall);
--td-font-size-s: var(--td-font-size-body-small);
--td-font-size-base: var(--td-font-size-title-small);
--td-font-size-m: var(--td-font-size-title-medium);
--td-font-size-l: var(--td-font-size-title-large);
--td-font-size-xl: var(--td-font-size-title-extraLarge);
--td-font-size-xxl: var(--td-font-size-headline-large);
}
:root {
--td-spacer: 8px;
--td-spacer-1: 12px;
--td-spacer-2: 16px;
--td-spacer-3: 24px;
--td-spacer-4: 32px;
--td-spacer-5: 48px;
--td-spacer-6: 80px;
}
:root,
:root[theme-mode='light'] {
--td-switch-dot-disabled-color: var(--td-font-white-1);
--td-switch-loading-color: var(--td-brand-color);
}
:root.dark,
:root[theme-mode='dark'] {
--td-button-primary-disabled-color: var(--td-font-white-4);
--td-skeleton-animation-gradient: rgba(255, 255, 255, 0.06);
--td-slider-dot-bg-color: var(--td-gray-color-4);
--td-slider-dot-disabled-bg-color: var(--td-gray-color-11);
--td-slider-dot-disabled-border-color: var(--td-gray-color-12);
--td-switch-dot-disabled-color: var(--td-font-white-2);
--td-switch-loading-color: var(--td-font-white-1);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-loading {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: relative;
color: var(--td-loading-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-loading--inherit-color {
color: inherit;
}
.t-loading--vertical {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.t-loading--vertical .t-loading__text {
margin-left: 0;
margin-top: 6px;
}
.t-loading__bar {
pointer-events: none;
}
.t-loading__text {
color: var(--td-loading-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
font: var(--td-loading-text-font, var(--td-font-body-small));
margin-left: 6px;
}
.t-loading__text--only {
margin-left: 0;
}
.t-loading__gradient {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
vertical-align: middle;
}
.t-loading__gradient-conic {
width: 100%;
height: 100%;
background: conic-gradient(from 90deg at 50% 50%, #fff 0deg, currentColor 360deg);
border-radius: 50%;
/* stylelint-disable-next-line */
mask: radial-gradient(transparent calc(50% - 0.5px), #fff 50%);
/* stylelint-disable-next-line */
-webkit-mask: radial-gradient(transparent calc(50% - 0.5px), #fff 50%);
}
.t-loading__spinner {
position: relative;
display: inline-block;
width: 20px;
max-width: 100%;
height: 20px;
max-height: 100%;
vertical-align: middle;
-webkit-animation: t-rotate 0.8s linear infinite;
animation: t-rotate 0.8s linear infinite;
-webkit-animation-timing-function: steps(12);
animation-timing-function: steps(12);
}
.t-loading__spinner--line {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.t-loading__spinner--line::before {
display: block;
width: 2px;
height: 25%;
margin: 0 auto;
background-color: var(--td-loading-line-bg-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
border-radius: 40%;
content: ' ';
}
.t-loading__dot {
width: 20%;
height: 20%;
border-radius: 50%;
background-color: currentColor;
-webkit-animation-duration: 1.8s;
animation-duration: 1.8s;
-webkit-animation-name: dotting;
animation-name: dotting;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.t-loading__dot--paused {
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.t-loading__dots {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-animation: none;
animation: none;
}
.t-loading__parent,
.t-loading__parent--relative {
position: relative;
}
.t-loading--lock {
overflow: hidden;
}
.t-loading--full {
z-index: var(--td-loading-z-index, 3500);
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
vertical-align: middle;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
background-color: var(--td-loading-full-bg-color, rgba(255, 255, 255, 0.6));
}
.t-loading--fullscreen {
position: fixed;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
vertical-align: middle;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: var(--td-loading-z-index, 3500);
background-color: var(--td-loading-full-bg-color, rgba(255, 255, 255, 0.6));
}
.t-loading--center {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
vertical-align: middle;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-loading__spinner--line-1 {
-webkit-transform: rotate(30deg);
transform: rotate(30deg);
opacity: 1;
}
.t-loading__spinner--line-2 {
-webkit-transform: rotate(60deg);
transform: rotate(60deg);
opacity: 0.9375;
}
.t-loading__spinner--line-3 {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0.875;
}
.t-loading__spinner--line-4 {
-webkit-transform: rotate(120deg);
transform: rotate(120deg);
opacity: 0.8125;
}
.t-loading__spinner--line-5 {
-webkit-transform: rotate(150deg);
transform: rotate(150deg);
opacity: 0.75;
}
.t-loading__spinner--line-6 {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
opacity: 0.6875;
}
.t-loading__spinner--line-7 {
-webkit-transform: rotate(210deg);
transform: rotate(210deg);
opacity: 0.625;
}
.t-loading__spinner--line-8 {
-webkit-transform: rotate(240deg);
transform: rotate(240deg);
opacity: 0.5625;
}
.t-loading__spinner--line-9 {
-webkit-transform: rotate(270deg);
transform: rotate(270deg);
opacity: 0.5;
}
.t-loading__spinner--line-10 {
-webkit-transform: rotate(300deg);
transform: rotate(300deg);
opacity: 0.4375;
}
.t-loading__spinner--line-11 {
-webkit-transform: rotate(330deg);
transform: rotate(330deg);
opacity: 0.375;
}
.t-loading__spinner--line-12 {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
opacity: 0.3125;
}
@-webkit-keyframes t-rotate {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-rotate {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes dotting {
0% {
opacity: 0.15;
}
1% {
opacity: 0.8;
}
33% {
opacity: 0.8;
}
34% {
opacity: 0.15;
}
100% {
opacity: 0.15;
}
}
@keyframes dotting {
0% {
opacity: 0.15;
}
1% {
opacity: 0.8;
}
33% {
opacity: 0.8;
}
34% {
opacity: 0.15;
}
100% {
opacity: 0.15;
}
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-button--size-extra-small {
font-size: var(--td-button-extra-small-font-size, var(--td-font-size-base, 14px));
padding-left: var(--td-button-extra-small-padding-horizontal, 8px);
padding-right: var(--td-button-extra-small-padding-horizontal, 8px);
height: var(--td-button-extra-small-height, 28px);
}
.t-button--size-extra-small .t-button__icon {
font-size: var(--td-button-extra-small-icon-size, 18px);
}
.t-button--size-small {
font-size: var(--td-button-small-font-size, var(--td-font-size-base, 14px));
padding-left: var(--td-button-small-padding-horizontal, 12px);
padding-right: var(--td-button-small-padding-horizontal, 12px);
height: var(--td-button-small-height, 32px);
}
.t-button--size-small .t-button__icon {
font-size: var(--td-button-small-icon-size, 18px);
}
.t-button--size-medium {
font-size: var(--td-button-medium-font-size, var(--td-font-size-m, 16px));
padding-left: var(--td-button-medium-padding-horizontal, 16px);
padding-right: var(--td-button-medium-padding-horizontal, 16px);
height: var(--td-button-medium-height, 40px);
}
.t-button--size-medium .t-button__icon {
font-size: var(--td-button-medium-icon-size, 20px);
}
.t-button--size-large {
font-size: var(--td-button-large-font-size, var(--td-font-size-m, 16px));
padding-left: var(--td-button-large-padding-horizontal, 20px);
padding-right: var(--td-button-large-padding-horizontal, 20px);
height: var(--td-button-large-height, 48px);
}
.t-button--size-large .t-button__icon {
font-size: var(--td-button-large-icon-size, 24px);
}
.t-button--default {
color: var(--td-button-default-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
background-color: var(--td-button-default-bg-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
}
.t-button--default::after {
border-width: var(--td-button-border-width, 2px);
border-color: var(--td-button-default-border-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
}
.t-button--default.t-button--hover {
z-index: 0;
}
.t-button--default.t-button--hover::after {
background-color: var(--td-button-default-active-bg-color, var(--td-bg-color-component-active, var(--td-gray-color-6, #a6a6a6)));
border-color: var(--td-button-default-active-border-color, var(--td-bg-color-component-active, var(--td-gray-color-6, #a6a6a6)));
}
.t-button--default.t-button--disabled {
color: var(--td-button-default-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
background-color: var(--td-button-default-disabled-bg, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
}
.t-button--default.t-button--disabled::after {
border-color: var(--td-button-default-disabled-border-color, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
}
.t-button--primary {
color: var(--td-button-primary-color, var(--td-font-white-1, #ffffff));
background-color: var(--td-button-primary-bg-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-button--primary::after {
border-width: var(--td-button-border-width, 2px);
border-color: var(--td-button-primary-border-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-button--primary.t-button--hover {
z-index: 0;
}
.t-button--primary.t-button--hover::after {
background-color: var(--td-button-primary-active-bg-color, var(--td-brand-color-active, var(--td-brand-color-8, #003cab)));
border-color: var(--td-button-primary-active-border-color, var(--td-brand-color-active, var(--td-brand-color-8, #003cab)));
}
.t-button--primary.t-button--disabled {
color: var(--td-button-primary-disabled-color, var(--td-font-white-1, #ffffff));
background-color: var(--td-button-primary-disabled-bg, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-button--primary.t-button--disabled::after {
border-color: var(--td-button-primary-disabled-border-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-button--light {
color: var(--td-button-light-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
background-color: var(--td-button-light-bg-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-button--light::after {
border-width: var(--td-button-border-width, 2px);
border-color: var(--td-button-light-border-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-button--light.t-button--hover {
z-index: 0;
}
.t-button--light.t-button--hover::after {
background-color: var(--td-button-light-active-bg-color, var(--td-brand-color-light-active, var(--td-brand-color-2, #d9e1ff)));
border-color: var(--td-button-light-active-border-color, var(--td-brand-color-light-active, var(--td-brand-color-2, #d9e1ff)));
}
.t-button--light.t-button--disabled {
color: var(--td-button-light-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
background-color: var(--td-button-light-disabled-bg, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-button--light.t-button--disabled::after {
border-color: var(--td-button-light-disabled-border-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-button--danger {
color: var(--td-button-danger-color, var(--td-font-white-1, #ffffff));
background-color: var(--td-button-danger-bg-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-button--danger::after {
border-width: var(--td-button-border-width, 2px);
border-color: var(--td-button-danger-border-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-button--danger.t-button--hover {
z-index: 0;
}
.t-button--danger.t-button--hover::after {
background-color: var(--td-button-danger-active-bg-color, var(--td-error-color-7, #ad352f));
border-color: var(--td-button-danger-active-border-color, var(--td-error-color-7, #ad352f));
}
.t-button--danger.t-button--disabled {
color: var(--td-button-danger-disabled-color, var(--td-error-color-disabled, var(--td-error-color-3, #ffb9b0)));
background-color: var(--td-button-danger-disabled-bg, var(--td-error-color-3, #ffb9b0));
}
.t-button--danger.t-button--disabled::after {
border-color: var(--td-button-danger-disabled-border-color, var(--td-error-color-3, #ffb9b0));
}
.t-button {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: relative;
white-space: nowrap;
text-align: center;
border: none;
background-image: none;
-webkit-transition: all 0.3s;
transition: all 0.3s;
border-radius: var(--td-button-border-radius, var(--td-radius-default, 6px));
outline: none;
/* stylelint-disable-next-line */
font-family: PingFang SC,
Microsoft YaHei,
Arial Regular;
font-weight: var(--td-button-font-weight, 600);
vertical-align: top;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
/* stylelint-disable-next-line */
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
/* stylelint-disable-next-line */
-ms-touch-action: manipulation;
touch-action: manipulation;
/* stylelint-disable-next-line */
-webkit-appearance: none;
}
.t-button::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
width: 200%;
height: 200%;
-webkit-transform: scale(0.5);
transform: scale(0.5);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
border-radius: calc(var(--td-button-border-radius, var(--td-radius-default, 6px)) * 2);
border-style: solid;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-button--text {
color: var(--td-button-default-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
background: none;
}
.t-button--text::after {
border: 0;
}
.t-button--text.t-button--hover::after {
background-color: var(--td-button-default-text-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
}
.t-button--text.t-button--primary {
color: var(--td-button-primary-text-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
background: none;
}
.t-button--text.t-button--primary.t-button--hover::after {
background-color: var(--td-button-primary-text-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
}
.t-button--text.t-button--primary.t-button--disabled {
color: var(--td-button-primary-text-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
background: none;
}
.t-button--text.t-button--danger {
color: var(--td-button-danger-text-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
background: none;
}
.t-button--text.t-button--danger.t-button--hover::after {
background-color: var(--td-button-danger-text-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
}
.t-button--text.t-button--danger.t-button--disabled {
color: var(--td-button-danger-text-disabled-color, var(--td-button-danger-disabled-color, var(--td-error-color-disabled, var(--td-error-color-3, #ffb9b0))));
background: none;
}
.t-button--text.t-button--light {
color: var(--td-button-light-text-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
background: none;
}
.t-button--text.t-button--light.t-button--hover::after {
background-color: var(--td-button-light-text-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
}
.t-button--text.t-button--disabled {
color: var(--td-button-default-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-button--dashed,
.t-button--outline {
color: var(--td-button-default-outline-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
background-color: transparent;
}
.t-button--dashed::after,
.t-button--outline::after {
border-color: var(--td-button-default-outline-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
}
.t-button--dashed.t-button--hover::after,
.t-button--outline.t-button--hover::after {
background-color: var(--td-button-default-outline-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
border-color: var(--td-button-default-outline-active-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
}
.t-button--dashed.t-button--disabled,
.t-button--outline.t-button--disabled {
color: var(--td-button-default-outline-disabled-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
}
.t-button--dashed.t-button--disabled::after,
.t-button--outline.t-button--disabled::after {
border-color: var(--td-button-default-outline-disabled-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
}
.t-button--dashed.t-button--primary,
.t-button--outline.t-button--primary {
color: var(--td-button-primary-outline-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-button--dashed.t-button--primary::after,
.t-button--outline.t-button--primary::after {
border-color: var(--td-button-primary-outline-border-color, var(--td-button-primary-outline-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9))));
}
.t-button--dashed.t-button--primary.t-button--hover,
.t-button--outline.t-button--primary.t-button--hover {
color: var(--td-button-primary-outline-active-border-color, var(--td-brand-color-active, var(--td-brand-color-8, #003cab)));
}
.t-button--dashed.t-button--primary.t-button--hover::after,
.t-button--outline.t-button--primary.t-button--hover::after {
background-color: var(--td-button-primary-outline-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
border-color: var(--td-button-primary-outline-active-border-color, var(--td-brand-color-active, var(--td-brand-color-8, #003cab)));
}
.t-button--dashed.t-button--primary.t-button--disabled,
.t-button--outline.t-button--primary.t-button--disabled {
background-color: transparent;
color: var(--td-button-primary-outline-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-button--dashed.t-button--primary.t-button--disabled::after,
.t-button--outline.t-button--primary.t-button--disabled::after {
border-color: var(--td-button-primary-outline-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-button--dashed.t-button--danger,
.t-button--outline.t-button--danger {
color: var(--td-button-danger-outline-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-button--dashed.t-button--danger::after,
.t-button--outline.t-button--danger::after {
border-color: var(--td-button-danger-outline-border-color, var(--td-button-danger-outline-color, var(--td-error-color, var(--td-error-color-6, #d54941))));
}
.t-button--dashed.t-button--danger.t-button--hover,
.t-button--outline.t-button--danger.t-button--hover {
color: var(--td-button-danger-outline-active-border-color, var(--td-error-color-7, #ad352f));
}
.t-button--dashed.t-button--danger.t-button--hover::after,
.t-button--outline.t-button--danger.t-button--hover::after {
background-color: var(--td-button-danger-outline-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
border-color: var(--td-button-danger-outline-active-border-color, var(--td-error-color-7, #ad352f));
}
.t-button--dashed.t-button--danger.t-button--disabled,
.t-button--outline.t-button--danger.t-button--disabled {
background-color: transparent;
color: var(--td-button-danger-outline-disabled-color, var(--td-error-color-3, #ffb9b0));
}
.t-button--dashed.t-button--danger.t-button--disabled::after,
.t-button--outline.t-button--danger.t-button--disabled::after {
border-color: var(--td-button-danger-outline-disabled-color, var(--td-error-color-3, #ffb9b0));
}
.t-button--dashed.t-button--light,
.t-button--outline.t-button--light {
color: var(--td-button-light-outline-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
background-color: var(--td-button-light-outline-bg-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-button--dashed.t-button--light::after,
.t-button--outline.t-button--light::after {
border-color: var(--td-button-light-outline-border-color, var(--td-button-light-outline-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9))));
}
.t-button--dashed.t-button--light.t-button--hover,
.t-button--outline.t-button--light.t-button--hover {
color: var(--td-button-light-outline-active-border-color, var(--td-brand-color-active, var(--td-brand-color-8, #003cab)));
}
.t-button--dashed.t-button--light.t-button--hover::after,
.t-button--outline.t-button--light.t-button--hover::after {
background-color: var(--td-button-light-outline-active-bg-color, var(--td-brand-color-light-active, var(--td-brand-color-2, #d9e1ff)));
border-color: var(--td-button-light-outline-active-border-color, var(--td-brand-color-active, var(--td-brand-color-8, #003cab)));
}
.t-button--dashed.t-button--light.t-button--disabled,
.t-button--outline.t-button--light.t-button--disabled {
background-color: transparent;
color: var(--td-button-light-outline-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-button--dashed.t-button--light.t-button--disabled::after,
.t-button--outline.t-button--light.t-button--disabled::after {
border-color: var(--td-button-light-outline-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-button--dashed::after {
border-style: dashed;
}
.t-button--ghost {
background-color: transparent;
color: var(--td-button-ghost-color, #fff);
}
.t-button--ghost::after {
border-color: var(--td-button-ghost-border-color, var(--td-button-ghost-color, #fff));
}
.t-button--ghost.t-button--default.t-button--hover {
color: var(--td-button-ghost-hover-color, var(--td-font-white-2, rgba(255, 255, 255, 0.55)));
}
.t-button--ghost.t-button--default.t-button--hover::after {
background-color: transparent;
border-color: var(--td-button-ghost-hover-color, var(--td-font-white-2, rgba(255, 255, 255, 0.55)));
}
.t-button--ghost.t-button--primary {
color: var(--td-button-ghost-primary-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-button--ghost.t-button--primary::after {
border-color: var(--td-button-ghost-primary-border-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-button--ghost.t-button--primary.t-button--hover {
color: var(--td-button-ghost-primary-hover-color, var(--td-brand-color-active, var(--td-brand-color-8, #003cab)));
}
.t-button--ghost.t-button--primary.t-button--hover::after {
background-color: transparent;
border-color: var(--td-button-ghost-primary-hover-color, var(--td-brand-color-active, var(--td-brand-color-8, #003cab)));
}
.t-button--ghost.t-button--primary.t-button--text.t-button--hover,
.t-button--ghost.t-button--primary.t-button--text.t-button--hover::after {
background-color: var(--td-gray-color-10, #4b4b4b);
}
.t-button--ghost.t-button--primary.t-button--disabled {
background-color: transparent;
color: var(--td-button-ghost-disabled-color, var(--td-font-white-4, rgba(255, 255, 255, 0.22)));
}
.t-button--ghost.t-button--primary.t-button--disabled::after {
border-color: var(--td-button-ghost-disabled-color, var(--td-font-white-4, rgba(255, 255, 255, 0.22)));
}
.t-button--ghost.t-button--danger {
color: var(--td-button-ghost-danger-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-button--ghost.t-button--danger::after {
border-color: var(--td-button-ghost-danger-border-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-button--ghost.t-button--danger.t-button--hover {
color: var(--td-button-ghost-danger-hover-color, var(--td-error-color-active, var(--td-error-color-7, #ad352f)));
}
.t-button--ghost.t-button--danger.t-button--hover::after {
background-color: transparent;
border-color: var(--td-button-ghost-danger-hover-color, var(--td-error-color-active, var(--td-error-color-7, #ad352f)));
}
.t-button--ghost.t-button--danger.t-button--text.t-button--hover,
.t-button--ghost.t-button--danger.t-button--text.t-button--hover::after {
background-color: var(--td-gray-color-10, #4b4b4b);
}
.t-button--ghost.t-button--danger.t-button--disabled {
background-color: transparent;
color: var(--td-button-ghost-disabled-color, var(--td-font-white-4, rgba(255, 255, 255, 0.22)));
}
.t-button--ghost.t-button--danger.t-button--disabled::after {
border-color: var(--td-button-ghost-disabled-color, var(--td-font-white-4, rgba(255, 255, 255, 0.22)));
}
.t-button--ghost.t-button--default.t-button--text.t-button--hover,
.t-button--ghost.t-button--default.t-button--text.t-button--hover::after {
background-color: var(--td-gray-color-10, #4b4b4b);
}
.t-button--ghost.t-button--default.t-button--disabled {
background-color: transparent;
color: var(--td-button-ghost-disabled-color, var(--td-font-white-4, rgba(255, 255, 255, 0.22)));
}
.t-button--ghost.t-button--default.t-button--disabled::after {
border-color: var(--td-button-ghost-disabled-color, var(--td-font-white-4, rgba(255, 255, 255, 0.22)));
}
.t-loading + .t-button__content:not(:empty),
.t-icon + .t-button__content:not(:empty),
.t-button__content:not(:empty) + .t-icon {
margin-left: 4px;
}
.t-button--round.t-button--size-large {
border-radius: calc(var(--td-button-large-height, 48px) / 2);
}
.t-button--round.t-button--size-large::after {
border-radius: var(--td-button-large-height, 48px);
}
.t-button--round.t-button--size-medium {
border-radius: calc(var(--td-button-medium-height, 40px) / 2);
}
.t-button--round.t-button--size-medium::after {
border-radius: var(--td-button-medium-height, 40px);
}
.t-button--round.t-button--size-small {
border-radius: calc(var(--td-button-small-height, 32px) / 2);
}
.t-button--round.t-button--size-small::after {
border-radius: var(--td-button-small-height, 32px);
}
.t-button--round.t-button--size-extra-small {
border-radius: calc(var(--td-button-extra-small-height, 28px) / 2);
}
.t-button--round.t-button--size-extra-small::after {
border-radius: var(--td-button-extra-small-height, 28px);
}
.t-button--square {
padding: 0;
}
.t-button--square.t-button--size-large {
width: var(--td-button-large-height, 48px);
}
.t-button--square.t-button--size-medium {
width: var(--td-button-medium-height, 40px);
}
.t-button--square.t-button--size-small {
width: var(--td-button-small-height, 32px);
}
.t-button--square.t-button--size-extra-small {
width: var(--td-button-extra-small-height, 28px);
}
.t-button--circle {
padding: 0;
border-radius: 50%;
}
.t-button--circle.t-button--size-large {
width: var(--td-button-large-height, 48px);
}
.t-button--circle.t-button--size-large::after {
border-radius: 50%;
}
.t-button--circle.t-button--size-medium {
width: var(--td-button-medium-height, 40px);
}
.t-button--circle.t-button--size-medium::after {
border-radius: 50%;
}
.t-button--circle.t-button--size-small {
width: var(--td-button-small-height, 32px);
}
.t-button--circle.t-button--size-small::after {
border-radius: 50%;
}
.t-button--circle.t-button--size-extra-small {
width: var(--td-button-extra-small-height, 28px);
}
.t-button--circle.t-button--size-extra-small::after {
border-radius: 50%;
}
.t-button--block {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 100%;
}
.t-button--disabled {
cursor: not-allowed;
}
.t-button__loading--wrapper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-button__loading--indicator {
color: var(--td-font-white-1, #ffffff);
}
.t-button.t-button--hover::after {
z-index: -1;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-divider {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
color: var(--td-divider-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
border-color: var(--td-divider-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
border-style: var(--td-divider-content-line-style, solid);
border-width: 0;
}
.t-divider::before,
.t-divider::after {
content: '';
display: block;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border: inherit;
border-color: inherit;
border-style: inherit;
}
.t-divider--horizontal {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin: var(--td-divider-horizontal-margin, 10px) 0;
}
.t-divider--horizontal::before,
.t-divider--horizontal::after {
border-top-width: var(--td-divider-border-width, 1px);
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
-webkit-transform-origin: center;
transform-origin: center;
}
.t-divider--horizontal .t-divider__content:not(:empty) {
margin: 0 var(--td-divider-content-margin, var(--td-spacer-1, 12px));
}
.t-divider--vertical {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
height: 1em;
margin: 0 var(--td-divider-vertical-margin, var(--td-spacer, 8px));
}
.t-divider--vertical::before,
.t-divider--vertical::after {
border-left-width: 1px;
-webkit-transform: scaleX(0.5);
transform: scaleX(0.5);
}
.t-divider--vertical-center {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 100%;
}
.t-divider--dashed {
border-style: dashed;
}
.t-divider__content {
font: var(--td-divider-content-font, var(--td-font-body-small));
color: var(--td-divider-content-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-divider--left::before,
.t-divider--right::after {
max-width: 30px;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-fab {
position: fixed;
}
.t-fab__button {
-webkit-box-shadow: var(--td-fab-shadow, var(--td-shadow-2, 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 8px 10px 1px rgba(0, 0, 0, 0.06), 0 5px 5px -3px rgba(0, 0, 0, 0.1)));
box-shadow: var(--td-fab-shadow, var(--td-shadow-2, 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 8px 10px 1px rgba(0, 0, 0, 0.06), 0 5px 5px -3px rgba(0, 0, 0, 0.1)));
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon {
display: inline-block;
vertical-align: middle;
width: 1em;
height: 1em;
}
.t-icon::before {
font-family: unset;
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.t-icon.t-size-s,
i.t-size-s {
font-size: 14px;
}
.t-icon.t-size-m,
i.t-size-m {
font-size: 16px;
}
.t-icon.t-size-l,
i.t-size-l {
font-size: 18px;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row;
flex-flow: row;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.t-col {
display: block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
min-height: 1px;
}
.t-col--1 {
width: 4.16666667%;
}
.t-col--offset-1 {
margin-left: 4.16666667%;
}
.t-col--2 {
width: 8.33333333%;
}
.t-col--offset-2 {
margin-left: 8.33333333%;
}
.t-col--3 {
width: 12.5%;
}
.t-col--offset-3 {
margin-left: 12.5%;
}
.t-col--4 {
width: 16.66666667%;
}
.t-col--offset-4 {
margin-left: 16.66666667%;
}
.t-col--5 {
width: 20.83333333%;
}
.t-col--offset-5 {
margin-left: 20.83333333%;
}
.t-col--6 {
width: 25%;
}
.t-col--offset-6 {
margin-left: 25%;
}
.t-col--7 {
width: 29.16666667%;
}
.t-col--offset-7 {
margin-left: 29.16666667%;
}
.t-col--8 {
width: 33.33333333%;
}
.t-col--offset-8 {
margin-left: 33.33333333%;
}
.t-col--9 {
width: 37.5%;
}
.t-col--offset-9 {
margin-left: 37.5%;
}
.t-col--10 {
width: 41.66666667%;
}
.t-col--offset-10 {
margin-left: 41.66666667%;
}
.t-col--11 {
width: 45.83333333%;
}
.t-col--offset-11 {
margin-left: 45.83333333%;
}
.t-col--12 {
width: 50%;
}
.t-col--offset-12 {
margin-left: 50%;
}
.t-col--13 {
width: 54.16666667%;
}
.t-col--offset-13 {
margin-left: 54.16666667%;
}
.t-col--14 {
width: 58.33333333%;
}
.t-col--offset-14 {
margin-left: 58.33333333%;
}
.t-col--15 {
width: 62.5%;
}
.t-col--offset-15 {
margin-left: 62.5%;
}
.t-col--16 {
width: 66.66666667%;
}
.t-col--offset-16 {
margin-left: 66.66666667%;
}
.t-col--17 {
width: 70.83333333%;
}
.t-col--offset-17 {
margin-left: 70.83333333%;
}
.t-col--18 {
width: 75%;
}
.t-col--offset-18 {
margin-left: 75%;
}
.t-col--19 {
width: 79.16666667%;
}
.t-col--offset-19 {
margin-left: 79.16666667%;
}
.t-col--20 {
width: 83.33333333%;
}
.t-col--offset-20 {
margin-left: 83.33333333%;
}
.t-col--21 {
width: 87.5%;
}
.t-col--offset-21 {
margin-left: 87.5%;
}
.t-col--22 {
width: 91.66666667%;
}
.t-col--offset-22 {
margin-left: 91.66666667%;
}
.t-col--23 {
width: 95.83333333%;
}
.t-col--offset-23 {
margin-left: 95.83333333%;
}
.t-col--24 {
width: 100%;
}
.t-col--offset-24 {
margin-left: 100%;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-link--small .t-link__content {
font: var(--td-font-body-small);
}
.t-link--small .t-link__prefix-icon,
.t-link--small .t-link__suffix-icon {
font-size: 14px;
}
.t-link--medium .t-link__content {
font: var(--td-font-body-medium);
}
.t-link--medium .t-link__prefix-icon,
.t-link--medium .t-link__suffix-icon {
font-size: 16px;
}
.t-link--large .t-link__content {
font: var(--td-font-body-large);
}
.t-link--large .t-link__prefix-icon,
.t-link--large .t-link__suffix-icon {
font-size: 18px;
}
.t-link--primary {
color: var(--td-link-primary-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-link--primary.t-link--underline::after {
border-color: var(--td-link-primary-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-link--primary.t-link--disabled {
color: var(--td-link-primary-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-link--primary:active.t-link--hover {
color: var(--td-link-primary-active-color, var(--td-brand-color-active, var(--td-brand-color-8, #003cab)));
}
.t-link--primary:active.t-link--hover.t-link--underline::after {
border-color: var(--td-link-primary-active-color, var(--td-brand-color-active, var(--td-brand-color-8, #003cab)));
}
.t-link--success {
color: var(--td-link-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
}
.t-link--success.t-link--underline::after {
border-color: var(--td-link-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
}
.t-link--success.t-link--disabled {
color: var(--td-link-success-disabled-color, var(--td-success-color-disabled, var(--td-success-color-3, #92dab2)));
}
.t-link--success:active.t-link--hover {
color: var(--td-link-success-active-color, var(--td-success-color-active, var(--td-success-color-6, #008858)));
}
.t-link--success:active.t-link--hover.t-link--underline::after {
border-color: var(--td-link-success-active-color, var(--td-success-color-active, var(--td-success-color-6, #008858)));
}
.t-link--warning {
color: var(--td-link-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
}
.t-link--warning.t-link--underline::after {
border-color: var(--td-link-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
}
.t-link--warning.t-link--disabled {
color: var(--td-link-warning-disabled-color, var(--td-warning-color-disabled, var(--td-warning-color-3, #ffb98c)));
}
.t-link--warning:active.t-link--hover {
color: var(--td-link-warning-active-color, var(--td-warning-color-active, var(--td-warning-color-6, #be5a00)));
}
.t-link--warning:active.t-link--hover.t-link--underline::after {
border-color: var(--td-link-warning-active-color, var(--td-warning-color-active, var(--td-warning-color-6, #be5a00)));
}
.t-link--default {
color: var(--td-link-default-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-link--default.t-link--underline::after {
border-color: var(--td-link-default-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-link--default.t-link--disabled {
color: var(--td-link-default-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-link--default:active.t-link--hover {
color: var(--td-link-default-active-color, var(--td-brand-color-active, var(--td-brand-color-8, #003cab)));
}
.t-link--default:active.t-link--hover.t-link--underline::after {
border-color: var(--td-link-default-active-color, var(--td-brand-color-active, var(--td-brand-color-8, #003cab)));
}
.t-link--danger {
color: var(--td-link-danger-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-link--danger.t-link--underline::after {
border-color: var(--td-link-danger-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-link--danger.t-link--disabled {
color: var(--td-link-danger-disabled-color, var(--td-error-color-disabled, var(--td-error-color-3, #ffb9b0)));
}
.t-link--danger:active.t-link--hover {
color: var(--td-link-danger-active-color, var(--td-error-color-active, var(--td-error-color-7, #ad352f)));
}
.t-link--danger:active.t-link--hover.t-link--underline::after {
border-color: var(--td-link-danger-active-color, var(--td-error-color-active, var(--td-error-color-7, #ad352f)));
}
.t-link {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-sizing: content-box;
box-sizing: content-box;
text-decoration: none;
}
.t-link--underline::after {
content: '';
position: absolute;
left: 0;
right: 0;
height: 0;
bottom: 2px;
opacity: 1;
border-bottom: 1px solid #cd0be7;
}
.t-link__prefix-icon:not(:empty) + .t-link__content:not(:empty) {
padding-left: 4px;
display: inherit;
}
.t-link__content:not(:empty) + .t-link__suffix-icon:not(:empty) {
padding-left: 4px;
display: inherit;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-back-top {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
background-color: transparent;
overflow: hidden;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: height 0.2s;
transition: height 0.2s;
height: auto;
}
.t-back-top--fixed {
position: fixed;
right: var(--td-spacer, 8px);
bottom: calc(var(--td-spacer-2, 16px) + env(safe-area-inset-bottom));
}
.t-back-top--round,
.t-back-top--round-dark {
width: 48px;
height: 48px;
border-radius: var(--td-back-top-round-border-radius, var(--td-radius-circle, 50%));
}
.t-back-top--round::after,
.t-back-top--round-dark::after {
border-radius: var(--td-back-top-round-border-radius, var(--td-radius-circle, 50%));
}
.t-back-top--round,
.t-back-top--half-round {
color: var(--td-back-top-round-color, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
background-color: var(--td-back-top-round-bg-color, var(--td-font-white-1, #ffffff));
}
.t-back-top--round-dark,
.t-back-top--half-round-dark {
color: var(--td-back-top-round-dark-color, var(--td-font-white-1, #ffffff));
background-color: var(--td-back-top-round-dark-bg-color, var(--td-gray-color-14, #181818));
}
.t-back-top--half-round,
.t-back-top--half-round-dark {
width: 60px;
height: 40px;
border-radius: var(--td-back-top-half-round-border-radius, var(--td-radius-round, 999px)) 0 0 var(--td-back-top-half-round-border-radius, var(--td-radius-round, 999px));
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
right: 0;
}
.t-back-top--half-round::after,
.t-back-top--half-round-dark::after {
border-radius: var(--td-back-top-half-round-border-radius, var(--td-radius-round, 999px)) 0 0 var(--td-back-top-half-round-border-radius, var(--td-radius-round, 999px));
}
.t-back-top--round::after,
.t-back-top--half-round::after {
top: -50%;
right: -50%;
bottom: -50%;
left: -50%;
border: 1px solid var(--td-back-top-round-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
-webkit-transform: scale(0.5);
transform: scale(0.5);
position: absolute;
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: ' ';
pointer-events: none;
}
.t-back-top--round-dark::after,
.t-back-top--half-round-dark::after {
top: -50%;
right: -50%;
bottom: -50%;
left: -50%;
border: 1px solid var(--td-back-top-round-border-color, var(--td-gray-color-9, #5e5e5e));
-webkit-transform: scale(0.5);
transform: scale(0.5);
position: absolute;
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: ' ';
pointer-events: none;
}
.t-back-top__text--round,
.t-back-top__text--round-dark,
.t-back-top__text--half-round,
.t-back-top__text--half-round-dark {
font-weight: 600;
font-size: var(--td-font-size, 10px);
line-height: 12px;
}
.t-back-top__text--half-round,
.t-back-top__text--half-round-dark {
width: 2em;
}
.t-back-top__icon:not(:empty) + .t-back-top__text--half-round,
.t-back-top__icon:not(:empty) + .t-back-top__text--half-round-dark {
margin-left: 2px;
}
.t-back-top__icon {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-size: 22px;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-overlay-fade-enter,
.t-overlay-fade-appear {
opacity: 0;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.t-overlay-fade-exit {
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.t-overlay-fade-enter.t-overlay-fade-enter-active,
.t-overlay-fade-enter.t-overlay-fade-enter-active.t-overlay-fade-enter-to,
.t-overlay-fade-appear.t-overlay-fade-appear-active,
.t-overlay-fade-appear.t-overlay-fade-appear-active.t-overlay-fade-appear-to {
-webkit-animation-name: tOverlayFadeIn;
animation-name: tOverlayFadeIn;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.t-overlay-fade-exit.t-overlay-fade-exit-active,
.t-overlay-fade-leave-active.t-overlay-fade-leave-to {
-webkit-animation-name: tOverlayFadeOut;
animation-name: tOverlayFadeOut;
-webkit-animation-play-state: running;
animation-play-state: running;
}
@-webkit-keyframes tOverlayFadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes tOverlayFadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes tOverlayFadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes tOverlayFadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
.t-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
bottom: 0;
background-color: var(--td-overlay-bg-color, var(--td-mask-active, rgba(0, 0, 0, 0.6)));
}
.t-overlay-enter-from,
.t-overlay-leave-to {
opacity: 0;
}
.t-overlay-enter-active,
.t-overlay-leave-active {
-webkit-transition-property: opacity;
transition-property: opacity;
-webkit-transition-timing-function: ease;
transition-timing-function: ease;
}
.t-overlay--lock {
overflow: hidden;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.slide-top-enter-active {
-webkit-animation: t-slide-top-in 0.3s;
animation: t-slide-top-in 0.3s;
}
.slide-top-leave-active {
-webkit-animation: t-slide-top-out 0.3s;
animation: t-slide-top-out 0.3s;
}
.slide-right-enter-active {
-webkit-animation: t-slide-right-in 0.3s;
animation: t-slide-right-in 0.3s;
}
.slide-right-leave-active {
-webkit-animation: t-slide-right-out 0.3s;
animation: t-slide-right-out 0.3s;
}
.slide-bottom-enter-active {
-webkit-animation: t-slide-bottom-in 0.3s;
animation: t-slide-bottom-in 0.3s;
}
.slide-bottom-leave-active {
-webkit-animation: t-slide-bottom-out 0.3s;
animation: t-slide-bottom-out 0.3s;
}
.slide-left-enter-active {
-webkit-animation: t-slide-left-in 0.3s;
animation: t-slide-left-in 0.3s;
}
.slide-left-leave-active {
-webkit-animation: t-slide-left-out 0.3s;
animation: t-slide-left-out 0.3s;
}
.fade-zoom-enter-active {
-webkit-animation: t-fade-zoom-in 0.35s;
animation: t-fade-zoom-in 0.35s;
}
.fade-zoom-leave-active {
-webkit-animation: t-fade-zoom-out 0.35s;
animation: t-fade-zoom-out 0.35s;
}
.fade-enter-active {
-webkit-animation: t-fade-in 0.3s;
animation: t-fade-in 0.3s;
}
.fade-leave-active {
-webkit-animation: t-fade-out 0.3s;
animation: t-fade-out 0.3s;
}
.t-popup {
position: fixed;
z-index: 11500;
max-height: 100vh;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
background-color: var(--td-popup-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-popup__content {
position: relative;
z-index: 1;
}
.t-popup__close {
position: absolute;
top: 0;
right: 0;
padding: 10px;
line-height: 1;
color: var(--td-popup-close-btn-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-popup--top {
top: 0;
left: 0;
width: 100%;
border-bottom-left-radius: var(--td-popup-border-radius, var(--td-radius-extraLarge, 12px));
border-bottom-right-radius: var(--td-popup-border-radius, var(--td-radius-extraLarge, 12px));
}
.t-popup--bottom {
bottom: 0;
left: 0;
width: 100vw;
border-top-left-radius: var(--td-popup-border-radius, var(--td-radius-extraLarge, 12px));
border-top-right-radius: var(--td-popup-border-radius, var(--td-radius-extraLarge, 12px));
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
.t-popup--left {
top: 0;
left: 0;
height: 100vh;
}
.t-popup--right {
top: 0;
right: 0;
height: 100vh;
}
.t-popup--center {
top: 50%;
left: 50%;
-webkit-transform: scale(1) translate3d(-50%, -50%, 0);
transform: scale(1) translate3d(-50%, -50%, 0);
border-radius: var(--td-popup-border-radius, var(--td-radius-extraLarge, 12px));
}
.t-popup.t-dialog-enter.t-popup--center,
.t-popup.t-dialog-leave-to.t-popup--center {
-webkit-transform: scale(0.6) translate3d(-50%, -50%, 0);
transform: scale(0.6) translate3d(-50%, -50%, 0);
opacity: 0;
}
.t-popup--lock,
.t-popup-overflow-hidden {
overflow: hidden;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-drawer {
background: var(--td-drawer-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
height: 100vh;
width: var(--td-drawer-width, 280px);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.t-drawer--hover {
background-color: var(--td-drawer-hover-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-drawer__title {
font: var(--td-drawer-title-font, var(--td-font-title-large));
padding: 24px 16px 8px;
color: var(--td-drawer-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-drawer__sidebar {
overflow-y: scroll;
height: var(--td-drawer-sidebar-height, 70vh);
}
.t-drawer__sidebar-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: relative;
padding: var(--td-drawer-item-padding, 16px) 0 var(--td-drawer-item-padding, 16px) var(--td-drawer-item-padding, 16px);
font: var(--td-font-body-large);
}
.t-drawer__sidebar-item::after {
content: '';
display: block;
position: absolute;
top: unset;
bottom: 0;
left: unset;
right: unset;
background-color: var(--td-drawer-border-color, var(--td-border-color, var(--td-gray-color-3, #e7e7e7)));
}
.t-drawer__sidebar-item::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-drawer__sidebar-item::after {
left: var(--td-drawer-item-padding, 16px);
}
.t-drawer__sidebar-item-title {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
color: var(--td-drawer-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-drawer__sidebar-item-icon {
padding-right: 8px;
color: var(--td-drawer-title-color, var(--td-drawer-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)))));
font-size: var(--td-drawer-item-icon-size, 24px);
}
.t-drawer__footer {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
padding-bottom: var(--td-drawer-footer-padding-bottom, 20px);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-indexes {
position: relative;
height: 100vh;
overflow-y: scroll;
}
.t-indexes__sidebar {
position: fixed;
right: var(--td-indexes-sidebar-right, 8px);
width: var(--td-indexes-sidebar-item-size, 20px);
color: var(--td-indexes-sidebar-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
font: var(--td-indexes-sidebar-font, var(--td-font-body-small));
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-flow: column nowrap;
flex-flow: column nowrap;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 1;
}
.t-indexes__sidebar-item {
border-radius: 50%;
position: relative;
text-align: center;
}
.t-indexes__sidebar-item--active {
background-color: var(--td-indexes-sidebar-active-bg-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
color: var(--td-indexes-sidebar-active-color, var(--td-text-color-anti, var(--td-font-white-1, #ffffff)));
}
.t-indexes__sidebar-item + .t-indexes__sidebar-item {
margin-top: 2px;
}
.t-indexes__sidebar-tips {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
min-width: var(--td-indexes-sidebar-tips-size, 48px);
max-width: 198rpx;
padding: 0 32rpx;
-webkit-box-sizing: border-box;
box-sizing: border-box;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
height: var(--td-indexes-sidebar-tips-size, 48px);
font: var(--td-indexes-sidebar-tips-font, var(--td-font-title-extraLarge));
color: var(--td-indexes-sidebar-tips-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
background-color: var(--td-indexes-sidebar-tips-bg-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
border-radius: var(--td-indexes-sidebar-tips-size, 48px);
position: absolute;
top: 50%;
bottom: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
right: var(--td-indexes-sidebar-tips-right, 38px);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-indexes-anchor {
color: var(--td-indexes-anchor-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
font: var(--td-indexes-anchor-font, var(--td-font-body-medium));
}
.t-indexes-anchor__header {
display: none;
padding: 4px 16px;
background-color: var(--td-indexes-anchor-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-indexes-anchor__header--active {
background-color: var(--td-indexes-anchor-active-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
position: relative;
}
.t-indexes-anchor__header--active::after {
content: '';
display: block;
position: absolute;
top: unset;
bottom: 0;
left: unset;
right: unset;
background-color: var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-indexes-anchor__header--active::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-indexes-anchor__slot {
overflow: hidden;
}
.t-indexes-anchor__slot:empty + .t-indexes-anchor__header {
display: block;
}
.t-indexes-anchor__wrapper {
will-change: transform;
}
.t-indexes-anchor__wrapper--sticky {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 1;
}
.t-indexes-anchor__wrapper--active {
color: var(--td-indexes-anchor-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
font-weight: var(--td-indexes-anchor-active-font-weight, 600);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-navbar {
position: relative;
}
.t-navbar--fixed .t-navbar__content {
position: fixed;
top: 0;
left: 0;
right: 0;
}
.t-navbar--visible {
display: block;
}
.t-navbar--visible-animation {
opacity: 1;
-webkit-transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.t-navbar--hide-animation {
opacity: 0;
-webkit-transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.t-navbar--hide {
display: none;
}
.t-navbar__placeholder {
height: var(--td-navbar-height, 48px);
padding-top: var(--td-navbar-padding-top, 0);
position: relative;
visibility: hidden;
}
.t-navbar__content {
position: relative;
height: var(--td-navbar-height, 48px);
padding-top: var(--td-navbar-padding-top, 0);
color: var(--td-navbar-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
background-color: var(--td-navbar-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-navbar__left,
.t-navbar__right {
position: absolute;
top: 0;
bottom: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-navbar__left {
left: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-left: var(--td-spacer-1, 12px);
}
.t-navbar__left-arrow {
font-size: var(--td-navbar-left-arrow-size, 24px);
}
.t-navbar__capsule {
position: relative;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: var(--td-navbar-capsule-width, 88px);
height: var(--td-navbar-capsule-height, 32px);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-navbar__capsule::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 200%;
height: 200%;
-webkit-transform: scale(0.5);
transform: scale(0.5);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-radius: calc(var(--td-navbar-capsule-border-radius, 16px) * 2);
border: 1px solid var(--td-navbar-capsule-border-color, #e3e6ea);
}
.t-navbar__capsule:empty {
display: none;
}
.t-navbar__center {
text-align: center;
height: var(--td-navbar-height, 48px);
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
overflow: hidden;
}
.t-navbar__center-title {
font: var(--td-navbar-title-font, var(--td-font-title-large));
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.t-navbar__right {
position: absolute;
right: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-right: var(--td-spacer-1, 12px);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-badge {
position: relative;
display: inline-block;
vertical-align: top;
}
.t-badge--basic {
z-index: 100;
padding: 0 var(--td-badge-basic-padding, 4px);
font: var(--td-badge-font, var(--td-font-mark-extraSmall));
color: var(--td-badge-text-color, var(--td-font-white-1, #ffffff));
background-color: var(--td-badge-bg-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
text-align: center;
height: var(--td-badge-basic-height, 16px);
border-radius: var(--td-badge-border-radius, 2px);
}
.t-badge--dot {
height: var(--td-badge-dot-size, 8px);
border-radius: 50%;
min-width: var(--td-badge-dot-size, 8px);
padding: 0;
}
.t-badge--count {
min-width: var(--td-badge-basic-width, 16px);
white-space: nowrap;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-badge--circle {
border-radius: calc(var(--td-badge-basic-height, 16px) / 2);
}
.t-badge__ribbon-outer {
position: absolute;
top: 0;
right: 0;
}
.t-badge--ribbon {
display: inline-block;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
border-radius: 0;
}
.t-badge--ribbon::before,
.t-badge--ribbon::after {
content: '';
position: absolute;
width: 0;
height: 0;
bottom: 0;
border-bottom: var(--td-badge-basic-height, 16px) solid var(--td-badge-bg-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-badge--ribbon::before {
left: calc(-1 * var(--td-badge-basic-height, 16px) + 0.5px);
border-left: var(--td-badge-basic-height, 16px) solid transparent;
}
.t-badge--ribbon::after {
right: calc(-1 * var(--td-badge-basic-height, 16px) + 0.5px);
border-right: var(--td-badge-basic-height, 16px) solid transparent;
}
.t-badge--bubble {
border-radius: var(--td-badge-bubble-border-radius, 10px 10px 10px 1px);
}
.t-badge--large {
font: var(--td-badge-large-font, var(--td-font-mark-small));
height: var(--td-badge-large-height, 20px);
min-width: var(--td-badge-large-height, 20px);
padding: 0 var(--td-badge-large-padding, 5px);
}
.t-badge--large.t-badge--circle {
border-radius: calc(var(--td-badge-large-height, 20px) / 2);
}
.t-badge__content:not(:empty) + .t-has-count {
-webkit-transform: translate(50%, -50%);
transform: translate(50%, -50%);
position: absolute;
right: 0;
top: 0;
}
.t-badge__content-text {
display: block;
line-height: 24px;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-side-bar {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
width: var(--td-side-bar-width, 103px);
height: var(--td-side-bar-height, 100%);
overflow-y: auto;
background-color: var(--td-side-bar-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-side-bar-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: start;
position: relative;
padding: var(--td-side-bar-item-padding, var(--td-spacer-2, 16px));
font: var(--td-side-bar-font, var(--td-font-body-large));
color: var(--td-side-bar-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
background: var(--td-side-bar-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
min-height: var(--td-side-bar-item-height, 56px);
-webkit-box-sizing: border-box;
box-sizing: border-box;
white-space: wrap;
}
.t-side-bar-item--active {
font-weight: 600;
background: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
color: var(--td-side-bar-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-side-bar-item__icon {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-size: var(--td-side-bar-icon-size, 20px);
margin-right: 2px;
}
.t-side-bar-item__prefix,
.t-side-bar-item__suffix {
z-index: 1;
position: absolute;
right: 0;
width: calc(var(--td-side-bar-border-radius, 9px) * 2);
height: calc(var(--td-side-bar-border-radius, 9px) * 2);
background: var(--td-side-bar-prefix-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-side-bar-item__prefix::after,
.t-side-bar-item__suffix::after {
content: '';
display: block;
width: 100%;
height: 100%;
background-color: var(--td-side-bar-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-side-bar-item__prefix {
top: calc(var(--td-side-bar-border-radius, 9px) * -2);
}
.t-side-bar-item__prefix::after {
border-bottom-right-radius: var(--td-side-bar-border-radius, 9px);
}
.t-side-bar-item__suffix {
bottom: calc(var(--td-side-bar-border-radius, 9px) * -2);
}
.t-side-bar-item__suffix::after {
border-top-right-radius: var(--td-side-bar-border-radius, 9px);
}
.t-side-bar-item--disabled {
color: var(--td-side-bar-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-side-bar-item__line {
width: 3px;
height: 14px;
position: absolute;
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
background: var(--td-side-bar-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
border-radius: 4px;
}
.t-side-bar__padding {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
background-color: var(--td-side-bar-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
:host {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.t-step--vertical {
padding-right: 16px;
}
.t-steps {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 100%;
}
.t-steps--vertical {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.t-steps--reverse {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
.t-steps--vertical.t-steps--reverse {
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-step-item {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
vertical-align: top;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.t-step-item__circle--default {
color: var(--td-step-item-default-circle-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
background-color: var(--td-step-item-default-circle-bg, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-step-item__title--default {
color: var(--td-step-item-default-title-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-step-item__icon--default {
color: var(--td-step-item-default-icon-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-step-item__dot--default {
border-color: var(--td-step-item-default-dot-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
}
.t-step-item__circle--process {
color: var(--td-step-item-process-circle-color, var(--td-font-white-1, #ffffff));
background-color: var(--td-step-item-process-circle-bg, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-step-item__title--process {
color: var(--td-step-item-process-title-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-step-item__icon--process {
color: var(--td-step-item-process-icon-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-step-item__dot--process {
border-color: var(--td-step-item-process-dot-border-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-step-item__circle--finish {
color: var(--td-step-item-finish-circle-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
background-color: var(--td-step-item-finish-circle-bg, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-step-item__title--finish {
color: var(--td-step-item-finish-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-step-item__icon--finish {
color: var(--td-step-item-finish-icon-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-step-item__dot--finish {
border-color: var(--td-step-item-finish-dot-border-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-step-item__circle--error {
color: var(--td-step-item-error-circle-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
background-color: var(--td-step-item-error-circle-bg, var(--td-error-color-1, #fff0ed));
}
.t-step-item__title--error {
color: var(--td-step-item-error-title-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-step-item__icon--error {
color: var(--td-step-item-error-icon-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-step-item__dot--error {
border-color: var(--td-step-item-error-dot-border-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-step-item--horizontal {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: start;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-step-item--vertical {
margin-bottom: 8px;
}
.t-step-item__anchor {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-step-item__anchor--vertical {
width: var(--td-step-item-circle-size, 22px);
height: var(--td-step-item-circle-size, 22px);
}
.t-step-item__circle {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: var(--td-step-item-circle-size, 22px);
height: var(--td-step-item-circle-size, 22px);
text-align: center;
border-radius: 50%;
font: var(--td-step-item-circle-text-font, var(--td-font-body-medium));
}
.t-step-item__icon {
z-index: 1;
vertical-align: top;
font-size: var(--td-font-size-base, 14px);
position: relative;
}
.t-step-item__icon--finish,
.t-step-item__icon--process {
color: var(--td-brand-color, var(--td-brand-color-7, #0052d9));
}
.t-step-item__dot {
width: var(--td-step-item-dot-size, 8px);
height: var(--td-step-item-dot-size, 8px);
border-radius: 50%;
border-width: 1px;
border-style: solid;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-step-item__dot--process {
background-color: var(--td-step-item-process-dot-border-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-step-item__dot--error {
background-color: var(--td-step-item-error-dot-border-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-step-item__content {
text-align: center;
}
.t-step-item__content--horizontal {
max-width: 80px;
margin-top: 8px;
}
.t-step-item__content--vertical {
margin-left: 8px;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
padding-bottom: 16px;
}
.t-step-item__content--vertical.t-step-item__content--last {
padding-bottom: 0;
}
.t-step-item__title {
position: relative;
font: var(--td-font-body-medium);
}
.t-step-item__title--process {
font-weight: 600;
}
.t-step-item__title--vertical {
text-align: left;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.t-step-item__title + .t-step-item__description:not(:empty) {
margin-top: 4px;
}
.t-step-item__description {
color: var(--td-step-item-description-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-font-body-small);
}
.t-step-item__description--vertical {
text-align: left;
}
.t-step-item__extra:not(:empty) {
margin-top: 8px;
}
.t-step-item__line {
background-color: var(--td-step-item-line-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
content: '';
display: block;
position: absolute;
}
.t-step-item__line--horizontal {
height: 1px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width: calc(100% - 16px - var(--td-step-item-circle-size, 22px));
top: calc(var(--td-step-item-circle-size, 22px) / 2 + 1px);
left: calc(50% + var(--td-step-item-circle-size, 22px) / 2 + 8px);
}
.t-step-item__line--horizontal.t-step-item__line--dot {
top: calc(var(--td-step-item-dot-size, 8px) / 2);
}
.t-step-item__line--finish,
.t-step-item__line--reverse.t-step-item__line--process {
background-color: var(--td-step-item-finish-line-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-step-item__line--vertical {
height: calc(100% - 16px - var(--td-step-item-circle-size, 22px));
width: 1px;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
left: calc(var(--td-step-item-circle-size, 22px) / 2);
top: calc(var(--td-step-item-circle-size, 22px) + 8px);
}
.t-step-item__line--vertical.t-step-item__line--dot {
top: var(--td-step-item-circle-size, 22px);
height: calc(100% - var(--td-step-item-circle-size, 22px));
}
:host {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
vertical-align: top;
position: relative;
-ms-flex-item-align: start;
align-self: flex-start;
width: inherit;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-tab-bar {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: relative;
background-color: var(--td-tab-bar-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-tab-bar--normal.t-tab-bar--bordered::before {
z-index: 1;
right: 0;
left: 0;
top: 0;
border-top: 1px solid var(--td-tab-bar-border-color, var(--td-border-color, var(--td-gray-color-3, #e7e7e7)));
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
position: absolute;
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: ' ';
pointer-events: none;
}
.t-tab-bar--fixed {
position: fixed;
left: 0;
bottom: 0;
right: 0;
}
.t-tab-bar--normal.t-tab-bar--safe {
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
.t-tab-bar--round {
margin-left: 16px;
margin-right: 16px;
border-radius: 999px;
-webkit-box-shadow: var(--td-tab-bar-round-shadow, var(--td-shadow-3, 0 6px 30px 5px rgba(0, 0, 0, 0.05), 0 16px 24px 2px rgba(0, 0, 0, 0.04), 0 8px 10px -5px rgba(0, 0, 0, 0.08)));
box-shadow: var(--td-tab-bar-round-shadow, var(--td-shadow-3, 0 6px 30px 5px rgba(0, 0, 0, 0.05), 0 16px 24px 2px rgba(0, 0, 0, 0.04), 0 8px 10px -5px rgba(0, 0, 0, 0.08)));
}
.t-tab-bar--fixed.t-tab-bar--round.t-tab-bar--safe {
bottom: constant(safe-area-inset-bottom);
bottom: env(safe-area-inset-bottom);
}
.t-tab-bar--fixed.t-tab-bar--round.t-tab-bar--safe {
bottom: constant(safe-area-inset-bottom);
bottom: env(safe-area-inset-bottom);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-tab-bar-item {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
height: var(--td-tab-bar-height, 40px);
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
position: relative;
margin: 8px 0;
background-color: var(--td-tab-bar-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
padding: 0 12px;
}
.t-tab-bar-item--split::before {
top: 0;
bottom: 0;
left: 0;
border-left: 1px solid var(--td-tab-bar-border-color, var(--td-border-color, var(--td-gray-color-3, #e7e7e7)));
-webkit-transform: scaleX(0.5);
transform: scaleX(0.5);
position: absolute;
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: ' ';
pointer-events: none;
top: 8px;
bottom: 8px;
}
.t-tab-bar-item--crowded {
padding: 0 8px;
}
.t-tab-bar-item--round {
border-radius: 99px;
}
.t-tab-bar-item__content {
width: 100%;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
border-radius: 8px;
color: var(--td-tab-bar-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-tab-bar-item__content--checked .t-tab-bar-item__text,
.t-tab-bar-item__content--checked .t-tab-bar-item__icon {
color: var(--td-tab-bar-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
font-weight: 600;
}
.t-tab-bar-item__content--tag {
border-radius: 99px;
}
.t-tab-bar-item__content--tag.t-tab-bar-item__content--checked {
background-color: var(--td-tab-bar-active-bg, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-tab-bar-item__icon .t-icon {
vertical-align: top;
}
.t-tab-bar-item__text {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font: var(--td-font-body-large);
}
.t-tab-bar-item__text--small {
font: var(--td-font-body-extraSmall);
}
.t-tab-bar-item__icon-menu {
margin-right: 4px;
}
.t-tab-bar-item__spread {
position: absolute;
top: 0;
left: 7%;
width: 86%;
background-color: var(--td-tab-bar-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
-webkit-transform: translate3d(0, calc(-100% - 16px), 0);
transform: translate3d(0, calc(-100% - 16px), 0);
z-index: 1;
border-radius: 6px;
color: var(--td-tab-bar-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
-webkit-box-shadow: var(--td-tab-bar-spread-shadow, var(--td-shadow-3, 0 6px 30px 5px rgba(0, 0, 0, 0.05), 0 16px 24px 2px rgba(0, 0, 0, 0.04), 0 8px 10px -5px rgba(0, 0, 0, 0.08)));
box-shadow: var(--td-tab-bar-spread-shadow, var(--td-shadow-3, 0 6px 30px 5px rgba(0, 0, 0, 0.05), 0 16px 24px 2px rgba(0, 0, 0, 0.04), 0 8px 10px -5px rgba(0, 0, 0, 0.08)));
}
.t-tab-bar-item__spread::before {
display: block;
content: '';
position: absolute;
bottom: 0;
left: 50%;
width: 0;
height: 0;
border: 8px solid transparent;
border-top: 8px solid var(--td-tab-bar-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
-webkit-transform: translate3d(-50%, 16px, 0);
transform: translate3d(-50%, 16px, 0);
}
.t-tab-bar-item__spread-item {
width: 100%;
height: 48px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
position: relative;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.t-tab-bar-item__spread-item--active,
.t-tab-bar-item__spread-item:active {
background-color: var(--td-tab-bar-hover-bg-color, rgba(0, 0, 0, 0.05));
}
.t-tab-bar-item__spread-item-split {
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: ' ';
pointer-events: none;
background-color: var(--td-tab-bar-spread-border-color, var(--td-border-color, var(--td-gray-color-3, #e7e7e7)));
width: 80%;
height: 1px;
-webkit-transform: translateY(0.5);
transform: translateY(0.5);
}
.t-tab-bar-item__spread-item-text {
padding-top: 12px;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-sticky {
position: relative;
}
.t-sticky__content {
width: 100%;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-tabs {
position: relative;
font: var(--td-tab-font, var(--td-font-body-medium));
background: var(--td-tab-nav-background, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-tabs__wrapper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
background: var(--td-tab-nav-background, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-tabs__wrapper--card {
background: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
--td-tab-border-color: transparent;
}
.t-tabs__item {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 0;
-ms-flex: none;
flex: none;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
font-weight: 400;
color: var(--td-tab-item-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
padding: 0 16px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
white-space: nowrap;
overflow: hidden;
}
.t-tabs__item--active {
font-weight: 600;
color: var(--td-tab-item-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-tabs__item--disabled {
color: var(--td-tab-item-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
cursor: not-allowed;
}
.t-tabs__item--evenly {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.t-tabs__item--top,
.t-tabs__item--bottom {
height: var(--td-tab-item-height, 48px);
}
.t-tabs__item-inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-tabs__item-inner--tag {
text-align: center;
padding: 0 16px;
line-height: var(--td-tab-item-tag-height, 32px);
border-radius: calc(var(--td-tab-item-tag-height, 32px) / 2);
background-color: var(--td-tab-item-tag-bg, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-tabs__item-inner--active.t-tabs__item-inner--tag {
background-color: var(--td-tab-item-tag-active-bg, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-tabs__item--tag:not(.t-tabs__item--evenly) {
padding: 0 4px;
}
.t-tabs__item--tag:not(.t-tabs__item--evenly):first-child {
margin-left: 8px;
}
.t-tabs__item--tag:not(.t-tabs__item--evenly):last-child {
padding-right: 12px;
}
.t-tabs__item--tag {
padding: 0 8px;
}
.t-tabs__item--card.t-tabs__item--active {
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
border-radius: 9px 9px 0 0;
}
.t-tabs__item--card.t-tabs__item--active:first-child {
border-top-left-radius: 0;
}
.t-tabs__item--card.t-tabs__item--active:last-child {
border-top-right-radius: 0;
}
.t-tabs__item--card.t-tabs__item--pre {
border-bottom-right-radius: 9px;
}
.t-tabs__item-prefix,
.t-tabs__item-suffix {
position: absolute;
bottom: 0;
width: 18px;
height: 18px;
background: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
}
.t-tabs__item-prefix::after,
.t-tabs__item-suffix::after {
content: '';
display: block;
width: 100%;
height: 100%;
background-color: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
}
.t-tabs__item-prefix {
right: 0;
}
.t-tabs__item-prefix::after {
border-bottom-right-radius: 9px;
}
.t-tabs__item-suffix {
left: 0;
}
.t-tabs__item-suffix::after {
border-bottom-left-radius: 9px;
}
.t-tabs__icon {
font-size: var(--td-tab-icon-size, 16px);
margin-right: 2px;
}
.t-tabs__content {
overflow: hidden;
}
.t-tabs__nav {
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-tabs__track {
position: absolute;
font-weight: 600;
z-index: 1;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
background-color: var(--td-tab-track-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-tabs__track--top,
.t-tabs__track--bottom {
left: 0;
bottom: 0.5px;
width: var(--td-tab-track-width, 16px);
height: var(--td-tab-track-thickness, 3px);
border-radius: var(--td-tab-track-radius, 4px);
}
.t-tabs__scroll {
width: 100%;
overflow-x: scroll;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
height: var(--td-tab-item-height, 48px);
position: relative;
}
.t-tabs__scroll::-webkit-scrollbar {
display: none;
}
.t-tabs__scroll--card {
background: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
--td-tab-border-color: transparent;
}
.t-tabs__scroll--split {
position: relative;
}
.t-tabs__scroll--split::after {
content: '';
display: block;
position: absolute;
top: unset;
bottom: 0;
left: unset;
right: unset;
background-color: var(--td-tab-border-color, var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7)));
}
.t-tabs__scroll--split::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-tabs__content-inner {
display: block;
}
.t-tabs--top,
.t-tabs--bottom {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.t-tabs--top .t-tabs__content,
.t-tabs--bottom .t-tabs__content {
width: 100%;
}
.t-tabs--top .t-tabs__content--animated .t-tabs__content-inner,
.t-tabs--bottom .t-tabs__content--animated .t-tabs__content-inner {
position: relative;
width: 100%;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
will-change: left;
-webkit-transition-property: -webkit-transform;
transition-property: -webkit-transform;
transition-property: transform;
transition-property: transform, -webkit-transform;
}
.t-tabs--bottom {
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.t-size-m {
font: var(--td-tab-font, var(--td-font-body-medium));
}
.t-size-l {
font: var(--td-font-body-large);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-calendar {
position: relative;
z-index: 9999;
background: var(--td-calendar-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
overflow-x: hidden;
}
.t-calendar--popup {
border-top-left-radius: var(--td-calendar-radius, 12px);
border-top-right-radius: var(--td-calendar-radius, 12px);
}
.t-calendar__title {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
font: var(--td-calendar-title-font, var(--td-font-title-large));
color: var(--td-calendar-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
padding: var(--td-spacer-2, 16px);
}
.t-calendar__title:focus {
outline: 0;
}
.t-calendar__close-btn {
position: absolute;
top: var(--td-spacer-2, 16px);
right: var(--td-spacer-2, 16px);
margin: calc(-1 * var(--td-spacer-1, 12px));
padding: var(--td-spacer-1, 12px);
color: var(--td-calendar-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-calendar-header {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 0 16px 8px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
.t-calendar-header::after {
content: '';
display: block;
position: absolute;
top: unset;
bottom: 0;
left: unset;
right: unset;
background-color: var(--td-border-color, var(--td-gray-color-3, #e7e7e7));
}
.t-calendar-header::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-calendar-header__title {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: center;
font: var(--td-font-title-small);
}
.t-calendar-header__action {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
font-size: 20px;
color: var(--td-calendar-switch-mode-icon-color, var(--td-text-color-secondary, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))));
}
.t-calendar-header__icon {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: 8px;
cursor: pointer;
}
.t-calendar-header__icon--disabled {
color: var(--td-calendar-switch-mode-icon-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
cursor: not-allowed;
}
.t-calendar__days {
display: grid;
grid-template-columns: repeat(7, 1fr);
grid-column-gap: 4px;
padding: 0 16px;
text-align: center;
line-height: 46px;
}
.t-calendar__days-item {
height: 46px;
font-size: 14px;
color: var(--td-calendar-days-color, var(--td-text-color-secondary, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))));
}
.t-calendar__content {
min-height: 200px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.t-calendar__month {
font: var(--td-font-title-small);
color: var(--td-calendar-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
padding: 16px 0 0;
}
.t-calendar__months {
height: 356px;
padding: 0 16px 16px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-calendar__months::-webkit-scrollbar {
display: none;
}
.t-calendar__dates {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
display: grid;
grid-template-columns: repeat(7, 1fr);
grid-column-gap: 4px;
}
.t-calendar__dates-item {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
font: var(--td-font-title-medium);
border-radius: 8px;
height: 60px;
margin-top: 8px;
color: var(--td-calendar-dates-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
cursor: pointer;
-webkit-tap-highlight-color: transparent;
/* stylelint-disable-next-line */
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.t-calendar__dates-item-prefix,
.t-calendar__dates-item-suffix {
position: absolute;
font: var(--td-font-body-extraSmall);
width: 100%;
text-align: center;
}
.t-calendar__dates-item-prefix {
top: 4px;
}
.t-calendar__dates-item-suffix {
bottom: 4px;
color: var(--td-calendar-item-suffix-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-calendar__dates-item-suffix--selected,
.t-calendar__dates-item-suffix--start,
.t-calendar__dates-item-suffix--end {
color: var(--td-calendar-selected-color, var(--td-text-color-anti, var(--td-font-white-1, #ffffff)));
}
.t-calendar__dates-item-suffix--disabled {
color: var(--td-calendar-item-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-calendar__dates-item--selected,
.t-calendar__dates-item--start,
.t-calendar__dates-item--start-end,
.t-calendar__dates-item--end {
background: var(--td-calendar-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
color: var(--td-calendar-selected-color, var(--td-text-color-anti, var(--td-font-white-1, #ffffff)));
border-radius: 4px;
}
.t-calendar__dates-item--start {
border-radius: 4px 0 0 4px;
}
.t-calendar__dates-item--end {
border-radius: 0 4px 4px 0;
}
.t-calendar__dates-item--start + .t-calendar__dates-item--end::before {
content: '';
display: block;
position: absolute;
top: 0;
width: 4px;
height: 100%;
background: var(--td-calendar-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-calendar__dates-item--start + .t-calendar__dates-item--end::before {
left: -4px;
}
.t-calendar__dates-item--centre {
border-radius: 0;
background-color: var(--td-calendar-item-centre-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-calendar__dates-item--centre::before,
.t-calendar__dates-item--centre::after {
content: '';
display: block;
position: absolute;
top: 0;
width: 4px;
height: 100%;
background-color: var(--td-calendar-item-centre-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-calendar__dates-item--centre::before {
left: -4px;
}
.t-calendar__dates-item--centre::after {
right: -4px;
}
.t-calendar__dates-item--disabled {
color: var(--td-calendar-item-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
cursor: default;
}
.t-calendar__footer {
padding: 16px;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.limit-title-row {
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
}
.t-radio {
position: relative;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
vertical-align: middle;
background: var(--td-radio-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-radio:focus {
outline: 0;
}
.t-radio--block {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: var(--td-radio-vertical-padding, 16px);
}
.t-radio--right {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
.t-radio__icon {
position: relative;
margin-top: calc((var(--td-radio-label-line-height, 24px) - var(--td-radio-icon-size, 24px)) / 2);
width: var(--td-radio-icon-size, 24px);
height: var(--td-radio-icon-size, 24px);
font-size: var(--td-radio-icon-size, 24px);
color: var(--td-radio-icon-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
overflow: hidden;
}
.t-radio__icon:empty {
display: none;
}
.t-radio__icon--left {
margin-right: 8px;
}
.t-radio__icon--checked {
color: var(--td-radio-icon-checked-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-radio__icon--disabled {
cursor: not-allowed;
color: var(--td-radio-icon-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-radio__icon-circle {
width: var(--td-radio-icon-size, 24px);
height: var(--td-radio-icon-size, 24px);
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-radio__icon-circle::after {
content: '';
width: calc(200% - 3px);
height: calc(200% - 3px);
border-radius: 50%;
border: 3px solid var(--td-radio-icon-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%) scale(0.5);
transform: translate(-50%, -50%) scale(0.5);
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-radio__icon-circle--disabled::after {
background: var(--td-radio-icon-disabled-bg-color, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
}
.t-radio__icon-dot {
width: calc((var(--td-radio-icon-size, 24px) - 3px) * 2);
height: calc((var(--td-radio-icon-size, 24px) - 3px) * 2);
border: 3px solid var(--td-radio-icon-checked-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
border-radius: 50%;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%) scale(0.5);
transform: translate(-50%, -50%) scale(0.5);
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-radio__icon-dot::after {
content: '';
display: block;
width: var(--td-radio-icon-size, 24px);
height: var(--td-radio-icon-size, 24px);
background: var(--td-radio-icon-checked-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
border-radius: 50%;
}
.t-radio__icon-dot--disabled {
border-color: var(--td-radio-icon-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-radio__icon-dot--disabled::after {
background: var(--td-radio-icon-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-radio__image {
line-height: var(--td-radio-icon-size, 24px);
}
.t-radio-icon__image {
height: var(--td-radio-icon-size, 24px);
width: var(--td-radio-icon-size, 24px);
vertical-align: sub;
}
.t-radio__content {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.t-radio__content:empty {
display: none;
}
.t-radio__title {
/* stylelint-disable-next-line */
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
color: var(--td-radio-label-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
font: var(--td-radio-font, var(--td-font-body-large));
}
.t-radio__title--disabled {
cursor: not-allowed;
color: var(--td-radio-label-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-radio__description {
/* stylelint-disable-next-line */
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
color: var(--td-radio-content-color, var(--td-text-color-secondary, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))));
font: var(--td-radio-content-font, var(--td-font-body-medium));
}
.t-radio__description--disabled {
cursor: not-allowed;
color: var(--td-radio-content-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-radio__description:empty {
display: none;
}
.t-radio__title + .t-radio__description {
margin-top: 4px;
}
.t-radio__border {
position: absolute;
bottom: 0;
height: 1px;
background: var(--td-radio-border-color, var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7)));
left: 48px;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-radio__border--right {
left: 16px;
}
.t-radio__original {
opacity: 0;
width: 0;
height: 0;
}
.t-radio__icon-wrap {
display: block !important;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-cascader {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
background-color: var(--td-cascader-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
color: var(--td-cascader-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
border-radius: 12px 12px 0 0;
--td-radio-icon-checked-color: var(--td-cascader-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
--td-tab-item-active-color: var(--td-cascader-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
--td-tab-track-color: var(--td-cascader-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-cascader__close-btn {
right: var(--td-spacer-2, 16px);
top: var(--td-spacer-2, 16px);
position: absolute;
}
.t-cascader__title {
position: relative;
font: var(--td-cascader-title-font, var(--td-font-title-large));
text-align: center;
padding: var(--td-cascader-title-padding, var(--td-spacer-2, 16px));
}
.t-cascader__content {
width: 100%;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.t-cascader__options {
width: 100vw;
height: var(--td-cascader-options-height, 320px);
overflow-y: scroll;
}
.t-cascader__options::-webkit-scrollbar {
display: none;
}
.t-cascader__options-title {
margin-top: 20px;
color: var(--td-cascader-options-title-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-font-body-medium);
padding-left: 16px;
}
.t-cascader__options-content {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
height: 100%;
overflow: auto;
padding-left: 16px;
}
.t-cascader__options-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-transition: all ease 0.3s;
transition: all ease 0.3s;
}
.t-cascader__step {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: var(--td-cascader-step-height, 44px);
}
.t-cascader__steps {
padding: 0 16px 5px;
position: relative;
}
.t-cascader__steps::after {
content: '';
display: block;
position: absolute;
top: unset;
bottom: 0;
left: unset;
right: unset;
background-color: var(--td-cascader-border-color, var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7)));
}
.t-cascader__steps::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-cascader__step-dot {
position: relative;
width: var(--td-cascader-step-dot-size, 8px);
height: var(--td-cascader-step-dot-size, 8px);
border-radius: 50%;
border: 1px solid var(--td-cascader-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-cascader__step-dot:not(.t-cascader__step-dot--last)::after {
content: '';
display: block;
position: absolute;
left: 50%;
top: calc(var(--td-cascader-step-dot-size, 8px) + 7px);
height: 18px;
width: 1px;
background: var(--td-cascader-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.t-cascader__step-dot--active {
background: var(--td-cascader-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
border-color: var(--td-cascader-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-cascader__step-label {
padding-left: 16px;
font: var(--td-font-body-medium);
}
.t-cascader__step-label--active {
color: var(--td-cascader-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
font-weight: 600;
}
.t-cascader__step-arrow {
color: var(--td-cascader-step-arrow-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
margin-left: auto;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-checkbox {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
vertical-align: middle;
position: relative;
background: var(--td-checkbox-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-checkbox:focus {
outline: 0;
}
.t-checkbox--block {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: var(--td-checkbox-vertical-padding, var(--td-spacer-2, 16px));
}
.t-checkbox--right {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
.t-checkbox .limit-title-row {
/* stylelint-disable-next-line */
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
}
.t-checkbox .image-center {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.t-checkbox__icon-wrapper {
display: block;
}
.t-checkbox__icon-left {
margin-right: 20px;
width: 20px;
}
.t-checkbox__icon-right {
right: 0;
display: contents;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.t-checkbox__icon-image {
width: var(--td-checkbox-icon-size, 24px);
height: var(--td-checkbox-icon-size, 24px);
vertical-align: top;
}
.t-checkbox__icon {
position: relative;
display: block;
width: var(--td-checkbox-icon-size, 24px);
height: var(--td-checkbox-icon-size, 24px);
color: var(--td-checkbox-icon-color, var(--td-border-level-2-color, var(--td-gray-color-4, #dcdcdc)));
font-size: var(--td-checkbox-icon-size, 24px);
margin-top: calc((var(--td-checkbox-title-line-height, 24px) - var(--td-checkbox-icon-size, 24px)) / 2);
}
.t-checkbox__icon:empty {
display: none;
}
.t-checkbox__icon--checked {
color: var(--td-checkbox-icon-checked-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-checkbox__icon--disabled {
cursor: not-allowed;
color: var(--td-checkbox-icon-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-checkbox__icon--left {
margin-right: 8px;
}
.t-checkbox__icon-circle {
width: calc((var(--td-checkbox-icon-size, 24px) - 3px) * 2);
height: calc((var(--td-checkbox-icon-size, 24px) - 3px) * 2);
border: 3px solid var(--td-checkbox-icon-color, var(--td-border-level-2-color, var(--td-gray-color-4, #dcdcdc)));
border-radius: 50%;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%) scale(0.5);
transform: translate(-50%, -50%) scale(0.5);
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-checkbox__icon-circle--disabled {
background: var(--td-checkbox-icon-disabled-bg-color, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
}
.t-checkbox__icon-rectangle {
width: calc((var(--td-checkbox-icon-size, 24px) - 3px * 2) * 2);
height: calc((var(--td-checkbox-icon-size, 24px) - 3px * 2) * 2);
border: 3px solid var(--td-checkbox-icon-color, var(--td-border-level-2-color, var(--td-gray-color-4, #dcdcdc)));
border-radius: 2px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%) scale(0.5);
transform: translate(-50%, -50%) scale(0.5);
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-checkbox__icon-rectangle--disabled {
background: var(--td-checkbox-icon-disabled-bg-color, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
}
.t-checkbox__icon-line::before,
.t-checkbox__icon-line::after {
content: '';
display: block;
position: absolute;
width: 2.5px;
border-radius: 1px;
background: var(--td-checkbox-icon-checked-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
-webkit-transform-origin: top center;
transform-origin: top center;
}
.t-checkbox__icon-line::before {
height: 8px;
left: 4px;
top: 11px;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.t-checkbox__icon-line::after {
height: 13px;
right: 4px;
top: 7px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.t-checkbox__icon-line--disabled::before,
.t-checkbox__icon-line--disabled::after {
background: var(--td-checkbox-icon-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-checkbox__content {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.t-checkbox__title {
color: var(--td-checkbox-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
font: var(--td-checkbox-title-font, var(--td-font-body-large));
line-height: var(--td-checkbox-title-line-height, 24px);
/* stylelint-disable-next-line */
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
}
.t-checkbox__title--disabled {
color: var(--td-checkbox-title-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-checkbox__description {
color: var(--td-checkbox-description-color, var(--td-text-color-secondary, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))));
/* stylelint-disable-next-line */
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
font: var(--td-checkbox-description-font, var(--td-font-body-medium));
}
.t-checkbox__description--disabled {
color: var(--td-checkbox-description-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-checkbox__title + .t-checkbox__description:not(:empty) {
margin-top: 4px;
}
.t-checkbox__border {
position: absolute;
bottom: 0;
left: 48px;
right: 0;
height: 1px;
background: var(--td-checkbox-border-color, var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7)));
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-checkbox__border--right {
left: 16px;
}
.t-checkbox--tag {
font: var(--td-font-body-medium);
padding-top: 8px;
padding-bottom: 8px;
text-align: center;
background-color: var(--td-checkbox-tag-bg-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
border-radius: 6px;
}
.t-checkbox--tag.t-checkbox--checked {
color: var(--td-checkbox-tag-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
background-color: var(--td-checkbox-tag-active-bg-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-checkbox--tag .t-checkbox__title--checked {
color: var(--td-checkbox-tag-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-checkbox--tag .t-checkbox__content {
margin-right: 0;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-color-picker__panel {
padding: 0;
width: var(--td-color-picker-panel-width, 375px);
background: var(--td-color-picker-panel-background, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
border-top-left-radius: var(--td-color-picker-panel-radius, 12px);
border-top-right-radius: var(--td-color-picker-panel-radius, 12px);
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.t-color-picker__body {
padding: var(--td-color-picker-panel-padding, 16px);
padding-bottom: 28px;
}
.t-color-picker__thumb {
position: absolute;
z-index: 1;
outline: none;
width: var(--td-color-picker-slider-thumb-size, 24px);
height: var(--td-color-picker-slider-thumb-size, 24px);
border-radius: var(--td-radius-circle, 50%);
-webkit-box-shadow: var(--td-shadow-1, 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.12));
box-shadow: var(--td-shadow-1, 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.12));
color: var(--td-text-color-brand, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-color-picker__thumb::before,
.t-color-picker__thumb::after {
content: '';
position: absolute;
border-radius: var(--td-radius-circle, 50%);
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: block;
border: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-color-picker__thumb::before {
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: #fff;
}
.t-color-picker__thumb::after {
left: 3px;
top: 3px;
width: calc(100% - 6px);
height: calc(100% - 6px);
padding: var(--td-color-picker-slider-thumb-padding, 3px);
background: currentcolor;
}
.t-color-picker__saturation {
height: var(--td-color-picker-saturation-height, 144px);
border-radius: var(--td-color-picker-saturation-radius, 6px);
position: relative;
overflow: hidden;
background: transparent;
}
.t-color-picker__saturation::before,
.t-color-picker__saturation::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.t-color-picker__saturation::before {
/* stylelint-disable-next-line color-no-hex */
background: -webkit-gradient(linear, left top, right top, from(#fff), to(transparent));
background: linear-gradient(90deg, #fff, transparent);
}
.t-color-picker__saturation::after {
/* stylelint-disable-next-line color-no-hex */
background: -webkit-gradient(linear, left bottom, left top, from(#000), to(transparent));
background: linear-gradient(0deg, #000, transparent);
}
.t-color-picker__saturation .t-color-picker__thumb {
width: var(--td-color-picker-saturation-thumb-size, 24px);
height: var(--td-color-picker-saturation-thumb-size, 24px);
border-radius: var(--td-radius-circle, 50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.t-color-picker__slider-wrapper {
border-radius: calc(var(--td-color-picker-slider-height, 8px) / 2);
padding: var(--td-color-picker-slider-wrapper-padding, 0 9px);
position: relative;
}
.t-color-picker__slider-wrapper--hue-type {
/* stylelint-disable-next-line color-named */
background: -webkit-gradient(linear, left top, right top, from(red), color-stop(17%, #ff0), color-stop(33%, #0f0), color-stop(50%, #0ff), color-stop(67%, #00f), color-stop(83%, #f0f), to(red));
background: linear-gradient(90deg, red, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red);
margin: 8px 0;
}
.t-color-picker__slider-wrapper--alpha-type {
background: var(--td-text-color-anti, var(--td-font-white-1, #ffffff));
margin: 20px 0 8px;
background-image: linear-gradient(45deg, #c5c5c5 25%, transparent 0, transparent 75%, #c5c5c5 0, #c5c5c5), linear-gradient(45deg, #c5c5c5 25%, transparent 0, transparent 75%, #c5c5c5 0, #c5c5c5);
background-size: 6px 6px;
background-position: 0 0,
3px 3px;
}
.t-color-picker__slider-wrapper--alpha-type .t-color-picker__rail {
background: -webkit-gradient(linear, left top, right top, from(transparent), to(currentcolor));
background: linear-gradient(to right, transparent, currentcolor);
}
.t-color-picker__slider-padding {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: var(--td-color-picker-slider-height, 8px);
border-radius: calc(var(--td-color-picker-slider-height, 8px) / 2);
}
.t-color-picker__slider {
height: var(--td-color-picker-slider-height, 8px);
position: relative;
border-radius: calc(var(--td-color-picker-slider-height, 8px) / 2);
color: transparent;
outline: none;
z-index: 1;
}
.t-color-picker__slider .t-color-picker__thumb {
-webkit-transform: translate(var(--td-color-picker-slider-thumb-transform-x, -9px), -50%);
transform: translate(var(--td-color-picker-slider-thumb-transform-x, -9px), -50%);
top: 50%;
}
.t-color-picker__slider .t-color-picker__rail {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
border-radius: inherit;
}
.t-color-picker__sliders-wrapper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin: 16px 0 20px;
}
.t-color-picker__sliders {
width: 100%;
}
.t-color-picker__sliders-preview {
-ms-flex-negative: 0;
flex-shrink: 0;
margin-left: var(--td-spacer-1, 12px);
width: var(--td-color-picker-gradient-preview-width, 28px);
height: var(--td-color-picker-gradient-preview-height, 28px);
border-radius: var(--td-color-picker-gradient-preview-radius, 3px);
overflow: hidden;
background: var(--td-text-color-anti, var(--td-font-white-1, #ffffff));
background-image: linear-gradient(45deg, #c5c5c5 25%, transparent 0, transparent 75%, #c5c5c5 0, #c5c5c5), linear-gradient(45deg, #c5c5c5 25%, transparent 0, transparent 75%, #c5c5c5 0, #c5c5c5);
background-size: 6px 6px;
background-position: 0 0,
3px 3px;
}
.t-color-picker__sliders-preview-inner {
display: block;
width: 100%;
height: 100%;
}
.t-color-picker__format {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
color: var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4)));
font-size: 14px;
text-align: center;
}
.t-color-picker__format:not(:empty) + .t-color-picker__swatches-wrap:not(:empty) {
margin-top: 28px;
}
.t-color-picker__format-item {
font: var(--td-font-body-medium);
}
.t-color-picker__format-item--first {
-ms-flex-negative: 0;
flex-shrink: 0;
width: 68px;
border: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
border-radius: var(--td-radius-default, 6px);
padding: 6rpx 0;
margin-right: 12px;
}
.t-color-picker__format-item--second {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.t-color-picker__format-inputs {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: distribute;
justify-content: space-around;
}
.t-color-picker__format-input {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
width: 0;
margin-left: -1px;
padding: 6rpx 0;
border: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
border-radius: var(--td-radius-default, 6px);
}
.t-color-picker__format-input:not(:first-child):not(:last-child) {
border-radius: 0;
}
.t-color-picker__format-input:first-child:not(:last-child) {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.t-color-picker__format-input:last-child:not(:first-child) {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.t-color-picker__format-input--fixed {
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-ms-flex-preferred-size: 66.5px;
flex-basis: 66.5px;
}
.t-color-picker__swatches-wrap {
position: relative;
}
.t-color-picker__swatches + .t-color-picker__swatches {
margin-top: var(--td-spacer-1, 12px);
}
.t-color-picker__swatches-title {
font: var(--td-color-picker-swatches-title-font, var(--td-font-title-medium));
padding: 0;
color: var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.t-color-picker__swatches-items {
margin-top: 12px;
width: 100%;
list-style: none;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
overflow-x: auto;
overflow-y: auto;
}
.t-color-picker__swatches-items::-webkit-scrollbar {
display: none;
width: 0;
height: 0;
color: transparent;
}
.t-color-picker__swatches-item {
width: var(--td-color-picker-swatch-width, 24px);
height: var(--td-color-picker-swatch-height, 24px);
padding: var(--td-color-picker-swatch-padding, 0);
overflow: hidden;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: relative;
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transition: all var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-easing, cubic-bezier(0.38, 0, 0.24, 1));
transition: all var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-easing, cubic-bezier(0.38, 0, 0.24, 1));
-webkit-box-sizing: border-box;
box-sizing: border-box;
-ms-flex-negative: 0;
flex-shrink: 0;
margin-right: 12px;
border-radius: var(--td-color-picker-swatch-border-radius, var(--td-radius-small, 3px));
}
.t-color-picker__swatches-item::after {
content: '';
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
opacity: 0;
background: rgba(0, 0, 0, 0.2);
}
.t-color-picker__swatches-item:active::after {
opacity: 1;
}
.t-color-picker__swatches-inner {
width: 100%;
height: 100%;
display: block;
border-radius: var(--td-color-picker-swatch-border-radius, var(--td-radius-small, 3px));
position: relative;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-picker {
position: relative;
background-color: var(--td-picker-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
border-top-left-radius: var(--td-picker-border-radius, 12px);
border-top-right-radius: var(--td-picker-border-radius, 12px);
}
.t-picker__toolbar {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
overflow: hidden;
height: var(--td-picker-toolbar-height, 58px);
}
.t-picker__title {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: var(--td-picker-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
font: var(--td-picker-title-font, var(--td-font-title-large));
}
.t-picker__cancel,
.t-picker__confirm {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
font: var(--td-picker-button-font, var(--td-font-body-large));
height: 100%;
padding: 0 16px;
}
.t-picker__cancel {
color: var(--td-picker-cancel-color, var(--td-text-color-secondary, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))));
}
.t-picker__confirm {
color: var(--td-picker-confirm-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-picker__main {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
padding-left: 32px;
padding-right: 32px;
}
.t-picker__mask {
position: absolute;
left: 0;
right: 0;
z-index: 3;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
pointer-events: none;
height: 48px;
}
.t-picker__mask--top {
top: 0;
background: -webkit-gradient(linear, left top, left bottom, from(var(--td-bg-color-container, var(--td-font-white-1, #ffffff))), to(rgba(255, 255, 255, 0)));
background: linear-gradient(180deg, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)) 0%, rgba(255, 255, 255, 0) 100%);
}
.t-picker__mask--bottom {
bottom: 0;
background: -webkit-gradient(linear, left top, left bottom, from(var(--td-bg-color-container, var(--td-font-white-1, #ffffff))), to(rgba(255, 255, 255, 0)));
background: linear-gradient(180deg, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)) 0%, rgba(255, 255, 255, 0) 100%);
-webkit-transform: matrix(1, 0, 0, -1, 0, 0);
transform: matrix(1, 0, 0, -1, 0, 0);
}
.t-picker__indicator {
height: var(--td-picker-item-height, 40px);
position: absolute;
left: 16px;
right: 16px;
top: calc(var(--td-picker-group-height, 200px) / 2 - var(--td-picker-item-height, 40px) / 2);
pointer-events: none;
background-color: var(--td-picker-indicator-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
border-radius: var(--td-picker-indicator-border-radius, 6px);
}
.t-picker-item {
margin: 0;
padding: 0;
list-style: none;
}
.t-picker-item__group {
-webkit-box-sizing: border-box;
box-sizing: border-box;
height: var(--td-picker-group-height, 200px);
overflow: hidden;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
z-index: 1;
}
.t-picker-item__item {
margin: 0;
padding: 0;
text-align: center;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
height: var(--td-picker-item-height, 40px);
line-height: var(--td-picker-item-height, 40px);
color: var(--td-picker-item-color, var(--td-text-color-secondary, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))));
}
.t-picker-item__item--active {
color: var(--td-picker-item-active-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
font-weight: 600;
}
.t-picker-item__item--disabled {
color: var(--td-picker-item-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-date-time-picker__item--roomly {
width: var(--td-data-time-picker-year-width, 64px);
-webkit-box-flex: 0;
-ms-flex: 0 0 var(--td-data-time-picker-year-width, 64px);
flex: 0 0 var(--td-data-time-picker-year-width, 64px);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-form {
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
}
.t-form .t-form__item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 16px 16px;
position: relative;
}
.t-form .t-form__item:not(:last-child)::after {
left: 0;
bottom: 0;
border-bottom: 1px solid var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7));
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
position: absolute;
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: ' ';
pointer-events: none;
left: 16px;
right: 0;
}
.t-form .t-form__item-help,
.t-form .t-form__item-extra {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
font-size: 12px;
margin: 0;
width: 100%;
height: auto;
min-height: 20px;
margin-top: 4px;
}
.t-form .t-form__item-help {
color: var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26)));
}
.t-form .t-form__item--error {
color: var(--td-error-color-6, #d54941);
}
.t-form .t-form__item--warning {
color: var(--td-warning-color-5, #e37318);
}
.t-form .t-form__item-wrap {
width: 100%;
}
.t-form .t-form__item--top {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.t-form--top {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-form__label {
float: left;
padding-right: 16px;
vertical-align: middle;
line-height: 24px;
color: var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
-webkit-box-sizing: border-box;
box-sizing: border-box;
word-break: break-all;
}
.t-form__label--top {
padding-bottom: 8px;
}
.t-form__label--left {
text-align: left;
}
.t-form__label--right {
text-align: right;
}
.t-form__label--required:not(.t-form__label--required-right) label::before {
display: inline-block;
margin-right: calc(var(--td-spacer, 8px) / 2);
color: var(--td-error-color-6, #d54941);
line-height: 20px;
content: '*';
}
.t-form__label--required-right label::after {
display: inline-block;
margin-left: calc(var(--td-spacer, 8px) / 2);
color: var(--td-error-color-6, #d54941);
line-height: 20px;
content: '*';
}
.t-form__label--colon label::after {
content: ':';
position: relative;
margin: 0 2px;
}
.t-form__controls {
display: flow-root;
position: relative;
}
.t-form__controls-content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
min-height: 24px;
}
.t-form__controls--left {
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
.t-form__controls--right {
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.t-form .t-cell,
.t-form .t-input,
.t-form .t-textarea,
.t-form .t-upload {
padding: 0;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-input {
background-color: var(--td-input-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: var(--td-input-align-items, center);
-ms-flex-align: var(--td-input-align-items, center);
align-items: var(--td-input-align-items, center);
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
padding: var(--td-input-vertical-padding, 16px);
}
.t-input--border {
position: relative;
}
.t-input--border::after {
content: '';
display: block;
position: absolute;
top: unset;
bottom: 0;
left: unset;
right: unset;
background-color: var(--td-input-border-color, var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7)));
}
.t-input--border::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-input--border::after {
left: var(--td-input-border-left-space, 16px);
right: var(--td-input-border-right-space, 0);
}
.t-input--layout-vertical {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
}
.t-input--password {
letter-spacing: 6px;
}
.t-input__wrap--prefix {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.t-input__icon--prefix {
font-size: 24px;
color: var(--td-input-prefix-icon-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-input__label:not(:empty) {
font: var(--td-input-label-text-font, var(--td-font-body-large));
color: var(--td-input-label-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
margin-right: var(--td-spacer-2, 16px);
}
.t-input--layout-horizontal .t-input__label:not(:empty) {
min-width: 2em;
max-width: 5em;
}
.t-input--layout-vertical .t-input__label:not(:empty) {
width: 100%;
font-size: var(--td-font-size-base, 14px);
padding-bottom: 8px;
}
.t-input__icon--prefix:not(:empty) + .t-input__label:not(:empty) {
padding-left: 4px;
}
.t-input__label:not(:empty) + .t-input__wrap {
margin-left: var(--td-spacer-2, 16px);
}
.t-input__icon--prefix:not(:empty) + .t-input__label:empty {
margin-right: var(--td-spacer-2, 16px);
}
.t-input__wrap {
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
-ms-flex-negative: 1;
flex-shrink: 1;
}
.t-input__wrap .t-input__content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font: var(--td-font-body-large);
}
.t-input__wrap--clearable-icon,
.t-input__wrap--suffix-icon,
.t-input__wrap--suffix {
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
padding-left: var(--td-spacer-1, 12px);
}
.t-input__wrap--clearable-icon:empty,
.t-input__wrap--suffix-icon:empty,
.t-input__wrap--suffix:empty {
display: none;
}
.t-input__wrap--clearable-icon,
.t-input__wrap--suffix-icon {
font-size: 24px;
color: var(--td-input-suffix-icon-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-input__wrap--suffix {
font-size: var(--td-font-size-m, 16px);
color: var(--td-input-suffix-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-input__icon--prefix,
.t-input__tips,
.t-input__wrap--clearable-icon,
.t-input__wrap--suffix-icon,
.t-input__wrap--suffix {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.t-input__icon--prefix:empty,
.t-input__tips:empty,
.t-input__wrap--clearable-icon:empty,
.t-input__wrap--suffix-icon:empty,
.t-input__wrap--suffix:empty {
display: none;
}
.t-input__control {
display: block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
min-width: 0;
min-height: 24px;
margin: 0;
padding: 0;
color: var(--td-input-default-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
line-height: inherit;
background-color: transparent;
border: 0;
outline: none;
resize: none;
font-size: inherit;
caret-color: var(--td-input-cursor-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-input__control--disabled {
color: var(--td-input-disabled-text-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
cursor: not-allowed;
opacity: 1;
-webkit-text-fill-color: currentColor;
}
.t-input__control--read-only {
cursor: default;
}
.t-input--left {
text-align: left;
}
.t-input--right {
text-align: right;
}
.t-input--center {
text-align: center;
}
.t-input__placeholder {
color: var(--td-input-placeholder-text-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-input-placeholder-text-font, var(--td-font-body-large));
}
.t-input__tips {
font: var(--td-font-body-small);
padding-top: 4px;
}
.t-input--default + .t-input__tips {
color: var(--td-input-default-tips-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-input--success + .t-input__tips {
color: var(--td-input-success-tips-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
}
.t-input--warning + .t-input__tips {
color: var(--td-input-warning-tips-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
}
.t-input--error + .t-input__tips {
color: var(--td-input-error-tips-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-rate {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
.t-rate__wrapper {
line-height: 1em;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
}
.t-rate--disabled .t-rate__icon-left--selected {
color: var(--td-rate-disabled-selected-color, var(--td-warning-color-3, #ffb98c));
}
.t-rate--disabled .t-rate__icon-left--unselected {
color: var(--td-rate-disabled-unselected-color, var(--td-gray-color-2, #eeeeee));
}
.t-rate--disabled .t-rate__icon--selected {
color: var(--td-rate-disabled-selected-color, var(--td-warning-color-3, #ffb98c));
}
.t-rate--disabled .t-rate__icon--selected-half {
background: -webkit-gradient(linear, left top, right top, from(var(--td-rate-disabled-selected-color, var(--td-warning-color-3, #ffb98c))), color-stop(50%, var(--td-rate-disabled-selected-color, var(--td-warning-color-3, #ffb98c))), color-stop(51%, var(--td-rate-disabled-unselected-color, var(--td-gray-color-2, #eeeeee))), to(var(--td-rate-disabled-unselected-color, var(--td-gray-color-2, #eeeeee))));
background: linear-gradient(to right, var(--td-rate-disabled-selected-color, var(--td-warning-color-3, #ffb98c)) 0%, var(--td-rate-disabled-selected-color, var(--td-warning-color-3, #ffb98c)) 50%, var(--td-rate-disabled-unselected-color, var(--td-gray-color-2, #eeeeee)) 51%, var(--td-rate-disabled-unselected-color, var(--td-gray-color-2, #eeeeee)) 100%);
}
.t-rate--disabled .t-rate__icon--unselected {
color: var(--td-rate-disabled-unselected-color, var(--td-gray-color-2, #eeeeee));
}
.t-rate__icon {
display: block;
width: 1em;
-webkit-transition: -webkit-transform 0.3s ease;
transition: -webkit-transform 0.3s ease;
transition: transform 0.3s ease;
transition: transform 0.3s ease, -webkit-transform 0.3s ease;
position: relative;
}
.t-rate__icon-left {
position: absolute;
width: 50%;
overflow: hidden;
top: 0;
left: 0;
}
.t-rate__icon-left--selected {
color: var(--td-rate-selected-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
}
.t-rate__icon-left--unselected {
color: var(--td-rate-unselected-color, var(--td-bg-color-secondarycomponent, var(--td-gray-color-4, #dcdcdc)));
}
.t-rate__icon--current {
-webkit-transform: scale(var(--td-rate-icon-scale, 1.33));
transform: scale(var(--td-rate-icon-scale, 1.33));
}
.t-rate__icon--selected {
color: var(--td-rate-selected-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
}
.t-rate__icon--selected-half {
color: transparent;
background: -webkit-gradient(linear, left top, right top, from(var(--td-rate-selected-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)))), color-stop(50%, var(--td-rate-selected-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)))), color-stop(51%, var(--td-rate-unselected-color, var(--td-bg-color-secondarycomponent, var(--td-gray-color-4, #dcdcdc)))), to(var(--td-rate-unselected-color, var(--td-bg-color-secondarycomponent, var(--td-gray-color-4, #dcdcdc)))));
background: linear-gradient(to right, var(--td-rate-selected-color, var(--td-warning-color, var(--td-warning-color-5, #e37318))) 0%, var(--td-rate-selected-color, var(--td-warning-color, var(--td-warning-color-5, #e37318))) 50%, var(--td-rate-unselected-color, var(--td-bg-color-secondarycomponent, var(--td-gray-color-4, #dcdcdc))) 51%, var(--td-rate-unselected-color, var(--td-bg-color-secondarycomponent, var(--td-gray-color-4, #dcdcdc))) 100%);
-webkit-background-clip: text;
background-clip: text;
}
.t-rate__icon--unselected {
color: var(--td-rate-unselected-color, var(--td-bg-color-secondarycomponent, var(--td-gray-color-4, #dcdcdc)));
}
.t-rate__text {
font-size: var(--td-rate-text-font-size, var(--td-font-size-m, 16px));
color: var(--td-rate-text-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
margin-left: 16px;
vertical-align: middle;
}
.t-rate__text--active {
color: var(--td-rate-text-active-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
font-weight: var(--td-rate-text-active-font-weight, 600);
}
.t-rate__tips {
position: absolute;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
bottom: calc(100% + 8px);
padding: 4px;
border-radius: 6px;
-webkit-box-shadow: var(--td-shadow-1, 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.12));
box-shadow: var(--td-shadow-1, 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.12));
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
z-index: 1;
}
.t-rate__tips--bottom {
top: calc(100% + 8px);
bottom: auto;
}
.t-rate__tips-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 32px;
border-radius: 3px;
}
.t-rate__tips-item--active {
background-color: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
}
.t-rate__tips-text {
text-align: center;
font: var(--td-font-body-medium);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-search {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
/* stylelint-disable-next-line */
}
.t-search__label {
padding: 4px;
color: var(--td-search-label-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-search--center {
text-align: center;
}
.t-search__input-box {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
height: var(--td-search-height, 40px);
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border: 1px solid var(--td-search-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
background: var(--td-search-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
padding: var(--td-search-padding, 8px 12px);
}
.t-search__input-box.t-is-focused {
border-color: var(--td-search-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-search__input-box--round {
border-radius: calc(var(--td-search-height, 40px) / 2);
}
.t-search__input-box--square {
border-radius: var(--td-search-square-radius, var(--td-radius-default, 6px));
}
.t-search__input-box .t-input__keyword {
width: 100%;
display: inline-block;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
color: var(--td-search-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
font: var(--td-search-font, var(--td-font-body-large));
padding-left: 5px;
border: 0;
outline: none;
resize: none;
background: 0;
}
.t-search__input-box .t-icon {
color: var(--td-search-icon-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font-size: var(--td-search-icon-size, 24px);
}
.t-search__clear {
position: relative;
margin-left: 10px;
font-size: var(--td-search-clear-icon-size, 24px);
color: var(--td-search-clear-icon-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-search__clear.relative {
position: relative;
}
.t-search__clear::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-search__search-action {
margin-left: 15px;
font: var(--td-search-font, var(--td-font-body-large));
color: var(--td-search-action-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-search__placeholder {
color: var(--td-search-placeholder-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-search__placeholder--center {
text-align: center;
}
.t-search__result-item--highLight {
color: var(--td-search-result-high-light-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-search__result-list .t-search__result-item {
padding-left: 0;
}
.t-search__result-list .t-search__result-item::after {
left: 0;
}
.t-search input::-webkit-input-placeholder {
color: var(--td-search-placeholder-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-search input::-webkit-input-placeholder,
.t-search input::placeholder {
color: var(--td-search-placeholder-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-search input[type='search'] {
/* stylelint-disable-next-line */
-webkit-appearance: none;
}
.t-search input::-webkit-search-decoration,
.t-search input::-webkit-search-cancel-button,
.t-search input::-webkit-search-results-button,
.t-search input::-webkit-search-results-decoration {
display: none;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-slider {
font: var(--td-font-body-medium);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-slider--disabled .t-slider__value,
.t-slider--disabled .t-slider__range-extreme,
.t-slider--disabled .t-slider__dot-value,
.t-slider--disabled .t-slider__scale-desc {
color: var(--td-slider-disabled-text-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-slider--disabled .t-slider__dot {
background-color: var(--td-slider-dot-disabled-bg-color, #fff);
border-color: var(--td-slider-dot-disabled-border-color, #f3f3f3);
}
.t-slider--top {
padding-top: 20px;
}
.t-slider__line {
position: absolute;
top: 0;
height: var(--td-slider-bar-height, 4px);
border-radius: calc(var(--td-slider-bar-height, 4px) / 2);
background-color: var(--td-slider-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-slider__line--disabled {
background-color: var(--td-slider-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-slider__line--capsule {
height: var(--td-slider-capsule-line-height, 18px);
}
.t-slider__line--capsule.t-slider__line--single {
border-top-left-radius: calc(var(--td-slider-capsule-line-height, 18px) / 2);
border-bottom-left-radius: calc(var(--td-slider-capsule-line-height, 18px) / 2);
}
.t-slider__dot {
border-radius: 50%;
border: 1px solid var(--td-slider-dot-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
position: absolute;
top: 50%;
right: 0;
-webkit-transform: translate3d(50%, -50%, 0);
transform: translate3d(50%, -50%, 0);
z-index: 2;
background-color: var(--td-slider-dot-bg-color, #fff);
width: var(--td-slider-dot-size, 20px);
height: var(--td-slider-dot-size, 20px);
-webkit-box-shadow: var(--td-shadow-1, 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.12));
box-shadow: var(--td-shadow-1, 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.12));
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-slider__dot--left {
left: 0;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
}
.t-slider__dot-value {
position: relative;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
top: -26px;
text-align: center;
width: 48px;
height: 22px;
}
.t-slider__value,
.t-slider__range-extreme,
.t-slider__dot-value {
color: var(--td-slider-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-slider__value--sr-only,
.t-slider__range-extreme--sr-only,
.t-slider__dot-value--sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
-webkit-clip-path: inset(50%);
clip-path: inset(50%);
border: 0;
}
.t-slider__dot-slider {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
.t-slider__value--min {
margin-left: 16px;
}
.t-slider__value--max {
margin-right: 16px;
}
.t-slider__value--right {
-ms-flex-preferred-size: 40px;
flex-basis: 40px;
}
.t-slider__value--right__value--text {
margin-right: 16px;
text-align: right;
display: block;
}
.t-slider__bar {
margin: 8px 16px;
-webkit-box-flex: 10;
-ms-flex: 10;
flex: 10;
background-clip: content-box;
height: var(--td-slider-bar-height, 4px);
border-radius: calc(var(--td-slider-bar-height, 4px) / 2);
position: relative;
background-color: var(--td-slider-default-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
}
.t-slider__bar--capsule {
height: var(--td-slider-capsule-bar-height, 24px);
border-radius: calc(var(--td-slider-capsule-bar-height, 24px) / 2);
background-color: var(--td-slider-capsule-bar-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
border: 3px solid var(--td-slider-capsule-bar-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-slider__bar--marks {
background-color: var(--td-slider-default-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
}
.t-slider__bar--disabled {
background-color: var(--td-slider-default-color, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
}
.t-slider__range-extreme--min {
margin-left: 16px;
text-align: left;
}
.t-slider__range-extreme--max {
margin-right: 16px;
text-align: right;
}
.t-slider__scale-item {
background-color: var(--td-slider-default-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
height: 8px;
width: 8px;
border-radius: 50%;
position: absolute;
top: 50%;
margin-top: -4px;
z-index: 1;
}
.t-slider__scale-item--active {
background-color: var(--td-slider-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-slider__scale-item--disabled {
background-color: var(--td-slider-default-color, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
}
.t-slider__scale-item--active.t-slider__scale-item--disabled {
background-color: var(--td-slider-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-slider__scale-item--capsule {
height: var(--td-slider-capsule-line-height, 18px);
width: 2px;
border-radius: 0;
background-color: var(--td-slider-capsule-bar-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
margin-top: calc(-0.5 * var(--td-slider-capsule-line-height, 18px));
}
.t-slider__scale-item--hidden {
background-color: transparent;
}
.t-slider__scale-desc {
position: absolute;
left: 50%;
color: var(--td-slider-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
bottom: 16px;
}
.t-slider__scale-desc--capsule {
bottom: 23px;
}
.t-slider--vertical {
--td-slider-bar-height: 200px;
height: var(--td-slider-bar-height, 4px);
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: relative;
}
.t-slider--vertical .t-slider__bar {
-webkit-box-flex: 0;
-ms-flex: none;
flex: none;
height: 100%;
width: var(--td-slider-bar-width, 4px);
}
.t-slider--vertical .t-slider__bar--capsule {
width: var(--td-slider-capsule-bar-width, 24px);
border-radius: calc(var(--td-slider-capsule-bar-width, 24px) / 2);
}
.t-slider--vertical .t-slider__line {
width: 100%;
height: unset;
left: 0;
border-radius: calc(var(--td-slider-bar-width, 4px) / 2);
}
.t-slider--vertical .t-slider__line--capsule {
border-radius: calc(var(--td-slider-capsule-line-height, 18px) / 2);
}
.t-slider--vertical .t-slider__dot {
left: 50%;
top: 100%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.t-slider--vertical .t-slider__dot--left {
top: 0;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
left: 50%;
}
.t-slider--vertical .t-slider__dot--right {
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
top: 100%;
}
.t-slider--vertical .t-slider__dot-value {
left: 27px;
top: 50%;
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
width: auto;
}
.t-slider--vertical .t-slider__range-extreme {
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
margin: 0;
}
.t-slider--vertical .t-slider__range-extreme--min {
top: 0;
}
.t-slider--vertical .t-slider__range-extreme--max {
bottom: 0;
-webkit-transform: translate(-50%, 100%);
transform: translate(-50%, 100%);
}
.t-slider--vertical .t-slider__scale-item {
left: 50%;
margin-top: 0;
}
.t-slider--vertical .t-slider__scale-item--capsule {
height: 2px;
width: var(--td-slider-capsule-line-height, 18px);
}
.t-slider--vertical .t-slider__scale-desc {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
bottom: unset;
left: 19px;
}
.t-slider--vertical .t-slider__scale-desc--capsule {
left: 26px;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-stepper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: var(--td-stepper-input-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-stepper__minus,
.t-stepper__plus {
padding: 4px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-stepper__input,
.t-stepper__minus-icon,
.t-stepper__plus-icon {
color: inherit;
font-size: inherit;
}
.t-stepper__input--normal,
.t-stepper__input--filled,
.t-stepper__input--outline {
height: inherit;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-stepper--small {
height: 20px;
font-size: 10px;
}
.t-stepper--medium {
height: 24px;
font-size: 12px;
}
.t-stepper--large {
height: 26px;
font-size: 16px;
}
.t-stepper__input {
text-align: center;
border: 0;
vertical-align: top;
background: 0;
height: inherit;
min-height: inherit;
}
.t-stepper__input--normal,
.t-stepper__input--filled {
margin: 0 4px;
}
.t-stepper__input--small {
width: 34px;
}
.t-stepper__input--medium {
height: 24px;
width: 38px;
}
.t-stepper__input--large {
width: 45px;
}
.t-stepper__icon--small {
width: 20px;
height: 20px;
font-size: 12px;
}
.t-stepper__icon--medium {
width: 24px;
height: 24px;
font-size: 16px;
}
.t-stepper__icon--large {
width: 26px;
height: 26px;
font-size: 20px;
}
.t-stepper__minus--outline,
.t-stepper__plus--outline {
border: 1px solid var(--td-stepper-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
}
.t-stepper__input--outline {
padding: 0 4px;
border: none;
border-top: 1px solid var(--td-stepper-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
border-bottom: 1px solid var(--td-stepper-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
}
.t-stepper__minus--outline,
.t-stepper__minus--filled {
border-radius: var(--td-stepper-border-radius, var(--td-radius-small, 3px)) 0 0 var(--td-stepper-border-radius, var(--td-radius-small, 3px));
}
.t-stepper__plus--outline,
.t-stepper__plus--filled {
border-radius: 0 var(--td-stepper-border-radius, var(--td-radius-small, 3px)) var(--td-stepper-border-radius, var(--td-radius-small, 3px)) 0;
}
.t-stepper__minus--filled,
.t-stepper__plus--filled {
background-color: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
}
.t-stepper__input--filled {
background-color: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
}
.t-stepper--normal-disabled {
color: var(--td-stepper-input-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-stepper--filled-disabled,
.t-stepper--outline-disabled {
color: var(--td-stepper-input-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
background-color: var(--td-stepper-input-disabled-bg, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-switch {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
vertical-align: middle;
width: var(--td-switch-width, 45px);
height: var(--td-switch-height, 28px);
border-radius: var(--td-switch-radius, calc(var(--td-switch-height, 28px) / 2));
background-color: var(--td-switch-unchecked-color, var(--td-bg-color-secondarycontainer-active, var(--td-gray-color-4, #dcdcdc)));
position: relative;
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;
overflow: hidden;
}
.t-switch--checked {
background-color: var(--td-switch-checked-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-switch--disabled {
background-color: var(--td-switch-unchecked-disabled-color, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
}
.t-switch--checked.t-switch--disabled {
background-color: var(--td-switch-checked-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-switch--large {
width: var(--td-switch-large-width, 52px);
height: var(--td-switch-large-height, 32px);
border-radius: var(--td-switch-large-radius, calc(var(--td-switch-large-height, 32px) / 2));
}
.t-switch--small {
width: var(--td-switch-small-width, 39px);
height: var(--td-switch-small-height, 24px);
border-radius: var(--td-switch-small-radius, calc(var(--td-switch-small-height, 24px) / 2));
}
.t-switch__label {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
font-size: var(--td-switch-label-font-size, 14px);
color: var(--td-switch-label-color, var(--td-bg-color-secondarycontainer-active, var(--td-gray-color-4, #dcdcdc)));
overflow: hidden;
}
.t-switch__label--checked {
color: var(--td-switch-label-checked-color, var(--td-switch-checked-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9))));
}
.t-switch__label--disabled {
color: var(--td-switch-unchecked-disabled-color, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
}
.t-switch__label--checked.t-switch__label--disabled {
color: var(--td-switch-checked-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-switch__label--large {
font-size: var(--td-switch-label-large-font-size, 16px);
}
.t-switch__label--small {
font-size: var(--td-switch-label-small-font-size, 12px);
}
.t-switch__label:empty {
display: none;
}
.t-switch__icon {
font-size: var(--td-switch-icon-size, 20px);
}
.t-switch__icon--large {
font-size: var(--td-switch-icon-large-size, 24px);
}
.t-switch__icon--small {
font-size: var(--td-switch-icon-small-size, 16px);
}
.t-switch__loading {
color: var(--td-switch-loading-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-switch__dot {
position: absolute;
left: var(--td-switch-dot-horizontal-margin, 3px);
top: 50%;
width: var(--td-switch-dot-size, 22px);
height: var(--td-switch-dot-size, 22px);
border-radius: 50%;
background-color: var(--td-font-white-1, #ffffff);
-webkit-transition: all 0.3s;
transition: all 0.3s;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-box-shadow: var(--td-switch-dot-shadow, var(--td-shadow-1, 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.12)));
box-shadow: var(--td-switch-dot-shadow, var(--td-shadow-1, 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.12)));
}
.t-switch__dot--disabled {
background-color: var(--td-switch-dot-disabled-color, var(--td-font-white-1, #ffffff));
}
.t-switch__dot--large {
width: var(--td-switch-dot-large-size, 26px);
height: var(--td-switch-dot-large-size, 26px);
}
.t-switch__dot--small {
width: var(--td-switch-dot-small-size, 18px);
height: var(--td-switch-dot-small-size, 18px);
}
.t-switch__dot--checked {
left: calc(var(--td-switch-width, 45px) - var(--td-switch-dot-size, 22px) - var(--td-switch-dot-horizontal-margin, 3px));
}
.t-switch__dot--large.t-switch__dot--checked {
left: calc(var(--td-switch-large-width, 52px) - var(--td-switch-dot-large-size, 26px) - var(--td-switch-dot-horizontal-margin, 3px));
}
.t-switch__dot--small.t-switch__dot--checked {
left: calc(var(--td-switch-small-width, 39px) - var(--td-switch-dot-small-size, 18px) - var(--td-switch-dot-horizontal-margin, 3px));
}
.t-switch__dot--plain:not(.t-switch__dot--checked) {
width: var(--td-switch-dot-plain-size, 18px);
height: var(--td-switch-dot-plain-size, 18px);
left: var(--td-switch-dot-plain-horizontal-margin, 5px);
}
.t-switch__dot--large.t-switch__dot--plain:not(.t-switch__dot--checked) {
width: var(--td-switch-dot-plain-large-size, 22px);
height: var(--td-switch-dot-plain-large-size, 22px);
}
.t-switch__dot--small.t-switch__dot--plain:not(.t-switch__dot--checked) {
width: var(--td-switch-dot-plain-small-size, 14px);
height: var(--td-switch-dot-plain-small-size, 14px);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-textarea {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: var(--td-textarea-padding, 16px 16px);
background-color: var(--td-textarea-background-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-textarea--layout-vertical {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.t-textarea__label:not(:empty) {
font: var(--td-font-body-medium);
color: var(--td-textarea-label-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
-ms-flex-negative: 0;
flex-shrink: 0;
margin-right: var(--td-spacer-2, 16px);
width: var(--td-textarea-label-width, 64px);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.t-textarea--layout-vertical .t-textarea__label:not(:empty) {
font: var(--td-font-body-medium);
padding-bottom: var(--td-spacer, 8px);
}
.t-textarea__wrapper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
width: 100%;
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
overflow: hidden;
}
.t-textarea__wrapper-inner {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: inherit;
min-width: 0;
height: 100%;
min-height: 20px;
margin: 0;
padding: 0;
text-align: left;
background-color: transparent;
border: 0;
outline: none;
resize: none;
font: var(--td-font-body-large);
color: var(--td-textarea-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-textarea__placeholder::-webkit-input-placeholder {
color: var(--td-textarea-placeholder-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-font-body-medium);
}
.t-textarea__placeholder::-moz-placeholder {
color: var(--td-textarea-placeholder-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-font-body-medium);
}
.t-textarea__placeholder:-ms-input-placeholder {
color: var(--td-textarea-placeholder-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-font-body-medium);
}
.t-textarea__placeholder::-ms-input-placeholder {
color: var(--td-textarea-placeholder-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-font-body-medium);
}
.t-textarea__placeholder::placeholder {
color: var(--td-textarea-placeholder-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-font-body-medium);
}
.t-textarea__indicator:not(:empty) {
color: var(--td-textarea-indicator-text-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-font-body-small);
text-align: right;
padding-top: var(--td-spacer, 8px);
}
.t-textarea--border {
border-radius: var(--td-textarea-border-radius, var(--td-radius-default, 6px));
position: relative;
}
.t-textarea--border::after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
border: 1px solid var(--td-textarea-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
border-radius: inherit;
pointer-events: none;
}
.t-textarea--disabled {
color: var(--td-textarea-disabled-text-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
cursor: not-allowed;
}
.t-textarea--readonly {
cursor: pointer;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-tree-select {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
background-color: var(--td-tree-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-tree-select__column {
width: var(--td-tree-colum-width, 103px);
color: var(--td-tree-colum-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-tree-select__column--left {
background: var(--td-tree-root-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-tree-select__column--right {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
overflow: auto;
}
.t-tree-select__column ::-webkit-scrollbar {
display: none;
width: 0;
height: 0;
color: transparent;
}
.t-tree-select__item {
height: var(--td-tree-item-height, 56px);
line-height: var(--td-tree-item-height, 56px);
font-size: var(--td-tree-item-font-size, 16px);
padding-left: 16px;
}
.t-tree-select__item--active {
font-weight: 600;
color: var(--td-tree-item-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-tree-select__item--disabled {
pointer-events: none;
cursor: not-allowed;
color: var(--td-tree-item-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-tree-select-column {
width: 100%;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-image {
color: var(--td-image-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font-size: 0;
}
.t-image__img {
width: 100%;
height: 100%;
}
.t-image__mask {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
background-color: var(--td-image-loading-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
color: var(--td-image-loading-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
width: 100%;
height: 100%;
}
.t-image--loading-text {
width: 0;
height: 0;
}
.t-image__common {
width: 100%;
height: 100%;
}
.t-image--circle {
border-radius: 50%;
overflow: hidden;
}
.t-image--round {
border-radius: var(--td-image-round-radius, var(--td-radius-default, 6px));
overflow: hidden;
}
.t-image--square {
border-radius: 0;
overflow: hidden;
}
.t-image--fit-fill {
-o-object-fit: fill;
object-fit: fill;
}
.t-image--fit-contain {
-o-object-fit: contain;
object-fit: contain;
}
.t-image--fit-cover {
-o-object-fit: cover;
object-fit: cover;
}
.t-image--fit-scale-down {
-o-object-fit: scale-down;
object-fit: scale-down;
}
.t-image--fit-none {
-o-object-fit: none;
object-fit: none;
}
.t-image--position-center {
-o-object-position: center;
object-position: center;
}
.t-image--position-bottom {
-o-object-position: bottom;
object-position: bottom;
}
.t-image--position-top {
-o-object-position: top;
object-position: top;
}
.t-image--position-left {
-o-object-position: left;
object-position: left;
}
.t-image--position-right {
-o-object-position: right;
object-position: right;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-swiper {
position: relative;
-webkit-box-sizing: border-box;
box-sizing: border-box;
font-weight: normal;
border-radius: var(--td-swiper-border-radius, 8px);
overflow: hidden;
}
.t-swiper-item {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-ms-flex-negative: 0;
flex-shrink: 0;
}
.t-swiper-item > * {
border-radius: var(--td-swiper-border-radius, 8px);
}
.t-swiper-item--image-host {
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: relative;
}
.t-swiper-item--image-host > * {
border-radius: var(--td-swiper-border-radius, 8px);
}
.t-swiper-item--image-host img {
height: 100%;
width: 100%;
max-width: none;
-o-object-fit: cover;
object-fit: cover;
}
.t-swiper__container {
height: 100%;
width: auto;
position: relative;
}
.t-swiper__item {
overflow: hidden;
}
.t-swiper__item img {
height: 100%;
width: 100%;
}
.t-swiper--outside {
padding-bottom: var(--td-swiper-placement-outside-padding, calc(var(--td-spacer-1, 12px) + var(--td-swiper-nav-dot-size, 6px)));
}
.t-swiper__container--card {
position: absolute;
bottom: 0;
left: 0;
right: 0;
top: 0;
}
.t-swiper--card .t-swiper-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
z-index: 0;
}
.t-swiper--card .t-swiper-item--active {
z-index: 1;
}
.t-swiper--card .t-swiper-item--image-host {
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.t-swiper--card .t-swiper-item--image-host--prev {
right: var(--td-swiper-item-right-padding, 6px);
}
.t-swiper--card .t-swiper-item--image-host--next {
left: var(--td-swiper-item-left-padding, 6px);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-swiper-nav__dots,
.t-swiper-nav__dots-bar {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
}
.t-swiper-nav__dots-item,
.t-swiper-nav__dots-bar-item {
width: var(--td-swiper-nav-dot-size, 6px);
height: var(--td-swiper-nav-dot-size, 6px);
background: var(--td-swiper-nav-dot-color, var(--td-font-white-2, rgba(255, 255, 255, 0.55)));
border-radius: 50%;
margin: 0 5px;
-webkit-transition: all 0.4s ease-in;
transition: all 0.4s ease-in;
}
.t-swiper-nav__dots-item--vertical,
.t-swiper-nav__dots-bar-item--vertical {
margin: 5px 0;
}
.t-swiper-nav__dots-item--active,
.t-swiper-nav__dots-bar-item--active {
background-color: var(--td-swiper-nav-dot-active-color, var(--td-font-white-1, #ffffff));
}
.t-swiper-nav__dots-bar-item--vertical.t-swiper-nav__dots-bar-item--active {
width: var(--td-swiper-nav-dot-size, 6px);
height: var(--td-swiper-nav-dots-bar-active-width, 20px);
}
.t-swiper-nav__dots-bar-item--active {
width: var(--td-swiper-nav-dots-bar-active-width, 20px);
border-radius: calc(var(--td-swiper-nav-dot-size, 6px) / 2);
background-color: var(--td-swiper-nav-dot-active-color, var(--td-font-white-1, #ffffff));
}
.t-swiper-nav--left {
position: absolute;
left: 12px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.t-swiper-nav--right {
position: absolute;
right: 12px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.t-swiper-nav--top-left {
position: absolute;
top: 12px;
left: 12px;
}
.t-swiper-nav--top {
position: absolute;
left: 50%;
top: 12px;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.t-swiper-nav--top-right {
position: absolute;
top: 12px;
right: 12px;
}
.t-swiper-nav--bottom-left {
position: absolute;
left: 12px;
bottom: 12px;
}
.t-swiper-nav--bottom {
position: absolute;
left: 50%;
bottom: 12px;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.t-swiper-nav--bottom-right {
position: absolute;
right: 12px;
bottom: 12px;
}
.t-swiper-nav--vertical {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.t-swiper-nav__fraction {
padding: 0 8px;
height: var(--td-swiper-nav-fraction-height, 24px);
border-radius: calc(var(--td-swiper-nav-fraction-height, 24px) / 2);
background: var(--td-swiper-nav-fraction-bg-color, var(--td-font-gray-3, rgba(0, 0, 0, 0.4)));
color: var(--td-swiper-nav-fraction-color, var(--td-font-white-1, #ffffff));
font: var(--td-swiper-nav-fraction-font, var(--td-font-body-small));
}
.t-swiper-nav__btn--prev,
.t-swiper-nav__btn--next {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width: var(--td-swiper-nav-btn-size, 24px);
height: var(--td-swiper-nav-btn-size, 24px);
border-radius: 50%;
background: var(--td-swiper-nav-btn-bg-color, var(--td-font-gray-3, rgba(0, 0, 0, 0.4)));
}
.t-swiper-nav__btn--prev::after,
.t-swiper-nav__btn--next::after {
content: '';
display: block;
position: absolute;
left: 50%;
top: 50%;
width: 6px;
height: 6px;
border-color: var(--td-swiper-nav-btn-color, var(--td-font-white-1, #ffffff));
border-style: solid;
}
.t-swiper-nav__btn--prev {
left: 15px;
}
.t-swiper-nav__btn--prev::after {
margin-left: 2px;
border-width: 1px 0 0 1px;
-webkit-transform: translate(-50%, -50%) rotateZ(-45deg);
transform: translate(-50%, -50%) rotateZ(-45deg);
}
.t-swiper-nav__btn--next {
right: 15px;
}
.t-swiper-nav__btn--next::after {
margin-left: -2px;
border-width: 1px 1px 0 0;
-webkit-transform: translate(-50%, -50%) rotateZ(45deg);
transform: translate(-50%, -50%) rotateZ(45deg);
}
.t-swiper-nav--outside {
bottom: 0;
}
.t-swiper-nav--outside .t-swiper-nav__dots-item,
.t-swiper-nav--outside .t-swiper-nav__dots-bar-item {
background: var(--td-swiper-nav-outside-bg, var(--td-gray-color-3, #e7e7e7));
}
.t-swiper-nav--outside .t-swiper-nav__dots-item--active,
.t-swiper-nav--outside .t-swiper-nav__dots-bar-item--active {
background-color: var(--td-swiper-nav-outside-bg-active, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-image-viewer {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 1001;
height: 100%;
-webkit-transform: translateZ(0);
transform: translateZ(0);
overflow: hidden;
}
.t-image-viewer__cover {
position: absolute;
top: 0;
left: 0;
z-index: 1006;
}
.t-image-viewer__mask {
position: fixed;
z-index: 1000;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: var(--td-image-viewer-mask-bg-color, var(--td-mask-active, rgba(0, 0, 0, 0.6)));
}
.t-image-viewer__content {
width: 100vw;
display: inline-block;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 1005;
border-radius: 0;
}
.t-image-viewer__swiper-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-image-viewer__img {
height: auto;
max-width: 100%;
}
.t-image-viewer__nav {
width: 100%;
position: fixed;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
height: var(--td-image-viewer-nav-height, 48px);
background-color: var(--td-image-viewer-nav-bg-color, #000);
left: 0;
color: var(--td-image-viewer-nav-color, var(--td-font-white-1, #ffffff));
z-index: 1005;
}
.t-image-viewer__nav-close {
margin-left: var(--td-image-viewer-close-margin-left, var(--td-spacer-1, 12px));
}
.t-image-viewer__nav-delete {
margin-right: var(--td-image-viewer-delete-margin-right, var(--td-spacer-1, 12px));
}
.t-image-viewer__nav-close,
.t-image-viewer__nav-delete {
width: 24px;
font-size: 24px;
}
.t-image-viewer__nav-index {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
font-size: var(--td-image-viewer-nav-index-font-size, var(--td-font-size-base, 14px));
text-align: center;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-upload {
display: grid;
grid-template-columns: repeat(var(--td-upload-grid-columns, 4), 1fr);
gap: 16px 8px;
padding: 16px;
}
.t-upload__item {
position: relative;
width: var(--td-upload-width, 80px);
height: var(--td-upload-height, 80px);
border-radius: var(--td-upload-radius, var(--td-radius-default, 6px));
overflow: hidden;
}
.t-upload__item--add {
font-size: var(--td-upload-add-icon-size, 28px);
background: var(--td-upload-background, var(--td-upload-add-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3))));
color: var(--td-upload-add-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-upload__add-icon {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
}
.t-upload__delete-btn {
position: absolute;
top: 0;
right: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 20px;
height: 20px;
color: var(--td-upload-delete-icon-color, #fff);
border-top-right-radius: var(--td-upload-radius, var(--td-radius-default, 6px));
border-bottom-left-radius: var(--td-upload-radius, var(--td-radius-default, 6px));
background-color: var(--td-font-gray-3, rgba(0, 0, 0, 0.4));
}
.t-upload__progress-mask {
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 100%;
background-color: var(--td-font-gray-3, rgba(0, 0, 0, 0.4));
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: var(--td-upload-radius, var(--td-radius-default, 6px));
color: var(--td-font-white-1, #ffffff);
padding: 16px 0;
}
.t-upload__progress-text {
font: var(--td-font-body-small);
margin-top: 4px;
}
.t-upload__progress-loading {
-webkit-animation: spin infinite linear 0.6s;
animation: spin infinite linear 0.6s;
}
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes spin {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-watermark {
position: relative;
overflow: hidden;
width: 100%;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-avatar {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background-color: var(--td-avatar-bg-color, var(--td-brand-color-light-active, var(--td-brand-color-2, #d9e1ff)));
color: var(--td-avatar-content-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-avatar__wrapper {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
position: relative;
vertical-align: top;
margin-left: var(--td-avatar-margin-left, 0);
}
.t-avatar--large {
width: var(--td-avatar-large-width, 64px);
height: var(--td-avatar-large-width, 64px);
font-size: var(--td-avatar-text-large-font-size, var(--td-font-size-xl, 20px));
}
.t-avatar--large .t-avatar__icon {
font-size: var(--td-avatar-icon-large-font-size, 32px);
}
.t-avatar--medium {
width: var(--td-avatar-medium-width, 48px);
height: var(--td-avatar-medium-width, 48px);
font-size: var(--td-avatar-text-medium-font-size, var(--td-font-size-m, 16px));
}
.t-avatar--medium .t-avatar__icon {
font-size: var(--td-avatar-icon-medium-font-size, 24px);
}
.t-avatar--small {
width: var(--td-avatar-small-width, 40px);
height: var(--td-avatar-small-width, 40px);
font-size: var(--td-avatar-text-small-font-size, var(--td-font-size-base, 14px));
}
.t-avatar--small .t-avatar__icon {
font-size: var(--td-avatar-icon-small-font-size, 20px);
}
.t-avatar .t-image,
.t-avatar__image {
width: 100%;
height: 100%;
}
.t-avatar--circle {
border-radius: var(--td-avatar-circle-border-radius, var(--td-radius-circle, 50%));
overflow: hidden;
}
.t-avatar--round {
border-radius: var(--td-avatar-round-border-radius, var(--td-radius-default, 6px));
overflow: hidden;
}
.t-avatar__text,
.t-avatar__icon {
width: 100%;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-avatar__text:empty,
.t-avatar__icon:empty {
width: 0;
height: 0;
}
.t-avatar--border {
border-color: var(--td-avatar-border-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
border-style: solid;
}
.t-avatar--border-small {
border-width: var(--td-avatar-border-width-small, 1px);
}
.t-avatar--border-medium {
border-width: var(--td-avatar-border-width-medium, 2px);
}
.t-avatar--border-large {
border-width: var(--td-avatar-border-width-large, 3px);
}
.t-avatar-group {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-avatar-group-offset-left .t-avatar__wrapper,
.t-avatar-group-offset-right .t-avatar__wrapper {
padding: var(--td-avatar-group-line-spacing, 2px) 0;
}
.t-avatar-group-offset-left-small,
.t-avatar-group-offset-right-small {
--td-avatar-margin-left: var(--td-avatar-group-margin-left-small, -8px);
}
.t-avatar-group-offset-left-medium,
.t-avatar-group-offset-right-medium {
--td-avatar-margin-left: var(--td-avatar-group-margin-left-medium, -8px);
}
.t-avatar-group-offset-left-large,
.t-avatar-group-offset-right-large {
--td-avatar-margin-left: var(--td-avatar-group-margin-left-large, -8px);
}
.t-avatar-group__collapse--slot,
.t-avatar-group__collapse--default {
z-index: 0;
font-weight: 600;
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(1) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 1);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(2) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 2);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(3) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 3);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(4) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 4);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(5) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 5);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(6) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 6);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(7) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 7);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(8) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 8);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(9) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 9);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(10) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 10);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(11) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 11);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(12) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 12);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(13) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 13);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(14) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 14);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(15) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 15);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(16) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 16);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(17) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 17);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(18) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 18);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(19) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 19);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(20) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 20);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(21) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 21);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(22) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 22);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(23) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 23);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(24) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 24);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(25) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 25);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(26) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 26);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(27) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 27);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(28) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 28);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(29) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 29);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(30) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 30);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(31) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 31);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(32) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 32);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(33) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 33);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(34) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 34);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(35) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 35);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(36) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 36);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(37) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 37);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(38) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 38);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(39) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 39);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(40) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 40);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(41) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 41);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(42) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 42);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(43) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 43);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(44) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 44);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(45) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 45);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(46) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 46);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(47) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 47);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(48) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 48);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(49) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 49);
}
.t-avatar-group-offset-left .t-avatar__wrapper:nth-child(50) {
z-index: calc(var(--td-avatar-group-init-z-index, 50) - 50);
}
.t-avatar-group__collapse--slot {
float: left;
}
.t-avatar-group__collapse--slot:not(:empty) + .t-avatar-group__collapse--default {
display: none;
float: left;
}
.t-avatar-group__collapse--slot:empty + .t-avatar-group__collapse--default {
display: block;
float: left;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-cell {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
overflow: hidden;
padding: var(--td-cell-vertical-padding, 16px) var(--td-cell-horizontal-padding, 16px);
height: var(--td-cell-height, auto);
background-color: var(--td-cell-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-cell::after {
right: 0;
left: 0;
bottom: 0;
border-bottom: 1px solid var(--td-cell-border-color, var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7)));
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
position: absolute;
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: ' ';
pointer-events: none;
left: var(--td-border-left-space, var(--td-cell-horizontal-padding, 16px));
right: var(--td-cell-border-right-space, 0);
}
.t-cell:last-child::after,
.t-cell--borderless::after {
display: none;
}
.t-cell__description {
font: var(--td-cell-description-font, var(--td-font-body-medium));
color: var(--td-cell-description-color, var(--td-text-color-secondary, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))));
margin-top: calc(var(--td-spacer, 8px) / 2);
}
.t-cell__note {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
color: var(--td-cell-note-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-cell-note-font, var(--td-font-body-medium));
}
.t-cell__title {
color: var(--td-cell-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-cell__title {
margin-right: var(--td-spacer-2, 16px);
}
.t-cell__title,
.t-cell__note {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.t-cell__title:empty,
.t-cell__note:empty {
display: none;
}
.t-cell__title-text {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
font: var(--td-cell-title-font, var(--td-font-body-large));
color: var(--td-cell-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-cell__left,
.t-cell__right {
-ms-flex-item-align: stretch;
align-self: stretch;
}
.t-cell__left .t-icon,
.t-cell__right .t-icon {
display: block;
}
.t-cell__left:not(:empty) {
margin-right: var(--td-spacer-1, 12px);
}
.t-cell__left-icon {
color: var(--td-cell-left-icon-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
font-size: var(--td-cell-left-icon-size, 24px);
}
.t-cell__left-image {
height: var(--td-cell-image-height, 48px);
width: var(--td-cell-image-width, 48px);
}
.t-cell__note:not(:empty) + .t-cell__right {
margin-left: calc(var(--td-spacer, 8px) / 2);
}
.t-cell__right {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.t-cell__right-icon {
color: var(--td-cell-right-icon-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font-size: var(--td-cell-right-icon-size, 24px);
}
.t-cell__right--middle {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-cell__right--top {
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
.t-cell__right--bottom {
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
}
.t-cell--hover {
background-color: var(--td-cell-hover-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-cell--required {
font: var(--td-cell-required-font, var(--td-font-body-medium));
color: var(--td-cell-required-color, var(--td-error-color-6, #d54941));
}
.t-cell-group {
position: relative;
}
.t-cell-group__title {
font-family: PingFangSC-Regular;
font-size: var(--td-cell-group-title-font-size, 14px);
color: var(--td-cell-group-title-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
text-align: left;
line-height: var(--td-cell-group-title-line-height, 45px);
background-color: var(--td-cell-group-title-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
padding-left: var(--td-cell-group-title-padding-left, 16px);
}
.t-cell-group--bordered::before {
right: 0;
left: 0;
top: 0;
border-top: 1px solid var(--td-cell-group-border-color, var(--td-border-color, var(--td-gray-color-3, #e7e7e7)));
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
position: absolute;
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: ' ';
pointer-events: none;
z-index: 1;
}
.t-cell-group--bordered::after {
right: 0;
left: 0;
bottom: 0;
border-bottom: 1px solid var(--td-cell-group-border-color, var(--td-border-color, var(--td-gray-color-3, #e7e7e7)));
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
position: absolute;
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: ' ';
pointer-events: none;
z-index: 1;
}
.t-cell-group--card {
margin: 0 16px;
border-radius: var(--td-radius-large, 9px);
overflow: hidden;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-collapse {
position: relative;
}
.t-collapse--card {
margin: 0 16px;
border-radius: var(--td-radius-large, 9px);
overflow: hidden;
}
.t-collapse-panel {
position: relative;
background-color: var(--td-collapse-panel-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
overflow: hidden;
}
.t-collapse-panel::after {
content: '';
display: block;
position: absolute;
top: unset;
bottom: 0;
left: unset;
right: unset;
background-color: var(--td-collapse-border-color, var(--td-border-color, var(--td-gray-color-3, #e7e7e7)));
}
.t-collapse-panel::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-collapse-panel--top {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.t-collapse-panel__header {
position: relative;
color: var(--td-collapse-header-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-collapse-panel__header--top {
position: relative;
}
.t-collapse-panel__header--top::after {
content: '';
display: block;
position: absolute;
top: 0;
bottom: unset;
left: unset;
right: unset;
background-color: var(--td-collapse-border-color, var(--td-border-color, var(--td-gray-color-3, #e7e7e7)));
}
.t-collapse-panel__header--top::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-collapse-panel__header--bottom {
position: relative;
}
.t-collapse-panel__header--bottom::after {
content: '';
display: block;
position: absolute;
top: unset;
bottom: 0;
left: unset;
right: unset;
background-color: var(--td-collapse-border-color, var(--td-border-color, var(--td-gray-color-3, #e7e7e7)));
}
.t-collapse-panel__header--bottom::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-collapse-panel__header::after {
display: none;
left: 16px;
}
.t-collapse-panel__header--expanded::after {
display: block;
}
.t-collapse-panel__header .t-cell__title {
font: var(--td-collapse-title-font, var(--td-font-body-large));
}
.t-collapse-panel__header .t-cell__note {
font: var(--td-collapse-extra-font, var(--td-font-body-large));
}
.t-collapse-panel__header .t-cell__right-icon {
color: var(--td-collapse-icon-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-collapse-panel--disabled {
pointer-events: none;
}
.t-collapse-panel--disabled .t-cell__title,
.t-collapse-panel--disabled .t-cell__note,
.t-collapse-panel--disabled .t-cell__right-icon,
.t-collapse-panel--disabled .t-cell__title-text {
color: var(--td-collapse-header-text-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-collapse-panel__body {
display: grid;
-webkit-transition: grid-template-rows ease 240ms;
transition: grid-template-rows ease 240ms;
transition: grid-template-rows ease 240ms, -ms-grid-rows ease 240ms;
}
.t-collapse-panel__inner {
overflow: hidden;
}
.t-collapse-panel__content {
color: var(--td-collapse-content-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
font: var(--td-collapse-content-font, var(--td-font-body-medium));
padding: var(--td-collapse-content-padding, 16px);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-count-down--small.t-count-down--default {
font-size: var(--td-font-size-base, 14px);
}
.t-count-down--small.t-count-down--round > .t-count-down__item {
font-size: var(--td-font-size-s, 12px);
}
.t-count-down--small.t-count-down--square > .t-count-down__item {
font-size: var(--td-font-size-s, 12px);
}
.t-count-down--small.t-count-down--round > .t-count-down__item,
.t-count-down--small.t-count-down--square > .t-count-down__item {
width: 20px;
height: 20px;
}
.t-count-down--small.t-count-down--round > .t-count-down__split--dot,
.t-count-down--small.t-count-down--square > .t-count-down__split--dot {
margin: 0 2px;
font-size: var(--td-font-size-base, 14px);
font-weight: 700;
}
.t-count-down--small.t-count-down--round > .t-count-down__split--text,
.t-count-down--small.t-count-down--square > .t-count-down__split--text {
margin: 0 4px;
font-size: var(--td-font-size, 10px);
}
.t-count-down--medium.t-count-down--default {
font-size: var(--td-font-size-m, 16px);
}
.t-count-down--medium.t-count-down--round > .t-count-down__item {
font-size: var(--td-font-size-base, 14px);
}
.t-count-down--medium.t-count-down--square > .t-count-down__item {
font-size: var(--td-font-size-base, 14px);
}
.t-count-down--medium.t-count-down--round > .t-count-down__item,
.t-count-down--medium.t-count-down--square > .t-count-down__item {
width: 24px;
height: 24px;
}
.t-count-down--medium.t-count-down--round > .t-count-down__split--dot,
.t-count-down--medium.t-count-down--square > .t-count-down__split--dot {
margin: 0 3px;
font-size: var(--td-font-size-m, 16px);
font-weight: 700;
}
.t-count-down--medium.t-count-down--round > .t-count-down__split--text,
.t-count-down--medium.t-count-down--square > .t-count-down__split--text {
margin: 0 5px;
font-size: var(--td-font-size-s, 12px);
}
.t-count-down--large.t-count-down--default {
font-size: 18px;
}
.t-count-down--large.t-count-down--round > .t-count-down__item {
font-size: var(--td-font-size-m, 16px);
}
.t-count-down--large.t-count-down--square > .t-count-down__item {
font-size: var(--td-font-size-m, 16px);
}
.t-count-down--large.t-count-down--round > .t-count-down__item,
.t-count-down--large.t-count-down--square > .t-count-down__item {
width: 28px;
height: 28px;
}
.t-count-down--large.t-count-down--round > .t-count-down__split--dot,
.t-count-down--large.t-count-down--square > .t-count-down__split--dot {
margin: 0 6px;
font-size: 18px;
font-weight: 700;
}
.t-count-down--large.t-count-down--round > .t-count-down__split--text,
.t-count-down--large.t-count-down--square > .t-count-down__split--text {
margin: 0 6px;
font-size: var(--td-font-size-base, 14px);
}
.t-count-down {
font-family: TCloudNumber, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Hiragino Sans GB, Microsoft YaHei UI, Microsoft YaHei, Source Han Sans CN, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
}
.t-count-down .t-count-down__item,
.t-count-down .t-count-down__split {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-count-down--square > .t-count-down__split--dot,
.t-count-down--round > .t-count-down__split--dot {
color: var(--td-error-color-6, #d54941);
}
.t-count-down--square > .t-count-down__split--text,
.t-count-down--round > .t-count-down__split--text {
color: var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
}
.t-count-down--default {
color: var(--td-countdown-default-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-count-down--square {
color: var(--td-countdown-round-color, var(--td-text-color-anti, var(--td-font-white-1, #ffffff)));
}
.t-count-down--square > .t-count-down__item {
border-radius: var(--td-countdown-square-border-radius, var(--td-radius-small, 3px));
background: var(--td-countdown-bg-color, var(--td-error-color-6, #d54941));
}
.t-count-down--round {
color: var(--td-countdown-round-color, var(--td-text-color-anti, var(--td-font-white-1, #ffffff)));
}
.t-count-down--round > .t-count-down__item {
border-radius: var(--td-countdown-round-border-radius, var(--td-radius-circle, 50%));
background: var(--td-countdown-bg-color, var(--td-error-color-6, #d54941));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-empty {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-empty__icon {
font-size: 96px;
color: var(--td-empty-icon-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-empty__thumb + .t-empty__description:not(:empty) {
margin-top: var(--td-empty-description-margin-top, var(--td-spacer-2, 16px));
}
.t-empty__description {
text-align: center;
color: var(--td-empty-description-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-empty-description-font, var(--td-font-body-medium));
}
.t-empty__description + .t-empty__actions:not(:empty) {
margin-top: var(--td-empty-action-margin-top, var(--td-spacer-4, 32px));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-footer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
.t-footer__text {
font: var(--td-footer-text-font, var(--td-font-body-small));
color: var(--td-footer-text-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-footer__link-list + .t-footer__text:not(:empty),
.t-footer__logo + .t-footer__text:not(:empty) {
margin-top: var(--td-footer-text-margin-top, 4px);
}
.t-footer__link-list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-footer__link-item {
color: var(--td-footer-link-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
font: var(--td-footer-link-font, var(--td-font-body-medium));
text-decoration: none;
}
.t-footer__link-line {
font-size: 12px;
color: var(--td-footer-link-dividing-line-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
display: inline-block;
padding: 0 var(--td-footer-link-dividing-line-padding, var(--td-spacer-1, 12px));
}
.t-footer__logo {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-footer__icon {
width: var(--td-footer-logo-icon-width, 24px);
height: var(--td-footer-logo-icon-height, 24px);
margin-right: var(--td-footer-logo-icon-margin-right, var(--td-spacer, 8px));
}
.t-footer__title {
font: var(--td-footer-logo-title-font, var(--td-font-title-medium));
font-style: italic;
color: var(--td-footer-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-footer__title-url {
width: var(--td-footer-logo-title-url-width, 128px);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-grid {
position: relative;
overflow: hidden;
display: grid;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-grid--bordered::after {
right: 0;
left: 0;
top: 0;
border-top: 1px solid var(--td-grid-item-border-color, var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7)));
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
position: absolute;
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: ' ';
pointer-events: none;
}
.t-grid--card {
margin: 0 16px;
border-radius: var(--td-grid-card-radius, var(--td-radius-large, 9px));
overflow: hidden;
}
.t-grid--auto-size {
overflow: scroll;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-grid-item {
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: var(--td-grid-item-vertical-padding, 16px 0 12px);
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
background: var(--td-grid-item-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
-ms-flex-preferred-size: 84px;
flex-basis: 84px;
-ms-flex-negative: 0;
flex-shrink: 0;
}
.t-grid-item--bordered {
position: relative;
}
.t-grid-item--bordered::after {
content: '';
display: block;
position: absolute;
top: unset;
bottom: 0;
left: unset;
right: unset;
background-color: var(--td-grid-item-border-color, var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7)));
}
.t-grid-item--bordered::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-grid-item--bordered::before {
top: 0;
bottom: 0;
right: 0;
border-right: 1px solid var(--td-grid-item-border-color, var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7)));
-webkit-transform: scaleX(0.5);
transform: scaleX(0.5);
position: absolute;
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: ' ';
pointer-events: none;
}
.t-grid-item--surround::before {
top: -50%;
right: -50%;
bottom: -50%;
left: -50%;
border: 1px solid var(--td-grid-item-border-color, var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7)));
-webkit-transform: scale(0.5);
transform: scale(0.5);
position: absolute;
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: ' ';
pointer-events: none;
}
.t-grid-item--horizontal {
padding: var(--td-grid-item-horizontal-padding, 16px 0);
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-grid-item--hover {
background-color: var(--td-grid-item-hover-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-grid-item__content {
overflow: hidden;
position: relative;
margin-top: var(--td-grid-item-text-padding-top, 8px);
}
.t-grid-item__content--horizontal {
margin-top: 0;
margin-left: 12px;
text-align: left;
}
.t-grid-item__image {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
background: var(--td-grid-item-image-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
border-radius: var(--td-grid-item-image-border-radius, var(--td-radius-default, 6px));
width: var(--td-grid-item-image-width, 48px);
height: var(--td-grid-item-image-width, 48px);
}
.t-grid-item__image--small {
width: var(--td-grid-item-image-small-width, 32px);
height: var(--td-grid-item-image-small-width, 32px);
}
.t-grid-item__image--middle {
width: var(--td-grid-item-image-middle-width, 40px);
height: var(--td-grid-item-image-middle-width, 40px);
}
.t-grid-item__title {
width: inherit;
color: var(--td-grid-item-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-grid-item__title--small {
font: var(--td-grid-item-text-small-font, var(--td-font-body-extraSmall));
}
.t-grid-item__title--middle {
font: var(--td-grid-item-text-middle-font, var(--td-font-body-small));
}
.t-grid-item__title--large {
font: var(--td-grid-item-text-font, var(--td-font-body-medium));
}
.t-grid-item__description {
color: var(--td-grid-item-description-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-grid-item-description-font, var(--td-font-body-small));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-list__loading {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
margin: 10px 0 4px;
}
.t-list__loading > span {
color: var(--td-gray-color-6, #a6a6a6);
}
.t-list__loading--wrapper {
text-align: center;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-progress__inner {
position: relative;
height: 100%;
background: var(--td-progress-inner-bg-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
border-radius: var(--td-radius-round, 999px);
-webkit-transition: all var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-easing, cubic-bezier(0.38, 0, 0.24, 1));
transition: all var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-easing, cubic-bezier(0.38, 0, 0.24, 1));
}
.t-progress__bar {
width: 100%;
height: 6px;
overflow: hidden;
background: var(--td-progress-track-bg-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
border-radius: var(--td-radius-round, 999px);
}
.t-progress__info {
margin-left: var(--td-spacer, 8px);
color: var(--td-progress-info-dark-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
white-space: nowrap;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
}
.t-progress--thin {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-progress--thin .t-progress__icon {
font-size: calc(var(--td-font-size-base, 14px) + 2px);
}
.t-progress--plump {
height: 20px;
border-radius: calc(20px / 2);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-progress--plump .t-progress__info {
font: var(--td-font-body-small);
}
.t-progress--over-ten .t-progress__info {
position: absolute;
top: 50%;
right: var(--td-spacer, 8px);
color: var(--td-progress-info-light-color, var(--td-font-white-1, #ffffff));
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.t-progress--under-ten .t-progress__info,
.t-progress--under-ten .t-progress__inner {
display: inline-block;
}
.t-progress--under-ten .t-progress__info {
vertical-align: top;
}
.t-progress__canvas--circle {
position: relative;
width: 112px;
height: 112px;
border-radius: var(--td-radius-circle, 50%);
}
.t-progress__canvas--circle .t-progress__canvas--inner {
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: calc(100% - 6px*2);
height: calc(100% - 6px*2);
border-radius: var(--td-radius-circle, 50%);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: var(--td-progress-circle-inner-bg-color, var(--td-font-white-1, #ffffff));
}
.t-progress__canvas--circle .t-progress__info {
margin: 0;
font: var(--td-progress-circle-label-font, var(--td-font-title-extraLarge));
overflow: hidden;
text-overflow: ellipsis;
/* stylelint-disable-next-line */
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.t-progress__canvas--circle .t-progress__icon {
font-size: var(--td-progress-circle-icon-size, 48px);
}
.t-progress--circle {
position: relative;
}
.t-progress--circle .t-progress__info {
position: absolute;
display: block;
top: 50%;
left: 50%;
width: 100%;
margin: 0;
font: var(--td-progress-circle-label-font, var(--td-font-title-extraLarge));
text-align: center;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.t-progress--circle .t-progress__circle-outer {
stroke: var(--td-progress-track-bg-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
}
.t-progress--circle .t-progress__circle-inner {
stroke: var(--td-progress-inner-bg-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
-webkit-transition: all var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-easing, cubic-bezier(0.38, 0, 0.24, 1));
transition: all var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-easing, cubic-bezier(0.38, 0, 0.24, 1));
}
.t-progress--circle .t-progress__icon {
font-size: var(--td-progress-circle-icon-size, 48px);
}
.t-progress--status-active .t-progress__inner::before {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
content: '';
-webkit-animation: progress-active-animation 2s cubic-bezier(0.23, 0.99, 0.86, 0.2) infinite;
animation: progress-active-animation 2s cubic-bezier(0.23, 0.99, 0.86, 0.2) infinite;
background: var(--td-progress-inner-bg-color-active, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
opacity: 0.2;
}
.t-progress--status-success .t-progress__inner {
background: var(--td-progress-inner-bg-color-success, var(--td-success-color, var(--td-success-color-5, #2ba471)));
}
.t-progress--status-success .t-progress__circle-inner {
stroke: var(--td-success-color, var(--td-success-color-5, #2ba471));
}
.t-progress--status-success .t-progress__icon {
color: var(--td-success-color, var(--td-success-color-5, #2ba471));
}
.t-progress--status-warning .t-progress__inner {
background: var(--td-progress-inner-bg-color-warning, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
}
.t-progress--status-warning .t-progress__circle-inner {
stroke: var(--td-warning-color, var(--td-warning-color-5, #e37318));
}
.t-progress--status-warning .t-progress__icon {
color: var(--td-warning-color, var(--td-warning-color-5, #e37318));
}
.t-progress--status-error .t-progress__inner {
background: var(--td-progress-inner-bg-color-error, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-progress--status-error .t-progress__circle-inner {
stroke: var(--td-error-color, var(--td-error-color-6, #d54941));
}
.t-progress--status-error .t-progress__icon {
color: var(--td-error-color, var(--td-error-color-6, #d54941));
}
@-webkit-keyframes progress-active-animation {
0% {
width: 0;
opacity: 0.1;
}
35% {
width: 50%;
opacity: 0.4;
}
100% {
width: 100%;
opacity: 0;
}
}
@keyframes progress-active-animation {
0% {
width: 0;
opacity: 0.1;
}
35% {
width: 50%;
opacity: 0.4;
}
100% {
width: 100%;
opacity: 0;
}
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-result {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-result__icon {
font-size: 80px;
}
.t-result__title {
font: var(--td-result-title-font, var(--td-font-title-extraLarge));
color: var(--td-result-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-result__thumb:not(:empty) + .t-result__title:not(:empty) {
margin-top: var(--td-result-title-margin-top, var(--td-spacer-1, 12px));
}
.t-result__description {
text-align: center;
color: var(--td-result-description-color, var(--td-text-color-secondary, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))));
font: var(--td-result-description-font, var(--td-font-body-medium));
}
.t-result__title + .t-result__description:not(:empty) {
margin-top: var(--td-result-description-margin-top, var(--td-spacer, 8px));
}
.t-result--theme-default {
color: var(--td-result-icon-default-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-result--theme-success {
color: var(--td-result-icon-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
}
.t-result--theme-warning {
color: var(--td-result-icon-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
}
.t-result--theme-error {
color: var(--td-result-icon-error-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-skeleton {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-skeleton__row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-bottom: var(--td-skeleton-row-spacing, var(--td-spacer-2, 16px));
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.t-skeleton__row:only-child,
.t-skeleton__row:last-child {
margin-bottom: 0;
}
.t-skeleton__col {
background-color: var(--td-skeleton-bg-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-skeleton__col:first-child:last-child,
.t-skeleton__col:last-child {
margin-right: 0;
}
.t-skeleton--type-text {
width: 100%;
height: var(--td-skeleton-text-height, 16px);
border-radius: var(--td-skeleton-text-border-radius, var(--td-radius-small, 3px));
}
.t-skeleton--type-rect {
width: 100%;
height: var(--td-skeleton-rect-height, 16px);
border-radius: var(--td-skeleton-rect-border-radius, var(--td-radius-default, 6px));
}
.t-skeleton--type-circle {
width: var(--td-skeleton-circle-height, 48px);
height: var(--td-skeleton-circle-height, 48px);
border-radius: var(--td-skeleton-circle-border-radius, var(--td-skeleton-circle-border-radius, var(--td-radius-circle, 50%)));
-ms-flex-negative: 0;
flex-shrink: 0;
}
.t-skeleton--animation-gradient {
position: relative;
overflow-x: hidden;
}
.t-skeleton--animation-gradient::after {
content: ' ';
position: absolute;
bottom: 0;
left: 0;
right: 0;
top: 0;
background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(var(--td-skeleton-animation-gradient, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))))), to(rgba(255, 255, 255, 0)));
background: linear-gradient(90deg, rgba(255, 255, 255, 0), var(--td-skeleton-animation-gradient, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4)))), rgba(255, 255, 255, 0));
-webkit-animation: t-skeleton--gradient 1.5s linear 0s infinite;
animation: t-skeleton--gradient 1.5s linear 0s infinite;
}
.t-skeleton--animation-flashed {
-webkit-animation: t-skeleton--flashed 2s linear 0s infinite;
animation: t-skeleton--flashed 2s linear 0s infinite;
}
@-webkit-keyframes t-skeleton--gradient {
0% {
-webkit-transform: translateX(-100%) skewX(-15deg);
transform: translateX(-100%) skewX(-15deg);
}
100% {
-webkit-transform: translateX(100%) skewX(-15deg);
transform: translateX(100%) skewX(-15deg);
}
}
@keyframes t-skeleton--gradient {
0% {
-webkit-transform: translateX(-100%) skewX(-15deg);
transform: translateX(-100%) skewX(-15deg);
}
100% {
-webkit-transform: translateX(100%) skewX(-15deg);
transform: translateX(100%) skewX(-15deg);
}
}
@-webkit-keyframes t-skeleton--flashed {
0% {
opacity: 1;
}
50% {
background-color: var(--td-skeleton-animation-flashed, rgba(230, 230, 230, 0.3));
opacity: 0.3;
}
100% {
opacity: 1;
}
}
@keyframes t-skeleton--flashed {
0% {
opacity: 1;
}
50% {
background-color: var(--td-skeleton-animation-flashed, rgba(230, 230, 230, 0.3));
opacity: 0.3;
}
100% {
opacity: 1;
}
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
/** 吸顶表头 Affix 组件,zIndex: 1000。宽度拖拽辅助线层级需高于表头 */
/** 吸顶表头 Affix 组件,zIndex: 1000。宽度拖拽辅助线层级需高于表头 */
@-moz-document url-prefix() {
.scrollbar {
scrollbar-color: rgba(0, 0, 0, 0.1) transparent;
scrollbar-width: thin;
}
}
.scrollbar::-webkit-scrollbar {
width: 6px;
height: 6px;
}
.scrollbar::-webkit-scrollbar-thumb {
border: 0px solid transparent;
background-clip: content-box;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 11px;
}
.scrollbar::-webkit-scrollbar-thumb:vertical:hover,
.scrollbar::-webkit-scrollbar-thumb:horizontal:hover {
background-color: rgba(0, 0, 0, 0.3);
}
.scrollbar.t-table__affixed-footer-elm::-webkit-scrollbar-track,
.scrollbar.t-table__scrollbar--obvious::-webkit-scrollbar-track {
background: #fff;
}
.t-table__affixed-footer-wrap > .scrollbar.t-table__affixed-footer-elm::-webkit-scrollbar-thumb,
.t-table--width-overflow.t-table--footer-affixed .t-table__content::-webkit-scrollbar-thumb,
.t-table--width-overflow.t-table--horizontal-bar-affixed .t-table__content::-webkit-scrollbar-thumb {
background: transparent;
}
.t-table.t-table--overflow-visible {
overflow: initial;
}
.t-table {
font: 14px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
padding: 0;
list-style: none;
width: 100%;
font-size: 14px;
color: var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
position: relative;
/** loading need to be top of fixed columns */
}
.t-table .t-loading--full {
z-index: 72;
}
.t-table.t-vertical-align-top th:not(.t-table__cell-check),
.t-table.t-vertical-align-top td:not(.t-table__cell-check) {
vertical-align: top;
}
.t-table.t-vertical-align-middle th:not(.t-table__cell-check),
.t-table.t-vertical-align-middle td:not(.t-table__cell-check) {
vertical-align: middle;
}
.t-table.t-vertical-align-bottom th:not(.t-table__cell-check),
.t-table.t-vertical-align-bottom td:not(.t-table__cell-check) {
vertical-align: bottom;
}
.t-table .t-table__resize-line {
display: none;
position: absolute;
left: 10px;
width: 0;
border-left: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
z-index: 1001;
}
.t-table__column-controller-trigger.t-align-top-right,
.t-table__column-controller-trigger.t-align-bottom-right {
text-align: right;
}
.t-table__column-controller-trigger {
padding: 16px 0;
}
.t-table__content {
position: relative;
}
@-moz-document url-prefix() {
.t-table__content {
scrollbar-color: rgba(0, 0, 0, 0.1) transparent;
scrollbar-width: thin;
}
}
.t-table__content::-webkit-scrollbar {
width: 6px;
height: 6px;
}
.t-table__content::-webkit-scrollbar-thumb {
border: 0px solid transparent;
background-clip: content-box;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 11px;
}
.t-table__content::-webkit-scrollbar-thumb:vertical:hover,
.t-table__content::-webkit-scrollbar-thumb:horizontal:hover {
background-color: rgba(0, 0, 0, 0.3);
}
@-moz-document url-prefix() {
.t-table__content {
scrollbar-color: rgba(0, 0, 0, 0.1) transparent;
scrollbar-width: thin;
}
}
.t-table__content::-webkit-scrollbar {
width: 6px;
height: 6px;
}
.t-table__content::-webkit-scrollbar-thumb {
border: 0px solid transparent;
background-clip: content-box;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 11px;
}
.t-table__content::-webkit-scrollbar-thumb:vertical:hover,
.t-table__content::-webkit-scrollbar-thumb:horizontal:hover {
background-color: rgba(0, 0, 0, 0.3);
}
.t-table__pagination {
padding: 16px 16px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-table .t-icon {
font-size: var(--td-font-size-l, 18px);
}
.t-table table {
width: 100%;
border-spacing: 0;
}
.t-table .t-text-ellipsis {
line-height: 22px;
white-space: nowrap;
word-wrap: normal;
overflow: hidden;
text-overflow: ellipsis;
}
.t-table th,
.t-table td {
position: relative;
padding: 8px 16px;
border-bottom: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
line-height: 22px;
font-weight: normal;
overflow-wrap: break-word;
background-color: inherit;
-webkit-box-sizing: border-box;
box-sizing: border-box;
text-align: left;
}
.t-table th.t-table__th-drag {
padding: 0;
height: 0;
text-align: center;
}
.t-table thead td,
.t-table th {
color: var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4)));
}
.t-table td[key='row-select'] {
padding: 13px 0 11px 16px;
}
.t-table td.t-align-left,
.t-table th.t-align-left {
text-align: left;
}
.t-table td.t-align-right,
.t-table th.t-align-right {
text-align: right;
}
.t-table td.t-align-center,
.t-table th.t-align-center {
text-align: center;
}
.t-table tr {
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
}
.t-table.t-size-s th,
.t-table.t-size-s td {
padding: 8px 8px;
}
.t-table.t-size-l th,
.t-table.t-size-l td {
padding: 16px 20px;
}
.t-table .t-table__expanded-row > td,
.t-table .t-table__row--full > td {
padding: 0;
}
.t-table .t-table__expandable-icon-cell,
.t-table .t-table__selection-cell {
padding: 0;
height: 0;
}
.t-table td.t-table__handle-draggable {
text-align: center;
height: 0;
padding: 0;
}
.t-table .t-table__cell--selectable > .t-checkbox {
vertical-align: middle;
}
.t-table .t-table__cell--selectable + td,
.t-table .t-table__cell--selectable + th {
padding-left: 0;
}
.t-table--bordered td,
.t-table--bordered th {
border-left: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table--bordered td.t-table__cell--fixed-left-last::before,
.t-table--bordered th.t-table__cell--fixed-left-last::before {
border-right: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table--bordered th:first-child,
.t-table--bordered td.t-table__td-first-col {
border-left-width: 0;
}
.t-table--bordered:not(.t-table--rowspan-colspan) td:first-child {
border-left-width: 0;
}
.t-table--bordered .t-table__content {
border-left: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table--bordered .t-table__content::-webkit-scrollbar-corner {
background-color: transparent;
}
.t-table--bordered .t-table__content {
border: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
border-radius: 0;
}
.t-table--bordered .t-table--loading {
border-bottom: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table--bordered .t-table__pagination {
padding: 16px 16px;
}
.t-table--bordered .t-table__bottom-content + .t-table__pagination {
padding: 0;
}
.t-table--bordered.t-table__header--fixed .t-table__content {
border-bottom: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table--bordered .t-table__td-last-row {
border-bottom: none;
}
.t-table--striped:not(.t-table--bordered) th,
.t-table--striped:not(.t-table--bordered) td {
border-bottom: none;
}
.t-table--striped.t-table--header-fixed > .t-table__content > table > tbody tr:nth-of-type(even) {
background-color: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
}
.t-table--striped:not(.t-table--header-fixed) > .t-table__content > table > tbody > tr:nth-of-type(odd):not(.t-table__expanded-row) {
background-color: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
}
.t-table--striped.t-table--hoverable.t-table__header--fixed tbody tr:nth-of-type(even):hover {
background-color: #383838;
}
.t-table--striped.t-table--hoverable:not(.t-table__header--fixed) > .t-table__content > table > tbody tr:nth-of-type(odd):hover {
background-color: #383838;
}
.t-table--striped.t-table--hoverable > .t-table__content > table > tbody tr {
-webkit-transition: background-color var(--td-anim-duration-base, 0.2s) linear;
transition: background-color var(--td-anim-duration-base, 0.2s) linear;
}
.t-table--striped.t-table--hoverable > .t-table__content > table > tbody tr:hover {
background-color: #f3f3f3;
}
.t-table--hoverable tbody tr {
-webkit-transition: background-color var(--td-anim-duration-base, 0.2s) linear;
transition: background-color var(--td-anim-duration-base, 0.2s) linear;
}
.t-table--hoverable tbody tr:hover {
background-color: #f3f3f3;
}
.t-table.t-table--align-top tbody td {
vertical-align: top;
}
.t-table .t-table__cell--highlight {
background-color: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
}
.t-table__header--fixed table {
table-layout: fixed;
}
.t-table__header--fixed th,
.t-table__header--fixed td {
overflow-wrap: break-word;
}
.t-table__header--fixed.t-table__header,
.t-table__header--fixed .t-table__header {
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
position: relative;
z-index: 5;
}
@-moz-document url-prefix() {
.t-table__header--fixed .t-table__header {
scrollbar-color: rgba(0, 0, 0, 0.1) transparent;
scrollbar-width: thin;
}
}
.t-table__header--fixed .t-table__header::-webkit-scrollbar {
width: 6px;
height: 6px;
}
.t-table__header--fixed .t-table__header::-webkit-scrollbar-thumb {
border: 0px solid transparent;
background-clip: content-box;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 11px;
}
.t-table__header--fixed .t-table__header::-webkit-scrollbar-thumb:vertical:hover,
.t-table__header--fixed .t-table__header::-webkit-scrollbar-thumb:horizontal:hover {
background-color: rgba(0, 0, 0, 0.3);
}
@-moz-document url-prefix() {
.t-table__header--fixed .t-table__header {
scrollbar-color: rgba(0, 0, 0, 0.1) transparent;
scrollbar-width: thin;
}
}
.t-table__header--fixed .t-table__header::-webkit-scrollbar {
width: 6px;
height: 6px;
}
.t-table__header--fixed .t-table__header::-webkit-scrollbar-thumb {
border: 0px solid transparent;
background-clip: content-box;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 11px;
}
.t-table__header--fixed .t-table__header::-webkit-scrollbar-thumb:vertical:hover,
.t-table__header--fixed .t-table__header::-webkit-scrollbar-thumb:horizontal:hover {
background-color: rgba(0, 0, 0, 0.3);
}
.t-table__header--fixed .t-table__body {
overflow-y: auto;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
}
@-moz-document url-prefix() {
.t-table__header--fixed .t-table__body {
scrollbar-color: rgba(0, 0, 0, 0.1) transparent;
scrollbar-width: thin;
}
}
.t-table__header--fixed .t-table__body::-webkit-scrollbar {
width: 6px;
height: 6px;
}
.t-table__header--fixed .t-table__body::-webkit-scrollbar-thumb {
border: 0px solid transparent;
background-clip: content-box;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 11px;
}
.t-table__header--fixed .t-table__body::-webkit-scrollbar-thumb:vertical:hover,
.t-table__header--fixed .t-table__body::-webkit-scrollbar-thumb:horizontal:hover {
background-color: rgba(0, 0, 0, 0.3);
}
@-moz-document url-prefix() {
.t-table__header--fixed .t-table__body {
scrollbar-color: rgba(0, 0, 0, 0.1) transparent;
scrollbar-width: thin;
}
}
.t-table__header--fixed .t-table__body::-webkit-scrollbar {
width: 6px;
height: 6px;
}
.t-table__header--fixed .t-table__body::-webkit-scrollbar-thumb {
border: 0px solid transparent;
background-clip: content-box;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 11px;
}
.t-table__header--fixed .t-table__body::-webkit-scrollbar-thumb:vertical:hover,
.t-table__header--fixed .t-table__body::-webkit-scrollbar-thumb:horizontal:hover {
background-color: rgba(0, 0, 0, 0.3);
}
.t-table:not(.t-table--bordered) .t-table__cell--selectable + td,
.t-table:not(.t-table--bordered) .t-table__cell--selectable + th {
padding-left: 0;
}
.t-table__cell--fixed.t-table__header--fixed .t-table__header {
overflow: hidden;
width: 100%;
}
.t-table__cell--fixed.t-table__header--fixed .t-table__header .t-table__cell--fixed-left:last-child::after,
.t-table__cell--fixed.t-table__header--fixed .t-table__header .t-table__cell--fixed-right:last-child::after {
content: '';
position: absolute;
right: -6px;
width: 6px;
height: 100%;
top: 0;
background-color: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
}
.t-table__cell--fixed.t-table__header--fixed .t-table__body {
overflow: auto scroll;
}
.t-table__cell--fixed .t-table__content {
overflow: auto hidden;
}
.t-table__cell--fixed table {
table-layout: fixed;
min-width: 100%;
}
.t-table__cell--fixed th,
.t-table__cell--fixed td {
position: relative;
}
.t-table__cell--fixed .t-table__cell--fixed-left-last::before {
z-index: -1;
background-color: inherit;
}
.t-table__cell--fixed .t-table__cell--fixed-left-last::after {
position: absolute;
top: 0;
bottom: 0;
content: '';
-webkit-transition: -webkit-box-shadow 0.3s;
transition: -webkit-box-shadow 0.3s;
transition: box-shadow 0.3s;
transition: box-shadow 0.3s, -webkit-box-shadow 0.3s;
pointer-events: none;
z-index: -2;
}
.t-table__cell--fixed .t-table__cell--fixed-left-last::after {
right: 0;
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
.t-table__cell--fixed .t-table__cell--fixed-right-first::before {
z-index: -1;
background-color: inherit;
}
.t-table__cell--fixed .t-table__cell--fixed-right-first::after {
position: absolute;
top: 0;
bottom: 0;
content: '';
-webkit-transition: -webkit-box-shadow 0.3s;
transition: -webkit-box-shadow 0.3s;
transition: box-shadow 0.3s;
transition: box-shadow 0.3s, -webkit-box-shadow 0.3s;
pointer-events: none;
z-index: -2;
}
.t-table__cell--fixed .t-table__cell--fixed-right-first::after {
left: 0;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
.t-table .t-table__cell-resizable {
position: relative;
}
.t-table .t-table__cell-resizable .t-table__cell--resizer {
position: absolute;
top: 0;
right: -5px;
bottom: 0;
z-index: 10;
width: 10px;
cursor: col-resize;
}
.t-table .t-table__row--disabled {
color: var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26)));
}
.t-table .t-table__cell--title {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-table__column-controller-desc {
margin-bottom: 24px;
}
.t-table__column-controller-block {
padding: 15px 16px;
border: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
border-bottom: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table__column-controller-block + .t-table__column-controller-block {
border-top: 0;
padding: 16px 16px;
border-bottom: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table__column-controller--fixed .t-checkbox {
width: 108px;
}
.t-table--bordered .t-table__cell--sortable .t-table__cell--title,
.t-table--bordered .t-table__cell--filterable .t-table__cell--title {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.t-table th.t-align-right .t-table__cell--title {
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
/**
* 有边框和无边框的图标排列不一样,需谨慎修改
* 无边框模式,图标依次紧跟标题
* 有边框模式,只有一个图标时,图标靠近边框右侧;有两个图标时,排序图标靠近标题,过滤图标靠近边框右侧
*/
.t-table__cell--sort-trigger {
text-align: center;
vertical-align: text-bottom;
}
.t-table__cell--sort-trigger svg {
vertical-align: initial;
}
.t-table--loading {
position: relative;
}
.t-table--loading-progressbar {
overflow: hidden;
position: absolute;
top: 0;
left: 0;
height: 1px;
background-color: var(--td-brand-color, var(--td-brand-color-7, #0052d9));
-webkit-animation: tTableProgressbar 2s ease-in-out;
animation: tTableProgressbar 2s ease-in-out;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.t-table--loading-message {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
min-height: 120px;
color: var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4)));
}
.t-table__expanded-cell {
padding-left: 45px;
}
.t-table__async-loading {
text-align: center;
}
.t-table__async-loading.t-is-load-more {
cursor: pointer;
}
.t-table__empty {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
min-height: 120px;
color: var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26)));
}
.t-table__filter-icon,
.t-table__sort-icon {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: transparent;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
cursor: pointer;
vertical-align: text-bottom;
-webkit-transition: var(--td-anim-duration-base, 0.2s) linear;
transition: var(--td-anim-duration-base, 0.2s) linear;
}
.t-table__filter-icon > svg,
.t-table__sort-icon > svg {
margin-top: 0;
}
.t-table__sort-icon .t-is-focus,
.t-table__sort-icon.t-is-focus,
.t-table__sort-icon:hover {
color: var(--td-brand-color, var(--td-brand-color-7, #0052d9));
border-radius: 50%;
-webkit-transition: var(--td-anim-duration-base, 0.2s) linear;
transition: var(--td-anim-duration-base, 0.2s) linear;
}
.t-table__filter-icon .t-is-focus,
.t-table__filter-icon.t-is-focus,
.t-table__filter-icon:hover {
color: var(--td-brand-color, var(--td-brand-color-7, #0052d9));
-webkit-transition: var(--td-anim-duration-base, 0.2s) linear;
transition: var(--td-anim-duration-base, 0.2s) linear;
}
.t-table__filter-pop .t-popup__content {
padding: 0;
}
.t-table__filter-pop .t-table__filter-pop-content .t-table__filter-pop-content-inner {
padding: 16px 16px;
}
.t-table__filter-pop .t-table__filter-pop-content .t-radio-group {
display: block;
height: auto;
}
.t-table__filter-pop .t-table__filter-pop-content .t-checkbox-group {
display: block;
}
.t-table__filter-pop .t-table__filter-pop-content .t-checkbox,
.t-table__filter-pop .t-table__filter-pop-content .t-radio {
display: block;
margin: 4px 0;
}
.t-table__filter-pop .t-table__filter-pop-content .t-table__filter-pop-content-button {
border-top: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
padding: 16px 16px;
}
.t-table__filter-pop .t-table__filter-pop-content .t-table__filter-pop-content-button .t-button + .t-button {
margin-left: 16px;
}
.t-table__filter-pop-content-inner > .t-input__wrap {
width: 200px;
}
.t-table__filter-pop-content-inner > .t-date-range-picker__panel {
margin: calc(0px - 16px);
}
.t-table__sort-icon--active {
color: var(--td-brand-color, var(--td-brand-color-7, #0052d9));
-webkit-transition: var(--td-anim-duration-base, 0.2s) linear;
transition: var(--td-anim-duration-base, 0.2s) linear;
}
.t-table__double-icons {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-table__double-icons .t-table__sort-icon {
position: relative;
}
.t-table__double-icons .t-table-sort-asc {
top: 2px;
}
.t-table__double-icons .t-table-sort-desc {
bottom: 2px;
}
.t-table__filter-icon-wrap {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
pointer-events: all;
height: var(--td-font-size-l, 18px);
width: var(--td-font-size-l, 18px);
margin-left: 8px;
}
.t-table--bordered .t-table__filter-icon-wrap {
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.t-table--bordered .t-table__cell--sortable.t-table__cell--filterable .t-table__filter-icon-wrap {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.t-table .t-align-center .t-table__cell--sortable,
.t-table .t-align-center .t-table__cell--filterable {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
}
.t-table__expand-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 100%;
height: 100%;
color: var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4)));
cursor: pointer;
-webkit-transition: all var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-easing, cubic-bezier(0.38, 0, 0.24, 1)) 0s;
transition: all var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-easing, cubic-bezier(0.38, 0, 0.24, 1)) 0s;
}
.t-table__expand-box:hover {
color: var(--td-brand-color, var(--td-brand-color-7, #0052d9));
-webkit-transition: var(--td-anim-duration-base, 0.2s) linear;
transition: var(--td-anim-duration-base, 0.2s) linear;
}
@-webkit-keyframes tTableProgressbar {
0% {
width: 0;
}
100% {
width: 100%;
}
}
@keyframes tTableProgressbar {
0% {
width: 0;
}
100% {
width: 100%;
}
}
.t-table__th-row-select .t-table__th-cell-inner {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-table-expandable-icon-cell + .t-table__cell--selectable[key='row-select'] {
padding-left: 8px;
}
.t-table__filter--bottom-buttons {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
padding: 16px 16px;
border-top: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table__filter--bottom-buttons > .t-button + .t-button {
margin-left: 8px;
}
.t-table__row-filter-inner {
position: -webkit-sticky;
position: sticky;
left: 0;
text-align: center;
}
.t-table__filter-result {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-table__filter-result > .t-button {
margin-left: 8px;
}
.t-table--layout-fixed {
table-layout: fixed;
}
.t-table--layout-auto {
table-layout: auto;
}
.t-table__ellipsis {
white-space: nowrap;
width: 100%;
}
.t-table__content {
overflow: auto;
}
.t-table__content--scrollable-to-left .t-table__cell--fixed-left-last::after {
border-right: 2px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table__content--scrollable-to-right .t-table__cell--fixed-right-first::after {
border-left: 2px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table--bordered.t-table__content--scrollable-to-left .t-table__cell--fixed-left-last::after {
border-right: 4px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table--bordered.t-table__content--scrollable-to-right .t-table__cell--fixed-right-first::after {
border-left: 4px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table__scroll-bar-divider {
position: absolute;
bottom: 0;
right: 0;
height: 100%;
border-right: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
z-index: 71;
}
.t-table__footer,
.t-table__header.t-table__header--fixed {
position: -webkit-sticky;
position: sticky;
z-index: 50;
}
.t-table:not(.t-table--striped) .t-table__footer > tr {
background-color: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
}
.t-table__header--fixed:not(.t-table__header--multiple) > tr > th {
background-color: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
}
.t-table__row--fixed-top,
.t-table__row--fixed-bottom {
position: -webkit-sticky;
position: sticky;
z-index: 70;
}
.t-table__row--fixed-bottom-first > td {
border-top: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table--bordered .t-table__content .t-table__row--without-border-bottom > td {
border-bottom: 0;
}
.t-table--bordered tbody > tr:last-child > td,
.t-table--bordered tfoot > tr:last-child > td {
border-bottom: 0;
}
.t-table--bordered tfoot > tr:first-child > td {
border-top: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table__header.t-table__header--fixed {
top: 0;
}
.t-table__footer.t-table__footer--fixed {
bottom: 0;
}
.t-table--column-fixed .t-table__cell--fixed-left-last::before {
z-index: -1;
background-color: inherit;
}
.t-table--column-fixed .t-table__cell--fixed-left-last::after {
position: absolute;
top: 0;
bottom: 0;
content: '';
-webkit-transition: -webkit-box-shadow 0.3s;
transition: -webkit-box-shadow 0.3s;
transition: box-shadow 0.3s;
transition: box-shadow 0.3s, -webkit-box-shadow 0.3s;
pointer-events: none;
z-index: -2;
}
.t-table--column-fixed .t-table__cell--fixed-left-last::after {
right: 0;
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
.t-table--column-fixed .t-table__cell--fixed-right-first::before {
z-index: -1;
background-color: inherit;
}
.t-table--column-fixed .t-table__cell--fixed-right-first::after {
position: absolute;
top: 0;
bottom: 0;
content: '';
-webkit-transition: -webkit-box-shadow 0.3s;
transition: -webkit-box-shadow 0.3s;
transition: box-shadow 0.3s;
transition: box-shadow 0.3s, -webkit-box-shadow 0.3s;
pointer-events: none;
z-index: -2;
}
.t-table--column-fixed .t-table__cell--fixed-right-first::after {
left: 0;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
.t-table--column-fixed .t-table__cell--fixed-left,
.t-table--column-fixed .t-table__cell--fixed-right {
position: -webkit-sticky;
position: sticky;
}
.t-table--column-fixed .t-table__cell--fixed-left {
z-index: 30;
}
.t-table--column-fixed .t-table__cell--fixed-right {
z-index: 31;
}
.t-table__empty-row > td {
padding: 0;
border: 0;
}
.t-table:not(.t-table--bordered) .t-table__header.t-table--bordered > tr:first-child > th {
border-top: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table--multiple-header .t-table__header th.t-table__header-th--bordered {
border-left-width: 1px;
}
.t-table__header.t-table__header--multiple > tr {
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
}
.t-table__tree-op-icon {
margin-right: 8px;
cursor: pointer;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
vertical-align: -3px;
}
.t-table__tree-op-icon:hover {
color: var(--td-brand-color, var(--td-brand-color-7, #0052d9));
-webkit-transition: var(--td-anim-duration-base, 0.2s) linear;
transition: var(--td-anim-duration-base, 0.2s) linear;
}
.t-table__tree-leaf-node .t-table__tree-op-icon {
min-width: 0;
margin-right: 2px;
}
.t-table__virtual-scroll-cursor {
position: absolute;
width: 1px;
height: 1px;
-webkit-transition: -webkit-transform var(--td-anim-duration-base, 0.2s);
transition: -webkit-transform var(--td-anim-duration-base, 0.2s);
transition: transform var(--td-anim-duration-base, 0.2s);
transition: transform var(--td-anim-duration-base, 0.2s), -webkit-transform var(--td-anim-duration-base, 0.2s);
}
.t-table__virtual-scroll-header {
position: absolute;
z-index: 51;
left: 0;
}
/** 用于隐藏表头滚动条 */
.t-table__affixed-header-elm-wrap {
overflow: hidden;
}
.t-table__affixed-header-elm-wrap,
.t-table__affixed-header-elm {
position: absolute;
left: 0;
z-index: 51;
}
.t-table__affixed-header-elm {
overflow: auto;
-webkit-transition: opacity var(--td-anim-duration-base, 0.2s) linear;
transition: opacity var(--td-anim-duration-base, 0.2s) linear;
opacity: 1;
}
.t-table__affixed-footer-elm {
overflow: auto;
z-index: 50;
}
.t-table--bordered .t-table__affixed-header-elm {
border: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
border-bottom: 0;
border-right: 0;
}
.t-table--bordered .t-table__affixed-footer-elm {
border-left: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
border-bottom: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table--multiple-header.t-table--bordered .t-table__affixed-header-elm {
border-right: 0;
}
.t-is-hidden {
display: none;
}
.t-positive-rotate-90 {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.t-negative-rotate-180 {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
/** @{prefix}-table__row--full 和 @{prefix}-table__row-full-element 同时存在,是为了保证 固定列时,当前行不随内容进行横向滚动 */
.t-table__row-full-element {
padding: 8px 16px;
}
.t-table__row-full-inner {
position: -webkit-sticky;
position: sticky;
left: 0;
}
.t-table__row-full-inner:not(.t-table__empty) {
display: inline-block;
}
.t-table__tree-col {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-table__tree-col--inline {
display: inline;
}
.t-table--full-height {
height: 100%;
}
/** 默认最小高度限制为 Empty 高度加表头高度 */
.t-table--loading .t-table__content {
min-height: 158px;
}
.t-table__handle-draggable:hover,
.t-table--row-draggable tr,
.t-table__th--drag-sort {
cursor: move;
}
.t-table__ele--draggable-chosen {
-webkit-box-shadow: var(--td-shadow-1, 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.12));
box-shadow: var(--td-shadow-1, 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.12));
}
.t-table:not(.t-table--row-edit) .t-table__cell--editable {
min-height: 22px;
line-height: 22px;
cursor: pointer;
}
.t-table:not(.t-table--row-edit) .t-table__cell--editable .t-icon {
margin-left: 8px;
font-size: var(--td-font-size-l, 18px);
-webkit-transition: var(--td-anim-duration-base, 0.2s) linear;
transition: var(--td-anim-duration-base, 0.2s) linear;
}
.t-table:not(.t-table--row-edit) .t-table__cell--editable:hover {
-webkit-transition: var(--td-anim-duration-base, 0.2s) linear;
transition: var(--td-anim-duration-base, 0.2s) linear;
}
/** 吸底的分页器,需要背景色,避免表格文本内容显示穿透 */
.t-affix .t-table__pagination {
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
}
.t-table--bordered .t-affix .t-table__pagination {
border-top: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table__bottom-content + .t-table__pagination-wrap .t-table__pagination {
border: 0;
padding: 0;
}
.t-table--column-resizable:not(.t-table--bordered) {
/** 表格左边有冻结列滚动时,去掉hover表头时多出的一个像素,避免出现表头的冻结列跟表内容的冻结列没有对齐的问题 */
}
.t-table--column-resizable:not(.t-table--bordered) th {
border-top: 1px solid transparent;
}
.t-table--column-resizable:not(.t-table--bordered) thead.t-table__header:hover th:not(:last-child) {
border-right: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table--column-resizable:not(.t-table--bordered) thead.t-table__header:hover th {
border-top: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-table--column-resizable:not(.t-table--bordered).t-table__content--scrollable-to-left.t-table__content--scrollable-to-right thead.t-table__header:hover .t-table__cell--fixed-left-last:not(:last-child),
.t-table--column-resizable:not(.t-table--bordered).t-table__content--scrollable-to-left thead.t-table__header:hover .t-table__cell--fixed-left-last:not(:last-child) {
border-right: 0;
}
/** 可选中行的场景下,将 Checkbox 和 Radio 铺满整个单元格,增大点击范围,方便用户选中 */
.t-table td.t-table__cell-check,
.t-table th.t-table__cell-check {
padding: 0;
/** HTML 特性: th/td 必须设置为 0,他们的子元素才能设置为 100% */
height: 0;
}
.t-table td.t-table__cell-check .t-radio__label:empty,
.t-table th.t-table__cell-check .t-radio__label:empty,
.t-table td.t-table__cell-check .t-checkbox__label:empty,
.t-table th.t-table__cell-check .t-checkbox__label:empty {
display: none;
}
.t-table .t-table__cell-check .t-radio,
.t-table .t-table__cell-check .t-checkbox,
.t-table .t-table__cell-check .t-table__th-cell-inner {
width: 100%;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-table td .t-input__tips {
position: initial;
}
.t-table .t-table__sort-column {
background-color: var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3));
}
.t-table__ellipsis-content.t-size-s .t-popup__content {
font-size: 14px;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-tag {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border: 1px solid transparent;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-radius: var(--td-tag-square-border-radius, 4px);
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
vertical-align: middle;
}
.t-tag__text {
word-wrap: normal;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.t-tag__icon,
.t-tag__icon-close {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-tag__icon-close {
color: var(--td-tag-close-icon-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-tag__icon:not(:empty) + .t-tag__text:not(:empty),
.t-tag__text:not(:empty) + .t-tag__icon-close:not(:empty) {
margin-left: 4px;
}
.t-tag.t-tag--small {
padding: var(--td-tag-small-padding, 1px 5px);
font: var(--td-tag-small-font, var(--td-font-body-extraSmall));
}
.t-tag.t-tag--small .t-icon,
.t-tag.t-tag--small .t-icon-close {
font-size: var(--td-tag-small-icon-size, 12px);
}
.t-tag.t-tag--small .t-tag__icon:not(:empty) + .t-tag__text:not(:empty),
.t-tag.t-tag--small .t-tag__text:not(:empty) + .t-tag__icon-close:not(:empty) {
margin-left: 2px;
}
.t-tag.t-tag--medium {
padding: var(--td-tag-medium-padding, 1px 7px);
font: var(--td-tag-medium-font, var(--td-font-body-small));
}
.t-tag.t-tag--medium .t-icon,
.t-tag.t-tag--medium .t-icon-close {
font-size: var(--td-tag-medium-icon-size, 14px);
}
.t-tag.t-tag--large {
padding: var(--td-tag-large-padding, 2px 7px);
font: var(--td-tag-large-font, var(--td-font-body-medium));
}
.t-tag.t-tag--large .t-icon,
.t-tag.t-tag--large .t-icon-close {
font-size: var(--td-tag-large-icon-size, 16px);
}
.t-tag.t-tag--extra-large {
padding: var(--td-tag-extra-large-padding, 8px 15px);
font: var(--td-tag-extra-large-font, var(--td-font-body-medium));
}
.t-tag.t-tag--extra-large .t-icon,
.t-tag.t-tag--extra-large .t-icon-close {
font-size: var(--td-tag-extra-large-icon-size, 16px);
}
.t-tag.t-tag--square {
border-radius: var(--td-tag-square-border-radius, 4px);
}
.t-tag.t-tag--round {
border-radius: var(--td-tag-round-border-radius, 999px);
}
.t-tag.t-tag--mark {
border-radius: 0 var(--td-tag-mark-border-radius, var(--td-tag-round-border-radius, 999px)) var(--td-tag-mark-border-radius, var(--td-tag-round-border-radius, 999px)) 0;
}
.t-tag--dark.t-tag--default {
color: var(--td-font-white-1, #ffffff);
border-color: var(--td-tag-default-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
background-color: var(--td-tag-default-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
}
.t-tag--dark.t-tag--primary {
color: var(--td-font-white-1, #ffffff);
border-color: var(--td-tag-primary-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
background-color: var(--td-tag-primary-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-tag--dark.t-tag--success {
color: var(--td-font-white-1, #ffffff);
border-color: var(--td-tag-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
background-color: var(--td-tag-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
}
.t-tag--dark.t-tag--warning {
color: var(--td-font-white-1, #ffffff);
border-color: var(--td-tag-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
background-color: var(--td-tag-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
}
.t-tag--dark.t-tag--danger {
color: var(--td-font-white-1, #ffffff);
border-color: var(--td-tag-danger-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
background-color: var(--td-tag-danger-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-tag--dark.t-tag--default {
color: var(--td-tag-default-font-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-tag--outline.t-tag--default {
color: var(--td-tag-default-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
border-color: var(--td-tag-default-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
background-color: var(--td-tag-default-light-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-tag--outline.t-tag--primary {
color: var(--td-tag-primary-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
border-color: var(--td-tag-primary-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
background-color: var(--td-tag-primary-light-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-tag--outline.t-tag--success {
color: var(--td-tag-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
border-color: var(--td-tag-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
background-color: var(--td-tag-success-light-color, var(--td-success-color-1, #e3f9e9));
}
.t-tag--outline.t-tag--warning {
color: var(--td-tag-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
border-color: var(--td-tag-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
background-color: var(--td-tag-warning-light-color, var(--td-warning-color-1, #fff1e9));
}
.t-tag--outline.t-tag--danger {
color: var(--td-tag-danger-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
border-color: var(--td-tag-danger-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
background-color: var(--td-tag-danger-light-color, var(--td-error-color-1, #fff0ed));
}
.t-tag--outline.t-tag--default {
color: var(--td-tag-default-font-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-tag--outline.t-tag--default {
background-color: var(--td-tag-outline-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-tag--outline.t-tag--primary {
background-color: var(--td-tag-outline-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-tag--outline.t-tag--success {
background-color: var(--td-tag-outline-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-tag--outline.t-tag--warning {
background-color: var(--td-tag-outline-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-tag--outline.t-tag--danger {
background-color: var(--td-tag-outline-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
}
.t-tag--light.t-tag--default {
color: var(--td-tag-default-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
border-color: var(--td-tag-default-light-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
background-color: var(--td-tag-default-light-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-tag--light.t-tag--primary {
color: var(--td-tag-primary-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
border-color: var(--td-tag-primary-light-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
background-color: var(--td-tag-primary-light-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-tag--light.t-tag--success {
color: var(--td-tag-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
border-color: var(--td-tag-success-light-color, var(--td-success-color-1, #e3f9e9));
background-color: var(--td-tag-success-light-color, var(--td-success-color-1, #e3f9e9));
}
.t-tag--light.t-tag--warning {
color: var(--td-tag-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
border-color: var(--td-tag-warning-light-color, var(--td-warning-color-1, #fff1e9));
background-color: var(--td-tag-warning-light-color, var(--td-warning-color-1, #fff1e9));
}
.t-tag--light.t-tag--danger {
color: var(--td-tag-danger-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
border-color: var(--td-tag-danger-light-color, var(--td-error-color-1, #fff0ed));
background-color: var(--td-tag-danger-light-color, var(--td-error-color-1, #fff0ed));
}
.t-tag--light.t-tag--default {
color: var(--td-tag-default-font-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-tag--light-outline.t-tag--default {
color: var(--td-tag-default-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
border-color: var(--td-tag-default-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
background-color: var(--td-tag-default-light-color, var(--td-bg-color-secondarycontainer, var(--td-gray-color-1, #f3f3f3)));
}
.t-tag--light-outline.t-tag--primary {
color: var(--td-tag-primary-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
border-color: var(--td-tag-primary-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
background-color: var(--td-tag-primary-light-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-tag--light-outline.t-tag--success {
color: var(--td-tag-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
border-color: var(--td-tag-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
background-color: var(--td-tag-success-light-color, var(--td-success-color-1, #e3f9e9));
}
.t-tag--light-outline.t-tag--warning {
color: var(--td-tag-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
border-color: var(--td-tag-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
background-color: var(--td-tag-warning-light-color, var(--td-warning-color-1, #fff1e9));
}
.t-tag--light-outline.t-tag--danger {
color: var(--td-tag-danger-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
border-color: var(--td-tag-danger-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
background-color: var(--td-tag-danger-light-color, var(--td-error-color-1, #fff0ed));
}
.t-tag--light-outline.t-tag--default {
color: var(--td-tag-default-font-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
border-color: var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-tag--disabled.t-tag--default {
cursor: not-allowed;
}
.t-tag--disabled.t-tag--default.t-tag--dark,
.t-tag--disabled.t-tag--default.t-tag--light,
.t-tag--disabled.t-tag--default.t-tag--light-outline,
.t-tag--disabled.t-tag--default.t-tag--outline {
color: var(--td-tag-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-tag--disabled.t-tag--default.t-tag--dark,
.t-tag--disabled.t-tag--default.t-tag--light,
.t-tag--disabled.t-tag--default.t-tag--light-outline {
background-color: var(--td-tag-disabled-background-color, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
}
.t-tag--disabled.t-tag--default.t-tag--light-outline,
.t-tag--disabled.t-tag--default.t-tag--outline {
border-color: var(--td-tag-disabled-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
}
.t-tag--checked.t-tag--disabled.t-tag--primary {
cursor: not-allowed;
}
.t-tag--checked.t-tag--disabled.t-tag--primary.t-tag--light,
.t-tag--checked.t-tag--disabled.t-tag--primary.t-tag--light-outline,
.t-tag--checked.t-tag--disabled.t-tag--primary.t-tag--outline {
color: var(--td-tag-checked-disabled-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-tag--checked.t-tag--disabled.t-tag--primary.t-tag--dark {
color: var(--td-tag-checked-dark-disabled-color, var(--td-font-white-2, rgba(255, 255, 255, 0.55)));
background-color: var(--td-tag-checked-disabled-background-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-tag--checked.t-tag--disabled.t-tag--primary.t-tag--light,
.t-tag--checked.t-tag--disabled.t-tag--primary.t-tag--light-outline {
background-color: var(--td-tag-checked-light-disabled-background-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-tag--checked.t-tag--disabled.t-tag--primary.t-tag--dark,
.t-tag--checked.t-tag--disabled.t-tag--primary.t-tag--light-outline,
.t-tag--checked.t-tag--disabled.t-tag--primary.t-tag--outline {
border-color: var(--td-tag-checked-disabled-border-color, var(--td-brand-color-disabled, var(--td-brand-color-3, #b5c7ff)));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-qrcode {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
padding: 12px;
border-radius: 6px;
border: 1px solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-qrcode > canvas {
-ms-flex-item-align: stretch;
align-self: stretch;
min-width: 0;
-webkit-box-flex: 1;
-ms-flex: auto;
flex: auto;
}
.t-qrcode.t-borderless {
border-color: transparent;
}
.t-qrcode .t-mask {
position: absolute;
inset-block-start: 0;
inset-inline-start: 0;
z-index: 300;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 100%;
height: 100%;
color: var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
background-color: var(--td-mask-background, rgba(255, 255, 255, 0.96));
text-align: center;
border-radius: 6px;
font: var(--td-font-body-medium);
}
.t-qrcode .t-expired__text {
color: var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
font-weight: 600;
}
.t-qrcode .t-expired__button {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
color: var(--td-brand-color, var(--td-brand-color-7, #0052d9));
-webkit-box-shadow: none;
box-shadow: none;
cursor: pointer;
-webkit-column-gap: 8px;
-moz-column-gap: 8px;
column-gap: 8px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 32px;
-webkit-transition: all 0.2s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: all 0.2s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.t-qrcode .t-expired__button:hover {
color: var(--td-brand-color-active, var(--td-brand-color-8, #003cab));
}
.t-qrcode .t-scanned {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 8px;
-moz-column-gap: 8px;
column-gap: 8px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-qrcode .t-scanned__icon {
color: var(--td-success-color, var(--td-success-color-5, #2ba471));
}
.t-qrcode-svg {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-action-sheet__content {
color: var(--td-action-sheet-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
border-top-left-radius: var(--td-action-sheet-border-radius, var(--td-radius-extraLarge, 12px));
border-top-right-radius: var(--td-action-sheet-border-radius, var(--td-radius-extraLarge, 12px));
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
overflow: hidden;
}
.t-action-sheet__content:focus {
outline: 0;
}
.t-action-sheet--grid.t-action-sheet--no-description {
padding-top: var(--td-spacer, 8px);
}
.t-action-sheet--grid .t-action-sheet__description::after {
display: none;
}
.t-action-sheet--left .t-action-sheet__description {
text-align: left;
}
.t-action-sheet--left .t-button__content {
width: 100%;
}
.t-action-sheet--left .t-action-sheet__list-item-content,
.t-action-sheet--left .t-action-sheet__list-item-desc {
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: start;
}
.t-action-sheet--left .t-action-sheet__list-item-icon--suffix {
margin-left: auto;
}
.t-action-sheet__grid {
padding-bottom: 8px;
}
.t-action-sheet__grid--swiper {
padding-bottom: 0;
}
.t-action-sheet__description {
color: var(--td-action-sheet-description-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font: var(--td-action-sheet-description-font, var(--td-font-body-medium));
text-align: center;
padding: var(--td-spacer-1, 12px) var(--td-spacer-2, 16px);
position: relative;
}
.t-action-sheet__description::after {
content: '';
display: block;
position: absolute;
top: unset;
bottom: 0;
left: unset;
right: unset;
background-color: var(--td-action-sheet-border-color, var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7)));
}
.t-action-sheet__description::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-action-sheet__list-item {
border: none;
height: auto;
padding: var(--td-spacer-2, 16px);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-action-sheet__list-item:not(:last-child) {
position: relative;
}
.t-action-sheet__list-item:not(:last-child)::after {
content: '';
display: block;
position: absolute;
top: unset;
bottom: 0;
left: unset;
right: unset;
background-color: var(--td-action-sheet-border-color, var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7)));
}
.t-action-sheet__list-item:not(:last-child)::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-action-sheet__list-item--disabled {
--td-button-default-disabled-bg: none;
--td-button-default-disabled-color: var(--td-action-sheet-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-action-sheet__list-item-content,
.t-action-sheet__list-item-desc {
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-action-sheet__list-item-text {
font: var(--td-font-body-large);
}
.t-action-sheet__list-item-desc {
font: var(--td-font-body-small);
color: var(--td-action-sheet-description-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
margin-top: var(--td-spacer, 8px);
}
.t-action-sheet__list-item-text,
.t-action-sheet__list-item-desc {
word-wrap: normal;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.t-action-sheet__list-item-icon {
font-size: 24px;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
margin-right: var(--td-spacer, 8px);
}
.t-action-sheet__list-item-icon--suffix {
margin-right: 0;
margin-left: var(--td-spacer, 8px);
}
.t-action-sheet__swiper-wrap {
margin-top: 8px;
padding-bottom: 20px;
position: relative;
}
.t-action-sheet__swiper-wrap .t-swiper__pagination .t-swiper-dot {
background-color: var(--td-action-sheet-dot-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-action-sheet__swiper-wrap .t-swiper__pagination .t-swiper-dot--active {
background-color: var(--td-action-sheet-dot-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-action-sheet__footer {
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
}
.t-action-sheet__gap-list {
height: 8px;
background-color: var(--td-action-sheet-gap-color, var(--td-bg-color-page, var(--td-gray-color-1, #f3f3f3)));
}
.t-action-sheet__gap-grid {
height: 0.5px;
background-color: var(--td-action-sheet-gap-color, var(--td-bg-color-page, var(--td-gray-color-1, #f3f3f3)));
}
.t-action-sheet__cancel {
height: auto;
padding: var(--td-spacer-1, 12px) var(--td-spacer-2, 16px);
border: none;
border-radius: 0;
font: var(--td-font-body-large);
color: var(--td-action-sheet-cancel-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-action-sheet__cancel::after {
border-radius: 0;
}
.t-action-sheet__dots {
--td-swiper-nav-dot-color: var(--td-action-sheet-dot-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
--td-swiper-nav-dot-size: var(--td-action-sheet-dot-size, 8px);
--td-swiper-nav-dot-active-color: var(--td-action-sheet-dot-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-dialog {
overflow: hidden;
width: var(--td-dialog-width, 311px);
border-radius: var(--td-dialog-border-radius, var(--td-radius-extraLarge, 12px));
background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
}
.t-dialog__wrapper {
--td-popup-border-radius: var(--td-dialog-border-radius, var(--td-radius-extraLarge, 12px));
}
.t-dialog__close-btn {
position: absolute;
top: var(--td-spacer, 8px);
right: var(--td-spacer, 8px);
font-size: var(--td-dialog-close-icon-size, 22px);
color: var(--td-dialog-close-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-dialog__content {
padding: var(--td-spacer-3, 24px) var(--td-spacer-3, 24px) 0;
max-height: var(--td-dialog-body-max-height, 456px);
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
font-size: var(--td-font-size-m, 16px);
}
.t-dialog__content:empty {
display: none;
}
.t-dialog__header {
text-align: center;
font: var(--td-dialog-title-font, var(--td-font-title-large));
color: var(--td-dialog-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-dialog__header + .t-dialog__body {
margin-top: var(--td-spacer, 8px);
}
.t-dialog__body {
overflow-y: scroll;
text-align: center;
-webkit-overflow-scrolling: touch;
font: var(--td-dialog-content-font, var(--td-font-body-large));
color: var(--td-dialog-content-color, var(--td-text-color-secondary, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))));
}
.t-dialog__body-text {
word-wrap: break-word;
}
.t-dialog__body--left {
text-align: left;
}
.t-dialog__body--right {
text-align: right;
}
.t-dialog__footer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: var(--td-spacer-3, 24px);
}
.t-dialog__footer--column {
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-flow: column-reverse;
flex-flow: column-reverse;
}
.t-dialog__footer--column .t-dialog__button {
width: 100%;
-webkit-box-flex: unset;
-ms-flex: unset;
flex: unset;
}
.t-dialog__footer--full {
padding: var(--td-spacer-4, 32px) 0 0;
}
.t-dialog__button {
position: relative;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.t-dialog__button--horizontal + .t-dialog__button--horizontal {
margin-left: var(--td-spacer-1, 12px);
}
.t-dialog__button--vertical + .t-dialog__button--vertical {
margin-bottom: var(--td-spacer-1, 12px);
}
.t-dialog__button--text {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
--td-button-border-radius: 0;
--td-button-medium-height: 56px;
border-radius: 0;
}
.t-dialog__button--text::before {
content: ' ';
position: absolute;
-webkit-box-sizing: border-box;
box-sizing: border-box;
top: 0;
left: 0;
border-top: 1px solid var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7));
border-left: 1px solid var(--td-component-stroke, var(--td-gray-color-3, #e7e7e7));
-webkit-transform: scale(0.5);
transform: scale(0.5);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
width: 200%;
height: 200%;
border-radius: 0;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-dropdown-menu {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
background: var(--td-dropdown-menu-background, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
position: relative;
}
.t-dropdown-menu::after {
content: '';
display: block;
position: absolute;
top: unset;
bottom: 0;
left: unset;
right: unset;
background-color: var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-dropdown-menu::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-dropdown-menu__item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
padding: var(--td-spacer-1, 12px) var(--td-spacer, 8px);
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: relative;
overflow: hidden;
color: var(--td-dropdown-menu-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-dropdown-menu__item--active {
color: var(--td-dropdown-menu-active-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-dropdown-menu__item--disabled {
color: var(--td-dropdown-menu-disabled-color, var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26))));
}
.t-dropdown-menu__icon {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-size: var(--td-dropdown-menu-icon-size, 24px);
-webkit-transition: -webkit-transform 240ms ease;
transition: -webkit-transform 240ms ease;
transition: transform 240ms ease;
transition: transform 240ms ease, -webkit-transform 240ms ease;
margin-left: 4px;
}
.t-dropdown-menu__icon--active {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
.t-dropdown-menu__title {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font: var(--td-dropdown-menu-font, var(--td-font-body-medium));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
/** dropdown-item */
.t-dropdown-item {
position: fixed;
right: 0;
left: 0;
top: 0;
overflow: hidden;
bottom: 0;
}
.t-dropdown-item__content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
z-index: 11600;
overflow: hidden;
}
.t-dropdown-item__popup-host {
display: block;
width: 100%;
height: -webkit-max-content;
height: -moz-max-content;
height: max-content;
overflow: hidden;
position: absolute;
left: 0;
top: 0;
}
.t-dropdown-item__body {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
background: var(--td-dropdown-menu-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
overflow: auto;
max-height: var(--td-dropdown-body-max-height, 280px);
}
.t-dropdown-item__body--tree {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
overflow: hidden;
}
.t-dropdown-item__body--multi {
padding-top: var(--td-spacer, 8px);
padding-bottom: var(--td-spacer, 8px);
overflow-y: auto;
}
.t-dropdown-item__footer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
background: var(--td-dropdown-menu-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
padding: 16px;
position: relative;
}
.t-dropdown-item__footer::after {
content: '';
display: block;
position: absolute;
top: 0;
bottom: unset;
left: unset;
right: unset;
background-color: var(--td-component-border, var(--td-gray-color-4, #dcdcdc));
}
.t-dropdown-item__footer::after {
height: 1px;
left: 0;
right: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.t-dropdown-item__footer-btn {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.t-dropdown-item__footer-btn + .t-dropdown-item__footer-btn {
margin-left: 16px;
}
.t-dropdown-item__radio,
.t-dropdown-item__checkbox {
width: 100%;
overflow: scroll;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-dropdown-item__checkbox-group {
display: grid;
padding: 16px;
grid-gap: 12px;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.content-placement-top .t-popover[data-popper-placement^='top'] .t-popover__content {
margin-bottom: 8px;
}
.content-placement-top .t-popover[data-popper-placement^='top'] .t-popover__content--arrow {
margin-bottom: 12px;
}
.content-placement-bottom .t-popover[data-popper-placement^='bottom'] .t-popover__content {
margin-top: 8px;
}
.content-placement-bottom .t-popover[data-popper-placement^='bottom'] .t-popover__content--arrow {
margin-top: 12px;
}
.content-placement-left .t-popover[data-popper-placement^='left'] .t-popover__content {
margin-right: 8px;
}
.content-placement-left .t-popover[data-popper-placement^='left'] .t-popover__content--arrow {
margin-right: 12px;
}
.content-placement-right .t-popover[data-popper-placement^='right'] .t-popover__content {
margin-left: 8px;
}
.content-placement-right .t-popover[data-popper-placement^='right'] .t-popover__content--arrow {
margin-left: 12px;
}
.t-popover {
display: inline-block;
z-index: 1500;
position: absolute;
overflow: visible;
}
.t-popover__wrapper {
display: inline-block;
}
.t-popover__content {
position: relative;
-webkit-box-shadow: var(--td-shadow-3, 0 6px 30px 5px rgba(0, 0, 0, 0.05), 0 16px 24px 2px rgba(0, 0, 0, 0.04), 0 8px 10px -5px rgba(0, 0, 0, 0.08));
box-shadow: var(--td-shadow-3, 0 6px 30px 5px rgba(0, 0, 0, 0.05), 0 16px 24px 2px rgba(0, 0, 0, 0.04), 0 8px 10px -5px rgba(0, 0, 0, 0.08));
border-radius: 6px;
padding: var(--td-popover-padding, 12px);
font-size: var(--td-font-size-m, 16px);
line-height: 24px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
word-break: break-all;
}
.t-popover__arrow {
position: absolute;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 8px;
}
.t-popover--dark {
color: #fff;
background: var(--td-font-gray-1, rgba(0, 0, 0, 0.9));
}
.t-popover--dark .t-popover__arrow {
color: var(--td-font-gray-1, rgba(0, 0, 0, 0.9));
}
.t-popover--light {
color: var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
background: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
}
.t-popover--light .t-popover__arrow {
color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff));
}
.t-popover--brand {
color: var(--td-brand-color-7, #0052d9);
background: var(--td-brand-color-1, #f2f3ff);
}
.t-popover--brand .t-popover__arrow {
color: var(--td-brand-color-1, #f2f3ff);
}
.t-popover--success {
color: var(--td-success-color-5, #2ba471);
background: var(--td-success-color-1, #e3f9e9);
}
.t-popover--success .t-popover__arrow {
color: var(--td-success-color-1, #e3f9e9);
}
.t-popover--warning {
color: var(--td-warning-color-5, #e37318);
background: var(--td-warning-color-1, #fff1e9);
}
.t-popover--warning .t-popover__arrow {
color: var(--td-warning-color-1, #fff1e9);
}
.t-popover--error {
color: var(--td-error-color-6, #d54941);
background: var(--td-error-color-1, #fff0ed);
}
.t-popover--error .t-popover__arrow {
color: var(--td-error-color-1, #fff0ed);
}
.t-popover[data-popper-placement^='top'] .t-popover__content {
margin-bottom: 8px;
}
.t-popover[data-popper-placement^='top'] .t-popover__content--arrow {
margin-bottom: 12px;
}
.t-popover[data-popper-placement^='bottom'] .t-popover__content {
margin-top: 8px;
}
.t-popover[data-popper-placement^='bottom'] .t-popover__content--arrow {
margin-top: 12px;
}
.t-popover[data-popper-placement^='left'] .t-popover__content {
margin-right: 8px;
}
.t-popover[data-popper-placement^='left'] .t-popover__content--arrow {
margin-right: 12px;
}
.t-popover[data-popper-placement^='right'] .t-popover__content {
margin-left: 8px;
}
.t-popover[data-popper-placement^='right'] .t-popover__content--arrow {
margin-left: 12px;
}
.t-popover[data-popper-placement^='top'] .t-popover__arrow {
bottom: 0;
border-top-color: currentColor;
border-bottom-width: 0;
margin-bottom: calc(8px * -1);
}
.t-popover[data-popper-placement='top'] {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
}
.t-popover[data-popper-placement='top'] .t-popover__arrow {
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.t-popover[data-popper-placement='top-start'] {
-webkit-transform-origin: 0 100%;
transform-origin: 0 100%;
}
.t-popover[data-popper-placement='top-start'] .t-popover__arrow {
left: var(--td-popover-padding, 12px);
}
.t-popover[data-popper-placement='top-end'] {
-webkit-transform-origin: 100% 100%;
transform-origin: 100% 100%;
}
.t-popover[data-popper-placement='top-end'] .t-popover__arrow {
right: var(--td-popover-padding, 12px);
}
.t-popover[data-popper-placement^='bottom'] .t-popover__arrow {
top: 0;
border-top-width: 0;
border-bottom-color: currentColor;
margin-top: calc(8px * -1);
}
.t-popover[data-popper-placement='bottom'] {
-webkit-transform-origin: 50% 0;
transform-origin: 50% 0;
}
.t-popover[data-popper-placement='bottom'] .t-popover__arrow {
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.t-popover[data-popper-placement='bottom-start'] {
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
}
.t-popover[data-popper-placement='bottom-start'] .t-popover__arrow {
left: var(--td-popover-padding, 12px);
}
.t-popover[data-popper-placement='bottom-end'] {
-webkit-transform-origin: 100% 0;
transform-origin: 100% 0;
}
.t-popover[data-popper-placement='bottom-end'] .t-popover__arrow {
right: var(--td-popover-padding, 12px);
}
.t-popover[data-popper-placement^='left'] .t-popover__arrow {
right: 0;
border-right-width: 0;
border-left-color: currentColor;
margin-right: calc(8px * -1);
}
.t-popover[data-popper-placement='left'] {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
}
.t-popover[data-popper-placement='left'] .t-popover__arrow {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.t-popover[data-popper-placement='left-start'] {
-webkit-transform-origin: 100% 0;
transform-origin: 100% 0;
}
.t-popover[data-popper-placement='left-start'] .t-popover__arrow {
top: var(--td-popover-padding, 12px);
}
.t-popover[data-popper-placement='left-end'] {
-webkit-transform-origin: 100% 100%;
transform-origin: 100% 100%;
}
.t-popover[data-popper-placement='left-end'] .t-popover__arrow {
bottom: var(--td-popover-padding, 12px);
}
.t-popover[data-popper-placement^='right'] .t-popover__arrow {
left: 0;
border-right-color: currentColor;
border-left-width: 0;
margin-left: calc(8px * -1);
}
.t-popover[data-popper-placement='right'] {
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%;
}
.t-popover[data-popper-placement='right'] .t-popover__arrow {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.t-popover[data-popper-placement='right-start'] {
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
}
.t-popover[data-popper-placement='right-start'] .t-popover__arrow {
top: var(--td-popover-padding, 12px);
}
.t-popover[data-popper-placement='right-end'] {
-webkit-transform-origin: 0 100%;
transform-origin: 0 100%;
}
.t-popover[data-popper-placement='right-end'] .t-popover__arrow {
bottom: var(--td-popover-padding, 12px);
}
.t-popover--animation-enter,
.t-popover--animation-enter-from,
.t-popover--animation-exiting,
.t-popover--animation-leave-to {
opacity: 0;
visibility: hidden;
}
.t-popover--animation-enter-to,
.t-popover--animation-entering,
.t-popover--animation-leave-from,
.t-popover--animation-leave {
opacity: 1;
visibility: visible;
-webkit-transform: none;
transform: none;
}
.t-popover--animation-enter-active {
-webkit-transition: opacity var(--td-anim-duration-base, 0.2s) linear;
transition: opacity var(--td-anim-duration-base, 0.2s) linear;
}
.t-popover--animation-leave-active {
-webkit-transition: opacity var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-ease-out, cubic-bezier(0, 0, 0.15, 1)), visibility var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-ease-in, cubic-bezier(0.82, 0, 1, 0.9));
transition: opacity var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-ease-out, cubic-bezier(0, 0, 0.15, 1)), visibility var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-ease-in, cubic-bezier(0.82, 0, 1, 0.9));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-guide--absolute {
position: absolute;
}
.t-guide--fixed {
position: fixed;
}
.t-guide__overlay {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 999997;
}
.t-guide__highlight {
z-index: 999998;
-webkit-transition: var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-ease-out, cubic-bezier(0, 0, 0.15, 1));
transition: var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-ease-out, cubic-bezier(0, 0, 0.15, 1));
border-radius: var(--td-radius-default, 6px);
}
.t-guide__highlight--mask {
-webkit-box-shadow: 0 0 0 0 var(--td-mask-active, rgba(0, 0, 0, 0.6)), var(--td-mask-active, rgba(0, 0, 0, 0.6)) 0 0 0 5000px;
box-shadow: 0 0 0 0 var(--td-mask-active, rgba(0, 0, 0, 0.6)), var(--td-mask-active, rgba(0, 0, 0, 0.6)) 0 0 0 5000px;
}
.t-guide__highlight--dialog {
-webkit-box-shadow: none;
box-shadow: none;
}
.t-guide__highlight--nomask {
border-radius: var(--td-radius-default, 6px);
border: 2px solid var(--td-brand-color, var(--td-brand-color-7, #0052d9));
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-guide__reference {
z-index: 999999;
}
.t-guide__wrapper .t-popover__content {
border: 1px solid var(--td-gray-color-4, #dcdcdc);
border-radius: var(--td-radius-large, 9px);
}
.t-guide__wrapper .t-popover[data-popper-placement^='bottom'] .t-popover__content {
margin-top: 16px;
}
.t-guide__wrapper--content .t-popover__content {
background: none;
-webkit-box-shadow: none;
box-shadow: none;
padding: 0;
border: none;
}
.t-guide__dialog {
border-radius: var(--td-radius-extraLarge, 12px);
}
.t-guide__content--popover {
padding: 4px;
}
.t-guide__content--dialog {
padding: 24px 0;
width: var(--td-guide-dialog-width, 311px);
}
.t-guide__content--dialog .t-guide__title {
text-align: center;
font: var(--td-font-title-large);
}
.t-guide__content--dialog .t-guide__desc {
margin-top: 8px;
text-align: center;
font: var(--td-font-body-large);
}
.t-guide__content--popover .t-guide__tooltip {
min-width: var(--td-guide-tooltip-min-width, 240px);
max-width: var(--td-guide-tooltip-max-width, 270px);
}
.t-guide__title {
text-align: left;
color: var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
font: var(--td-font-title-medium);
}
.t-guide__desc {
margin-top: 4px;
text-align: left;
color: var(--td-text-color-secondary, var(--td-font-gray-2, rgba(0, 0, 0, 0.6)));
font: var(--td-font-body-medium);
}
.t-guide__footer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-top: 24px;
}
.t-guide__footer button {
margin-right: 12px;
}
.t-guide__footer button:last-child {
margin-right: 0;
}
.t-guide__footer--popover {
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.t-guide__footer--dialog {
margin-top: var(--td-spacer-3, 24px);
padding: 0 24px;
}
.t-guide__footer--dialog button:last-child {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
.t-guide__footer--dialog .t-guide__action {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-message {
position: fixed;
top: 0;
left: 0;
right: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
min-height: 48px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
z-index: 15000;
padding: 12px 16px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-radius: var(--td-message-border-radius, var(--td-radius-default, 6px));
line-height: 1em;
background-color: var(--td-message-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
-webkit-box-shadow: var(--td-message-box-shadow, var(--td-shadow-4, 0 2px 8px 0 rgba(0, 0, 0, 0.06)));
box-shadow: var(--td-message-box-shadow, var(--td-shadow-4, 0 2px 8px 0 rgba(0, 0, 0, 0.06)));
}
.t-message__text {
color: var(--td-message-content-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
font: var(--td-font-body-medium);
}
.t-message__text-wrap {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
overflow-x: hidden;
text-overflow: ellipsis;
}
.t-message__text-nowrap {
word-break: keep-all;
white-space: nowrap;
}
.t-message__icon--left,
.t-message__close-wrap {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.t-message--info {
color: var(--td-message-info-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
}
.t-message--success {
color: var(--td-message-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
}
.t-message--warning {
color: var(--td-message-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
}
.t-message--error {
color: var(--td-message-error-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
}
.t-message__icon--left,
.t-message__icon--right {
font-size: 22px;
}
.t-message__icon--left:not(:empty) {
margin-right: var(--td-spacer, 8px);
}
.t-message__icon--right {
color: var(--td-message-close-icon-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-message__icon--right:not(:empty),
.t-message__link {
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
margin-left: var(--td-spacer, 8px);
}
.message-enter-active {
-webkit-animation: messageEnter 0.5s;
animation: messageEnter 0.5s;
}
.message-leave-active {
-webkit-animation: messageOut 0.2s;
animation: messageOut 0.2s;
}
@-webkit-keyframes messageEnter {
from {
-webkit-transform: translate3d(0, -48px, 0);
transform: translate3d(0, -48px, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes messageEnter {
from {
-webkit-transform: translate3d(0, -48px, 0);
transform: translate3d(0, -48px, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes messageOut {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -48px, 0);
transform: translate3d(0, -48px, 0);
}
}
@keyframes messageOut {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -48px, 0);
transform: translate3d(0, -48px, 0);
}
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-notice-bar {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
padding: 13px 16px;
}
.t-notice-bar__content-wrap {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
overflow-x: hidden;
font: var(--td-font-body-medium);
color: var(--td-notice-bar-font-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
}
.t-notice-bar__content {
display: inline-block;
white-space: nowrap;
}
.t-notice-bar__content-wrapable {
white-space: normal;
}
.t-notice-bar__content--vertical {
--td-swiper-border-radius: 0;
height: 22px;
line-height: 22px;
}
.t-notice-bar__content--vertical-item {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.t-notice-bar__prefix-icon {
color: inherit;
}
.t-notice-bar__prefix-icon:not(:empty) {
display: inherit;
padding-right: var(--td-spacer, 8px);
}
.t-notice-bar__suffix-icon {
color: var(--td-notice-bar-suffix-icon-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
}
.t-notice-bar__prefix-icon,
.t-notice-bar__suffix-icon {
font-size: 22px;
}
.t-notice-bar__operation {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
vertical-align: top;
color: var(--td-notice-bar-operation-font-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
font-weight: 700;
}
.t-notice-bar__operation:empty {
display: none;
}
.t-notice-bar__suffix-icon:not(:empty) {
display: inherit;
padding-left: var(--td-spacer, 8px);
}
.t-notice-bar--info {
color: var(--td-notice-bar-info-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9)));
background-color: var(--td-notice-bar-info-bg-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff)));
}
.t-notice-bar--success {
color: var(--td-notice-bar-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471)));
background-color: var(--td-notice-bar-success-bg-color, var(--td-success-color-1, #e3f9e9));
}
.t-notice-bar--warning {
color: var(--td-notice-bar-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318)));
background-color: var(--td-notice-bar-warning-bg-color, var(--td-warning-color-1, #fff1e9));
}
.t-notice-bar--error {
color: var(--td-notice-bar-error-color, var(--td-error-color-6, #d54941));
background-color: var(--td-notice-bar-error-bg-color, var(--td-error-color-1, #fff0ed));
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-pull-down-refresh {
overflow: hidden;
height: 100%;
}
.t-pull-down-refresh__track {
position: relative;
height: 100%;
}
.t-pull-down-refresh__track--loosing {
-webkit-transition: -webkit-transform ease 0.24s;
transition: -webkit-transform ease 0.24s;
transition: transform ease 0.24s;
transition: transform ease 0.24s, -webkit-transform ease 0.24s;
}
.t-pull-down-refresh__tips {
position: absolute;
color: var(--td-pull-down-refresh-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4))));
font-size: var(--td-font-size-base, 14px);
top: 0;
width: 100%;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
overflow: hidden;
}
.t-pull-down-refresh__loading {
width: 100%;
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-pull-down-refresh__loading .t-loading__text {
font-size: var(--td-font-size-base, 14px);
color: var(--td-text-color-disabled, var(--td-font-gray-4, rgba(0, 0, 0, 0.26)));
}
.t-pull-down-refresh__wrap {
position: relative;
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-swipe-cell {
position: relative;
overflow: hidden;
}
.t-swipe-cell__left,
.t-swipe-cell__right {
position: absolute;
top: 0;
height: 100%;
}
.t-swipe-cell__left {
left: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-flow: row-reverse;
flex-flow: row-reverse;
}
.t-swipe-cell__right {
right: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.t-swipe-cell__content {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 0 var(--td-spacer-2, 16px);
}
.t-swipe-cell__icon {
font-size: var(--td-font-size-xl, 20px);
}
.t-swipe-cell__icon + .t-swipe-cell__text:not(:empty) {
margin-left: var(--td-spacer, 8px);
font: var(--td-font-body-medium);
}
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@-webkit-keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes t-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes t-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-top-in {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes t-slide-top-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@-webkit-keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-bottom-in {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes t-slide-bottom-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@-webkit-keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-right-in {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes t-slide-right-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@-webkit-keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes t-slide-left-in {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes t-slide-left-out {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@-webkit-keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes t-fade-zoom-in {
0% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
100% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
}
@-webkit-keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-fade-zoom-out {
0% {
opacity: 1;
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
100% {
opacity: 0;
-webkit-transform: translate(-50%, -50%) scale(0.6);
transform: translate(-50%, -50%) scale(0.6);
}
}
@keyframes t-spin {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.t-icon-loading {
-webkit-animation: t-spin 1s linear infinite;
animation: t-spin 1s linear infinite;
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
.t-toast {
position: fixed;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
z-index: 12001;
opacity: 1;
-webkit-transition: opacity 300ms ease;
transition: opacity 300ms ease;
background-color: var(--td-toast-bg-color, var(--td-mask-active, rgba(0, 0, 0, 0.6)));
border-radius: var(--td-toast-radius, var(--td-radius-default, 6px));
color: var(--td-toast-color, var(--td-text-color-anti, var(--td-font-white-1, #ffffff)));
max-width: var(--td-toast-max-width, 185px);
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.t-toast--column {
padding: 24px;
min-width: 80px;
min-height: 80px;
border-radius: 8px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.t-toast--loading.t-toast--with-text {
min-width: 102px;
min-height: 102px;
padding-top: 0;
padding-bottom: 0;
}
.t-toast__content {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font: var(--td-font-body-medium);
}
.t-toast__content--row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
text-align: left;
padding: 14px 22px;
}
.t-toast__content--column {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
}
.t-toast__icon--row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
font-size: var(--td-toast-row-icon-size, 24px);
}
.t-toast__icon--column {
font-size: var(--td-toast-column-icon-size, 32px);
}
.t-toast__text {
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 3;
/* stylelint-disable-next-line */
display: -webkit-box;
-webkit-box-orient: vertical;
white-space: pre-line;
}
.t-toast__text--column:not(:empty):not(:only-child) {
margin-top: 8px;
min-width: 64px;
}
.t-toast__text--row:not(:empty):not(:only-child) {
margin-left: 8px;
}
.t-toast.t-fade-enter,
.t-toast.t-fade-leave-to {
opacity: 0;
}
.t-toast--lock {
overflow: hidden;
cursor: not-allowed;
}
.t-toast--lock * {
pointer-events: none;
}
/*# sourceMappingURL=tdesign.css.map */