/*!****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./src/styles/core.scss?ngGlobalStyle ***! \****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ @import url(https://fonts.googleapis.com/css2?family=PT+Sans+Caption:wght@700&display=swap); /*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./src/styles/variables.scss?ngGlobalStyle ***! \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /** Application BAZIS CSS Variables **/ :root { /** ** ** COLORS ** **/ /*** Theme colors ***/ /** primary **/ --bazis-color-primary: #005A9B; --bazis-color-primary-rgb: 0,90,155; --bazis-color-primary-contrast: #ffffff; --bazis-color-primary-contrast-rgb: 255,255,255; --bazis-color-primary-shade: #004f88; --bazis-color-primary-shade-rgb: 0,79,136; --bazis-color-primary-tint: #1a6ba5; /** secondary **/ --bazis-color-secondary: #43B1F2; --bazis-color-secondary-rgb: 67,177,242; --bazis-color-secondary-contrast: #ffffff; --bazis-color-secondary-contrast-rgb: 255,255,255; --bazis-color-secondary-shade: #3b9cd5; --bazis-color-secondary-shade-rgb: 59, 156, 213; --bazis-color-secondary-tint: #56b9f3; /** tertiary **/ --bazis-color-tertiary: #817AF9; --bazis-color-tertiary-rgb: 128,122,249; --bazis-color-tertiary-contrast: #ffffff; --bazis-color-tertiary-contrast-rgb: 255,255,255; --bazis-color-tertiary-shade: #726bdb; --bazis-color-tertiary-shade-rgb: 114, 107, 219; --bazis-color-tertiary-tint: #8e87fa; /** action **/ --bazis-color-action: #3189DA; --bazis-color-action-rgb: 49, 137, 218; --bazis-color-action-contrast: #ffffff; --bazis-color-action-contrast-rgb: 255,255,255; --bazis-color-action-shade: #3189DA; --bazis-color-action-shade-rgb: 45, 76, 189; --bazis-color-action-tint: #4695de; --bazis-color-action-dark: #164982; /** info **/ --bazis-color-info: #C4C4C4; --bazis-color-info-rgb: 196,196,196; --bazis-color-info-contrast: #ffffff; --bazis-color-info-contrast-rgb: 255,255,255; --bazis-color-info-shade: #acacac; --bazis-color-info-shade-rgb: 172, 172, 172; --bazis-color-info-tint: #f3f3f3; /** success **/ --bazis-color-success: #78C649; --bazis-color-success-rgb: 120,198,73; --bazis-color-success-contrast: #ffffff; --bazis-color-success-contrast-rgb: 255,255,255; --bazis-color-success-shade: #6aae40; --bazis-color-success-shade-rgb: 106, 174, 64; --bazis-color-success-tint: #86cc5b; /** warning **/ --bazis-color-warning: #F6BF36; --bazis-color-warning-rgb: 246,191,54; --bazis-color-warning-contrast: #ffffff; --bazis-color-warning-contrast-rgb: 255,255,255; --bazis-color-warning-shade: #d8a830; --bazis-color-warning-shade-rgb: 216, 168, 48; --bazis-color-warning-tint: #f7c54a; /** danger **/ --bazis-color-danger: #ED1A34; --bazis-color-danger-rgb: 237,26,52; --bazis-color-danger-contrast: #ffffff; --bazis-color-danger-contrast-rgb: 255,255,255; --bazis-color-danger-shade: #d1172e; --bazis-color-danger-shade-rgb: 209, 23, 46; --bazis-color-danger-tint: #ef3148; /*** Stepped Colors ***/ --bazis-color-white: #ffffff; --bazis-color-white-rgb: 255, 255, 255; --bazis-color-step-50: #f2f2f2; --bazis-color-step-100: #e6e6e6; --bazis-color-step-150: #d9d9d9; --bazis-color-step-200: #cccccc; --bazis-color-step-250: #bfbfbf; --bazis-color-step-300: #b3b3b3; --bazis-color-step-350: #a6a6a6; --bazis-color-step-400: #999999; --bazis-color-step-450: #8c8c8c; --bazis-color-step-500: #808080; --bazis-color-step-550: #737373; --bazis-color-step-600: #666666; --bazis-color-step-650: #595959; --bazis-color-step-700: #4d4d4d; --bazis-color-step-750: #404040; --bazis-color-step-800: #333333; --bazis-color-step-850: #262626; --bazis-color-step-900: #191919; --bazis-color-step-950: #0d0d0d; --bazis-color-black: #000000; --bazis-color-black-rgb: 0, 0, 0; /*** Base colors ***/ /** text colors **/ --bazis-text-color: #111214; --bazis-text-color-rgb: 17, 18, 20; --bazis-text-color-secondary: #9096A2; --bazis-text-color-secondary-rgb: 144, 150, 162; --bazis-text-color-contrast: var(--bazis-color-white); --bazis-text-color-contrast-rgb: var(--bazis-color-white-rgb); /* link color */ --bazis-link-color: #1B68AE; --bazis-link-color-rgb: 27,104,174; --bazis-link-color-dark: #004064; --sl-footer-link-color: #FFFFFF; /** placeholder color **/ --bazis-placeholder-color: #BCC1CC; --bazis-placeholder-color-rgb: 188, 193, 204; /** background light **/ --bazis-background: var(--bazis-color-white); --bazis-background-rgb: var(--bazis-color-white-rgb); /** background medium **/ --bazis-background-medium: #F7F8F9; --bazis-background-medium-rgb: 247, 248, 249; /** background dark **/ --bazis-background-dark: #F1F1F3; --bazis-background-dark-rgb: 241, 241, 243; /** background accent **/ --bazis-background-accent: #E3EEF4; --bazis-background-accent-rgb: 227,238,244; /** background info secondary **/ --bazis-background-info-secondary: #FEF9EB; --bazis-background-info-secondary-rgb: 254, 249, 235; /** background header **/ --bazis-header-background: #005A9B; --bazis-header-background-rgb: 0,90,155; /** background footer **/ --bazis-footer-background: #004476; --bazis-footer-background-rgb: 0,68,118; /** background stepper active **/ --bazis-stepper-background: #3189DA; --bazis-stepper-background-rgb: 49,137,218; /** border light **/ --bazis-border-color: #E8E9EB; --bazis-border-color-rgb: 232, 233, 235; /** border dark **/ --bazis-border-color-dark: #C4C7CC; --bazis-border-color-dark-rgb: 196, 199, 204; /** shadow **/ --bazis-shadow-color-rgb: 239, 240, 242; /** ** ** APPLICATION VARIABLES ** **/ /** Font family of the app **/ --bazis-font-family: "Gordita", sans-serif; --bazis-font-size: 13px; --bazis-line-height: 20px; /** H1 **/ --bazis-font-size-h1: 45px; --bazis-line-height-h1: 52px; --bazis-h1-margin: 0 0 32px; /** H2 **/ --bazis-font-size-h2: 36px; --bazis-line-height-h2: 44px; /** H3 **/ --bazis-font-size-h3: 28px; --bazis-line-height-h3: 36px; --bazis-h3-margin: 32px 0 24px; /** H4 **/ --bazis-font-size-h4: 22px; --bazis-font-size-h4-minor: 22px; --bazis-line-height-h4: 32px; --bazis-line-height-h4-minor: 28px; /** H5 **/ --bazis-font-size-h5: 18px; --bazis-line-height-h5: 24px; /** H6 **/ --bazis-font-size-h6: 16px; --bazis-font-size-h6-major: 16px; --bazis-font-size-h6-minor: 14px; --bazis-line-height-h6: 24px; --bazis-line-height-h6-major: 32px; --bazis-line-height-h6-minor: 16px; --bazis-h6-margin: 0 0 12px; --bazis-h6-margin-major: var(--bazis-h6-margin); --bazis-h6-margin-minor: var(--bazis-h6-margin); /** p **/ --bazis-font-size-p: 13px; --bazis-font-size-p-major: 14px; --bazis-font-size-p-minor: 12px; --bazis-line-height-p: 20px; --bazis-line-height-p-major: 20px; --bazis-line-height-p-minor: 16px; --bazis-p-margin: var(--bazis-multiple-px) 0; --bazis-p-margin-major: var(--bazis-p-margin); --bazis-p-margin-minor: var(--bazis-p-margin); /** small **/ --bazis-font-size-small: 11px; --bazis-line-height-small: 12px; /** Базовое число пикселей, используемое для кратности определяемых размеров **/ --bazis-multiple-px: 4px; /** Коэффиницет кратности по умолчанию **/ --bazis-coef: 3; /** Adjust the safe area inset top of the app **/ /** Adjust the safe area inset right of the app **/ /** Adjust the safe area inset bottom of the app **/ /** Adjust the safe area inset left of the app **/ /** Adjust the margin **/ --bazis-margin: calc(var(--bazis-multiple-px) * var(--bazis-coef)); --bazis-margin-1x: var(--bazis-multiple-px); --bazis-margin-2x: calc(var(--bazis-multiple-px) * 2); --bazis-margin-3x: calc(var(--bazis-multiple-px) * 3); --bazis-margin-4x: calc(var(--bazis-multiple-px) * 4); --bazis-margin-5x: calc(var(--bazis-multiple-px) * 5); --bazis-margin-6x: calc(var(--bazis-multiple-px) * 6); --bazis-margin-7x: calc(var(--bazis-multiple-px) * 7); --bazis-margin-8x: calc(var(--bazis-multiple-px) * 8); /** Adjust the padding **/ --bazis-padding: calc(var(--bazis-multiple-px) * var(--bazis-coef)); --bazis-padding-1x: var(--bazis-multiple-px); --bazis-padding-2x: calc(var(--bazis-multiple-px) * 2); --bazis-padding-3x: calc(var(--bazis-multiple-px) * 3); --bazis-padding-4x: calc(var(--bazis-multiple-px) * 4); --bazis-padding-5x: calc(var(--bazis-multiple-px) * 5); --bazis-padding-6x: calc(var(--bazis-multiple-px) * 6); --bazis-padding-7x: calc(var(--bazis-multiple-px) * 7); --bazis-padding-8x: calc(var(--bazis-multiple-px) * 8); /** Adjust the box shadow **/ /** Adjust the border-radius **/ --bazis-border-radius: 4px; /** ** ** GRID VARIABLES ** **/ /** Number of columns in the grid **/ /** Padding of the grid **/ --bazis-grid-padding: 0; /** Padding of the grid for xs breakpoints **/ /** Padding of the grid for sm breakpoints **/ /** Padding of the grid for md breakpoints **/ /** Padding of the grid for lg breakpoints **/ /** Padding of the grid for xl breakpoints **/ /** Padding of the grid columns for xs breakpoints **/ /** Padding of the grid columns for sm breakpoints **/ /** Padding of the grid columns for md breakpoints **/ /** Padding of the grid columns for lg breakpoints **/ /** Padding of the grid columns for xl breakpoints **/ } /** ** ** SW SCSS Variables ** **/ /*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./src/styles/core.scss?ngGlobalStyle (1) ***! \********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /* Core CSS required for components to work properly */ .bazis-color-primary { --bazis-color-base: var(--bazis-color-primary) !important; --bazis-color-base-rgb: var(--bazis-color-primary-rgb) !important; --bazis-color-contrast: var(--bazis-color-primary-contrast) !important; --bazis-color-contrast-rgb: var(--bazis-color-primary-contrast-rgb) !important; --bazis-color-shade: var(--bazis-color-primary-shade) !important; --bazis-color-shade-rgb: var(--bazis-color-primary-shade-grb) !important; --bazis-color-tint: var(--bazis-color-primary-tint) !important; } .bazis-color-secondary { --bazis-color-base: var(--bazis-color-secondary) !important; --bazis-color-base-rgb: var(--bazis-color-secondary-rgb) !important; --bazis-color-contrast: var(--bazis-color-secondary-contrast) !important; --bazis-color-contrast-rgb: var(--bazis-color-secondary-contrast-rgb) !important; --bazis-color-shade: var(--bazis-color-secondary-shade) !important; --bazis-color-shade-rgb: var(--bazis-color-secondary-shade-rgb) !important; --bazis-color-tint: var(--bazis-color-secondary-tint) !important; } .bazis-color-tertiary { --bazis-color-base: var(--bazis-color-tertiary) !important; --bazis-color-base-rgb: var(--bazis-color-tertiary-rgb) !important; --bazis-color-contrast: var(--bazis-color-tertiary-contrast) !important; --bazis-color-contrast-rgb: var(--bazis-color-tertiary-contrast-rgb) !important; --bazis-color-shade: var(--bazis-color-tertiary-shade) !important; --bazis-color-shade-rgb: var(--bazis-color-tertiary-shade-grb) !important; --bazis-color-tint: var(--bazis-color-tertiary-tint) !important; } .bazis-color-action { --bazis-color-base: var(--bazis-color-action) !important; --bazis-color-base-rgb: var(--bazis-color-action-rgb) !important; --bazis-color-contrast: var(--bazis-color-action-contrast) !important; --bazis-color-contrast-rgb: var(--bazis-color-action-contrast-rgb) !important; --bazis-color-shade: var(--bazis-color-action-shade) !important; --bazis-color-shade-grb: var(--bazis-color-action-shade-rgb) !important; --bazis-color-tint: var(--bazis-color-action-tint) !important; } .bazis-color-info { --bazis-color-base: var(--bazis-color-info) !important; --bazis-color-base-rgb: var(--bazis-color-info-rgb) !important; --bazis-color-contrast: var(--bazis-color-info-contrast) !important; --bazis-color-contrast-rgb: var(--bazis-color-info-contrast-rgb) !important; --bazis-color-shade: var(--bazis-color-info-shade) !important; --bazis-color-shade-grb: var(--bazis-color-info-shade-rgb) !important; --bazis-color-tint: var(--bazis-color-info-tint) !important; } .bazis-color-success { --bazis-color-base: var(--bazis-color-success) !important; --bazis-color-base-rgb: var(--bazis-color-success-rgb) !important; --bazis-color-contrast: var(--bazis-color-success-contrast) !important; --bazis-color-contrast-rgb: var(--bazis-color-success-contrast-rgb) !important; --bazis-color-shade: var(--bazis-color-success-shade) !important; --bazis-color-shade-rgb: var(--bazis-color-success-shade-rgb) !important; --bazis-color-tint: var(--bazis-color-success-tint) !important; } .bazis-color-warning { --bazis-color-base: var(--bazis-color-warning) !important; --bazis-color-base-rgb: var(--bazis-color-warning-rgb) !important; --bazis-color-contrast: var(--bazis-color-warning-contrast) !important; --bazis-color-contrast-rgb: var(--bazis-color-warning-contrast-rgb) !important; --bazis-color-shade: var(--bazis-color-warning-shade) !important; --bazis-color-shade-rgb: var(--bazis-color-warning-shade-rgb) !important; --bazis-color-tint: var(--bazis-color-warning-tint) !important; } .bazis-color-danger { --bazis-color-base: var(--bazis-color-danger) !important; --bazis-color-base-rgb: var(--bazis-color-danger-rgb) !important; --bazis-color-contrast: var(--bazis-color-danger-contrast) !important; --bazis-color-contrast-rgb: var(--bazis-color-danger-contrast-rgb) !important; --bazis-color-shade: var(--bazis-color-danger-shade) !important; --bazis-color-shade-rgb: var(--bazis-color-danger-shade-rgb) !important; --bazis-color-tint: var(--bazis-color-danger-tint) !important; } .bazis-color-light { --bazis-color-base: var(--bazis-color-light, #f4f5f8) !important; --bazis-color-base-rgb: var(--bazis-color-light-rgb, 244, 245, 248) !important; --bazis-color-contrast: var(--bazis-color-light-contrast, #000) !important; --bazis-color-contrast-rgb: var(--bazis-color-light-contrast-rgb, 0, 0, 0) !important; --bazis-color-shade: var(--bazis-color-light-shade, #d7d8da) !important; --bazis-color-shade-rgb: var(--bazis-color-light-shade-rgb, 215, 216, 218) !important; --bazis-color-tint: var(--bazis-color-light-tint, #f5f6f9) !important; } .bazis-color-medium { --bazis-color-base: var(--bazis-color-medium, #92949c) !important; --bazis-color-base-rgb: var(--bazis-color-medium-rgb, 146, 148, 156) !important; --bazis-color-contrast: var(--bazis-color-medium-contrast, #fff) !important; --bazis-color-contrast-rgb: var(--bazis-color-medium-contrast-rgb, 255, 255, 255) !important; --bazis-color-shade: var(--bazis-color-medium-shade, #808289) !important; --bazis-color-shade-rgb: var(--bazis-color-medium-shade-rgb, 128, 130, 137) !important; --bazis-color-tint: var(--bazis-color-medium-tint, #9d9fa6) !important; } .bazis-color-dark { --bazis-color-base: var(--bazis-color-dark, #111214) !important; --bazis-color-base-rgb: var(--bazis-color-dark-rgb, 17, 18, 20) !important; --bazis-color-contrast: var(--bazis-color-dark-contrast, #fff) !important; --bazis-color-contrast-rgb: var(--bazis-color-dark-contrast-rgb, 255, 255, 255) !important; --bazis-color-shade: var(--bazis-color-dark-shade, #0f1012) !important; --bazis-color-shade-rgb: var(--bazis-color-dark-shade-rgb, 15, 16, 18) !important; --bazis-color-tint: var(--bazis-color-dark-tint, #292a2c) !important; } .bazis-bg-base { --bazis-bg-base: var(--bazis-background) !important; --bazis-bg-base-rgb: var(--bazis-background-rgb) !important; } .bazis-bg-light { --bazis-bg-base: var(--bazis-background-light, var(--bazis-background)) !important; --bazis-bg-base-rgb: var(--bazis-background-light-rgb, var(--bazis-background-rgb)) !important; } .bazis-bg-medium { --bazis-bg-base: var(--bazis-background-medium) !important; --bazis-bg-base-rgb: var(--bazis-background-medium-rgb) !important; } .bazis-bg-dark { --bazis-bg-base: var(--bazis-background-dark) !important; --bazis-bg-base-rgb: var(--bazis-background-dark-rgb) !important; } .bazis-bg-accent { --bazis-bg-base: var(--bazis-background-accent) !important; --bazis-bg-base-rgb: var(--bazis-background-accent-rgb) !important; } body { background: var(--bazis-background); } body.bazis-backdrop-no-scroll { overflow: hidden; } @supports (padding-top: constant(safe-area-inset-top)) { html { --bazis-safe-area-top: constant(safe-area-inset-top); --bazis-safe-area-bottom: constant(safe-area-inset-bottom); --bazis-safe-area-left: constant(safe-area-inset-left); --bazis-safe-area-right: constant(safe-area-inset-right); } } @supports (padding-top: env(safe-area-inset-top)) { html { --bazis-safe-area-top: env(safe-area-inset-top); --bazis-safe-area-bottom: env(safe-area-inset-bottom); --bazis-safe-area-left: env(safe-area-inset-left); --bazis-safe-area-right: env(safe-area-inset-right); } } input::-webkit-date-and-time-value { text-align: start; } /* Basic CSS for apps built */ audio, canvas, progress, video { vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } b, strong { font-weight: bold; } img { max-width: 100%; border: 0; } svg:not(:root) { overflow: hidden; } figure { margin: 1em 40px; } hr { height: 1px; border-width: 0; box-sizing: content-box; } pre { overflow: auto; } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } label, input, select, textarea { font-family: inherit; line-height: normal; } textarea { overflow: auto; height: auto; font: inherit; color: inherit; } textarea::placeholder { padding-left: 2px; } form, input, optgroup, select { margin: 0; font: inherit; color: inherit; } html input[type=button], input[type=reset], input[type=submit] { cursor: pointer; -webkit-appearance: button; } a, a div, a span, button, button div, button span, [tappable], [tappable] div, [tappable] span, input, textarea { touch-action: manipulation; } button { border: 0; border-radius: 0; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: 1; text-transform: none; cursor: pointer; -webkit-appearance: button; } [tappable] { cursor: pointer; } a[disabled], button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input[type=checkbox], input[type=radio] { padding: 0; box-sizing: border-box; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { height: auto; } input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration { -webkit-appearance: none; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } * { box-sizing: border-box; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } html { width: 100%; height: 100%; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; overflow: auto; scroll-behavior: smooth; } body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; margin-left: 0; margin-right: 0; margin-top: 0; margin-bottom: 0; padding-left: 0; padding-right: 0; padding-top: 0; padding-bottom: 0; height: 100%; } .bazis-container, .bazis-message-plane { /* * @prop --max-width-container: максимальная ширина контента * @prop --padding-side: высчитываемая величина внутренних начального и конечного отступов */ padding: 0 calc(50% - 680px); --padding-side: calc(var(--max-width-container) / 2); padding: 0 calc(50% - var(--padding-side)); } .bazis-container::after, .bazis-message-plane::after, .bazis-container::before, .bazis-message-plane::before { display: table; content: ""; clear: both; } .bazis-container_margin { margin-left: auto; margin-right: auto; max-width: var(--max-width-container); padding-left: 40px; padding-right: 40px; } .bazis-container, .bazis-message-plane, .bazis-container_margin { --max-width-container: 1440px; } @media (min-width: 1199.98px) { .bazis-container, .bazis-message-plane, .bazis-container_margin { --max-width-container: 1120px; } } @media (min-width: 1279.98px) { .bazis-container, .bazis-message-plane, .bazis-container_margin { --max-width-container: 1200px; } } @media (min-width: 1359.98px) { .bazis-container, .bazis-message-plane, .bazis-container_margin { --max-width-container: 1280px; } } @media (min-width: 1436px) { .bazis-container, .bazis-message-plane, .bazis-container_margin { --max-width-container: 1360px; } } @media (max-width: 1435px) { .bazis-container, .bazis-message-plane, .bazis-container_margin { padding: 0 40px; } } @media (max-width: 1024px) { .bazis-container, .bazis-message-plane, .bazis-container_margin { padding: 0 32px; } } @media (max-width: 576.98px) { .bazis-container, .bazis-message-plane, .bazis-container_margin { padding: 0 20px; } } @media print { .bazis-container, .bazis-message-plane, .bazis-container_margin { padding: 0; } } hr { --margin-top: initial; --margin-bottom: initial; --border-color: var(--bazis-border-color); --border-style: solid; border-width: 1px 0 0; border-color: var(--border-color); border-style: var(--border-style); height: 0; margin-top: var(--margin-top, calc(var(--bazis-multiple-px) * 8)); margin-bottom: var(--margin-bottom, calc(var(--bazis-multiple-px) * 8)); } section hr { --margin-top: calc(var(--bazis-multiple-px) * 6); --margin-bottom: calc(var(--bazis-multiple-px) * 6); } section hr.bazis-hr_no-top { --margin-top: 0; } * { scrollbar-color: var(--bazis-background-dark) var(--bazis-border-color-dark); scrollbar-width: thin; } *::-webkit-scrollbar, ::-webkit-scrollbar { -webkit-appearance: none; -webkit-overflow-scrolling: auto; width: 4px; height: 4px; } *::-webkit-scrollbar-track, ::-webkit-scrollbar-track { -webkit-box-shadow: none; border-radius: var(--bazis-border-radius); background: var(--bazis-background-dark); } *::-webkit-scrollbar-track:horizontal, ::-webkit-scrollbar-track:horizontal { -webkit-box-shadow: none; } *::-webkit-scrollbar-thumb, ::-webkit-scrollbar-thumb { border-radius: var(--bazis-border-radius); background: var(--bazis-border-color-dark); } html { font-family: var(--bazis-font-family); font-weight: 400; font-size: var(--bazis-font-size); line-height: var(--bazis-line-height); color: var(--bazis-text-color); } h1, .bazis-h1 { margin: var(--bazis-h1-margin); font-size: var(--bazis-font-size-h1); line-height: var(--bazis-line-height-h1); } .bazis-h1_major { margin: var(--bazis-h1-margin-major); font-size: var(--bazis-font-size-h1-major); line-height: var(--bazis-line-height-h1-major); } .bazis-h1_minor { margin: var(--bazis-h1-margin-minor); font-size: var(--bazis-font-size-h1-minor); line-height: var(--bazis-line-height-h1-minor); } h2, .bazis-h2 { margin: var(--bazis-h2-margin); font-size: var(--bazis-font-size-h2); line-height: var(--bazis-line-height-h2); } .bazis-h2_major { margin: var(--bazis-h2-margin-major); font-size: var(--bazis-font-size-h2-major); line-height: var(--bazis-line-height-h2-major); } .bazis-h2_minor { margin: var(--bazis-h2-margin-minor); font-size: var(--bazis-font-size-h2-minor); line-height: var(--bazis-line-height-h2-minor); } h3, .bazis-h3 { margin: var(--bazis-h3-margin); font-size: var(--bazis-font-size-h3); line-height: var(--bazis-line-height-h3); } .bazis-h3_major { margin: var(--bazis-h3-margin-major); font-size: var(--bazis-font-size-h3-major); line-height: var(--bazis-line-height-h3-major); } .bazis-h3_minor { margin: var(--bazis-h3-margin-minor); font-size: var(--bazis-font-size-h3-minor); line-height: var(--bazis-line-height-h3-minor); } h4, .bazis-h4 { margin: var(--bazis-h4-margin); font-size: var(--bazis-font-size-h4); line-height: var(--bazis-line-height-h4); } .bazis-h4_major { margin: var(--bazis-h4-margin-major); font-size: var(--bazis-font-size-h4-major); line-height: var(--bazis-line-height-h4-major); } .bazis-h4_minor { margin: var(--bazis-h4-margin-minor); font-size: var(--bazis-font-size-h4-minor); line-height: var(--bazis-line-height-h4-minor); } h5, .bazis-h5 { margin: var(--bazis-h5-margin); font-size: var(--bazis-font-size-h5); line-height: var(--bazis-line-height-h5); } .bazis-h5_major { margin: var(--bazis-h5-margin-major); font-size: var(--bazis-font-size-h5-major); line-height: var(--bazis-line-height-h5-major); } .bazis-h5_minor { margin: var(--bazis-h5-margin-minor); font-size: var(--bazis-font-size-h5-minor); line-height: var(--bazis-line-height-h5-minor); } h6, .bazis-h6 { margin: var(--bazis-h6-margin); font-size: var(--bazis-font-size-h6); line-height: var(--bazis-line-height-h6); } .bazis-h6_major { margin: var(--bazis-h6-margin-major); font-size: var(--bazis-font-size-h6-major); line-height: var(--bazis-line-height-h6-major); } .bazis-h6_minor { margin: var(--bazis-h6-margin-minor); font-size: var(--bazis-font-size-h6-minor); line-height: var(--bazis-line-height-h6-minor); } p, .bazis-p { margin: var(--bazis-p-margin); font-size: var(--bazis-font-size-p); line-height: var(--bazis-line-height-p); } .bazis-p_major { margin: var(--bazis-p-margin-major); font-size: var(--bazis-font-size-p-major); line-height: var(--bazis-line-height-p-major); } .bazis-p_minor { margin: var(--bazis-p-margin-minor); font-size: var(--bazis-font-size-p-minor); line-height: var(--bazis-line-height-p-minor); } small { font-size: 75%; } .bazis-small, .bazis-small_uppercase { font-size: var(--bazis-font-size-small); line-height: var(--bazis-line-height-small); } .bazis-small_uppercase { text-transform: uppercase; } sub, sup { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } a { background-color: transparent; color: var(--bazis-link-color); } .bazis-text_action, .sl-text_inner a { color: var(--bazis-color-action); } .bazis-text_secondary { color: var(--bazis-text-color-secondary); } .bazis-text_placeholder { color: var(--bazis-placeholder-color); } .bazis-text_major { font-size: var(--bazis-font-size-p-major); line-height: var(--bazis-line-height-p-major); } .bazis-text_minor { font-size: var(--bazis-font-size-p-minor); line-height: var(--bazis-line-height-p-minor); } /* Optional CSS utils that can be commented out */ .bh-block { display: block; } .bh-inline { display: inline; } .bh-inline-block { display: inline-block; } .bh-display-table { display: table; } .bh-flex, .bh-flex-column-reverse, .bh-flex-row-revers, .bh-flex-column { display: flex; } .bh-inline-flex { display: inline-flex; } .bh-display-grid { display: grid; } .bh-hide { display: none !important; } .bh-contents { display: contents; } .bh-hidden { visibility: hidden; } @media screen and (min-width: 576.98px) { .bh-hide-sm-up { display: none !important; } } @media screen and (max-width: 576px) { .bh-hide-sm-down { display: none !important; } } @media screen and (min-width: 768.98px) { .bh-hide-md-up { display: none !important; } } @media screen and (max-width: 768px) { .bh-hide-md-down { display: none !important; } } @media screen and (min-width: 992.98px) { .bh-hide-lg-up { display: none !important; } } @media screen and (max-width: 992px) { .bh-hide-lg-down { display: none !important; } } @media screen and (min-width: 1024.98px) { .bh-hide-xl-up { display: none !important; } } @media screen and (max-width: 1024px) { .bh-hide-xl-down { display: none !important; } } @media screen and (min-width: 1280.98px) { .bh-hide-xxl-up { display: none !important; } } @media screen and (max-width: 1280px) { .bh-hide-xxl-down { display: none !important; } } @media screen and (min-width: 576.98px) and (max-width: 768px) { .bh-hide-sm-md { display: none !important; } } @media screen and (min-width: 576.98px) and (max-width: 992px) { .bh-hide-sm-lg { display: none !important; } } @media screen and (min-width: 576.98px) and (max-width: 1024px) { .bh-hide-sm-xl { display: none !important; } } @media screen and (min-width: 576.98px) and (max-width: 1280px) { .bh-hide-sm-xxl { display: none !important; } } @media screen and (min-width: 768.98px) and (max-width: 992px) { .bh-hide-md-lg { display: none !important; } } @media screen and (min-width: 768.98px) and (max-width: 1024px) { .bh-hide-md-xl { display: none !important; } } @media screen and (min-width: 768.98px) and (max-width: 1280px) { .bh-hide-md-xxl { display: none !important; } } @media screen and (min-width: 992.98px) and (max-width: 1024px) { .bh-hide-lg-xl { display: none !important; } } @media screen and (min-width: 992.98px) and (max-width: 1280px) { .bh-hide-lg-xxl { display: none !important; } } @media screen and (min-width: 1024.98px) and (max-width: 1280px) { .bh-hide-xl-xxl { display: none !important; } } @media print { .bh-hide-print { display: none !important; } } @media (min-device-width: 576.98px) { .bh-hide-device-sm-up { display: none !important; } } @media (max-device-width: 576px) { .bh-hide-device-sm-down { display: none !important; } } @media (min-device-width: 768.98px) { .bh-hide-device-md-up { display: none !important; } } @media (max-device-width: 768px) { .bh-hide-device-md-down { display: none !important; } } @media (min-device-width: 992.98px) { .bh-hide-device-lg-up { display: none !important; } } @media (max-device-width: 992px) { .bh-hide-device-lg-down { display: none !important; } } @media (min-device-width: 1024.98px) { .bh-hide-device-xl-up { display: none !important; } } @media (max-device-width: 1024px) { .bh-hide-device-xl-down { display: none !important; } } @media (min-device-width: 1280.98px) { .bh-hide-device-xxl-up { display: none !important; } } @media (max-device-width: 1280px) { .bh-hide-device-xxl-down { display: none !important; } } /* смартфоны, устройства с сенсорным экраном, с которым работают пальцами */ @media (hover: none) and (pointer: coarse) { .bh-hide-touch-device { display: none !important; } } /* мышь, тачпад */ @media (hover: hover) and (pointer: fine) { .bh-hide-cursor-device { display: none !important; } } /* устройства с сенсорным экраном, с которым работают стилусом */ @media (hover: none) and (pointer: fine) { /* ... */ } .bh-align-self-start { align-self: flex-start !important; } .bh-align-self-end { align-self: flex-end !important; } .bh-align-self-center { align-self: center !important; } .bh-align-self-stretch { align-self: stretch !important; } .bh-align-self-baseline { align-self: baseline !important; } .bh-align-self-auto { align-self: auto !important; } .bh-flex-wrap { flex-wrap: wrap !important; } .bh-flex-nowrap { flex-wrap: nowrap !important; } .bh-flex-wrap-reverse { flex-wrap: wrap-reverse !important; } .bh-justify-content-start { justify-content: flex-start !important; } .bh-justify-content-center { justify-content: center !important; } .bh-justify-content-end { justify-content: flex-end !important; } .bh-justify-content-around { justify-content: space-around !important; } .bh-justify-content-between { justify-content: space-between !important; } .bh-justify-content-evenly { justify-content: space-evenly !important; } .bh-align-items-start { align-items: flex-start !important; } .bh-align-items-center { align-items: center !important; } .bh-align-items-end { align-items: flex-end !important; } .bh-align-items-stretch { align-items: stretch !important; } .bh-align-items-baseline { align-items: baseline !important; } .bh-shrink { flex-shrink: 0; } .bh-flex-row { flex-direction: row; } .bh-flex-column { flex-direction: column; } .bh-flex-row-revers { flex-direction: row-reverse; } .bh-flex-column-reverse { flex-direction: column-reverse; } .bh-float-left { float: left !important; } .bh-float-right { float: right !important; } .bh-float-start { float: left !important; } [dir=rtl] .bh-float-start, :host-context([dir=rtl]) .bh-float-start { float: right !important; } .bh-float-end { float: right !important; } [dir=rtl] .bh-float-end, :host-context([dir=rtl]) .bh-float-end { float: left !important; } @media (min-width: 576.98px) { .bh-float-sm-left { float: left !important; } .bh-float-sm-right { float: right !important; } .bh-float-sm-start { float: left !important; } [dir=rtl] .bh-float-sm-start, :host-context([dir=rtl]) .bh-float-sm-start { float: right !important; } .bh-float-sm-end { float: right !important; } [dir=rtl] .bh-float-sm-end, :host-context([dir=rtl]) .bh-float-sm-end { float: left !important; } } @media (min-width: 768px) { .bh-float-md-left { float: left !important; } .bh-float-md-right { float: right !important; } .bh-float-md-start { float: left !important; } [dir=rtl] .bh-float-md-start, :host-context([dir=rtl]) .bh-float-md-start { float: right !important; } .bh-float-md-end { float: right !important; } [dir=rtl] .bh-float-md-end, :host-context([dir=rtl]) .bh-float-md-end { float: left !important; } } @media (min-width: 992px) { .bh-float-lg-left { float: left !important; } .bh-float-lg-right { float: right !important; } .bh-float-lg-start { float: left !important; } [dir=rtl] .bh-float-lg-start, :host-context([dir=rtl]) .bh-float-lg-start { float: right !important; } .bh-float-lg-end { float: right !important; } [dir=rtl] .bh-float-lg-end, :host-context([dir=rtl]) .bh-float-lg-end { float: left !important; } } @media (min-width: 1024.98px) { .bh-float-xl-left { float: left !important; } .bh-float-xl-right { float: right !important; } .bh-float-xl-start { float: left !important; } [dir=rtl] .bh-float-xl-start, :host-context([dir=rtl]) .bh-float-xl-start { float: right !important; } .bh-float-xl-end { float: right !important; } [dir=rtl] .bh-float-xl-end, :host-context([dir=rtl]) .bh-float-xl-end { float: left !important; } } @media (min-width: 1200px) { .bh-float-xxl-left { float: left !important; } .bh-float-xxl-right { float: right !important; } .bh-float-xxl-start { float: left !important; } [dir=rtl] .bh-float-xxl-start, :host-context([dir=rtl]) .bh-float-xxl-start { float: right !important; } .bh-float-xxl-end { float: right !important; } [dir=rtl] .bh-float-xxl-end, :host-context([dir=rtl]) .bh-float-xxl-end { float: left !important; } } .bh-font-normal { font-weight: 400; } .bh-font-medium { font-weight: 500; } .bh-font-bold { font-weight: 700; } .bh-line-elements { --margin-end: calc(var(--bazis-multiple-px) * 4); } .bh-line-elements > * { margin-right: var(--margin-end); } .bh-line-elements > *:last-child { margin-right: 0; } .bh-no-padding { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; padding-left: 0 !important; padding-right: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; } .bh-padding-1x { --bazis-padding: calc(var(--bazis-multiple-px) * 1); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-1x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-top-1x { --bazis-padding: calc(var(--bazis-multiple-px) * 1); --padding-top: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; } .bh-padding-start-1x { --bazis-padding: calc(var(--bazis-multiple-px) * 1); --padding-start: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-start-1x { padding-left: unset; padding-inline-start: var(--bazis-padding, 12px) !important; } } .bh-padding-end-1x { --bazis-padding: calc(var(--bazis-multiple-px) * 1); --padding-end: var(--bazis-padding, 12px); padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-end-1x { padding-right: unset; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-bottom-1x { --bazis-padding: calc(var(--bazis-multiple-px) * 1); --padding-bottom: var(--bazis-padding, 12px); padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-vertical-1x { --bazis-padding: calc(var(--bazis-multiple-px) * 1); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-horizontal-1x { --bazis-padding: calc(var(--bazis-multiple-px) * 1); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-horizontal-1x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-2x { --bazis-padding: calc(var(--bazis-multiple-px) * 2); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-2x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-top-2x { --bazis-padding: calc(var(--bazis-multiple-px) * 2); --padding-top: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; } .bh-padding-start-2x { --bazis-padding: calc(var(--bazis-multiple-px) * 2); --padding-start: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-start-2x { padding-left: unset; padding-inline-start: var(--bazis-padding, 12px) !important; } } .bh-padding-end-2x { --bazis-padding: calc(var(--bazis-multiple-px) * 2); --padding-end: var(--bazis-padding, 12px); padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-end-2x { padding-right: unset; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-bottom-2x { --bazis-padding: calc(var(--bazis-multiple-px) * 2); --padding-bottom: var(--bazis-padding, 12px); padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-vertical-2x { --bazis-padding: calc(var(--bazis-multiple-px) * 2); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-horizontal-2x { --bazis-padding: calc(var(--bazis-multiple-px) * 2); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-horizontal-2x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-3x { --bazis-padding: calc(var(--bazis-multiple-px) * 3); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-3x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-top-3x { --bazis-padding: calc(var(--bazis-multiple-px) * 3); --padding-top: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; } .bh-padding-start-3x { --bazis-padding: calc(var(--bazis-multiple-px) * 3); --padding-start: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-start-3x { padding-left: unset; padding-inline-start: var(--bazis-padding, 12px) !important; } } .bh-padding-end-3x { --bazis-padding: calc(var(--bazis-multiple-px) * 3); --padding-end: var(--bazis-padding, 12px); padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-end-3x { padding-right: unset; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-bottom-3x { --bazis-padding: calc(var(--bazis-multiple-px) * 3); --padding-bottom: var(--bazis-padding, 12px); padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-vertical-3x { --bazis-padding: calc(var(--bazis-multiple-px) * 3); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-horizontal-3x { --bazis-padding: calc(var(--bazis-multiple-px) * 3); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-horizontal-3x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-4x { --bazis-padding: calc(var(--bazis-multiple-px) * 4); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-4x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-top-4x { --bazis-padding: calc(var(--bazis-multiple-px) * 4); --padding-top: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; } .bh-padding-start-4x { --bazis-padding: calc(var(--bazis-multiple-px) * 4); --padding-start: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-start-4x { padding-left: unset; padding-inline-start: var(--bazis-padding, 12px) !important; } } .bh-padding-end-4x { --bazis-padding: calc(var(--bazis-multiple-px) * 4); --padding-end: var(--bazis-padding, 12px); padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-end-4x { padding-right: unset; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-bottom-4x { --bazis-padding: calc(var(--bazis-multiple-px) * 4); --padding-bottom: var(--bazis-padding, 12px); padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-vertical-4x { --bazis-padding: calc(var(--bazis-multiple-px) * 4); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-horizontal-4x { --bazis-padding: calc(var(--bazis-multiple-px) * 4); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-horizontal-4x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-5x { --bazis-padding: calc(var(--bazis-multiple-px) * 5); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-5x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-top-5x { --bazis-padding: calc(var(--bazis-multiple-px) * 5); --padding-top: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; } .bh-padding-start-5x { --bazis-padding: calc(var(--bazis-multiple-px) * 5); --padding-start: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-start-5x { padding-left: unset; padding-inline-start: var(--bazis-padding, 12px) !important; } } .bh-padding-end-5x { --bazis-padding: calc(var(--bazis-multiple-px) * 5); --padding-end: var(--bazis-padding, 12px); padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-end-5x { padding-right: unset; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-bottom-5x { --bazis-padding: calc(var(--bazis-multiple-px) * 5); --padding-bottom: var(--bazis-padding, 12px); padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-vertical-5x { --bazis-padding: calc(var(--bazis-multiple-px) * 5); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-horizontal-5x { --bazis-padding: calc(var(--bazis-multiple-px) * 5); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-horizontal-5x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-6x { --bazis-padding: calc(var(--bazis-multiple-px) * 6); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-6x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-top-6x { --bazis-padding: calc(var(--bazis-multiple-px) * 6); --padding-top: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; } .bh-padding-start-6x { --bazis-padding: calc(var(--bazis-multiple-px) * 6); --padding-start: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-start-6x { padding-left: unset; padding-inline-start: var(--bazis-padding, 12px) !important; } } .bh-padding-end-6x { --bazis-padding: calc(var(--bazis-multiple-px) * 6); --padding-end: var(--bazis-padding, 12px); padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-end-6x { padding-right: unset; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-bottom-6x { --bazis-padding: calc(var(--bazis-multiple-px) * 6); --padding-bottom: var(--bazis-padding, 12px); padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-vertical-6x { --bazis-padding: calc(var(--bazis-multiple-px) * 6); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-horizontal-6x { --bazis-padding: calc(var(--bazis-multiple-px) * 6); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-horizontal-6x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-7x { --bazis-padding: calc(var(--bazis-multiple-px) * 7); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-7x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-top-7x { --bazis-padding: calc(var(--bazis-multiple-px) * 7); --padding-top: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; } .bh-padding-start-7x { --bazis-padding: calc(var(--bazis-multiple-px) * 7); --padding-start: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-start-7x { padding-left: unset; padding-inline-start: var(--bazis-padding, 12px) !important; } } .bh-padding-end-7x { --bazis-padding: calc(var(--bazis-multiple-px) * 7); --padding-end: var(--bazis-padding, 12px); padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-end-7x { padding-right: unset; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-bottom-7x { --bazis-padding: calc(var(--bazis-multiple-px) * 7); --padding-bottom: var(--bazis-padding, 12px); padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-vertical-7x { --bazis-padding: calc(var(--bazis-multiple-px) * 7); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-horizontal-7x { --bazis-padding: calc(var(--bazis-multiple-px) * 7); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-horizontal-7x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-8x { --bazis-padding: calc(var(--bazis-multiple-px) * 8); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-8x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-top-8x { --bazis-padding: calc(var(--bazis-multiple-px) * 8); --padding-top: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; } .bh-padding-start-8x { --bazis-padding: calc(var(--bazis-multiple-px) * 8); --padding-start: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-start-8x { padding-left: unset; padding-inline-start: var(--bazis-padding, 12px) !important; } } .bh-padding-end-8x { --bazis-padding: calc(var(--bazis-multiple-px) * 8); --padding-end: var(--bazis-padding, 12px); padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-end-8x { padding-right: unset; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-padding-bottom-8x { --bazis-padding: calc(var(--bazis-multiple-px) * 8); --padding-bottom: var(--bazis-padding, 12px); padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-vertical-8x { --bazis-padding: calc(var(--bazis-multiple-px) * 8); --padding-top: var(--bazis-padding, 12px); --padding-bottom: var(--bazis-padding, 12px); padding-top: var(--bazis-padding, 12px) !important; padding-bottom: var(--bazis-padding, 12px) !important; } .bh-padding-horizontal-8x { --bazis-padding: calc(var(--bazis-multiple-px) * 8); --padding-start: var(--bazis-padding, 12px); --padding-end: var(--bazis-padding, 12px); padding-left: var(--bazis-padding, 12px) !important; padding-right: var(--bazis-padding, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-padding-horizontal-8x { padding-left: unset; padding-right: unset; padding-inline-start: var(--bazis-padding, 12px) !important; padding-inline-end: var(--bazis-padding, 12px) !important; } } .bh-no-margin { --margin-start: 0 !important; --margin-end: 0 !important; --margin-top: 0 !important; --margin-bottom: 0 !important; margin-left: 0; margin-right: 0; margin-top: 0; margin-bottom: 0; } .bh-margin-1x { --bazis-margin: calc(var(--bazis-multiple-px) * 1); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-1x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-top-1x { --bazis-margin: calc(var(--bazis-multiple-px) * 1); --margin-top: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; } .bh-margin-start-1x { --bazis-margin: calc(var(--bazis-multiple-px) * 1); --margin-start: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-start-1x { margin-left: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; } } .bh-margin-end-1x { --bazis-margin: calc(var(--bazis-multiple-px) * 1); --margin-end: var(--bazis-margin, 12px); margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-end-1x { margin-right: unset !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-bottom-1x { --bazis-margin: calc(var(--bazis-multiple-px) * 1); --margin-bottom: var(--bazis-margin, 12px); margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-vertical-1x { --bazis-margin: calc(var(--bazis-multiple-px) * 1); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-horizontal-1x { --bazis-margin: calc(var(--bazis-multiple-px) * 1); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-horizontal-1x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-2x { --bazis-margin: calc(var(--bazis-multiple-px) * 2); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-2x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-top-2x { --bazis-margin: calc(var(--bazis-multiple-px) * 2); --margin-top: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; } .bh-margin-start-2x { --bazis-margin: calc(var(--bazis-multiple-px) * 2); --margin-start: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-start-2x { margin-left: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; } } .bh-margin-end-2x { --bazis-margin: calc(var(--bazis-multiple-px) * 2); --margin-end: var(--bazis-margin, 12px); margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-end-2x { margin-right: unset !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-bottom-2x { --bazis-margin: calc(var(--bazis-multiple-px) * 2); --margin-bottom: var(--bazis-margin, 12px); margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-vertical-2x { --bazis-margin: calc(var(--bazis-multiple-px) * 2); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-horizontal-2x { --bazis-margin: calc(var(--bazis-multiple-px) * 2); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-horizontal-2x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-3x { --bazis-margin: calc(var(--bazis-multiple-px) * 3); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-3x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-top-3x { --bazis-margin: calc(var(--bazis-multiple-px) * 3); --margin-top: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; } .bh-margin-start-3x { --bazis-margin: calc(var(--bazis-multiple-px) * 3); --margin-start: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-start-3x { margin-left: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; } } .bh-margin-end-3x { --bazis-margin: calc(var(--bazis-multiple-px) * 3); --margin-end: var(--bazis-margin, 12px); margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-end-3x { margin-right: unset !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-bottom-3x { --bazis-margin: calc(var(--bazis-multiple-px) * 3); --margin-bottom: var(--bazis-margin, 12px); margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-vertical-3x { --bazis-margin: calc(var(--bazis-multiple-px) * 3); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-horizontal-3x { --bazis-margin: calc(var(--bazis-multiple-px) * 3); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-horizontal-3x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-4x { --bazis-margin: calc(var(--bazis-multiple-px) * 4); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-4x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-top-4x { --bazis-margin: calc(var(--bazis-multiple-px) * 4); --margin-top: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; } .bh-margin-start-4x { --bazis-margin: calc(var(--bazis-multiple-px) * 4); --margin-start: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-start-4x { margin-left: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; } } .bh-margin-end-4x { --bazis-margin: calc(var(--bazis-multiple-px) * 4); --margin-end: var(--bazis-margin, 12px); margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-end-4x { margin-right: unset !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-bottom-4x { --bazis-margin: calc(var(--bazis-multiple-px) * 4); --margin-bottom: var(--bazis-margin, 12px); margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-vertical-4x { --bazis-margin: calc(var(--bazis-multiple-px) * 4); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-horizontal-4x { --bazis-margin: calc(var(--bazis-multiple-px) * 4); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-horizontal-4x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-5x { --bazis-margin: calc(var(--bazis-multiple-px) * 5); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-5x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-top-5x { --bazis-margin: calc(var(--bazis-multiple-px) * 5); --margin-top: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; } .bh-margin-start-5x { --bazis-margin: calc(var(--bazis-multiple-px) * 5); --margin-start: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-start-5x { margin-left: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; } } .bh-margin-end-5x { --bazis-margin: calc(var(--bazis-multiple-px) * 5); --margin-end: var(--bazis-margin, 12px); margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-end-5x { margin-right: unset !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-bottom-5x { --bazis-margin: calc(var(--bazis-multiple-px) * 5); --margin-bottom: var(--bazis-margin, 12px); margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-vertical-5x { --bazis-margin: calc(var(--bazis-multiple-px) * 5); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-horizontal-5x { --bazis-margin: calc(var(--bazis-multiple-px) * 5); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-horizontal-5x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-6x { --bazis-margin: calc(var(--bazis-multiple-px) * 6); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-6x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-top-6x { --bazis-margin: calc(var(--bazis-multiple-px) * 6); --margin-top: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; } .bh-margin-start-6x { --bazis-margin: calc(var(--bazis-multiple-px) * 6); --margin-start: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-start-6x { margin-left: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; } } .bh-margin-end-6x { --bazis-margin: calc(var(--bazis-multiple-px) * 6); --margin-end: var(--bazis-margin, 12px); margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-end-6x { margin-right: unset !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-bottom-6x { --bazis-margin: calc(var(--bazis-multiple-px) * 6); --margin-bottom: var(--bazis-margin, 12px); margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-vertical-6x { --bazis-margin: calc(var(--bazis-multiple-px) * 6); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-horizontal-6x { --bazis-margin: calc(var(--bazis-multiple-px) * 6); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-horizontal-6x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-7x { --bazis-margin: calc(var(--bazis-multiple-px) * 7); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-7x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-top-7x { --bazis-margin: calc(var(--bazis-multiple-px) * 7); --margin-top: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; } .bh-margin-start-7x { --bazis-margin: calc(var(--bazis-multiple-px) * 7); --margin-start: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-start-7x { margin-left: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; } } .bh-margin-end-7x { --bazis-margin: calc(var(--bazis-multiple-px) * 7); --margin-end: var(--bazis-margin, 12px); margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-end-7x { margin-right: unset !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-bottom-7x { --bazis-margin: calc(var(--bazis-multiple-px) * 7); --margin-bottom: var(--bazis-margin, 12px); margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-vertical-7x { --bazis-margin: calc(var(--bazis-multiple-px) * 7); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-horizontal-7x { --bazis-margin: calc(var(--bazis-multiple-px) * 7); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-horizontal-7x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-8x { --bazis-margin: calc(var(--bazis-multiple-px) * 8); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-8x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-top-8x { --bazis-margin: calc(var(--bazis-multiple-px) * 8); --margin-top: var(--bazis-margin, 12px) !important; margin-top: var(--bazis-margin, 12px) !important; } .bh-margin-start-8x { --bazis-margin: calc(var(--bazis-multiple-px) * 8); --margin-start: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-start-8x { margin-left: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; } } .bh-margin-end-8x { --bazis-margin: calc(var(--bazis-multiple-px) * 8); --margin-end: var(--bazis-margin, 12px); margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-end-8x { margin-right: unset !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-margin-bottom-8x { --bazis-margin: calc(var(--bazis-multiple-px) * 8); --margin-bottom: var(--bazis-margin, 12px); margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-vertical-8x { --bazis-margin: calc(var(--bazis-multiple-px) * 8); --margin-top: var(--bazis-margin, 12px); --margin-bottom: var(--bazis-margin, 12px); margin-top: var(--bazis-margin, 12px) !important; margin-bottom: var(--bazis-margin, 12px) !important; } .bh-margin-horizontal-8x { --bazis-margin: calc(var(--bazis-multiple-px) * 8); --margin-start: var(--bazis-margin, 12px); --margin-end: var(--bazis-margin, 12px); margin-left: var(--bazis-margin, 12px) !important; margin-right: var(--bazis-margin, 12px) !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bh-margin-horizontal-8x { margin-left: unset !important; margin-right: unset !important; margin-inline-start: var(--bazis-margin, 12px) !important; margin-inline-end: var(--bazis-margin, 12px) !important; } } .bh-text-center { text-align: center !important; } .bh-text-justify { text-align: justify !important; } .bh-text-start { text-align: start !important; } .bh-text-end { text-align: end !important; } .bh-text-left { text-align: left !important; } .bh-text-right { text-align: right !important; } .bh-text-nowrap { white-space: nowrap !important; } .bh-text-wrap { white-space: normal !important; } .bh-text-prewrap { white-space: pre-wrap !important; } @media (min-width: 576.98px) { .bh-text-sm-center { text-align: center !important; } .bh-text-sm-justify { text-align: justify !important; } .bh-text-sm-start { text-align: start !important; } .bh-text-sm-end { text-align: end !important; } .bh-text-sm-left { text-align: left !important; } .bh-text-sm-right { text-align: right !important; } .bh-text-sm-nowrap { white-space: nowrap !important; } .bh-text-sm-wrap { white-space: normal !important; } .bh-text-sm-prewrap { white-space: pre-wrap !important; } } @media (min-width: 768px) { .bh-text-md-center { text-align: center !important; } .bh-text-md-justify { text-align: justify !important; } .bh-text-md-start { text-align: start !important; } .bh-text-md-end { text-align: end !important; } .bh-text-md-left { text-align: left !important; } .bh-text-md-right { text-align: right !important; } .bh-text-md-nowrap { white-space: nowrap !important; } .bh-text-md-wrap { white-space: normal !important; } .bh-text-md-prewrap { white-space: pre-wrap !important; } } @media (min-width: 992px) { .bh-text-lg-center { text-align: center !important; } .bh-text-lg-justify { text-align: justify !important; } .bh-text-lg-start { text-align: start !important; } .bh-text-lg-end { text-align: end !important; } .bh-text-lg-left { text-align: left !important; } .bh-text-lg-right { text-align: right !important; } .bh-text-lg-nowrap { white-space: nowrap !important; } .bh-text-lg-wrap { white-space: normal !important; } .bh-text-lg-prewrap { white-space: pre-wrap !important; } } @media (min-width: 1200px) { .bh-text-xl-center { text-align: center !important; } .bh-text-xl-justify { text-align: justify !important; } .bh-text-xl-start { text-align: start !important; } .bh-text-xl-end { text-align: end !important; } .bh-text-xl-left { text-align: left !important; } .bh-text-xl-right { text-align: right !important; } .bh-text-xl-nowrap { white-space: nowrap !important; } .bh-text-xl-wrap { white-space: normal !important; } .bh-text-xl-prewrap { white-space: pre-wrap !important; } } .bh-text-overline { text-decoration: overline !important; } .bh-text-underline { text-decoration: underline !important; } .bh-text-decornone { text-decoration: none !important; } .bh-text-dotted { border-bottom: 1px dotted currentColor !important; } .bh-text-dashed { border-bottom: 1px dashed currentColor !important; } .bh-text-line-through { text-decoration: line-through !important; } @media (min-width: 576px) { .bh-text-sm-overline { text-decoration: overline !important; } .bh-text-sm-underline { text-decoration: underline !important; } .bh-text-sm-decornone { text-decoration: none !important; } .bh-text-sm-dotted { border-bottom: 1px dotted currentColor !important; } .bh-text-sm-dashed { border-bottom: 1px dashed currentColor !important; } .bh-text-sm-line-through { text-decoration: line-through !important; } } @media (min-width: 768px) { .bh-text-md-overline { text-decoration: overline !important; } .bh-text-md-underline { text-decoration: underline !important; } .bh-text-md-decornone { text-decoration: none !important; } .bh-text-md-dotted { border-bottom: 1px dotted currentColor !important; } .bh-text-md-dashed { border-bottom: 1px dashed currentColor !important; } .bh-text-md-line-through { text-decoration: line-through !important; } } @media (min-width: 992px) { .bh-text-lg-overline { text-decoration: overline !important; } .bh-text-lg-underline { text-decoration: underline !important; } .bh-text-lg-decornone { text-decoration: none !important; } .bh-text-lg-dotted { border-bottom: 1px dotted currentColor !important; } .bh-text-lg-dashed { border-bottom: 1px dashed currentColor !important; } .bh-text-lg-line-through { text-decoration: line-through !important; } } @media (min-width: 1200px) { .bh-text-xl-overline { text-decoration: overline !important; } .bh-text-xl-underline { text-decoration: underline !important; } .bh-text-xl-decornone { text-decoration: none !important; } .bh-text-xl-dotted { border-bottom: 1px dotted currentColor !important; } .bh-text-xl-dashed { border-bottom: 1px dashed currentColor !important; } .bh-text-xl-line-through { text-decoration: line-through !important; } } .bh-text-uppercase { /* stylelint-disable-next-line declaration-no-important */ text-transform: uppercase !important; } .bh-text-lowercase { /* stylelint-disable-next-line declaration-no-important */ text-transform: lowercase !important; } .bh-text-capitalize { /* stylelint-disable-next-line declaration-no-important */ text-transform: capitalize !important; } @media (min-width: 576px) { .bh-text-sm-uppercase { /* stylelint-disable-next-line declaration-no-important */ text-transform: uppercase !important; } .bh-text-sm-lowercase { /* stylelint-disable-next-line declaration-no-important */ text-transform: lowercase !important; } .bh-text-sm-capitalize { /* stylelint-disable-next-line declaration-no-important */ text-transform: capitalize !important; } } @media (min-width: 768px) { .bh-text-md-uppercase { /* stylelint-disable-next-line declaration-no-important */ text-transform: uppercase !important; } .bh-text-md-lowercase { /* stylelint-disable-next-line declaration-no-important */ text-transform: lowercase !important; } .bh-text-md-capitalize { /* stylelint-disable-next-line declaration-no-important */ text-transform: capitalize !important; } } @media (min-width: 992px) { .bh-text-lg-uppercase { /* stylelint-disable-next-line declaration-no-important */ text-transform: uppercase !important; } .bh-text-lg-lowercase { /* stylelint-disable-next-line declaration-no-important */ text-transform: lowercase !important; } .bh-text-lg-capitalize { /* stylelint-disable-next-line declaration-no-important */ text-transform: capitalize !important; } } @media (min-width: 1200px) { .bh-text-xl-uppercase { /* stylelint-disable-next-line declaration-no-important */ text-transform: uppercase !important; } .bh-text-xl-lowercase { /* stylelint-disable-next-line declaration-no-important */ text-transform: lowercase !important; } .bh-text-xl-capitalize { /* stylelint-disable-next-line declaration-no-important */ text-transform: capitalize !important; } } .bh-pointer { cursor: pointer; } .bh-events-none { pointer-events: none; } .bh-opacity_1 { opacity: calc(1 / 10); } .bh-opacity_2 { opacity: calc(2 / 10); } .bh-opacity_3 { opacity: calc(3 / 10); } .bh-opacity_4 { opacity: calc(4 / 10); } .bh-opacity_5 { opacity: calc(5 / 10); } .bh-opacity_6 { opacity: calc(6 / 10); } .bh-opacity_7 { opacity: calc(7 / 10); } .bh-opacity_8 { opacity: calc(8 / 10); } .bh-opacity_9 { opacity: calc(9 / 10); } .bh-sticky { position: sticky; top: var(--bazis-sticky-top); bottom: var(--bazis-sticky-bottom); left: var(--bazis-sticky-start); right: var(--bazis-sticky-end); z-index: var(--bazis-sticky-z, 150); } .bh-popper-z-index { z-index: 1000; } .bh-bg { --background: var(--bazis-bg-base); background: var(--background); } .bh-relative { position: relative; } .bh-static { position: static; } .bh-overhide { overflow: hidden; } .bh-scroll { overflow: auto; } .bh-scroll-x { overflow-x: auto; overflow-y: hidden; } .bh-scroll-y { overflow-x: hidden; overflow-y: auto; } .bh-scroll_hidden::-webkit-scrollbar { display: none; } .bh-scroll_hidden-x::-webkit-scrollbar:horizontal { display: none; } .bh-scroll_hidden-y::-webkit-scrollbar:vertical { display: none; } .bh-scroll_hidden { -ms-overflow-style: none; /* IE и Edge */ scrollbar-width: none; /* Firefox */ } .bh-scroll_hidden-x { /* нет решения для мозиллы */ } .bh-scroll_hidden-y { margin-right: -14px; padding-right: 14px; } .bh-ellipsis, .sl-filter .bazis-tag > span { display: inline-block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } p.bh-ellipsis, h1.bh-ellipsis { display: block; } .bh-underconstruction { opacity: 0.5; cursor: not-allowed !important; } .bh-underconstruction *, .bh-underconstruction bazis-button::part(native) { pointer-events: none; cursor: not-allowed !important; } .bh-stop-scroll { position: fixed; left: 0; right: 0; padding-right: 4px; } .bh-word-break { word-break: break-all; } .bh-clear-left { clear: left; } @media screen and (max-width: 576px) { .bh-mobile-rtl-ellipsis { text-overflow: ellipsis; direction: rtl; text-align: left; } } /* Mixins */ /* Base Components of alphabet */ .bazis-accordion_doc .bazis-file-inline bazis-link { font-weight: 400; } .bazis-accordion_doc .bazis-dropdown { --top: 24px; --width: 250px; } .bazis-accordion_doc .bh-line-elements { --margin-end: var(--bazis-margin-2x); } .bazis-accordion_doc .bazis-btn_small bazis-link[slot=icon-only] { margin-left: -4px; margin-right: -4px; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bazis-accordion_doc .bazis-btn_small bazis-link[slot=icon-only] { margin-left: unset; margin-right: unset; margin-inline-start: -4px; margin-inline-end: -4px; } } .bazis-accordion_doc bazis-button bazis-icon { color: var(--bazis-text-color-secondary); } .bazis-alert { --top: initial; --bottom: initial; --left: initial; --right: initial; --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --min-width: initial; --width: initial; --max-width: initial; --min-height: initial; --height: initial; --max-height: initial; --background: initial; --color: inherit; top: var(--top); bottom: var(--bottom); left: var(--left); right: var(--right); position: fixed; z-index: 1100; display: flex; align-items: center; justify-content: center; } .bazis-alert__wrapper { padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); min-width: var(--min-width); width: var(--width); max-width: var(--max-width); min-height: var(--min-height); height: var(--height); max-height: var(--max-height); background: var(--background); color: var(--color); display: flex; outline: none; font-family: var(--bazis-font-family, inherit); } .bazis-alert__content { flex: 1; overflow: auto; } .bazis-alert__title { margin-bottom: var(--bazis-multiple-px); font-size: 22px; line-height: 32px; font-weight: 500; color: var(--bazis-text-color); } .bazis-alert__message { white-space: var(--white-space); font-size: 12px; font-weight: 400; line-height: 16px; color: var(--bazis-text-color-secondary); } .bazis-alert__message p { margin-top: var(--bazis-margin); font-size: 14px; line-height: 20px; } .bazis-alert__message p strong { font-weight: 500; } .bazis-alert__icon { flex-shrink: 0; position: relative; margin-left: var(--bazis-padding); padding-right: var(--bazis-padding-5x); } .bazis-alert__icon + .bazis-alert__content { padding-left: var(--bazis-padding-4x); border-left: 1px solid var(--bazis-border-color); } .bazis-alert__close { border: none; outline: 0; background: transparent; width: 20px; height: 20px; color: var(--bazis-placeholder-color); } .bazis-alert + .bazis-backdrop { --background: var(--bazis-background-medium); --opacity: 1; } .bazis-alert__buttons { display: flex; } .bazis-alert__buttons bazis-button { margin-top: 48px; } .bazis-alert__buttons bazis-button + bazis-button { margin-left: var(--bazis-margin); } @media (max-width: 1024px) { .bazis-alert { left: 20px; right: 20px; } .bazis-alert__content { width: 100%; } } @media (max-width: 640px) { .bazis-alert__buttons { flex-direction: column; gap: var(--bazis-margin-4x); } .bazis-alert__buttons bazis-button { margin-top: 24px; } .bazis-alert__buttons bazis-button + bazis-button { margin-left: 0; margin-top: 0; } } @media (max-width: 576px) { .bazis-alert { z-index: 1102; } .bazis-alert + .bazis-backdrop { z-index: 1101; } .bazis-alert__wrapper { flex-direction: column; align-items: center; padding: var(--bazis-padding-5x); } .bazis-alert__icon { padding-right: 0; margin-left: 0; margin-bottom: var(--bazis-margin-6x); } .bazis-alert__content { padding-left: 0; border-left: 0; text-align: center; } .bazis-alert__title { font-size: 18px; line-height: 24px; } .bazis-alert__message { font-size: 14px; line-height: 20px; color: var(--bazis-text-color); } .bazis-alert__close { display: none; } } .bazis-avatar, .sl-avatar_userpic { --width: initial; --height: initial; --background: initial; --color: inherit; --font-size: inherit; --font-weight: inherit; --line-height: initial; --border-radius: initial; --color-hover: var(--color); width: var(--width); height: var(--height); background: var(--background); color: var(--color); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); display: flex; align-items: center; justify-content: center; border-radius: var(--border-radius); } .bazis-avatar:hover, .sl-avatar_userpic:hover { color: var(--color-hover); } .bazis-avatar_small { width: calc(var(--width) / 2); height: calc(var(--width) / 2); } .bazis-backdrop { /* * @prop --background: фон подложки * @prop --opacity: прозрачность подложки */ --background: initial; --opacity: initial; position: fixed; z-index: 1000; top: 0; left: 0; right: 0; bottom: 0; width: 100vw; height: 100vh; background: var(--background); opacity: var(--opacity); } .bazis-block { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --min-width: initial; --width: initial; --max-width: initial; --background: initial; --color: inherit; --background-hover: var(--background); --border-color-hover: var(--border-color); --box-shadow-hover: var(--box-shadow); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); min-width: var(--min-width); width: var(--width); max-width: var(--max-width); background: var(--background); color: var(--color); } .bazis-block__content_start, .bazis-block__content_main, .bazis-block__content_end { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --min-width: initial; --width: initial; --max-width: initial; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); min-width: var(--min-width); width: var(--width); max-width: var(--max-width); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); position: relative; } .bazis-block__footer, .bazis-block__header { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --min-width: initial; --width: initial; --max-width: initial; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); min-width: var(--min-width); width: var(--width); max-width: var(--max-width); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); } .bazis-block_hoverable:hover, .bazis-block_editable:hover { background: var(--background-hover); border-color: var(--border-color-hover); box-shadow: var(--box-shadow-hover); } .bazis-block_outline, .sl-block_faq { --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color); --border-color-hover: var(--bazis-border-color-dark); } .bazis-block_shadow { --box-shadow: 0px 15px 15px -10px rgba(var(--bazis-shadow-color-rgb), 0.4); --box-shadow-hover: 0px 10px 20px -10px rgba(144, 150, 162, 0.2); } .bazis-block_editable { display: block; position: relative; cursor: pointer; } .bazis-block_editable > bazis-icon { position: absolute; right: 16px; bottom: 10px; visibility: hidden; color: var(--bazis-color-action); } .bazis-block_editable:hover bazis-icon { visibility: visible; } .bazis-block_on-map { position: absolute; z-index: 150; top: calc(var(--bazis-multiple-px) * 4); left: calc(var(--bazis-multiple-px) * 4); } .bazis-block_search { --max-width: 612px; --padding-top: 20px; --padding-start: 20px; --padding-end: 20px; --padding-bottom: 20px; --margin-bottom: 0; position: absolute; z-index: 150; bottom: 0; left: 0; } .bazis-block_search.bazis-block_shadow { --box-shadow: 0px 4px 24px -10px rgba(0, 0, 0, 0.1); } .bazis-block_search .bazis-block__footer { --margin-bottom: -20px; --margin-start: -20px; --margin-end: -20px; --padding-top: var(--bazis-padding); --padding-bottom: var(--bazis-padding); --padding-start: calc(var(--bazis-multiple-px) * 4); --padding-end: calc(var(--bazis-multiple-px) * 4); } .bazis-empty .bazis-block_search { text-align: left; } .bazis-breadcrumbs { --padding-top: initial; --padding-bottom: initial; --margin-bottom: initial; --text-decoration: initial; --color: initial; padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); margin-bottom: var(--margin-bottom); color: var(--color); } .bazis-breadcrumbs a { -webkit-text-decoration: var(--text-decoration); text-decoration: var(--text-decoration); color: var(--color); } .bazis-container .bazis-breadcrumbs, .bazis-message-plane .bazis-breadcrumbs { padding-left: 0; padding-right: 0; } .bazis-browse-default { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; --margin-title: 0; --color: inherit; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .bazis-browse-default__title { margin: var(--margin-title); color: var(--color); } .bazis-btn-group { display: flex; border-radius: var(--border-radius); } .bazis-btn-group__item:first-child > bazis-button::part(native) { border-radius: var(--border-radius) 0 0 var(--border-radius); border-left: var(--border-width) var(--border-style) var(--border-color); } .bazis-btn-group__item:last-child > bazis-button::part(native) { border-radius: 0 var(--border-radius) var(--border-radius) 0; } .bazis-btn-group__item:last-child > bazis-button.bazis-btn_clear::part(native)::after { opacity: 0; } .bazis-btn-group__item:only-child > bazis-button::part(native) { border-radius: var(--border-radius); } .bazis-btn-group__item > bazis-button { --outline-width: none; --outline-color: none; --outline-style: none; } .bazis-btn-group__item > bazis-button::part(native) { border-radius: 0; border: var(--border-width) var(--border-style) var(--border-color); border-left: none; } .bazis-btn-group__item > bazis-button.bazis-btn_large bazis-icon { font-size: 24px; } .bazis-btn-group__item > bazis-button.bazis-btn_clear::part(native)::after { top: var(--padding-top); bottom: var(--padding-bottom); left: auto; opacity: 1; } .bazis-btn-group__item > bazis-button.bazis-btn_clear bazis-icon[slot=icon-only] { margin-left: 0; margin-right: 0; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bazis-btn-group__item > bazis-button.bazis-btn_clear bazis-icon[slot=icon-only] { margin-inline-start: 0; margin-inline-end: 0; } } .bazis-btn-group--disabled .bazis-btn-group__item > bazis-button { cursor: default; pointer-events: none; } .bazis-btn-group--disabled .bazis-btn-group__item > bazis-button::part(native) { background: var(--background-disabled); opacity: var(--disabled-opacity); color: var(--color-disabled); } .bazis-btn-group_h { flex-direction: column; } .bazis-btn-group_h .bazis-btn-group__item > bazis-button::part(native) { border: var(--border-width) var(--border-style) var(--border-color); border-top: none; } .bazis-btn-group_h .bazis-btn-group__item:first-child > bazis-button::part(native) { border-radius: var(--border-radius) var(--border-radius) 0 0; border-top: var(--border-width) var(--border-style) var(--border-color); } .bazis-btn-group_h .bazis-btn-group__item:last-child > bazis-button::part(native) { border-radius: 0 0 var(--border-radius) var(--border-radius); } .bazis-card { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --min-width: initial; --width: initial; --max-width: initial; --background: initial; --color: inherit; --background-hover: var(--background); --border-color-hover: var(--border-color); --box-shadow-hover: var(--box-shadow); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); min-width: var(--min-width); width: var(--width); max-width: var(--max-width); background: var(--background); color: var(--color); } .bazis-card:hover { background: var(--background-hover); border-color: var(--border-color-hover); box-shadow: var(--box-shadow-hover); } .bazis-cckeditor { --cckeditor-font-size: 14px; --cckeditor-line-height: 20px; --cckeditor-margin-major: 0 0 var(--bazis-margin-3x); --cckeditor-margin-minor: 0 0 var(--bazis-margin-2x); --cckeditor-margin-h3: 40px 0 20px; --cckeditor-margin-h6: 0 0 16px; --bazis-font-size: var(--cckeditor-font-size); --bazis-line-height: var(--cckeditor-line-height); font-size: var(--cckeditor-font-size); line-height: var(--cckeditor-line-height); } .bazis-cckeditor b, .bazis-cckeditor strong { font-weight: 500; } .bazis-cckeditor i, .bazis-cckeditor em { font-style: italic; } .bazis-cckeditor ol { margin: var(--cckeditor-margin-major); padding-left: 20px; } .bazis-cckeditor ol li { margin: 0 0 8px; } .bazis-cckeditor ol li a { text-decoration: none; font-weight: 500; letter-spacing: 0.5px; } .bazis-cckeditor ul { margin: var(--cckeditor-margin-major); padding-left: 0; list-style: none; } .bazis-cckeditor ul li { margin: 0 0 8px; } .bazis-cckeditor ul li a { text-decoration: none; font-weight: 500; letter-spacing: 0.5px; } .bazis-cckeditor p { --bazis-font-size-p: var(--cckeditor-font-size); --bazis-line-height-p: var(--cckeditor-line-height); --bazis-p-margin: var(--cckeditor-margin-major); margin: var(--cckeditor-margin-major); } .bazis-cckeditor p:last-child { margin: 0; } .bazis-cckeditor a { text-decoration: underline; } .bazis-cckeditor h3 { --bazis-h3-margin: var(--cckeditor-margin-h3); margin: var(--cckeditor-margin-h3); } .bazis-cckeditor h6 { --bazis-h6-margin: var(--cckeditor-margin-h6); margin: var(--cckeditor-margin-h6); } .bazis-cckeditor table td { border: 0; padding: 8px; } .bazis-cckeditor table td p:last-child { margin: 0; } .bazis-cckeditor table:not([border]) td:first-child { padding-left: 0; } .bazis-cckeditor table:not([border]) td:last-child { padding-right: 0; } .bazis-cckeditor table[border] { border-color: var(--bazis-border-color-dark); } .bazis-cckeditor table[border] td { border: 1px solid var(--bazis-border-color-dark); } .bazis-contact { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); display: block; color: inherit; } .bazis-contact a { color: currentColor; } .bazis-cookie { position: fixed; z-index: 1001; bottom: 20px; left: 0; right: 0; font-size: 13px; font-weight: 400; line-height: 20px; } .bazis-cookie .bazis-block { --max-width: 1360px; --margin-bottom: 0; --padding-top: 10px; --padding-start: 16px; --padding-end: 16px; --padding-bottom: 10px; display: flex; justify-content: space-between; } .bazis-cookie .bazis-block bazis-icon { margin-right: 12px; flex-shrink: 0; } .bazis-cookie .bazis-block a { font-weight: 500; letter-spacing: 0.25px; text-decoration: none; } .bazis-cookie .bazis-block > div { justify-content: center; width: 100%; padding: 6px 0; } @media (max-width: 992px) { .bazis-cookie .bazis-block > div { justify-content: flex-start; padding-right: 72px; } } @media (max-width: 576px) { .bazis-cookie .bazis-block { display: block; } .bazis-cookie .bazis-block > div { padding-right: 0; } .bazis-cookie bazis-button { margin-top: 16px; margin-left: 32px; } } .bazis-coordinates { display: inline-flex; align-items: center; margin-bottom: 12px; color: var(--bazis-text-color-secondary); cursor: pointer; } .bazis-coordinates bazis-icon { margin-left: var(--bazis-margin-2x); font-size: 12px; } .bazis-corner { position: absolute; } .bazis-corner_left-top { left: var(--bazis-corner-left, 0); top: var(--bazis-corner-top, 0); } .bazis-corner_left-bottom { left: var(--bazis-corner-left, 0); bottom: var(--bazis-corner-bottom, 0); } .bazis-corner_right-top { right: var(--bazis-corner-right, 0); top: var(--bazis-corner-top, 0); } .bazis-corner_right-bottom { right: var(--bazis-corner-right, 0); bottom: var(--bazis-corner-bottom, 0); } .bazis-counter_line { display: flex; align-items: center; } .bazis-counter_line .bazis-counter__item { --height: initial; --width: initial; --border-radius: initial; border-radius: var(--border-radius); height: var(--height); width: var(--width); background: var(--bazis-color-base, var(--bazis-placeholder-color)); } .bazis-counter_line .bazis-counter__total { --font-size: inherit; --font-weight: inherit; --line-height: initial; font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); --margin-end: initial; } .bazis-counter_line .bazis-counter__total:first-child { margin-right: var(--margin-end); } .bazis-counter_line .bazis-counter__total:last-child { margin-left: var(--margin-end); } .bazis-dateplate { font-weight: 700; font-size: 14px; line-height: 20px; } .bazis-dateplate__time { display: flex; align-items: center; font-weight: 400; font-size: 16px; line-height: 24px; } .bazis-dateplate__time bazis-icon { --bazis-icon-xs-size: 14px; margin-right: 6px; } .bazis-dateplate__time_small { font-size: 14px; line-height: 20px; } .bazis-dateplate__time_small bazis-icon { margin-bottom: 2px; } dl { --width-dt: initial; --width-dd: initial; --padding-end-dt: initial; --padding-start-dd: initial; --margin-bottom-dt: initial; --margin-bottom-dd: initial; --margin-top-dl: initial; --margin-bottom-dl: initial; --color-dt: inherit; --color-dd: inherit; margin-top: var(--margin-top-dl); margin-bottom: var(--margin-bottom-dl); } dl dt { padding-right: var(--padding-end-dt); margin: 0 0 var(--margin-bottom-dt); color: var(--color-dt); } dl dd { margin: 0 0 var(--margin-bottom-dd); color: var(--color-dd); } dl.bazis-dl_inline, dl.bazis-dl_dot-leaders, dl.bazis-dl_dot-leaders_nowrap { clear: both; overflow: hidden; } dl.bazis-dl_inline dt, dl.bazis-dl_dot-leaders dt, dl.bazis-dl_dot-leaders_nowrap dt { float: left; clear: left; width: var(--width-dt); } dl.bazis-dl_inline dd, dl.bazis-dl_dot-leaders dd, dl.bazis-dl_dot-leaders_nowrap dd { float: left; width: var(--width-dd); overflow: hidden; } dl.bazis-dl_dot-leaders, dl.bazis-dl_dot-leaders_nowrap { --color-dot: inherit; } dl.bazis-dl_dot-leaders dt, dl.bazis-dl_dot-leaders_nowrap dt { display: inline-flex; padding-right: 0; } dl.bazis-dl_dot-leaders dt > *, dl.bazis-dl_dot-leaders_nowrap dt > * { flex-shrink: 0; } dl.bazis-dl_dot-leaders dt::after, dl.bazis-dl_dot-leaders_nowrap dt::after { content: ""; position: relative; width: 100%; top: -7px; opacity: 0.5; margin-left: 2px; border-bottom: 1px dotted var(--color-dot); } dl.bazis-dl_dot-leaders dd, dl.bazis-dl_dot-leaders_nowrap dd { padding-left: var(--padding-start-dd); } dl.bazis-dl_dot-leaders_nowrap dt { white-space: nowrap; } .bazis-accordion_doc .iframe_desktop { display: block; } .dt-desktop .bazis-accordion_doc .iframe_desktop { display: block; } .dt-mobile .bazis-accordion_doc .iframe_desktop { display: none; } .bazis-accordion_doc .iframe_mobile { display: none; } .dt-desktop .bazis-accordion_doc .iframe_mobile { display: none; } .dt-mobile .bazis-accordion_doc .iframe_mobile { display: block; } @media screen and (max-device-width: 666px) { .bazis-accordion_doc .iframe_desktop { display: none; } .dt-desktop .bazis-accordion_doc .iframe_desktop { display: block; } .dt-mobile .bazis-accordion_doc .iframe_desktop { display: none; } .bazis-accordion_doc .iframe_mobile { display: block; } .dt-desktop .bazis-accordion_doc .iframe_mobile { display: none; } .dt-mobile .bazis-accordion_doc .iframe_mobile { display: block; } } .bazis-dropdown { /* * @prop --width: * * @prop --padding-start: * @prop --padding-end: * @prop --padding-top: * @prop --padding-bottom: * @prop --background: * @prop --border-radius: * @prop --border-width: * @prop --border-style: * @prop --border-color: * @prop --box-shadow: * * @prop --top: * @prop --bottom: * @prop --left: * @prop --right: */ --width: initial; --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --background: initial; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --top: initial; --bottom: initial; --left: initial; --right: initial; position: relative; } .bazis-dropdown__body { position: absolute; z-index: 161; top: var(--top); bottom: var(--bottom); left: var(--left); right: var(--right); width: var(--width); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); background: var(--background); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); } .bazis-dropdown_hoverable .bazis-dropdown__body { visibility: hidden; } .bazis-dropdown_hoverable:hover .bazis-dropdown__body { visibility: visible; } .bazis-dropdown bazis-button.bazis-dropdown__trigger, .bazis-dropdown__trigger bazis-button, .bazis-dropdown a.bazis-dropdown__trigger, .bazis-dropdown__trigger a { --color: inherit; --color-link-hover: var(--color); --background-hover: var(--background); white-space: nowrap; } .bazis-dropdown .bazis-list_select, .bazis-dropdown .bazis-list_control-dd { position: static; } .bazis-empty { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --background: initial; --color: inherit; --font-size: inherit; --font-weight: inherit; --line-height: initial; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); --margin-top: 0; --margin-bottom: 0; margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); background: var(--background); text-align: center; } .bazis-empty p { font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); color: var(--color); } .bazis-empty { --margin-top: 120px; --font-size: 13px; --line-height: 20px; --color: var(--bazis-text-color-secondary); max-width: 548px; margin-left: auto; margin-right: auto; } .bazis-empty h5 { margin-bottom: 8px; } .bazis-empty bazis-button:not(.bazis-control__field-group bazis-button) { margin-top: var(--bazis-margin-6x); } .bazis-figure { /** * @prop --background: фон кнопки или подложки картинки * @prop --border-radius: радиус скругления * @prop --border-width: толщина границы * @prop --border-style: стиль границы * @prop --border-color: цвет границы * * @prop --height: высота * @prop --width: ширина * @prop --min-width: минимальная ширина * * @prop --font-size: размер шрифта * @prop --font-weight: жирность шрифта */ --background: initial; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --height: initial; --width: initial; --min-width: initial; --font-size: inherit; --font-weight: inherit; display: flex; flex-direction: column; align-items: center; justify-content: center; flex-shrink: 0; position: relative; height: var(--height); width: var(--width); background: var(--background); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); } .bazis-figure img, .bazis-figure video { height: 100%; width: 100%; object-fit: cover; border-radius: var(--border-radius); } .bazis-figure_btn { border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); outline: none; font-size: var(--font-size); font-weight: var(--font-weight); } .bazis-figure_btn bazis-icon { --bazis-icon-s-size: 16px; margin-bottom: calc(var(--bazis-multiple-px) * 2); } .bazis-figure_btn.bazis-color { border-color: var(--bazis-color-base); color: var(--bazis-color-base); } .bazis-figure_long { width: auto; } .bazis-file-inline { --max-height: none; --min-height: none; display: inline-flex; width: 100%; justify-content: flex-start; } .bazis-file-inline bazis-badge { --margin-start: var(--bazis-margin-2x); --margin-end: var(--bazis-margin-2x); margin-top: 2px; margin-left: 0; border-radius: 2px; text-transform: uppercase; line-height: 16px; flex-shrink: 0; } .bazis-file-inline .bazis-list { width: calc(100% - 56px); justify-content: flex-start; } .bazis-file-inline .bazis-list > .bazis-item { white-space: nowrap; } .bazis-file-inline .bazis-list > .bazis-item:first-child { overflow: hidden; text-overflow: ellipsis; max-width: calc(100% - 1px); display: inline-block; } .bazis-file-inline .bazis-list > .bazis-item:first-child::after { display: none; } .bazis-file-inline .bazis-list > .bazis-item:last-child { padding-right: 0; } .bazis-file-inline .bazis-list > .bazis-item:last-child:not(:first-child) { padding-left: var(--padding-end); } .bazis-file-inline .bazis-list > .bazis-item:last-child:not(:first-child)::before { content: ""; display: inline-block; margin-right: var(--padding-end); margin-bottom: 2px; width: 2px; height: 2px; background: var(--color); border-radius: 50%; } .bazis-file-inline .bazis-list > .bazis-item bazis-link { display: contents; font-weight: 400; } .bazis-signed-file-inline { display: flex; align-items: center; justify-content: space-between; } .bazis-signed-file-inline .bazis-file-inline { overflow: hidden; } .bazis-signed-file-inline .bazis-file-inline .bazis-list { width: calc(100% - 56px - 36px); } .bazis-signed-file-inline .bazis-file-inline + bazis-button { flex-shrink: 0; align-self: flex-start; } .bazis-signed-file-inline .bazis-dropdown { --top: 24px; --color: var(--bazis-placeholder-color); } .bazis-gallery-preview { --width: initial; --height: initial; width: var(--width); height: var(--height); position: relative; } .bazis-gallery-preview__more { /* * @prop --opacity: прозрачность кнопки more * @prop --border-radius: скругление кнопки more */ --opacity: initial; --border-radius: initial; --top: initial; --bottom: initial; --left: initial; --right: initial; --width: initial; --height: initial; --background: initial; --color: inherit; --font-size: inherit; --font-weight: inherit; --line-height: initial; top: var(--top); bottom: var(--bottom); left: var(--left); right: var(--right); width: var(--width); height: var(--height); background: var(--background); color: var(--color); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); position: absolute; background: rgba(var(--background), var(--opacity)); border-radius: var(--border-radius); text-align: center; } .bazis-gallery-slider { --min-width: initial; --width: initial; --max-width: initial; min-width: var(--min-width); width: var(--width); max-width: var(--max-width); position: relative; } .bazis-gallery-slider > bazis-button { --border-radius: 50%; position: absolute; z-index: 150; top: 50%; margin-top: -18px; } .bazis-gallery-slider > bazis-button.bazis-gallery-slider__prev { left: -18px; } .bazis-gallery-slider > bazis-button.bazis-gallery-slider__next { right: -18px; } .bazis-gallery-slider__content { will-change: transform; transition: margin-left 300ms; } .bazis-gallery-single { --min-width: initial; --width: initial; --max-width: initial; min-width: var(--min-width); width: var(--width); max-width: var(--max-width); position: relative; } .bazis-gallery-single > bazis-button { position: absolute; top: 50%; margin-top: -18px; } .bazis-gallery-single > bazis-button.bazis-gallery-single__prev { left: 20px; } .bazis-gallery-single > bazis-button.bazis-gallery-single__next { right: 20px; } .bazis-infinite-scroll-content { overflow: auto; max-height: var(--max-height-infinite-scroll-content, 182px); } .bazis-list { /* * @prop --background-list: фон списка * * @prop --border-radius-list: радиус скругления списка * @prop --border-width-list: толщина границы списка * @prop --border-style-list: стиль границы списка * @prop --border-color-list: цвет границы списка * * @prop --padding-top-list: внутренний верхний отступ списка * @prop --padding-end-list: внутренний конечный отступ списка * @prop --padding-bottom-list: внутренний нижний отступ списка * @prop --padding-start-list: внутренний начальный отступ списка * * @prop --margin-top-list: внешний верхний отступ списка * @prop --margin-end-list: внешний конечный отступ списка * @prop --margin-bottom-list: внешний нижний отступ списка * @prop --margin-start-list: внешний начальный отступ списка * @prop --box-shadow: тень списка * * @prop --max-height: максимальная высота списка * * @prop --background: фон итема * @prop --background-hover: фон итема при наведении * @prop --background-selected: фон выбранного итема * * @prop --border-radius: радиус скругления итема * @prop --border-width: толщина границы итема * @prop --border-style: стиль границы итема * @prop --border-color: цвет границы итема * * @prop --padding-top: внутренний верхний отступ итема * @prop --padding-end: внутренний конечный отступ итема * @prop --padding-bottom: внутренний нижний отступ итема * @prop --padding-start: внутренний начальный отступ итема * * @prop --margin-top: внешний верхний отступ итема * @prop --margin-end: внешний конечный отступ итема * @prop --margin-bottom: внешний нижний отступ итема * @prop --margin-start: внешний начальный отступ итема * * @prop --min-height: минимальная высота итема * * @prop --list-style: стиль списка * * @prop --color: цвет текста * @prop --color-hover: цвет текста при наведении * @prop --color-selected: цвет текста выбранного пункта * @prop --font-size: размер шрифта * @prop --font-weight: жирность шрифта * @prop --line-height: межстрочный интервал для текста * * @prop --size-icon: размер иконки */ --min-height: initial; --border-width: initial; --border-color: initial; --border-style: initial; --padding-start: initial; --padding-end: initial; --padding-top: initial; --padding-bottom: initial; --margin-start: initial; --margin-end: initial; --margin-top: initial; --margin-bottom: initial; --background: initial; --background-hover: var(--background); --background-selected: var(--background); --color: inherit; --color-hover: var(--color); --color-selected: var(--color); --font-size: inherit; --font-weight: inherit; --line-height: inherit; --max-height: initial; --padding-start-list: 0; --padding-end-list: 0; --padding-top-list: 0; --padding-bottom-list: 0; --margin-start-list: 0; --margin-end-list: 0; --margin-top-list: 0; --margin-bottom-list: 0; --background-list: initial; --border-radius-list: initial; --border-width-list: initial; --border-color-list: initial; --border-style-list: initial; --box-shadow: none; max-height: var(--max-height); border-radius: var(--border-radius-list); border-width: var(--border-width-list); border-style: var(--border-style-list); border-color: var(--border-color-list); padding: var(--padding-top-list) var(--padding-end-list) var(--padding-bottom-list) var(--padding-start-list); margin: var(--margin-top-list) var(--margin-end-list) var(--margin-bottom-list) var(--margin-start-list); background: var(--background-list); box-shadow: var(--box-shadow); list-style: var(--list-style); } .bazis-list.bh-no-margin { margin: 0; } .bazis-list .bazis-item { display: list-item; min-height: var(--min-height); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); background: var(--background); list-style: var(--list-style); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); color: var(--color); } .bazis-list .bazis-item:hover, .bazis-list .bazis-item.active { background: var(--background-hover); color: var(--color-hover); } .bazis-list .bazis-item--selected, .bazis-list .bazis-item--selected:hover, .bazis-list .bazis-item:active, .bazis-list .bazis-item:active:hover { background: var(--background-selected); color: var(--color-selected); } .bazis-list_h { display: flex; align-items: center; } .bazis-list_short-info { display: flex; align-items: center; } .bazis-list_short-info .bazis-item { padding-left: 0; } .bazis-list_short-info .bazis-item::after { content: ""; display: inline-block; margin-left: var(--padding-end); margin-bottom: 2px; width: 2px; height: 2px; background: var(--color); border-radius: 50%; } .bazis-list_short-info .bazis-item:last-child { --padding-start: 0; } .bazis-list_short-info .bazis-item:last-child::after { display: none; } .bazis-list_short-info .bazis-item a { text-decoration: none; } .bazis-list_short-info .bazis-item > *:not(bazis-tooltip) { display: inline-block; } @media (max-width: 576px) { .bazis-list_short-info .bazis-item { padding-left: 0; } .bazis-list_short-info .bazis-item::before { display: none; } .bazis-list_short-info .bazis-item::after { content: ""; display: inline-block; margin-left: var(--padding-end); margin-bottom: 2px; width: 2px; height: 2px; background: var(--color); border-radius: 50%; } .bazis-list_short-info .bazis-item:last-child { --padding-start: 0; } .bazis-list_short-info .bazis-item:last-child::after { display: none; } } .bazis-list_vline > .bazis-item, .bazis-list_vline_mini > .bazis-item { display: inline-flex; } .bazis-list_vline > .bazis-item::before, .bazis-list_vline_mini > .bazis-item::before { content: ""; border-left: 1px solid var(--border-color); padding-right: var(--padding-start); } .bazis-list_vline > .bazis-item:first-child, .bazis-list_vline_mini > .bazis-item:first-child { --padding-start: 0; } .bazis-list_vline > .bazis-item:first-child::before, .bazis-list_vline_mini > .bazis-item:first-child::before { display: none; } .bazis-list_vline > .bazis-item_noline::before, .bazis-list_vline_mini > .bazis-item_noline::before { display: none; } .bazis-list_select, .bazis-list_control-dd { width: 100%; overflow: auto; } .bazis-list_select .bazis-item, .bazis-list_control-dd .bazis-item { --height: initial; --border-radius: 0; position: relative; min-height: var(--height, 36px); cursor: pointer; } .bazis-list_select a.bazis-item, .bazis-list_control-dd a.bazis-item, .bazis-list_select bazis-link.bazis-item, .bazis-list_control-dd bazis-link.bazis-item, .bazis-list_select button.bazis-item, .bazis-list_control-dd button.bazis-item { display: block; width: 100%; line-height: var(--line-height); text-decoration: none; letter-spacing: 0; text-align: left; } .bazis-list_control-dd { position: absolute; top: var(--position-top, var(--height, 0)); left: 0; z-index: 160; } .bazis-list_control-dd-wrapper { position: relative; padding-bottom: var(--padding-bottom); } .bazis-list_control-dd .bazis-item_group { --background-hover: var(--background); --background-selected: var(--background); --color: var(--bazis-text-color-secondary); --color-hover: var(--color); --color-selected: var(--color); -webkit-user-select: none; user-select: none; } .bazis-dropdown .bazis-list_control-dd bazis-button.bazis-item { text-align: left; } .bazis-dropdown .bazis-list_control-dd bazis-button.bazis-item::part(inner) { justify-content: flex-start; } .bazis-list_gallery { overflow: hidden; position: relative; flex-wrap: nowrap; transition: margin-left 0.5s ease-in; } .bazis-list_between > .bazis-item, .bazis-list_between_dot-leaders > .bazis-item { width: 100%; display: flex; justify-content: space-between; } .bazis-block__content_end .bazis-list_between, .bazis-block__content_end .bazis-list_between_dot-leaders { --margin-top-list: 26px; } .bazis-list_between_dot-leaders > .bazis-item { position: relative; } .bazis-list_between_dot-leaders > .bazis-item::after { content: ""; position: absolute; width: 100%; bottom: 4px; opacity: 0.5; border-bottom: 1px dotted var(--color-dot); } .bazis-list_between_dot-leaders > .bazis-item > * { position: relative; z-index: 1; background: var(--bazis-background); } .bazis-list_between_dot-leaders > .bazis-item > *:first-child { padding-right: 8px; } .bazis-list_between_dot-leaders > .bazis-item > *:last-child { padding-left: 8px; } .bazis-list_underline { --padding-top: calc(var(--bazis-multiple-px) * 2); --padding-bottom: calc(var(--bazis-multiple-px) * 2); --border-width: 0 0 1px 0; --border-style: solid; --border-color: var(--bazis-border-color); } .bazis-list_overline { --padding-top: calc(var(--bazis-multiple-px) * 8); --padding-bottom: calc(var(--bazis-multiple-px) * 8); --border-width: 1px 0 0 0; --border-style: solid; --border-color: var(--bazis-border-color); } .bazis-list_history, .sl-list_trip { --width-bullet: 9px; } .bazis-list_history > .bazis-item, .sl-list_trip > .bazis-item { position: relative; } .bazis-list_history > .bazis-item::before, .sl-list_trip > .bazis-item::before { content: ""; position: absolute; left: 0; top: 5px; width: var(--width-bullet); height: var(--width-bullet); border: 1px solid var(--bazis-placeholder-color); border-radius: 50%; } .bazis-list_history > .bazis-item::after, .sl-list_trip > .bazis-item::after { content: ""; position: absolute; left: 5px; top: 16px; bottom: calc(var(--margin-bottom) * -1 - 5px); width: 1px; background: var(--bazis-placeholder-color); } .bazis-list_history > .bazis-item:last-child::after, .sl-list_trip > .bazis-item:last-child::after { display: none; } .bazis-list_history.bazis-color > .bazis-item::before, .bazis-color.sl-list_trip > .bazis-item::before { border-color: var(--bazis-color-base); background: var(--bazis-color-base); } .bazis-list_history.bazis-color > .bazis-item::after, .bazis-color.sl-list_trip > .bazis-item::after { background: var(--bazis-color-base); } .bazis-loader, .bazis-loader_inline { /** * @prop --background: фон лоадера * @prop --border-radius: радиус скругления лоадера * @prop --border-width: толщина границы лоадера * @prop --border-style: стиль границы лоадера * @prop --border-color: цвет границы лоадера * @prop --box-shadow: тень лоадера * * @prop --max-width: максимальная ширина лоадера * @prop --min-width: минимальная ширина лоадера * @prop --width: ширина лоадера * @prop --height: высота лоадера * * @prop --spinner-background: фон спиннера * @prop --spinner-color: цвет спиннера * @prop --spinner-size: размер спиннера * * @prop --dot-size: размер точки (для лоадера точек) * @prop --dots-margin: отступ между точек * * @prop --font-size: размер шрифта сообщения * @prop --font-weight: жирность шрифта сообщения * @prop --color: цвет текста сообщения * @prop --color-rgb: цвет текста сообщения */ --min-width: initial; --max-width: initial; --border-radius: var(--bazis-border-radius); --border-width: initial; --border-style: initial; --border-color: initial; --font-size: inherit; --font-weight: initial; --color: var(--bazis-text-color); position: fixed; z-index: 1100; top: 0; left: 0; right: 0; bottom: 0; min-width: var(--min-width); max-width: var(--max-width); width: var(--width); height: var(--height); margin: auto; border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); padding: var(--bazis-padding); background: var(--background); text-align: center; font-size: var(--font-size); font-weight: var(--font-weight); color: var(--color); } .bazis-loader__spinner { width: var(--spinner-size); height: var(--spinner-size); margin: 16px auto; border-radius: 50%; background: var(--spinner-background); animation: rotate 2s linear infinite; } .bazis-loader__spinner circle { stroke: var(--spinner-color); stroke-linecap: round; animation: dash 1.5s ease-in-out infinite; } .bazis-loader_inline { position: relative; width: 100%; } .bazis-loader_dots { display: inline-block; position: relative; margin: 0 calc(var(--dots-margin) + var(--dot-size)); width: var(--dot-size); height: var(--dot-size); border-radius: 50%; background-color: var(--color); color: var(--color); vertical-align: middle; animation: dot-flashing 1s infinite linear alternate; animation-delay: 0.5s; } .bazis-loader_dots::before, .bazis-loader_dots::after { content: ""; display: inline-block; position: absolute; top: 0; } .bazis-loader_dots::before { left: calc(var(--dots-margin) * -1); width: var(--dot-size); height: var(--dot-size); border-radius: 50%; background-color: var(--color); color: var(--color); animation: dot-flashing 1s infinite alternate; animation-delay: 0s; } .bazis-loader_dots::after { left: var(--dots-margin); width: var(--dot-size); height: var(--dot-size); border-radius: 50%; background-color: var(--color); color: var(--color); animation: dot-flashing 1s infinite alternate; animation-delay: 1s; } .bazis-loader_dark { --background: var(--bazis-color-black); --color: var(--bazis-color-white); } .bazis-loader_transparent { --background: transparent; --spinner-background: var(--bazis-color-white); } @keyframes rotate { 100% { transform: rotate(360deg); } } @keyframes dash { 0% { stroke-dasharray: 1, 94; stroke-dashoffset: 0; } 50% { stroke-dasharray: 56, 94; stroke-dashoffset: -19; } 100% { stroke-dasharray: 56, 94; stroke-dashoffset: -87; } } @keyframes dot-flashing { 0% { background-color: var(--color); } 50%, 100% { background-color: rgba(var(--color-rgb), 0.2); } } bazis-skeleton:first-child:last-child { --margin-top: 0; --margin-bottom: 0; } bazis-skeleton:last-of-type { --margin-bottom: 0; } .bazis-loadmore-button { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); text-align: center; } .bazis-menu, .bazis-menu_rounded { /* * @prop --background-list: фон списка * * @prop --border-radius-list: радиус скругления списка * @prop --border-width-list: толщина границы списка * @prop --border-style-list: стиль границы списка * @prop --border-color-list: цвет границы списка * * @prop --padding-top-list: внутренний верхний отступ списка * @prop --padding-end-list: внутренний конечный отступ списка * @prop --padding-bottom-list: внутренний нижний отступ списка * @prop --padding-start-list: внутренний начальный отступ списка * * @prop --margin-top-list: внешний верхний отступ списка * @prop --margin-end-list: внешний конечный отступ списка * @prop --margin-bottom-list: внешний нижний отступ списка * @prop --margin-start-list: внешний начальный отступ списка * @prop --box-shadow: тень списка * * @prop --max-height: максимальная высота списка * * @prop --background: фон итема * @prop --background-hover: фон итема при наведении * @prop --background-selected: фон выбранного итема * * @prop --border-radius: радиус скругления итема * @prop --border-width: толщина границы итема * @prop --border-style: стиль границы итема * @prop --border-color: цвет границы итема * * @prop --padding-top: внутренний верхний отступ итема * @prop --padding-end: внутренний конечный отступ итема * @prop --padding-bottom: внутренний нижний отступ итема * @prop --padding-start: внутренний начальный отступ итема * * @prop --margin-top: внешний верхний отступ итема * @prop --margin-end: внешний конечный отступ итема * @prop --margin-bottom: внешний нижний отступ итема * @prop --margin-start: внешний начальный отступ итема * * @prop --min-height: минимальная высота итема * * @prop --list-style: стиль списка * * @prop --color: цвет текста * @prop --color-hover: цвет текста при наведении * @prop --color-selected: цвет текста выбранного пункта * @prop --font-size: размер шрифта * @prop --font-weight: жирность шрифта * @prop --line-height: межстрочный интервал для текста * * @prop --size-icon: размер иконки */ --min-height: initial; --border-width: initial; --border-color: initial; --border-style: initial; --padding-start: initial; --padding-end: initial; --padding-top: initial; --padding-bottom: initial; --margin-start: initial; --margin-end: initial; --margin-top: initial; --margin-bottom: initial; --background: initial; --background-hover: var(--background); --background-selected: var(--background); --color: inherit; --color-hover: var(--color); --color-selected: var(--color); --font-size: inherit; --font-weight: inherit; --line-height: inherit; --max-height: initial; --padding-start-list: 0; --padding-end-list: 0; --padding-top-list: 0; --padding-bottom-list: 0; --margin-start-list: 0; --margin-end-list: 0; --margin-top-list: 0; --margin-bottom-list: 0; --background-list: initial; --border-radius-list: initial; --border-width-list: initial; --border-color-list: initial; --border-style-list: initial; --box-shadow: none; max-height: var(--max-height); border-radius: var(--border-radius-list); border-width: var(--border-width-list); border-style: var(--border-style-list); border-color: var(--border-color-list); padding: var(--padding-top-list) var(--padding-end-list) var(--padding-bottom-list) var(--padding-start-list); margin: var(--margin-top-list) var(--margin-end-list) var(--margin-bottom-list) var(--margin-start-list); background: var(--background-list); box-shadow: var(--box-shadow); list-style: var(--list-style); clear: both; } .bazis-menu.bh-no-margin, .bh-no-margin.bazis-menu_rounded { margin: 0; } .bazis-menu .bazis-item, .bazis-menu_rounded .bazis-item { display: list-item; min-height: var(--min-height); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); background: var(--background); list-style: var(--list-style); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); color: var(--color); } .bazis-menu .bazis-item:hover, .bazis-menu_rounded .bazis-item:hover, .bazis-menu .bazis-item.active, .bazis-menu_rounded .bazis-item.active { background: var(--background-hover); color: var(--color-hover); } .bazis-menu .bazis-item--selected, .bazis-menu_rounded .bazis-item--selected, .bazis-menu .bazis-item--selected:hover, .bazis-menu .bazis-item:active, .bazis-menu_rounded .bazis-item:active, .bazis-menu .bazis-item:active:hover { background: var(--background-selected); color: var(--color-selected); } .bazis-menu .bazis-item--disabled, .bazis-menu_rounded .bazis-item--disabled { opacity: 0.5; } .bazis-menu .bazis-item:not(a, bazis-button), .bazis-menu_rounded .bazis-item:not(a, bazis-button) { --padding-top: 0; --padding-bottom: 0; --padding-start: 0; --padding-end: 0; } .bazis-menu bazis-button, .bazis-menu_rounded bazis-button { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --height: auto; --background: transparent; --background-hover: var(--background); --background-activated: var(--background); --background-focused: var(--background); --color-hover: var(--color); --color-focused: var(--color); --color-activated: var(--color); display: block; width: 100%; text-align: center; font-weight: var(--font-weight); line-height: var(--line-height); font-size: var(--font-size); letter-spacing: 0; } .bazis-menu bazis-button::part(inner), .bazis-menu_rounded bazis-button::part(inner) { justify-content: flex-start; } .bazis-menu a, .bazis-menu_rounded a { display: block; color: var(--color); text-decoration: none; } .bazis-menu a:hover, .bazis-menu_rounded a:hover { color: var(--color-hover); } .bazis-menu a:not(.bazis-item), .bazis-menu_rounded a:not(.bazis-item) { padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); } .bazis-menu_rounded bazis-icon { border-radius: 50%; } .bazis-message-plane { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --background: initial; --color: inherit; --font-size: inherit; --font-weight: inherit; --line-height: initial; padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); background: var(--background); color: var(--color); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .bazis-message-plane__item { display: flex; justify-content: space-between; align-items: center; } .bazis-message-plane__item > *:not(.bazis-message-plane__close) { width: 100%; } .bazis-message-plane__item > .bazis-message-plane__close { flex-shrink: 0; } .bazis-modal { /* * @prop --backdrop-opacity: прозрачность подложки * @prop --background: фон модалки * @prop --border-radius: радиус скругления модалки * @prop --border-width: толщина границы * @prop --border-style: стиль границы * @prop --border-color: цвет границы * @prop --box-shadow: тень модального окна * @prop --height: высота модального окна * @prop --width: ширина моадльного окна * @prop --max-height: максимальная высота модального окна * @prop --max-width: максимальная ширина моадльного окна * @prop --min-height: минимальная высота модального окна * @prop --min-width: минимальная ширина модального окна * * @prop --top-close: позиционирование кнопки закрытия по верху окна * @prop --bottom-close: позиционирование кнопки закрытия по низу окна * @prop --left-close: позиционирование кнопки закрытия слева окна * @prop --right-close: позиционирование кнопки закрытия справа окна * * @prop --padding-start-header: внутренний начальный отступ шапки модального окна * @prop --padding-end-header: внутренний конечный отступ шапки модального окна * @prop --padding-top-header: внутренний верхний отступ шапки модального окна * @prop --padding-bottom-header: внутренний нижний отступ шапки модального окна * * @prop --padding-start-content: внутренний начальный отступ контента модального окна * @prop --padding-end-content: внутренний конечнй отступ контента модального окна * @prop --padding-top-content: внутренний верхний отступ контента модального окна * @prop --padding-bottom-content: внутренний начальный отступ контента модального окна */ --backdrop-opacity: initial; --background: initial; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --height: initial; --width: initial; --max-height: initial; --max-width: initial; --min-height: initial; --min-width: initial; position: fixed; z-index: 1101; top: 0; left: 0; right: 0; bottom: 0; margin: auto; background: var(--background); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); height: var(--height); max-height: var(--max-height); min-height: var(--min-height); width: var(--width); max-width: var(--max-width); min-width: var(--min-width); } .bazis-modal-wrap { height: 100%; display: flex; flex-direction: column; } .bazis-modal__close { position: absolute; z-index: 1; right: var(--right-close); top: var(--top-close); left: var(--left-close); bottom: var(--bottom-close); } .bazis-modal__header, .bazis-modal__header_shadow { padding-left: var(--padding-start-header); padding-right: var(--padding-end-header); padding-top: var(--padding-top-header); padding-bottom: var(--padding-bottom-header); } .bazis-modal__content { height: 100%; overflow: auto; padding-left: var(--padding-start-content); padding-right: var(--padding-end-content); padding-top: var(--padding-top-content); padding-bottom: var(--padding-bottom-content); } .bazis-modal__footer { padding-left: var(--padding-start-footer); padding-right: var(--padding-end-footer); padding-top: var(--padding-top-footer); padding-bottom: var(--padding-bottom-footer); } .bazis-modal__header, .bazis-modal__header_shadow, .bazis-modal__footer { flex-shrink: 1; } .bazis-modal__header_shadow { box-shadow: var(--box-shadow); } .bazis-modal.map .bazis-map-wrapper, .bazis-modal.map .sl-map-wrapper_dd { --margin-start: calc(var(--padding-start-content) * -1); --margin-end: calc(var(--padding-end-content) * -1); --margin-bottom: calc(var(--padding-bottom-content) * -1); --width: calc(100% + var(--padding-end-content) + var(--padding-start-content)); } .bazis-modal.fullscreen { width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; border-radius: 0; } .bazis-modal.dummy { width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; border-radius: 0; } .bazis-modal.gallery .bazis-modal__content { width: 100%; display: flex; align-items: center; justify-content: center; } .bazis-modal.gallery img, .bazis-modal.gallery video { max-height: 100%; max-width: 100%; object-fit: contain; } .bazis-modal.gallery bazis-button { --background: transparent; --border-color: var(--bazis-color-white); --color: var(--bazis-color-white); --color-hover: var(--bazis-text-color); } .bazis-modal.gallery bazis-button.bazis-btn-prev, .bazis-modal.gallery bazis-button.bazis-btn-next { position: absolute; top: calc(50% - 18px); } .bazis-modal.gallery bazis-button.bazis-btn-prev { left: 40px; } .bazis-modal.gallery bazis-button.bazis-btn-next { right: 40px; } .bazis-modal.video .bazis-modal__content { display: flex; align-items: center; justify-content: center; } .bazis-modal.video .bazis-modal__content iframe { width: 100%; height: 100%; } @media (max-width: 576px) { .bazis-modal.bazis-modal_signing bazis-signing { display: contents; } .bazis-modal.bazis-modal_signing .bazis-modal-wrap { --max-height: auto; } .bazis-modal.bazis-modal_signing .bazis-modal__footer bazis-toolbar::part(start), .bazis-modal.bazis-modal_signing .bazis-modal__footer bazis-toolbar::part(end) { width: calc(50% - 4px); } .bazis-modal.bazis-modal_signing .bazis-modal__footer bazis-toolbar > *[slot] { display: block; } .bazis-modal.bazis-modal_signing .bazis-modal__footer bazis-toolbar bazis-button { display: block; } } .bazis-paginator { display: flex; justify-content: space-between; align-items: center; } .bazis-paginator_secondary { display: flex; align-items: center; justify-content: space-between; } .bazis-paginator_secondary .bazis-btn-group:last-child bazis-button { margin-left: 8px; } .bazis-paginator_secondary .bazis-btn-group:last-child bazis-button.bh-hidden { display: none; } .bazis-paginator_secondary .bazis-btn-group:last-child bazis-button::part(native) { border: var(--border-width) var(--border-style) var(--border-color); } @media (max-width: 992px) { .bazis-paginator .bazis-btn-group bazis-button.bazis-btn_solid { --background: var(--bazis-color-white); font-weight: 400; } } @media (max-width: 400px) { .bazis-paginator_secondary { display: block; } .bazis-paginator_secondary .bazis-btn-group:last-child { margin-top: 8px; } .bazis-paginator_secondary .bazis-btn-group:last-child bazis-button:first-child, .bazis-paginator_secondary .bazis-btn-group:last-child bazis-button.bh-hidden + bazis-button { margin-left: 0; } } .bazis-pane { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --min-width: initial; --width: initial; --max-width: initial; --background: initial; --color: inherit; --background-hover: var(--background); --border-color-hover: var(--border-color); --box-shadow-hover: var(--box-shadow); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); min-width: var(--min-width); width: var(--width); max-width: var(--max-width); background: var(--background); color: var(--color); --height-header: initial; height: 100%; } .bazis-pane__footer, .bazis-pane__header { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --min-width: initial; --width: initial; --max-width: initial; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); min-width: var(--min-width); width: var(--width); max-width: var(--max-width); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); } .bazis-pane__header { position: relative; display: flex; align-items: center; height: var(--height-header); } .bazis-pane__header bazis-tabs { --height: var(--height-header); } .bazis-pane__header__btns { position: absolute; top: 0; bottom: 0; right: 0; z-index: 11; display: flex; align-items: center; } .bazis-pane__content { height: calc(100% - var(--height-header)); } .bazis-percentage-bar, .bazis-percentage-bar_mini { --min-height: initial; --height: initial; --max-height: initial; --background: initial; min-height: var(--min-height); height: var(--height); max-height: var(--max-height); background: var(--background); } .bazis-percentage-bar__part { --opacity: 1; --min-width: 0; display: block; float: left; height: var(--height); opacity: var(--opacity); min-width: var(--min-width); } .bazis-percentage-bar__part.bazis-color { background: var(--bazis-color-base); } .bazis-percentage-block, .bazis-percentage-block_medium { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --min-width: initial; --width: initial; --max-width: initial; --background: initial; --color: inherit; --background-hover: var(--background); --border-color-hover: var(--border-color); --box-shadow-hover: var(--box-shadow); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); min-width: var(--min-width); width: var(--width); max-width: var(--max-width); background: var(--background); color: var(--color); --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color); --border-color-hover: var(--bazis-border-color-dark); } .bazis-percentage-block__count { --font-size: inherit; --font-weight: inherit; --line-height: initial; font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .bazis-percentage-block__percent { --font-size: inherit; --font-weight: inherit; --line-height: initial; font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .bazis-percentage-block:hover, .bazis-percentage-block_medium:hover { background: var(--background-hover); border-color: var(--border-color-hover); box-shadow: var(--box-shadow-hover); } .bazis-slider { --indicator-gap: 4px; --indicator-margin-top: 0; --indicator-margin-bottom: 0; --indicator-dot-width: 4px; --indicator-dot-height: 4px; --indicator-radius: 50%; --indicator-bg: initial; --indicator-color: initial; --indicator-dot-width-active: var(--indicator-dot-width); --indicator-dot-height-active: var(--indicator-dot-height); --indicator-radius-active: var(--indicator-radius); --indicator-bg-active: var(--indicator-bg); --indicator-color-active: var(--indicator-color); } .bazis-slider__wrapper { overflow: hidden; } .bazis-slider__content { display: flex; align-items: stretch; will-change: transform; transition: transform 300ms; } .bazis-slider__content > * { flex-shrink: 0; } .bazis-slider__controls { margin-top: 32px; text-align: center; } .bazis-slider__controls bazis-button { margin: 0 4px; } .bazis-slider__indicator { display: flex; justify-content: center; align-items: center; gap: var(--indicator-gap); margin: var(--indicator-margin-top) auto var(--indicator-margin-bottom); } .bazis-slider__indicator__item { width: var(--indicator-dot-width); height: var(--indicator-dot-height); border-radius: var(--indicator-radius); background: var(--indicator-bg); color: var(--indicator-color); } .bazis-slider__indicator__item--active { width: var(--indicator-dot-width-active); height: var(--indicator-dot-height-active); border-radius: var(--indicator-radius-active); background: var(--indicator-bg-active); color: var(--indicator-color-active); } bazis-status > div { display: inline-block; max-width: 100%; vertical-align: middle; } .bazis-stepper { /* * @prop --background-list: фон списка * * @prop --border-radius-list: радиус скругления списка * @prop --border-width-list: толщина границы списка * @prop --border-style-list: стиль границы списка * @prop --border-color-list: цвет границы списка * * @prop --padding-top-list: внутренний верхний отступ списка * @prop --padding-end-list: внутренний конечный отступ списка * @prop --padding-bottom-list: внутренний нижний отступ списка * @prop --padding-start-list: внутренний начальный отступ списка * * @prop --margin-top-list: внешний верхний отступ списка * @prop --margin-end-list: внешний конечный отступ списка * @prop --margin-bottom-list: внешний нижний отступ списка * @prop --margin-start-list: внешний начальный отступ списка * @prop --box-shadow: тень списка * * @prop --max-height: максимальная высота списка * * @prop --background: фон шага * @prop --background-hover: фон шага при наведении * @prop --background-active: фон активного шага * * @prop --border-radius: радиус скругления шага * @prop --border-width: толщина границы шага * @prop --border-style: стиль границы шага * @prop --border-color: цвет границы шага * * @prop --padding-top: внутренний верхний отступ шага * @prop --padding-end: внутренний конечный отступ шага * @prop --padding-bottom: внутренний нижний отступ шага * @prop --padding-start: внутренний начальный отступ шага * * @prop --margin-top: внешний верхний отступ шага * @prop --margin-end: внешний конечный отступ шага * @prop --margin-bottom: внешний нижний отступ шага * @prop --margin-start: внешний начальный отступ шага * * @prop --min-height: минимальная высота шага * * @prop --list-style: стиль списка * * @prop --color: цвет текста * @prop --color-hover: цвет текста при наведении * @prop --color-active: цвет текста активного шага * @prop --font-size: размер шрифта * @prop --font-weight: жирность шрифта * @prop --line-height: межстрочный интервал для текста * * @prop --size-icon: размер иконки */ --min-height: initial; --min-width: initial; --border-width: initial; --border-color: initial; --border-style: initial; --padding-start: initial; --padding-end: initial; --padding-top: initial; --padding-bottom: initial; --margin-start: initial; --margin-end: initial; --margin-top: initial; --margin-bottom: initial; --background: initial; --background-hover: var(--background); --background-disabled: var(--background); --background-active: var(--background); --color: inherit; --color-hover: var(--color); --color-disabled: var(--color); --color-active: var(--color); --font-size: inherit; --font-weight: inherit; --line-height: inherit; --width-item-before: initial; --width-item-after: initial; --max-height: initial; --padding-start-list: 0; --padding-end-list: 0; --padding-top-list: 0; --padding-bottom-list: 0; --margin-start-list: 0; --margin-end-list: 0; --margin-top-list: 0; --margin-bottom-list: 0; --background-list: initial; --border-radius-list: initial; --border-width-list: initial; --border-color-list: initial; --border-style-list: initial; --box-shadow: none; display: flex; align-items: center; max-height: var(--max-height); border-radius: var(--border-radius-list); border-width: var(--border-width-list); border-style: var(--border-style-list); border-color: var(--border-color-list); padding: var(--padding-top-list) var(--padding-end-list) var(--padding-bottom-list) var(--padding-start-list); margin: var(--margin-top-list) var(--margin-end-list) var(--margin-bottom-list) var(--margin-start-list); background: var(--background-list); box-shadow: var(--box-shadow); } .bazis-stepper .bazis-item { position: relative; flex-shrink: 0; min-width: var(--min-width); min-height: var(--min-height); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); background: var(--background); list-style: var(--list-style); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); color: var(--color); cursor: pointer; } .bazis-stepper .bazis-item:first-child::before { content: ""; position: absolute; z-index: 1; top: 50%; left: 0; clip-path: url(#step-arrow); width: var(--width-item-before); height: var(--min-height); transform: translateY(-50%); background-color: var(--background); } .bazis-stepper .bazis-item::after { content: ""; position: absolute; z-index: 1; top: 50%; left: calc(100% - 0.5px); clip-path: url(#step-arrow); width: var(--width-item-before); height: var(--min-height); transform: translateY(-50%); background-color: var(--background); background-image: url("/assets/images/step-border.svg"); background-position: 100% 50%; } .bazis-stepper .bazis-item:hover { background: var(--background-hover); color: var(--color-hover); } .bazis-stepper .bazis-item--disabled { background: var(--background-disabled); color: var(--color-disabled); pointer-events: none; } .bazis-stepper .bazis-item--disabled::after { background-color: var(--background-disabled); } .bazis-stepper .bazis-item--active, .bazis-stepper .bazis-item--active:hover, .bazis-stepper .bazis-item:active, .bazis-stepper .bazis-item:active:hover { background: var(--background-active); color: var(--color-active); } .bazis-stepper .bazis-item--active::after, .bazis-stepper .bazis-item--active:hover::after, .bazis-stepper .bazis-item:active::after, .bazis-stepper .bazis-item:active:hover::after { background-color: var(--background-active); } .bazis-tab-status { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); display: inline-flex; align-items: flex-end; } .bazis-tab-status__item { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --border-color-active: var(--border-color); --border-color-hover: var(--border-color); --border-color-disabled: var(--border-color); --border-color-active-disabled: var(--border-color); --background: initial; --color: inherit; --background-active: var(--background); --color-active: var(--color); --background-hover: var(--background); --color-hover: var(--color); --background-disabled: var(--background); --color-disabled: var(--color); --background-active-disabled: var(--background); --color-active-disabled: var(--color); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); background: var(--background); color: var(--color); margin-right: var(--bazis-multiple-px); font-size: 10px; font-weight: 500; line-height: 12px; letter-spacing: 1px; text-transform: uppercase; text-decoration: none; cursor: pointer; } .bazis-tab-status__item > * { display: inline-block; border-bottom: 1px dashed var(--background-active); } @media only screen and (-webkit-min-device-pixel-ratio: 2) { .bazis-tab-status__item > * { position: relative; top: 1px; } } .bazis-tab-status__item--active > *, .bazis-tab-status__item.active > *, .bazis-tab-status__item--disabled > *, .bazis-tab-status__item:hover > * { border-bottom-color: transparent; } .bazis-tab-status__item--active, .bazis-tab-status__item.active { background: var(--background-active); border-color: var(--border-color-active); color: var(--color-active); } .bazis-tab-status__item:hover { background: var(--background-hover); border-color: var(--border-color-hover); color: var(--color-hover); } .bazis-tab-status__item--disabled { background: var(--background-disabled); border-color: var(--border-color-disabled); color: var(--color-disabled); pointer-events: none; } .bazis-tab-status__item--disabled.bazis-tab-status__item--active, .bazis-tab-status__item--disabled.active { background: var(--background-active-disabled); border-color: var(--border-color-active-disabled); color: var(--color-active-disabled); } .bazis-tag { /** * @prop --background: фон тега * @prop --background-hover: фон тега при наведении * @prop --background-disabled: фон тега при отключенной теге * * @prop --color: цвет текста тега * @prop --color-hover: цвет текста тега при наведении * @prop --color-disabled: цвет текста тега при отключенной теге * * @prop --transition: переход * * @prop --border-radius: радиус скругления * @prop --border-width: толщина границы * @prop --border-style: стиль границы * @prop --border-color: цвет границы * @prop --border-color-hover: цвет границы при наведении * @prop --border-color-disabled: цвет границы при отключенной кнопке * * @prop --box-shadow: тень тега * @prop --opacity: прозрачность тега * * @prop --padding-top: внутренний верхний отступ * @prop --padding-end: внутренний правый отступ * @prop --padding-bottom: внутренний нижний отступ * @prop --padding-start: внутренний левый отступ * * @prop --multiple: число увеличения кратности, необходимо для расчета изменения размеров тега. * * @prop --height: высота тега * @prop --width: ширина тега */ --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --width: initial; --height: initial; --background: initial; --color: inherit; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); width: var(--width); height: var(--height); background: var(--background); color: var(--color); --height-s: var(--height); --height-l: var(--height); display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--bazis-multiple-px); opacity: var(--opacity); font-size: 13px; font-weight: 500; } .bazis-tag button { outline: none; background: transparent; border: none; padding: 4px; } .bazis-tag button bazis-icon { color: var(--bazis-text-color-secondary); } .bazis-tag.bazis-color { --background: var(--bazis-color-base); --color: var(--bazis-color-contrast); } .bazis-tag.bazis-color bazis-icon { color: var(--color); } .bazis-tag_small { height: var(--height-s); } .bazis-tag_large { height: var(--height-l); } .bazis-tile { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --min-width: initial; --width: initial; --max-width: initial; --background: initial; --color: inherit; --background-hover: var(--background); --border-color-hover: var(--border-color); --box-shadow-hover: var(--box-shadow); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); min-width: var(--min-width); width: var(--width); max-width: var(--max-width); background: var(--background); color: var(--color); --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color); --border-color-hover: var(--bazis-border-color-dark); --height-header: initial; min-height: 100%; overflow: hidden; } .bazis-tile__header, .bazis-tile__content, .bazis-tile__footer { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --min-width: initial; --width: initial; --max-width: initial; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); min-width: var(--min-width); width: var(--width); max-width: var(--max-width); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); } .bazis-tile__header { position: relative; z-index: 1; } .bazis-tile__content ::-webkit-scrollbar-track, .bazis-tile__content::-webkit-scrollbar-track { margin-top: 1px; margin-bottom: 1px; } .bazis-tile__content:not(.bazis-tile_full .bazis-tile__content) { max-height: calc(281px - var(--height-header)); min-height: 100%; overflow-y: auto; overflow-x: hidden; } .bazis-timeline { display: flex; align-items: flex-end; } .bazis-timeline > *:not(.bazis-timeline__slider-wrapper) { flex-shrink: 0; } .bazis-map-wrapper .bazis-timeline, .sl-map-wrapper_dd .bazis-timeline { position: absolute; left: 8px; right: 8px; bottom: 8px; z-index: 150; border-radius: var(--bazis-border-radius); background: var(--bazis-color-white); padding: 10px 12px; width: calc(100% - 16px); } .bazis-timeline__slider-wrapper { max-width: 1080px; width: 100%; margin: 0 24px -4px; overflow: hidden; } .bazis-timeline__graph, .bazis-timeline__graph_brick { height: 40px; width: 100%; max-width: 1080px; } .bazis-timeline__graph_brick { display: flex; align-items: flex-end; } .bazis-timeline__labels { display: flex; width: 100%; max-width: 1080px; font-size: 11px; line-height: 12px; color: var(--bazis-text-color-secondary); } .bazis-timeline__labels span { width: 100%; transform: translateX(-48%); text-align: center; } .bazis-timeline__labels span:first-child { visibility: hidden; } .bazis-timeline__brickwork { position: relative; display: flex; flex-direction: column; justify-content: flex-end; width: 100%; height: 100%; padding: 0 2px 0 3px; } .bazis-timeline__brickwork::before { position: absolute; left: 0; content: ""; height: 100%; width: 1px; border-left: 1px solid var(--bazis-border-color); } .bazis-timeline__brickwork:nth-child(even)::before { height: 12px; } .bazis-timeline__brick, .bazis-timeline__brick_xs { height: 12px; width: 100%; padding: 1px; margin-bottom: 1px; border-radius: 1px; background: var(--bazis-color-base); color: var(--bazis-color-white); text-align: center; font-size: 10px; line-height: 1; } .bazis-timeline__brick:last-child, .bazis-timeline__brick_xs:last-child { margin-bottom: 0; } .bazis-timeline__brick_xs { height: 4px; } .bazis-timeline .bazis-timeline__play { margin-right: 22px; } .bazis-timeline .bazis-timeline__speed { --border-radius: 50%; --border-color: transparent; --border-color-activated: var(--bazis-border-color-dark); --background-activated: var(--bazis-color-white); --padding-start: 0; --padding-end: 0; width: 32px; margin: 0 2px; font-size: 10px; line-height: 16px; font-weight: 500; } .bazis-timeline .ngx-slider { margin: 2px 0 6px; } .bazis-timeline .ngx-slider .ngx-slider-pointer { background-color: var(--bazis-text-color); width: 3px; height: 12px; border-radius: 1.5px; top: -4px; } .bazis-timeline .ngx-slider .ngx-slider-pointer::after, .bazis-timeline .ngx-slider .ngx-slider-pointer::before { content: ""; position: absolute; top: 4px; width: 2px; height: 4px; border-radius: 0; background: var(--bazis-border-color); } .bazis-timeline .ngx-slider .ngx-slider-pointer::after { left: 3px; } .bazis-timeline .ngx-slider .ngx-slider-pointer::before { left: -2px; } .bazis-timeline .ngx-slider .ngx-slider-pointer.ngx-slider-active::after { background: var(--bazis-border-color); } .bazis-timeline .ngx-slider .ngx-slider-bar-wrapper { margin-top: -8px; padding-top: 8px; } .bazis-timeline .ngx-slider .ngx-slider-bar-wrapper.ngx-slider-selection-bar { visibility: visible !important; } .bazis-timeline .ngx-slider .ngx-slider-bar { background-color: var(--bazis-border-color); } .bazis-timeline .ngx-slider .ngx-slider-selection { background-color: var(--bazis-text-color); } .bazis-timeline .ngx-slider .ngx-slider-bubble { display: none; } .bazis-vehicle-number { /** * **/ --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --min-width: initial; --width: initial; --max-width: initial; --min-height: initial; --height: initial; --max-height: initial; --background: initial; --color: inherit; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); min-width: var(--min-width); width: var(--width); max-width: var(--max-width); min-height: var(--min-height); height: var(--height); max-height: var(--max-height); background: var(--background); color: var(--color); display: inline-flex; align-items: flex-end; font-family: "RoadNumbers"; width: auto; } .bazis-vehicle-number_rus .bazis-vehicle-number__part_0 { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .bazis-vehicle-number_rus .bazis-vehicle-number__part_1 { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .bazis-vehicle-number_rus .bazis-vehicle-number__part_2 { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .bazis-vehicle-number_rus .bazis-vehicle-number__part_3 { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } /* Form Components */ .bazis-control { /* * @prop --padding-field-start: внутренний начальный отступ поля * @prop --padding-field-end: внутренний конечный отступ поля * @prop --padding-field-top: внутренний верхний отступ поля * @prop --padding-field-bottom: внутренний нижний отступ поля * * @prop --background: фон поля * @prop --background-hover: фон поля при наведении * @prop --background-focus: фон поля при фокусе посредством клавиш * @prop --background-active: фон поля при состоянии active * @prop --background-disabled: фон отключенного поля * @prop --border-radius: радиус скругления поля * @prop --border-width: толщина границы поля * @prop --border-style: стиль границы поля * @prop --border-style-hover: стиль границы при наведении * @prop --border-style-focus: стиль границы при фокусе посредством клавиш * @prop --border-style-active: стиль границы при состоянии active * @prop --border-style-disabled: стиль границы отключенного поля * @prop --border-style-estimated: стиль границы расчетного поля * @prop --border-color: цвет границы поля * @prop --border-color-hover: цвет границы поля при при наведении * @prop --border-color-focus: цвет границы поля при фокусе посредством клавиш * @prop --border-color-active: цвет границы поля при состоянии active * @prop --border-color-disabled: цвет границы отключенного поля * * @prop --control-width: ширина контрола, по умолчанию не задана * * @prop --color: цвет текста поля * @prop --color-hover: цвет текста поля при наведении * @prop --color-focus: цвет текста поля при фокусе посредством клавиш * @prop --color-active: цвет текста поля при состоянии active * @prop --color-disabled: цвет текста отключенного поля * * @prop --color-label: цвет метки * @prop --font-size-label: размер шрифта метки * * @prop --height: высота поля * @prop --font-size: размер шрифта поля * @prop --size-icon: размер иконки * * @prop --note-font-size: размер шрифта комментария * @prop --note-line-height: интерльяж комментария * @prop --note-margin: отступ комментария * @prop --note-color: цвет комментария * * @prop --error-font-size: размер шрифта ошибки * @prop --error-line-height: интерльяж ошибки * @prop --error-margin: отступ ошибки * @prop --error-color: цвет ошибки */ --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --padding-field-start: 0; --padding-field-end: 0; --padding-field-top: 0; --padding-field-bottom: 0; --background-hover: var(--background); --background-focus: var(--background); --background-active: var(--background); --background-disabled: var(--background); --border-radius: initial; --border-width: initial; --border-color: initial; --border-color-hover: var(--border-color); --border-color-focus: var(--border-color); --border-color-active: var(--border-color); --border-color-disabled: var(--border-color); --border-style: initial; --border-style-hover: var(--border-style); --border-style-focus: var(--border-style); --border-style-active: var(--border-style); --border-style-disabled: var(--border-style); --border-style-estimated: var(--border-style); --color: inherit; --color-hover: var(--color); --color-focus: var(--color); --color-active: var(--color); --color-disabled: var(--color); --font-size: inherit; --size-icon: initial; --font-size-label: var(--font-size); --color-label: var(--color); --note-font-size: calc(var(--font-size) - 2px); --note-line-height: 12px; --note-margin: var(--bazis-margin-3x); --note-color: var(--bazis-text-color-secondary); --error-font-size: calc(var(--font-size) - 2px); --error-line-height: 12px; --error-margin: var(--bazis-margin-2x); --error-color: var(--bazis-color-danger); position: relative; width: var(--control-width); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); } .bazis-control__label { display: block; margin-bottom: var(--bazis-multiple-px); font-size: var(--font-size-label); font-weight: 500; line-height: 20px; color: var(--color-label); } .bazis-control__label .bazis-color { color: var(--bazis-color-base); } .bazis-control__label.bh-font-normal { font-weight: 400; } .bazis-control__field-group { position: relative; display: flex; align-items: center; background: var(--background); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); } .bazis-control__field-group-wrapper { display: flex; align-items: center; width: 100%; } .bazis-control__field-group-wrapper bazis-button { flex-shrink: 0; } .bazis-control__field-group:hover { background: var(--background-hover); border-color: var(--border-color-hover); border-style: var(--border-style-hover); color: var(--color-hover); } .bazis-control__field-group:focus, .bazis-control__field-group--focused { background: var(--background-focus); border-color: var(--border-color-focus); border-style: var(--border-style-focus); color: var(--color-focus); } .bazis-control__field-group:focus .bazis-control__field-group__end bazis-button.bazis-btn_clear:not(.bazis-eraser) bazis-icon, .bazis-control__field-group--focused .bazis-control__field-group__end bazis-button.bazis-btn_clear:not(.bazis-eraser) bazis-icon { color: var(--color-focused); } .bazis-control__field-group:active, .bazis-control__field-group--activated { background: var(--background-active); border-color: var(--border-color-active); border-style: var(--border-style-active); color: var(--color-active); } .bazis-control__field-group:active .bazis-control__field-group__end bazis-button.bazis-btn_clear:not(.bazis-eraser) bazis-icon, .bazis-control__field-group--activated .bazis-control__field-group__end bazis-button.bazis-btn_clear:not(.bazis-eraser) bazis-icon { color: var(--color-activated); } .bazis-control__field-group:disabled, .bazis-control__field-group[disabled], .bazis-control__field-group--disabled { background: var(--background-disabled); border-color: var(--border-color-disabled); border-style: var(--border-style-disabled); color: var(--color-disabled); pointer-events: none; } .bazis-control__field-group:disabled input, .bazis-control__field-group:disabled select, .bazis-control__field-group:disabled .bazis-control__field-group__start, .bazis-control__field-group:disabled .bazis-control__field-group__end, .bazis-control__field-group[disabled] input, .bazis-control__field-group[disabled] select, .bazis-control__field-group[disabled] .bazis-control__field-group__start, .bazis-control__field-group[disabled] .bazis-control__field-group__end, .bazis-control__field-group--disabled input, .bazis-control__field-group--disabled select, .bazis-control__field-group--disabled .bazis-control__field-group__start, .bazis-control__field-group--disabled .bazis-control__field-group__end { background: transparent; } .bazis-control__field-group:disabled .bazis-select__trigger, .bazis-control__field-group[disabled] .bazis-select__trigger, .bazis-control__field-group--disabled .bazis-select__trigger { background: var(--background-disabled); } .bazis-control__field-group_estimated { border-style: var(--border-style-estimated); } .bazis-control__field-group_estimated:hover, .bazis-control__field-group_estimated:focus, .bazis-control__field-group_estimated.bazis-control__field-group--focused, .bazis-control__field-group_estimated:active, .bazis-control__field-group_estimated.bazis-control__field-group--activated, .bazis-control__field-group_estimated:disabled, .bazis-control__field-group_estimated[disabled], .bazis-control__field-group_estimated.bazis-control__field-group--disabled { background: var(--background); border-color: var(--border-color); border-style: var(--border-style-estimated); color: var(--color); } .bazis-control__field-group bazis-icon { width: var(--size-icon); height: var(--size-icon); margin: 0; color: var(--bazis-placeholder-color); } .bazis-control__field-group button { flex-shrink: 0; outline: 0; border: 0; padding: 0; margin: 0; background: transparent; min-width: var(--height); height: var(--height); } .bazis-control__field-group bazis-badge.bazis-badge-medium { border-radius: 2px; padding: 0 6px; text-transform: uppercase; } .bazis-control__field-group__start, .bazis-control__field-group__end { flex-shrink: 0; min-width: var(--height); background: var(--background); color: var(--bazis-placeholder-color); text-align: center; } .bazis-control__field-group__start { border-radius: var(--border-radius) 0 0 var(--border-radius); } .bazis-control__field-group__start + .bazis-control__field, .bazis-control__field-group__start + .bazis-control__field .bazis-select { padding-left: 0; } .bazis-control__field-group__end { display: flex; align-items: center; border-radius: 0 var(--border-radius) var(--border-radius) 0; } .bazis-control__field-group__end > * { flex-shrink: 0; min-width: var(--height); } .bazis-control__field-group__end button { border-left: 1px solid var(--bazis-border-color); } .bazis-control__field-group__end bazis-button.bazis-btn_clear { --padding-end: calc(var(--bazis-multiple-px) * 3); --padding-start: calc(var(--bazis-multiple-px) * 3); } .bazis-control__field-group__end bazis-button.bazis-btn_clear :hover bazis-icon { color: var(--color-hover); } .bazis-control__field-group__end .bazis-eraser { visibility: hidden; } .bazis-control__field-group:hover .bazis-control__field-group__end .bazis-eraser { visibility: visible; } .bazis-control__field-wrapper { position: relative; flex: 1 1 auto; } .bazis-control__field { position: relative; display: flex; align-items: center; width: 100%; height: var(--height); outline: none; border: none; border-radius: var(--border-radius); background: transparent; padding-left: var(--padding-field-start); padding-right: var(--padding-field-end); padding-top: var(--padding-field-top); padding-bottom: var(--padding-field-bottom); font-size: var(--font-size); font-weight: 400; } .bazis-control__field::placeholder { color: var(--bazis-placeholder-color); } .bazis-control__field[type=number] { -moz-appearance: textfield; } .bazis-control__field::-webkit-outer-spin-button, .bazis-control__field::-webkit-inner-spin-button { -webkit-appearance: none; } .bazis-control__field-group_estimated .bazis-control__field, .bazis-control__field[disabled], .bazis-control__field-group--disabled .bazis-control__field { pointer-events: none; } .bazis-control__field.bh-no-padding, .bazis-control__field.bh-no-padding + .bazis-mask { padding-left: 0; padding-right: 0; } .bazis-control__units { display: block; border-left: 1px solid var(--bazis-border-color); padding-left: var(--bazis-padding); padding-right: var(--bazis-padding); font-size: var(--font-size); font-weight: 500; line-height: var(--height); white-space: nowrap; letter-spacing: 0.3px; } .bazis-control__note { margin: var(--note-margin) 0 0; font-size: var(--note-font-size); font-weight: 400; line-height: var(--note-line-height); color: var(--note-color); } .bazis-control__note p { --bazis-font-size-p: var(--note-font-size); --bazis-line-height-p: var(--note-line-height); --bazis-p-margin: var(--note-margin) 0 0; } .bazis-control__note p:first-child { --bazis-p-margin: 0; } .bazis-control__note .bazis-color { color: var(--bazis-color-base); } .bazis-control__error { font-size: var(--error-font-size); font-weight: 400; line-height: var(--error-line-height); color: var(--error-color); } .bazis-control__error p { --bazis-font-size-p: var(--error-font-size); --bazis-line-height-p: var(--error-line-height); --bazis-p-margin: var(--error-margin) 0 0; } .bazis-control__error .bazis-color { color: var(--bazis-color-base); } .bazis-control textarea { resize: vertical; } .bazis-checkbox { /** * @prop --background: фон флажка * @prop --background-checked: фон при установленном флажке * @prop --background-disabled: фон при отключенном флажке * @prop --disabled-opacity: прозрачность чекбокса при отключенном флажке * * @prop --color: цвет текста чекбокса * @prop --color-checked: цвет текста при установленном флажке * @prop --color-disabled: цвет текста при отключенном флажке * * @prop --transition: переход * * @prop --border-radius: радиус скругления * @prop --border-width: толщина границы * @prop --border-style: стиль границы * @prop --border-color: цвет границы * @prop --border-color-checked: цвет границы при установленном флажке * @prop --border-color-disabled: цвет границы при отключенном флажке * * @prop --checkmark-color: Цвет галочки флажка при установленном флажке * * @prop --size: Размер значка флажка. */ --background-checked: var(--bazis-color-primary); --background-disabled: initial; --border-color-checked: var(--bazis-color-primary); --border-color-disabled: initial; --color-checked: var(--color); --color-disabled: var(--color); --checkmark-color: var(--bazis-color-primary-contrast); --transition: none; position: relative; -webkit-user-select: none; user-select: none; z-index: 2; } .bazis-checkbox.bazis-color { --background-checked: var(--bazis-color-base); --border-color-checked: var(--bazis-color-base); --checkmark-color: var(--bazis-color-contrast); } .bazis-checkbox label { position: relative; } .bazis-checkbox__label { position: relative; display: flex; margin-left: 0; margin-right: 0; margin-top: 0; margin-bottom: 0; border: 0; background: transparent; cursor: pointer; appearance: none; outline: none; align-items: flex-start; } .bazis-checkbox__label::-moz-focus-inner { border: 0; } .bazis-checkbox__label::before { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='8' viewBox='0 0 11 8'%3E%3Cpath d='M0 4.17391L0.6875 3.47826L3.78125 6.6087L10.3125 0L11 0.695652L3.78125 8L0 4.17391Z' fill='white' /%3E%3C/svg%3E"); flex-shrink: 0; border-radius: var(--border-radius); position: relative; width: var(--size); height: var(--size); margin-left: calc(var(--size) / 2); margin-right: calc(var(--size) / 2); transition: var(--transition); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); background: var(--background); box-sizing: border-box; text-align: center; } .bazis-checkbox__label.bazis-label-hidden { margin-right: 0; } .bazis-checkbox input { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; outline: 0; clip: rect(0 0 0 0); opacity: 0; overflow: hidden; -webkit-appearance: none; -moz-appearance: none; } .bazis-checkbox input:checked + .bazis-checkbox__label { color: var(--color-checked); } .bazis-checkbox input:checked + .bazis-checkbox__label::before { border-color: var(--border-color-checked); background: var(--background-checked); color: var(--checkmark-color); } .bazis-checkbox input:disabled + .bazis-checkbox__label { pointer-events: none; color: var(--color-disabled); } .bazis-checkbox input:disabled + .bazis-checkbox__label::before { opacity: var(--disabled-opacity); } .bazis-checkbox input:disabled:not(:checked) + .bazis-checkbox__label::before { content: ""; background: var(--background-disabled); border-color: var(--border-color-disabled); } .bazis-checkbox_right { direction: rtl; text-align: left; } .bazis-checkbox_right .bazis-checkbox__label { justify-content: flex-end; } .bazis-contacts-control__group { --margin-bottom: 0; margin-bottom: var(--margin-bottom); } .bazis-contacts-control__group:last-of-type { margin-bottom: 0; } .bazis-datetime-control { --margin-bottom: 0; position: relative; margin-bottom: var(--margin-bottom); } .bazis-datetime-control > .bazis-control__note { display: flex; align-items: center; } .bazis-datetime-control > .bazis-control__note .bazis-checkbox label::before { margin-left: 0; } .bazis-input-file_photo__container { --margin-top: 0; display: flex; flex-wrap: wrap; margin-top: var(--margin-top); } .bazis-interval-control { --background: initial; --box-shadow: initial; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); display: flex; justify-content: space-between; align-items: flex-start; background: var(--background); box-shadow: var(--box-shadow); } .bazis-mask { position: absolute; width: 100%; opacity: 0.4; pointer-events: none; border-color: transparent !important; top: 0; left: 0; outline: none; } .bazis-number-buttons-control .bazis-control__field-group { --size-icon: 12px; } .bazis-number-buttons-control .bazis-control__field-group bazis-button { --height: 24px; --border-radius: 50%; --padding-start: 11px; --padding-end: 11px; } .bazis-number-buttons-control .bazis-control__field-group bazis-button ::slotted(bazis-icon[slot=icon-only]) { font-size: var(--size-icon); } .bazis-number-buttons-control__data { margin: 0 var(--bazis-margin-3x); white-space: nowrap; } .bazis-options-content { --margin-top: 0; --max-height: inherit; margin-top: var(--margin-top); max-height: var(--max-height); overflow: auto; } .bazis-dropdown__body .bazis-options-content { margin-top: 0; } .bazis-radio { /** * @prop --background: фон radio * @prop --background-checked: фон при установленном radio * @prop --background-disabled: фон при отключенном radio * @prop --disabled-opacity: прозрачность чекбокса при отключенном radio * * @prop --color: цвет метки radio * @prop --color-checked: цвет метки при установленном radio * @prop --color-disabled: цвет метки при отключенном radio * * @prop --transition: переход * * @prop --border-radius: радиус скругления * @prop --border-width: толщина границы * @prop --border-style: стиль границы * @prop --border-color: цвет границы * @prop --border-color-checked: цвет границы при установленном radio * @prop --border-width-checked: толщина границы при установленном radio * @prop --border-color-disabled: цвет границы при отключенном radio * * @prop --size: Размер значка radio. */ --background-checked: var(--bazis-color-primary); --border-color-checked: var(--bazis-color-primary); --color-checked: var(--color); --color-disabled: var(--color); --transition: none; position: relative; -webkit-user-select: none; user-select: none; z-index: 2; } .bazis-radio.bazis-color { --background-checked: var(--bazis-color-base); --border-color-checked: var(--bazis-color-base); } .bazis-radio label { position: relative; } .bazis-radio__label { position: relative; display: flex; margin-left: 0; margin-right: 0; margin-top: 0; margin-bottom: 0; border: 0; background: transparent; cursor: pointer; appearance: none; outline: none; align-items: flex-start; } .bazis-radio__label::-moz-focus-inner { border: 0; } .bazis-radio__label::before { content: ""; flex-shrink: 0; border-radius: var(--border-radius); position: relative; width: var(--size); height: var(--size); margin-left: calc(var(--size) / 2); margin-right: calc(var(--size) / 2); transition: var(--transition); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); background: var(--background); box-sizing: border-box; } .bazis-radio__label.bazis-label-hidden { margin-right: 0; } .bazis-radio input { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; outline: 0; clip: rect(0 0 0 0); opacity: 0; overflow: hidden; -webkit-appearance: none; -moz-appearance: none; } .bazis-radio input:checked + .bazis-radio__label { color: var(--color-checked); } .bazis-radio input:checked + .bazis-radio__label::before { border-color: var(--border-color-checked); border-width: var(--border-width-checked); background: var(--background-checked); } .bazis-radio input:disabled + .bazis-radio__label { pointer-events: none; color: var(--color-disabled); } .bazis-radio input:disabled + .bazis-radio__label::before { opacity: var(--disabled-opacity); } .bazis-radio_right { direction: rtl; text-align: left; } .bazis-radio_right .bazis-radio__label { justify-content: flex-end; } .bazis-radio_tab { width: 100%; } .bazis-radio_tab .bazis-radio__label { display: flex; flex-direction: column; align-items: center; justify-content: center; } .bazis-radio_tab input:checked + .bazis-radio__label { background: var(--border-color-checked); color: var(--background-checked); } .bazis-radio_tab:first-child .bazis-radio__label { border-radius: var(--bazis-border-radius) 0 0 var(--bazis-border-radius); } .bazis-radio_tab:last-child .bazis-radio__label { border-radius: 0 var(--bazis-border-radius) var(--bazis-border-radius) 0; } .bazis-radio_block .bazis-radio__label { display: block; } .bazis-radio_block .bazis-radio__label::before { display: block; float: left; } .bazis-select-date-control { --width: initial; width: var(--width); } @media (max-width: 1024px) { .bazis-select-date-control { --width: 100%; } } .bazis-select-native, .bazis-select { position: relative; width: 100%; height: 100%; } .bazis-select { --padding-start: initial; --padding-end: initial; --border-radius: initial; --background: initial; position: absolute; top: 0; left: 0; display: none; padding-left: var(--padding-start); padding-right: var(--padding-end); border-radius: var(--border-radius); } .bazis-select { display: block; } .bazis-select-native:focus + .bazis-select { display: none; } .bazis-select-native { -webkit-appearance: none; -moz-appearance: none; border: 0; outline: 0; margin-left: 24px; } app-select-filter .bazis-select-native { margin-left: 0; } .bazis-select__trigger { position: relative; display: inline-flex; align-items: center; width: 100%; height: 100%; background: var(--background); cursor: pointer; } .bazis-select__trigger span { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .bazis-select__trigger + .bazis-control__field { --padding-field-start: 0; --padding-field-end: 0; position: absolute; top: 0; opacity: 0; background: var(--bazis-background); } .bazis-select__trigger + .bazis-control__field--focused { opacity: 1; } .bazis-select-text { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); display: inline-block; } .bazis-select-text__label { --font-size: inherit; --font-weight: inherit; --line-height: initial; font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .bazis-switcher { /** * @prop --color: цвет текста чекбокса * @prop --color-checked: цвет текста при установленном флажке * @prop --color-disabled: цвет текста при отключенном флажке */ --font-size: inherit; --font-weight: inherit; --line-height: initial; --color: inherit; --color-checked: var(--color); --color-disabled: var(--color); } .bazis-switcher bazis-toggle { vertical-align: middle; } .bazis-switcher__label { font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); vertical-align: middle; color: var(--color); } .bazis-toggle--checked + .bazis-switcher__label { color: var(--color-checked); } .bazis-toggle--disabled + .bazis-switcher__label { color: var(--color-disabled); } .bazis-vehicle-number-control { --width-group: initial; } .bazis-vehicle-number-control .bazis-control__field { --height: auto; flex-shrink: 0; padding: 0; } .bazis-vehicle-number-control .bazis-control__field-group { align-items: flex-end; width: var(--width-group); } .bazis-vehicle-number-control input { outline: none; border: none; height: 100%; width: 100%; padding: 0; margin: 0; background: transparent; text-align: center; } .bazis-vehicle-number-control input.ng-dirty.ng-touched + .bazis-vehicle-number-control__placeholder { opacity: 0; } .bazis-vehicle-number-control__placeholder { position: absolute; background: transparent; pointer-events: none; } .bazis-vehicle-number-control__placeholder::placeholder { text-align: center; } .bazis-vehicle-number-control_rus .bazis-vehicle-number-control__part_0 { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .bazis-vehicle-number-control_rus .bazis-vehicle-number-control__part_1 { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .bazis-vehicle-number-control_rus .bazis-vehicle-number-control__part_2 { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .bazis-vehicle-number-control_rus .bazis-vehicle-number-control__part_3 { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .bazis-display-error_icon { display: flex; justify-content: space-between; align-items: center; margin: 0 0 16px; padding: 8px; background: var(--bazis-background-dark); border-radius: var(--bazis-border-radius); font-size: 13px; line-height: 20px; } .bazis-display-error_icon p { margin: 0; } /* Table Components */ table { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); width: 100%; } table.bazis-table-fixed { table-layout: fixed; } tr { vertical-align: top; } th, td { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --background: initial; --color: inherit; --font-size: inherit; --font-weight: inherit; --line-height: initial; background: var(--background); color: var(--color); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); } .bazis-td-no-border td, td.bazis-td-no-border { --border-width: 0; } td.bazis-td-top-zero { --padding-top: 0; } td.bazis-td-bottom-zero { --padding-bottom: 0; } /* MAP */ bazis-map { position: relative; display: block; width: 100%; height: 100%; } .bazis-map { height: 100%; width: 100%; } .bazis-map__base-control { position: absolute; z-index: 150; top: 50%; right: calc(var(--bazis-multiple-px) * 5); display: flex; flex-direction: column; align-items: center; justify-content: center; transform: translateY(-50%); } .bazis-map__base-control bazis-tooltip { --padding-top: 4px; --padding-bottom: 4px; --min-height: 24px; --min-width: auto; } .bazis-map__base-control .bazis-btn-group_h bazis-button { --border-color: var(--bazis-border-color-dark); --background: var(--bazis-color-white); --color: var(--bazis-text-color-secondary); --background-activated: var(--bazis-color-info-tint); --color-activated: vvar(--bazis-text-color-secondary); --background-hover: var(--bazis-background-medium); --color-hover: var(--bazis-text-color-secondary); --background-focused: var(--background-hover); --color-focused: var(--color-hover); } .bazis-map__base-control .bazis-btn-group_h bazis-button:hover::part(native) { border-color: var(--border-color); } .bazis-map__base-control .bazis-btn-group_h bazis-button:hover bazis-icon { color: var(--color-hover); } .bazis-map__base-control > * { margin-bottom: calc(var(--bazis-multiple-px) * 8); } .bazis-map__base-control > *:last-child { margin-bottom: 0; } .bazis-map__base-control > *:only-child { margin-bottom: 0; } .bazis-figure .bazis-map__base-control { top: 8px; right: 8px; transform: translateY(0); } .bazis-map__base-control_top { top: 20px; transform: translateY(0); } .bazis-map-wrapper, .sl-map-wrapper_dd { /* * @prop --height: Высота обертки, желательно в пикселях. * Без определенной высоты, компонент карты не будет понимать до чего расстягиваться * @prop --width: Ширина обертки * @prop --margin-start: внешний начальный отступ обертки * @prop --margin-end: внешний конечный отступ обертки * @prop --margin-top: внешний верхний отступ обертки * @prop --margin-bottom: внешний нижний отступ обертки */ --height: 500px; --width: 100%; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; position: relative; height: var(--height); width: var(--width); margin: var(--margin-top) var(--margin-end) var(--margin-bottom) var(--margin-start); } .bazis-map-circle { float: right; width: 180px; height: 180px; margin-left: var(--bazis-margin); } .bazis-map-circle .bazis-map { clip-path: circle(90px); } .bazis-map.bazis-map_grayscale .leaflet-tile-container img { filter: grayscale(1); } /* Pages */ .bazis-dummy-page { position: relative; background: var(--bazis-background); height: 100%; } .bazis-modal .bazis-dummy-page { position: static; } .bazis-dummy-page__content { padding: 40px; display: flex; flex-direction: column; align-items: center; justify-content: center; max-width: 744px; height: 100%; margin: auto; text-align: center; } .bazis-dummy-page h2 { margin: 20px 0 16px; } .bazis-dummy-page p { font-size: 16px; line-height: 24px; } @media (max-width: 768px) { .bazis-dummy-page__content { max-width: 490px; } } @media (max-width: 576px) { .bazis-dummy-page__content { max-width: 392px; } } .bazis-list-page { --background-head: var(--bazis-background-medium); --background-filters: var(--bazis-background-medium); --background-body: transparent; } .bazis-list-page__head { background: var(--background-head); } .bazis-list-page__head .bazis-breadcrumbs { padding-left: 0; padding-right: 0; } .bazis-list-page__title { display: flex; align-items: center; } @media (min-width: 1024.98px) { .bazis-list-page__title h1 { margin: 0; } .os-Windows .bazis-list-page__title h1 { position: relative; top: -6px; } } .bazis-list-page__filters { background: var(--background-filters); } .bazis-list-page__body { background: var(--background-body); } @media (max-width: 576px) { .bazis-list-page .bazis-list-page__title { display: block; } } @font-face { font-family: "Gordita"; font-display: swap; src: local("Gordita Regular"), local("Gordita-Regular"), url("/assets/fonts/Gordita-Regular.woff2") format("woff2"), url("/assets/fonts/Gordita-Regular.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: "Gordita"; font-display: swap; src: local("Gordita Italic"), local("Gordita-Italic"), url("/assets/fonts/Gordita-Italic.woff2") format("woff2"), url("/assets/fonts/Gordita-Italic.woff") format("woff"); font-weight: normal; font-style: italic; } @font-face { font-family: "Gordita"; font-display: swap; src: local("Gordita Medium"), local("Gordita-Medium"), url("/assets/fonts/Gordita-Medium.woff2") format("woff2"), url("/assets/fonts/Gordita-Medium.woff") format("woff"); font-weight: 500; font-style: normal; } @font-face { font-family: "Gordita"; font-display: swap; src: local("Gordita Medium Italic"), local("Gordita-Medium-Italic"), url("/assets/fonts/Gordita-Medium-Italic.woff2") format("woff2"), url("/assets/fonts/Gordita-Medium-Italic.woff") format("woff"); font-weight: 500; font-style: italic; } @font-face { font-family: "Gordita"; font-display: swap; src: local("Gordita Bold"), local("Gordita-Bold"), url("/assets/fonts/Gordita-Bold.woff2") format("woff2"), url("/assets/fonts/Gordita-Bold.woff") format("woff"); font-weight: bold; font-style: normal; } @font-face { font-family: "RoadNumbers"; font-display: swap; src: local("RoadNumbers"), local("RoadNumbers2.0"), url("/assets/fonts/RoadNumbers2.0.otf") format("otf"), url("/assets/fonts/RoadNumbers2.0.ttf") format("truetype"); font-weight: 400; font-style: normal; } h2, h4, h5 { margin: 0; } h1, h2, h3 { font-weight: 400; } h1 + .sl-h1_subtitle, .bazis-h1 + .sl-h1_subtitle { padding-bottom: 50px; } @media (max-width: 1024px) { h1, .bazis-h1 { --bazis-font-size-h1: var(--bazis-font-size-h3); --bazis-line-height-h1: var(--bazis-line-height-h3); --bazis-h1-margin: var(--bazis-h3-margin); } } bazis-toolbar h3, bazis-toolbar .bazis-h3 { --bazis-h3-margin: 0; } @media (max-width: 1024px) { h3, .bazis-h3 { --bazis-font-size-h3: var(--bazis-font-size-h5); --bazis-line-height-h3: var(--bazis-line-height-h5); } } h4, .bazis-h4 { font-weight: 500; } h5, .bazis-h5 { font-weight: 700; } h5.bh-font-medium, .bazis-h5.bh-font-medium { font-weight: 500; } h5.bh-font-normal, .bazis-h5.bh-font-normal { font-weight: 400; } @media (max-width: 1024px) { h5, .bazis-h5 { --bazis-font-size-h5: var(--bazis-font-size-p-major); --bazis-line-height-h5: var(--bazis-line-height-p-major); } } h6, .bazis-h6 { font-weight: 700; } h6 bazis-button, .bazis-h6 bazis-button { vertical-align: middle; } aside.sl-aside_right h6, aside.sl-aside_right .bazis-h6 { --bazis-h6-margin: 0 0 8px; } aside.sl-aside_right bazis-toolbar h6.bazis-h6_minor, aside.sl-aside_right bazis-toolbar .bazis-h6.bazis-h6_minor { --bazis-h6-margin-minor: 0; } h6.bh-font-medium, .bazis-h6.bh-font-medium { font-weight: 500; } h6.bh-font-normal, .bazis-h6.bh-font-normal { font-weight: 400; } h6:only-child, .bazis-h6:only-child { margin-bottom: 0; } p:last-child { margin-bottom: 0; } strong { font-weight: 700; } span.bazis-color { color: var(--bazis-color-base); } .sl-text_total { font-size: 20px; font-weight: 500; line-height: 21px; } .sl-text_field-height { line-height: 36px; } .sl-text_inner a { text-decoration: none; } .sl-text_reduced.bazis-p, .sl-text_reduced.bazis-p_major, .sl-text_reduced.bazis-text_major { line-height: 16px; } .sl-text_reduced.bazis-p_minor, .sl-text_reduced.bazis-text_minor { line-height: 12px; } .sl-text_caps.bazis-text_minor, .sl-text_caps.bazis-p_minor { --bazis-line-height-p-minor: 20px; text-transform: uppercase; letter-spacing: 1px; } .sl-letter-spacing_025 { letter-spacing: 0.25px; } .sl-letter-spacing_05 { letter-spacing: 0.5px; } .sl-letter-spacing_075 { letter-spacing: 0.75px; } .sl-letter-spacing_1 { letter-spacing: 1px; } .bazis-text_action, .sl-text_inner a { font-weight: 500; } .bazis-p_major .bazis-text_action, .bazis-p_major .sl-text_inner a, .sl-text_inner .bazis-p_major a, .bazis-text_action.bazis-p_major, .sl-text_inner a.bazis-p_major, .bazis-p_minor .bazis-text_action, .bazis-p_minor .sl-text_inner a, .sl-text_inner .bazis-p_minor a, .bazis-text_action.bazis-p_minor, .sl-text_inner a.bazis-p_minor, .bazis-text_major .bazis-text_action, .bazis-text_major .sl-text_inner a, .sl-text_inner .bazis-text_major a, .bazis-text_action.bazis-text_major, .sl-text_inner a.bazis-text_major, .bazis-text_minor .bazis-text_action, .bazis-text_minor .sl-text_inner a, .sl-text_inner .bazis-text_minor a, .bazis-text_action.bazis-text_minor, .sl-text_inner a.bazis-text_minor { letter-spacing: 0.5px; } .sl-text_link { color: var(--bazis-color-link); } .sl-text_uppercase { text-transform: uppercase; } .sl-text_xs { font-size: 11px; } .bazis-icon_fill { width: 20px; height: 20px; padding: 6px; border-radius: var(--bazis-border-radius); } .rs-text-icon { display: inline-flex; align-items: center; gap: 8px; } @media (max-width: 1024px) { .bazis-container, .bazis-message-plane, .bazis-container_margin { padding: 0 20px; } } /* Leaflet */ /* required styles */ .leaflet-pane, .leaflet-tile, .leaflet-marker-icon, .leaflet-marker-shadow, .leaflet-tile-container, .leaflet-pane > svg, .leaflet-pane > canvas, .leaflet-zoom-box, .leaflet-image-layer, .leaflet-layer { position: absolute; left: 0; top: 0; } .leaflet-container { overflow: hidden; } .leaflet-tile, .leaflet-marker-icon, .leaflet-marker-shadow { -webkit-user-select: none; user-select: none; -webkit-user-drag: none; } /* Safari renders non-retina tile on retina better with this, but Chrome is worse */ .leaflet-safari .leaflet-tile { image-rendering: -webkit-optimize-contrast; } /* hack that prevents hw layers "stretching" when loading new tiles */ .leaflet-safari .leaflet-tile-container { width: 1600px; height: 1600px; -webkit-transform-origin: 0 0; } .leaflet-marker-icon, .leaflet-marker-shadow { display: block; } /* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */ /* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */ .leaflet-container .leaflet-overlay-pane svg, .leaflet-container .leaflet-marker-pane img, .leaflet-container .leaflet-shadow-pane img, .leaflet-container .leaflet-tile-pane img, .leaflet-container img.leaflet-image-layer { max-width: none !important; max-height: none !important; border-radius: 0 !important; object-fit: none !important; } .leaflet-container.leaflet-touch-zoom { touch-action: pan-x pan-y; } .leaflet-container.leaflet-touch-drag { /* Fallback for FF which doesn't support pinch-zoom */ touch-action: none; touch-action: pinch-zoom; } .leaflet-container.leaflet-touch-drag.leaflet-touch-zoom { touch-action: none; } .leaflet-container { -webkit-tap-highlight-color: transparent; } .leaflet-container a { -webkit-tap-highlight-color: rgba(51, 181, 229, 0.4); } .leaflet-tile { filter: inherit; visibility: hidden; } .leaflet-tile-loaded { visibility: inherit; } .leaflet-zoom-box { width: 0; height: 0; z-index: 80; } /* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */ .leaflet-overlay-pane svg { -moz-user-select: none; } .leaflet-pane { z-index: 40; } .leaflet-pane.leaflet-tile-pane { z-index: 20; } .leaflet-pane.leaflet-editor_base-pane { z-index: 30; } .leaflet-pane.leaflet-overlay-pane { z-index: 40; } .leaflet-pane.leaflet-shadow-pane { z-index: 50; } .leaflet-pane.leaflet-marker-pane { z-index: 60; } .leaflet-pane.leaflet-tooltip-pane { z-index: 65; } .leaflet-pane.leaflet-popup-pane { z-index: 7000; } .leaflet-map-pane canvas { z-index: 10; } .leaflet-map-pane svg { z-index: 20; } .leaflet-vml-shape { width: 1px; height: 1px; } .lvml { behavior: url(#default#VML); display: inline-block; position: absolute; } /* control positioning */ .leaflet-control-container > div { display: flex; align-items: flex-start; } .leaflet-control { position: relative; pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */ pointer-events: auto; } .leaflet-top, .leaflet-bottom { position: absolute; pointer-events: none; } .leaflet-top { z-index: 100; top: 0; } .leaflet-right { right: 0; } .leaflet-bottom { z-index: 0; bottom: 0; } .leaflet-left { left: 0; } .leaflet-control { float: left; clear: both; } .leaflet-right .leaflet-control { float: right; } .leaflet-top .leaflet-control { margin-top: 10px; } .leaflet-bottom .leaflet-control { margin-bottom: 10px; } .leaflet-left .leaflet-control { margin-left: 10px; } .leaflet-right .leaflet-control { margin-right: 10px; } /* zoom and fade animations */ .leaflet-fade-anim .leaflet-tile { will-change: opacity; } .leaflet-fade-anim .leaflet-popup { opacity: 0; transition: opacity 0.2s linear; } .leaflet-fade-anim .leaflet-map-pane .leaflet-popup { opacity: 1; } .leaflet-zoom-animated { transform-origin: 0 0; } .leaflet-zoom-anim .leaflet-zoom-animated { will-change: transform; } .leaflet-zoom-anim .leaflet-zoom-animated { transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1); } .leaflet-zoom-anim .leaflet-tile, .leaflet-pan-anim .leaflet-tile { transition: none; } .leaflet-zoom-anim .leaflet-zoom-hide { visibility: hidden; } /* cursors */ .leaflet-interactive { cursor: pointer; } .leaflet-grab { cursor: -moz-grab; } .leaflet-crosshair, .leaflet-crosshair .leaflet-interactive { cursor: crosshair; } .leaflet-popup-pane, .leaflet-control { cursor: auto; } .leaflet-dragging .leaflet-grab, .leaflet-dragging .leaflet-grab .leaflet-interactive, .leaflet-dragging .leaflet-marker-draggable { cursor: move; cursor: -moz-grabbing; } /* marker & overlays interactivity */ .leaflet-marker-icon, .leaflet-marker-shadow, .leaflet-image-layer, .leaflet-pane > svg path, .leaflet-tile-container { pointer-events: none; } .leaflet-marker-icon.leaflet-interactive, .leaflet-image-layer.leaflet-interactive, .leaflet-pane > svg path.leaflet-interactive { pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */ pointer-events: auto; } .leaflet-map-pane, .leaflet-canvas-pane { will-change: transform; width: 100%; height: 100%; } /* visual tweaks */ .leaflet-container { outline: 0; } /* general toolbar styles */ .leaflet-bar a.leaflet-disabled { cursor: default; background-color: #f4f4f4; color: #bbb; } /* layers control */ .leaflet-control-layers .leaflet-control-layers-list, .leaflet-control-layers-expanded .leaflet-control-layers-toggle { display: none; } .leaflet-control-layers-expanded .leaflet-control-layers-list { display: block; position: relative; } .leaflet-control-layers-expanded { padding: 6px 10px 6px 6px; color: #333; background: #fff; } .leaflet-control-layers-scrollbar { overflow-y: scroll; overflow-x: hidden; padding-right: 5px; } .leaflet-control-layers-selector { margin-top: 2px; position: relative; top: 1px; } .leaflet-control-layers label { display: block; } .leaflet-control-layers-separator { height: 0; border-top: 1px solid #ddd; margin: 5px -10px 5px -6px; } /* Default icon URLs */ .leaflet-default-icon-path { background-image: url("/assets/images/marker-icon.png"); } /* attribution and scale controls */ .leaflet-container .leaflet-control-attribution { background: #fff; background: rgba(255, 255, 255, 0.7); margin: 0; } .leaflet-control-attribution, .leaflet-control-scale-line { padding: 0 5px; color: #333; } .leaflet-control-attribution a { text-decoration: none; } .leaflet-control-attribution a:hover { text-decoration: underline; } .leaflet-container .leaflet-control-attribution, .leaflet-container .leaflet-control-scale { font-size: 11px; } .leaflet-left .leaflet-control-scale { margin-left: 5px; } .leaflet-bottom .leaflet-control-scale { margin-bottom: 5px; } .leaflet-control-scale-line { border: 2px solid #777; border-top: none; line-height: 1.1; padding: 2px 5px 1px; font-size: 11px; white-space: nowrap; overflow: hidden; background: #fff; background: rgba(255, 255, 255, 0.5); } .leaflet-control-scale-line:not(:first-child) { border-top: 2px solid #777; border-bottom: none; margin-top: -2px; } .leaflet-control-scale-line:not(:first-child):not(:last-child) { border-bottom: 2px solid #777; } .leaflet-control-layers-list { z-index: 110; } .leaflet-interactive { padding: 0; margin: 0; list-style: none; display: flex; align-items: center; justify-content: center; } .leaflet-container__inner { display: flex; } .leaflet-container__inner__pic { width: 44px; min-height: 44px; float: left; flex-shrink: 0; display: flex; justify-content: center; flex-direction: column; text-align: center; background: linear-gradient(135deg, #65799b 0%, #5e2563 100%); } .leaflet-container__inner__pic i { font-size: 32px; color: white; } .leaflet-container__inner__content { padding: 10px 20px 10px 15px; } .leaflet-popup { /* * @prop --min-height: минимальная высота тултипа * @prop --width: ширина тултипа * @prop --border-radius: радиус скругления * @prop --border-width: толщина границы * @prop --border-style: стиль границы * @prop --border-color: цвет границы * @prop --background: фон тултипа * @prop --box-shadow: тень тултипа * * @prop --padding-start: внутренний начальный отступ тултипа * @prop --padding-end: внутренний конечный отступ тултипа * @prop --padding-top: внутренний верхний отступ тултипа * @prop --padding-bottom: внутренний нижний отступ тултипа * * @prop --width-arrow: ширина стрелочки * @prop --height-arrow: высота стрелочки * * @prop --height-marker: высота маркера * * @prop --width-close: ширина кнопки закрытия * @prop --height-close: высота кнопки закрытия * @prop --top-close: позиционирование сверху кнопки закрытия * @prop --right-close: позиционирование справа кнопки закрытия * @prop --background-close: фон кнопки закрытия * @prop --background-hover-close: фон при наведении кнопки закрытия * @prop --color-close: цвет кнопки закрытия * @prop --color-hover-close: цвет при наведении кнопки закрытия */ --min-height: initial; --width: initial; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --background: initial; --box-shadow: initial; --color-close: initial; --background-close: initial; --color-hover-close: var(--color-close); --background-hover-close: var(--background-close); position: absolute; margin-bottom: calc(var(--height-arrow) + 3px); } .leaflet-popup-content-wrapper { overflow-y: auto; box-sizing: border-box; min-height: var(--min-height); max-height: var(--max-height); width: var(--width); border-radius: var(--border-radius); border: var(--border-width) var(--border-style) var(--border-color); background: var(--background); box-shadow: var(--box-shadow); padding: var(--padding-top) var(--padding-end) var(--padding-bottom) var(--padding-start); } .leaflet-popup-content { width: 100% !important; } .leaflet-popup-tip { border-top: var(--height-arrow) solid var(--background); border-left: calc(var(--width-arrow) / 2) solid transparent; border-right: calc(var(--width-arrow) / 2) solid transparent; } .leaflet-popup-tip-container { position: absolute; left: 50%; overflow: hidden; width: var(--width-arrow); height: var(--height-arrow); margin-left: calc(var(--width-arrow) / -2); pointer-events: none; } .leaflet-popup-scrolled { overflow: auto; border-bottom: 1px solid red; border-top: 1px solid red; } .leaflet-popup-close-button { position: absolute; z-index: 10; top: var(--top-close); right: var(--right-close); width: var(--width-close); height: var(--height-close); padding: 0; border: none; background: var(--background-close); line-height: var(--height-close); font-weight: 700; font-size: 20px; text-align: center; text-decoration: none; color: var(--color-close); } .leaflet-popup-close-button :hover { background: var(--background-hover-close); color: var(--color-hover-close); } .leaflet-popup { --min-height: 100px; --max-height: 190px; --width: 357px; --padding-start: 20px; --padding-end: 20px; --padding-top: 20px; --padding-bottom: 24px; --border-radius: var(--bazis-border-radius); --background: var(--bazis-color-white); --width-arrow: 24px; --height-arrow: 8px; --top-close: 8px; --right-close: 8px; --width-close: 20px; --height-close: 20px; --background-close: var(--bazis-color-white); --background-hover-close: var(--bazis-background-medium); --color-close: var(--bazis-color-action); } .leaflet-popup .bazis-list_short-info { flex-wrap: wrap; } .leaflet-popup .bazis-list_gallery { --margin-bottom-list: 16px; } .leaflet-popup .bazis-list_gallery > .bazis-item { --margin-end: 8px; } .leaflet-popup .bazis-list_gallery .bazis-figure { --height: 56px; --width: 56px; --border-radius: var(--bazis-border-radius); --border-width: 0; } .leaflet-tooltip { /** * @prop --background: Фон тултипа * @prop --color: цвет текста тултипа * * @prop --border-radius: радиус скругления тултипа * @prop --box-shadow: тень тултипа * * @prop --padding-start: начальный внутренний отступ тултипа * @prop --padding-end: конечный внутренний отступ тултипа * @prop --padding-top: верхний внутреннний отступ тултипа * @prop --padding-bottom: нижний внутренниц отступ тултипа * * @prop --min-height: минимальная высота тултипа * @prop --min-width: минимальная ширина тултипа * @prop --width: ширина тултипа * @prop --max-width: максимальная ширина тултипа * * @prop --font-size: размер шрифта тултипа * @prop --font-weight: жирность шрифта тултипа * @prop --line-height: межстрочный интервал шрифта тултипа * * @prop --height-arrow: высота стрелки тултипа * @prop --width-arrow: ширина стрелки тултипа */ --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --background: initial; --min-height: initial; --max-height: initial; --min-width: initial; --width: initial; --max-width: initial; --color: inherit; --font-size: inherit; --font-weight: inherit; --line-height: initial; --height-arrow: initial; --width-arrow: initial; --border-color-arrow: var(--background); position: absolute; min-height: var(--min-height); max-height: var(--max-height); min-width: var(--min-width); max-width: var(--max-width); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); color: var(--color); } .leaflet-tooltip__content { position: absolute; bottom: 0; display: block; box-sizing: border-box; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); background: var(--background); box-shadow: var(--box-shadow); border-radius: var(--border-radius); width: var(--width); } .leaflet-tooltip::after { content: ""; position: absolute; bottom: calc(var(--height-arrow) / -1); border-left: calc(var(--width-arrow) / 2) solid transparent; border-right: calc(var(--width-arrow) / 2) solid transparent; border-top: var(--height-arrow) solid var(--border-color-arrow); left: 50%; transform: translateX(-50%); } .leaflet-tooltip { --padding-start: var(--bazis-padding); --padding-end: var(--bazis-padding); --padding-top: var(--bazis-padding); --padding-bottom: var(--bazis-padding); --border-radius: var(--bazis-border-radius); --background: var(--bazis-text-color); --min-height: 40px; --min-width: 100px; --max-width: 312px; --color: var(--bazis-text-color-contrast); --font-size: 13px; --font-weight: 400; --line-height: 16px; --height-arrow: 4px; --width-arrow: 12px; } .leaflet-tooltip_telemetry { --padding-start: 12px; --padding-end: 12px; --padding-top: 4px; --padding-bottom: 4px; --border-radius: var(--bazis-border-radius) var(--bazis-border-radius) var(--bazis-border-radius) 0; --min-height: 24px; --width: max-content; } .leaflet-tooltip_telemetry::after { border-left: 0; border-right: var(--width-arrow) solid transparent; border-top: var(--height-arrow) solid var(--border-color-arrow); left: 0; transform: translateX(0); } .leaflet-tooltip_default { padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); background: var(--background); box-shadow: var(--box-shadow); border-radius: var(--border-radius); } .leaflet-oldie .leaflet-popup-content-wrapper { zoom: 1; } .leaflet-oldie .leaflet-popup-tip { width: 24px; margin: 0 auto; -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)"; filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678); } .leaflet-oldie .leaflet-popup-tip-container { margin-top: -1px; } .leaflet-oldie .leaflet-control-layers, .leaflet-oldie .leaflet-popup-content-wrapper, .leaflet-oldie .leaflet-popup-tip { border: 1px solid #999; } /* Layout Components of alphabet */ aside.bh-sticky { overflow-y: auto; max-height: calc(100vh - 150px); margin-right: -8px; padding-right: 8px; } @media (max-width: 1024px) { aside.sl-aside_right { margin-top: var(--bazis-margin-8x); } } .sl-footer { /* * @prop --padding-top: верхний внутренний отступ * @prop --padding-bottom: нижний внутренний отступ * @prop --background: фон подвала * @prop --color: цвет текста в подвале * @prop --color-link: цвет ссылок в подвале */ --color-link: var(--sl-footer-link-color); --padding-top: initial; --padding-bottom: initial; position: relative; padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); background: var(--background); color: var(--color); } .sl-footer a { color: var(--color-link); } .sl-footer { --padding-top: 64px; --padding-bottom: 40px; --background: var(--bazis-footer-background); --color: rgb(196, 199, 204); color: var(--color-link); } .sl-footer bazis-logo { --width: 40px; --height: 25px; } .sl-footer a { font-weight: 400; line-height: 20px; text-decoration: none; } .sl-footer hr { --border-color: rgba(196, 199, 204, 0.20); --margin-bottom: 36px; --margin-top: 38px; } .sl-footer__menu { --bazis-grid-columns: 15; --bazis-grid-padding: 0; margin-left: 102px; color: var(--color); } .sl-footer__menu .bazis-list { --margin-top-list: var(--bazis-margin-5x); --margin-bottom-list: 36px; --margin-bottom: var(--bazis-margin-3x); } .sl-footer__menu .bazis-list.sl-tech-menu { --margin-bottom: var(--bazis-margin-5x); } .sl-footer__menu .bazis-list bazis-icon { margin-right: var(--bazis-margin-4x); color: var(--color); } .sl-footer__menu .bazis-list img { display: block; } .sl-footer__development { display: flex; align-items: center; font-size: 11px; line-height: 12px; color: var(--color-link); } .sl-footer__development a { line-height: 0; } .sl-footer__development img { height: 32px; width: auto; } .sl-footer__development span { width: 160px; flex-shrink: 0; margin-right: 12px; opacity: 0.5; } .sl-footer__footer { display: flex; justify-content: space-between; align-items: center; } .sl-footer .bazis-list_short-info .bazis-item { --color: var(--color-link); --font-size: 13px; } @media (max-width: 992px) { .sl-footer .sl-footer__footer { flex-direction: column; align-items: flex-start; } .sl-footer .sl-footer__footer hr { width: 100%; } .sl-footer .sl-footer__development { flex-direction: row-reverse; } .sl-footer .sl-footer__development img { height: 20px; } .sl-footer .sl-footer__development span { margin-right: 0; margin-left: 12px; } } @media (max-width: 768px) { .sl-footer { --padding-top: 48px; } .sl-footer .sl-footer__menu { --bazis-grid-columns: 12; } } @media (max-width: 576.98px) { .sl-footer { padding-left: 20px; padding-right: 20px; } .sl-footer .sl-footer__menu { margin-left: 0; } .sl-footer .bazis-list_short-info { display: block; } .sl-footer .bazis-list_short-info > .bazis-item { --padding-start: 0; --margin-bottom: 12px; } .sl-footer .bazis-list_short-info > .bazis-item:last-child { --margin-bottom: 0; } .sl-footer .bazis-list_short-info > .bazis-item::after { display: none; } } .sl-header { /* * @prop --height: * @prop --padding-top: верхний внутренний отступ * @prop --padding-bottom: нижний внутренний отступ * @prop --background: фон шапки * @prop --color: цвет текста в шапке * @prop --color-link: цвет ссылок в шапке * @prop --color-link-hover: цвет ссылок в шапке при наведении * @prop --color-link-disabled: цвет отключенных ссылок в шапке */ --height: initial; --padding-top: initial; --padding-bottom: initial; --color-link: var(--bazis-text-color-contrast); --color-link-hover: var(--color-link); --color-link-disabled: var(--color-link); height: var(--height); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); background: var(--background); color: var(--color); } .sl-header-wrap { display: flex; justify-content: space-between; align-items: center; } .sl-header a { color: var(--color-link); } .sl-header a:hover, .sl-header a.active { color: var(--color-link-hover); } .sl-header a:disabled { color: var(--color-link-disabled); } .sl-header__logo { /* * @prop --margin-top: внешний верхний отступ лого * @prop --margin-end: внешний конечный отступ лого * @prop --margin-bottom: внешний нижний отступ лого * @prop --margin-start: внешний начальный отступ лого */ display: inline-block; flex-shrink: 0; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); } .sl-header__logo bazis-logo { --height: 20px; } .sl-header.bazis-container::before, .sl-header.bazis-message-plane::before, .sl-header.bazis-container::after, .sl-header.bazis-message-plane::after { display: none; } .sl-header { --height: 56px; --background: var(--bazis-header-background); --color: var(--bazis-text-color-contrast); --color-link: var(--color); } .sl-header a { line-height: 20px; text-decoration: none; } .sl-header a[nohref] { cursor: default; } .sl-header__logo { --margin-end: 56px; } .sl-header__menu.bazis-list_h > .bazis-item, .sl-header__user-menu.bazis-list_h > .bazis-item { --margin-end: calc(var(--bazis-padding) * 2); } .sl-header__menu .bazis-dropdown, .sl-header__user-menu .bazis-dropdown { display: flex; height: var(--height); align-items: center; } .sl-header__menu .bazis-dropdown__trigger, .sl-header__user-menu .bazis-dropdown__trigger { --padding-start: 0; --padding-end: 0; min-width: 24px; } .sl-header__menu.bazis-list, .sl-header .sl-search_global.bazis-list { --font-weight: 500; --font-size: 14px; } .sl-header__menu.bazis-list_h > .bazis-item, .sl-header .sl-search_global.bazis-list_h > .bazis-item { --margin-end: calc(var(--bazis-multiple-px) * 6); } .sl-header__menu.bazis-list .bazis-item .bazis-dropdown__body, .sl-header .sl-search_global.bazis-list .bazis-item .bazis-dropdown__body { --left: 0; --right: auto; } .sl-header__menu .bazis-dropdown__body, .sl-header .sl-search_global .bazis-dropdown__body { --padding-top: var(--bazis-padding); --padding-bottom: var(--bazis-padding); --padding-start: 0; --padding-end: 0; } .sl-header__menu .bazis-dropdown__body .bazis-item, .sl-header .sl-search_global .bazis-dropdown__body .bazis-item { --margin-bottom: 0; --padding-top: calc(var(--bazis-multiple-px) * 2); --padding-bottom: calc(var(--bazis-multiple-px) * 2); --padding-start: var(--bazis-padding); --padding-end: var(--bazis-padding); --background-hover: var(--bazis-background-dark); } .sl-header__user-menu > .bazis-item:last-child { --margin-end: 0; } .sl-header__left { display: flex; align-items: center; } .sl-header__profile bazis-chip { float: left; --margin-start: 0; --margin-end: 0; --margin-bottom: 0; --margin-top: 8px; --height: 20px; --border-radius: 12px; } .sl-header__profile .bazis-avatar, .sl-header__profile .sl-avatar_userpic { position: relative; } .sl-header__profile .bazis-avatar:not(.bazis-avatar_small), .sl-header__profile .sl-avatar_userpic:not(.bazis-avatar_small) { margin-right: 20px; } .sl-header__profile .bazis-avatar_small { font-size: var(--font-size); } .sl-header__profile .bazis-avatar bazis-icon, .sl-header__profile .sl-avatar_userpic bazis-icon { --bazis-icon-s-size: 12px; position: absolute; bottom: 0; right: -4px; margin-right: 0; background: var(--color); border-radius: 50%; color: var(--bazis-header-background); } .sl-header__profile .bazis-avatar:hover, .sl-header__profile .sl-avatar_userpic:hover { color: var(--color-hover); } .sl-header__profile .bazis-dropdown__trigger { padding-top: 12px; padding-bottom: 12px; } .sl-header__profile .bazis-menu, .sl-header__profile .bazis-menu_rounded { --margin-bottom: 0; --border-width: 1px 0 0 0; --border-style: solid; --border-color: var(--bazis-border-color); --padding-top-list: 20px; } .sl-header .bazis-dropdown__body { --bazis-margin: 18px; --color: var(--bazis-text-color); --color-link: var(--bazis-color-action); --color-link-hover: var(--color-link); --color-link-disabled: var(--color-link); } .sl-header .bazis-dropdown__body .bazis-list_underline a, .sl-header .bazis-dropdown__body .bazis-list_underline bazis-button { --color: var(--bazis-text-color); } .sl-header .sl-lang { --padding-top: 3px; --padding-bottom: 3px; --padding-start: calc(20px - 36px / 4); --border-width: 0 0 0 1px; --border-style: none none none solid; --border-color: transparent transparent transparent rgba(224, 222, 220, 0.5); } .sl-header .sl-lang .bazis-dropdown { --width: 112px; --top: 32px; height: 24px; line-height: 24px; } .sl-header .sl-lang .bazis-dropdown__body::before { position: absolute; content: ""; top: -16px; height: 16px; left: 0; right: 0; } .sl-header .sl-lang .bazis-dropdown__body .bazis-list_select, .sl-header .sl-lang .bazis-dropdown__body .bazis-list_control-dd { --padding-top-list: calc(var(--bazis-multiple-px) * 3); --padding-bottom-list: calc(var(--bazis-multiple-px) * 3); --border-radius-list: var(--bazis-border-radius); } .sl-header .sl-search_global { width: 160px; max-width: 980px; } .sl-header .sl-search_global .bazis-list_control-dd-wrapper { --padding-bottom: 0; } .sl-header .sl-search_global .bazis-control { --background-hover: var(--bazis-color-white); --background-focus: var(--bazis-color-white); --background-active: var(--bazis-color-white); --background: rgba(var(--bazis-color-white-rgb), 0.1); --border-width: 0; --color: rgba(var(--bazis-color-white-rgb), 0.7); --color-hover: rgba(var(--bazis-color-black-rgb), 0.7); } .sl-header .sl-search_global .bazis-control bazis-icon { --size-icon: 10px; } .sl-header .sl-search_global .bazis-control__field-group__start, .sl-header .sl-search_global .bazis-control__field-group__end, .sl-header .sl-search_global .bazis-control__field { background: transparent; } .sl-header .sl-search_global .bazis-control__field-group__start { min-width: 41px; } .sl-header .sl-search_global .bazis-control { --height: 36px; } .sl-header_search-active .sl-header__menu { display: none; } .sl-header_search-active .sl-header__user-menu { flex-shrink: 0; width: calc(100% - 280px); } .sl-header_search-active .sl-header__user-menu > .bazis-item:first-child { width: 100%; } .sl-header_search-active .sl-header__user-menu > .bazis-item:first-child .sl-search_global { width: 100%; } .sl-header_search-active .sl-header__user-menu > .bazis-item:first-child .sl-search_global .bazis-control { --background: var(--background-hover); --border-color: var(--border-color-focus); } .sl-header_home { position: absolute; left: 0; right: 0; z-index: 160; } app-header-mobile .sl-header { position: relative; } .sl-header .sl-menu-burger { --background: var(--bazis-header-background); --border-radius: 50%; position: fixed; z-index: 1001; right: 16px; top: 8px; } .sl-header-dropdown { position: fixed; z-index: 1001; overflow-x: hidden; overflow-y: auto; right: 16px; top: 56px; bottom: 12px; width: 344px; background: var(--bazis-color-white); border-radius: var(--bazis-border-radius); box-shadow: 0px 4px 24px -10px rgba(0, 0, 0, 0.1), inset 0px 0px 0px 1px rgba(0, 0, 0, 0.05); padding: 32px 20px 20px; } .sl-header-dropdown .bazis-avatar, .sl-header-dropdown .sl-avatar_userpic { margin-right: 20px; } .sl-header-dropdown .bazis-avatar + div bazis-chip, .sl-header-dropdown .sl-avatar_userpic + div bazis-chip { --margin-start: 0; } .sl-header-dropdown .bazis-menu, .sl-header-dropdown .bazis-menu_rounded { --color: var(--bazis-text-color); --color-link: var(--color); --background-hover: transparent; --margin-bottom: 24px; } app-header-mobile .sl-header-dropdown .bazis-list_overline { --margin-top-list: 20px; --padding-start: 0; --padding-top: 16px; --padding-bottom: 16px; --margin-bottom: 0; --font-size: 14px; --border-width: 1px 0 0 0; --border-style: solid; --border-color: var(--bazis-border-color); } app-header-mobile .sl-header-dropdown .bazis-list_overline bazis-button:not(.bazis-item) { --padding-start: 0; --padding-top: 16px; --padding-bottom: 16px; } .sl-header-dropdown .bazis-item a { font-weight: 500; font-size: 20px; line-height: 22px; } .sl-header-dropdown .bazis-item a + .bazis-item__child { margin-top: 12px; } .sl-header-dropdown .bazis-item__child a { --padding-top: 8px; --padding-bottom: 8px; --padding-start: 20px; font-weight: 400; font-size: 16px; } @media (max-width: 1024px) { .sl-header { padding-right: 40px; } .sl-header .sl-header__logo img { display: block; } .sl-header .sl-header-wrap { height: 100%; } .sl-header.sl-header--fixed { position: fixed; top: 0; right: 0; left: 0; z-index: 1001; } } @media (max-width: 768px), (max-device-width: 576px) { .sl-header .sl-header-dropdown { right: 0; left: 0; bottom: auto; width: 100%; max-height: 100%; overflow: auto; border-radius: 0; } } @media only screen and (max-height: 575.98px) and (orientation: landscape) { .sl-header .sl-header-dropdown { bottom: 0; } } @media (max-width: 576px) { .sl-header .sl-header__logo img { height: 36px; } } .sl-layout_flex { --margin-side: 44px; display: flex; align-items: flex-start; width: 100%; } .sl-layout_flex aside { flex-shrink: 0; } .sl-layout_flex aside.sl-aside_left { width: 280px; margin-right: var(--margin-side); } .sl-layout_flex aside.sl-aside_right { margin-left: var(--margin-side); } .sl-layout_flex main { width: 100%; } .sl-section { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); } .sl-section__content { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); } .sl-section { --margin-top: 32px; } .sl-section__subtitle { margin-bottom: 12px; text-transform: uppercase; font-size: 12px; line-height: 20px; letter-spacing: 1px; color: var(--bazis-text-color-secondary); } .sl-header-section.bazis-block { --margin-top: 20px; --margin-bottom: 48px; --padding-top: 32px; --padding-bottom: 32px; --padding-start: 0; --padding-end: 0; } .sl-header-section.bazis-block .bazis-block__content { display: flex; } .sl-header-section.bazis-block .bazis-block__content_main { --padding-start: 32px; --padding-end: 32px; } .sl-header-section.bazis-block .bazis-block__content_main h5 { margin: 0 0 16px; } .sl-header-section.bazis-block .bazis-block__content_end { --width: 340px; --padding-start: 32px; --padding-end: 32px; --margin-start: 0; } /* Bazis determination and extends */ .bazis-accordion_underline::part(body) { line-height: 20px; } .bazis-accordion_clear::part(body) { line-height: 20px; } .sl-accordion_form-child { --margin-top: 40px; --margin-bottom: 40px; } .sl-accordion_form-child::part(header) { --padding-top: 0; --padding-bottom: 12px; --border-width: 0 0 1px; } .sl-accordion_form-child::part(body) { --padding-bottom: 0; } .sl-accordion_form-child.bazis-accordion--opened::part(header) { --margin-bottom: 0; --border-width: 0; } .sl-accordion_profile { --open-close-color: var(--bazis-color-action); } .sl-accordion_profile::part(header) { --background: transparent; --border-width: 0; --padding-bottom: 0; --padding-top: calc(var(--bazis-multiple-px) * 2); --padding-start: calc(var(--bazis-multiple-px) * 2); --padding-end: 0; font-size: 18px; line-height: 24px; } .sl-accordion_profile::part(header) bazis-toolbar bazis-button bazis-icon { font-size: 24px; } .sl-accordion_profile::part(body) { --padding-top: calc(var(--bazis-padding) * 2); --padding-start: 56px; } .sl-accordion_profile::part(body) .sl-form + bazis-toolbar { --padding-top: 32px; } .sl-accordion_profile bazis-icon[slot=icon] { --icon-l-size: 24px; margin-right: calc(var(--bazis-margin) * 2); } .sl-accordion_profile section hr { --margin-top: 0; } .bazis-alert { --top: 0; --bottom: 0; --left: 0; --right: 0; --max-width: 100%; --width: 976px; --padding-start: calc(var(--bazis-padding) * 3); --padding-end: calc(var(--bazis-padding) * 3); --padding-top: calc(var(--bazis-padding) * 3); --padding-bottom: calc(var(--bazis-padding) * 3); --background: var(--bazis-background); --border-radius: var(--bazis-border-radius); --box-shadow: 0px 10px 20px -10px rgba(144, 150, 162, 0.2); --max-height: calc(100vh - var(--bazis-padding) * 3); } .bazis-alert__message { color: var(--bazis-text-color); } .bazis-alert__close { width: 36px; height: 36px; margin-top: -16px; } .bazis-alert .sl-form .bazis-map-wrapper, .bazis-alert .sl-form .sl-map-wrapper_dd { --height: 180px; } .bazis-alert_small { --max-width: 664px; } .bazis-alert_small .bazis-alert__mesage { color: var(--bazis-text-color); } #cadesplugin_ovr .bazis-alert { --width: 450px; } #cadesplugin_ovr .bazis-alert .bazis-alert__wrapper { position: relative; } #cadesplugin_ovr .bazis-alert .bazis-alert__wrapper .bazis-alert__close { position: absolute; right: 16px; top: 16px; } .bazis-alert_medium { --width: 664px; } .bazis-alert_medium2 { --width: 752px; } .bazis-avatar, .sl-avatar_userpic { --width: 64px; --height: 64px; --background: #66B8F6; --border-radius: 50%; --color: var(--bazis-color-white); --font-size: 16px; --font-weight: 500; line-height: 16px; letter-spacing: 0.25px; } .bazis-avatar_small { --font-size: 13px; --font-weight: 500; } .sl-avatar_userpic { --width: 64px; --height: 64px; --background: var(--bazis-background); --color: var(--bazis-text-color-secondary); float: left; margin-right: 0; border: 1px solid var(--bazis-border-color); } .bazis-backdrop { --background: var(--bazis-text-color); --opacity: 0.6; } bazis-badge { --background: #66B8F6; --height: 12px; --height-xxs: 6px; --height-xs: 8px; --height-medium: 16px; --height-large: 24px; --padding-start: 2px; --padding-end: 2px; --margin-start: 4px; --margin-end: 4px; --font-size: 9px; --font-size-medium: 12px; --font-size-large: 16px; --font-weight: 500; --color: var(--bazis-color-white); } .bazis-block { --padding-top: 24px; --padding-start: 24px; --padding-end: 24px; --padding-bottom: 24px; --background: var(--bazis-background); --border-radius: var(--bazis-border-radius); --margin-bottom: 20px; } .bazis-block__header { --margin-bottom: 16px; } .bazis-block__header:last-child { --margin-bottom: 0; } .bazis-block_accent .bazis-block__header { --margin-bottom: calc(var(--bazis-multiple-px) * 6); --padding-bottom: calc(var(--bazis-multiple-px) * 6); --border-width: 0 0 1px 0; --border-style: solid; --border-color: var(--bazis-border-color-dark); } .bazis-block__content_start { flex-shrink: 0; } .bazis-block__content_main { --width: 100%; } .bazis-block__content_main__left { flex-shrink: 0; width: 200px; margin-right: 40px; } .bazis-block__content_main__left bazis-dateplate + bazis-dateplate { display: block; margin-top: 12px; } .bazis-block__content_main__center { width: 100%; } .bazis-block__content_main .bazis-block__footer { --padding-top: 12px; --margin-start: 0; --margin-end: 0; --padding-start: 0; --padding-end: 0; } .bazis-block__content_end { --padding-start: calc(var(--bazis-multiple-px) * 10); --border-width: 0 0 0 1px; --border-style: solid; --border-color: var(--bazis-border-color); --width: 337px; --margin-start: calc(var(--bazis-margin) * 2); flex-shrink: 0; } .bazis-block__footer { --margin-top: 32px; --margin-start: -24px; --margin-end: -24px; --border-width: 1px 0 0 0; --border-style: solid; --border-color: var(--bazis-border-color); --padding-top: 20px; --padding-start: 24px; --padding-end: 24px; } .bazis-block_accent .bazis-block__footer { --margin-top: 16px; --margin-start: -20px; --margin-end: -32px; --padding-start: 20px; --padding-end: 32px; } .bazis-block_accent .bazis-block__footer > .bh-flex, .bazis-block_accent .bazis-block__footer > .bh-flex-column, .bazis-block_accent .bazis-block__footer > .bh-flex-row-revers, .bazis-block_accent .bazis-block__footer > .bh-flex-column-reverse { margin-left: 70px; } .bazis-block_accent .bazis-block__footer .bazis-h6 { margin-bottom: var(--bazis-multiple-px); line-height: 16px; } aside .bazis-block__footer { --margin-top: 0; --margin-start: -16px; --margin-end: -16px; --padding-top: 20px; --padding-start: 16px; --padding-end: 16px; } .bazis-block_outline, .sl-block_faq { --padding-top: 32px; --padding-start: 32px; --padding-end: 32px; --padding-bottom: 32px; } @media (max-width: 1024px) { .bazis-block_outline, .sl-block_faq { --padding-top: 24px; --padding-start: 20px; --padding-end: 20px; --padding-bottom: 24px; } } .bazis-block_editable { --padding-top: 8px; --padding-start: 16px; --padding-end: 16px; --padding-bottom: 8px; --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color-dark); --border-color-hover: var(--bazis-text-secondary); --margin-bottom: calc(var(--bazis-multiple-px) * 2); } .bazis-block_editable .bazis-list_short-info { --color: var(--bazis-color-action); } .bazis-block_accent { --padding-top: 32px; --padding-start: 32px; --padding-end: 32px; --padding-bottom: 32px; --margin-bottom: 24px; --background: var(--bazis-background-accent); } .bazis-block .bazis-block_accent { --margin-top: 20px; --margin-bottom: 0; --padding-top: 8px; --padding-start: 12px; --padding-end: 12px; --padding-bottom: 8px; } .bazis-block .bazis-block_accent .sl-table_clear td { --padding-top: 2px; --padding-bottom: 2px; } .bazis-block_accent.sl-block_large { --margin-bottom: 40px; } .bazis-block_accent bazis-skeleton { --background: var(--bazis-border-color-dark); } @media (max-width: 1024px) { .bazis-block_accent { --padding-top: 24px; --padding-bottom: 24px; --padding-start: 20px; --padding-end: 20px; } } @media (max-width: 576px) { .bazis-block_accent .bazis-block__footer > .bh-flex, .bazis-block_accent .bazis-block__footer > .bh-flex-column, .bazis-block_accent .bazis-block__footer > .bh-flex-row-revers, .bazis-block_accent .bazis-block__footer > .bh-flex-column-reverse { display: block; margin-left: 0; } .bazis-block_accent .bazis-block__footer > .bh-flex .sl-text-size_mini, .bazis-block_accent .bazis-block__footer > .bh-flex-column .sl-text-size_mini, .bazis-block_accent .bazis-block__footer > .bh-flex-row-revers .sl-text-size_mini, .bazis-block_accent .bazis-block__footer > .bh-flex-column-reverse .sl-text-size_mini { font-size: 14px; line-height: 20px; } .bazis-block_accent .bazis-block__footer > .bh-flex > *:not(.bh-no-margin), .bazis-block_accent .bazis-block__footer > .bh-flex-column > *:not(.bh-no-margin), .bazis-block_accent .bazis-block__footer > .bh-flex-row-revers > *:not(.bh-no-margin), .bazis-block_accent .bazis-block__footer > .bh-flex-column-reverse > *:not(.bh-no-margin) { margin-bottom: 20px; } } .bazis-block_warning { --margin-bottom: 0; --padding-top: 16px; --padding-start: 16px; --padding-end: 16px; --padding-bottom: 16px; --background: var(--bazis-background-info-secondary); } .bazis-block_warning > bazis-icon { float: left; margin-right: calc(var(--bazis-multiple-px) * 3); } .bazis-block_warning .bazis-block__content { overflow: hidden; line-height: 20px; } .bazis-block_warning .bazis-block__content .bazis-list_short-info { --margin-top-list: 3px; } @media (max-width: 576px) { .bazis-block_warning .bazis-block__content .bazis-list_short-info { flex-wrap: wrap; } } .bazis-block_secondary { --background: var(--bazis-background-medium); } .bazis-modal .bazis-block_secondary { --padding-top: 20px; --padding-bottom: 20px; --padding-start: 16px; --padding-end: 16px; } aside .bazis-block { --padding-top: 20px; --padding-start: 16px; --padding-end: 16px; --padding-bottom: 20px; } aside .bazis-block.sl-block_small { --padding-start: 16px; --padding-end: 16px; } aside .bazis-block.sl-block_large { --padding-top: 24px; --padding-start: 20px; --padding-end: 20px; --padding-bottom: 24px; } aside .bazis-block .bazis-block_secondary { --margin-top: 12px; --margin-bottom: 0; --padding-top: 16px; --padding-start: 16px; --padding-end: 16px; --padding-bottom: 16px; } aside .bazis-block hr { --margin-top: var(--bazis-margin-4x); --margin-bottom: var(--bazis-margin-4x); } aside .bazis-block__header { --margin-bottom: 12px; } aside .bazis-block__header h6 a { text-decoration: none; position: relative; } aside .bazis-block__header h6 a::after { content: ""; position: absolute; left: 2px; right: 2px; bottom: -2px; border-bottom: 1px dashed var(--bazis-link-color); } aside .bazis-block.bazis-block_outline bazis-toolbar:first-child, aside .bazis-block.sl-block_faq bazis-toolbar:first-child { margin-top: -10px; } aside.sl-aside_left .bazis-block { --padding-top: 16px; --padding-start: 20px; --padding-end: 20px; --padding-bottom: 16px; } @media (max-width: 992px) { aside.sl-aside_left .bazis-block, aside.sl-aside_left .bazis-block_outline, aside.sl-aside_left .sl-block_faq { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-width: 0; } aside.sl-aside_left .bazis-block bazis-button, aside.sl-aside_left .bazis-block_outline bazis-button, aside.sl-aside_left .sl-block_faq bazis-button { display: inline-block; } } @media (max-width: 576px) { aside.sl-aside_left .bazis-block bazis-button, aside.sl-aside_left .bazis-block_outline bazis-button, aside.sl-aside_left .sl-block_faq bazis-button { display: block; } } @media (max-width: 576px) { .bazis-block { --margin-bottom: 16px; } } a.bazis-block { display: block; text-decoration: none; } .sl-block_mini { --padding-top: 8px; --padding-bottom: 8px; --padding-start: 16px; --padding-end: 16px; } .bazis-list_history .sl-block_mini, .sl-list_trip .sl-block_mini { --margin-bottom: 0; --margin-top: var(--bazis-margin-3x); display: inline-flex; } .sl-block_search { --max-width: 612px; --padding-top: 20px; --padding-start: 20px; --padding-end: 20px; --padding-bottom: 20px; --margin-bottom: 0; position: absolute; z-index: 150; bottom: 0; left: 0; } .sl-block_search.bazis-block_shadow { --box-shadow: 0px 4px 24px -10px rgba(0, 0, 0, 0.1); } .sl-block_search .bazis-block__footer { --margin-bottom: -20px; --margin-start: -20px; --margin-end: -20px; --padding-top: var(--bazis-padding); --padding-bottom: var(--bazis-padding); --padding-start: calc(var(--bazis-multiple-px) * 4); --padding-end: calc(var(--bazis-multiple-px) * 4); } .bazis-empty .sl-block_search { text-align: left; } .sl-flex { display: flex; gap: var(--gap); align-items: var(--align); } .bazis-breadcrumbs { --padding-top: 16px; --padding-bottom: 16px; --margin-bottom: 16px; --text-decoration: none; --color: var(--bazis-text-color-secondary); } .bazis-breadcrumbs .bazis-list { --font-size: 12px; --line-height: 16px; } .bazis-breadcrumbs .bazis-list > .bazis-item { --margin-end: 8px; } .bazis-breadcrumbs bazis-icon { --bazis-icon-s-size: 12px; margin-right: var(--margin-end); } bazis-button { --height: 36px; --height-xs: 24px; --height-small: 32px; --height-large: 44px; --border-radius: var(--bazis-border-radius); --padding-top: 10px; --padding-bottom: 10px; --padding-start: 16px; --padding-end: 16px; --transition: background-color 15ms linear, outline-color 15ms linear; --outline-width: 4px; --outline-style: solid; --outline-color: transparent; font-size: 13px; font-weight: 500; letter-spacing: 0.25px; } bazis-button::part(inner) { line-height: 2; } bazis-button bazis-icon.bazis-icon-xl[slot=icon-only] { --bazis-icon-xl-size: 24px; margin-left: -10px; margin-right: -10px; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { bazis-button bazis-icon.bazis-icon-xl[slot=icon-only] { margin-left: unset; margin-right: unset; margin-inline-start: -10px; margin-inline-end: -10px; } } bazis-button bazis-icon[slot=start] { margin-right: 4px; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { bazis-button bazis-icon[slot=start] { margin-right: unset; margin-inline-end: 4px; } } .bazis-btn_solid { --background: var(--bazis-border-color); --color: var(--bazis-text-color); --background-hover: var(--bazis-color-info-shade); --background-activated: var(--bazis-color-info-tint); --background-focused: var(--background); --background-disabled: var(--bazis-text-color-secondary); --color-disabled: var(--bazis-text-color-contrast); } .bazis-btn_outline { --background: var(--bazis-color-white); --background-hover: var(--bazis-background-medium); --background-activated: var(--bazis-color-info-tint); --background-disabled: var(--bazis-background-dark); --border-color: var(--bazis-border-color-dark); --border-color-hover: var(--bazis-text-color-secondary); --border-color-activated: var(--bazis-border-color-dark); --border-color-focused: transparent; --border-color-disabled: var(--bazis-background-dark); --color: var(--bazis-color-action-dark); --color-disabled: var(--bazis-text-color-secondary); } .bazis-btn_outline bazis-icon[slot=icon-only] { margin-left: -7px; margin-right: -7px; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bazis-btn_outline bazis-icon[slot=icon-only] { margin-left: unset; margin-right: unset; margin-inline-start: -7px; margin-inline-end: -7px; } } .bazis-btn_clear { --background-hover: var(--bazis-background-medium); --background-activated: var(--bazis-color-info-tint); --background-focused: var(--bazis-background-medium); --color: var(--bazis-text-color-secondary); --color-hover: var(--color); --color-focused: var(--color); --color-activated: var(--color); } .bazis-btn_large { --padding-top: 12px; --padding-bottom: 12px; --padding-start: 20px; --padding-end: 20px; font-size: 14px; letter-spacing: 0.5px; } .bazis-btn_small { --padding-top: 8px; --padding-bottom: 8px; --padding-start: 16px; --padding-end: 16px; } .bazis-btn_small bazis-icon[slot=icon-only] { margin-left: -4px; margin-right: -4px; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bazis-btn_small bazis-icon[slot=icon-only] { margin-left: unset; margin-right: unset; margin-inline-start: -4px; margin-inline-end: -4px; } } .bazis-btn_xs { --padding-top: 6px; --padding-bottom: 6px; --padding-start: 6px; --padding-end: 6px; --height: 24px; } .bazis-btn_xs bazis-icon[slot=icon-only] { margin-left: 0; margin-right: 0; font-size: 12px; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bazis-btn_xs bazis-icon[slot=icon-only] { margin-left: unset; margin-right: unset; margin-inline-start: 0; margin-inline-end: 0; } } .bazis-btn_xs.bazis-btn_outline bazis-icon[slot=icon-only] { margin-left: -1px; margin-right: -1px; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bazis-btn_xs.bazis-btn_outline bazis-icon[slot=icon-only] { margin-left: unset; margin-right: unset; margin-inline-start: -1px; margin-inline-end: -1px; } } bazis-button.sl-button_nowrap { width: 100%; } aside .sl-dropdown_action + bazis-button.sl-button_nowrap { width: calc(100% - 52px); } .bazis-btn-group { --border-radius: var(--bazis-border-radius); } .bazis-btn-group:not(.bazis-btn-group_h) { overflow-x: auto; } .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_solid { --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color); --background: var(--bazis-background-medium); --color: var(--bazis-text-color); --background-activated: var(--bazis-color-action); --color-activated: var(--bazis-text-color-contrast); --background-hover: var(--bazis-color-action-shade); --color-hover: var(--bazis-text-color-contrast); --background-focused: var(--background-hover); --color-focused: var(--color-hover); font-weight: 500; font-size: 14px; line-height: 20px; } .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_solid bazis-icon { color: var(--bazis-text-color-secondary); } .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_solid.bazis-btn--active::part(native) { border-color: var(--background-activated); } .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_solid:hover::part(native), .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_solid:focus-visible::part(native) { border-color: var(--background-hover); } .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_solid.bazis-btn--active bazis-icon, .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_solid:hover bazis-icon { color: var(--bazis-text-color-contrast); } .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_solid::part(native):active bazis-icon, .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_solid:focus-visible::part(native) bazis-icon { color: var(--bazis-text-color-contrast); } .bazis-btn-group--disabled .bazis-btn-group__item > bazis-button.bazis-btn_solid::part(native), .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_solid.bazis-btn--disabled::part(native) { --background-disabled: var(--bazis-background-dark); --color-disabled: var(--bazis-text-color-secondary); } .bazis-btn-group--disabled .bazis-btn-group__item > bazis-button.bazis-btn_solid.bazis-btn--active::part(native), .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_solid.bazis-btn--disabled.bazis-btn--active::part(native) { --background-disabled: var(--bazis-text-color-secondary); --color-disabled: var(--bazis-text-color-contrast); background: var(--background-disabled); border-color: var(--background-disabled); color: var(--color-disabled); } .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_clear { --background: var(--bazis-color-info-tint); --color: var(--bazis-placeholder-color); --color-activated: var(--bazis-color-action); --background-hover: var(--background); --color-hover: var(--bazis-color-action); --background-focused: var(--background); --color-focused: var(--color); font-weight: 500; font-size: 14px; line-height: 20px; } .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_clear bazis-icon { color: currentColor; } .bazis-btn-group .bazis-btn-group__item > bazis-button.bazis-btn_clear::part(native)::after { border-right: 1px solid var(--bazis-border-color); } .bazis-btn-group + .bazis-control__note { margin-top: calc(var(--bazis-multiple-px) * 3); } .bazis-btn-group_h .bazis-btn-group__item > bazis-button.bazis-btn_outline.bazis-btn--active { --background-activated: var(--background); --color-activated: var(--bazis-color-primary); --color-hover: var(--color-activated); background: var(--background-activated); border-color: var(--background-activated); color: var(--color-activated); } @media (max-width: 576px) { app-input-options-button .bazis-btn-group bazis-button { --padding-start: var(--bazis-margin-2x); --padding-end: var(--bazis-margin-2x); } } .bazis-card { --padding-top: 12px; --padding-start: 12px; --padding-end: 12px; --padding-bottom: 36px; --background: var(--bazis-background); --border-radius: var(--bazis-border-radius); --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color); --border-color-hover: var(--bazis-color-primary); --width: 316px; height: 100%; position: relative; line-height: 20px; } .bazis-card .bazis-map-wrapper, .bazis-card .sl-map-wrapper_dd { --height: 132px; --margin-bottom: var(--bazis-margin); position: relative; } .bazis-card .bazis-map-wrapper, .bazis-card .sl-map-wrapper_dd, .bazis-card .bazis-map-wrapper .leaflet-container, .bazis-card .sl-map-wrapper_dd .leaflet-container { border-radius: var(--bazis-border-radius); } .bazis-card .bazis-map-wrapper .bazis-dropdown, .bazis-card .sl-map-wrapper_dd .bazis-dropdown { position: absolute; z-index: 150; top: 4px; right: 4px; } .bazis-card .bazis-map-wrapper .bazis-dropdown__trigger, .bazis-card .sl-map-wrapper_dd .bazis-dropdown__trigger { --height: 28px; --background: var(--bazis-color-white); --padding-start: 12px; --padding-end: 12px; --color: var(--bazis-placeholder-color); width: 28px; } .bazis-card .bazis-status { --margin-bottom: 8px; --margin-top: 8px; } a.bazis-card { display: block; text-decoration: none; } .sl-card__date { position: absolute; bottom: 8px; left: var(--padding-start); right: var(--padding-end); color: var(--bazis-text-color-secondary); } .sl-card_trip { --padding-top: 0; --padding-start: 0; --padding-end: 0; --padding-bottom: 0; --border-radius: 0; --width: auto; --border-color: transparent; --border-color-hover: var(--bazis-background-dark); --margin-bottom: calc(var(--bazis-multiple-px) * 4); height: auto; cursor: pointer; } .sl-card_trip .bazis-card__header { height: 36px; padding: 0 var(--bazis-padding); background: var(--bazis-background-medium); line-height: 36px; } .sl-card_trip .bazis-card__body { padding: var(--bazis-padding); } .sl-card_trip--selected { --border-color: var(--bazis-color-action); --border-color-hover: var(--border-color); } .sl-card_trip-wrapper { height: 500px; overflow: auto; padding-right: calc(var(--bazis-multiple-px) * 2); } bazis-card-value { --background: transparent; --background-hover: var(--bazis-background-medium); --background-active: var(--bazis-color-primary); --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color); --border-color-active: var(--bazis-color-primary); --padding-start: 16px; --padding-end: 16px; --padding-top: 16px; --padding-bottom: 16px; --font-size-title: 13px; --font-weight-title: 400; --line-height-title: 20px; --color-active-title: var(--bazis-color-primary-contrast); --font-size-value: 18px; --font-weight-value: 700; --line-height-value: 24px; --color-active-value: var(--bazis-color-primary-contrast); height: 100%; } .bazis-card-value__value { margin-bottom: 8px; } .bazis-card-value__title { opacity: 0.6; } bazis-chip { --border-radius: 16px; --background: rgba(var(--bazis-text-color-secondary-rgb, 0, 0, 0), 0.2); --color: var(--bazis-text-color-secondary); --height: 24px; --padding-top: calc((var(--height) - var(--line-height)) / 2 ); --padding-bottom: calc((var(--height) - var(--line-height)) / 2 ); --margin-start: 8px; --margin-end: 8px; --margin-start-slotted: 8px; --margin-end-slotted: 8px; --font-size: 12px; --font-weight: 500; } .bazis-chip_small { --border-radius: 12px; --height: 20px; } .sl-status-save { --margin-start: 0; --margin-end: 0; --margin-bottom: 0; --font-size: 13px; --font-weight: 400; --color: var(--bazis-text-color); } .sl-status-save bazis-icon { margin-right: 8px; } bazis-chip.bazis-status { --margin-end: 0; --margin-start: 0; --margin-bottom: 0; --margin-top: 0; display: block; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } bazis-chip.bazis-status:not(.bazis-chip_small) { --font-size: 10px; text-transform: uppercase; letter-spacing: 1px; } bazis-chip.bazis-status:not(.bazis-chip_small)::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--color); margin-right: var(--margin-start-slotted); } bazis-chip.bazis-status:not(.bazis-chip_small) span { line-height: var(--height); } @media only screen and (-webkit-min-device-pixel-ratio: 2) { bazis-chip.bazis-status:not(.bazis-chip_small) span { line-height: calc(var(--height) + 2px); } } bazis-chip.bazis-status.bazis-color::before { display: inline-block; background: var(--bazis-color-base); } bazis-chip.bazis-status.bazis-chip_nodecor::before { display: none; } bazis-chip.bazis-status.bazis-color.bazis-color-info { --color: var(--bazis-text-color-secondary); --background: rgba(var(--bazis-text-color-secondary-rgb, 0, 0, 0), 0.2); color: var(--color); } bazis-chip.bazis-status.bazis-color.bazis-color-info:not(.bazis-chip_clear) { background: var(--background); } bazis-chip.bazis-status.bazis-color.bazis-color-info::before { background: var(--color); } .bazis-contact { --font-size: 13px; --line-height: 20px; } .bazis-contact__name { margin: 0 0 4px; font-size: 14px; line-height: 20px; font-weight: 500; } .bazis-contact__position { margin: 0 0 12px; } .bazis-contact__mail { margin: 0 0 4px; } .bazis-contact__phone { margin: 0; } .bazis-contact + .bazis-contact { --margin-top: var(--bazis-margin-4x); } .bazis-contact + hr { --margin-top: var(--bazis-margin-5x); --margin-bottom: var(--bazis-margin-5x); } dl .bazis-coordinates, .bazis-list > .bazis-item .bazis-coordinates, bazis-grid.sl-grid_table .bazis-coordinates, table .bazis-coordinates { margin-bottom: 0; } dl .bazis-coordinates { margin-top: var(--bazis-margin-1x); } .bazis-counter_line .bazis-counter__item { --border-radius: 1px; --height: 12px; --width: 2px; margin: 0 1px; } .bazis-counter_line .bazis-counter__total { --font-size: 12px; --line-height: 12px; --margin-end: 8px; } bazis-datepicker { --widthOne: 360px; --background: var(--bazis-color-white); --background-hover: var(--bazis-background-accent); --background-selected: var(--bazis-color-action); --background-current: var(--bazis-color-primary); --background-muted: var(--bazis-background-medium); --box-shadow: 0px 4px 24px -10px rgba(0, 0, 0, 0.1); --datepicker-arrow-color: var(--bazis-color-action); --padding-start: 16px; --padding-end: 16px; --padding-top: 16px; --padding-bottom: 16px; --font-weight: 500; --font-size: 12px; --color: var(--bazis-text-color); --color-selected: var(--bazis-text-color-contrast); --color-current: var(--bazis-text-color-contrast); --width-day: 32px; --height-day: 32px; --border-radius-day: 2px; --opacity-day: 0.8; --font-weight-day: 500; --font-size-weekday: 12px; --color-weekday: var(--bazis-text-color-secondary); --font-size-head: 12; --font-weight-head: var(--font-weight-day); --color-head: var(--bazis-color-action); } bazis-datepicker::part(button) { display: block; --height: 24px; --padding-top: 0; --padding-bottom: 0; --background-hover: var(--bazis-background-medium); --background-activated: var(--bazis-color-info-tint); --background-focused: var(--bazis-background-medium); --color: var(--bazis-text-color-secondary); --color-hover: var(--bazis-color-action); --color-focused: var(--bazis-color-action); } bazis-datepicker::part(value) { letter-spacing: 0.5px; text-transform: uppercase; } bazis-datepicker::part(interval-head-button) { --height: 48px; --border-color: var(--bazis-color-action); --color: var(--bazis-color-action); top: 50%; margin-top: calc(var(--height) / -2); width: 48px; } bazis-datepicker::part(interval-head-button):first-child { left: calc(-20px - var(--height) / 2); } bazis-datepicker::part(interval-head-button):last-child { right: calc(-20px - var(--height) / 2); } bazis-datepicker::part(head-button) { --padding-start: 6px; --padding-end: 6px; } bazis-datepicker::part(list) { overflow: auto; max-height: 264px; } bazis-datepicker::part(list-item) { padding: 2px 12px; font-weight: 400; font-size: var(--font-size); line-height: 20px; text-transform: lowercase; } bazis-datepicker::part(calendar-head) { margin-bottom: var(--bazis-margin-4x); padding: 0; } .bazis-block__content_main__left .bazis-dateplate .bazis-text_action, .bazis-block__content_main__left .bazis-dateplate .sl-text_inner a, .sl-text_inner .bazis-block__content_main__left .bazis-dateplate a { letter-spacing: 0; color: var(--bazis-text-color); } h5 .bazis-dateplate, h6 .bazis-dateplate { display: inline-block; padding-left: calc(var(--bazis-multiple-px) * 3); font-weight: 400; vertical-align: middle; } h5 .bazis-dateplate bazis-icon, h6 .bazis-dateplate bazis-icon { margin-top: -2px; } .bazis-dateplate__time bazis-icon { --bazis-icon-xs-size: 16px; } dl.bazis-dl_inline, dl.bazis-dl_dot-leaders, dl.bazis-dl_dot-leaders_nowrap { --width-dt: 216px; --width-dd: calc(100% - var(--width-dt)); --padding-end-dt: var(--bazis-padding-4x); --margin-bottom-dt: var(--bazis-margin-4x); --margin-bottom-dd: var(--bazis-margin-4x); --color-dt: var(--bazis-text-color-secondary); line-height: 20px; font-size: 13px; } .bazis-modal dl.bazis-dl_inline, .bazis-modal dl.bazis-dl_dot-leaders, .bazis-modal dl.bazis-dl_dot-leaders_nowrap { --margin-bottom-dt: var(--bazis-margin-4x); --margin-bottom-dd: var(--bazis-margin-4x); } dl.bazis-dl_inline dd .bazis-list_between > .bazis-item, dl.bazis-dl_dot-leaders dd .bazis-list_between > .bazis-item, dl.bazis-dl_dot-leaders_nowrap dd .bazis-list_between > .bazis-item, dl.bazis-dl_inline dd .bazis-list_between_dot-leaders > .bazis-item, dl.bazis-dl_dot-leaders dd .bazis-list_between_dot-leaders > .bazis-item, dl.bazis-dl_dot-leaders_nowrap dd .bazis-list_between_dot-leaders > .bazis-item { --margin-bottom-dd: 0; } .sl-section dl.bazis-dl_inline:last-child dt:last-of-type, .sl-section dl.bazis-dl_dot-leaders:last-child dt:last-of-type, .sl-section dl.bazis-dl_dot-leaders_nowrap:last-child dt:last-of-type, .sl-section dl.bazis-dl_inline:last-child dd:last-of-type, .sl-section dl.bazis-dl_dot-leaders:last-child dd:last-of-type, .sl-section dl.bazis-dl_dot-leaders_nowrap:last-child dd:last-of-type { --margin-bottom-dt: 0; --margin-bottom-dd: 0; } dl.bazis-dl_inline dt:last-of-type, dl.bazis-dl_dot-leaders dt:last-of-type, dl.bazis-dl_dot-leaders_nowrap dt:last-of-type, dl.bazis-dl_inline dd:last-of-type, dl.bazis-dl_dot-leaders dd:last-of-type, dl.bazis-dl_dot-leaders_nowrap dd:last-of-type { margin: 0; } dl.bazis-dl_inline--lg { --margin-bottom-dt: var(--bazis-margin-4x); --margin-bottom-dd: var(--bazis-margin-4x); } dl.bazis-dl_dot-leaders, dl.bazis-dl_dot-leaders_nowrap { --width-dt: 260px; --width-dd: calc(100% - var(--width-dt)); --padding-start-dd: calc(var(--bazis-multiple-px) * 6); --margin-bottom-dt: calc(var(--bazis-multiple-px) * 4); --margin-bottom-dd: calc(var(--bazis-multiple-px) * 4); --color-dt: rgba(var(--bazis-text-color-rgb), 0.6); --color-dot: var(--bazis-text-color-secondary); --margin-bottom-dl: 0; } dl.bazis-dl_dot-leaders dt:last-of-type, dl.bazis-dl_dot-leaders_nowrap dt:last-of-type, dl.bazis-dl_dot-leaders dd:last-of-type, dl.bazis-dl_dot-leaders_nowrap dd:last-of-type { --margin-bottom-dt: 0; --margin-bottom-dd: 0; } dl.bazis-dl_dot-leaders .bazis-list_short-info, dl.bazis-dl_dot-leaders_nowrap .bazis-list_short-info { --color: var(--bazis-text-color); } dl.bazis-dl_dot-leaders .bazis-list_short-info bazis-link, dl.bazis-dl_dot-leaders_nowrap .bazis-list_short-info bazis-link { font-weight: 400; } .sl-section-sign dl.bazis-dl_dot-leaders, .sl-section-sign dl.bazis-dl_dot-leaders_nowrap { --width-dt: 35%; --margin-top-dl: var(--bazis-margin-3x); --padding-start-dd: var(--bazis-margin-3x); } .sl-section-sign dl.bazis-dl_dot-leaders dd, .sl-section-sign dl.bazis-dl_dot-leaders_nowrap dd { font-size: 14px; } dl.bazis-dl_easy { --margin-bottom-dt: var(--bazis-margin-2x); --margin-bottom-dd: var(--bazis-margin-8x); line-height: 20px; } dl.bazis-dl_easy dt { font-size: 13px; } dl.bazis-dl_easy dd:last-child { margin-bottom: 0; } .sl-card-mobile dl.bazis-dl_easy { --margin-bottom-dd: var(--bazis-margin-4x); line-height: 16px; } .sl-card-mobile dl.bazis-dl_easy dt { font-weight: 500; color: var(--bazis-text-color-secondary); } @media (max-width: 1024px) { h6 + dl.bazis-dl_inline, h6 + dl.bazis-dl_dot-leaders, h6 + dl.bazis-dl_dot-leaders_nowrap { --margin-top-dl: var(--bazis-margin-4x); } } @media (max-width: 576px) { dl.bazis-dl_inline, dl.bazis-dl_dot-leaders, dl.bazis-dl_dot-leaders_nowrap { --margin-bottom-dt: 8px; } dl.bazis-dl_inline dt, dl.bazis-dl_dot-leaders dt, dl.bazis-dl_dot-leaders_nowrap dt, dl.bazis-dl_inline dd, dl.bazis-dl_dot-leaders dd, dl.bazis-dl_dot-leaders_nowrap dd { float: none; clear: none; width: 100%; } dl.bazis-dl_inline dd:last-child, dl.bazis-dl_dot-leaders dd:last-child, dl.bazis-dl_dot-leaders_nowrap dd:last-child { margin-bottom: 0; } dl.bazis-dl_dot-leaders_nowrap dt { white-space: normal; } dl.bazis-dl_dot-leaders_nowrap dt::after { display: none; } .sl-section-sign dl.bazis-dl_dot-leaders_nowrap { --padding-start-dd: 0; } } .bazis-dropdown { --width: 362px; --padding-start: calc(var(--bazis-multiple-px) * 4); --padding-end: calc(var(--bazis-multiple-px) * 4); --padding-top: calc(var(--bazis-multiple-px) * 5); --padding-bottom: calc(var(--bazis-multiple-px) * 5); --background: var(--bazis-color-white); --border-radius: var(--bazis-border-radius); --border-width: 1px; --border-style: solid; --border-color: var(--bazis-background-medium); --box-shadow: 0px 4px 24px -10px rgba(0, 0, 0, 0.1); --top: 48px; --right: 0; } .bazis-dropdown bazis-button.bazis-dropdown__trigger, .bazis-dropdown__trigger bazis-button, .bazis-dropdown a.bazis-dropdown__trigger, .bazis-dropdown__trigger a { font-size: 14px; font-weight: 500; letter-spacing: 0.5px; } .bazis-dropdown bazis-button.bazis-dropdown__trigger bazis-icon, .bazis-dropdown__trigger bazis-button bazis-icon, .bazis-dropdown a.bazis-dropdown__trigger bazis-icon, .bazis-dropdown__trigger a bazis-icon { --bazis-icon-s-size: 16px; --bazis-icon-l-size: 24px; --bazis-icon-xl-size: 32px; } .bazis-dropdown bazis-button.bazis-dropdown__trigger bazis-icon.bazis-icon-l, .bazis-dropdown__trigger bazis-button bazis-icon.bazis-icon-l, .bazis-dropdown a.bazis-dropdown__trigger bazis-icon.bazis-icon-l, .bazis-dropdown__trigger a bazis-icon.bazis-icon-l { font-size: var(--bazis-icon-l-size); } .bazis-dropdown .bazis-list_select, .bazis-dropdown .bazis-list_control-dd { --margin-start-list: -16px; --margin-end-list: -16px; --margin-top-list: -20px; --margin-bottom-list: -20px; --border-radius: 0; --box-shadow: none; width: calc(100% - var(--margin-start-list) - var(--margin-end-list)); border: 0; } .bazis-dropdown .bazis-list_select .bazis-item, .bazis-dropdown .bazis-list_control-dd .bazis-item { --height: 36px; --color: var(--bazis-text-color); --color-hover: var(--bazis-text-color); margin: 0; } .bazis-dropdown.sl-dropdown_action, bazis-signing .bazis-dropdown { --top: 28px; --width: 210px; --color: var(--bazis-text-color-secondary); float: right; } .bazis-list_vline .bazis-dropdown, .bazis-list_vline_mini .bazis-dropdown { --top: 28px; --width: 220px; --color: var(--bazis-text-color-secondary); margin-left: 20px; } .bazis-dropdown.sl-dropdown_notifications { --width: 484px; --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; } .bazis-dropdown.sl-dropdown_notifications .bazis-dropdown__body { display: none; } .bazis-dropdown.sl-dropdown_notifications .bazis-dropdown__body[data-show] { display: block; } .bazis-dropdown.sl-dropdown_notifications .bazis-dropdown__trigger { --overflow: visible; position: relative; } .bazis-dropdown.sl-dropdown_notifications bazis-badge { --margin-end: 0; position: absolute; right: -4px; top: -4px; } @media (max-width: 576px) { .bazis-dropdown.sl-dropdown_notifications { --width: 100%; --border-radius: 0; position: static; } .bazis-dropdown.sl-dropdown_notifications .bazis-dropdown__body { top: 8px !important; } } .bazis-dropdown.sl-dropdown_settings-filter { --top: 36px; --left: 0; --width: 295px; --padding-top: calc(var(--bazis-multiple-px) * 3); --padding-bottom: calc(var(--bazis-multiple-px) * 3); } .bazis-dropdown.sl-dropdown_settings-filter bazis-button.bazis-dropdown__trigger { --background: var(--bazis-color-info-tint); --color: var(--bazis-color-base); } .bazis-dropdown.sl-dropdown_settings-filter .bazis-control__label { margin-bottom: 12px; } .bazis-dropdown.sl-dropdown_settings-filter .bazis-control__label + .bazis-radio { margin-top: 0; margin-bottom: calc(var(--bazis-multiple-px) * 4); } .bazis-dropdown.sl-dropdown_settings-filter .bazis-control__label + .bazis-radio:last-child { margin-bottom: 0; } @media (max-width: 992px) { .bazis-dropdown.sl-dropdown_settings-filter .bazis-dropdown__body { --top: auto; --left: 8px; --right: 8px; --bottom: 8px; --width: calc(100% - 16px); position: fixed; z-index: 1001; } .bazis-dropdown.sl-dropdown_settings-filter .bazis-dropdown__body hr { display: none; } .bazis-dropdown.sl-dropdown_settings-filter .bazis-dropdown__body hr + bazis-button { --height: 44px; display: block; } } .bazis-dropdown .bazis-btn-group .sl-select-date-control .bazis-dropdown__body { --top: 40px; } .sl-empty_notifications { --margin-top: 0; --padding-top: calc(var(--bazis-multiple-px) * 4); --padding-bottom: calc(var(--bazis-multiple-px) * 6); --background: var(--bazis-background-medium); --font-size: 12px; --line-height: 16px; } .sl-empty_primary { --color: var(--bazis-text-color); } .bazis-figure { --height: 168px; --width: 210px; --background: var(--bazis-color-white); --border-radius: var(--bazis-border-radius); --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color); --font-size: 13px; --font-weight: 500; margin-right: calc(var(--bazis-multiple-px) * 2); } .bazis-figure:last-child { margin-right: 0; } .bazis-figure__close { position: absolute; top: var(--bazis-multiple-px); right: var(--bazis-multiple-px); display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; margin: 0; outline: 0; border-radius: 50%; background: rgba(var(--bazis-color-white-rgb), 0.5); padding: 0; } .bazis-figure__close bazis-icon { --bazis-color-base: var(--bazis-link-color-dark) !important; } .bazis-figure .bh-ellipsis, .bazis-figure .sl-filter .bazis-tag > span, .sl-filter .bazis-figure .bazis-tag > span { max-width: calc(100% - 32px); } .bazis-figure .bazis-percentage-bar, .bazis-figure .bazis-percentage-bar_mini { --height: 4px; width: 178px; } .bazis-list_gallery .bazis-figure { --border-radius: none; } .bazis-control .bazis-figure { margin-top: calc(var(--bazis-multiple-px) * 3); } .bazis-figure_btn { --border-width: 1px; --border-style: dashed; --border-color: var(--bazis-color-action); } .bazis-figure_btn.bazis-color { border-color: var(--bazis-link-color-dark); color: var(--bazis-link-color-dark); } .bazis-figure_long { margin-bottom: calc(var(--bazis-multiple-px) * 8); } .bazis-file-inline .bazis-list .bazis-item bazis-link { --line-height: 20px; } @media only screen and (-webkit-max-device-pixel-ratio: 1) { .bazis-file-inline .bazis-list .bazis-item bazis-icon { position: relative; top: -2px; } } .bazis-list .bazis-item:last-child .bazis-file-inline { margin-bottom: calc(var(--bazis-multiple-px) * 10); } .bazis-file-inline + bazis-button { margin-top: -8px; } .bazis-file-inline + bazis-button bazis-icon { margin-left: -8px; margin-right: -8px; font-size: 20px; color: var(--bazis-text-color-secondary); } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .bazis-file-inline + bazis-button bazis-icon { margin-left: unset; margin-right: unset; margin-inline-start: -8px; margin-inline-end: -8px; } } aside bazis-file-inline { display: flex; align-items: center; justify-content: space-between; } aside bazis-file-inline .bazis-file-inline + bazis-button { margin-top: 0; flex-shrink: 0; align-self: flex-start; } .bazis-gallery-preview { --width: 161px; --height: 120px; } .bazis-gallery-preview .bazis-figure { --width: 161px; --height: 120px; } .bazis-gallery-preview__more { --top: 0; --bottom: 0; --right: 0; --width: 28px; --height: 120px; --background: var(--bazis-color-black-rgb); --opacity: 0.3; --border-radius: 0px 4px 4px 0px; --line-height: var(--height); --font-size: 11px; --font-weight: 500; --color: var(--bazis-color-white); } .bazis-gallery-slider { --width: 100%; } .bazis-gallery-single .bazis-figure { --height: 455px; --width: 100%; margin: 0; } .bazis-gallery-single bazis-button.bazis-color-action { --border-color: var(--bazis-color-action); --border-color-hover: var(--bazis-color-action); } .sl-grid_global > bazis-row > bazis-col { --bazis-grid-column-padding-start-xl: 0; --bazis-grid-column-padding-end-xl: 40px; --bazis-grid-column-padding-start-xs: 0; --bazis-grid-column-padding-end-xs: 0; --bazis-grid-column-padding-top: 0; --bazis-grid-column-padding-bottom: 0; } .sl-grid_global dl.bazis-dl_inline, .sl-grid_global dl.bazis-dl_dot-leaders, .sl-grid_global dl.bazis-dl_dot-leaders_nowrap { --width-dt: 200px; --margin-bottom-dt: 12px; --margin-bottom-dd: 12px; } .sl-grid_global dl.bazis-dl_inline--lg { --margin-bottom-dt: 20px; --margin-bottom-dd: 20px; } .sl-grid_form > bazis-row { margin: 0 calc(var(--bazis-multiple-px) * -3); } .sl-grid_form > bazis-row > bazis-col { --bazis-grid-column-padding-start-sm: calc(var(--bazis-multiple-px) * 3); --bazis-grid-column-padding-end-sm: calc(var(--bazis-multiple-px) * 3); --bazis-grid-column-padding-top: 0; --bazis-grid-column-padding-bottom: 0; --bazis-grid-column-padding-start-xs: 0; --bazis-grid-column-padding-end-xs: 0; } .sl-form_oneline .sl-grid_form > bazis-row > bazis-col { --bazis-grid-column-padding-start: var(--bazis-multiple-px); --bazis-grid-column-padding-end: var(--bazis-multiple-px); } .sl-grid_accordion > bazis-row > bazis-col, .sl-grid_accordion .sl-grid_form > bazis-row > bazis-col { --bazis-grid-column-padding-start: var(--bazis-padding-4x); --bazis-grid-column-padding-end: var(--bazis-padding-4x); --bazis-grid-column-padding-top: 0; --bazis-grid-column-padding-bottom: 0; } .sl-grid_card { margin: 0 calc(var(--bazis-multiple-px) * -4); } .sl-grid_card > bazis-row > bazis-col { --bazis-grid-column-padding-start: calc(var(--bazis-multiple-px) * 4); --bazis-grid-column-padding-end: calc(var(--bazis-multiple-px) * 4); --bazis-grid-column-padding-bottom: calc(var(--bazis-padding) * 2); } .sl-grid_filter { --padding-grid: calc(var(--bazis-multiple-px) * 3); margin: 0 calc(var(--padding-grid) * -1); } .sl-grid_filter > bazis-row > bazis-col { --bazis-grid-column-padding-start: var(--padding-grid); --bazis-grid-column-padding-end: var(--padding-grid); } .sl-grid_timeinterval > bazis-row > bazis-col { --bazis-grid-column-padding-start-sm: var(--bazis-padding-2x); --bazis-grid-column-padding-end-sm: var(--bazis-padding-2x); --bazis-grid-column-padding-top: 0; --bazis-grid-column-padding-bottom: 0; --bazis-grid-column-padding-start-xs: 0; --bazis-grid-column-padding-end-xs: 0; } .sl-grid_center { max-width: 800px; } .sl-grid_center > bazis-row > bazis-col { --bazis-grid-column-padding-top: 0; --bazis-grid-column-padding-bottom: 0; } .sl-grid_global > bazis-row > bazis-col:first-child, .sl-grid_accordion > bazis-row > bazis-col:first-child, .sl-grid_timeinterval > bazis-row > bazis-col:first-child, .sl-grid_center > bazis-row > bazis-col:first-child { --bazis-grid-column-padding-start-xs: 0; --bazis-grid-column-padding-start-sm: 0; --bazis-grid-column-padding-start-xl: 0; } .sl-grid_global > bazis-row > bazis-col:last-child, .sl-grid_accordion > bazis-row > bazis-col:last-child, .sl-grid_timeinterval > bazis-row > bazis-col:last-child, .sl-grid_center > bazis-row > bazis-col:last-child { --bazis-grid-column-padding-end-xs: 0; --bazis-grid-column-padding-end-sm: 0; --bazis-grid-column-padding-end-xl: 0; } bazis-row.bazis-list_vline > bazis-col.bazis-item, bazis-row.bazis-list_vline_mini > bazis-col.bazis-item { --bazis-grid-column-padding-start: 0; --bazis-grid-column-padding-end: 0; } bazis-row.bazis-list_vline > bazis-col.bazis-item::before, bazis-row.bazis-list_vline_mini > bazis-col.bazis-item::before { --padding-start: var(--bazis-padding-4x); } bazis-row.bazis-list_vline:first-child > bazis-col, bazis-row.bazis-list_vline_mini:first-child > bazis-col { --bazis-grid-column-padding-top: 0; } bazis-row.bazis-list_vline:last-child > bazis-col, bazis-row.bazis-list_vline_mini:last-child > bazis-col { --bazis-grid-column-padding-bottom: 0; } bazis-row.sl-row_vertical-zero > bazis-col { --bazis-grid-column-padding-top: 0; --bazis-grid-column-padding-bottom: 0; } @media (max-width: 1024px) { .sl-grid_center { max-width: 100%; margin: 0 36px; } } @media (max-width: 576px) { .sl-grid_center { margin: 0; } } .bazis-icon-wrap { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 24px; height: 24px; line-height: 24px; margin-left: 8px; border-radius: 50%; background: var(--bazis-color-action); text-align: center; color: var(--bazis-color-action-contrast); } .bazis-icon-wrap bazis-icon { --bazis-icon-s-size: 12px; } .sl-filter app-search-filter .bazis-list_control-dd .bazis-infinite-scroll-content { padding-bottom: 60px; } .sl-filter app-search-filter .bazis-list_control-dd .bazis-infinite-scroll-content .bazis-item + bazis-button { position: fixed; z-index: 150; bottom: 12px; left: 20px; right: 20px; } @media (min-width: 992.98px) { .sl-filter app-search-filter .bazis-list_control-dd .bazis-infinite-scroll-content { overflow: auto; height: 182px; } } @media (max-width: 992.97px) { .sl-filter app-search-filter .bazis-list_control-dd .bazis-infinite-scroll-content { --max-height-infinite-scroll-content: 100%; } } bazis-interrogation { --margin-start: calc(var(--bazis-multiple-px) * 3); --color: var(--bazis-placeholder-color); } .bazis-checkbox_right + bazis-interrogation { --margin-start: 0; --margin-end: calc(var(--bazis-multiple-px) * 3); display: inline-flex; } @media (max-width: 576px) { bazis-layout-press-footer::part(content) { height: auto; overflow: initial; } } bazis-link.sl-link_entity { --font-size: 16px; --line-height: 24px; } .bazis-list { --list-style: none; --font-size: 13px; --font-weight: 400; --line-height: 20px; } .bazis-list_h > .bazis-item { --margin-end: calc(var(--bazis-multiple-px) * 3); } .bazis-list_short-info > .bazis-item { --padding-start: calc(var(--bazis-multiple-px) * 3); --padding-end: calc(var(--bazis-multiple-px) * 3); --margin-end: 0; --font-size: 12px; --color: var(--bazis-text-color-secondary); } bazis-infinite-list .bazis-list_short-info { display: inline-block; } bazis-infinite-list .bazis-list_short-info > .bazis-item { min-height: initial; display: inline; } .bazis-list_vline, .bazis-list_vline_mini { --padding-start: calc(var(--bazis-multiple-px) * 5); --border-color: var(--bazis-border-color); --line-height: 16px; } .bazis-list_vline .bazis-checkbox__label, .bazis-list_vline_mini .bazis-checkbox__label, .bazis-list_vline .bazis-radio__label, .bazis-list_vline_mini .bazis-radio__label { margin-right: 0; } .bazis-list_vline.bazis-list_h > .bazis-item, .bazis-list_h.bazis-list_vline_mini > .bazis-item { --margin-end: 0; } .bazis-list_vline_mini { --padding-start: calc(var(--bazis-multiple-px) * 3); } .sl-toolbar_table-header .bazis-list_vline, .sl-toolbar_table-header .bazis-list_vline_mini { align-items: center; } .bazis-list_select, .bazis-list_control-dd { --padding-start: 12px; --padding-end: 12px; --padding-top: calc(var(--bazis-multiple-px) * 2); --padding-bottom: calc(var(--bazis-multiple-px) * 2); --background-hover: var(--bazis-background-dark); --background-selected: var(--bazis-color-action); --color-selected: var(--bazis-color-action-contrast); --max-height: 208px; --background-list: var(--bazis-color-white); } .bazis-list_control-dd { --max-height: 208px; --border-radius-list: var(--bazis-border-radius); --border-width-list: 1px; --border-style-list: solid; --border-color-list: var(--bazis-background-medium); --padding-top-list: 12px; --padding-bottom-list: 12px; --margin-top-list: 3px; --box-shadow: 0px 4px 24px -10px rgba(0, 0, 0, 0.1); } .bazis-list_control-dd-wrapper { --height: 36px; --padding-bottom: calc(var(--bazis-multiple-px) * 2); } .bazis-dropdown .bazis-list_control-dd bazis-button.bazis-item { --background: transparent; --background-hover: var(--bazis-background-dark); --padding-start: 12px; --padding-end: 12px; --padding-top: 8px; --padding-bottom: 8px; text-align: left; } .bazis-dropdown .bazis-list_control-dd bazis-button.bazis-item::part(inner) { --padding-start: 0; --padding-end: 0; justify-content: flex-start; } .bazis-dropdown .bazis-list_control-dd bazis-button.bazis-item:active:hover::part(inner) { background: var(--background-selected); color: var(--color-selected); } .bazis-list_gallery > .bazis-item { --margin-end: var(--bazis-multiple-px); } .bazis-list_gallery .bazis-figure { --width: 271px; } .bazis-list_gallery .bazis-figure_medium { --width: 604px; } .bazis-list_between > .bazis-item, .bazis-list_between_dot-leaders > .bazis-item { --margin-bottom: var(--bazis-margin-4x); } .bazis-list_between_dot-leaders { --color-dot: var(--bazis-text-color-secondary); } .bazis-list_between_dot-leaders > .bazis-item { --margin-top: 0; --margin-bottom: calc(var(--bazis-multiple-px) * 5); } .bazis-list_between_dot-leaders > .bazis-item:last-child { --margin-bottom: 0; } .bazis-list_underline, .bazis-list_overline { --margin-bottom: 0; --border-radius: 0; } .bazis-list_checkable { --margin-bottom: 16px; } .bazis-list_checkable .bazis-list .bazis-item { --margin-bottom: 8px; } .bazis-list_checkable .bazis-item_parent > bazis-step { --font-weight: 500; } .bazis-list_checkable .bazis-item_parent > bazis-step::part(sign) { visibility: hidden; } .bazis-list_checkable .bazis-item_parent.bazis-item_invalid > bazis-step { --color: var(--color-muted); } .bazis-list_history, .sl-list_trip { --width-bullet: 8px; } .bazis-list_history > .bazis-item, .sl-list_trip > .bazis-item { --margin-bottom: var(--bazis-margin-8x); --padding-start: calc(var(--bazis-padding-4x) + var(--width-bullet) + 2px); } .bazis-list_history > .bazis-item app-browse-default, .sl-list_trip > .bazis-item app-browse-default { width: 156px; margin-right: calc(var(--bazis-multiple-px) * 8); } .bazis-list_history > .bazis-item app-browse-default:last-child, .sl-list_trip > .bazis-item app-browse-default:last-child { margin-right: 0; } .bazis-list_history > .bazis-item::before, .sl-list_trip > .bazis-item::before { top: 4.5px; } .bazis-list_history > .bazis-item::after, .sl-list_trip > .bazis-item::after { top: 14.5px; left: 4.5px; } .bazis-list_history > .bazis-item:last-child, .sl-list_trip > .bazis-item:last-child { --margin-bottom: 0; } .bazis-list_history > .bazis-item:last-child::after, .sl-list_trip > .bazis-item:last-child::after { display: block; bottom: 0; } .sl-list_easy > .bazis-item + .bazis-item { --padding-top: calc(var(--bazis-multiple-px) * 4); } bazis-tooltip .sl-list_easy > .bazis-item { --padding-top: calc(var(--bazis-multiple-px) * 3); } .sl-list_e-sign { --margin-bottom: calc(var(--bazis-multiple-px) * 10); --margin-top-dl: calc(var(--bazis-multiple-px) * 4); } .sl-list_e-sign .sl-e-sign + div { width: 100%; } .sl-list_e-sign textarea { border-style: dashed; border-color: var(--bazis-placeholder-color); border-radius: var(--bazis-border-radius); resize: vertical; width: 100%; } .sl-list_trip { --margin-top-list: 12px; } .sl-list_trip > .bazis-item { --padding-start: calc(var(--width-bullet) + var(--bazis-margin-4x) + 1px); --margin-bottom: var(--bazis-margin-5x); } .sl-list_trip > .bazis-item::before { top: 4.5px; background: var(--bazis-color-base, var(--bazis-placeholder-color)); } .sl-list_trip > .bazis-item::after { left: 4.5px; top: 14.5px; } .sl-list_trip > .bazis-item:last-child { --margin-bottom: 0; } .sl-list_trip > .bazis-item:last-child::before { border-color: var(--bazis-color-base, var(--bazis-placeholder-color)); } .sl-list_trip > .bazis-item:last-child::after { display: none; } .sl-list_vtabs { --color: var(--bazis-text-color); --font-size: 13px; --font-weight: 400; --line-height: 20px; --padding-start: calc(var(--bazis-multiple-px) * 4 - 2px); --padding-end: calc(var(--bazis-multiple-px) * 5); --padding-top: calc(var(--bazis-multiple-px) * 2); --padding-bottom: calc(var(--bazis-multiple-px) * 2); --border-width: 0 0 0 2px; --border-color: transparent; --border-style: solid; --border-radius: 0; } aside .sl-list_vtabs { --margin-start-list: calc(var(--bazis-multiple-px) * -4); --margin-top-list: calc(var(--bazis-multiple-px) * 2); } aside.sl-aside_left .sl-list_vtabs { --margin-start-list: calc(var(--bazis-multiple-px) * -5); } .sl-list_vtabs .bazis-item { cursor: pointer; } .sl-list_vtabs .bazis-item--active { --font-weight: 500; --border-color: var(--bazis-text-color); } .bazis-loader, .bazis-loader_inline { --background: var(--bazis-color-white); --min-width: 296px; --width: 100%; --max-width: 500px; --height: 150px; --font-size: 14px; --color: var(--bazis-text-color-secondary); --spinner-size: 50px; --spinner-background: rgba(var(--bazis-color-secondary-rgb), 0.2); --spinner-color: var(--bazis-color-secondary); } .bazis-loader_dots { --dot-size: 2px; --dots-margin: 4px; --color-rgb: var(--bazis-text-color-secondary-rgb); } bazis-button.bazis-btn--disabled .bazis-loader_dots { --color: var(--color-disabled); --color-rgb: var(--bazis-color-white-rgb); } bazis-signing .bazis-loader:not(bazis-signing .bazis-modal__content .bazis-loader):not(bazis-signing .bazis-modal__content .bazis-loader_inline), bazis-signing .bazis-loader_inline:not(bazis-signing .bazis-modal__content .bazis-loader):not(bazis-signing .bazis-modal__content .bazis-loader_inline) { --height: 218px; top: auto; left: 8px; right: 8px; bottom: 8px; padding: 32px 20px 40px; } .bazis-control .bazis-loader, .bazis-control .bazis-loader_inline { --background: transparent; --min-width: 20px; --width: 20px; --max-width: 20px; --height: 20px; --spinner-size: 20px; --spinner-background: transparent; --spinner-color: var(--bazis-color-primary); position: static; margin: 0; padding: 0; } .bazis-control .bazis-loader__spinner { margin: 0; } .bazis-menu, .bazis-menu_rounded { --multiple: 4; --margin-bottom: 8px; --padding-top: calc(var(--bazis-multiple-px) * var(--multiple)); --padding-bottom: calc(var(--bazis-multiple-px) * var(--multiple)); --padding-start: calc(var(--bazis-multiple-px) * var(--multiple)); --padding-end: calc(var(--bazis-multiple-px) * var(--multiple)); --border-radius: 0; --background-hover: var(--bazis-background-accent); --color-hover: var(--color); --list-style: none; --font-size: 13px; --font-weight: 400; --line-height: 20px; } .bazis-menu bazis-icon, .bazis-menu_rounded bazis-icon { flex-shrink: 0; margin-right: calc(var(--bazis-multiple-px) * var(--multiple)); } .bazis-menu bazis-button, .bazis-menu_rounded bazis-button { --color: var(--bazis-text-color); color: var(--color); } .bazis-menu bazis-button:not(.bazis-item), .bazis-menu_rounded bazis-button:not(.bazis-item) { --padding-start: calc(var(--bazis-multiple-px) * var(--multiple)); --padding-end: calc(var(--bazis-multiple-px) * var(--multiple)); --padding-top: calc(var(--bazis-multiple-px) * var(--multiple)); --padding-bottom: calc(var(--bazis-multiple-px) * var(--multiple)); } .bazis-menu_rounded { --multiple: 2; --border-radius: var(--bazis-border-radius); --margin-bottom-list: 32px; } .bazis-menu_rounded .bazis-item { --font-size: 14px; --font-weight: 500; display: flex; align-items: center; } .bazis-menu_rounded .bazis-item:hover bazis-icon, .bazis-menu_rounded .bazis-item.active bazis-icon { background: transparent; } .bazis-menu_rounded bazis-icon { padding: 10px; background: var(--bazis-background-medium); margin-right: calc(var(--bazis-multiple-px) * 3); } @media (max-width: 1024px) { .sl-menu_profile { --background-hover: transparent; --color-hover: var(--bazis-color-primary); --line-height: 12px; display: flex; justify-content: space-between; margin: 0; } .sl-menu_profile .bazis-item { --font-size: 10px; width: 100%; flex-direction: column; padding: 0; margin: 0; text-align: center; } .sl-menu_profile bazis-icon { margin: 0 0 var(--bazis-margin-1x); padding: 0; background: transparent; border-radius: 0; } } .bazis-message-plane { --padding-top: calc(var(--bazis-multiple-px) * 3); --padding-bottom: calc(var(--bazis-multiple-px) * 3); --background: var(--bazis-color-base, var(--bazis-white-color)); --color: var(--bazis-color-contrast, var(--bazis-text-color)); --font-size: 13px; --font-weight: 400; --line-height: 20px; } .bazis-message-plane.bazis-color-warning { --color: var(--bazis-text-color); } .bazis-message-plane.bazis-color-warning .bazis-message-plane__close { --color: var(--bazis-text-color); --background-hover: rgba(var(--bazis-color-white-rgb), 0.1); --background-activated: rgba(var(--bazis-color-tint), 0.1); --background-focused: rgba(var(--bazis-color-white-rgb), 0.1); } .bazis-modal { --background: var(--bazis-color-white); --border-radius: var(--bazis-border-radius); --box-shadow: 0px 15px 15px -10px rgba(var(--bazis-shadow-color-rgb), .4); --width: 100%; --max-height: calc(100vh - var(--bazis-multiple-px) * 20); --max-width: 976px; --min-height: 62.5vh; --top-close: calc(var(--bazis-multiple-px) * 5); --right-close: calc(var(--bazis-multiple-px) * 5); --padding-start-header: calc(var(--bazis-multiple-px) * 10); --padding-end-header: 60px; --padding-top-header: calc(var(--bazis-multiple-px) * 5); --padding-bottom-header: var(--bazis-padding-6x); --padding-start-content: calc(var(--bazis-multiple-px) * 10); --padding-end-content: calc(var(--bazis-multiple-px) * 10); --padding-top-content: calc(var(--bazis-multiple-px) * 8); --padding-bottom-content: calc(var(--bazis-multiple-px) * 8); --padding-start-footer: calc(var(--bazis-multiple-px) * 10); --padding-end-footer: calc(var(--bazis-multiple-px) * 10); --padding-top-footer: var(--bazis-padding-6x); --padding-bottom-footer: calc(var(--bazis-padding-6x) * 2); } .bazis-modal + .bazis-backdrop { --backdrop-opacity: 0.6; --opacity: var(--backdrop-opacity); } .bazis-modal_big-content .bazis-modal__header, .bazis-modal_big-content .bazis-modal__header_shadow, .bazis-modal-wrap_big-content .bazis-modal__header, .bazis-modal-wrap_big-content .bazis-modal__header_shadow { position: relative; height: 76px; } .bazis-modal_big-content .bazis-modal__header h1, .bazis-modal_big-content .bazis-modal__header_shadow h1, .bazis-modal_big-content .bazis-modal__header h3, .bazis-modal_big-content .bazis-modal__header_shadow h3, .bazis-modal-wrap_big-content .bazis-modal__header h1, .bazis-modal-wrap_big-content .bazis-modal__header_shadow h1, .bazis-modal-wrap_big-content .bazis-modal__header h3, .bazis-modal-wrap_big-content .bazis-modal__header_shadow h3 { padding-top: 0; font-size: 28px; line-height: 36px; } .bazis-modal__header h1, .bazis-modal__header_shadow h1 { --bazis-h1-margin: 0; } .bazis-modal__header h3, .bazis-modal__header_shadow h3 { --bazis-h3-margin: 0; } .bazis-modal__content section { margin-bottom: 40px; } .bazis-modal__footer { border-top: 1px solid var(--bazis-border-color); box-shadow: 0px -15px 15px -10px rgba(var(--bazis-shadow-color-rgb), 0.4); } .bazis-modal .bazis-alert__wrapper { --box-shadow: none; } .bazis-modal.map { --height: 640px; } .bazis-modal.map h4 { margin-right: 16px; } .bazis-modal.map .bazis-map-wrapper, .bazis-modal.map .sl-map-wrapper_dd { --height: calc(80% - var(--margin-bottom)); } .bazis-modal.map .bazis-map-wrapper .bazis-map, .bazis-modal.map .sl-map-wrapper_dd .bazis-map { border-radius: 0 0 var(--border-radius) var(--border-radius); } .bazis-modal.gallery { --background: transparent; --top-close: calc(var(--bazis-multiple-px) * 10); --right-close: calc(var(--bazis-multiple-px) * 10); } .bazis-modal.gallery + .bazis-backdrop { --backdrop-opacity: 0.9; --opacity: var(--backdrop-opacity); } .bazis-modal.gallery .bazis-loader_inline { --height: auto; } .bazis-modal.gallery #plotCanvas { width: 100%; height: 100%; } .bazis-modal.gallery .plot-container { width: 100%; height: 100%; overflow: hidden; } .bazis-modal.gallery .plot-container > .svg-container { margin: auto; } .bazis-modal.video { --background: transparent; --top-close: 20px; --right-close: 78px; } .bazis-modal.video + .bazis-backdrop { --backdrop-opacity: 0.9; --opacity: var(--backdrop-opacity); } .bazis-modal.video .bazis-modal__content { --padding-start-content: 0; --padding-end-content: 0; --padding-top-content: 0; --padding-bottom-content: 0; } @media (max-width: 992px) { .bazis-modal:not(.fullscreen, .sl-modal_mobile-bottom, .dummy) { --width: calc(100% - 72px); --min-height: auto; --max-height: 100%; margin: 40px 36px; bottom: auto; } .bazis-modal:not(.fullscreen, .sl-modal_mobile-bottom, .dummy) .bazis-modal-wrap { max-height: var(--max-height); } .bazis-modal .bazis-modal__footer .bazis-btn_clear { margin-left: -16px; margin-right: -16px; } } @media (max-width: 576px) { .bazis-modal:not(.sl-modal_mobile-bottom, .dummy) { --min-height: 100vh; --width: 100%; --border-radius: 0; --box-shadow: inset 0px -1px 0px rgba(0, 0, 0, 0.1); --top-close: 9px; --right-close: auto; --left-close: 12px; --padding-start-header: 60px; --padding-end-header: calc(var(--bazis-multiple-px) * 5); --padding-top-header: calc(var(--bazis-multiple-px) * 4); --padding-bottom-header: calc(var(--bazis-multiple-px) * 4); --padding-start-content: calc(var(--bazis-multiple-px) * 5); --padding-end-content: calc(var(--bazis-multiple-px) * 5); --padding-start-footer: calc(var(--bazis-multiple-px) * 5); --padding-end-footer: calc(var(--bazis-multiple-px) * 5); --padding-top-footer: calc(var(--bazis-multiple-px) * 4); --padding-bottom-footer: calc(var(--bazis-multiple-px) * 4); margin: 0; bottom: 0; } .bazis-modal .bazis-modal__header h1, .bazis-modal .bazis-modal__header_shadow h1 { padding-top: 0; font-size: 18px; line-height: 24px; } .bazis-modal .bazis-modal__header h4, .bazis-modal .bazis-modal__header_shadow h4 { font-size: 18px; line-height: 24px; } .bazis-modal .bazis-modal__footer { box-shadow: inset 0px 1px 0px rgba(0, 0, 0, 0.1); } .bazis-modal app-signature .bazis-modal__footer bazis-button { display: block; } .bazis-modal.video { --top-close: 8px; --right-close: 8px; --left-close: auto; padding: 0; } .bazis-modal.video .bazis-modal__close { z-index: 100; } .bazis-modal.video app-video-modal { display: flex; flex-direction: column; height: 100vh; justify-content: center; } .bazis-modal.video .bazis-modal__content { position: relative; height: 0; padding-top: 56.25%; /* 16:9 */ padding-bottom: 0; padding-left: 0; padding-right: 0; } .bazis-modal.video .bazis-modal__content iframe { position: absolute; top: 0; left: 0; } .bazis-modal.map { --padding-top-content: 0; --padding-bottom-content: 0; --padding-start-content: 0; --padding-end-content: 0; --top-close: 8px; --right-close: 8px; --left-close: auto; } .bazis-modal.map .sl-desktop-content { display: none; } .bazis-modal.map .bazis-map-wrapper, .bazis-modal.map .sl-map-wrapper_dd { --height: 100vh; } .bazis-modal.map .sl-mobile-content .bazis-control { --height: 34px; --control-width: calc(100% - 8px); margin-right: 8px; } .bazis-modal.map .sl-mobile-content .bazis-list_short-info > .bazis-item { --font-size: 16px; --line-height: 24px; --font-weight: 500; --color: var(--bazis-text-color); } } .sl-modal_small { --max-height: 580px; --max-width: 780px; --padding-top-header: 21px; --padding-bottom-header: calc(var(--bazis-multiple-px) * 4); --padding-top-content: calc(var(--bazis-multiple-px) * 4); } .sl-modal_small.map { --max-height: 490px; --max-width: 976px; --padding-top-content: calc(var(--bazis-multiple-px) * 8); } .sl-modal_xs { --min-height: 401px; --max-height: 430px; --max-width: 664px; --padding-bottom-header: 0; --padding-top-content: 0; --padding-bottom-content: 0; } .sl-modal_mobile-bottom { --width: calc(100% - 16px); --min-height: 0; --padding-start-header: calc(var(--bazis-multiple-px) * 5); --padding-end-header: calc(var(--bazis-multiple-px) * 5); --padding-top-header: calc(var(--bazis-multiple-px) * 5); --padding-bottom-header: calc(var(--bazis-multiple-px) * 5); --padding-top-content: 0; --padding-bottom-content: calc(var(--bazis-multiple-px) * 5); --padding-start-content: calc(var(--bazis-multiple-px) * 5); --padding-end-content: calc(var(--bazis-multiple-px) * 5); --padding-start-footer: calc(var(--bazis-multiple-px) * 5); --padding-end-footer: calc(var(--bazis-multiple-px) * 5); --padding-top-footer: calc(var(--bazis-multiple-px) * 5); --padding-bottom-footer: calc(var(--bazis-multiple-px) * 5); bottom: 0; top: auto; margin: 8px; } .sl-modal_mobile-bottom .bazis-list_underline { --border-style: dashed; --padding-top-list: 0; --padding-bottom-list: 0; --padding-bottom: 16px; --padding-top: 0; --margin-bottom: 16px; } .sl-modal_mobile-bottom .bazis-list_underline > .bazis-item:last-child { border: none; } .bazis-control .sl-modal_mobile-bottom { --padding-top-content: calc(var(--bazis-multiple-px) * 5); } .bazis-control .sl-modal_mobile-bottom .bazis-control__label { --font-size-label: 18px; line-height: 24px; color: var(--bazis-text-color); } .bazis-control .sl-modal_mobile-bottom .bazis-radio__label::before { margin-left: 0; } .bazis-control .sl-modal_mobile-bottom bazis-button { --height: 44px; margin: 40px 0 20px; } .sl-modal_role { --max-width: 664px; --max-height: 598px; --padding-top-content: 52px; } .sl-modal_form { --padding-top-header: var(--bazis-padding-5x); --padding-bottom-header: var(--bazis-padding-6x); --padding-start-header: 40px; --padding-end-header: 40px; --padding-top-content: var(--bazis-padding-8x); --padding-bottom-content: calc(var(--bazis-padding-6x) * 2); } .sl-modal_form h3 { --bazis-h3-margin: 0; } @media (max-width: 576px) { .bazis-paginator .bazis-control { --control-width: 64px; } .bazis-paginator .sl-paginator__total { line-height: 36px; } } .bazis-pane { --border-radius: 4px 4px 0px 0px; --background: var(--bazis-background); --height-header: 36px; } .bazis-pane__header { --padding-start: 16px; --padding-end: 4px; --border-width: 0 0 1px; --border-color: var(--bazis-border-color); --border-style: solid; --border-radius: 4px 4px 0px 0px; } .bazis-pane__header bazis-tabs { --font-size: 13px; margin-left: 20px; } .bazis-pane__header__header__btns { background: linear-gradient(270deg, var(--bazis-color-white) 75%, rgba(var(--bazis-color-white-rgb), 0.8) 94.14%); padding-right: var(--padding-end); padding-left: var(--padding-end); border-radius: 0 4px 0 0; } .bazis-pane--expanded { --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color); --border-color-hover: var(--bazis-border-color-dark); --box-shadow: 0px 15px 15px -10px rgba(var(--bazis-shadow-color-rgb), 0.4); position: absolute; z-index: 152; } .bazis-percentage-bar, .bazis-percentage-bar_mini { --height: 8px; --background: var(--bazis-background-dark); position: relative; margin-top: 8px; } .bazis-block_secondary .bazis-percentage-bar, .bazis-block_secondary .bazis-percentage-bar_mini { --background: var(--bazis-color-white); } .bazis-percentage-bar__part { position: absolute; top: 0; bottom: 0; left: 0; max-width: 100%; } .process .bazis-percentage-bar__part { background: var(--bazis-color-success); } .defuse .bazis-percentage-bar__part { background: var(--bazis-color-tertiary); } .utilize .bazis-percentage-bar__part { background: var(--bazis-color-warning); } .store .bazis-percentage-bar__part { background: var(--bazis-color-action); } .bazis-percentage-bar_mini { --height: 4px; margin-top: 4px; } .bazis-percentage-block .bazis-percentage-bar_mini, .bazis-percentage-block_medium .bazis-percentage-bar_mini { margin-top: 2px; border-radius: 2px; } .bazis-percentage-block .bazis-percentage-bar_mini .bazis-percentage-bar__part:first-child, .bazis-percentage-block_medium .bazis-percentage-bar_mini .bazis-percentage-bar__part:first-child { border-radius: 2px 0 0 2px; } .bazis-percentage-block .bazis-percentage-bar_mini .bazis-percentage-bar__part_full:first-child, .bazis-percentage-block_medium .bazis-percentage-bar_mini .bazis-percentage-bar__part_full:first-child { border-radius: 2px; } .bazis-percentage-block--active .bazis-percentage-bar_mini { --background: rgba(var(--bazis-text-color-contrast-rgb), 0.4); } .bazis-percentage-block--active .bazis-percentage-bar_mini .bazis-percentage-bar__part.bazis-color { background: var(--bazis-color-contrast); } .sl-percentages { display: flex; justify-content: space-between; } .sl-percentages__item { position: relative; width: 100%; padding-left: 14px; margin-left: 14px; } .sl-percentages__item--hidden { display: none; } .sl-percentages__item:first-child, .sl-percentages__item--hidden:first-child + .sl-percentages__item { padding-left: 0; margin-left: 0; } .sl-percentages__item .bazis-percentage-bar, .sl-percentages__item .bazis-percentage-bar_mini { --height: 4px; margin-top: 8px; } .sl-percentages__item:hover .bazis-tooltip_static { display: block; top: 38px; } .sl-percentages_column { width: 144px; } .sl-percentages_column .sl-percentages__item { padding: 0; margin-left: 0; } .bazis-percentage-block, .bazis-percentage-block_medium { --padding-top: 8px; --padding-start: 16px; --padding-end: 16px; --padding-bottom: 6px; --margin-bottom: 12px; --border-radius: var(--bazis-border-radius); --background: var(--bazis-background); --background-hover: var(--bazis-background-medium); --border-color-hover: var(--bazis-border-color); } .bazis-percentage-block__count { --font-size: 18px; --line-height: 24px; color: var(--bazis-color-action); } .bazis-percentage-block__percent { color: var(--bazis-text-color-secondary); } .bazis-percentage-block bazis-tooltip, .bazis-percentage-block_medium bazis-tooltip { z-index: 149; } .bazis-percentage-block--active { --background: var(--bazis-color-action); --border-color: var(--bazis-color-action); --color: var(--bazis-color-primary-contrast); --background-hover: var(--background); --border-color-hover: var(--border-color); } .bazis-percentage-block--active .bazis-percentage-block__count { --font-weight: 700; color: var(--color); } .bazis-percentage-block--active .bazis-percentage-block__percent { color: rgba(var(--bazis-color-primary-contrast-rgb), 0.7); } .bazis-percentage-block:last-child, .bazis-percentage-block_medium:last-child { --margin-bottom: 0; } .bazis-percentage-block_medium { --padding-top: 10px; --padding-bottom: 10px; } bazis-range { --bar-height: 7px; --thumb-background: var(--bazis-color-white, #ffffff); --thumb-width: 20px; --thumb-height: 20px; --thumb-border-radius: 50%; --thumb-border-width: 0; --thumb-border-style: solid; --thumb-box-shadow: 0 0 4px rgba(0, 0, 0, 0.16); --track-background: var(--bazis-placeholder-color, #BCC1CC); --track-height: var(--bar-height); --track-border-radius: 2px; --track-border-width: 0; --track-border-style: solid; --track-box-shadow: none; --progress-background: var(--bazis-color-primary, #00A2AD); --font-size: 14px; --font-weight: normal; --line-height: 20px; } bazis-sign-status .bazis-loader_inline { --height: 56px; --min-width: 56px; --spinner-size: 56px; padding: 0; } bazis-sign-status .bazis-loader_inline .bazis-loader__spinner { margin: auto; padding: 3px; } bazis-skeleton { --height: 20px; --border-radius: var(--bazis-border-radius); --background: var(--bazis-border-color); --margin-bottom: 12px; --animation-duration: 1.6s; } bazis-step { --color-muted: var(--bazis-text-color-secondary); --sign-margin: 16px; --sign-background: var(--bazis-color-action); --sign-background-muted: transparent; --sign-border-radius: 50%; --sign-border-style: solid; --sign-border-width: 1px; --sign-color: var(--bazis-color-white); --sign-color-muted: var(--bazis-text-color-secondary); --sign-size: 20px; --sign-icon-size: 12px; --sign-font-size: 11px; } bazis-step .bazis-step__label_another { --font-weight: 500; } .bazis-stepper { --min-height: 56px; --padding-start: 33px; --padding-end: 12px; --padding-top: 16px; --padding-bottom: 16px; --background: var(--bazis-header-background); --background-active: var(--bazis-stepper-background); --width-item-before: 18px; --width-item-after: 18.5px; } .bazis-stepper .bazis-item { --margin-start: 0; cursor: default; pointer-events: none; } .bazis-stepper .bazis-item:last-child::after { background-image: none; } .bazis-stepper bazis-step { --font-size: 14px; --font-weight: 500; --line-height: 24px; --color-muted: var(--bazis-text-color-secondary); --sign-margin: 10px; --sign-background: var(--bazis-text-color-secondary); --sign-background-muted: var(--bazis-text-color-secondary); --sign-background-active: var(--bazis-color-white); --sign-color-muted: var(--bazis-color-white); --sign-size: 24px; } .bazis-stepper bazis-step::part(sign) { line-height: var(--sign-size); } .bazis-stepper bazis-step.bazis-step_check { --sign-color: var(--background); --sign-color-active: var(--bazis-stepper-background); } .bazis-stepper bazis-step.bazis-step_outline { --sign-color-active: var(--bazis-color-white); } .sl-header .bazis-stepper { --margin-start: 20px; } @media (max-width: 920px) { .bazis-stepper { --padding-start: 88px; --padding-end: 0; --background-active: transparent; } .bazis-stepper .bazis-item::before { --width-item-before: 88px; content: ""; position: absolute; z-index: 1; top: 50%; left: 0; transform: translateY(-50%); height: 1px; width: var(--width-item-before); clip-path: none; background: var(--bazis-stepper-background); } .bazis-stepper .bazis-item::after { display: none; } .bazis-stepper .bazis-item:first-child { --padding-start: 0; } .bazis-stepper .bazis-item:first-child::before { display: none; } .bazis-stepper .bazis-item--active::before { background: var(--bazis-color-white); } .bazis-stepper bazis-step { --sign-margin: 0; } .bazis-stepper bazis-step::part(label) { display: none; } } @media (max-width: 400px) { .bazis-stepper { --padding-start: 64px; } .bazis-stepper .bazis-item::before { --width-item-before: 64px; } } .bazis-tab-status { --margin-start: var(--bazis-margin-8x); } .os-Windows .bazis-tab-status { position: relative; top: 3px; } .bazis-tab-status__item { --padding-start: calc(var(--bazis-multiple-px) * 4); --padding-end: calc(var(--bazis-multiple-px) * 4); --padding-top: calc(var(--bazis-margin-2x) - 1px); --padding-bottom: calc(var(--bazis-margin-2x) - 1px); --color: var(--bazis-color-action); --background-active: var(--bazis-color-action); --color-active: var(--bazis-color-action-contrast); --background-hover: var(--bazis-background-medium); --color-hover: var(--bazis-color-action); --background-disabled: var(--bazis-background-dark); --color-disabled: var(--bazis-text-color-secondary); --background-active-disabled: var(--bazis-text-color-secondary); --color-active-disabled: var(--bazis-text-color-contrast); --border-radius: 16px; --border-style: solid; --border-width: 1px; --border-color: transparent; --border-color-active: var(--background-active); --border-color-hover: var(--bazis-border-color); --border-color-disabled: var(--background-disabled); --border-color-active-disabled: var(--background-active-disabled); line-height: 16px; } .bazis-tab-status__item bazis-button { --height-xs: 16px; --padding-top: 0; --padding-bottom: 0; --color: var(--bazis-color-action); font-size: 10px; letter-spacing: 1px; } .bazis-tab-status__item bazis-button.bazis-btn_has-icon-only { --padding-start: 0; --padding-end: 0; } .bazis-tab-status__item--active bazis-button { --color: var(--bazis-color-action-contrast); } .bazis-tab-status__item:hover bazis-button { --color: var(--bazis-color-action); } .bazis-tab-status app-menu-input-date.bazis-tab-status__item { display: flex; align-items: center; line-height: 11px; } .bazis-tab-status app-menu-input-date.bazis-tab-status__item > * { border-bottom: 0; } @media (max-width: 1024px) { .bazis-tab-status { --margin-start: 0; --margin-bottom: var(--bazis-margin-6x); } } bazis-tabs { --padding-bottom: 8px; --color: var(--bazis-text-color); --height: 48px; --font-size: 16px; --font-weight: 400; --line-height: 1; --font-weight-selected: 500; --tab-background-selected: transparent; --tab-border-width: 0 0 2px 0; --tab-border-style: solid; --tab-border-color: transparent; --tab-border-color-hover: var(--bazis-text-color); --tab-border-color-selected: var(--bazis-text-color); --tab-margin-end: 24px; } bazis-tabs::part(wrapper) { margin-bottom: calc(-1 * var(--padding-bottom)); } .bazis-tag { --height: 36px; --height-s: calc(var(--height) - var(--bazis-multiple-px)); --height-l: calc(var(--height) + var(--bazis-multiple-px) * 2); --background: var(--bazis-background-medium); --border-radius: var(--bazis-border-radius); --padding-start: 16px; --padding-end: 12px; --color: var(--bazis-text-color); } .bazis-block_accent .bazis-tag { --background: var(--bazis-color-white); } .bazis-tag_large { font-size: 14px; letter-spacing: 0.5px; } .sl-filter .bazis-tag { --height: 24px; --border-radius: 12px; --padding-start: var(--bazis-padding); margin-bottom: var(--bazis-margin); margin-right: 12px; line-height: 2; } .sl-filter .bazis-tag > span { max-width: 350px; } .sl-filter .bazis-tag > span.sl-text_minor { color: rgba(var(--bazis-color-contrast-rgb), 0.7); } .sl-filter .bazis-tag button { padding: 0; margin-left: 8px; } .bazis-tile { --padding-start: 20px; --padding-end: 20px; --height-header: 48px; } .bazis-tile:not(.bazis-tile_full) { max-height: 282px; } .bazis-tile__header { --margin-start: -20px; --margin-end: -20px; --padding-start: 20px; --padding-end: 20px; --padding-top: 20px; --padding-bottom: 8px; } .bazis-tile__content { --padding-top: 8px; --padding-bottom: 20px; --padding-end: 20px; --margin-end: -19px; } .bazis-tile bazis-tabs { width: 100%; border-bottom: 1px solid var(--bazis-border-color); } .bazis-tile--active .bazis-tile__header { box-shadow: 0px 15px 15px -10px rgba(var(--bazis-shadow-color-rgb), 0.4); } bazis-timepicker { --width: 360px; --height: 176px; --padding-start: 16px; --padding-end: 16px; --padding-top: 16px; --padding-bottom: 16px; --background: var(--bazis-color-white); --background-active: var(--bazis-color-action); --box-shadow: 0px 4px 24px -10px rgba(0, 0, 0, 0.1); --border-radius: var(--bazis-border-radius); --border-width: 1px; --border-style: solid; --border-color: var(--bazis-background-medium); --position-bottom: 20px; --color: var(--bazis-text-color); --color-active: var(--bazis-color-white); --font-size: 12px; --font-weight: 500; --line-height: 16px; --item-height: 16px; --item-padding-start: 0; --item-padding-end: 0; --item-padding-top: 8px; --item-padding-bottom: 8px; --item-active-padding-start: 0; --item-active-padding-end: 0; --item-active-padding-top: 16px; --item-active-padding-bottom: 16px; --hightlight-border-radius: var(--bazis-border-radius); --item-muted-background: rgba(var(--bazis-color-white-rgb), 0.7); } bazis-toast { --background: var(--bazis-background); --border-radius: var(--bazis-border-radius); --box-shadow: 0px 10px 20px -10px rgba(144, 150, 162, 0.2); --max-width: 416px; --width: 416px; --max-height: calc(100vh - var(--bazis-padding) * 3); } bazis-toast::part(toast) { margin-bottom: var(--bazis-padding); } bazis-toggle { --background: var(--bazis-background); --background-checked: var(--bazis-color-action); --border-radius: 12px; --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color-dark); --handle-background: var(--bazis-border-color-dark); --handle-background-checked: var(--bazis-background); --handle-border-radius: 5px; --handle-height: 10px; --handle-max-height: 10px; --handle-width: 10px; --handle-spacing: 3px; --handle-transition: transform 300ms, width 120ms ease-in-out 80ms, left 110ms ease-in-out 80ms, right 110ms ease-in-out 80ms; width: 29px; height: 16px; contain: strict; overflow: hidden; } bazis-toggle::part(track) { transform: translate3d(0, 0, 0); transition: background-color 300ms; } bazis-toggle::part(track)::before { transform: scale3d(0, 0, 0); } bazis-toggle::part(handle) { will-change: transform; } .bazis-toggle--disabled { opacity: 0.5; } .sl-toolbar_table { --padding-top: var(--bazis-padding-7x); --margin-bottom: var(--bazis-margin-5x); flex-wrap: wrap; } .sl-toolbar_table::part(end) { margin-top: var(--bazis-margin-5x); } .sl-toolbar_table [slot=end] { justify-content: flex-end; } .sl-toolbar_table .bazis-btn-group { margin: 0 32px 0 16px; } .sl-toolbar_table .bazis-btn-group:last-child { margin-right: 0; } .sl-toolbar_table .bazis-control:not(app-sort .bazis-control) { --height: 30px; --margin-bottom: 0; } .sl-form .sl-toolbar_table .bazis-control:not(app-sort .bazis-control) { --margin-bottom: 0; } .sl-toolbar_table .bazis-control:not(app-sort .bazis-control) bazis-button { --height: 30px; } .sl-toolbar_table app-input-default.sl-search-control { width: calc(var(--max-width-container) * 0.65); } .sl-toolbar_table app-sort .bazis-control { --height: 32px; } .sl-form .sl-toolbar_table { --margin-top: var(--bazis-margin); --padding-top: 14px; --padding-bottom: 12px; } @media (max-width: 1024px) { .sl-toolbar_table::part(start), .sl-toolbar_table::part(end) { width: 100%; flex-shrink: 0; } } @media (max-width: 576px) { .sl-toolbar_table app-sort { width: 100%; } .sl-toolbar_table app-sort .bazis-control { max-width: 100%; } } .sl-toolbar_table-header { --margin-top: -4px; --padding-bottom: 16px; } .sl-toolbar_section { --margin-bottom: var(--bazis-margin-4x); } @media (max-width: 1024px) { .sl-toolbar_section { flex-wrap: wrap; } .sl-toolbar_section::part(start), .sl-toolbar_section::part(end) { width: 100%; } .sl-toolbar_section::part(start) { margin-bottom: var(--margin-bottom); } } .sl-toolbar_contacts { --margin-bottom: var(--bazis-margin); --bazis-line-height-p-major: 36px; } .sl-toolbar_details .bh-line-elements { --margin-end: 4px; } .sl-toolbar_details .bh-line-elements bazis-button bazis-icon, .sl-toolbar_details .bh-line-elements .bazis-dropdown bazis-button.bazis-dropdown__trigger bazis-icon { --bazis-icon-s-size: 20px; font-size: 20px; } @media (max-width: 1024px) { .sl-toolbar_table-header { --margin-top: 0; --padding-top: 4px; --padding-bottom: 4px; --padding-start: 12px; --padding-end: 4px; --border-width: 1px 1px 0 1px; --border-style: solid; --border-color: var(--bazis-border-color); } } bazis-toolbar + .bazis-list_short-info { --margin-bottom-list: var(--bazis-margin-4x); } bazis-toolbar app-select .bazis-control, bazis-toolbar app-sort .bazis-control, bazis-toolbar app-select-date .sl-select-date-control { --border-width: 0; --background: var(--bazis-color-info-tint); --font-size: 14px; --color: var(--bazis-link-color); } bazis-toolbar app-select .bazis-control .bazis-control__field-group__end button, bazis-toolbar app-sort .bazis-control .bazis-control__field-group__end button, bazis-toolbar app-select-date .sl-select-date-control .bazis-control__field-group__end button { border: none; } bazis-toolbar app-select .bazis-control .bazis-control__field-group bazis-icon, bazis-toolbar app-sort .bazis-control .bazis-control__field-group bazis-icon, bazis-toolbar app-select-date .sl-select-date-control .bazis-control__field-group bazis-icon { color: var(--color); } bazis-toolbar .bh-margin-start { --bazis-margin: 16px; } bazis-toolbar app-select .bazis-control, bazis-toolbar app-sort .bazis-control { max-width: 220px; } bazis-toolbar .bazis-select { --background: var(--bazis-color-info-tint); } @media (max-width: 1024px) { bazis-toolbar app-select .bazis-control .bazis-control__field-group__end:not(.sl-toolbar_searchable .bazis-control__field-group__end) { display: none; } } bazis-tooltip { --padding-start: calc(var(--bazis-multiple-px) * 3); --padding-end: calc(var(--bazis-multiple-px) * 3); --padding-top: calc(var(--bazis-multiple-px) * 3); --padding-bottom: calc(var(--bazis-multiple-px) * 3); --border-radius: var(--bazis-border-radius); --min-height: 40px; --min-width: 100px; --max-width: 312px; --font-size: 13px; --font-weight: 400; --line-height: 1; --height-arrow: 4px; --width-arrow: 12px; } bazis-tooltip:not(.bazis-tooltip_light) { --background: var(--bazis-text-color); --color: var(--bazis-text-color-contrast); } @media only screen and (-webkit-min-device-pixel-ratio: 2) { bazis-tooltip { --line-height: 16px; } } bazis-tooltip.bazis-tooltip_light { --max-width: 405px; --max-height: 380px; --box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.1); --border-width: 1px; --border-style: solid; --border-color: var(--bazis-background-medium); --height-arrow: 8px; --width-arrow: 24px; overflow: auto; } bazis-totop { --bottom: 84px; --margin-end: 40px; } bazis-totop::part(button) { --height-large: 56px; --border-radius: 50%; width: 56px; margin-top: -28px; } bazis-totop::part(icon) { margin-right: -4px; margin-left: -4px; font-size: 24px; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { bazis-totop::part(icon) { margin-left: unset; margin-right: unset; margin-inline-start: -4px; margin-inline-end: -4px; } } @media (max-width: 576px) { bazis-totop { --bottom: 44px; --margin-end: var(--bazis-margin-4x); } bazis-totop::part(button) { --height-large: 44px; width: 44px; margin-top: -22px; } } bazis-trip-line { --margin-top: 6px; --margin-bottom: 6px; --border-width: 1px; --border-style: dashed; --color: var(--bazis-text-color-secondary); --size-point: 8px; } .bazis-vehicle-number { --border-width: 1px; --border-style: solid; --border-color: var(--bazis-text-color); --border-radius: var(--bazis-border-radius); --background: var(--bazis-background-accent); --box-shadow: 0px 0.272727px 1.63636px rgba(0, 0, 0, 0.2); --color: var(--bazis-text-color); outline: 1px solid var(--bazis-color-white); } .bazis-vehicle-number--disabled { --border-color: var(--bazis-border-color); --background: var(--bazis-background-medium); --color: var(--bazis-text-color-secondary); } .bazis-vehicle-number_rus { --height: 24px; } .bazis-vehicle-number_rus .bazis-vehicle-number__part_0 { --margin-start: 6px; --margin-end: 2px; --font-size: 19px; --line-height: 12px; width: 11px; } .bazis-vehicle-number_rus .bazis-vehicle-number__part_1 { --margin-end: 0x; --font-size: 22px; --line-height: 12px; letter-spacing: 1px; width: 37px; } .bazis-vehicle-number_rus .bazis-vehicle-number__part_2 { --margin-end: 0; --font-size: 19px; --line-height: 12px; letter-spacing: 3px; width: 24px; } .bazis-vehicle-number_rus .bazis-vehicle-number__part_3 { --margin-end: 2px; --margin-start: 2px; --font-size: 11px; --line-height: 20px; position: relative; width: 20px; height: 100%; letter-spacing: 1.5px; padding-left: 2px; } .bazis-vehicle-number_rus .bazis-vehicle-number__part_3::before { position: absolute; top: 1px; left: -3px; display: block; content: ""; height: 20px; width: 1px; background: var(--color); } .bazis-vehicle-number_rus .bazis-vehicle-number__part_3::after { position: absolute; left: 0px; right: 0px; bottom: 2px; content: "RUS"; background: url("/assets/images/flag-ru.svg") no-repeat 100% 50%; background-size: 7px 5px; font-family: "PT Sans Caption", sans-serif; font-weight: 700; font-size: 4.91px; line-height: 6.35px; letter-spacing: 0; color: var(--bazis-text-color); } @media only screen and (-webkit-min-device-pixel-ratio: 2) { .bazis-vehicle-number_rus .bazis-vehicle-number__part_0 { --line-height: 10px; } .bazis-vehicle-number_rus .bazis-vehicle-number__part_1 { --line-height: 12px; } .bazis-vehicle-number_rus .bazis-vehicle-number__part_2 { --line-height: 10px; } } .bazis-vehicle-number_rus .bazis-vehicle-number__noparts { margin: 0 10px; font-family: "PT Sans Caption", sans-serif; font-size: 6px; line-height: 22px; white-space: nowrap; letter-spacing: 0.05em; text-transform: uppercase; } .bazis-vehicle-number_rus.bazis-vehicle-number--disabled .bazis-vehicle-number__part_3::before { background: var(--bazis-border-color); } .bazis-vehicle-number_rus.bazis-vehicle-number--disabled .bazis-vehicle-number__part_3::after { background-image: url("/assets/images/flag-ru-grey.svg"); } /* Base Components of alphabet */ .sl-card-balance { position: relative; border-radius: 5px; background: var(--bazis-color-base); } .sl-card-balance img { display: block; } .sl-card-balance bazis-icon { position: absolute; right: 10px; bottom: 8px; color: var(--bazis-color-white); } .sl-card-balance__title { position: absolute; top: 5px; left: 25px; font-size: 8px; line-height: 16px; letter-spacing: 0.5px; text-transform: uppercase; color: var(--bazis-background-dark); } .sl-agreement { margin-right: var(--bazis-margin-8x); text-align: right; color: var(--bazis-text-color-secondary); } @media (max-width: 1024px) { .sl-agreement { max-width: 290px; } } @media (max-width: 576px) { .sl-agreement { margin: 16px auto 0; text-align: center; } } .sl-card-mobile { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --background: initial; --color: inherit; --background-hover: var(--background); --border-color-hover: var(--border-color); --box-shadow-hover: var(--box-shadow); --background-header: initial; --background-body: initial; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); background: var(--background); color: var(--color); } .sl-card-mobile__header, .sl-card-mobile__body { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); } .sl-card-mobile__header { background: var(--background-header); } .sl-card-mobile__header bazis-toolbar [slot=start] { flex-direction: column; padding-top: 6px; } .sl-card-mobile__header bazis-status { display: inline-block; margin-top: var(--bazis-margin-2x); } .sl-card-mobile__body { background: var(--background-body); } .sl-card-mobile_hoverable:hover { background: var(--background-hover); border-color: var(--border-color-hover); box-shadow: var(--box-shadow-hover); } .sl-card-mobile { --padding-top: var(--bazis-margin-2x); --border-width: 1px 1px 0; --border-style: solid; --border-color: var(--bazis-border-color); --border-color-hover: var(--bazis-border-color-dark); --background: var(--bazis-background-medium); --background-header: var(--bazis-color-white); --background-body: var(--bazis-color-white); } .sl-card-mobile__header { --padding-top: 4px; --padding-bottom: 12px; --padding-start: 12px; --padding-end: 4px; --border-width: 1px 0 0; --border-style: solid; --border-color: var(--bazis-border-color); } .sl-card-mobile__body { --padding-top: 16px; --padding-bottom: 16px; --padding-start: 12px; --padding-end: 12px; } .sl-card-mobile__selection { border-bottom: 1px solid var(--border-color); padding: 10px 4px 10px 12px; margin: 0 -4px 0 -12px; } .sl-card-mobile--expanded .sl-card-mobile__header { --border-width: 1px 0; } .sl-contacts-group .sl-card-mobile { --padding-top: 0; border-top: 0; } .sl-contacts-group { margin-bottom: var(--bazis-margin-8x); } .sl-contacts-group:last-child { margin-bottom: 0; } .sl-contacts-group__header { display: flex; align-items: center; margin-bottom: var(--bazis-margin-4x); font-size: 12px; font-weight: 700; line-height: 16px; letter-spacing: 1px; text-transform: uppercase; } .sl-contacts-group__header bazis-button { margin-right: var(--bazis-margin-3x); } .sl-contacts-group__header bazis-button bazis-icon[slot=icon-only] { margin-left: -6px; margin-right: -6px; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .sl-contacts-group__header bazis-button bazis-icon[slot=icon-only] { margin-left: unset; margin-right: unset; margin-inline-start: -6px; margin-inline-end: -6px; } } .sl-e-sign { display: block; flex-shrink: 0; width: 42px; height: 42px; margin-right: 30px; background: var(--bazis-color-base, var(--bazis-text-color-secondary)); border: 2px solid var(--bazis-color-contrast, var(--bazis-color-white)); border-radius: 50%; box-shadow: 0 0 0 6px rgba(var(--bazis-color-base-rgb, var(--bazis-text-color-secondary-rgb)), 0.2); text-align: center; line-height: 38px; } .sl-e-sign bazis-icon { --bazis-icon-s-size: 16px; color: var(--bazis-color-contrast, var(--bazis-color-white)); } .sl-scheduler { --min-width: initial; --width: initial; --max-width: initial; min-width: var(--min-width); width: var(--width); max-width: var(--max-width); } .sl-scheduler { --margin-bottom-list: 12px; --width: 348px; --max-width: 100%; } .sl-scheduler.bazis-list { --padding-top: var(--bazis-multiple-px); --padding-bottom: var(--bazis-multiple-px); } .sl-scheduler.bazis-list .sl-scheduler__day { display: inline-block; width: 20px; font-size: 10px; text-transform: uppercase; } .sl-scheduler.bazis-list .sl-scheduler__day + span { margin-left: calc(var(--bazis-multiple-px) * 3); } .sl-scheduler .bazis-item { --padding-top: 0; --padding-bottom: 0; --margin-bottom: 6px; } @media (max-width: 780px) { .sl-scheduler { --width: 100%; } } @media (max-width: 576px) { .sl-scheduler { --margin-bottom-list: 0; } .sl-scheduler.bazis-list .bazis-item { display: block; } .sl-scheduler.bazis-list .bazis-item > div { display: flex; justify-content: space-between; align-items: center; width: 100%; } .sl-scheduler.bazis-list .bazis-item > span { display: block; text-align: right; } } .sl-section-sign { margin-bottom: 40px; } .sl-section-sign:last-child { margin-bottom: 0; } .sl-section-sign > bazis-icon { float: left; margin-right: var(--bazis-margin-8x); } .sl-section-sign > bazis-icon + * { overflow: hidden; } .bazis-modal__content .sl-section-sign { padding-left: 0; padding-bottom: calc(var(--bazis-multiple-px) * 6); } .bazis-modal__content .sl-section-sign > bazis-icon { float: left; margin-right: calc(var(--bazis-multiple-px) * 5); } .bazis-modal__content .sl-section-sign p { margin-top: 0; margin-bottom: 2px; font-weight: 500; } .bazis-modal__content .sl-section-sign p + bazis-link, .bazis-modal__content .sl-section-sign p + a { font-weight: 400; } @media (max-width: 1024px) { .sl-section-sign { margin-bottom: 24px; } .sl-section-sign > bazis-icon { float: none; margin-right: 0; margin-bottom: var(--bazis-margin-5x); } .sl-section-sign > bazis-icon + * { overflow: initial; } } .sl-tabs-cmp { /** * @prop --background: фон панели вкладок * @prop --padding-start: начальный отступ панели вкладок * @prop --padding-end: конечный отступ панели вкладок * @prop --padding-top: верхний отступ панели вкладок * @prop --padding-bottom: нижний отступ панели вкладок * @prop --border-radius: радиус скругления границы панели вкладок * @prop --border-width: толщина границы панели вкладок * @prop --border-style: начертание границы панели вкладок * @prop --border-color: цвет границы панели вкладок * @prop --height: высота панели вкладок * @prop --box-shadow: тень панели вкладок * @prop --transition: переход состояний вкладки * * * @prop --tab-background: фон вкладки * @prop --tab-background-focused: фон вкладки при фокусе * @prop --tab-background-hover: фон вкладки при наведении * @prop --tab-background-selected: фон выбранной вкладки * @prop --tab-background-disabled: фон отключенной вкладки * * @prop --tab-padding-start: начальный отступ вкладки * @prop --tab-padding-end: конечный отступ вкладки * @prop --tab-padding-top: верхний отступ вкладки * @prop --tab-padding-bottom: нижний отступ вкладки * @prop --tab-margin-start: начальный внешний отступ вкладки * @prop --tab-margin-end: конечный внешний отступ вкладки * @prop --tab-margin-top: верхний внешний отступ вкладки * @prop --tab-margin-bottom: нижний внешний отступ вкладки * * @prop --tab-border-radius: радиус скругления границы вкладки * @prop --tab-border-width: толщина границы вкладки * @prop --tab-border-style: начертание границы вкладки * @prop --tab-border-color: цвет границы вкладки * @prop --tab-border-color-focused: цвет границы вкладки при фокусе * @prop --tab-border-color-hover: цвет границы вкладки при наведении * @prop --tab-border-color-selected: цвет границы выбранной вкладки * @prop --tab-border-color-disabled: цвет границы отключенной вкладки * * @prop --color: цвет текста вкладки * @prop --color-focused: цвет текста вкладки при фокусе * @prop --color-hover: цвет текста вкладки при наведении * @prop --color-selected: цвет текста выбранной вкладки * @prop --color-disabled: цвет текста отключенной вкладки */ --height: initial; --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --tab-border-color-focused: var(--tab-border-color); --tab-border-color-hover: var(--tab-border-color); --tab-border-color-selected: var(--tab-border-color); --tab-border-color-disabled: var(--tab-border-color); --background: initial; --box-shadow: none; --color: inherit; --color-focused: var(--color); --color-hover: var(--color); --color-selected: var(--color); --color-disabled: var(--color); --font-size: initial; display: block; overflow: hidden; } .sl-tabs-cmp .sl-tabs-cmp__wrapper { display: flex; align-items: center; justify-content: flex-start; width: auto; height: var(--height); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); background: var(--background); box-shadow: var(--box-shadow); color: var(--color); text-align: center; -webkit-user-select: none; user-select: none; z-index: 10; overflow-y: auto; } .sl-tabs-cmp .sl-tab-btn { flex-shrink: 0; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; height: 100%; margin-left: var(--tab-margin-start); margin-right: var(--tab-margin-end); margin-top: var(--tab-margin-top); margin-bottom: var(--tab-margin-bottom); padding-left: var(--tab-padding-start); padding-right: var(--tab-padding-end); padding-top: var(--tab-padding-top); padding-bottom: var(--tab-padding-bottom); border-radius: var(--tab-border-radius); border-width: var(--tab-border-width); border-style: var(--tab-border-style); border-color: var(--tab-border-color); background: var(--tab-background); font-family: var(--bazis-font-family, inherit); font-size: var(--font-size); font-weight: 400; line-height: 1; color: var(--color); outline: none; text-align: center; text-decoration: none; text-overflow: ellipsis; text-transform: inherit; white-space: nowrap; -webkit-user-select: none; user-select: none; cursor: pointer; appearance: none; transition: var(--transition); } .sl-tabs-cmp .sl-tab-btn--focused, .sl-tabs-cmp .sl-tab-btn:focus { background: var(--tab-background-focused); border-color: var(--tab-border-color-focused); color: var(--color-focused); } .sl-tabs-cmp .sl-tab-btn:hover { background: var(--tab-background-hover); border-color: var(--tab-border-color-hover); color: var(--color-hover); } .sl-tabs-cmp .sl-tab-btn--selected { background: var(--tab-background-selected); border-color: var(--tab-border-color-selected); color: var(--color-selected); } .sl-tabs-cmp .sl-tab-btn:disabled, .sl-tabs-cmp .sl-tab-btn[disabled], .sl-tabs-cmp .sl-tab-btn--disabled { background: var(--tab-background-disabled); border-color: var(--tab-border-color-disabled); color: var(--color-disabled); cursor: default; pointer-events: none; } .sl-tabs-cmp .sl-tab-btn bazis-icon { font-size: 12px; } .sl-tabs-cmp .sl-tab-btn bazis-icon:first-child { margin-right: 8px; } .sl-tabs-cmp .sl-tab-btn bazis-icon:last-child { margin-left: 8px; } .sl-tabs-cmp .sl-tab-btn bazis-icon:only-child { margin-left: -6px; margin-right: -6px; font-size: 16px; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .sl-tabs-cmp .sl-tab-btn bazis-icon:first-child { margin-right: unset; margin-inline-end: 8px; } .sl-tabs-cmp .sl-tab-btn bazis-icon:last-child { margin-left: unset; margin-inline-start: 8px; } .sl-tabs-cmp .sl-tab-btn bazis-icon:only-child { margin-left: unset; margin-right: unset; margin-inline-start: -6px; margin-inline-end: -6px; } } .sl-tabs-cmp .sl-tab-btn.bh-underconstruction { opacity: 0.5; cursor: not-allowed !important; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .sl-tabs-cmp__wrapper { padding-left: unset; padding-right: unset; padding-inline-start: var(--padding-start); padding-inline-end: var(--padding-end); } .sl-tabs-cmp__wrapper .sl-tab-btn { margin-left: unset; margin-right: unset; margin-inline-start: var(--tab-margin-start); margin-inline-end: var(--tab-margin-end); padding-left: unset; padding-right: unset; padding-inline-start: var(--tab-padding-start); padding-inline-end: var(--tab-padding-end); } } .sl-tabs-cmp.bazis-color .sl-tab-btn { --tab-border-color-focused: var(--bazis-color-shade); --color-selected: var(--bazis-color-contrast); } .sl-tabs-cmp.bazis-color .sl-tab-btn--focused, .sl-tabs-cmp.bazis-color .sl-tab-btn :focus { background: var(--tab-background-focused); } .sl-tabs-cmp.bazis-color .sl-tab-btn--selected { color: var(--bazis-color-contrast); } .sl-tabs-cmp.bazis-color .sl-tabs-cmp__wrapper, .sl-tabs-cmp.bazis-color .sl-tab-btn { background: var(--bazis-color-base); color: rgba(var(--bazis-color-contrast-rgb), 0.7); } .sl-tabs-cmp { --color: var(--bazis-text-color); --height: 48px; --font-size: 16px; } .sl-tabs-cmp .sl-tabs-cmp__wrapper { --padding-bottom: 8px; margin-bottom: calc(-1 * var(--padding-bottom)); } .sl-tabs-cmp .sl-tab-btn { --tab-background-selected: transparent; --tab-border-width: 0 0 2px 0; --tab-border-style: solid; --tab-border-color: transparent; --tab-border-color-selected: var(--bazis-text-color); --tab-margin-end: 24px; } .sl-tabs-cmp .sl-tab-btn--selected { font-weight: 500; } .sl-list_history__title { margin-bottom: var(--bazis-margin-3x); font-size: var(--bazis-font-size-p-minor); line-height: var(--bazis-line-height-p-major); text-transform: uppercase; letter-spacing: 2px; } .rs-paginator__load-more { display: flex; align-items: center; justify-content: center; margin-bottom: calc(var(--bazis-multiple-px) * 8); } .rs-paginator__load-more bazis-button { --color: var(--bazis-color-action); font-size: 18px; letter-spacing: 0; } .rs-paginator__load-more bazis-button bazis-icon[slot=start] { margin-right: 12px; font-size: 24px; } @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) { .rs-paginator__load-more bazis-button bazis-icon[slot=start] { margin-right: unset; margin-inline-end: 12px; } } /* Form Components */ .bazis-checkbox { --border-radius: var(--bazis-border-radius); --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color-dark); --background: transparent; --background-checked: var(--bazis-color-action); --background-disabled: var(--bazis-background-dark); --border-color-checked: var(--bazis-color-action); --border-color-disabled: var(--bazis-border-color-dark); --color: var(--bazis-text-color); --color-disabled: var(--bazis-text-color-secondary); --size: 16px; --disabled-opacity: 0.5; } .bazis-checkbox__label { margin-right: calc(var(--bazis-multiple-px) * 3); } @media only screen and (-webkit-min-device-pixel-ratio: 2) { .bazis-checkbox__label { line-height: 16px; } } .bazis-checkbox__label::before { line-height: 14px; } @media only screen and (-webkit-min-device-pixel-ratio: 2) { .bazis-checkbox__label::before { line-height: 16px; } } .bazis-checkbox__label.sl-label-hidden { margin-right: 0; } .bazis-checkbox:not(.bh-inline-block, .bazis-item) + .bazis-checkbox:not(.bh-inline-block, .bazis-item), .bazis-control__label + .bazis-checkbox:not(.bh-inline-block, .bazis-item) { margin-top: calc(var(--bazis-multiple-px) * 5); } .bazis-control .bazis-checkbox, .bazis-list_control-dd .bazis-checkbox { --background-selected: var(--background); --color-selected: var(--color-checked); --border-radius: var(--bazis-border-radius); border: 0; } .bazis-control .bazis-checkbox .bazis-checkbox__label::before, .bazis-list_control-dd .bazis-checkbox .bazis-checkbox__label::before { margin-left: 0; margin-right: calc(var(--size) / 2); } .bazis-control .bazis-checkbox.bazis-checkbox_right .bazis-checkbox__label::before, .bazis-list_control-dd .bazis-checkbox.bazis-checkbox_right .bazis-checkbox__label::before { margin-right: 0; margin-left: calc(var(--size) / 2); } .bazis-control .bazis-checkbox.bazis-item, .bazis-list_control-dd .bazis-checkbox.bazis-item { border-radius: 0; } .bazis-control .bazis-checkbox.bazis-item--selected .bazis-checkbox__label::before, .bazis-list_control-dd .bazis-checkbox.bazis-item--selected .bazis-checkbox__label::before { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='8' viewBox='0 0 11 8'%3E%3Cpath d='M0 4.17391L0.6875 3.47826L3.78125 6.6087L10.3125 0L11 0.695652L3.78125 8L0 4.17391Z' fill='white' /%3E%3C/svg%3E"); border-color: var(--border-color-checked); background: var(--background-checked); color: var(--checkmark-color); } .bazis-list_vline .bazis-control .bazis-checkbox, .bazis-list_vline_mini .bazis-control .bazis-checkbox { margin-left: var(--bazis-margin-3x); } .bazis-list_vline .bazis-control .bazis-checkbox__label::before, .bazis-list_vline_mini .bazis-control .bazis-checkbox__label::before { margin-right: var(--bazis-margin-3x); } .sl-item--selected_partial .bazis-checkbox__label::before { content: "—"; border-color: var(--border-color-checked); background: var(--background-checked); color: var(--checkmark-color); } .sl-col_selectable .bazis-control .bazis-checkbox__label::before { margin-right: var(--bazis-margin-6x); } @media (max-width: 1024px) { .sl-toolbar_table-header .bazis-list_vline .bazis-control .bazis-checkbox, .sl-toolbar_table-header .bazis-list_vline_mini .bazis-control .bazis-checkbox { margin-left: 0; } } .bazis-radio { --border-radius: 50%; --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color-dark); --border-color-checked: var(--bazis-color-action); --border-width-checked: 4px; --background: transparent; --background-checked: var(--bazis-background); --color: var(--bazis-text-color); --color-disabled: var(--bazis-text-color-secondary); --size: 16px; --disabled-opacity: 0.5; } .bazis-radio .bazis-radio__label { margin-right: var(--bazis-padding); } .bazis-radio .bazis-radio__label.sl-label-hidden { margin-right: 0; } .bazis-radio:not(.bh-inline-block, .bazis-radio_tab, .bazis-list_control-dd .bazis-radio) + .bazis-radio:not(.bh-inline-block, .bazis-radio_tab, .bazis-list_control-dd .bazis-radio), .bazis-control__label + .bazis-radio:not(.bh-inline-block, .bazis-radio_tab) { margin-top: calc(var(--bazis-multiple-px) * 5); } .bazis-control .bazis-radio, .bazis-list_control-dd .bazis-radio { --background-selected: var(--background); --color-selected: var(--color-checked); border: 0; } .bazis-control .bazis-radio .bazis-radio__label, .bazis-list_control-dd .bazis-radio .bazis-radio__label { --border-radius: 50%; } .bazis-control .bazis-radio .bazis-radio__label::before, .bazis-list_control-dd .bazis-radio .bazis-radio__label::before { margin-left: 0; margin-right: calc(var(--size) / 2); } .bazis-control .bazis-radio.bazis-radio_right .bazis-radio__label::before, .bazis-list_control-dd .bazis-radio.bazis-radio_right .bazis-radio__label::before { margin-right: 0; margin-left: calc(var(--size) / 2); } .bazis-control .bazis-radio.bazis-item, .bazis-list_control-dd .bazis-radio.bazis-item { border-radius: 0; } .bazis-control .bazis-radio.bazis-item--selected .bazis-radio__label, .bazis-list_control-dd .bazis-radio.bazis-item--selected .bazis-radio__label { color: var(--color-checked); } .bazis-control .bazis-radio.bazis-item--selected .bazis-radio__label::before, .bazis-list_control-dd .bazis-radio.bazis-item--selected .bazis-radio__label::before { border-color: var(--border-color-checked); border-width: var(--border-width-checked); background: var(--background-checked); } .bazis-radio_tab .bazis-radio__label { height: 148px; background: var(--bazis-background-medium); margin: 0; font-size: 14px; font-weight: 500; } .bazis-radio_tab .bazis-radio__label bazis-icon { margin-bottom: 18px; } .bazis-radio_tab .bazis-radio__label::before { position: absolute; top: 12px; right: 8px; border: none; width: 20px; height: 20px; } .bazis-radio_tab input:checked + .bazis-radio__label::before { background: url("/assets/images/check-circle.svg"); } .bazis-radio_block .bazis-radio__label { margin-top: calc(var(--bazis-multiple-px) * 2); margin-right: 0; border: 1px solid var(--bazis-border-color); border-radius: var(--bazis-border-radius); padding: calc(var(--bazis-multiple-px) * 4) var(--bazis-padding); } .bazis-radio_block input:checked + .bazis-radio__label { border-color: var(--border-color-checked); background: var(--bazis-background-accent); } .bazis-control { --height: 34px; --padding-field-start: var(--bazis-padding); --padding-field-end: var(--bazis-padding); --background: var(--bazis-color-white); --border-radius: var(--bazis-border-radius); --border-width: 1px; --border-color: var(--bazis-border-color-dark); --border-color-hover: var(--bazis-text-color-secondary); --border-color-focus: var(--bazis-color-action); --border-color-active: var(--bazis-color-action); --border-style: solid; --border-style-estimated: dashed; --color: var(--bazis-text-color); --font-size: 13px; --font-size-label: calc(var(--font-size) + 1px); --size-icon: 16px; --background-disabled: var(--bazis-background-medium); } .sl-form .bazis-control { --margin-bottom: var(--bazis-margin-5x); } .sl-form app-input-search > .bazis-control { --margin-bottom: var(--bazis-margin-1x); } .sl-form_oneline .bazis-control, .sl-grid_table bazis-col .bazis-control, .sl-control-no-margin .bazis-control, app-input-map-point .bazis-control, .sl-datetime-control .bazis-control { --margin-bottom: 0; } .bazis-control__units { color: var(--bazis-text-color-secondary); } .sl-grid_accordion .bazis-control__label { --font-size-label: 12px; --color-label: var(--bazis-text-color-secondary); font-weight: 400; line-height: 16px; } .sl-form_oneline .bazis-control__label { line-height: 36px; } .bazis-control__field-group-wrapper .bazis-control__field-group { margin-right: 32px; width: calc(100% - 32px); } .bazis-control__field-group-wrapper bazis-button { --border-radius: 50%; margin-left: 8px; } .bazis-control__field-group > button { --size-icon: 12px; } .bazis-control__field-group__end button { min-width: calc(var(--height) + var(--bazis-multiple-px) * 2); } .bazis-control__field-group__end bazis-button.bazis-btn_clear { --height: 34px; --background-hover: transparent; --background-focused: transparent; --background-activated: transparent; --color-hover: var(--bazis-color-action); --color-focused: var(--bazis-color-action); --color-activated: var(--bazis-color-action); } .bazis-control__field-group__end bazis-button.bazis-btn_clear.bazis-eraser { --padding-end: calc(var(--bazis-multiple-px) * 2); --padding-start: calc(var(--bazis-multiple-px) * 2); } .bazis-control textarea { --padding-field-top: 10px; --padding-field-bottom: 10px; min-height: 64px; } .bazis-control bazis-button input[type=file], .bazis-control .bazis-figure_btn input[type=file] { position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; cursor: pointer; } .bazis-control .bazis-figure { --height: 134px; } .bazis-control .bazis-list_control-dd { --position-top: var(--height); } @media (max-width: 992px) { app-select-search .bazis-control--activated, app-search-filter .bazis-control--activated { --border-radius: 0; --border-width: 1px 0 1px 0; position: fixed; z-index: 1002; left: 0; right: 0; top: 0; } app-select-search .bazis-control--activated .bazis-eraser, app-search-filter .bazis-control--activated .bazis-eraser { display: none; } app-select-search .bazis-control--activated .bazis-control__label, app-search-filter .bazis-control--activated .bazis-control__label { display: none; } app-select-search .bazis-control--activated .bazis-list_control-dd, app-search-filter .bazis-control--activated .bazis-list_control-dd { --max-height: calc(100vh - 36px - 1px); --margin-top-list: 1px; --padding-top-list: 0; --padding-end-list: 20px; --padding-start-list: 20px; --border-radius-list: 0; --border-width: 0 0 1px 0; --border-color: var(--bazis-border-color); --border-style: solid; --padding-end: 0; --padding-start: 0; --padding-top: 24px; --padding-bottom: 20px; height: var(--max-height); } app-select-search .bazis-control--activated .bazis-list_control-dd .bazis-item, app-search-filter .bazis-control--activated .bazis-list_control-dd .bazis-item { --background-hover: var(--background); } app-select-search .bazis-control--activated .bazis-list_control-dd .bazis-item.bazis-radio, app-select-search .bazis-control--activated .bazis-list_control-dd .bazis-item.bazis-checkbox, app-search-filter .bazis-control--activated .bazis-list_control-dd .bazis-item.bazis-radio, app-search-filter .bazis-control--activated .bazis-list_control-dd .bazis-item.bazis-checkbox { border-bottom: 1px solid var(--border-color); } } @media (max-width: 576px) { .sl-form app-input-map-point bazis-col:first-child .bazis-control, app-input-timeinterval bazis-col:first-child .bazis-control { --margin-bottom: var(--bazis-margin-6x); } } .dt-desktop app-input-timeinterval .bazis-control__field-group__end bazis-button:not(.bazis-eraser), .dt-desktop app-input-dateinterval-time .bazis-control__field-group__end bazis-button:not(.bazis-eraser), .dt-desktop app-input-datetime .bazis-control__field-group__end bazis-button:not(.bazis-eraser) { display: none; } .sl-interval-control { display: flex; justify-content: space-between; align-items: flex-start; background: var(--bazis-color-white); box-shadow: 0px 4px 24px -10px rgba(0, 0, 0, 0.1); border-radius: var(--bazis-border-radius); border: 1px solid var(--bazis-background-medium); } .sl-interval-control bazis-timepicker, .sl-interval-control bazis-datepicker { --box-shadow: none; --border-width: 0; } app-timeinterval .sl-interval-control { --width: 418px; --padding-top: 26px; } app-timeinterval .sl-interval-control bazis-timepicker { --padding-top: 0; } app-timeinterval .sl-interval-control p { margin: 0 16px 8px; } .sl-number-buttons-control .bazis-control__field-group { --size-icon: 12px; } .sl-number-buttons-control .bazis-control__field-group bazis-button { --height: 24px; --border-radius: 50%; --padding-start: 11px; --padding-end: 11px; } .sl-number-buttons-control .bazis-control__field-group bazis-button ::slotted(bazis-icon[slot=icon-only]) { font-size: var(--size-icon); } .sl-number-buttons-control__data { margin: 0 calc(var(--bazis-multiple-px) * 3); white-space: nowrap; } .sl-grid_table .sl-number-buttons-control .bazis-control__note { padding-top: 6px; } .sl-range-controls { display: flex; } .sl-range-controls .bazis-control__field-group { --border-width: 1px 0 1px 0; border-radius: 0; } .sl-range-controls .bazis-control__field-group::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; z-index: 1; height: var(--height); width: 1px; background: var(--bazis-border-color); } .sl-range-controls > :first-child .bazis-control__field-group, .sl-range-controls > :first-child.bazis-control__field-group { --border-width: 1px 0 1px 1px; border-radius: var(--border-radius) 0 0 var(--border-radius); } .sl-range-controls > :first-child .bazis-control__field-group::before, .sl-range-controls > :first-child.bazis-control__field-group::before { display: none; } .sl-range-controls > :last-child .bazis-control__field-group, .sl-range-controls > :last-child.bazis-control__field-group { --border-width: 1px 1px 1px 0; border-radius: 0 var(--border-radius) var(--border-radius) 0; } .sl-select-date-control { width: 275px; } .sl-select-date-control .bazis-dropdown__body { --top: calc(var(--height) + 3px); --right: 0; --left: auto; --width: 330px; --padding-start: calc(var(--bazis-multiple-px) * 3); --padding-end: calc(var(--bazis-multiple-px) * 3); --padding-top: calc(var(--bazis-multiple-px) * 3); --padding-bottom: calc(var(--bazis-multiple-px) * 3); --background: var(--bazis-background); --border-width: 1px; --border-color: var(--bazis-background-medium); } .sl-select-date-control .bazis-dropdown__body .sl-grid_form > bazis-row > bazis-col { --bazis-grid-column-padding-start: calc(var(--bazis-multiple-px) * 1.5); --bazis-grid-column-padding-end: calc(var(--bazis-multiple-px) * 1.5); } .sl-select-date-control .bazis-dropdown__body .sl-grid_form > bazis-row > bazis-col:first-child { --bazis-grid-column-padding-start: 0; } .sl-select-date-control .bazis-dropdown__body .sl-grid_form > bazis-row > bazis-col:last-child { --bazis-grid-column-padding-end: 0; } .bazis-select { --padding-start: 12px; --padding-end: 12px; --border-radius: var(--bazis-border-radius); --background: var(--bazis-color-white); } .bazis-select_secondary { --background: var(--bazis-color-info-tint); --padding-end: 0; color: var(--color); } .bazis-select_secondary .bazis-select__trigger { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; border-radius: var(--border-radius); } .bazis-select_secondary .bazis-select__trigger bazis-icon { --size-icon: 20px; flex-shrink: 0; color: var(--color); } .bazis-select_secondary .bazis-select__trigger bazis-icon:first-child { margin-right: 4px; } @media (max-width: 992px) { .bazis-select_secondary { --background: var(--bazis-background-medium); } } .sl-select-text { display: inline-block; margin: 4px 0; } .sl-select-text .sl-select-text__label { margin-right: 8px; font-size: 14px; line-height: 20px; } .sl-select-text .bazis-list_control-dd { top: 16px; left: 0; width: auto; min-width: 140px; } .sl-select-text .bazis-list_control-dd .bazis-checkbox { min-width: 160px; } .sl-select-text .bazis-list_control-dd .bazis-checkbox__label { margin-right: 0; } .bazis-switcher { --color: var(--bazis-text-color); --color-disabled: var(--bazis-text-color-secondary); } .bazis-switcher__label { --font-weight: 700; --font-size: 16px; --line-height: 24px; margin-left: 8px; } th .bazis-switcher__label { --font-weight: 500; --font-size: 13px; --line-height: 20px; --color: var(--bazis-text-color-secondary); } .sl-symbol-control { --border-width: 1px; } .sl-symbol-control .bazis-control__field { text-align: center; } .sl-symbol-control .bazis-control__field-group { margin: 0 8px; width: 36px; } .sl-symbol-control .bazis-control__field-group-wrapper { justify-content: center; } .sl-vehicle-number-control .bazis-control__field { --height: auto; flex-shrink: 0; padding: 0; } .sl-vehicle-number-control .bazis-control__field-group { align-items: flex-end; width: 162px; } .sl-vehicle-number-control input { outline: none; border: none; height: 100%; width: 100%; padding: 0; margin: 0; background: transparent; text-align: center; } .sl-vehicle-number-control input.ng-dirty + .sl-vehicle-number-control__placeholder { opacity: 0; } .sl-vehicle-number-control__placeholder { position: absolute; background: transparent; pointer-events: none; } .sl-vehicle-number-control__placeholder::placeholder { text-align: center; color: var(--bazis-placeholder-color); } .sl-vehicle-number-control_rus { --height: 24px; } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_0 { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_1 { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_2 { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_3 { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --font-size: inherit; --font-weight: inherit; --line-height: initial; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); font-size: var(--font-size); font-weight: var(--font-weight); line-height: var(--line-height); } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_0 { --margin-start: 6px; --margin-end: 0; --margin-bottom: 2px; --font-size: 18px; --line-height: 15px; width: 17px; } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_1 { --margin-end: 0; --margin-bottom: 0; --font-size: 27px; --height: 32px; --line-height: 17px; width: 60px; } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_1 input { letter-spacing: 4px; } @media only screen and (-webkit-min-device-pixel-ratio: 2) { .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_1 { --margin-bottom: -1px; } } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_2 { --margin-start: 0; --margin-end: 0; --margin-bottom: 2px; --font-size: 19px; --line-height: 15px; width: 24px; } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_2 input { letter-spacing: 3px; } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_3 { --margin-end: 7px; --margin-start: 16px; --margin-bottom: 2px; --font-size: 15px; --line-height: 17px; height: 32px; width: 36px; align-self: flex-start; } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_3::before { content: ""; display: block; width: 1px; position: relative; top: 3px; left: -5px; height: 30px; background: var(--bazis-border-color-dark); } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_3::after { content: "RUS"; position: absolute; left: 3px; right: 3px; bottom: 0; background: url("/assets/images/flag-ru.svg") no-repeat 100% 50%; background-size: 11px 8px; font-family: "PT Sans Caption", sans-serif; font-size: 7.36px; font-weight: 700; line-height: 6.35px; letter-spacing: 0; color: var(--bazis-text-color); } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_3 input { letter-spacing: 3px; margin-bottom: 6px; } @media only screen and (-webkit-min-device-pixel-ratio: 2) { .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_0 { --line-height: 10px; } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_1 { --line-height: 12px; } .sl-vehicle-number-control_rus .sl-vehicle-number-control__part_2 { --line-height: 10px; } } .sl-form .bazis-map-wrapper, .sl-form .sl-map-wrapper_dd { --height: 324px; } .sl-form__footer { display: flex; justify-content: space-between; align-items: center; padding-top: 20px; padding-bottom: 20px; margin-top: 48px; background: var(--bazis-background); border-top: 1px solid var(--bazis-border-color); } .sl-form__footer::after, .sl-form__footer::before { display: none; } .sl-form__footer__right { display: flex; align-items: center; } @media (max-width: 576px) { .sl-form__footer { flex-direction: column-reverse; } .sl-form__footer .bh-line-elements { display: block; width: 100%; margin-top: var(--bazis-margin-4x); } .sl-form__footer .bh-line-elements:last-child { margin-top: 0; } .sl-form__footer_finish { flex-direction: column; } .sl-form__footer__right { display: flex; flex-direction: column-reverse; width: 100%; margin-top: 16px; } .sl-form__footer__right > * { width: 100%; } .sl-form__footer bazis-button { display: block; } } .sl-form-group { margin-bottom: var(--bazis-margin-2x); } .sl-form-group:last-of-type { margin-bottom: 0; } .sl-form-error { --bazis-font-size-p: 11px; margin-bottom: 24px; font-size: 11px; } app-browse-default { display: block; margin-bottom: var(--bazis-margin-6x); } .sl-block_mini app-browse-default { margin-bottom: 0; } .sl-datetime-control { position: relative; margin-bottom: var(--bazis-margin-6x); } .sl-datetime-control > .bazis-control__note { display: flex; align-items: center; margin-top: 8px; } .sl-datetime-control > .bazis-control__note .bazis-checkbox label::before { margin-left: 0; } .sl-control-no-margin .sl-datetime-control { margin-bottom: 0; } .sl-eraser_outer { position: absolute; z-index: 1; right: 0; top: -8px; } .sl-loader-form { height: calc(100vh - 320px); display: flex; flex-direction: column; align-items: center; justify-content: center; } .sl-options-content { margin-top: 20px; max-height: 210px; overflow: auto; } .bazis-dropdown__body .sl-options-content { margin-top: 0; } /* Table Components */ th { --padding-start: 8px; --padding-top: 8px; --padding-end: 8px; --padding-bottom: 8px; --font-size: 13px; --font-weight: 500; --line-height: 20px; text-align: left; } .sl-table_mini th { --padding-top: 2px; --padding-bottom: 2px; --font-size: 10px; --line-height: 12px; text-transform: uppercase; min-width: 66px; } .sl-table_mini th:last-child { --padding-end: 8px; text-align: left; } thead th, th.sl-thead-th { --background: var(--bazis-background-medium); --color: var(--bazis-text-color-secondary); } thead tr.sl-th_no-padding th, thead th.sl-th_no-padding { --padding-bottom: 0; } thead tr.sl-th_no-padding + tr th { --padding-top: 0; } tbody th { --background: var(--bazis-background-accent); --color: var(--bazis-text-color); --border-width: 0 0 1px 0; --border-style: solid; --border-color: var(--bazis-background-dark); } tbody th.sl-thead-th { --padding-top: 16px; --padding-bottom: 16px; --border-color: var(--bazis-background-medium); text-align: center; vertical-align: middle; } td { --padding-start: 8px; --padding-top: 16px; --padding-end: 8px; --padding-bottom: 16px; --border-style: solid; --border-color: var(--bazis-border-color); --border-width: 0 0 1px 0; --line-height: 20px; } tbody td .bazis-dropdown__trigger { --background: var(--bazis-color-white); --color: var(--bazis-placeholder-color); } tbody td .bazis-dropdown__body { --top: 36px; } tbody td .bazis-dropdown .bazis-list_control-dd { --margin-start-list: 0; --margin-end-list: 0; --margin-top-list: 0; --margin-bottom-list: 0; width: var(--width); } tbody td bazis-icon { --bazis-icon-s-size: 16px; color: var(--bazis-placeholder-color); } td:last-child { --padding-end: var(--bazis-padding); } td.sl-table__cell-btns { --padding-top: 8px; } td .sl-tr-collapsed { cursor: pointer; } td .sl-tr-collapsed bazis-icon { font-size: 8px; color: var(--bazis-text-color); } .sl-td-narrow td { --padding-top: 4px; --padding-bottom: 4px; position: relative; top: -10px; } .sl-td-narrow.bazis-td-no-border td { --padding-top: 0; --padding-bottom: 4px; } .sl-tr--active td { --background: var(--bazis-background-accent); } .bazis-block_accent thead th, .bazis-block_accent th.sl-thead-th { --background: rgba(var(--bazis-background-rgb), 0.7); } .bazis-block_accent tbody th { --background: var(--bazis-background-accent); --border-color: var(--bazis-color-white); } .bazis-block_accent tbody th.sl-thead-th { --border-color: rgba(var(--bazis-background-rgb), 0.7); } .bazis-block_accent td { --border-color: var(--bazis-color-white); } table { --margin-bottom: calc(var(--bazis-multiple-px) * 6); } .sl-form table .bazis-control, table .bazis-control { --margin-bottom: 0; } table .bazis-checkbox__label::before, table .bazis-radio__label::before { margin-left: 0; margin-right: 0; } .sl-form table th, .sl-form table td { --padding-start: 24px; --padding-end: 0; } .sl-form table td:last-child, .sl-form table thead th:last-child { --padding-end: 8px; } table .sl-dropdown_action bazis-button.bazis-dropdown__trigger { --color-hover: var(--bazis-color-action); } table .sl-dropdown_action bazis-button.bazis-dropdown__trigger bazis-icon { color: currentColor; } table .sl-dropdown_action:hover bazis-button.bazis-dropdown__trigger { --color: var(--color-hover); } table .sl-tooltip_dropdown { --box-shadow: none; padding: 0; } table .sl-tooltip_dropdown .bazis-list_control-dd { --margin-top-list: 0; position: static; } .sl-table_schedule { --margin-top: 13px; } .sl-table_schedule td { --padding-start: 12px; --padding-end: 12px; min-width: 218px; } .sl-table_schedule td:first-child { --padding-start: 0; min-width: 240px; } .sl-table_schedule td.sl-table__cell_action { --padding-end: 0; min-width: 0; } .sl-table_schedule td .bazis-control { max-width: 226px; white-space: nowrap; } .sl-table_hoverable tbody tr:hover td { background: var(--bazis-background-accent); } .sl-table_clear { --margin-bottom: 0; } .sl-table_clear td { --padding-top: 8px; --padding-bottom: 8px; --border-width: 0; } .sl-table_clear td:first-child { --padding-start: 0; } .sl-table_clear td:last-child { --padding-end: 0; } bazis-grid.sl-grid_table { --bazis-grid-columns: 24; margin-bottom: calc(var(--bazis-multiple-px) * 10); } bazis-grid.sl-grid_table > bazis-row, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row { border-bottom: 1px solid var(--bazis-border-color); } bazis-grid.sl-grid_table > bazis-row > bazis-col, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row > bazis-col { --bazis-grid-column-padding-start: 12px; --bazis-grid-column-padding-end: 12px; --bazis-grid-column-padding-top: 16px; --bazis-grid-column-padding-bottom: 16px; line-height: 19px; } bazis-grid.sl-grid_table > bazis-row > bazis-col.sl-col_th, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row > bazis-col.sl-col_th { --bazis-grid-column-padding-top: 7px; --bazis-grid-column-padding-bottom: 7px; background: var(--bazis-background-medium); font-size: 13px; font-weight: 500; text-align: left; color: var(--bazis-text-color-secondary); } bazis-grid.sl-grid_table > bazis-row > bazis-col.sl-col_th.sl-col_selectable, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row > bazis-col.sl-col_th.sl-col_selectable { --bazis-grid-column-padding-start: 52px; } bazis-grid.sl-grid_table > bazis-row > bazis-col.sl-col_no-padding-end, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row > bazis-col.sl-col_no-padding-end { --bazis-grid-column-padding-end: 0; } bazis-grid.sl-grid_table > bazis-row > bazis-col.sl-table__cell-btns, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row > bazis-col.sl-table__cell-btns { --bazis-grid-column-padding-top: 7px; } bazis-grid.sl-grid_table > bazis-row.sl-row_thead, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_thead { border-bottom: 0; } bazis-grid.sl-grid_table > bazis-row.sl-row_thead.sl-th_no-padding > bazis-col, bazis-grid.sl-grid_table > bazis-row.sl-row_thead > bazis-col.sl-th_no-padding, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_thead.sl-th_no-padding > bazis-col, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_thead > bazis-col.sl-th_no-padding { --bazis-grid-column-padding-bottom: 0; } bazis-grid.sl-grid_table > bazis-row.sl-row_thead.sl-th_no-padding + bazis-grid.sl-grid_table > bazis-row.sl-row_thead > bazis-col, bazis-grid.sl-grid_table > bazis-row.sl-row_thead.sl-th_no-padding + bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_thead > bazis-col, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_thead.sl-th_no-padding + bazis-grid.sl-grid_table > bazis-row.sl-row_thead > bazis-col, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_thead.sl-th_no-padding + bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_thead > bazis-col { --bazis-grid-column-padding-top: 0; } bazis-grid.sl-grid_table > bazis-row.bazis-td-no-border, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.bazis-td-no-border { border-width: 0; } bazis-grid.sl-grid_table > bazis-row.sl-row_tbody, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_tbody { align-items: flex-start; } bazis-grid.sl-grid_table > bazis-row.sl-row_tbody:hover, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_tbody:hover { background: var(--bazis-background-accent); } bazis-grid.sl-grid_table > bazis-row.sl-row_tbody > bazis-col.sl-col_th, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_tbody > bazis-col.sl-col_th { --bazis-grid-column-padding-top: 16px; --bazis-grid-column-padding-bottom: 16px; border-bottom: 1px solid var(--bazis-background-medium); text-align: center; } .sl-form bazis-grid.sl-grid_table > bazis-row.sl-row_tbody, .sl-form bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_tbody { align-items: flex-start; } .sl-form bazis-grid.sl-grid_table > bazis-row.sl-row_tbody > bazis-col, .sl-form bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_tbody > bazis-col { --bazis-grid-column-padding-start: 6px; --bazis-grid-column-padding-end: 6px; --bazis-grid-column-padding-top: 16px; --bazis-grid-column-padding-bottom: 16px; } .sl-form bazis-grid.sl-grid_table > bazis-row.sl-row_tbody > bazis-col:first-child, .sl-form bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_tbody > bazis-col:first-child { --bazis-grid-column-padding-start: 8px; } .sl-form bazis-grid.sl-grid_table > bazis-row.sl-row_tbody > bazis-col[size="24"], .sl-form bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_tbody > bazis-col[size="24"] { --bazis-grid-column-padding-start: 8px; --bazis-grid-column-padding-end: 8px; } bazis-grid.sl-grid_table > bazis-row.sl-row_tbody.sl-col-top-zero > bazis-col, bazis-grid.sl-grid_table > bazis-row.sl-row_tbody > bazis-col.sl-col-top-zero, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_tbody.sl-col-top-zero > bazis-col, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_tbody > bazis-col.sl-col-top-zero { --bazis-grid-column-padding-top: 0; } bazis-grid.sl-grid_table > bazis-row.sl-row_tbody.sl-col-bottom-zero > bazis-col, bazis-grid.sl-grid_table > bazis-row.sl-row_tbody > bazis-col.sl-col-bottom-zero, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_tbody.sl-col-bottom-zero > bazis-col, bazis-grid.sl-grid_table *:not(bazis-row) bazis-row.sl-row_tbody > bazis-col.sl-col-bottom-zero { --bazis-grid-column-padding-bottom: 0; } bazis-grid.sl-grid_table bazis-grid.sl-grid_table { margin-bottom: 0; } bazis-grid.sl-grid_table bazis-grid.sl-grid_table > bazis-row:first-child > bazis-col, bazis-grid.sl-grid_table bazis-grid.sl-grid_table > * > bazis-row:first-child > bazis-col { --bazis-grid-column-padding-top: 0; } bazis-grid.sl-grid_table bazis-grid.sl-grid_table > bazis-row:last-child, bazis-grid.sl-grid_table bazis-grid.sl-grid_table > * > bazis-row:last-child { border-bottom: 0; } bazis-grid.sl-grid_table bazis-grid.sl-grid_table > bazis-row:last-child > bazis-col, bazis-grid.sl-grid_table bazis-grid.sl-grid_table > * > bazis-row:last-child > bazis-col { --bazis-grid-column-padding-bottom: 0; } bazis-grid.sl-grid_table bazis-grid.sl-grid_table > bazis-row.sl-tr_no-border, bazis-grid.sl-grid_table bazis-grid.sl-grid_table > * > bazis-row.sl-tr_no-border { border-bottom: 0; } bazis-grid.sl-grid_table bazis-grid.sl-grid_table > bazis-row > bazis-col, bazis-grid.sl-grid_table bazis-grid.sl-grid_table > * > bazis-row > bazis-col { --bazis-grid-column-padding-start: 0; --bazis-grid-column-padding-end: 0; } bazis-grid.sl-grid_table .sl-dropdown_action bazis-button.bazis-dropdown__trigger { --color-hover: var(--bazis-color-action); } bazis-grid.sl-grid_table .sl-dropdown_action bazis-button.bazis-dropdown__trigger bazis-icon { color: currentColor; } bazis-grid.sl-grid_table .sl-dropdown_action:hover bazis-button.bazis-dropdown__trigger { --color: var(--color-hover); } bazis-grid.sl-grid_table .bazis-dropdown bazis-vehicle-number + bazis-button.bazis-dropdown__trigger { --background: transparent; --background-hover: transparent; position: relative; top: -4px; } bazis-grid.sl-grid_table .sl-btn-expanded { position: relative; top: -9px; } bazis-grid.sl-grid_table > bazis-row > bazis-col .bazis-dropdown__trigger, bazis-grid.sl-grid_table > * > bazis-row > bazis-col .bazis-dropdown__trigger { --background: var(--bazis-color-white); --color: var(--bazis-placeholder-color); } bazis-grid.sl-grid_table > bazis-row > bazis-col .bazis-dropdown__body, bazis-grid.sl-grid_table > * > bazis-row > bazis-col .bazis-dropdown__body { --top: 36px; } bazis-grid.sl-grid_table > bazis-row > bazis-col .bazis-dropdown_vehicle .bazis-dropdown__trigger, bazis-grid.sl-grid_table > * > bazis-row > bazis-col .bazis-dropdown_vehicle .bazis-dropdown__trigger { --color: var(--bazis-color-base); } bazis-grid.sl-grid_table > bazis-row > bazis-col bazis-button bazis-icon, bazis-grid.sl-grid_table > * > bazis-row > bazis-col bazis-button bazis-icon { --bazis-icon-s-size: 16px; color: var(--bazis-placeholder-color); } bazis-grid.sl-grid_table > bazis-row > bazis-col .sl-tr-collapsed, bazis-grid.sl-grid_table > * > bazis-row > bazis-col .sl-tr-collapsed { cursor: pointer; } bazis-grid.sl-grid_table > bazis-row > bazis-col .sl-tr-collapsed bazis-icon, bazis-grid.sl-grid_table > * > bazis-row > bazis-col .sl-tr-collapsed bazis-icon { font-size: 8px; color: var(--bazis-text-color); } bazis-grid.sl-grid_table > bazis-row > bazis-col bazis-status, bazis-grid.sl-grid_table > * > bazis-row > bazis-col bazis-status { display: block; margin-top: var(--bazis-margin-2x); } bazis-grid.sl-grid_table > bazis-row > bazis-col p:first-child, bazis-grid.sl-grid_table > * > bazis-row > bazis-col p:first-child { margin-top: 0; } .sl-table_twice > thead > tr > th { --background: transparent; --padding-start: 8px; --padding-top: 4px; --padding-end: 8px; --padding-bottom: 4px; } .sl-table_twice > thead > tr > th:first-child { --padding-start: 0; } .sl-table_twice > tbody > tr > td { --background: var(--bazis-background); --padding-start: 16px; --padding-top: 16px; --padding-end: 16px; --padding-bottom: 16px; --border-color: var(--bazis-background-accent); --border-width: 0 0 8px 0; --border-radius: var(--bazis-border-radius); } .sl-table_twice__child { --margin-bottom: 0; } .sl-table_twice__child td { --padding-top: 4px; --padding-bottom: 4px; --border-width: 0; } .sl-table_twice__child td:first-child { --padding-start: 0; } .sl-table_twice__child td:last-child { --padding-end: 0; } .sl-table_twice__child tr:first-child td { --padding-top: 0; } .sl-table_twice__child tr:last-child td { --padding-bottom: 0; } /* Filters Components */ .sl-filter { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); } .sl-filter__base { --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); display: flex; align-items: center; } .sl-filter__base__wrapper { display: flex; width: 100%; } .sl-filter__base__control { width: 100%; } .sl-filter__base__control:first-child .bazis-control::before { display: none; } .sl-filter__base__control .bazis-control__field-group__end button { border-left: none; --size-icon: 24px; } .sl-filter__base > bazis-button { --multiple: 11; --height: 56px; --border-radius: 0 var(--bazis-border-radius) var(--bazis-border-radius) 0; font-size: 16px; text-transform: uppercase; letter-spacing: 1px; flex-shrink: 0; width: 156px; } .sl-filter__additional { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); } @media (max-width: 1024px) { .sl-filter .sl-filter__base, .sl-filter .sl-filter__base .sl-filter__base__wrapper { display: block; } .sl-filter .sl-filter__base > bazis-button { --multiple: 4; --height: 44px; --border-radius: var(--bazis-border-radius); margin-right: 32px; } } .sl-filter { --padding-top: 16px; --padding-bottom: 20px; } .sl-filter__base { --margin-bottom: 16px; background: var(--bazis-background); border-radius: var(--bazis-border-radius); } .sl-filter__additional { --bazis-grid-columns: 15; --padding-top: calc(var(--bazis-multiple-px) * 5 - 5px); } .sl-filter .bazis-list_control-dd-wrapper { --padding-bottom: 0; } @media (max-width: 1024px) { .sl-filter { --padding-top: 0; } .sl-filter__base { --margin-bottom: 0; background: transparent; } } @media (max-width: 576px) { .sl-filter .sl-filter__base + .bh-padding-bottom { --bazis-coef: 0 !important; } .sl-filter .sl-filter__additional { --bazis-grid-columns: 5; --padding-top: 0; --padding-bottom: 20px; } .sl-filter .sl-filter-apply { --height: 44px; display: block; } } @media (max-width: 1024px) { .sl-filter__base .bazis-control { --margin-bottom: 16px; } } @media (min-width: 1024.98px) { .sl-filter__base .bazis-control { --height: 56px; --border-width: 0; --border-radius: 0; --padding-field-start: 20px; --color-label: var(--bazis-text-color-secondary); --font-size-label: 16px; --font-size: 16px; } .sl-filter__base .bazis-control::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; z-index: 1; height: var(--height); width: 1px; background: var(--bazis-border-color); } .sl-filter__base .bazis-control__label { position: absolute; top: 50%; bottom: 8px; transform: translateY(-50%); left: var(--padding-field-start); z-index: 1; margin: 0; pointer-events: none; transition: bottom 0.2s ease-in; } .sl-filter__base .bazis-control__field-group > .bazis-control__field { top: -7px; } .sl-filter__base .bazis-control__field-group .bazis-control__field { font-weight: 500; line-height: 24px; transition: top 0.2s ease-in; } .sl-filter__base .bazis-control--focused .bazis-control__field-group > .bazis-control__field { top: 0; } .sl-filter__base .bazis-control--dirty .bazis-control__label, .sl-filter__base .bazis-control_datetime .bazis-control--focused .bazis-control__label { --font-size-label: 11px; top: auto; bottom: 10px; transform: translateY(0); line-height: 1; font-weight: 400; } .sl-filter__base .bazis-select { --padding-start: 20px; --border-radius: 0; } .sl-filter__base .bazis-select__trigger { height: calc(100% - 14px); } .sl-filter__base .bazis-select .bazis-control__field { --padding-field-start: 0; height: calc(100% - 14px); } .sl-filter__base .bazis-select-native, .sl-filter__base .bazis-select { top: 7px; background: transparent; } .sl-filter__base filter:first-child .bazis-control { --border-radius: var(--bazis-border-radius) 0 0 var(--bazis-border-radius); --padding-field-start: var(--bazis-padding); } .sl-filter__base filter:first-child .bazis-control::before { display: none; } .sl-filter__base filter:first-child .bazis-select { --padding-start: var(--bazis-padding); } .sl-filter__base .bazis-list_control-dd { --position-top: 56px; } } .sl-filter__additional .bazis-control__range .bazis-control__field { --padding-field-end: 0; } .sl-filter__additional .bazis-control__range .bazis-control__field-group__end bazis-button.bazis-btn_clear { --padding-start: 10px; --padding-end: 10px; } /* Trip Components */ .sl-trip-tape .bazis-item { display: flex; align-items: center; justify-content: space-between; } .sl-trip-tape .bazis-item .bazis-status { --margin-bottom: 4px; } .sl-trip-tape .bazis-item > *:first-child { max-width: 180px; width: 100%; } .sl-trip-tape table { --margin-bottom: 0; } .sl-trip-tape table + .bazis-item { --border-width: 0; } .sl-trip-tape .bazis-dl_inline, .sl-trip-tape dl.bazis-dl_dot-leaders, .sl-trip-tape dl.bazis-dl_dot-leaders_nowrap { margin-right: calc(var(--bazis-multiple-px) * 4); } .sl-trip-tape__price { position: relative; padding-right: calc(var(--bazis-multiple-px) * 4); cursor: pointer; } .sl-trip-tape__price bazis-icon { position: absolute; right: 0; top: 50%; margin-top: -4px; font-size: 8px; } .sl-trip-tape__segment { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; --border-radius: initial; --border-width: initial; --border-style: initial; --border-color: initial; --box-shadow: initial; --margin-start: 0; --margin-end: 0; --margin-top: 0; --margin-bottom: 0; --min-width: initial; --width: initial; --max-width: initial; --background: initial; --color: inherit; --background-hover: var(--background); --border-color-hover: var(--border-color); --box-shadow-hover: var(--box-shadow); padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); border-radius: var(--border-radius); border-width: var(--border-width); border-style: var(--border-style); border-color: var(--border-color); box-shadow: var(--box-shadow); margin-left: var(--margin-start); margin-right: var(--margin-end); margin-top: var(--margin-top); margin-bottom: var(--margin-bottom); min-width: var(--min-width); width: var(--width); max-width: var(--max-width); background: var(--background); color: var(--color); --padding-top: 12px; --padding-start: 12px; --padding-end: 12px; --padding-bottom: 12px; --margin-bottom: 0; --border-width: 1px; --border-style: solid; --border-color: transparent; display: flex; align-items: center; cursor: pointer; } .sl-trip-tape__segment:hover { --border-color: var(--bazis-background-dark); } .sl-trip-tape__segment > bazis-button { margin-left: calc(var(--bazis-multiple-px) * 2); } .sl-trip-tape__segment bazis-trip-line { --width: 301px; } .sl-trip-tape__segment.sl-trip-tape__segment--active { --background: var(--bazis-background-dark); } .sl-trip-tape.bazis-block .bazis-map-wrapper, .sl-trip-tape.bazis-block .sl-map-wrapper_dd { --height: 400px; --margin-top: var(--bazis-margin); } .sl-trip-ticket { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; } .sl-trip-ticket__line { margin: 0 30px; width: 100%; text-align: center; } .sl-trip-ticket__line .bazis-list { display: inline-flex; } .sl-trip-ticket__line .bazis-list.bazis-list_short-info > .bazis-item { white-space: nowrap; } .sl-trip-ticket__line bazis-trip-line { --margin-bottom: 24px; --border-width: 2px; --border-style: solid; --size-point: 12px; --color: var(--bazis-border-color); } .sl-trip-ticket__line bazis-trip-line::part(start-point) { box-sizing: border-box; background: transparent; border: 2px solid var(--color); } .sl-trip-ticket__line bazis-trip-line::part(line) { margin: 0 6px; } @media (max-width: 1024px) and (min-width: 992.98px) { .sl-trip-ticket__line { margin: 0 8px; } } .sl-trip__point { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; background: var(--bazis-color-base); border: 2px solid var(--bazis-color-contrast); box-shadow: 0 0 0 2px var(--bazis-color-base); margin-right: 18px; font-size: 11px; font-weight: 500; line-height: 20px; text-align: center; color: var(--bazis-color-contrast); } .bazis-block_accent .sl-trip__point { width: 28px; height: 28px; margin-right: 40px; font-size: 14px; line-height: 24px; } .ua-Safari .bazis-block_accent .sl-trip__point { line-height: 28px; } .sl-trip__start, .sl-trip__end { display: flex; } .sl-trip__start bazis-link bazis-icon, .sl-trip__end bazis-link bazis-icon { --margin-icon: 2px; } .sl-trip__start { position: relative; padding-bottom: calc(var(--bazis-padding) * 2); } .sl-trip__start::before { content: ""; position: absolute; top: 38px; bottom: 12px; left: 10px; width: 2px; background: radial-gradient(circle, var(--bazis-placeholder-color) 0.6px, transparent 0.78px) 0 0, radial-gradient(circle, var(--bazis-placeholder-color) 0, transparent 0.78px) 2px 2px; background-size: 2px 2px; background-repeat: repeat; } .bazis-block_accent .sl-trip__start::before { left: 12px; width: 4px; background: radial-gradient(circle, var(--bazis-placeholder-color) 2px, transparent 0) 0 0, radial-gradient(circle, var(--bazis-placeholder-color) 0px, transparent 0px) 4px 4px; background-size: 4px 8px; } .sl-trip__end { padding-bottom: calc(var(--bazis-multiple-px) * 2); } .sl-trip__comment { padding-left: 67px; margin-top: calc(var(--bazis-multiple-px) * 6); } .bazis-block_accent .sl-trip { margin-left: 2px; } .bazis-block_accent .sl-trip h5 { margin-bottom: 4px; } .bazis-block_accent .sl-trip h5 bazis-link { font-weight: 400; } .bazis-block_accent .sl-trip__start { padding-bottom: calc(var(--bazis-multiple-px) * 7); } @media (max-width: 576px) { .sl-trip__comment { padding-left: 0; } .bazis-block_accent .sl-trip h5 { font-size: 16px; } .bazis-block_accent .sl-trip h5 .bazis-dateplate { display: block; padding-left: 0; } .bazis-block_accent .sl-trip__point { width: 16px; height: 16px; margin-right: 12px; font-size: 0; line-height: 14px; } .bazis-block_accent .sl-trip__point_icon { background: transparent; border: 0; box-shadow: none; } .bazis-block_accent .sl-trip__point_icon bazis-icon { --bazis-icon-xs-size: 20px; color: var(--bazis-color-base); } .bazis-block_accent .sl-trip__start::before { left: 7px; top: 22px; bottom: 5px; width: 2px; background: radial-gradient(circle at 25% 25%, var(--bazis-placeholder-color) 10%, transparent 15%), radial-gradient(circle at 75% 75%, var(--bazis-placeholder-color) 10%, transparent 15%); background-size: 4px 4px; } } /* MAP */ app-map, app-static-map { position: relative; display: block; width: 100%; height: 100%; } .bazis-map-wrapper, .sl-map-wrapper_dd { --height: 336px; } app-input-map-point .bazis-map-wrapper, app-input-map-point .sl-map-wrapper_dd { margin-bottom: 24px; } .bazis-map-wrapper.sl-map-wrapper_small, .sl-map-wrapper_small.sl-map-wrapper_dd { --height: 260px; --margin-bottom: 32px; } .bazis-map-circle { margin-left: var(--bazis-margin-8x); } .sl-map-wrapper_dd { --height: 100px; --width: 332px; --margin-top: var(--bazis-margin-2x); border: 1px solid var(--bazis-border-color); border-radius: var(--bazis-border-radius); } @media (max-width: 1024px) { .bazis-map-circle { margin-left: var(--bazis-margin-6x); } } /* Pages */ .sl-page { --padding-start: 0; --padding-end: 0; --padding-top: 0; --padding-bottom: 0; padding-left: var(--padding-start); padding-right: var(--padding-end); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); } .sl-page { --padding-bottom: 120px; } .sl-page-header { border-bottom: 1px solid var(--bazis-border-color); margin-bottom: 32px; } .sl-page-header.bh-sticky { background: var(--bazis-background); } .sl-page-header--scrolling.bh-sticky { border-bottom: 0; z-index: 160; overflow: hidden; } .sl-page-header--scrolling.bh-sticky h1 { font-size: 20px; font-weight: 400; line-height: normal; } .sl-page-header--scrolling.bh-sticky bazis-toolbar + .bazis-list_short-info { --margin-bottom-list: 12px; } .sl-page-header--scrolling.bh-sticky::after { content: ""; display: block; border-top: 1px solid var(--bazis-border-color); height: 36px; margin: 0 -9999px; } .sl-page-header bazis-toolbar + .bazis-list_short-info { --margin-top-list: var(--bazis-margin-3x); --margin-bottom-list: var(--bazis-margin-3x); } .sl-page-header bazis-toolbar .bh-line-elements { margin-left: 32px; } .sl-page-header bazis-toolbar .bh-line-elements > * { margin-right: 32px; margin-left: var(--margin-end); } .sl-page-header bazis-toolbar .bh-line-elements > *:first-child { margin-left: 0; } .sl-page-header bazis-tabs { position: relative; bottom: -1px; } .sl-page-header bazis-button bazis-icon.bazis-icon-medium { margin-left: -8px; margin-right: -8px; font-size: 20px; } .sl-page-header .bazis-dropdown bazis-button.bazis-dropdown__trigger bazis-icon.bazis-icon-s { --bazis-icon-s-size: 20px; margin-left: -8px; margin-right: -8px; } @media (min-width: 1024.98px) { .sl-page-header bazis-toolbar h1 { margin: 0; } } @media (max-width: 1024px) { .sl-page-header bazis-toolbar + .bazis-list_short-info { --margin-top-list: 0; } } @media (max-width: 576px) { .sl-page { --padding-bottom: 88px; } .sl-page-header bazis-toolbar { flex-wrap: wrap; } .sl-page-header bazis-toolbar::part(start), .sl-page-header bazis-toolbar::part(end) { width: 100%; } .sl-page-header bazis-toolbar .bh-line-elements[slot=end] { justify-content: space-between; } .sl-page-header bazis-toolbar + .bazis-list_short-info { --margin-top-list: var(--bazis-margin-6x); overflow-y: auto; } .sl-page-header bazis-toolbar + .bazis-list_short-info > .bazis-item { white-space: nowrap; } } .sl-entrance-page { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 100%; } .sl-entrance-page .bazis-btn-group { width: 100%; margin-top: 32px; } .sl-entrance-page .bazis-btn-group__item { width: 50%; } .sl-entrance-page .bazis-btn-group__item > bazis-button.bazis-btn_solid { font-size: 13px; } .sl-entrance-page .bazis-block { --margin-top: 32px; --margin-bottom: 32px; --margin-start: auto; --margin-end: auto; --padding-top: 40px; --padding-bottom: 40px; --width: 394px; max-width: 100%; } .sl-entrance-page .bazis-block__header { --margin-bottom: 16px; } .sl-entrance-page .bazis-block_shadow { --box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.1); } @media (max-width: 576px) { .sl-entrance-page .bazis-block { --margin-top: 0; --margin-bottom: 0; --padding-start: 24px; --padding-end: 24px; --width: 100%; --border-color: transparent; --box-shadow: none; } .sl-entrance-page .bazis-block h4 { text-align: left; } .sl-entrance-page .bazis-block bazis-button { --height: 44px; } } .sl-entrance-page .bazis-menu_rounded .bazis-item { --padding-top: calc(var(--bazis-multiple-px) * var(--multiple)); --padding-bottom: calc(var(--bazis-multiple-px) * var(--multiple)); --padding-start: calc(var(--bazis-multiple-px) * var(--multiple)); --padding-end: calc(var(--bazis-multiple-px) * var(--multiple)); --font-weight: 400; cursor: pointer; width: 100%; } .sl-entrance-page .bazis-menu_rounded .bazis-item--active, .sl-entrance-page .bazis-menu_rounded .bazis-item--active bazis-icon { background: var(--background-hover); } .sl-entrance-page .bazis-menu_rounded .bazis-item--disabled { pointer-events: none; } .sl-entrance-page .bazis-control { margin-top: 16px; } .sl-entrance-page .bazis-control__label { letter-spacing: 0.5px; } .sl-entrance-page .bazis-control.sl-symbol-control { margin-bottom: 24px; } .sl-entrance-page app-input-symbol + .error { position: relative; top: -20px; } .sl-entrance-page header, .sl-entrance-page footer { border-style: solid; border-color: var(--bazis-border-color); text-align: center; } .sl-entrance-page header { border-width: 0 0 1px 0; background: #f6f6fe; } .sl-entrance-page header > div { position: relative; height: 56px; display: flex; align-items: center; justify-content: center; } .sl-entrance-page header .sl-header__faq { position: absolute; right: 0; top: 50%; margin-top: -10px; font-weight: 400; font-size: 14px; line-height: 20px; } .sl-entrance-page header .sl-header__back { display: block; margin-top: 24px; text-decoration: none; text-align: left; } .sl-entrance-page header .sl-header__back bazis-icon { padding: 10px; border-radius: 50%; background: var(--bazis-background-medium); margin-right: 16px; } @media (max-width: 992px) { .sl-entrance-page header > div { justify-content: space-between; } .sl-entrance-page header .sl-header__faq { position: static; margin-top: 0; } .sl-entrance-page header + div { min-height: calc(100vh - 169px); } } @media (max-width: 576px) { .sl-entrance-page header { border-width: 0; padding: 0 24px; } .sl-entrance-page header + div { height: auto; } } .sl-entrance-page footer { display: flex; align-items: center; justify-content: center; height: 112px; border-width: 1px 0 0 0; background: rgba(var(--bazis-background-rgb), 0.2); } .sl-entrance-page footer .bazis-list { justify-content: center; } .sl-entrance-page footer .bazis-list.bazis-list_short-info .bazis-item { --font-size: 13px; --color: var(--bazis-text-color-secondary); } .sl-entrance-page footer .bazis-list a { text-decoration: none; color: var(--bazis-text-color-secondary); } .sl-entrance-page footer .bazis-list a:hover { color: var(--bazis-link-color); } @media (max-width: 576px) { .sl-entrance-page footer { background: var(--bazis-background-medium); justify-content: flex-start; padding: 0 24px; text-align: left; } .sl-entrance-page footer .bazis-list { flex-direction: column; align-items: flex-start; } .sl-entrance-page footer .bazis-list.bazis-list_short-info .bazis-item { --padding-start: 0; --margin-bottom: 12px; } .sl-entrance-page footer .bazis-list.bazis-list_short-info .bazis-item:last-child { --margin-bottom: 0; } .sl-entrance-page footer .bazis-list.bazis-list_short-info .bazis-item::before { display: none; } } .sl-entrance-page p:not(.bazis-control p, app-display-error p) { margin-bottom: 32px; } .sl-entrance-page h4, .sl-entrance-page p, .sl-entrance-page bazis-button { width: 100%; } .sl-entrance-page hr { margin: 24px auto 16px; background: var(--bazis-border-color); } .sl-entrance-page fieldset { margin-top: 12px; border: 0; border-top: 1px solid var(--bazis-border-color); } .sl-entrance-page legend { padding: 0 8px; text-align: center; font-size: 12px; line-height: 16px; color: var(--bazis-text-color-secondary); } .sl-entrance-page form .sl-forgotten-pass { font-weight: 400; line-height: 20px; } .sl-entrance-page bazis-sign-status { margin: 0 auto 12px; } .sl-legal-page { max-width: 900px; padding: 40px 0 44px; } .sl-list-page__head { background: var(--bazis-background-medium); } .sl-list-page__head .bazis-breadcrumbs { padding-left: 0; padding-right: 0; } .sl-list-page__title { display: flex; align-items: center; } @media (min-width: 1024.98px) { .sl-list-page__title h1 { margin: 0; } } .sl-list-page__filters { background: var(--bazis-background-medium); } .sl-list-page__body { background: transparent; } @media (max-width: 1024px) { .sl-list-page__title { align-items: flex-start; flex-direction: column; } } .sl-main-page { --header-height: 56px; --bazis-background-medium: #f7f7f7; background-color: var(--bazis-background-medium); } .sl-main-page .sl-section { --margin-top: 0; } .sl-main-page .sl-section__content { --padding-start: 40px; --padding-end: 40px; } @media (max-width: 1024px) { .sl-main-page .sl-section__content { --padding-start: 0; --padding-end: 0; } } @media (max-width: 576px) { .sl-main-page .sl-section__content h2 { --bazis-font-size-h2: 24px; --bazis-line-height-h2: 32px; } } .sl-main-page .sl-section_banner { position: relative; overflow: hidden; } .sl-main-page .sl-section_banner::after { content: ""; display: block; position: absolute; z-index: 1; top: 0; left: 0; right: 0; height: 90px; background: linear-gradient(180deg, #08101c 0%, #08151b 0.01%, rgba(8, 33, 59, 0) 100%); } .sl-main-page .sl-section_banner .bazis-container, .sl-main-page .sl-section_banner .bazis-message-plane { --dark: #091231; --light: #122246; --dark-right: #14264a; --light-right: #1c3259; position: relative; background: radial-gradient(50% 100% at 34% bottom, var(--light), var(--dark), transparent), radial-gradient(50% 655px at bottom right, var(--light-right), var(--dark-right), #091231); } .sl-main-page .sl-section_banner .bazis-container::before, .sl-main-page .sl-section_banner .bazis-message-plane::before { content: ""; position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; right: 100%; background: linear-gradient(15deg, #07151a, #08171e); } .sl-main-page .sl-section_banner .bazis-container::after, .sl-main-page .sl-section_banner .bazis-message-plane::after { content: ""; position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: calc(100% - 1px); background: linear-gradient(-15deg, #072240, #072240 274px, #062443); } .sl-main-page .sl-section_banner video, .sl-main-page .sl-section_banner .sl-video-poster { position: absolute; z-index: 1; bottom: 0; left: calc(50% - 120px); transform: translateX(-50%); right: auto; width: auto; height: 100%; max-width: initial; } .sl-main-page .sl-section_banner .sl-section__content { --padding-top: 144px; --padding-bottom: 150px; --padding-start: 0; position: relative; z-index: 1; max-width: 620px; color: var(--bazis-text-color-contrast); } .sl-main-page .sl-section_banner .sl-section__content h1 { margin-bottom: 40px; padding-bottom: 0; } .sl-main-page .sl-section_banner .sl-section__content h1 + p { font-size: 18px; line-height: 28px; margin-bottom: 40px; opacity: 0.7; } .sl-main-page .sl-section_banner .sl-updates { --margin-bottom-list: 40px; align-items: baseline; } .sl-main-page .sl-section_banner .sl-updates .bazis-item:last-child { display: inline-flex; align-items: baseline; } .sl-main-page .sl-section_banner .sl-updates .bazis-item:last-child::before { position: relative; top: -2px; } .sl-main-page .sl-section_banner .sl-updates .bazis-item:last-child span { position: relative; top: 1px; } .sl-main-page .sl-section_banner bazis-button { --height: 48px; font-size: 16px; } @media (max-width: 1280px) and (min-width: 1025px) { .sl-main-page .sl-section_banner video, .sl-main-page .sl-section_banner .sl-video-poster { left: calc(50% - 250px); } } @media (max-width: 1024px) { .sl-main-page .sl-section_banner video, .sl-main-page .sl-section_banner .sl-video-poster { display: none; } .sl-main-page .sl-section_banner .sl-section__content { --padding-top: 128px; --padding-bottom: 80px; } .sl-main-page .sl-section_banner h1 { font-weight: 400; --bazis-font-size-h1: 45px; --bazis-line-height-h1: 52px; } } @media (max-width: 576px) { .sl-main-page .sl-section_banner .sl-section__content { --padding-top: 104px; --padding-bottom: 72px; width: 100%; } .sl-main-page .sl-section_banner .sl-updates { display: block; } .sl-main-page .sl-section_banner .sl-updates .bazis-item { --padding-top: 8px; --padding-start: 0; } .sl-main-page .sl-section_banner .sl-updates .bazis-item::after { display: none; } .sl-main-page .sl-section_banner .sl-updates .bazis-item span { top: 0; } .sl-main-page .sl-section_banner h1 { margin-top: 0; --bazis-font-size-h1: 28px; --bazis-line-height-h1: 36px; } .sl-main-page .sl-section_banner bazis-button { display: block; } } .sl-main-page .sl-section_about .sl-section__content { --padding-top: 104px; text-align: center; } .sl-main-page .sl-section_about .sl-section__content .bazis-block { --margin-bottom: 0; --padding-top: 40px; --padding-bottom: 40px; --border-radius: 12px; height: 100%; } .sl-main-page .sl-section_about .sl-section__content .bazis-block .bazis-h6 a { color: currentColor; } .sl-main-page .sl-section_about .sl-section__content h2 { padding-bottom: 43px; --bazis-font-size-h2: 40px; } .sl-main-page .sl-section_about .sl-section__content figure { width: 144px; margin: 0 auto 32px; } .sl-main-page .sl-section_about .sl-section__content figure img { border-radius: 50%; } .sl-main-page .sl-section_about .sl-section__content .sl-grid_card { margin: 0 calc(var(--bazis-multiple-px) * -3); } .sl-main-page .sl-section_about .sl-section__content .sl-grid_card > bazis-row > bazis-col { --bazis-grid-column-padding-start: calc(var(--bazis-multiple-px) * 3); --bazis-grid-column-padding-end: calc(var(--bazis-multiple-px) * 3); } @media (max-width: 1024px) { .sl-main-page .sl-section_about .sl-section__content { --padding-top: 88px; text-align: left; } .sl-main-page .sl-section_about .sl-section__content h2 { text-align: center; padding-bottom: 40px; } .sl-main-page .sl-section_about .sl-section__content h2 br { display: none; } .sl-main-page .sl-section_about .sl-section__content .bazis-block { --padding-top: 32px; --padding-bottom: 32px; --padding-start: 32px; --padding-end: 32px; --margin-end: 16px; display: flex; flex-direction: column-reverse; justify-content: space-between; width: 336px; height: auto; } .sl-main-page .sl-section_about .sl-section__content .bazis-block:last-child() { margin-right: 0; } .sl-main-page .sl-section_about .sl-section__content figure { width: 120px; margin: 16px 0 0; align-self: flex-end; } } @media (max-width: 576px) { .sl-main-page .sl-section_about .sl-grid_card { display: block !important; } .sl-main-page .sl-section_about .sl-section__content h2 { text-align: left; --bazis-font-size-h2: 32px; } .sl-main-page .sl-section_about .sl-section__content h2 br { display: block; } .sl-main-page .sl-section_about .sl-section__content .bazis-block { width: 100%; } } .sl-main-page .sl-section_resolve { position: relative; overflow: hidden; background: url("/assets/images/bg-home-gal.svg") no-repeat calc(50% + 453px) -136px; } .sl-main-page .sl-section_resolve .sl-section__content { --padding-top: 179px; --padding-bottom: 260px; position: relative; text-align: center; } .sl-main-page .sl-section_resolve h2 { max-width: 950px; margin: 0 auto 24px; font-weight: 500; } .sl-main-page .sl-section_resolve p { --bazis-font-size-p: 18px; --bazis-line-height-p: 24px; --bazis-p-margin: 0 auto 48px; max-width: 720px; } .sl-main-page .sl-section_resolve bazis-button { --height: 48px; font-size: 16px; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img { position: absolute; object-fit: cover; border-radius: 8px; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__1 { top: 315px; left: 46px; width: 82px; height: 82px; transform: rotate(-30.7deg); } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__2 { top: 135px; left: 40px; width: 50px; height: 50px; transform: rotate(-15.47deg); } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__3 { top: 65px; left: 218px; width: 71px; height: 71px; transform: rotate(-8.58deg); } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__4 { top: 70px; right: 296px; width: 58px; height: 58px; transform: rotate(18.47deg); } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__5 { top: 79px; right: 28px; width: 84px; height: 84px; transform: rotate(27.63deg); } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__6 { top: 290px; right: 67px; width: 53px; height: 53px; transform: rotate(22.62deg); } @media (max-width: 1280px) { .sl-main-page .sl-section_resolve .sl-section__content { position: static; } } @media (max-width: 1024px) { .sl-main-page .sl-section_resolve { background: transparent; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__1 { left: 65px; transform: rotate(20deg); } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__2 { left: 5px; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__3 { top: 45px; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__5 { right: -28px; } .sl-main-page .sl-section_resolve bazis-button { width: 336px; margin-bottom: 12px; margin-right: 0; } .sl-main-page .sl-section_resolve bazis-button:last-child { --border-width: 1px; --border-style: solid; --border-color: var(--bazis-border-color-dark); margin-bottom: 0; } } @media (max-width: 940px) { .sl-main-page .sl-section_resolve h2 br { display: none; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__1 { left: -34px; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__2 { left: -28px; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__5 { right: -47px; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__6 { right: -24px; } } @media (max-width: 660px) { .sl-main-page .sl-section_resolve .sl-section__content { --padding-top: 344px; --padding-bottom: 72px; text-align: left; } .sl-main-page .sl-section_resolve .sl-imgs-wrap { position: absolute; left: 0; right: 0; top: 0; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__1 { top: 208px; left: calc(50% - 44px - 116px); transform: none; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__2 { top: 104px; left: calc(50% - 32px - 156px); transform: none; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__3 { top: 56px; left: calc(50% - 48px + 36px); transform: none; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__4 { top: 184px; left: calc(50% - 24px - 16px); right: auto; transform: none; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__5 { top: 192px; left: calc(50% - 36px + 112px); right: auto; transform: none; } .sl-main-page .sl-section_resolve .sl-imgs-wrap img.sl-imgs__6 { top: 112px; left: calc(50% - 28px + 160px); right: auto; transform: none; } .sl-main-page .sl-section_resolve bazis-button { display: block; width: 100%; } } @media (max-width: 576px) { .sl-main-page .sl-section_resolve { background: var(--bazis-color-white); } } .sl-main-page .sl-section_calculator { --margin-top: -135px; position: relative; } .sl-main-page .sl-section_calculator h2 { --bazis-font-size-h2: 32px; --bazis-line-height-h2: 40px; margin-bottom: 28px; } .sl-main-page .sl-section_calculator figure { margin: 0 auto var(--bazis-margin-8x); width: 320px; } .sl-main-page .sl-section_calculator .sl-section__content .bazis-block { --margin-bottom: 120px; --padding-top: 48px; --padding-start: 48px; --padding-end: 48px; --padding-bottom: 48px; --border-radius: 12px; position: relative; background-color: var(--bazis-color-white); background-image: url("/assets/images/calc-decor-repeat.png"); background-repeat: no-repeat; background-position: calc(100% - 48px) 100%; background-size: 466px 70px; } .sl-main-page .sl-section_calculator .sl-section__content .bazis-block::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; background: url("/assets/images/calc-decor.png") no-repeat calc(100% - 48px) 48px; background-size: 466px auto; } .sl-main-page .sl-section_calculator .sl-section__content .bazis-block__content { width: 57%; } .sl-main-page .sl-section_calculator .sl-section__content .sl-datetime-control { margin: 0; } .sl-main-page .sl-section_calculator .sl-section__content .sl-form p:last-child { margin-top: 48px; } .sl-main-page .sl-section_calculator .sl-section__content .sl-form__submit { --height: 52px; max-width: 265px; width: 100%; font-size: 16px; font-weight: 500; line-height: 24px; letter-spacing: 0.5px; } .sl-main-page .sl-section_calculator .sl-section__content .sl-form__submit.bazis-btn--disabled bazis-icon { transition-property: transform; animation-name: rotate; animation-duration: 1.2s; animation-iteration-count: infinite; animation-timing-function: linear; } .sl-main-page .sl-section_calculator .sl-section__content .sl-form__footer { display: flex; justify-content: space-between; align-items: center; padding: 0; margin: 0; border: 0; gap: 16px; } .sl-main-page .sl-section_calculator .sl-section__content td { --padding-start: 12px; --padding-end: 12px; --padding-top: 12px; --padding-bottom: 24px; } .sl-main-page .sl-section_calculator .sl-section__content td p.bazis-p_major { --bazis-p-margin-major: 6px 0 4px; } .sl-main-page .sl-section_calculator .sl-section__content td label { display: block; margin: 6px 0; font-size: 16px; line-height: 24px; } .sl-main-page .sl-section_calculator .sl-section__content td:first-child { --padding-start: 0; } .sl-main-page .sl-section_calculator .sl-section__content td:last-child { --padding-end: 0; } .sl-main-page .sl-section_calculator .sl-result-price { flex-shrink: 0; text-align: right; } .sl-main-page .sl-section_calculator .sl-result { margin-bottom: 8px; font-size: 20px; line-height: 22px; } .sl-main-page .sl-section_calculator .sl-fieldset { padding: var(--bazis-padding-4x) 0; border-bottom: 1px solid var(--bazis-border-color); } .sl-main-page .sl-section_calculator .sl-fieldset label { display: block; margin-bottom: var(--bazis-margin-3x); font-size: 16px; line-height: 24px; } @media (max-width: 1380px) { .sl-main-page .sl-section_calculator .sl-section__content .bazis-block { background-position: calc(100% - 24px) 100%; } .sl-main-page .sl-section_calculator .sl-section__content .bazis-block::before { background-position: calc(100% - 24px) 48px; } } @media (max-width: 1320px) { .sl-main-page .sl-section_calculator .sl-section__content .bazis-block { background-position: 100% 100%; } .sl-main-page .sl-section_calculator .sl-section__content .bazis-block::before { background-position: 100% 48px; } } @media (max-width: 1235px) { .sl-main-page .sl-section_calculator .sl-section__content .bazis-block { background-size: 40% 150px; } .sl-main-page .sl-section_calculator .sl-section__content .bazis-block::before { background-size: 40% auto; } } @media (max-width: 1154px) and (min-width: 1024.98px) { .sl-main-page .sl-section_calculator .sl-section__content .bazis-block { background-size: 40% 256px; } } @media (max-width: 1024px) { .sl-main-page .sl-section_calculator .sl-section__content .bazis-block { background: var(--bazis-color-white); --padding-start: 88px; --padding-end: 88px; --margin-bottom: 44px; } .sl-main-page .sl-section_calculator .sl-section__content .bazis-block::before { display: none; } .sl-main-page .sl-section_calculator .sl-section__content .bazis-block__content { width: 100%; } .sl-main-page .sl-section_calculator .sl-section__content .sl-form p:last-child { margin-top: var(--bazis-margin-6x); } .sl-main-page .sl-section_calculator h2 { text-align: center; --bazis-h2-margin: 0 0 var(--bazis-margin-2x); } .sl-main-page .sl-section_calculator .bazis-control__label { font-size: 14px; line-height: 20px; font-weight: 400; } } @media (max-width: 768px) { .sl-main-page .sl-section_calculator .sl-section__content .bazis-block { --padding-start: 40px; --padding-end: 40px; } } @media (max-width: 576px) { .sl-main-page .sl-section_calculator { --margin-top: 0; } .sl-main-page .sl-section_calculator h2 { text-align: left; } .sl-main-page .sl-section_calculator .sl-section__content { --padding-top: 72px; } .sl-main-page .sl-section_calculator .sl-section__content .bazis-block { --padding-top: 32px; --padding-bottom: 32px; --padding-start: 20px; --padding-end: 20px; } .sl-main-page .sl-section_calculator .sl-section__content .sl-form__footer { flex-direction: column-reverse; align-items: flex-start; } .sl-main-page .sl-section_calculator .sl-section__content .sl-form__footer bazis-button { display: block; max-width: 100%; } .sl-main-page .sl-section_calculator .sl-result { font-size: 14px; line-height: 20px; } .sl-main-page .sl-section_calculator .sl-result .bh-font-medium { font-size: 20px; line-height: 24px; } .sl-main-page .sl-section_calculator .sl-result-price { margin-bottom: var(--bazis-margin-6x); text-align: left; } } .sl-main-page .sl-section_faq { position: relative; } .sl-main-page .sl-section_faq .sl-section_faq__bg { overflow: hidden; position: absolute; top: 0; left: 0; right: 0; bottom: 0; height: 100%; width: 100%; background: url("/assets/images/home-faq-bg.jpg") 50% 0 no-repeat, url("/assets/images/home-faq-repeat.jpg") 50% 0 repeat-y, var(--bazis-background-dark); background-size: 1440px 813px, 1440px 1px; } .sl-main-page .sl-section_faq .bazis-container_margin { position: relative; } .sl-main-page .sl-section_faq .sl-section__content { --padding-top: 120px; --padding-bottom: 120px; --padding-start: 0; max-width: 650px; } .sl-main-page .sl-section_faq h2 { margin: 0 0 32px; --bazis-font-size-h2: 32px; --bazis-line-height-h2: 40px; } .sl-main-page .sl-section_faq bazis-accordion { --margin-bottom: calc(var(--bazis-multiple-px) * 3); position: relative; } .sl-main-page .sl-section_faq bazis-accordion::part(header) { --border-radius: 12px; --border-width: 0; --padding-start: calc(var(--bazis-multiple-px) * 6); --padding-end: calc(var(--bazis-multiple-px) * 6); --padding-top: calc(var(--bazis-multiple-px) * 6); --padding-bottom: calc(var(--bazis-multiple-px) * 6); --background: var(--bazis-background); position: relative; font-size: 18px; line-height: 24px; } .sl-main-page .sl-section_faq bazis-accordion::part(body) { --border-radius: 0 0 12px 12px; --padding-start: calc(var(--bazis-multiple-px) * 6); --padding-end: calc(var(--bazis-multiple-px) * 6); --padding-bottom: calc(var(--bazis-multiple-px) * 6); --padding-top: 6px; --background: var(--bazis-background); --box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.1); position: absolute; top: calc(100% - 9px); left: 0; right: 0; max-height: 285px; overflow: auto; font-size: 14px; line-height: 20px; } .sl-main-page .sl-section_faq bazis-accordion.bazis-accordion--opened { z-index: 151; border-radius: 12px; background: var(--bazis-background); } .sl-main-page .sl-section_faq bazis-accordion.bazis-accordion--opened::part(header) { --color: var(--bazis-color-primary); z-index: 1; } @media (min-width: 1435px) { .sl-main-page .sl-section_faq .sl-section_faq__bg::before { content: ""; position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; right: calc(100% - (100% - 1360px) / 2 + 40px); background: url("/assets/images/home-faq-repeat-left.jpg") 0 0 repeat-x; background-size: 1px 813px; } .sl-main-page .sl-section_faq .sl-section_faq__bg::after { content: ""; position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: calc(100% - (100% - 1360px) / 2 + 40px); background: url("/assets/images/home-faq-repeat-right.jpg") 0 0 repeat-x; background-size: 1px 813px; } } @media (max-width: 1280px) and (min-width: 1025px) { .sl-main-page .sl-section_faq .sl-section_faq__bg { background: url("/assets/images/home-faq-bg.jpg") 50% 0 no-repeat; background-size: cover; } } @media (max-width: 1024px) { .sl-main-page .sl-section_faq .sl-section_faq__bg { background: var(--bazis-background-medium); } .sl-main-page .sl-section_faq .bazis-container_margin::before, .sl-main-page .sl-section_faq .bazis-container_margin::after { display: none; } .sl-main-page .sl-section_faq .sl-section__content { --padding-top: 88px; --padding-bottom: 88px; max-width: 100%; } } @media (max-width: 576px) { .sl-main-page .sl-section_faq .sl-section__content { --padding-top: 64px; --padding-bottom: 64px; --padding-start: 0; --padding-end: 0; } } @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .sl-profile-page { padding-top: var(--bazis-padding-8x); } @media (max-width: 1024px) { .sl-profile-page .sl-page { --padding-bottom: var(--bazis-padding-6x); } .sl-profile-page .sl-page h1 { margin-top: 0; } .sl-profile-page__footer { margin-top: 72px; padding: var(--bazis-padding-3x) var(--bazis-padding-5x) var(--bazis-padding-5x); box-shadow: 0px -15px 15px -10px rgba(var(--bazis-shadow-color-rgb), 0.4); border-top: 1px solid var(--bazis-border-color); } } .sl-service-page { display: flex; flex-direction: column; align-items: center; justify-content: center; padding-top: 112px; padding-bottom: 120px; max-width: 664px; margin: auto; } .sl-service-page bazis-sign-status { margin-bottom: 32px; } .sl-service-page h1 { padding-bottom: 0; margin-bottom: 16px; text-align: center; } .sl-service-page p { font-size: 16px; line-height: 24px; text-align: center; } .sl-service-page p + bazis-button { margin-top: 32px; } .sl-service-page p a { text-decoration: none; } .sl-service-page .sl-code-status { font-weight: 500; font-size: 250px; line-height: 270px; text-align: center; letter-spacing: 0.02em; color: var(--bazis-background-dark); } @media (max-width: 576px) { .sl-service-page .sl-code-status { font-size: 150px; line-height: 170px; } } .sl-service-page .bazis-menu_rounded { --margin-top-list: 32px; --margin-bottom: 0; --border-width: 1px 0 0; --border-color: var(--bazis-border-color); --border-style: solid; --border-radius: 0; width: 442px; } .sl-service-page .bazis-menu_rounded .bazis-item { --font-size: 16px; --font-weight: 400; } .sl-service-page .bazis-menu_rounded .bazis-item:hover { --border-color: transparent; --border-radius: 4px; } .sl-service-page .bazis-menu_rounded bazis-button { --multiple: 2; } /* Blocks */ .sl-faq__example { --padding-top: 0; --padding-start: 0; --padding-end: 0; --padding-bottom: 0; --background: transparent; --margin-bottom: -24px; --margin-top: 16px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; text-align: left; } .sl-faq__example > div { margin-bottom: 24px; } .sl-faq__example bazis-button { margin-left: -16px; } @media (max-width: 576px) { .sl-faq__example { --padding-top: 16px; --padding-start: 16px; --padding-end: 16px; --padding-bottom: 16px; --background: var(--bazis-background); --margin-bottom: 0; display: block; } .sl-faq__example > div { margin-bottom: 0; } .sl-faq__example bazis-button { --padding-end: 16px !important; margin-top: 24px; } } .sl-block_faq { --padding-top: 36px; } @media (max-width: 576px) { .sl-block_faq { --padding-start: 0; --padding-end: 0; --border-width: 0; } } .sl-notification-block { color: var(--bazis-text-color); } .sl-notification-block__body { max-height: 376px; overflow-y: auto; overflow-x: hidden; } .sl-notification-block header { padding: 12px 0 8px; } .sl-notification-block header bazis-toolbar { --padding-start: calc(var(--bazis-multiple-px) * 4); --padding-end: calc(var(--bazis-multiple-px) * 4); } @media (max-width: 576px) { .sl-notification-block header bazis-toolbar .bh-line-elements { --margin-end: 12px; } } .sl-notification-block hr { --margin-top: 0; --margin-bottom: 0; } .sl-notification-block footer { display: flex; align-items: center; justify-content: center; height: 40px; } .sl-notification-item { display: block; background: var(--bazis-background); border-bottom: 1px solid var(--bazis-border-color); padding: calc(var(--bazis-multiple-px) * 2) calc(var(--bazis-multiple-px) * 4); } .sl-announcement .sl-notification-item { padding: 20px 0; } .sl-announcement .sl-notification-item:first-child { border-top: 1px solid var(--bazis-border-color); } .sl-notification-item:last-of-type { border-bottom: 0; } .sl-announcement .sl-notification-item:last-of-type { border-bottom: 1px solid var(--bazis-border-color); } .sl-notification-item__checkbox { margin-right: calc(var(--bazis-multiple-px) * 4); } .sl-notification-block .sl-notification-item__checkbox { display: none; } .sl-notification-item__major-line { display: flex; align-items: center; } .sl-announcement .sl-notification-item__major-line { align-items: flex-start; } .sl-notification-item__major-line bazis-button:hover { color: var(--bazis-color-action); } .sl-notification-item__major-line + * { padding-left: calc(var(--bazis-multiple-px) * 7); padding-top: 6px; padding-bottom: calc(var(--bazis-multiple-px) * 2); } .sl-announcement .sl-notification-item__major-line + * { padding-left: 32px; padding-top: 12px; padding-bottom: 0; } .sl-notification-item__action { flex-shrink: 0; width: 32px; } .sl-notification-item__type { --bazis-icon-s-size: 16px; margin-right: calc(var(--bazis-multiple-px) * 3); flex-shrink: 0; } .sl-notification-item__message { position: relative; display: flex; width: 100%; font-size: 13px; line-height: 16px; } .sl-notification-item__message a { color: var(--bazis-color-action); } .sl-notification-item__message__content { font-size: 13px; line-height: 16px; } .sl-notification-item__message__content p:first-child { margin-top: 0; } .sl-notification-item__message__content p:last-child { margin-bottom: 0; } .sl-notification-item__message .sl-more-mute { max-height: 48px; overflow: hidden; } .sl-notification-item__message .sl-more-mute::after { content: ""; position: absolute; z-index: 1; left: 0; right: 0; top: 28px; height: 20px; background: linear-gradient(0deg, rgba(var(--bazis-color-white-rgb), 1), rgba(var(--bazis-color-white-rgb), 0)); } .sl-notification-item__datetime { padding-left: calc(var(--bazis-multiple-px) * 3); padding-right: calc(var(--bazis-multiple-px) * 2); font-size: 11px; line-height: 12px; text-align: right; color: var(--bazis-text-color-secondary); white-space: nowrap; } .sl-announcement .sl-notification-item__datetime { font-size: 13px; line-height: 24px; } @media (max-width: 576px) { .sl-notification-item__datetime { padding-left: 0; padding-top: 4px; text-align: left; } } .sl-notification-item--active { background: var(--bazis-background-medium); } .rs-mockup { display: block; width: 100%; } .rs-sitemap { height: 100vh; padding: 302px 40px 38px; background: var(--bazis-color-primary); color: var(--bazis-color-primary-contrast); overflow-y: hidden; } .rs-sitemap::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(105deg, #00B2FF 36.68%, rgba(0, 71, 255, 0) 98.85%); opacity: 0.2; } .rs-sitemap__header { position: absolute; z-index: 1; top: 38px; left: 0; right: 0; width: 100%; max-width: 788px; margin: 0 auto 77px; text-align: center; } .rs-sitemap__header bazis-logo { --height: 40px; } .rs-sitemap__header h1 { margin-top: 42px; } .rs-sitemap__list { position: relative; display: flex; gap: 12px; } .rs-sitemap__item { flex-shrink: 0; width: 172px; font-size: 16px; font-weight: 500; line-height: 24px; color: var(--bazis-color-primary-contrast); text-decoration: none; transition: transform 0.4s; } .rs-sitemap__item:hover { transform: translateY(-10px); } .rs-sitemap__item:last-child { padding-right: 40px; box-sizing: content-box; } .rs-sitemap__preview { display: block; margin-top: 4px; transform: scale(0.123); transform-origin: 0 0; } .rs-sitemap__iframe { width: 1400px; border: none; pointer-events: none; } /*# sourceMappingURL=styles.63d0c105fab70d33.css.map*/