.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 { 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))); } .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-size: var(--td-indexes-sidebar-font-size, 12px); line-height: var(--td-indexes-sidebar-line-height, 20px); display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-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 { width: var(--td-indexes-sidebar-tips-size, 48px); height: var(--td-indexes-sidebar-tips-size, 48px); line-height: var(--td-indexes-sidebar-tips-size, 48px); text-align: center; font-size: var(--td-indexes-sidebar-tips-font-size, 20px); font-weight: 700; 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: 50%; 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-size: var(--td-indexes-anchor-font-size, 14px); line-height: var(--td-indexes-anchor-line-height, 22px); } .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-form { background-color: var(--td-bg-color-container, var(--td-font-white-1, #ffffff)); } .t-form .t-form__item { display: -webkit-box; display: -webkit-flex; display: flex; 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; 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: -webkit-flex; 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: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; } .t-form--top { -webkit-box-align: center; -webkit-align-items: 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))); 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: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; min-height: 24px; } .t-form__controls--left { -webkit-box-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } .t-form__controls--right { -webkit-box-pack: end; -webkit-justify-content: flex-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-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: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: 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 { object-fit: fill; } .t-image--fit-contain { object-fit: contain; } .t-image--fit-cover { object-fit: cover; } .t-image--fit-scale-down { object-fit: scale-down; } .t-image--fit-none { object-fit: none; } .t-image--position-center { object-position: center; } .t-image--position-bottom { object-position: bottom; } .t-image--position-top { object-position: top; } .t-image--position-left { object-position: left; } .t-image--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-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__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: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: 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: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; 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; -webkit-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-footer { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } .t-footer__text { font-size: var(--td-footer-text-font-size, var(--td-font-size-s, 12px)); line-height: var(--td-footer-text-line-height, 20px); 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: -webkit-flex; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: 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-size: var(--td-footer-link-font-size, var(--td-font-size-s, 12px)); line-height: var(--td-footer-link-line-height, 20px); 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: -webkit-flex; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: 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-weight: bold; font-size: var(--td-footer-logo-title-font-size, var(--td-font-size-m, 16px)); line-height: var(--td-footer-logo-title-line-height, 24px); 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; 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; 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; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; display: -webkit-box; display: -webkit-flex; 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 { box-sizing: border-box; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding: var(--td-grid-item-vertical-padding, 16px 0 12px); -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; background: var(--td-grid-item-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff))); -webkit-flex-basis: 84px; flex-basis: 84px; -webkit-flex-shrink: 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; 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; 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; -webkit-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -webkit-justify-content: 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: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: 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)))); font-size: var(--td-grid-item-text-font-size, 14px); line-height: var(--td-grid-item-text-line-height, 22px); } .t-grid-item__title--small, .t-grid-item__title--middle { font-size: 12px; } .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-size: var(--td-grid-item-description-font-size, 12px); line-height: var(--td-grid-item-description-line-height, 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-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 { 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 { 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)); 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; 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-size: 18px; line-height: 26px; } .t-guide__content--dialog .t-guide__desc { margin-top: 8px; text-align: center; font-size: var(--td-font-size-m, 16px); line-height: 24px; } .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-size: var(--td-font-size-m, 16px); font-weight: 600; line-height: 24px; } .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-size: var(--td-font-size-base, 14px); font-weight: 400; line-height: 22px; } .t-guide__footer { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: 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; -webkit-justify-content: flex-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; -webkit-flex-grow: 1; flex-grow: 1; } .t-guide__footer--dialog .t-guide__action { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; }