html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    font-family: sans-serif
}

button::-moz-focus-inner {
    border: 0;
    padding: 0
}

input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button {
    height: auto
}

input[type=number]::-webkit-outer-spin-button {
    height: auto
}

input[type=search]::-webkit-search-cancel-button {
    -webkit-appearance: none
}

input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

.bs-Actions-action,
.bs-ActionsParent:hover .bs-Actions-action,
.bs-Button,
.bs-Checkbox-box,
.bs-Control,
.bs-Menu-item,
.bs-Radio-button,
.bs-Select select,
.bs-TextArea,
.bs-TextInput,
.bs-TextInputExtension,
.bs-TextInputGroup,
.bs-TextInputRetracted {
    font: inherit;
    color: inherit;
    background: 0 0;
    border: none;
    margin: 0;
    padding: 0
}

.bs-Actions-action,
.bs-ActionsParent:hover .bs-Actions-action,
.bs-Button,
.bs-Checkbox-box,
.bs-Control,
.bs-Radio-button,
.bs-Select select,
.bs-SwitchList-row.bs-is-disabled,
.bs-TextArea,
.bs-TextInput,
.bs-TextInputExtension,
.bs-TextInputGroup,
.bs-TextInputRetracted,
.bs-Toggle-source:disabled+.bs-Toggle-button {
    cursor: default;
    -webkit-user-select: none;
    user-select: none
}

.bs-Actions-action,
.bs-ActionsParent:hover .bs-Actions-action,
.bs-Button,
.bs-Checkbox-box,
.bs-Control,
.bs-Menu-item,
.bs-Radio-button,
.bs-Select select,
.bs-TextArea,
.bs-TextInput,
.bs-TextInputExtension,
.bs-TextInputGroup,
.bs-TextInputRetracted {
    box-sizing: border-box;
    background-clip: padding-box
}

.bs-VerticalMenu-clarification,
.bs-VerticalMenu-heading,
.bs-VerticalMenu-item {
    white-space: nowrap;
    overflow: hidden
}

.bs-Actions-action,
.bs-ActionsParent:hover .bs-Actions-action,
.bs-Button,
.bs-Checkbox-box,
.bs-Control,
.bs-Radio-button,
.bs-Select select,
.bs-TextArea,
.bs-TextInput,
.bs-TextInputExtension,
.bs-TextInputGroup,
.bs-TextInputRetracted {
    vertical-align: top;
    display: inline-block;
    position: relative
}

.bs-VerticalMenu-clarification,
.bs-VerticalMenu-heading,
.bs-VerticalMenu-item {
    text-overflow: ellipsis
}

.bs-TextArea,
.bs-TextInput,
.bs-TextInputExtension,
.bs-TextInputGroup,
.bs-TextInputRetracted {
    border-radius: var(--sail-radius);
    box-shadow: 0 0 0 1px rgba(var(--sail-color-gray-800-rgb), .16), 0 0 0 1px rgba(var(--sail-color-cyan-500-rgb), 0), 0 0 0 2px rgba(var(--sail-color-cyan-500-rgb), 0), 0 1px 1px #00000014;
    color: var(--sail-gray600);
    cursor: text;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    word-break: normal;
    -webkit-user-select: auto;
    user-select: auto;
    background-color: #fff;
    flex: none;
    padding: 4px 7px 2px;
    font-size: 14px;
    line-height: 1.6;
    text-decoration: none;
    transition: box-shadow 80ms ease-in, color 80ms ease-in
}

.bs-TextArea::-webkit-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextInput::-webkit-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextInputExtension::-webkit-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextInputGroup::-webkit-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextInputRetracted::-webkit-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextArea::-webkit-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextInput::-webkit-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextInputExtension::-webkit-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextInputGroup::-webkit-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextInputRetracted::-webkit-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextArea:-ms-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextInput:-ms-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextInputExtension:-ms-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextInputGroup:-ms-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextInputRetracted:-ms-input-placeholder {
    color: var(--sail-gray400)
}

.bs-TextArea::placeholder,
.bs-TextInput::placeholder,
.bs-TextInputExtension::placeholder,
.bs-TextInputGroup::placeholder,
.bs-TextInputRetracted::placeholder {
    color: var(--sail-gray400)
}

.bs-Fieldset-row.bs-is-focused .bs-TextInput,
.bs-TextArea.bs-is-focused,
.bs-TextArea:focus,
.bs-TextInput.bs-is-focused,
.bs-TextInput:focus,
.bs-TextInputExtension.bs-is-focused,
.bs-TextInputExtension .bs-TextInput:focus,
.bs-TextInputExtension:focus,
.bs-TextInputGroup.bs-is-focused,
.bs-TextInputGroup .bs-Select select:focus,
.bs-TextInputGroup .bs-TextInput:focus,
.bs-TextInputGroup:focus,
.bs-TextInputRetracted.bs-is-focused,
.bs-TextInputRetracted .bs-TextInput:focus,
.bs-TextInputRetracted:focus {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-gray-800-rgb), 0), 0 0 0 1px rgba(var(--sail-color-cyan-500-rgb), .2), 0 0 0 2px rgba(var(--sail-color-cyan-500-rgb), .25), 0 1px 1px #00000014;
    outline: 0
}

.bs-Fieldset-row.bs-is-disabled .bs-TextInputExtension,
.bs-Fieldset-row.bs-is-disabled .bs-TextInputExtension .bs-TextInput,
.bs-Fieldset-row.bs-is-disabled .bs-TextInputGroup,
.bs-Fieldset-row.bs-is-disabled .bs-TextInputRetracted,
.bs-Fieldset-row.bs-is-disabled .bs-TextInputRetracted .bs-TextInput,
.bs-TextArea.bs-is-disabled,
.bs-TextArea:disabled,
.bs-TextArea:disabled:active,
.bs-TextArea:disabled:focus,
.bs-TextArea:disabled:hover,
.bs-TextInput.bs-is-disabled,
.bs-TextInput:disabled,
.bs-TextInput:disabled:active,
.bs-TextInput:disabled:focus,
.bs-TextInput:disabled:hover,
.bs-TextInputExtension.bs-is-disabled,
.bs-TextInputExtension.bs-is-disabled .bs-TextInput,
.bs-TextInputExtension:disabled,
.bs-TextInputExtension:disabled:active,
.bs-TextInputExtension:disabled:focus,
.bs-TextInputExtension:disabled:hover,
.bs-TextInputGroup.bs-is-disabled,
.bs-TextInputGroup.bs-is-disabled .bs-TextInput,
.bs-TextInputGroup:disabled,
.bs-TextInputGroup:disabled:active,
.bs-TextInputGroup:disabled:focus,
.bs-TextInputGroup:disabled:hover,
.bs-TextInputRetracted.bs-is-disabled,
.bs-TextInputRetracted.bs-is-disabled .bs-TextInput,
.bs-TextInputRetracted:disabled,
.bs-TextInputRetracted:disabled:active,
.bs-TextInputRetracted:disabled:focus,
.bs-TextInputRetracted:disabled:hover {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-gray-400-rgb), .2), 0 0 0 1px rgba(var(--sail-color-cyan-500-rgb), 0), 0 0 0 2px rgba(var(--sail-color-cyan-500-rgb), 0), 0 1px 1px #00000014;
    color: var(--sail-gray300);
    cursor: default;
    pointer-events: none;
    background-color: #fafafd
}

.bs-TextArea:disabled::-webkit-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextInput:disabled::-webkit-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextInputExtension:disabled::-webkit-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextInputGroup:disabled::-webkit-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextInputRetracted:disabled::-webkit-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextArea:disabled::-webkit-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextInput:disabled::-webkit-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextInputExtension:disabled::-webkit-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextInputGroup:disabled::-webkit-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextInputRetracted:disabled::-webkit-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextArea:disabled:-ms-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextInput:disabled:-ms-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextInputExtension:disabled:-ms-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextInputGroup:disabled:-ms-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextInputRetracted:disabled:-ms-input-placeholder {
    color: var(--sail-gray300)
}

.bs-TextArea:disabled::placeholder,
.bs-TextInput:disabled::placeholder,
.bs-TextInputExtension:disabled::placeholder,
.bs-TextInputGroup:disabled::placeholder,
.bs-TextInputRetracted:disabled::placeholder {
    color: var(--sail-gray300)
}

.bs-TextArea--small,
.bs-TextInput--small {
    padding: 2px 4px;
    font-size: 13px
}

.bs-TextArea--large,
.bs-TextInput--large {
    padding: 5px 7px;
    font-size: 15px
}

.bs-Fieldset-row.bs-is-invalid .bs-TextArea,
.bs-Fieldset-row.bs-is-invalid .bs-TextInput,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension .bs-TextInput,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputGroup,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted .bs-TextInput,
.bs-TextArea.bs-is-invalid,
.bs-TextInput.bs-is-invalid,
.bs-TextInputExtension.bs-is-invalid,
.bs-TextInputExtension.bs-is-invalid .bs-TextInput,
.bs-TextInputGroup.bs-is-invalid,
.bs-TextInputRetracted.bs-is-invalid,
.bs-TextInputRetracted.bs-is-invalid .bs-TextInput {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-red-500-rgb), .16), 0 0 0 1px rgba(var(--sail-color-cyan-500-rgb), 0), 0 0 0 2px rgba(var(--sail-color-cyan-500-rgb), 0), 0 1px 1px #00000014;
    color: var(--sail-red500)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextArea::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInput::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension .bs-TextInput::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputGroup::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted .bs-TextInput::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextArea.bs-is-invalid::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInput.bs-is-invalid::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputExtension.bs-is-invalid .bs-TextInput::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputExtension.bs-is-invalid::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputGroup.bs-is-invalid::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputRetracted.bs-is-invalid .bs-TextInput::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputRetracted.bs-is-invalid::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextArea::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInput::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension .bs-TextInput::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputGroup::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted .bs-TextInput::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextArea.bs-is-invalid::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInput.bs-is-invalid::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputExtension.bs-is-invalid .bs-TextInput::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputExtension.bs-is-invalid::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputGroup.bs-is-invalid::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputRetracted.bs-is-invalid .bs-TextInput::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputRetracted.bs-is-invalid::-webkit-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextArea:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInput:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension .bs-TextInput:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputGroup:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted .bs-TextInput:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextArea.bs-is-invalid:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInput.bs-is-invalid:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputExtension.bs-is-invalid .bs-TextInput:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputExtension.bs-is-invalid:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputGroup.bs-is-invalid:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputRetracted.bs-is-invalid .bs-TextInput:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-TextInputRetracted.bs-is-invalid:-ms-input-placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextArea::placeholder,
.bs-Fieldset-row.bs-is-invalid .bs-TextInput::placeholder,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension .bs-TextInput::placeholder,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension::placeholder,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputGroup::placeholder,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted .bs-TextInput::placeholder,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted::placeholder,
.bs-TextArea.bs-is-invalid::placeholder,
.bs-TextInput.bs-is-invalid::placeholder,
.bs-TextInputExtension.bs-is-invalid .bs-TextInput::placeholder,
.bs-TextInputExtension.bs-is-invalid::placeholder,
.bs-TextInputGroup.bs-is-invalid::placeholder,
.bs-TextInputRetracted.bs-is-invalid .bs-TextInput::placeholder,
.bs-TextInputRetracted.bs-is-invalid::placeholder {
    color: rgba(var(--sail-color-red-500-rgb), .5)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextArea:focus,
.bs-Fieldset-row.bs-is-invalid .bs-TextInput:focus,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension .bs-TextInput:focus,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension:focus,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputGroup .bs-Select select:focus,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputGroup .bs-TextInput:focus,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputGroup:focus,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted .bs-TextInput:focus,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted:focus,
.bs-TextArea.bs-is-invalid:focus,
.bs-TextInput.bs-is-invalid:focus,
.bs-TextInputExtension.bs-is-invalid .bs-TextInput:focus,
.bs-TextInputExtension.bs-is-invalid:focus,
.bs-TextInputGroup.bs-is-invalid .bs-Select select:focus,
.bs-TextInputGroup.bs-is-invalid .bs-TextInput:focus,
.bs-TextInputGroup.bs-is-invalid:focus,
.bs-TextInputRetracted.bs-is-invalid .bs-TextInput:focus,
.bs-TextInputRetracted.bs-is-invalid:focus {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-red-500-rgb), 0), 0 0 0 1px rgba(var(--sail-color-cyan-500-rgb), .2), 0 0 0 2px rgba(var(--sail-color-cyan-500-rgb), .25), 0 1px 1px #00000014;
    color: var(--sail-red500)
}

.bs-Fieldset-row.bs-is-invalid .bs-TextArea.bs-is-disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextArea:disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextInput.bs-is-disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextInput:disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension.bs-is-disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension .bs-TextInput.bs-is-disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension .bs-TextInput:disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension:disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputGroup.bs-is-disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputGroup:disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted.bs-is-disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted .bs-TextInput.bs-is-disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted .bs-TextInput:disabled,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted:disabled,
.bs-TextArea.bs-is-invalid.bs-is-disabled,
.bs-TextArea.bs-is-invalid:disabled,
.bs-TextInput.bs-is-invalid.bs-is-disabled,
.bs-TextInput.bs-is-invalid:disabled,
.bs-TextInputExtension.bs-is-invalid.bs-is-disabled,
.bs-TextInputExtension.bs-is-invalid .bs-TextInput.bs-is-disabled,
.bs-TextInputExtension.bs-is-invalid .bs-TextInput:disabled,
.bs-TextInputExtension.bs-is-invalid:disabled,
.bs-TextInputGroup.bs-is-invalid.bs-is-disabled,
.bs-TextInputGroup.bs-is-invalid:disabled,
.bs-TextInputRetracted.bs-is-invalid.bs-is-disabled,
.bs-TextInputRetracted.bs-is-invalid .bs-TextInput.bs-is-disabled,
.bs-TextInputRetracted.bs-is-invalid .bs-TextInput:disabled,
.bs-TextInputRetracted.bs-is-invalid:disabled {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-red-500-rgb), .12), 0 0 0 1px rgba(var(--sail-color-cyan-500-rgb), 0), 0 0 0 2px rgba(var(--sail-color-cyan-500-rgb), 0), 0 1px 1px #00000014;
    color: #f0b5b2
}

.bs-Fieldset-row.bs-is-disabled .bs-TextInputExtension .bs-TextInput,
.bs-Fieldset-row.bs-is-disabled .bs-TextInputRetracted .bs-TextInput,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputExtension .bs-TextInput,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputGroup .bs-Select select,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputGroup .bs-TextInput,
.bs-Fieldset-row.bs-is-invalid .bs-TextInputRetracted .bs-TextInput,
.bs-TextInputExtension.bs-is-disabled .bs-TextInput,
.bs-TextInputExtension.bs-is-invalid .bs-TextInput,
.bs-TextInputExtension .bs-TextInput,
.bs-TextInputGroup .bs-Select select,
.bs-TextInputGroup .bs-TextInput,
.bs-TextInputRetracted.bs-is-disabled .bs-TextInput,
.bs-TextInputRetracted.bs-is-invalid .bs-TextInput,
.bs-TextInputRetracted .bs-TextInput {
    box-shadow: none;
    background-color: #0000;
    border-radius: 0
}

.bs-Modal-container {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.bs-Actions-action,
.bs-ActionsParent:hover .bs-Actions-action,
.bs-Button,
.bs-Checkbox-box,
.bs-Control,
.bs-Radio-button,
.bs-Select select {
    border-radius: var(--sail-radius);
    box-shadow: 0 0 0 1px rgba(var(--sail-color-gray-800-rgb), .1), 0 2px 5px 0 rgba(var(--sail-color-gray-800-rgb), .08), 0 1px 1.5px 0 #00000012, 0 1px 2px 0 #00000014, 0 0 0 0 transparent;
    color: var(--sail-gray600);
    cursor: pointer;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    word-break: normal;
    background-color: #fff;
    flex: none;
    padding: 3px 8px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.6;
    text-decoration: none;
    transition: box-shadow 80ms ease-in, color 80ms ease-in
}

.bs-Actions-action.bs-is-hovered,
.bs-Actions-action:hover,
.bs-ActionsParent:hover .bs-Actions-action.bs-is-hovered,
.bs-ActionsParent:hover .bs-Actions-action:hover,
.bs-Button.bs-is-hovered,
.bs-Button:hover,
.bs-Checkbox-box.bs-is-hovered,
.bs-Checkbox-box:hover,
.bs-Checkbox-source:hover+.bs-Checkbox-box,
.bs-Checkbox.bs-is-hover .bs-Checkbox-box,
.bs-Radio-button.bs-is-hovered,
.bs-Radio-button:hover,
.bs-Radio-source:hover+.bs-Radio-button,
.bs-Radio.bs-is-hover .bs-Radio-button,
.bs-Select select.bs-is-hovered,
.bs-Select select:hover {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-gray-800-rgb), .1), 0 2px 5px 0 rgba(var(--sail-color-gray-800-rgb), .1), 0 3px 9px 0 rgba(var(--sail-color-gray-800-rgb), .08), 0 1px 1.5px 0 #00000014, 0 1px 2px 0 #00000014;
    color: var(--sail-gray800);
    background-color: #fff
}

.bs-Actions-action.bs-is-focused,
.bs-Actions-action:focus,
.bs-ActionsParent:hover .bs-Actions-action.bs-is-focused,
.bs-ActionsParent:hover .bs-Actions-action:focus,
.bs-Button.bs-is-focused,
.bs-Button:focus,
.bs-Checkbox-box.bs-is-focused,
.bs-Checkbox-box:focus,
.bs-Checkbox-source:focus+.bs-Checkbox-box,
.bs-Checkbox.bs-is-focus .bs-Checkbox-box,
.bs-Radio-button.bs-is-focused,
.bs-Radio-button:focus,
.bs-Radio-source:focus+.bs-Radio-button,
.bs-Radio.bs-is-focus .bs-Radio-button,
.bs-Select select.bs-is-focused,
.bs-Select select:focus {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-cyan-500-rgb), .2), 0 0 0 2px rgba(var(--sail-color-cyan-500-rgb), .25), 0 2px 5px 0 rgba(var(--sail-color-gray-800-rgb), .1), 0 1px 1px 0 #00000012, 0 1px 2px 0 #00000014;
    outline: 0
}

.bs-Actions-action.bs-is-active,
.bs-Actions-action:active,
.bs-ActionsParent:hover .bs-Actions-action.bs-is-active,
.bs-ActionsParent:hover .bs-Actions-action:active,
.bs-Button.bs-is-active,
.bs-Button:active,
.bs-Checkbox-box.bs-is-active,
.bs-Checkbox-box:active,
.bs-Checkbox-source:active+.bs-Checkbox-box,
.bs-Checkbox.bs-is-active .bs-Checkbox-box,
.bs-Radio-button.bs-is-active,
.bs-Radio-button:active,
.bs-Radio-source:active+.bs-Radio-button,
.bs-Radio.bs-is-active .bs-Radio-button,
.bs-Select select.bs-is-active,
.bs-Select select:active {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-gray-800-rgb), .08), 0 2px 5px 0 rgba(var(--sail-color-gray-800-rgb), .06), 0 1px 1.5px 0 #0000000d, 0 1px 2px 0 #0000000f, 0 0 0 0 transparent;
    color: var(--sail-gray800);
    background-color: #fff
}

.bs-Actions-action.bs-is-disabled,
.bs-Actions-action:disabled,
.bs-Actions-action:disabled:active,
.bs-Actions-action:disabled:focus,
.bs-Actions-action:disabled:hover,
.bs-ActionsParent:hover .bs-Actions-action.bs-is-disabled,
.bs-ActionsParent:hover .bs-Actions-action:disabled,
.bs-ActionsParent:hover .bs-Actions-action:disabled:active,
.bs-ActionsParent:hover .bs-Actions-action:disabled:focus,
.bs-ActionsParent:hover .bs-Actions-action:disabled:hover,
.bs-Button.bs-is-disabled,
.bs-Button:disabled,
.bs-Button:disabled:active,
.bs-Button:disabled:focus,
.bs-Button:disabled:hover,
.bs-Checkbox-box.bs-is-disabled,
.bs-Checkbox-box:disabled,
.bs-Checkbox-box:disabled:active,
.bs-Checkbox-box:disabled:focus,
.bs-Checkbox-box:disabled:hover,
.bs-Checkbox-source:checked+.bs-Checkbox-box.bs-is-disabled,
.bs-Checkbox-source:checked+.bs-Checkbox-box:disabled,
.bs-Checkbox-source:checked:disabled+.bs-Checkbox-box,
.bs-Checkbox-source:checked:disabled+.bs-Checkbox-box.bs-is-disabled,
.bs-Checkbox-source:checked:disabled+.bs-Checkbox-box:disabled,
.bs-Checkbox-source:disabled+.bs-Checkbox-box,
.bs-Checkbox.bs-is-disabled .bs-Checkbox-box,
.bs-Checkbox.bs-is-disabled .bs-Checkbox-source:checked+.bs-Checkbox-box,
.bs-Fieldset-row.bs-is-disabled .bs-Checkbox-box,
.bs-Fieldset-row.bs-is-disabled .bs-Checkbox-source:checked+.bs-Checkbox-box,
.bs-Fieldset-row.bs-is-disabled .bs-Checkbox-source:checked+.bs-Checkbox-box.bs-is-disabled,
.bs-Fieldset-row.bs-is-disabled .bs-Checkbox-source:checked+.bs-Checkbox-box:disabled,
.bs-Fieldset-row.bs-is-disabled .bs-Radio-button,
.bs-Fieldset-row.bs-is-disabled .bs-Radio-source:checked+.bs-Radio-button,
.bs-Fieldset-row.bs-is-disabled .bs-Radio-source:checked+.bs-Radio-button.bs-is-disabled,
.bs-Fieldset-row.bs-is-disabled .bs-Radio-source:checked+.bs-Radio-button:disabled,
.bs-Fieldset-row.bs-is-disabled .bs-Select select,
.bs-Radio-button.bs-is-disabled,
.bs-Radio-button:disabled,
.bs-Radio-button:disabled:active,
.bs-Radio-button:disabled:focus,
.bs-Radio-button:disabled:hover,
.bs-Radio-source:checked+.bs-Radio-button.bs-is-disabled,
.bs-Radio-source:checked+.bs-Radio-button:disabled,
.bs-Radio-source:checked:disabled+.bs-Radio-button,
.bs-Radio-source:checked:disabled+.bs-Radio-button.bs-is-disabled,
.bs-Radio-source:checked:disabled+.bs-Radio-button:disabled,
.bs-Radio-source:disabled+.bs-Radio-button,
.bs-Radio.bs-is-disabled .bs-Radio-button,
.bs-Radio.bs-is-disabled .bs-Radio-source:checked+.bs-Radio-button,
.bs-Select.bs-is-disabled select,
.bs-Select select.bs-is-disabled,
.bs-Select select:disabled,
.bs-Select select:disabled:active,
.bs-Select select:disabled:focus,
.bs-Select select:disabled:hover {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-gray-800-rgb), .1), 0 2px 5px 0 rgba(var(--sail-color-gray-800-rgb), .06), 0 1px 1px 0 #0000000a, 0 1px 2px 0 #0000000a, 0 0 0 0 transparent;
    color: var(--sail-gray400);
    cursor: default;
    pointer-events: none;
    background-color: #fafafd
}

.bs-Actions--small .bs-Actions-action,
.bs-ActionsParent:hover .bs-Actions--small .bs-Actions-action,
.bs-Button--small,
.bs-Control--small,
.bs-Select--small select {
    padding: 2px 8px;
    font-size: 13px
}

.bs-Button--large,
.bs-Select--large select {
    padding: 4px 12px;
    font-size: 15px
}

.bs-Checkbox.bs-is-invalid .bs-Checkbox-box,
.bs-Fieldset-row.bs-is-invalid .bs-Checkbox-box,
.bs-Fieldset-row.bs-is-invalid .bs-Select select,
.bs-Select.bs-is-invalid select {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-red-500-rgb), .1), 0 2px 5px 0 rgba(var(--sail-color-red-500-rgb), .08), 0 1px 1.5px 0 #00000012, 0 1px 2px 0 #00000014, 0 0 0 0 transparent
}

.bs-Checkbox.bs-is-invalid .bs-Checkbox-box:hover,
.bs-Fieldset-row.bs-is-invalid .bs-Checkbox-box:hover,
.bs-Fieldset-row.bs-is-invalid .bs-Select select:hover,
.bs-Select.bs-is-invalid select:hover {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-red-500-rgb), .1), 0 2px 5px 0 rgba(var(--sail-color-red-500-rgb), .1), 0 3px 9px 0 rgba(var(--sail-color-red-500-rgb), .08), 0 1px 1.5px 0 #00000014, 0 1px 2px 0 #00000014
}

.bs-Checkbox.bs-is-invalid .bs-Checkbox-box:active,
.bs-Fieldset-row.bs-is-invalid .bs-Checkbox-box:active,
.bs-Fieldset-row.bs-is-invalid .bs-Select select:active,
.bs-Select.bs-is-invalid select:active {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-red-500-rgb), .1), 0 1px 3px rgba(var(--sail-color-red-500-rgb), .04), 0 1px 1px #0000000a, 0 0 0 0 transparent, 0 0 0 0 transparent
}

.bs-Checkbox.bs-is-invalid .bs-Checkbox-box:focus,
.bs-Fieldset-row.bs-is-invalid .bs-Checkbox-box:focus,
.bs-Fieldset-row.bs-is-invalid .bs-Select select:focus,
.bs-Select.bs-is-invalid select:focus {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-cyan-500-rgb), .2), 0 0 0 2px rgba(var(--sail-color-cyan-500-rgb), .25), 0 2px 5px 0 rgba(var(--sail-color-red-500-rgb), .1), 0 1px 1px 0 #00000012, 0 1px 2px 0 #00000014
}

.bs-Button--blue {
    background: var(--sail-blue500);
    box-shadow: 0 0 0 1px var(--sail-blue500), 0 2px 1px 0 rgba(var(--sail-color-blue-700-rgb), .15), 0 2px 5px 0 rgba(var(--sail-color-gray-800-rgb), .1), 0 1px 2px 0 #00000014, 0 0 0 0 transparent;
    color: #ffffffe6
}

.bs-Button--blue:hover {
    background: var(--sail-blue500);
    box-shadow: 0 0 0 1px var(--sail-blue500), 0 2px 5px 0 rgba(var(--sail-color-gray-800-rgb), .3), 0 4px 9px 0 rgba(var(--sail-color-gray-800-rgb), .1), 0 1px 2px 0 #00000014, 0 1px 2px 0 #00000014;
    color: #fff
}

.bs-Button--blue:active {
    background: var(--sail-blue500);
    box-shadow: 0 0 0 1px var(--sail-blue500), 0 2px 4px rgba(var(--sail-color-gray-800-rgb), .04), 0 1px 2px #0000000a, 0 0 0 0 transparent, 0 0 0 0 transparent;
    color: #fff
}

.bs-Button--blue:focus {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-cyan-500-rgb), .2), 0 0 0 2px rgba(var(--sail-color-cyan-500-rgb), .25), 0 2px 5px 0 #0000001a, 0 0 0 0 transparent, 0 0 0 0 transparent
}

.bs-Button--blue.bs-is-disabled,
.bs-Button--blue.bs-is-disabled:active,
.bs-Button--blue.bs-is-disabled:focus,
.bs-Button--blue.bs-is-disabled:hover,
.bs-Button--blue:disabled,
.bs-Button--blue:disabled:active,
.bs-Button--blue:disabled:focus,
.bs-Button--blue:disabled:hover {
    box-shadow: 0 0 0 1px #7e82d9, 0 1px 1px 0 rgba(var(--sail-color-gray-700-rgb), .1), 0 2px 5px 0 rgba(var(--sail-color-gray-800-rgb), .1), 0 1px 2px 0 #00000014, 0 0 0 0 transparent;
    color: #ffffffbf;
    background: #7e82d9
}

.bs-Button--red {
    background: var(--sail-red500);
    color: #ffffffe6
}

.bs-Button--red:hover,
.bs-Button--red:active {
    background: var(--sail-red500);
    color: #fff
}

.bs-Button--red:focus {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-cyan-500-rgb), .2), 0 0 0 2px rgba(var(--sail-color-cyan-500-rgb), .25), 0 2px 5px 0 #0000001a, 0 0 0 0 transparent, 0 0 0 0 transparent
}

.bs-Button--red.bs-is-disabled,
.bs-Button--red.bs-is-disabled:active,
.bs-Button--red.bs-is-disabled:focus,
.bs-Button--red.bs-is-disabled:hover,
.bs-Button--red:disabled,
.bs-Button--red:disabled:active,
.bs-Button--red:disabled:focus,
.bs-Button--red:disabled:hover {
    box-shadow: 0 0 0 1px #ce636f, 0 2px 1px 0 rgba(var(--sail-color-gray-700-rgb), .1), 0 2px 5px 0 rgba(var(--sail-color-gray-800-rgb), .1), 0 1px 2px 0 #00000014, 0 0 0 0 transparent;
    color: #ffffffbf;
    background: #ce636f
}

.bs-Button--green {
    background: var(--sail-green500);
    color: #ffffffe6
}

.bs-Button--green:hover,
.bs-Button--green:active {
    background: var(--sail-green500);
    color: #fff
}

.bs-Button--green:focus {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-cyan-500-rgb), .2), 0 0 0 2px rgba(var(--sail-color-cyan-500-rgb), .25), 0 2px 5px 0 #0000001a, 0 0 0 0 transparent, 0 0 0 0 transparent
}

.bs-Button--green.bs-is-disabled,
.bs-Button--green.bs-is-disabled:active,
.bs-Button--green.bs-is-disabled:focus,
.bs-Button--green.bs-is-disabled:hover,
.bs-Button--green:disabled,
.bs-Button--green:disabled:active,
.bs-Button--green:disabled:focus,
.bs-Button--green:disabled:hover {
    box-shadow: 0 0 0 1px #49c296, 0 2px 1px 0 rgba(var(--sail-color-gray-700-rgb), .1), 0 2px 5px 0 rgba(var(--sail-color-gray-800-rgb), .1), 0 1px 2px 0 #00000014, 0 0 0 0 transparent;
    color: #ffffffbf;
    background: #49c296
}

.bs-Checkbox-source:checked+.bs-Checkbox-box,
.bs-Checkbox-source:checked:disabled+.bs-Checkbox-box,
.bs-Fieldset-row.bs-is-disabled .bs-Checkbox-source:checked+.bs-Checkbox-box,
.bs-Fieldset-row.bs-is-disabled .bs-Radio-source:checked+.bs-Radio-button,
.bs-Radio-source:checked+.bs-Radio-button,
.bs-Radio-source:checked:disabled+.bs-Radio-button,
.bs-Checkbox-source:checked+.bs-Checkbox-box:hover,
.bs-Checkbox-source:checked:disabled+.bs-Checkbox-box:hover,
.bs-Checkbox-source:checked:hover+.bs-Checkbox-box,
.bs-Checkbox.bs-is-hover .bs-Checkbox-source:checked+.bs-Checkbox-box,
.bs-Fieldset-row.bs-is-disabled .bs-Checkbox-source:checked+.bs-Checkbox-box:hover,
.bs-Fieldset-row.bs-is-disabled .bs-Radio-source:checked+.bs-Radio-button:hover,
.bs-Radio-source:checked+.bs-Radio-button:hover,
.bs-Radio-source:checked:disabled+.bs-Radio-button:hover,
.bs-Radio-source:checked:hover+.bs-Radio-button,
.bs-Radio.bs-is-hover .bs-Radio-source:checked+.bs-Radio-button,
.bs-Checkbox-source:checked+.bs-Checkbox-box:active,
.bs-Checkbox-source:checked:active+.bs-Checkbox-box,
.bs-Checkbox-source:checked:disabled+.bs-Checkbox-box:active,
.bs-Checkbox.bs-is-active .bs-Checkbox-source:checked+.bs-Checkbox-box,
.bs-Fieldset-row.bs-is-disabled .bs-Checkbox-source:checked+.bs-Checkbox-box:active,
.bs-Fieldset-row.bs-is-disabled .bs-Radio-source:checked+.bs-Radio-button:active,
.bs-Radio-source:checked+.bs-Radio-button:active,
.bs-Radio-source:checked:active+.bs-Radio-button,
.bs-Radio-source:checked:disabled+.bs-Radio-button:active,
.bs-Radio.bs-is-active .bs-Radio-source:checked+.bs-Radio-button {
    background: var(--sail-blue500);
    color: #fff
}

.bs-Checkbox-source:checked+.bs-Checkbox-box:focus,
.bs-Checkbox-source:checked:disabled+.bs-Checkbox-box:focus,
.bs-Checkbox-source:checked:focus+.bs-Checkbox-box,
.bs-Checkbox.bs-is-focused .bs-Checkbox-source:checked+.bs-Checkbox-box,
.bs-Fieldset-row.bs-is-disabled .bs-Checkbox-source:checked+.bs-Checkbox-box:focus,
.bs-Fieldset-row.bs-is-disabled .bs-Radio-source:checked+.bs-Radio-button:focus,
.bs-Radio-source:checked+.bs-Radio-button:focus,
.bs-Radio-source:checked:disabled+.bs-Radio-button:focus,
.bs-Radio-source:checked:focus+.bs-Radio-button,
.bs-Radio.bs-is-focused .bs-Radio-source:checked+.bs-Radio-button {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-blue-500-rgb), .2), 0 2px 5px rgba(var(--sail-color-gray-800-rgb), .1), 0 1px 2px #00000014, 0 0 0 2px rgba(var(--sail-color-blue-500-rgb), .25), 0 0 0 0 transparent
}

.bs-ActionsParent .bs-Actions-action,
.bs-Toggle-button {
    box-shadow: none;
    background-color: #0000;
    border: 0;
    border-radius: 0
}

.bs-Columns {
    display: flex
}

.bs-Columns-column {
    flex: none;
    padding-left: 6px;
    padding-right: 6px
}

.bs-Columns-column:first-child {
    padding-left: 0
}

.bs-Columns-column:last-child {
    padding-right: 0
}

.bs-Columns-column--half {
    flex-basis: 50%
}

.bs-Columns-column--twoThirds {
    flex-grow: 2;
    flex-basis: 66%
}

.bs-Columns-column--oneThird {
    flex-grow: 1;
    flex-basis: 33%
}

.bs-Columns-column--flexible {
    flex-grow: 0;
    flex-shrink: 1
}

.bs-Columns-column--split {
    padding-left: 11px;
    padding-right: 11px
}

.bs-Columns-column--split:first-child {
    padding-left: 0
}

.bs-Columns-column--split:last-child {
    padding-right: 0
}

body,
html {
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Ubuntu, sans-serif
}

code,
kbd,
pre,
samp {
    margin: 0;
    font-family: Menlo, Consolas, monospace
}

h1,
h2,
h3,
h4,
h5 {
    color: var(--sail-gray800);
    margin: 0;
    line-height: 1.6
}

h1 {
    font-size: 30px;
    font-weight: 400
}

h2 {
    font-size: 22px;
    font-weight: 500
}

h3 {
    font-size: 14px;
    font-weight: 500
}

h4,
h5 {
    font-size: 13px;
    font-weight: 500
}

.bs-Fieldset-explanation,
.bs-Modal-footer-copy p,
.bs-Modal-message,
.bs-Popover,
.bs-small,
.bs-SwitchList-message,
body,
html {
    color: var(--sail-gray600);
    text-transform: none;
    font-size: 14px;
    font-weight: 400;
    line-height: normal
}

.bs-Fieldset-explanation,
.bs-Modal-footer-copy p,
.bs-Modal-message,
.bs-small,
.bs-SwitchList-message {
    font-size: 13px;
    font-weight: 400;
    line-height: 1.6
}

.bs-ObjectList-row .bs-ObjectList-cell.bs-is-empty,
.bs-ObjectList-row .bs-ObjectList-copy.bs-is-empty {
    color: var(--sail-gray200)
}

code {
    color: var(--sail-gray500);
    font-family: Menlo, Consolas, monospace;
    font-size: 12px
}

h1 .bs-is-muted,
h2 .bs-is-muted,
h3 .bs-is-muted,
h4 .bs-is-muted,
h5 .bs-is-muted {
    color: var(--sail-gray600)
}

h1 strong,
h2 strong,
h3 strong,
h4 strong,
h5 strong {
    font-weight: 600
}

p {
    margin: 0;
    line-height: 1.6
}

p+p {
    margin-top: 5px
}

blockquote {
    margin-top: 20px;
    margin-bottom: 20px;
    line-height: 20px
}

.bs-u-hug {
    margin-top: 0
}

.bs-text-redacted {
    opacity: .5;
    font-family: Menlo, Consolas, monospace;
    font-weight: 600;
    position: relative;
    top: -2px
}

.bs-object-id {
    color: var(--sail-gray400)
}

.bs-Icon {
    background-repeat: no-repeat;
    background-size: 20px 20px;
    width: 20px;
    height: 20px;
    position: relative
}

span.bs-Icon {
    vertical-align: text-bottom;
    display: inline-block
}

.bs-Icon--8 {
    background-size: 8px 8px;
    width: 8px;
    height: 8px
}

.bs-Icon--12 {
    background-size: 12px 12px;
    width: 12px;
    height: 12px
}

.bs-Icon--14 {
    background-size: 14px 14px;
    width: 14px;
    height: 14px
}

.bs-Icon--16 {
    background-size: 16px 16px;
    width: 16px;
    height: 16px
}

.bs-Icon--20 {
    background-size: 20px 20px;
    width: 20px;
    height: 20px
}

.bs-Icon--32 {
    background-size: 32px 32px;
    width: 32px;
    height: 32px
}

.bs-Icon--40 {
    background-size: 40px 40px;
    width: 40px;
    height: 40px
}

.bs-Icon--64 {
    background-size: 64px 64px;
    width: 64px;
    height: 64px
}

.bs-Icon--120 {
    background-size: 120px 120px;
    width: 120px;
    height: 120px
}

.bs-Icon--start {
    margin-right: 8px
}

.bs-Icon--end {
    margin-left: 8px
}

.bs-Icon:hover .bs-Popover {
    display: block
}

.bs-Number {
    color: var(--sail-gray800);
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Ubuntu, sans-serif;
    font-size: 24px;
    line-height: 1.6;
    display: inline-block
}

.bs-Number--obscure {
    color: var(--sail-gray500)
}

.bs-Number-decimal {
    margin-left: 2px
}

.bs-Number-decimal-point--comma:after,
.bs-Number-delimiter--comma:after {
    content: ","
}

.bs-Number-decimal-point--period:after,
.bs-Number-delimiter--period:after {
    content: "."
}

.bs-Number-suffix {
    color: var(--sail-gray600);
    text-transform: uppercase;
    margin-left: 3px;
    font-size: 14px;
    font-weight: 500
}

figure.bs-Number>figcaption {
    display: none
}

.bs-Number-percentage {
    vertical-align: baseline;
    font-size: 15px;
    font-weight: 500
}

.bs-Number-initial {
    color: var(--sail-gray400);
    vertical-align: sub;
    font-weight: 300
}

.bs-Number--small,
.bs-Number--small .bs-Number-decimal {
    font-size: 13px;
    font-weight: 600;
    line-height: normal
}

.bs-Number--small .bs-Number-decimal-point {
    display: inline
}

.bs-Number--small .bs-Number-suffix {
    font-size: inherit;
    line-height: inherit;
    vertical-align: text-bottom;
    background: 0 0;
    margin: 0;
    padding: 0
}

.bs-Number--red {
    color: var(--sail-red500)
}

.bs-Spinner-svg {
    transform-origin: 50%;
    width: 16px;
    height: 16px;
    transition-property: opacity, transform;
    transition-timing-function: ease;
    animation: .25s SpinnerAnimationShow, .7s linear infinite SpinnerAnimationRotation;
    display: flex;
    position: relative
}

.bs-Spinner-ellipse {
    fill: #0000;
    stroke: var(--sail-gray400);
    stroke-width: 1.5px;
    stroke-linecap: round;
    stroke-dasharray: 60;
    stroke-dashoffset: 20px
}

.bs-Spinner--stopped .bs-Spinner-svg {
    opacity: 0
}

.bs-Spinner--stopped .bs-Spinner-ellipse {
    animation: none
}

.bs-Spinner--size--large .bs-Spinner-svg {
    width: 24px;
    height: 24px
}

.bs-Spinner--size--small .bs-Spinner-svg {
    width: 12px;
    height: 12px
}

.bs-Spinner--color--white .bs-Spinner-ellipse {
    stroke: #fff
}

.bs-ContentSection-header-copy .bs-Spinner {
    margin: 0 5px
}

@keyframes SpinnerAnimationShow {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes SpinnerAnimationRotation {
    to {
        transform: rotate(360deg)
    }
}

.bs-Spinner--legacy .bs-Spinner-text {
    display: none
}

.bs-Spinner--legacy.bs-Spinner--withText .bs-Spinner-text {
    display: flex
}

.bs-Button {
    -webkit-user-select: auto;
    user-select: auto
}

.bs-Button+.bs-Button,
.bs-Button+.bs-ValidatedForm-button,
.bs-ValidatedForm-button+.bs-Button,
.bs-ValidatedForm-button+.bs-ValidatedForm-button {
    margin-left: 8px
}

.bs-Button--large+.bs-Button--large {
    margin-left: 12px
}

.bs-Button--blue.bs-Button--icon:after,
.bs-Button--blue.bs-Button--icon:before {
    opacity: .9
}

.bs-Button--blue.bs-Button--icon:hover:after,
.bs-Button--blue.bs-Button--icon:hover:before {
    opacity: 1
}

.bs-Button--blue.bs-Button--icon.bs-is-disabled:after,
.bs-Button--blue.bs-Button--icon.bs-is-disabled:before,
.bs-Button--blue.bs-Button--icon:disabled:after,
.bs-Button--blue.bs-Button--icon:disabled:before,
.bs-Button--blue.bs-Button--icon:disabled:active:after,
.bs-Button--blue.bs-Button--icon:disabled:active:before,
.bs-Button--blue.bs-Button--icon:disabled:focus:after,
.bs-Button--blue.bs-Button--icon:disabled:focus:before,
.bs-Button--blue.bs-Button--icon:disabled:hover:after,
.bs-Button--blue.bs-Button--icon:disabled:hover:before {
    opacity: .75
}

.bs-Button--red.bs-Button--icon:after,
.bs-Button--red.bs-Button--icon:before {
    opacity: .9
}

.bs-Button--red.bs-Button--icon:hover:after,
.bs-Button--red.bs-Button--icon:hover:before {
    opacity: 1
}

.bs-Button--red.bs-Button--icon.bs-is-disabled:after,
.bs-Button--red.bs-Button--icon.bs-is-disabled:before,
.bs-Button--red.bs-Button--icon:disabled:after,
.bs-Button--red.bs-Button--icon:disabled:before,
.bs-Button--red.bs-Button--icon:disabled:active:after,
.bs-Button--red.bs-Button--icon:disabled:active:before,
.bs-Button--red.bs-Button--icon:disabled:focus:after,
.bs-Button--red.bs-Button--icon:disabled:focus:before,
.bs-Button--red.bs-Button--icon:disabled:hover:after,
.bs-Button--red.bs-Button--icon:disabled:hover:before {
    opacity: .75
}

.bs-Button--green.bs-Button--icon:after,
.bs-Button--green.bs-Button--icon:before {
    opacity: .9
}

.bs-Button--green.bs-Button--icon:hover:after,
.bs-Button--green.bs-Button--icon:hover:before {
    opacity: 1
}

.bs-Button--green.bs-Button--icon.bs-is-disabled:after,
.bs-Button--green.bs-Button--icon.bs-is-disabled:before,
.bs-Button--green.bs-Button--icon:disabled:after,
.bs-Button--green.bs-Button--icon:disabled:before,
.bs-Button--green.bs-Button--icon:disabled:active:after,
.bs-Button--green.bs-Button--icon:disabled:active:before,
.bs-Button--green.bs-Button--icon:disabled:focus:after,
.bs-Button--green.bs-Button--icon:disabled:focus:before,
.bs-Button--green.bs-Button--icon:disabled:hover:after,
.bs-Button--green.bs-Button--icon:disabled:hover:before {
    opacity: .75
}

.bs-Button--icon {
    padding-left: 25px
}

.bs-Button--icon.bs-Button--icon--right {
    padding-left: 9px;
    padding-right: 25px
}

.bs-Button--smallButton--icon {
    padding-left: 23px
}

.bs-Button--small.bs-Button--icon.bs-Button--icon--right {
    padding-left: 8px;
    padding-right: 23px
}

.bs-Button--large.bs-Button--icon {
    padding-left: 32px
}

.bs-Button--large.bs-Button--icon.bs-Button--icon--right {
    padding-left: 14px;
    padding-right: 32px
}

.bs-Button--icon--right:after,
.bs-Button--icon:before {
    content: "";
    background-position: 0 0;
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    transition: background-image 80ms ease-in, opacity 80ms ease-in;
    display: block;
    position: absolute;
    top: 50%;
    left: 3px
}

.bs-Button--icon--right:before {
    display: none
}

.bs-Button--icon--right:after {
    left: auto;
    right: 3px
}

.bs-Button--small.bs-Button--icon:before {
    left: 2px
}

.bs-Button--small.bs-Button--icon--right:after {
    right: 2px
}

.bs-Button--large.bs-Button--icon:before {
    left: 6px
}

.bs-Button--large.bs-Button--icon--right:after {
    right: 6px
}

.bs-Button--accept:before,
.bs-Button--icon--right.bs-Button--accept:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YWNjZXB0PC90aXRsZT48cGF0aCBkPSJNNy45NDIgMTEuMzc1bC0xLjUyLTEuNjJhLjc5My43OTMgMCAwIDAtMS4xMTgtLjEzNC44MDUuODA1IDAgMCAwLS4xMzQgMS4xMjRsMS44NzggMi45N2ExLjAyNyAxLjAyNyAwIDAgMCAxLjY5OSAwYy4yNjgtLjM2IDUuOTkxLTcuNTYgNS45OTEtNy41NmEuNjQxLjY0MSAwIDAgMC0uMjUtMS4xNDMuNjMzLjYzMyAwIDAgMC0uNjQ0LjI2MmwtNS45MDIgNi4xMDF6IiBmaWxsPSIjNTI1RjdGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=)
}

.bs-Button--accept:active:before,
.bs-Button--accept:focus:hover:before,
.bs-Button--accept:hover:before,
.bs-Button--icon--right.bs-Button--accept:active:after,
.bs-Button--icon--right.bs-Button--accept:focus:hover:after,
.bs-Button--icon--right.bs-Button--accept:hover:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YWNjZXB0LS1ob3ZlcjwvdGl0bGU+PHBhdGggZD0iTTcuOTQyIDExLjM3NWwtMS41Mi0xLjYyYS43OTMuNzkzIDAgMCAwLTEuMTE4LS4xMzQuODA1LjgwNSAwIDAgMC0uMTM0IDEuMTI0bDEuODc4IDIuOTdhMS4wMjcgMS4wMjcgMCAwIDAgMS42OTkgMGMuMjY4LS4zNiA1Ljk5MS03LjU2IDUuOTkxLTcuNTZhLjY0MS42NDEgMCAwIDAtLjI1LTEuMTQzLjYzMy42MzMgMCAwIDAtLjY0NC4yNjJsLTUuOTAyIDYuMTAxeiIgZmlsbD0iIzMyMzI1RCIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)
}

.bs-Button--accept.bs-Button--blue.bs-is-disabled:before,
.bs-Button--accept.bs-Button--blue:before,
.bs-Button--accept.bs-Button--blue:disabled:before,
.bs-Button--accept.bs-Button--blue:hover:before,
.bs-Button--icon--right.bs-Button--accept.bs-Button--blue.bs-is-disabled:after,
.bs-Button--icon--right.bs-Button--accept.bs-Button--blue:after,
.bs-Button--icon--right.bs-Button--accept.bs-Button--blue:disabled:after,
.bs-Button--icon--right.bs-Button--accept.bs-Button--blue:hover:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YWNjZXB0LS1ibHVlPC90aXRsZT48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik03Ljk0MiAxMS4zNzVsLTEuNTItMS42MmEuNzkzLjc5MyAwIDAgMC0xLjExOC0uMTM0LjgwNS44MDUgMCAwIDAtLjEzNCAxLjEyNGwxLjg3OCAyLjk3YTEuMDI3IDEuMDI3IDAgMCAwIDEuNjk5IDBjLjI2OC0uMzYgNS45OTEtNy41NiA1Ljk5MS03LjU2YS42NDEuNjQxIDAgMCAwLS4yNS0xLjE0My42MzMuNjMzIDAgMCAwLS42NDQuMjYybC01LjkwMiA2LjEwMXoiIGZpbGw9IiM1MjVGN0YiLz48cGF0aCBkPSJNNy45NDIgMTEuMzc1bC0xLjUyLTEuNjJhLjc5My43OTMgMCAwIDAtMS4xMTgtLjEzNC44MDUuODA1IDAgMCAwLS4xMzQgMS4xMjRsMS44NzggMi45N2ExLjAyNyAxLjAyNyAwIDAgMCAxLjY5OSAwYy4yNjgtLjM2IDUuOTkxLTcuNTYgNS45OTEtNy41NmEuNjQxLjY0MSAwIDAgMC0uMjUtMS4xNDMuNjMzLjYzMyAwIDAgMC0uNjQ0LjI2MmwtNS45MDIgNi4xMDF6IiBmaWxsPSIjRkZGIi8+PC9nPjwvc3ZnPg==)
}

.bs-Button--icon--right.bs-Button--link.bs-Button--accept:after,
.bs-Button--link.bs-Button--accept:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YWNjZXB0LS1saW5rPC90aXRsZT48cGF0aCBkPSJNNy45NDIgMTEuMzc1bC0xLjUyLTEuNjJhLjc5My43OTMgMCAwIDAtMS4xMTgtLjEzNC44MDUuODA1IDAgMCAwLS4xMzQgMS4xMjRsMS44NzggMi45N2ExLjAyNyAxLjAyNyAwIDAgMCAxLjY5OSAwYy4yNjgtLjM2IDUuOTkxLTcuNTYgNS45OTEtNy41NmEuNjQxLjY0MSAwIDAgMC0uMjUtMS4xNDMuNjMzLjYzMyAwIDAgMC0uNjQ0LjI2MmwtNS45MDIgNi4xMDF6IiBmaWxsPSIjNmY4ZWVmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4K);
    width: 14px;
    height: 14px;
    margin-top: -7px
}

.bs-Button--icon--right.bs-Button--link.bs-Button--accept:active:after,
.bs-Button--icon--right.bs-Button--link.bs-Button--accept:hover:after,
.bs-Button--link.bs-Button--accept:active:before,
.bs-Button--link.bs-Button--accept:hover:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YWNjZXB0LS1ob3ZlcjwvdGl0bGU+PHBhdGggZD0iTTcuOTQyIDExLjM3NWwtMS41Mi0xLjYyYS43OTMuNzkzIDAgMCAwLTEuMTE4LS4xMzQuODA1LjgwNSAwIDAgMC0uMTM0IDEuMTI0bDEuODc4IDIuOTdhMS4wMjcgMS4wMjcgMCAwIDAgMS42OTkgMGMuMjY4LS4zNiA1Ljk5MS03LjU2IDUuOTkxLTcuNTZhLjY0MS42NDEgMCAwIDAtLjI1LTEuMTQzLjYzMy42MzMgMCAwIDAtLjY0NC4yNjJsLTUuOTAyIDYuMTAxeiIgZmlsbD0iIzMyMzI1RCIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)
}

.bs-Button--accept.bs-is-disabled:before,
.bs-Button--accept:disabled:before,
.bs-Button--icon--right.bs-Button--accept.bs-is-disabled:after,
.bs-Button--icon--right.bs-Button--accept:disabled:after,
.bs-Button--link.bs-Button--accept.bs-is-disabled:before,
.bs-Button--link.bs-Button--accept:disabled:before,
.bs-Button--link.bs-Button--icon--right.bs-Button--accept.bs-is-disabled:after,
.bs-Button--link.bs-Button--icon--right.bs-Button--accept:disabled:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YWNjZXB0LS1kaXNhYmxlZDwvdGl0bGU+PHBhdGggZD0iTTcuOTQyIDExLjM3NWwtMS41Mi0xLjYyYS43OTMuNzkzIDAgMCAwLTEuMTE4LS4xMzQuODA1LjgwNSAwIDAgMC0uMTM0IDEuMTI0bDEuODc4IDIuOTdhMS4wMjcgMS4wMjcgMCAwIDAgMS42OTkgMGMuMjY4LS4zNiA1Ljk5MS03LjU2IDUuOTkxLTcuNTZhLjY0MS42NDEgMCAwIDAtLjI1LTEuMTQzLjYzMy42MzMgMCAwIDAtLjY0NC4yNjJsLTUuOTAyIDYuMTAxeiIgZmlsbD0iIzg4OThBQSIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)
}

.bs-Button--link.bs-Button--icon.bs-Button--arrow:not(.bs-Button--icon--right) {
    padding-left: 15px
}

.bs-Button--link.bs-Button--icon--right.bs-Button--arrow {
    padding-right: 15px
}

.bs-Button--arrow:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLWxlZnQ8L3RpdGxlPjxwYXRoIGQ9Ik03LjE4NiAxMC41ODlsMy4yMzQgMy4yNjlhLjY3NS42NzUgMCAwIDEtLjAwNi45NDMuNjUzLjY1MyAwIDAgMS0uOTMzLjAwNkw1LjE4OSAxMC40N0EuNjYuNjYgMCAwIDEgNSAxMGEuNjYuNjYgMCAwIDEgLjE4OS0uNDY5TDkuNDggNS4xOTNhLjY1My42NTMgMCAwIDEgLjkzMy4wMDYuNjc2LjY3NiAwIDAgMSAuMDA2Ljk0M0w3LjM0NyA5LjI0OGg2Ljk4MWEuNjcuNjcgMCAwIDEgLjY3Mi42N2MwIC4zNy0uMjkuNjcxLS42NzIuNjcxSDcuMTg2eiIgZmlsbD0iIzUyNUY3RiIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)
}

.bs-Button--icon--right.bs-Button--arrow:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLXJpZ2h0PC90aXRsZT48cGF0aCBkPSJNMTIuODE0IDEwLjU4OUw5LjU4IDEzLjg1OGEuNjc1LjY3NSAwIDAgMCAuMDA2Ljk0My42NTMuNjUzIDAgMCAwIC45MzMuMDA2bDQuMjkyLTQuMzM4QS42Ni42NiAwIDAgMCAxNSAxMGEuNjYuNjYgMCAwIDAtLjE4OS0uNDY5TDEwLjUyIDUuMTkzYS42NTMuNjUzIDAgMCAwLS45MzMuMDA2LjY3NS42NzUgMCAwIDAtLjAwNi45NDNsMy4wNzMgMy4xMDZINS42NzJhLjY3LjY3IDAgMCAwLS42NzIuNjdjMCAuMzcuMjkuNjcxLjY3Mi42NzFoNy4xNDJ6IiBmaWxsPSIjNTI1RjdGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=)
}

.bs-Button--arrow:active:before,
.bs-Button--arrow:focus:hover:before,
.bs-Button--arrow:hover:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLWxlZnQtLWhvdmVyPC90aXRsZT48cGF0aCBkPSJNNy4xODYgMTAuNTg5bDMuMjM0IDMuMjY5YS42NzUuNjc1IDAgMCAxLS4wMDYuOTQzLjY1My42NTMgMCAwIDEtLjkzMy4wMDZMNS4xODkgMTAuNDdBLjY2LjY2IDAgMCAxIDUgMTBhLjY2LjY2IDAgMCAxIC4xODktLjQ2OUw5LjQ4IDUuMTkzYS42NTMuNjUzIDAgMCAxIC45MzMuMDA2LjY3Ni42NzYgMCAwIDEgLjAwNi45NDNMNy4zNDcgOS4yNDhoNi45ODFhLjY3LjY3IDAgMCAxIC42NzIuNjdjMCAuMzctLjI5LjY3MS0uNjcyLjY3MUg3LjE4NnoiIGZpbGw9IiMzMjMyNUQiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==)
}

.bs-Button--icon--right.bs-Button--arrow:active:after,
.bs-Button--icon--right.bs-Button--arrow:focus:hover:after,
.bs-Button--icon--right.bs-Button--arrow:hover:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLXJpZ2h0LS1ob3ZlcjwvdGl0bGU+PHBhdGggZD0iTTEyLjgxNCAxMC41ODlMOS41OCAxMy44NThhLjY3NS42NzUgMCAwIDAgLjAwNi45NDMuNjUzLjY1MyAwIDAgMCAuOTMzLjAwNmw0LjI5Mi00LjMzOEEuNjYuNjYgMCAwIDAgMTUgMTBhLjY2LjY2IDAgMCAwLS4xODktLjQ2OUwxMC41MiA1LjE5M2EuNjUzLjY1MyAwIDAgMC0uOTMzLjAwNi42NzUuNjc1IDAgMCAwLS4wMDYuOTQzbDMuMDczIDMuMTA2SDUuNjcyYS42Ny42NyAwIDAgMC0uNjcyLjY3YzAgLjM3LjI5LjY3MS42NzIuNjcxaDcuMTQyeiIgZmlsbD0iIzMyMzI1RCIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)
}

.bs-Button--blue.bs-Button--arrow.bs-is-disabled:before,
.bs-Button--blue.bs-Button--arrow:before,
.bs-Button--blue.bs-Button--arrow:disabled:before,
.bs-Button--blue.bs-Button--arrow:hover:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLWxlZnQtLWJsdWU8L3RpdGxlPjxwYXRoIGQ9Ik03LjE4NiAxMC41ODlsMy4yMzQgMy4yNjlhLjY3NS42NzUgMCAwIDEtLjAwNi45NDMuNjUzLjY1MyAwIDAgMS0uOTMzLjAwNkw1LjE4OSAxMC40N0EuNjYuNjYgMCAwIDEgNSAxMGEuNjYuNjYgMCAwIDEgLjE4OS0uNDY5TDkuNDggNS4xOTNhLjY1My42NTMgMCAwIDEgLjkzMy4wMDYuNjc2LjY3NiAwIDAgMSAuMDA2Ljk0M0w3LjM0NyA5LjI0OGg2Ljk4MWEuNjcuNjcgMCAwIDEgLjY3Mi42N2MwIC4zNy0uMjkuNjcxLS42NzIuNjcxSDcuMTg2eiIgZmlsbD0iI0ZGRiIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)
}

.bs-Button--icon--right.bs-Button--blue.bs-Button--accept.bs-is-disabled:after,
.bs-Button--icon--right.bs-Button--blue.bs-Button--accept:disabled:after,
.bs-Button--icon--right.bs-Button--blue.bs-Button--arrow:after,
.bs-Button--icon--right.bs-Button--blue.bs-Button--arrow:hover:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLXJpZ2h0LS1ibHVlPC90aXRsZT48cGF0aCBkPSJNMTIuODE0IDEwLjU4OUw5LjU4IDEzLjg1OGEuNjc1LjY3NSAwIDAgMCAuMDA2Ljk0My42NTMuNjUzIDAgMCAwIC45MzMuMDA2bDQuMjkyLTQuMzM4QS42Ni42NiAwIDAgMCAxNSAxMGEuNjYuNjYgMCAwIDAtLjE4OS0uNDY5TDEwLjUyIDUuMTkzYS42NTMuNjUzIDAgMCAwLS45MzMuMDA2LjY3NS42NzUgMCAwIDAtLjAwNi45NDNsMy4wNzMgMy4xMDZINS42NzJhLjY3LjY3IDAgMCAwLS42NzIuNjdjMCAuMzcuMjkuNjcxLjY3Mi42NzFoNy4xNDJ6IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=)
}

.bs-Button--icon--right.bs-Button--link.bs-Button--arrow:after,
.bs-Button--link.bs-Button--arrow:before {
    width: 10px;
    height: 10px;
    margin-top: -5px
}

.bs-Button--link.bs-Button--arrow:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLWxlZnQtLWxpbms8L3RpdGxlPjxwYXRoIGQ9Ik03LjE4NiAxMC41ODlsMy4yMzQgMy4yNjlhLjY3NS42NzUgMCAwIDEtLjAwNi45NDMuNjUzLjY1MyAwIDAgMS0uOTMzLjAwNkw1LjE4OSAxMC40N0EuNjYuNjYgMCAwIDEgNSAxMGEuNjYuNjYgMCAwIDEgLjE4OS0uNDY5TDkuNDggNS4xOTNhLjY1My42NTMgMCAwIDEgLjkzMy4wMDYuNjc2LjY3NiAwIDAgMSAuMDA2Ljk0M0w3LjM0NyA5LjI0OGg2Ljk4MWEuNjcuNjcgMCAwIDEgLjY3Mi42N2MwIC4zNy0uMjkuNjcxLS42NzIuNjcxSDcuMTg2eiIgZmlsbD0iIzZmOGVlZiIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+Cg==)
}

.bs-Button--icon--right.bs-Button--link.bs-Button--arrow:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLXJpZ2h0LS1saW5rPC90aXRsZT48cGF0aCBkPSJNMTIuODE0IDEwLjU4OUw5LjU4IDEzLjg1OGEuNjc1LjY3NSAwIDAgMCAuMDA2Ljk0My42NTMuNjUzIDAgMCAwIC45MzMuMDA2bDQuMjkyLTQuMzM4QS42Ni42NiAwIDAgMCAxNSAxMGEuNjYuNjYgMCAwIDAtLjE4OS0uNDY5TDEwLjUyIDUuMTkzYS42NTMuNjUzIDAgMCAwLS45MzMuMDA2LjY3NS42NzUgMCAwIDAtLjAwNi45NDNsMy4wNzMgMy4xMDZINS42NzJhLjY3LjY3IDAgMCAwLS42NzIuNjdjMCAuMzcuMjkuNjcxLjY3Mi42NzFoNy4xNDJ6IiBmaWxsPSIjNmY4ZWVmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4K)
}

.bs-Button--link.bs-Button--arrow:active:before,
.bs-Button--link.bs-Button--arrow:hover:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLWxlZnQtLWhvdmVyPC90aXRsZT48cGF0aCBkPSJNNy4xODYgMTAuNTg5bDMuMjM0IDMuMjY5YS42NzUuNjc1IDAgMCAxLS4wMDYuOTQzLjY1My42NTMgMCAwIDEtLjkzMy4wMDZMNS4xODkgMTAuNDdBLjY2LjY2IDAgMCAxIDUgMTBhLjY2LjY2IDAgMCAxIC4xODktLjQ2OUw5LjQ4IDUuMTkzYS42NTMuNjUzIDAgMCAxIC45MzMuMDA2LjY3Ni42NzYgMCAwIDEgLjAwNi45NDNMNy4zNDcgOS4yNDhoNi45ODFhLjY3LjY3IDAgMCAxIC42NzIuNjdjMCAuMzctLjI5LjY3MS0uNjcyLjY3MUg3LjE4NnoiIGZpbGw9IiMzMjMyNUQiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==)
}

.bs-Button--icon--right.bs-Button--link.bs-Button--arrow:active:after,
.bs-Button--icon--right.bs-Button--link.bs-Button--arrow:hover:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLXJpZ2h0LS1ob3ZlcjwvdGl0bGU+PHBhdGggZD0iTTEyLjgxNCAxMC41ODlMOS41OCAxMy44NThhLjY3NS42NzUgMCAwIDAgLjAwNi45NDMuNjUzLjY1MyAwIDAgMCAuOTMzLjAwNmw0LjI5Mi00LjMzOEEuNjYuNjYgMCAwIDAgMTUgMTBhLjY2LjY2IDAgMCAwLS4xODktLjQ2OUwxMC41MiA1LjE5M2EuNjUzLjY1MyAwIDAgMC0uOTMzLjAwNi42NzUuNjc1IDAgMCAwLS4wMDYuOTQzbDMuMDczIDMuMTA2SDUuNjcyYS42Ny42NyAwIDAgMC0uNjcyLjY3YzAgLjM3LjI5LjY3MS42NzIuNjcxaDcuMTQyeiIgZmlsbD0iIzMyMzI1RCIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)
}

.bs-Button--icon--right.bs-Button--white.bs-Button--arrow:after,
.bs-Button--white.bs-Button--arrow:before {
    width: 10px;
    height: 10px;
    margin-top: -4px
}

.bs-Button--icon--right.bs-Button--white.bs-Button--arrow:after,
.bs-Button--icon--right.bs-Button--white.bs-Button--arrow:active:after,
.bs-Button--icon--right.bs-Button--white.bs-Button--arrow:hover:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLXJpZ2h0LS13aGl0ZTwvdGl0bGU+PHBhdGggZD0iTTEyLjgxNCAxMC41ODlMOS41OCAxMy44NThhLjY3NS42NzUgMCAwIDAgLjAwNi45NDMuNjUzLjY1MyAwIDAgMCAuOTMzLjAwNmw0LjI5Mi00LjMzOEEuNjYuNjYgMCAwIDAgMTUgMTBhLjY2LjY2IDAgMCAwLS4xODktLjQ2OUwxMC41MiA1LjE5M2EuNjUzLjY1MyAwIDAgMC0uOTMzLjAwNi42NzUuNjc1IDAgMCAwLS4wMDYuOTQzbDMuMDczIDMuMTA2SDUuNjcyYS42Ny42NyAwIDAgMC0uNjcyLjY3YzAgLjM3LjI5LjY3MS42NzIuNjcxaDcuMTQyeiIgZmlsbD0iI0ZGRiIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)
}

.bs-Button--arrow.bs-is-disabled:before,
.bs-Button--arrow:disabled:before,
.bs-Button--link.bs-Button--arrow.bs-is-disabled:before,
.bs-Button--link.bs-Button--arrow:disabled:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLWxlZnQtLWRpc2FibGVkPC90aXRsZT48cGF0aCBkPSJNNy4xODYgMTAuNTg5bDMuMjM0IDMuMjY5YS42NzUuNjc1IDAgMCAxLS4wMDYuOTQzLjY1My42NTMgMCAwIDEtLjkzMy4wMDZMNS4xODkgMTAuNDdBLjY2LjY2IDAgMCAxIDUgMTBhLjY2LjY2IDAgMCAxIC4xODktLjQ2OUw5LjQ4IDUuMTkzYS42NTMuNjUzIDAgMCAxIC45MzMuMDA2LjY3Ni42NzYgMCAwIDEgLjAwNi45NDNMNy4zNDcgOS4yNDhoNi45ODFhLjY3LjY3IDAgMCAxIC42NzIuNjdjMCAuMzctLjI5LjY3MS0uNjcyLjY3MUg3LjE4NnoiIGZpbGw9IiM4ODk4QUEiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==)
}

.bs-Button--icon--right.bs-Button--arrow.bs-is-disabled:after,
.bs-Button--icon--right.bs-Button--arrow:disabled:after,
.bs-Button--link.bs-Button--icon--right.bs-Button--arrow.bs-is-disabled:after,
.bs-Button--link.bs-Button--icon--right.bs-Button--arrow:disabled:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+YXJyb3ctLXJpZ2h0LS1kaXNhYmxlZDwvdGl0bGU+PHBhdGggZD0iTTEyLjgxNCAxMC41ODlMOS41OCAxMy44NThhLjY3NS42NzUgMCAwIDAgLjAwNi45NDMuNjUzLjY1MyAwIDAgMCAuOTMzLjAwNmw0LjI5Mi00LjMzOEEuNjYuNjYgMCAwIDAgMTUgMTBhLjY2LjY2IDAgMCAwLS4xODktLjQ2OUwxMC41MiA1LjE5M2EuNjUzLjY1MyAwIDAgMC0uOTMzLjAwNi42NzUuNjc1IDAgMCAwLS4wMDYuOTQzbDMuMDczIDMuMTA2SDUuNjcyYS42Ny42NyAwIDAgMC0uNjcyLjY3YzAgLjM3LjI5LjY3MS42NzIuNjcxaDcuMTQyeiIgZmlsbD0iIzg4OThBQSIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)
}

.bs-Button--delete:before,
.bs-Button--icon--right.bs-Button--delete:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+ZGVsZXRlPC90aXRsZT48cGF0aCBkPSJNMTAuMDAxIDExLjEyNWwyLjY4MiAyLjY4MmMuMjg2LjI4Ni43NTUuMjUyIDEuMDY1LS4wNTkuMzEzLS4zMTIuMzM3LS43ODcuMDU5LTEuMDY1TDExLjEyNSAxMGwyLjY4Mi0yLjY4MWMuMjc4LS4yNzguMjU0LS43NTMtLjA1OS0xLjA2Ni0uMzEtLjMxLS43OC0uMzQ0LTEuMDY1LS4wNThMMTAgOC44NzcgNy4zMiA2LjE5NmMtLjI3OC0uMjc4LS43NTMtLjI1NC0xLjA2Ni4wNTgtLjMxLjMxLS4zNDQuNzgtLjA1OCAxLjA2Nkw4Ljg3NyAxMGwtMi42ODEgMi42ODJjLS4yODYuMjg2LS4yNTIuNzU1LjA1OCAxLjA2NS4zMTMuMzEzLjc4OC4zMzcgMS4wNjYuMDU5TDEwIDExLjEyNXoiIGZpbGw9IiM1MjVGN0YiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==)
}

.bs-Button--delete:active:before,
.bs-Button--delete:focus:hover:before,
.bs-Button--delete:hover:before,
.bs-Button--icon--right.bs-Button--delete:active:after,
.bs-Button--icon--right.bs-Button--delete:focus:hover:after,
.bs-Button--icon--right.bs-Button--delete:hover:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+ZGVsZXRlLS1ob3ZlcjwvdGl0bGU+PHBhdGggZD0iTTEwLjAwMSAxMS4xMjVsMi42ODIgMi42ODJjLjI4Ni4yODYuNzU1LjI1MiAxLjA2NS0uMDU5LjMxMy0uMzEyLjMzNy0uNzg3LjA1OS0xLjA2NUwxMS4xMjUgMTBsMi42ODItMi42ODFjLjI3OC0uMjc4LjI1NC0uNzUzLS4wNTktMS4wNjYtLjMxLS4zMS0uNzgtLjM0NC0xLjA2NS0uMDU4TDEwIDguODc3IDcuMzIgNi4xOTZjLS4yNzgtLjI3OC0uNzUzLS4yNTQtMS4wNjYuMDU4LS4zMS4zMS0uMzQ0Ljc4LS4wNTggMS4wNjZMOC44NzcgMTBsLTIuNjgxIDIuNjgyYy0uMjg2LjI4Ni0uMjUyLjc1NS4wNTggMS4wNjUuMzEzLjMxMy43ODguMzM3IDEuMDY2LjA1OUwxMCAxMS4xMjV6IiBmaWxsPSIjMzIzMjVEIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=)
}

.bs-Button--blue.bs-Button--delete:before,
.bs-Button--blue.bs-Button--delete:hover:before,
.bs-Button--delete.bs-Button--blue.bs-is-disabled:before,
.bs-Button--delete.bs-Button--blue:disabled:before,
.bs-Button--icon--right.bs-Button--blue.bs-Button--delete:after,
.bs-Button--icon--right.bs-Button--blue.bs-Button--delete:hover:after,
.bs-Button--icon--right.bs-Button--delete.bs-Button--blue.bs-is-disabled:after,
.bs-Button--icon--right.bs-Button--delete.bs-Button--blue:disabled:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+ZGVsZXRlLS1ibHVlPC90aXRsZT48cGF0aCBkPSJNMTAuMDAxIDExLjEyNWwyLjY4MiAyLjY4MmMuMjg2LjI4Ni43NTUuMjUyIDEuMDY1LS4wNTkuMzEzLS4zMTIuMzM3LS43ODcuMDU5LTEuMDY1TDExLjEyNSAxMGwyLjY4Mi0yLjY4MWMuMjc4LS4yNzguMjU0LS43NTMtLjA1OS0xLjA2Ni0uMzEtLjMxLS43OC0uMzQ0LTEuMDY1LS4wNThMMTAgOC44NzcgNy4zMiA2LjE5NmMtLjI3OC0uMjc4LS43NTMtLjI1NC0xLjA2Ni4wNTgtLjMxLjMxLS4zNDQuNzgtLjA1OCAxLjA2Nkw4Ljg3NyAxMGwtMi42ODEgMi42ODJjLS4yODYuMjg2LS4yNTIuNzU1LjA1OCAxLjA2NS4zMTMuMzEzLjc4OC4zMzcgMS4wNjYuMDU5TDEwIDExLjEyNXoiIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==)
}

.bs-Button--icon--right.bs-Button--link.bs-Button--delete:after,
.bs-Button--link.bs-Button--delete:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+ZGVsZXRlLS1saW5rPC90aXRsZT48cGF0aCBkPSJNMTAuMDAxIDExLjEyNWwyLjY4MiAyLjY4MmMuMjg2LjI4Ni43NTUuMjUyIDEuMDY1LS4wNTkuMzEzLS4zMTIuMzM3LS43ODcuMDU5LTEuMDY1TDExLjEyNSAxMGwyLjY4Mi0yLjY4MWMuMjc4LS4yNzguMjU0LS43NTMtLjA1OS0xLjA2Ni0uMzEtLjMxLS43OC0uMzQ0LTEuMDY1LS4wNThMMTAgOC44NzcgNy4zMiA2LjE5NmMtLjI3OC0uMjc4LS43NTMtLjI1NC0xLjA2Ni4wNTgtLjMxLjMxLS4zNDQuNzgtLjA1OCAxLjA2Nkw4Ljg3NyAxMGwtMi42ODEgMi42ODJjLS4yODYuMjg2LS4yNTIuNzU1LjA1OCAxLjA2NS4zMTMuMzEzLjc4OC4zMzcgMS4wNjYuMDU5TDEwIDExLjEyNXoiIGZpbGw9IiM2ZjhlZWYiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPgo=);
    width: 14px;
    height: 14px;
    margin-top: -7px
}

.bs-Button--icon--right.bs-Button--link.bs-Button--delete:active:after,
.bs-Button--icon--right.bs-Button--link.bs-Button--delete:hover:after,
.bs-Button--link.bs-Button--delete:active:before,
.bs-Button--link.bs-Button--delete:hover:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+ZGVsZXRlLS1ob3ZlcjwvdGl0bGU+PHBhdGggZD0iTTEwLjAwMSAxMS4xMjVsMi42ODIgMi42ODJjLjI4Ni4yODYuNzU1LjI1MiAxLjA2NS0uMDU5LjMxMy0uMzEyLjMzNy0uNzg3LjA1OS0xLjA2NUwxMS4xMjUgMTBsMi42ODItMi42ODFjLjI3OC0uMjc4LjI1NC0uNzUzLS4wNTktMS4wNjYtLjMxLS4zMS0uNzgtLjM0NC0xLjA2NS0uMDU4TDEwIDguODc3IDcuMzIgNi4xOTZjLS4yNzgtLjI3OC0uNzUzLS4yNTQtMS4wNjYuMDU4LS4zMS4zMS0uMzQ0Ljc4LS4wNTggMS4wNjZMOC44NzcgMTBsLTIuNjgxIDIuNjgyYy0uMjg2LjI4Ni0uMjUyLjc1NS4wNTggMS4wNjUuMzEzLjMxMy43ODguMzM3IDEuMDY2LjA1OUwxMCAxMS4xMjV6IiBmaWxsPSIjMzIzMjVEIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=)
}

.bs-Button--delete.bs-is-disabled:before,
.bs-Button--delete:disabled:before,
.bs-Button--icon--right.bs-Button--delete.bs-is-disabled:after,
.bs-Button--icon--right.bs-Button--delete:disabled:after,
.bs-Button--link.bs-Button--delete.bs-is-disabled:before,
.bs-Button--link.bs-Button--delete:disabled:before,
.bs-Button--link.bs-Button--icon--right.bs-Button--delete.bs-is-disabled:after,
.bs-Button--link.bs-Button--icon--right.bs-Button--delete:disabled:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+ZGVsZXRlLS1kaXNhYmxlZDwvdGl0bGU+PHBhdGggZD0iTTEwLjAwMSAxMS4xMjVsMi42ODIgMi42ODJjLjI4Ni4yODYuNzU1LjI1MiAxLjA2NS0uMDU5LjMxMy0uMzEyLjMzNy0uNzg3LjA1OS0xLjA2NUwxMS4xMjUgMTBsMi42ODItMi42ODFjLjI3OC0uMjc4LjI1NC0uNzUzLS4wNTktMS4wNjYtLjMxLS4zMS0uNzgtLjM0NC0xLjA2NS0uMDU4TDEwIDguODc3IDcuMzIgNi4xOTZjLS4yNzgtLjI3OC0uNzUzLS4yNTQtMS4wNjYuMDU4LS4zMS4zMS0uMzQ0Ljc4LS4wNTggMS4wNjZMOC44NzcgMTBsLTIuNjgxIDIuNjgyYy0uMjg2LjI4Ni0uMjUyLjc1NS4wNTggMS4wNjUuMzEzLjMxMy43ODguMzM3IDEuMDY2LjA1OUwxMCAxMS4xMjV6IiBmaWxsPSIjODg5OEFBIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=)
}

.bs-Button--block:before,
.bs-Button--icon--right.bs-Button--block:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+ZGlzYWJsZTwvdGl0bGU+PHBhdGggZD0iTTcuMzI1IDEzLjY5M2E0LjU2IDQuNTYgMCAwIDAgNi4zNjgtNi4zNjhsLTYuMzY4IDYuMzY4em0tMS4wMTgtMS4wMThsNi4zNjgtNi4zNjhhNC41NiA0LjU2IDAgMCAwLTYuMzY4IDYuMzY4ek0xMCAxNmE2IDYgMCAxIDEgMC0xMiA2IDYgMCAwIDEgMCAxMnoiIGZpbGw9IiM1MjVGN0YiLz48L3N2Zz4=)
}

.bs-Button--block:active:before,
.bs-Button--block:focus:hover:before,
.bs-Button--block:hover:before,
.bs-Button--icon--right.bs-Button--block:active:after,
.bs-Button--icon--right.bs-Button--block:focus:hover:after,
.bs-Button--icon--right.bs-Button--block:hover:after {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48dGl0bGU+ZGlzYWJsZS0taG92ZXI8L3RpdGxlPjxwYXRoIGQ9Ik03LjMyNSAxMy42OTNhNC41NiA0LjU2IDAgMCAwIDYuMzY4LTYuMzY4bC02LjM2OCA2LjM2OHptLTEuMDE4LTEuMDE4bDYuMzY4LTYuMzY4YTQuNTYgNC41NiAwIDAgMC02LjM2OCA2LjM2OHpNMTAgMTZhNiA2IDAgMSAxIDAtMTIgNiA2IDAgMCAxIDAgMTJ6IiBmaWxsPSIjMzIzMjVEIi8+PC9zdmc+)
}

.NoJSView {
    z-index: 9999;
    background-color: #e6ebf1;
    flex-direction: column;
    align-items: center;
    padding: 64px;
    display: flex;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.NoJSView-card {
    background-color: #fff;
    border-radius: 4px;
    max-width: 480px;
    overflow: hidden;
    box-shadow: 0 7px 14px #3c42571a, 0 3px 6px #00000012
}

.NoJSView-content {
    flex-flow: column wrap;
    justify-content: center;
    align-items: center;
    padding: 48px;
    display: flex
}

.NoJSView-warningIconContainer {
    padding-bottom: 16px
}

.NoJSView-warningIcon {
    fill: #8792a2;
    width: 64px;
    height: 64px
}

.NoJSView-body,
.NoJSView-buttonLabel {
    font-size: 14px;
    line-height: 20px
}

.NoJSView-title,
.NoJSView-body {
    text-align: center;
    color: #697386;
    display: block
}

.NoJSView-title {
    white-space: normal;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px
}

.NoJSView-linkContainer {
    justify-content: center;
    padding-top: 16px;
    display: flex
}

.NoJSView-link {
    color: #5469d4;
    display: flex
}

.NoJSView-linkIconContainer {
    margin-left: 4px;
    transform: translateY(1.07px)
}

.NoJSView-linkIcon {
    fill: #5469d4;
    width: 12px;
    height: 12px
}

.db-Note .db-NoteEditor-field {
    resize: vertical;
    line-height: 20px
}

.db-NoteEditor-extras {
    flex-wrap: wrap;
    align-items: center;
    row-gap: 8px;
    margin-top: 10px;
    display: flex
}

p.db-NoteEditor-formatting {
    color: #6b7c93;
    flex: 1 0 auto
}

.db-NoteEditor-formatting-item {
    margin-left: 10px
}

.db-NoteEditor-formatting-item:first-child {
    margin-left: 0
}

.db-Note .db-Note-area {
    display: flex;
    position: relative
}

.db-NoteEditor--edit {
    z-index: 2;
    opacity: 0;
    transform-origin: top;
    position: absolute;
    left: 0;
    right: 0;
    transform: scaleY(0)
}

.db-Note--editing .db-NoteEditor--edit {
    opacity: 1;
    transform-origin: top;
    width: 100%;
    position: relative;
    transform: scaleY(1)
}

.db-NoteEditor--edit .db-NoteEditor-area {
    margin: -11px -14px -7px;
    padding: 7px
}

.db-Note--editing .db-NoteEditor-extras {
    opacity: 1
}

.db-Note .db-Note-body {
    z-index: 1;
    opacity: 1;
    width: 100%;
    position: relative
}

.db-Note--editing .db-Note-body {
    position: absolute
}

.db-NoteEditor--new {
    box-sizing: content-box;
    width: 100%;
    margin: -20px;
    padding: 20px;
    overflow: hidden
}

.db-NoteMentionEditor--new {
    box-sizing: content-box;
    width: 100%;
    margin: -20px;
    padding: 20px
}

.db-NoteEditor--new .db-NoteEditor-field {
    z-index: 2;
    margin-top: 20px;
    position: relative
}

.db-NoteMentionEditor-field {
    min-height: 90px
}

.db-NoteMentionEditor--new .db-NoteMentionEditor-field {
    z-index: 2;
    margin-top: 20px;
    position: relative
}

.db-NoteEditor--new .db-NoteEditor-extras {
    z-index: 1;
    position: relative
}

.db-RefundModal-note {
    padding-top: 0
}

.db-RefundModal-note .db-NoteMentionEditor-field {
    overflow-wrap: break-word;
    width: 220px;
    min-height: 50px;
    max-height: 80px;
    overflow: auto
}

li.sublist-payments-list-item .risk-level {
    float: right;
    height: 13px
}

li.sublist-payments-list-item .risk-level em {
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    border-radius: 8px;
    width: 8px;
    height: 8px;
    margin: 2px 15px 0 0;
    display: block
}

li.sublist-payments-list-item .risk-level.elevated em {
    background-color: #e0994c
}

li.sublist-payments-list-item .risk-level.highest em {
    background-color: #e04c4c
}

li.sublist-payments-list-item .status {
    color: #ccc;
    margin-left: 300px;
    position: absolute
}

li.sublist-payments-list-item .status .refund {
    display: none
}

li.sublist-payments-list-item .status.refunded {
    background: 0 0 !important
}

li.sublist-payments-list-item a:hover .refund {
    display: inline
}

li.sublist-payments-list-item a:hover .partial {
    display: none
}

li.sublist-receipts-list-item {
    border-bottom: 1px solid #eee;
    padding: 12px 15px;
    display: block
}

li.sublist-receipts-list-item span.date {
    float: right;
    color: #aaa;
    padding-right: 17px
}

li.sublist-receipts-list-item span.receipt-type {
    color: #888;
    padding-right: 15px
}

li.sublist-receipts-list-item:last-of-type {
    border-bottom: 0
}

.events.sublist.old .failed-item span,
.events.sublist.old .failed-item span.message,
.events.sublist.old .failed-item span.message .highlight {
    color: #993d3d
}

.events.sublist.old .deleted-item span,
.events.sublist.old .deleted-item span.message,
.events.sublist.old .deleted-item span.message .highlight {
    color: #95a1a6
}

.events.sublist.old span {
    color: #95a1a6;
    font-size: 11px
}

.events.sublist.old span.message {
    color: #6f7c82;
    width: 530px;
    display: inline-block
}

.events.sublist.old span.message .highlight {
    color: #008cdd
}

.events.sublist.old span.timestamp {
    text-align: right;
    width: 120px;
    display: inline-block
}

.events.sublist.old span.arrow {
    width: 7px;
    padding-left: 0
}

div.change-default-card-view a.select2-choice {
    width: 283px
}

div.detail-container div.content div.container.cards.sublist {
    padding: 0;
    overflow: hidden
}

div.detail-container div.content div.container.cards.sublist ul {
    margin: 0
}

div.detail-container div.content div.container.cards.sublist .loading,
div.detail-container div.content div.container.cards.sublist .none {
    margin: 15px 0
}

div.detail-container div.content div.container.cards.sublist .card-row,
div.detail-container div.content div.container.cards.sublist .sku-row,
div.detail-container div.content div.container.cards.sublist .return-row {
    border-bottom: 1px solid #eee
}

div.detail-container div.content div.container.cards.sublist .card-row .row,
div.detail-container div.content div.container.cards.sublist .sku-row .row,
div.detail-container div.content div.container.cards.sublist .return-row .row {
    cursor: pointer
}

div.detail-container div.content div.container.cards.sublist .card-row:last-child,
div.detail-container div.content div.container.cards.sublist .sku-row:last-child,
div.detail-container div.content div.container.cards.sublist .return-row:last-child {
    border-bottom: 0
}

div.detail-container div.content div.container.cards.sublist .card-row .row,
div.detail-container div.content div.container.cards.sublist .sku-row .row,
div.detail-container div.content div.container.cards.sublist .return-row .row {
    -webkit-user-select: none;
    user-select: none
}

div.detail-container div.content div.container.cards.sublist .card-row .row span,
div.detail-container div.content div.container.cards.sublist .sku-row .row span,
div.detail-container div.content div.container.cards.sublist .return-row .row span {
    color: #666;
    float: left;
    padding: 12px 15px;
    line-height: 14px;
    display: block;
    overflow: hidden
}

div.detail-container div.content div.container.cards.sublist .card-row .row span.disclosure,
div.detail-container div.content div.container.cards.sublist .sku-row .row span.disclosure,
div.detail-container div.content div.container.cards.sublist .return-row .row span.disclosure {
    width: 20px
}

div.detail-container div.content div.container.cards.sublist .card-row .row span.disclosure em,
div.detail-container div.content div.container.cards.sublist .sku-row .row span.disclosure em,
div.detail-container div.content div.container.cards.sublist .return-row .row span.disclosure em {
    background-image: url(/manage-statics-srv/assets/img/list-view/hideshow-collapsed.5adf1ca4.png);
    background-size: 100% 100%;
    width: 5px;
    height: 7px;
    margin: 3px auto 0;
    display: block
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {

    div.detail-container div.content div.container.cards.sublist .card-row .row span.disclosure em,
    div.detail-container div.content div.container.cards.sublist .sku-row .row span.disclosure em,
    div.detail-container div.content div.container.cards.sublist .return-row .row span.disclosure em {
        background-image: url(/manage-statics-srv/assets/img/list-view/hideshow-collapsed@2x.c9cc6a73.png)
    }
}

div.detail-container div.content div.container.cards.sublist .card-row .row span.type,
div.detail-container div.content div.container.cards.sublist .sku-row .row span.type,
div.detail-container div.content div.container.cards.sublist .return-row .row span.type {
    width: 120px;
    padding-left: 0
}

div.detail-container div.content div.container.cards.sublist .card-row .row span.digits,
div.detail-container div.content div.container.cards.sublist .sku-row .row span.digits,
div.detail-container div.content div.container.cards.sublist .return-row .row span.digits {
    width: 80px
}

div.detail-container div.content div.container.cards.sublist .card-row .row span.digits em,
div.detail-container div.content div.container.cards.sublist .sku-row .row span.digits em,
div.detail-container div.content div.container.cards.sublist .return-row .row span.digits em {
    font-size: 18px;
    font-weight: 700;
    line-height: 0
}

div.detail-container div.content div.container.cards.sublist .card-row .row span.expires,
div.detail-container div.content div.container.cards.sublist .sku-row .row span.expires,
div.detail-container div.content div.container.cards.sublist .return-row .row span.expires {
    width: 50px
}

div.detail-container div.content div.container.cards.sublist .card-row .row span.edit,
div.detail-container div.content div.container.cards.sublist .sku-row .row span.edit,
div.detail-container div.content div.container.cards.sublist .return-row .row span.edit {
    float: right;
    width: 30px
}

div.detail-container div.content div.container.cards.sublist .card-row .row span.delete,
div.detail-container div.content div.container.cards.sublist .sku-row .row span.delete,
div.detail-container div.content div.container.cards.sublist .return-row .row span.delete {
    float: right;
    width: 44px
}

div.detail-container div.content div.container.cards.sublist .card-row .row span.default,
div.detail-container div.content div.container.cards.sublist .sku-row .row span.default,
div.detail-container div.content div.container.cards.sublist .return-row .row span.default {
    float: right
}

div.detail-container div.content div.container.cards.sublist .card-row .row span.default em,
div.detail-container div.content div.container.cards.sublist .sku-row .row span.default em,
div.detail-container div.content div.container.cards.sublist .return-row .row span.default em {
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    color: #fff;
    background: #008cdd;
    border-radius: 3px;
    height: 16px;
    margin: -1px 0;
    padding: 0 6px 0 5px;
    font-size: 9px;
    font-weight: 700;
    line-height: 16px;
    display: none
}

div.detail-container div.content div.container.cards.sublist .card-row div.full-details,
div.detail-container div.content div.container.cards.sublist .sku-row div.full-details,
div.detail-container div.content div.container.cards.sublist .return-row div.full-details {
    display: none
}

div.detail-container div.content div.container.cards.sublist .card-row div.full-details div.container,
div.detail-container div.content div.container.cards.sublist .sku-row div.full-details div.container,
div.detail-container div.content div.container.cards.sublist .return-row div.full-details div.container {
    -ms-border-radius: 0;
    -o-border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    border: 0;
    border-top: 1px solid #eee;
    border-radius: 0;
    margin: 0 15px;
    padding: 15px 0
}

div.detail-container div.content div.container.cards.sublist .card-row.expanded div.full-details,
div.detail-container div.content div.container.cards.sublist .sku-row.expanded div.full-details,
div.detail-container div.content div.container.cards.sublist .return-row.expanded div.full-details {
    display: block
}

div.detail-container div.content div.container.cards.sublist .card-row.expanded .row span.disclosure em,
div.detail-container div.content div.container.cards.sublist .sku-row.expanded .row span.disclosure em,
div.detail-container div.content div.container.cards.sublist .return-row.expanded .row span.disclosure em {
    background-image: url(/manage-statics-srv/assets/img/list-view/hideshow-expanded.a7f77234.png);
    background-size: 100% 100%;
    width: 7px;
    height: 5px;
    margin-top: 4px
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {

    div.detail-container div.content div.container.cards.sublist .card-row.expanded .row span.disclosure em,
    div.detail-container div.content div.container.cards.sublist .sku-row.expanded .row span.disclosure em,
    div.detail-container div.content div.container.cards.sublist .return-row.expanded .row span.disclosure em {
        background-image: url(/manage-statics-srv/assets/img/list-view/hideshow-expanded@2x.4b34bf56.png)
    }
}

div.detail-container div.content div.container.cards.sublist .card-row.default-card span.default em,
div.detail-container div.content div.container.cards.sublist .sku-row.default-card span.default em,
div.detail-container div.content div.container.cards.sublist .return-row.default-card span.default em {
    display: block
}

div.detail-container div.content div.container.banks.sublist {
    padding: 0;
    overflow: hidden
}

div.detail-container div.content div.container.banks.sublist ul {
    margin: 0
}

div.detail-container div.content div.container.banks.sublist .loading,
div.detail-container div.content div.container.banks.sublist .none {
    margin: 15px 0
}

div.detail-container div.content div.container.banks.sublist .bank-row {
    border-bottom: 1px solid #eee
}

div.detail-container div.content div.container.banks.sublist .bank-row .row {
    cursor: pointer
}

div.detail-container div.content div.container.banks.sublist .bank-row:last-child {
    border-bottom: 0
}

div.detail-container div.content div.container.banks.sublist .bank-row .row {
    -webkit-user-select: none;
    user-select: none
}

div.detail-container div.content div.container.banks.sublist .bank-row .row span {
    color: #666;
    float: left;
    padding: 12px 15px;
    line-height: 14px;
    display: block;
    overflow: hidden
}

div.detail-container div.content div.container.banks.sublist .bank-row .row span.disclosure {
    width: 20px
}

div.detail-container div.content div.container.banks.sublist .bank-row .row span.disclosure em {
    background-image: url(/manage-statics-srv/assets/img/list-view/hideshow-collapsed.5adf1ca4.png);
    background-size: 100% 100%;
    width: 5px;
    height: 7px;
    margin: 3px auto 0;
    display: block
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {
    div.detail-container div.content div.container.banks.sublist .bank-row .row span.disclosure em {
        background-image: url(/manage-statics-srv/assets/img/list-view/hideshow-collapsed@2x.c9cc6a73.png)
    }
}

div.detail-container div.content div.container.banks.sublist .bank-row .row span.name {
    width: 120px;
    padding-left: 0
}

div.detail-container div.content div.container.banks.sublist .bank-row .row span.number {
    width: 80px
}

div.detail-container div.content div.container.banks.sublist .bank-row .row span.number em {
    font-size: 18px;
    font-weight: 700;
    line-height: 0
}

div.detail-container div.content div.container.banks.sublist .bank-row .row span.currency {
    text-transform: uppercase;
    width: 50px
}

div.detail-container div.content div.container.banks.sublist .bank-row .row span.verify {
    float: right;
    width: 30px
}

div.detail-container div.content div.container.banks.sublist .bank-row .row span.delete {
    float: right;
    width: 44px
}

div.detail-container div.content div.container.banks.sublist .bank-row .row span.default {
    float: right
}

div.detail-container div.content div.container.banks.sublist .bank-row .row span.default em {
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    color: #fff;
    background: #008cdd;
    border-radius: 3px;
    height: 16px;
    margin: -1px 0;
    padding: 0 6px 0 5px;
    font-size: 9px;
    font-weight: 700;
    line-height: 16px;
    display: none
}

div.detail-container div.content div.container.banks.sublist .bank-row div.full-details {
    display: none
}

div.detail-container div.content div.container.banks.sublist .bank-row div.full-details div.container {
    -ms-border-radius: 0;
    -o-border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    border: 0;
    border-top: 1px solid #eee;
    border-radius: 0;
    margin: 0 15px;
    padding: 15px 0
}

div.detail-container div.content div.container.banks.sublist .bank-row.expanded div.full-details {
    display: block
}

div.detail-container div.content div.container.banks.sublist .bank-row.expanded .row span.disclosure em {
    background-image: url(/manage-statics-srv/assets/img/list-view/hideshow-expanded.a7f77234.png);
    background-size: 100% 100%;
    width: 7px;
    height: 5px;
    margin-top: 4px
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {
    div.detail-container div.content div.container.banks.sublist .bank-row.expanded .row span.disclosure em {
        background-image: url(/manage-statics-srv/assets/img/list-view/hideshow-expanded@2x.4b34bf56.png)
    }
}

div.detail-container div.content div.container.banks.sublist .bank-row.default-bank span.default em {
    display: block
}

li.sublist-orders-list-item .status {
    color: #ccc;
    margin-left: 300px;
    position: absolute
}

.json-tree {
    font-family: monospace;
    position: relative
}

.json-tree a {
    color: #0068de !important;
    padding: 0 !important;
    display: inline !important
}

.json-tree a:hover {
    color: #222 !important;
    text-decoration: underline !important
}

div.currency-amount-input-widget-view {
    position: relative
}

div.currency-amount-input-widget-view span.currency {
    text-align: right;
    text-shadow: 0 1px #fff;
    color: #999;
    -webkit-touch-callout: none;
    width: 45px;
    height: 30px;
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    -o-user-select: none;
    font-size: 14px;
    line-height: 30px;
    position: absolute;
    left: -50px
}

div.currency-amount-input-widget-view span.currency img {
    -moz-user-drag: -moz-none;
    -webkit-user-drag: none;
    user-drag: none
}

div#product_form div.product-form-view form.form div.form_error {
    padding: 30px 30px 0
}

div#product_form div.product-form-view form.form div.section {
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    -ms-box-shadow: inset 0 0 0 1px #0000001a, inset 0 1px 2px #00000036, 0 1px 0 #fff;
    -o-box-shadow: inset 0 0 0 1px #0000001a, inset 0 1px 2px #00000036, 0 1px 0 #fff;
    background: #fff;
    border-radius: 6px;
    margin: 30px;
    padding: 0;
    box-shadow: inset 0 0 0 1px #0000001a, inset 0 1px 2px #00000036, 0 1px #fff
}

div#product_form div.product-form-view form.form div.section h2 {
    color: #292e31;
    background: 0 0;
    border-bottom: 1px solid #e3e3e3;
    margin: 0;
    padding: 15px 21px 14px;
    font-size: 14px;
    font-weight: 600;
    line-height: 17px
}

div#product_form div.product-form-view form.form div.section div.fields {
    padding: 33px 33px 33px 90px
}

div#product_form div.product-form-view form.form div.section div.fields div.full_field div.form-row label.default-label {
    color: #95a1a6;
    text-align: right;
    width: 160px;
    margin: 0;
    padding: 0 15px 0 0;
    font-size: 14px;
    line-height: 30px
}

div#product_form div.product-form-view form.form div.section div.fields div.full_field div.form-row div.text-widget-view input[type=text] {
    width: 150px
}

div#product_form div.product-form-view form.form div.section div.fields div.full_field div.form-row div.text-area-widget-view textarea {
    width: 284px
}

div#product_form div.product-form-view form.form div.section div.fields div.full_field div.form-row div.full_field div.form-row.active label.default-label,
div#product_form div.product-form-view form.form div.section div.fields div.full_field div.form-row div.form-row.donation label.default-label {
    color: #4b5459;
    text-align: left;
    width: 300px;
    padding: 0;
    font-size: 14px;
    line-height: 30px;
    display: inline
}

div#product_form div.product-form-view form.form div.section div.fields div.full_field div.form-row.required label.default-label {
    color: #4b5459 !important
}

div#product_form div.product-form-view form.form div.section div.fields p.explanation {
    color: #95a1a6;
    width: 460px;
    padding-left: 160px;
    font-size: 12px;
    line-height: 17px
}

div#product_form div.product-form-view form.form div.section div.fields span.field_error {
    margin-left: 160px
}

div#product_form div.product-form-view form.form div.section div.fields hr {
    background: #e3e3e3;
    border: 0;
    height: 1px;
    margin: 26px 0 26px 160px
}

div#product_form div.product-form-view form.form div.section.product-images div.add-image {
    z-index: 10;
    height: 30px;
    position: absolute;
    top: 9px;
    right: 20px
}

div#product_form div.product-form-view form.form div.section.product-images div.add-image div.full_field {
    float: left
}

div#product_form div.product-form-view form.form div.section.product-images div.add-image div.full_field div.form-row {
    margin: 0
}

div#product_form div.product-form-view form.form div.section.product-images div.add-image div.full_field div.form-row label.default-label {
    color: #6f7c82;
    text-align: right;
    padding: 0 15px 0 0;
    font-size: 14px;
    line-height: 30px
}

div#product_form div.product-form-view form.form div.section.product-images div.add-image div.full_field div.form-row div.text-widget-view input {
    width: 150px !important
}

div#product_form div.product-form-view form.form div.section.product-images div.add-image button.button {
    float: right;
    height: 30px;
    margin-left: 6px
}

div#product_form div.product-form-view form.form div.section.product-images div.add-image button.button span {
    height: 28px;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 28px
}

div#product_form div.product-form-view form.form div.section.product-images h2 {
    z-index: 5;
    position: relative
}

div#product_form div.product-form-view form.form div.section.product-images div.product-images {
    position: relative
}

div#product_form div.product-form-view form.form div.section.product-images div.product-images-list {
    padding: 20px 0 10px 20px
}

div#product_form div.product-form-view form.form div.section.product-images div.product-images-list div.product-image {
    width: 157px;
    height: 157px;
    margin: 0 10px 10px 0;
    display: inline-block;
    position: relative
}

div#product_form div.product-form-view form.form div.section.product-images div.product-images-list div.product-image:nth-child(4),
div#product_form div.product-form-view form.form div.section.product-images div.product-images-list div.product-image:nth-child(8) {
    margin-right: 0
}

div#product_form div.product-form-view form.form div.section.product-images div.product-images-list div.product-image button.delete-image {
    z-index: 10;
    cursor: pointer;
    text-indent: -9999em;
    background-color: #0000;
    background-image: url(/manage-statics-srv/assets/img/products/remove-image.9f7300b8.png);
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 24px 24px;
    border: 0;
    width: 24px;
    height: 24px;
    font-size: 0;
    position: absolute;
    top: -6px;
    left: -6px
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {
    div#product_form div.product-form-view form.form div.section.product-images div.product-images-list div.product-image button.delete-image {
        background-image: url(/manage-statics-srv/assets/img/products/remove-image@2x.2d66f0e0.png)
    }
}

div#product_form div.product-form-view form.form div.section.product-images div.product-images-list div.product-image img {
    z-index: 5;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    width: 157px;
    height: 157px;
    display: block;
    position: relative
}

div#product_form div.product-form-view form.form div.section.product-images div.product-images-list div.no-images {
    text-align: center;
    padding: 20px 20px 30px 0
}

div#product_form div.product-form-view form.form div.section.product-images div.product-images-list div.no-images h3 {
    color: #4b5459;
    font-size: 14px;
    font-weight: 500;
    line-height: 17px
}

div#product_form div.product-form-view form.form div.section.product-images div.product-images-list div.no-images p {
    color: #6f7c82;
    padding-top: 6px;
    font-size: 13px;
    line-height: 15px
}

div#product_form div.product-form-view form.form div.section.product-shipping {
    overflow: hidden
}

div#product_form div.product-form-view form.form div.section.product-shipping div.product-shipping-fields {
    height: 55px;
    padding-top: 25px
}

div#product_form div.product-form-view form.form div.section.product-shipping div.product-shipping-fields div.product-shipping-field {
    float: left;
    width: 154px;
    margin-right: 6px
}

div#product_form div.product-form-view form.form div.section.product-shipping div.product-shipping-fields div.product-shipping-field:first-child {
    margin-left: 17px
}

div#product_form div.product-form-view form.form div.section.product-shipping div.product-shipping-fields div.product-shipping-field div.full_field {
    float: left;
    width: 134px
}

div#product_form div.product-form-view form.form div.section.product-shipping div.product-shipping-fields div.product-shipping-field div.full_field div.form-row {
    margin: 0
}

div#product_form div.product-form-view form.form div.section.product-shipping div.product-shipping-fields div.product-shipping-field div.full_field div.form-row label.default-label {
    color: #6f7c82;
    text-align: right;
    width: 60px;
    padding: 0 8px 0 0;
    line-height: 30px
}

div#product_form div.product-form-view form.form div.section.product-shipping div.product-shipping-fields div.product-shipping-field div.full_field div.form-row div.text-widget-view input {
    width: 66px
}

div#product_form div.product-form-view form.form div.section.product-shipping div.product-shipping-fields div.product-shipping-field span.product-shipping-unit {
    float: right;
    color: #4b5459;
    width: 15px;
    padding: 0;
    font-size: 14px;
    line-height: 30px;
    display: block
}

div#product_form div.product-form-view form.form div.section.product-shipping p.info {
    color: #95a1a6;
    text-align: center;
    padding: 15px 0 21px;
    font-size: 12px;
    line-height: 17px
}

div#product_form div.product-form-view form.form .product-shipping-fields-header .default-label {
    margin-left: 0
}

.checkbox-group-widget-view {
    width: 400px
}

.checkbox-group-widget-view .checkbox-wrap {
    text-align: left;
    display: block
}

.authentication-form p {
    text-align: center
}

.authentication-form .second-step-phone-failed {
    color: #df0b0b
}

.authentication-form .remember {
    padding-top: 6px
}

div.aligned-checkbox-field-view label.default-label {
    line-height: normal
}

div.orders-shipping-settings-form-view div.from-address {
    margin-left: 155px
}

div.orders-shipping-settings-form-view div.from-address div.postal_code,
div.orders-shipping-settings-form-view div.from-address div.state {
    display: inline-block
}

div.orders-shipping-settings-form-view div.from-address span.field_error {
    margin-left: 0;
    padding-left: 0
}

div.orders-shipping-settings-form-view div.from-address div.state {
    padding-right: 10px
}

div.orders-shipping-settings-form-view div.from-address div.postal_code.compact input[name="from_address[postal_code]"] {
    width: 86px
}

div.orders-shipping-settings-form-view div.from-address input[name="from_address[state]"] {
    width: 50px
}

div.orders-shipping-settings-form-view div.from-address select[name="from_address[country]"] {
    width: 166px
}

.header-view,
#login #header,
#recovery #header,
.page-wrapper #header,
.oauth-page #header {
    -webkit-font-smoothing: antialiased;
    height: 70px
}

.header-view.admin,
#login #header.admin,
#recovery #header.admin,
.page-wrapper #header.admin,
.oauth-page #header.admin {
    padding-top: 41px
}

.header-view h1,
#login #header h1,
#recovery #header h1,
.page-wrapper #header h1,
.oauth-page #header h1 {
    text-indent: -999em;
    float: left;
    -webkit-backface-visibility: hidden;
    width: 72px;
    height: 31px;
    margin: 20px 0 0 -1px
}

.header-view h1 a,
#login #header h1 a,
#recovery #header h1 a,
.page-wrapper #header h1 a,
.oauth-page #header h1 a {
    background-image: url(/manage-statics-srv/assets/img/logo.4506ef73.png);
    background-repeat: no-repeat;
    background-size: 71px 30px;
    height: 31px;
    display: block
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {

    .header-view h1 a,
    #login #header h1 a,
    #recovery #header h1 a,
    .page-wrapper #header h1 a,
    .oauth-page #header h1 a {
        background-image: url(/manage-statics-srv/assets/img/logo@2x.7b7d6fd6.png)
    }
}

.header-view h1 a:hover,
#login #header h1 a:hover,
#recovery #header h1 a:hover,
.page-wrapper #header h1 a:hover,
.oauth-page #header h1 a:hover {
    opacity: .75
}

#login,
.page-wrapper {
    -webkit-font-smoothing: subpixel-antialiased;
    height: 100%;
    min-height: 100%
}

#login div#wrap,
.page-wrapper div#wrap {
    min-height: 100%;
    position: relative
}

#login div#login-background,
#login div#page-background,
#login div#recovery-background,
.page-wrapper div#login-background,
.page-wrapper div#page-background,
.page-wrapper div#recovery-background {
    display: none
}

#login div#header,
.page-wrapper div#header {
    width: 330px;
    height: 180px;
    margin: 0 auto;
    padding-top: 90px
}

#login div#header h1,
.page-wrapper div#header h1 {
    float: none;
    width: 109px;
    height: 45px;
    margin: 0 auto
}

#login div#header h1 a,
.page-wrapper div#header h1 a {
    background-image: url(/manage-statics-srv/assets/img/logo_big.dc011795.png);
    background-size: 100% 100%;
    height: 45px
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {

    #login div#header h1 a,
    .page-wrapper div#header h1 a {
        background-image: url(/manage-statics-srv/assets/img/logo_big@2x.7f163b99.png)
    }
}

#login div.box,
.page-wrapper div.box {
    width: 330px
}

#login h2,
.page-wrapper h2 {
    color: #1e2b32;
    text-align: center;
    background: url(/manage-statics-srv/assets/img/login/divider.8e91867d.png) 50% 100% no-repeat;
    margin-bottom: 17px;
    padding: 17px 24px;
    font-size: 14px;
    font-weight: 500;
    line-height: 21px
}

#login h2.error,
.page-wrapper h2.error {
    color: #cb1a1a;
    font-size: 13px
}

#login h2.home-cta,
.page-wrapper h2.home-cta {
    color: #33325d;
    background: 0 0;
    font-size: 24px;
    font-weight: 400
}

#login .login-view h2,
.page-wrapper .login-view h2 {
    background: 0 0;
    margin: 0;
    padding: 0;
    font-family: inherit
}

#login div#main-body,
.page-wrapper div#main-body {
    background: -moz-linear-gradient(#fff, #f2f6f9);
    background: -ms-linear-gradient(#fff, #f2f6f9);
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    -ms-box-shadow: 0 0 0 1px #0e29391f, 0 2px 5px #0e293970, inset 0 -1px 2px #0e293926;
    -o-box-shadow: 0 0 0 1px #0e29391f, 0 2px 5px #0e293970, inset 0 -1px 2px #0e293926;
    background: linear-gradient(#fff, #f2f6f9);
    background-color: none;
    border-radius: 6px;
    box-shadow: 0 0 0 1px #0e29391f, 0 2px 5px #0e293970, inset 0 -1px 2px #0e293926
}

#login div#main-body a,
.page-wrapper div#main-body a {
    color: #3297d3
}

#login div#main-body a:hover,
.page-wrapper div#main-body a:hover {
    color: #1e2b32
}

#login div#main-body .error-message,
.page-wrapper div#main-body .error-message {
    color: #cb1a1a;
    text-align: center;
    margin-bottom: 20px;
    font-size: 13px
}

#login div#main-body .success-message,
.page-wrapper div#main-body .success-message {
    text-align: center;
    margin-bottom: 20px;
    font-size: 13px
}

#login div#main-body .spinner-holder,
.page-wrapper div#main-body .spinner-holder {
    height: 30px;
    position: relative
}

#login div#main-body div.title,
.page-wrapper div#main-body div.title {
    min-height: 55px;
    overflow: hidden
}

#login div#main-body div.title.canada-notice,
.page-wrapper div#main-body div.title.canada-notice {
    background: url(/manage-statics-srv/assets/img/login/canada/canada-notice.6d0b24f5.png) 50% 27px no-repeat, url(/manage-statics-srv/assets/img/login/divider.8e91867d.png) 50% 100% no-repeat;
    padding-top: 140px;
    font-weight: 400
}

#login div#main-body div.title.canada-notice a,
.page-wrapper div#main-body div.title.canada-notice a {
    text-decoration: underline
}

#login div#main-body div.title.canada-notice strong,
.page-wrapper div#main-body div.title.canada-notice strong {
    font-weight: 700
}

#login div#main-body div.title-short,
.page-wrapper div#main-body div.title-short {
    min-height: initial
}

#login div#main-body div.extra,
.page-wrapper div#main-body div.extra {
    height: auto
}

#login div#main-body div.extra p,
.page-wrapper div#main-body div.extra p {
    text-align: center;
    padding: 0 10px 9px;
    font-size: 12px;
    line-height: 19px
}

#login div#main-body div.extra p strong,
.page-wrapper div#main-body div.extra p strong {
    font-weight: 700
}

#login div#main-body div.extra p.left,
.page-wrapper div#main-body div.extra p.left {
    text-align: left
}

#login div#main-body div.skip,
.page-wrapper div#main-body div.skip {
    color: #999;
    text-align: center;
    margin-top: -22px;
    font-size: 12px
}

#login div#main-body p.message,
.page-wrapper div#main-body p.message {
    text-align: center;
    padding: 0 20px 10px;
    font-size: 14px;
    line-height: 19px
}

#login div#main-body form,
.page-wrapper div#main-body form {
    padding: 14px
}

#login div#main-body form .step,
.page-wrapper div#main-body form .step,
#login div#main-body form p,
.page-wrapper div#main-body form p {
    margin-bottom: 14px
}

#login div#main-body form p:last-child,
.page-wrapper div#main-body form p:last-child {
    margin-bottom: 0
}

#login div#main-body form p.lost-mobile,
#login div#main-body form p.resend-phone-code,
#login div#main-body form p.phone-failed,
.page-wrapper div#main-body form p.lost-mobile,
.page-wrapper div#main-body form p.resend-phone-code,
.page-wrapper div#main-body form p.phone-failed {
    text-align: center;
    font-size: 12px
}

#login div#main-body form p.lost-mobile,
#login div#main-body form p.resend-phone-code,
.page-wrapper div#main-body form p.lost-mobile,
.page-wrapper div#main-body form p.resend-phone-code {
    color: #999
}

#login div#main-body form p.phone-failed,
.page-wrapper div#main-body form p.phone-failed {
    color: #df0b0b
}

#login div#main-body form p.text label,
.page-wrapper div#main-body form p.text label {
    margin: 0 0 3px 1px;
    font-size: 13px;
    display: block
}

#login div#main-body form p.text input,
.page-wrapper div#main-body form p.text input {
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    -ms-box-shadow: inset 0 1px 2px #0000002e;
    -o-box-shadow: inset 0 1px 2px #0000002e;
    -webkit-font-smoothing: antialiased;
    border: 1px solid #bbb;
    border-top-color: #999;
    border-radius: 5px;
    width: 100%;
    padding: 10px 12px;
    font-size: 18px;
    box-shadow: inset 0 1px 2px #0000002e
}

#login div#main-body form p.text input:focus,
.page-wrapper div#main-body form p.text input:focus {
    -ms-box-shadow: inset 0 1px 2px #ddd, 0px 0 5px #28a0e5;
    -o-box-shadow: inset 0 1px 2px #ddd, 0px 0 5px #28a0e5;
    border: 1px solid #28a0e5;
    outline: none;
    box-shadow: inset 0 1px 2px #ddd, 0 0 5px #28a0e5
}

#login div#main-body form p button.button,
#login div#main-body form p a.button,
.page-wrapper div#main-body form p button.button,
.page-wrapper div#main-body form p a.button {
    box-sizing: border-box;
    text-align: center;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    -ms-box-shadow: 0 1px 1px #00000029;
    -o-box-shadow: 0 1px 1px #00000029;
    border-radius: 6px;
    width: 302px;
    height: 44px;
    box-shadow: 0 1px 1px #00000029
}

#login div#main-body form p button.button.grey span,
#login div#main-body form p a.button.grey span,
.page-wrapper div#main-body form p button.button.grey span,
.page-wrapper div#main-body form p a.button.grey span {
    text-shadow: 0 1px #fff
}

#login div#main-body form p button.button span,
#login div#main-body form p a.button span,
.page-wrapper div#main-body form p button.button span,
.page-wrapper div#main-body form p a.button span {
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    text-shadow: 0 1px 1px #00000087;
    border-radius: 5px;
    height: 42px;
    padding: 13px 0 0;
    font-size: 14px;
    line-height: 14px
}

#login div#main-body form p.button-list button.button,
#login div#main-body form p.button-list a.button,
.page-wrapper div#main-body form p.button-list button.button,
.page-wrapper div#main-body form p.button-list a.button {
    margin-bottom: 10px
}

#login div#main-body form p.button-list button.button span,
#login div#main-body form p.button-list a.button span,
.page-wrapper div#main-body form p.button-list button.button span,
.page-wrapper div#main-body form p.button-list a.button span {
    text-shadow: none
}

#login div#main-body form p.forgot,
.page-wrapper div#main-body form p.forgot {
    float: right;
    color: #777;
    padding: 0;
    font-size: 12px;
    line-height: 12px
}

#login div#main-body form p.remember,
.page-wrapper div#main-body form p.remember {
    color: #777;
    text-shadow: 0 1px #fff;
    padding: 5px 0;
    font-size: 12px;
    line-height: 12px
}

#login div#main-body form p.remember input,
.page-wrapper div#main-body form p.remember input {
    vertical-align: middle;
    margin-right: 4px
}

#login div#main-body form p.help,
.page-wrapper div#main-body form p.help {
    color: #777;
    text-shadow: 0 1px #fff;
    text-align: center;
    padding: 0 0 5px;
    font-size: 12px;
    line-height: 16px
}

#login div#main-body form p span.password-strength,
.page-wrapper div#main-body form p span.password-strength {
    position: relative
}

#login div#main-body form p span.password-strength input[type=password],
.page-wrapper div#main-body form p span.password-strength input[type=password] {
    padding-right: 25px
}

#login div#main-body form p span.password-strength span.password-strength-indicator,
.page-wrapper div#main-body form p span.password-strength span.password-strength-indicator {
    width: 5px;
    padding: 0 10px;
    position: absolute;
    top: -5px;
    right: 0
}

#login div#main-body form p span.password-strength span.password-strength-indicator span,
.page-wrapper div#main-body form p span.password-strength span.password-strength-indicator span {
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    background: #ebeef1;
    border-radius: 5px;
    width: 5px;
    height: 5px;
    margin-bottom: 2px;
    display: block
}

#login div#main-body form p span.password-strength span.password-strength-popover,
.page-wrapper div#main-body form p span.password-strength span.password-strength-popover {
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    -ms-box-shadow: 0 0 0 1px #0000000f, 0 8px 13px #0000005c;
    -o-box-shadow: 0 0 0 1px #0000000f, 0 8px 13px #0000005c;
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    background: #fff;
    border-radius: 5px;
    width: 230px;
    padding: 12px 15px;
    display: none;
    position: absolute;
    top: -50px;
    right: -250px;
    box-shadow: 0 0 0 1px #0000000f, 0 8px 13px #0000005c
}

#login div#main-body form p span.password-strength span.password-strength-popover:before,
.page-wrapper div#main-body form p span.password-strength span.password-strength-popover:before {
    content: "";
    background-image: url(/manage-statics-srv/assets/img/login/popover/arrow.8a39235c.png);
    background-size: 19px 54px;
    width: 19px;
    height: 54px;
    display: block;
    position: absolute;
    top: 32px;
    left: -19px
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {

    #login div#main-body form p span.password-strength span.password-strength-popover:before,
    .page-wrapper div#main-body form p span.password-strength span.password-strength-popover:before {
        background-image: url(/manage-statics-srv/assets/img/login/popover/arrow@2x.bcc761e6.png)
    }
}

#login div#main-body form p span.password-strength span.password-strength-popover span,
.page-wrapper div#main-body form p span.password-strength span.password-strength-popover span {
    color: #696f77;
    font-family: Lucida Grande, Lucida Sans Unicode, Geneva, sans-serif;
    font-size: 12px;
    line-height: 17px
}

#login div#main-body form p span.password-strength span.password-strength-popover span.password-strength-popover-status,
.page-wrapper div#main-body form p span.password-strength span.password-strength-popover span.password-strength-popover-status {
    padding-bottom: 3px;
    padding-right: 4px;
    font-weight: 700
}

#login div#main-body form p span.password-strength[data-password-strength="-1"] span.password-strength-popover,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="-1"] span.password-strength-popover {
    top: -27px
}

#login div#main-body form p span.password-strength[data-password-strength="-1"] span.password-strength-popover span.password-strength-popover-status,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="-1"] span.password-strength-popover span.password-strength-popover-status {
    display: none
}

#login div#main-body form p span.password-strength[data-password-strength="-1"] span.password-strength-popover:before,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="-1"] span.password-strength-popover:before {
    top: 22px
}

#login div#main-body form p span.password-strength[data-password-strength="-1"] span.password-strength-indicator,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="-1"] span.password-strength-indicator {
    display: none
}

#login div#main-body form p span.password-strength[data-password-strength="0"] span.password-strength-popover,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="0"] span.password-strength-popover {
    top: -12px
}

#login div#main-body form p span.password-strength[data-password-strength="0"] span.password-strength-popover span.password-strength-popover-status,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="0"] span.password-strength-popover span.password-strength-popover-status {
    color: #e01414;
    padding-bottom: 0
}

#login div#main-body form p span.password-strength[data-password-strength="0"] span.password-strength-popover span.password-strength-popover-explanation,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="0"] span.password-strength-popover span.password-strength-popover-explanation {
    display: none
}

#login div#main-body form p span.password-strength[data-password-strength="0"] span.password-strength-popover:before,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="0"] span.password-strength-popover:before {
    top: -6px
}

#login div#main-body form p span.password-strength[data-password-strength="0"] span.password-strength-indicator,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="0"] span.password-strength-indicator {
    display: none
}

#login div#main-body form p span.password-strength[data-password-strength="1"] span.password-strength-popover span.password-strength-popover-status,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="1"] span.password-strength-popover span.password-strength-popover-status {
    color: #e01414
}

#login div#main-body form p span.password-strength[data-password-strength="1"] span.password-strength-indicator span+span+span+span,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="1"] span.password-strength-indicator span+span+span+span {
    background: #e01414
}

#login div#main-body form p span.password-strength[data-password-strength="2"] span.password-strength-popover span.password-strength-popover-status,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="2"] span.password-strength-popover span.password-strength-popover-status {
    color: #e09115
}

#login div#main-body form p span.password-strength[data-password-strength="2"] span.password-strength-indicator span+span+span,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="2"] span.password-strength-indicator span+span+span {
    background: #e09115
}

#login div#main-body form p span.password-strength[data-password-strength="3"] span.password-strength-popover span.password-strength-popover-status,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="3"] span.password-strength-popover span.password-strength-popover-status {
    color: #6ead09
}

#login div#main-body form p span.password-strength[data-password-strength="3"] span.password-strength-indicator span+span,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="3"] span.password-strength-indicator span+span {
    background: #6ead09
}

#login div#main-body form p span.password-strength[data-password-strength="4"] span.password-strength-popover span.password-strength-popover-status,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="4"] span.password-strength-popover span.password-strength-popover-status {
    color: #008cdd
}

#login div#main-body form p span.password-strength[data-password-strength="4"] span.password-strength-indicator span,
.page-wrapper div#main-body form p span.password-strength[data-password-strength="4"] span.password-strength-indicator span {
    background: #008cdd
}

#login div#main-body form .g-recaptcha,
.page-wrapper div#main-body form .g-recaptcha {
    margin-bottom: 14px
}

#login div.below-box,
.page-wrapper div.below-box {
    color: #6f757c;
    text-align: center;
    text-shadow: 0 1px #ffffff80;
    padding-top: 30px;
    font-size: 12px
}

#login div.below-box a,
.page-wrapper div.below-box a {
    color: #6f757c;
    font-weight: 700;
    text-decoration: underline
}

#login div.below-box a:hover,
.page-wrapper div.below-box a:hover {
    color: #222
}

#login div#footer,
.page-wrapper div#footer {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    border: 0;
    margin-top: 20px;
    padding: 0
}

#login div#footer a,
.page-wrapper div#footer a {
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    -ms-box-shadow: inset 0 1px 0 #ffffff80, 0 1px 0 #ffffff80;
    -o-box-shadow: inset 0 1px 0 #ffffff80, 0 1px 0 #ffffff80;
    color: #455b67;
    text-align: center;
    border: 1px solid #0e29391a;
    border-radius: 6px;
    padding: 15px;
    font-size: 13px;
    font-weight: 700;
    display: block;
    box-shadow: inset 0 1px #ffffff80, 0 1px #ffffff80
}

#login div#footer a:hover,
.page-wrapper div#footer a:hover {
    color: #1e2b32;
    text-decoration: none
}

#login div#footer a strong,
.page-wrapper div#footer a strong {
    color: #3297d3;
    font-weight: 700
}

#login div#footer a span,
.page-wrapper div#footer a span {
    text-decoration: underline
}

html[lang=ja-JP] #login div#footer a,
html[lang=ja-JP] .page-wrapper div#footer a {
    padding: 15px 12px
}

.save-contact-number-interrupt-phone-entry-view div.title p.text {
    margin-bottom: 0 !important;
    font-size: 13px !important
}

.save-contact-number-interrupt-phone-entry-view div.title ul {
    margin: 0 0 14px;
    padding: 0 0 0 24px
}

.save-contact-number-interrupt-phone-entry-view div.title ul li {
    margin-bottom: 4px;
    font-size: 13px;
    line-height: 20px;
    list-style: disc
}

#login #footer_spacer,
#recovery #footer_spacer,
.page-wrapper #footer_spacer {
    height: 60px
}

#login div#bottom,
#recovery div#bottom,
.page-wrapper div#bottom {
    z-index: 1;
    text-align: center;
    width: 100%;
    position: absolute;
    bottom: 20px
}

#login div#bottom li,
#recovery div#bottom li,
.page-wrapper div#bottom li {
    background-image: url(/manage-statics-srv/assets/img/login/bullet.9c7d7ec8.png);
    background-position: 100% 9px;
    background-repeat: no-repeat;
    background-size: 4px 5px;
    padding: 0 20px 0 16px;
    display: inline
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {

    #login div#bottom li,
    #recovery div#bottom li,
    .page-wrapper div#bottom li {
        background-image: url(/manage-statics-srv/assets/img/login/bullet@2x.a4258537.png)
    }
}

#login div#bottom li.first,
#recovery div#bottom li.first,
.page-wrapper div#bottom li.first {
    padding-left: 20px
}

#login div#bottom li.last,
#recovery div#bottom li.last,
.page-wrapper div#bottom li.last {
    background: 0 0;
    padding-right: 16px
}

#login div#bottom a,
#recovery div#bottom a,
.page-wrapper div#bottom a {
    color: #696f77;
    text-shadow: 0 1px #ffffff80;
    font-size: 12px;
    font-weight: 700
}

#login div#bottom a:hover,
#recovery div#bottom a:hover,
.page-wrapper div#bottom a:hover {
    color: #3a3f45;
    text-decoration: underline
}

.register-page #main-body p.secondary-user-account {
    line-height: 21px;
    color: #333 !important;
    padding: 16px 18px 6px !important;
    font-size: 14px !important
}

.register-page #main-body p.secondary-user-account strong {
    font-weight: 700
}

.register-page #main-body form {
    position: relative
}

.register-page #main-body #email_suggestion {
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    -ms-box-shadow: 0 0 0 1px #a69d8666, 0 2px 1px #00000012, 0 3px 8px #00000026;
    -o-box-shadow: 0 0 0 1px #a69d8666, 0 2px 1px #00000012, 0 3px 8px #00000026;
    background: #fefae3;
    border-radius: 5px;
    width: 300px;
    padding: 15px 18px 14px;
    display: none;
    position: absolute;
    top: -65px;
    box-shadow: 0 0 0 1px #a69d8666, 0 2px 1px #00000012, 0 3px 8px #00000026
}

.register-page #main-body #email_suggestion:after {
    content: "";
    background-image: url(/manage-statics-srv/assets/img/register/email-typo/tail.29dd6254.png);
    background-size: 18px 18px;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    display: block;
    position: absolute;
    bottom: -17px;
    left: 50%
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {
    .register-page #main-body #email_suggestion:after {
        background-image: url(/manage-statics-srv/assets/img/register/email-typo/tail@2x.1dccd68b.png)
    }
}

.register-page #main-body #email_suggestion p.email_suggestion-label {
    color: #625e52;
    text-shadow: 0 1px #fff;
    width: 150px;
    margin-bottom: 0;
    font-size: 13px;
    line-height: 16px
}

.register-page #main-body #email_suggestion p.email_suggestion-label strong {
    font-weight: 700
}

.register-page #main-body #email_suggestion p.email_suggestion-label strong.diff {
    text-decoration: underline
}

.register-page #main-body #email_suggestion a.accept {
    position: absolute;
    top: 15px;
    right: 20px
}

.register-page #main-body #email_suggestion a.email_suggestion-ignore {
    text-align: center;
    width: 110px;
    font-size: 11px;
    font-style: italic;
    position: absolute;
    top: 40px;
    right: 20px
}

html.placeholder #login label:not(.TextInput-label) {
    display: none !important
}

html.placeholder #login div.recovery label,
html.placeholder #login div.optout label,
html.placeholder #login p.remember label {
    display: inline !important
}

.code-puncher {
    width: 249px;
    height: 60px;
    margin: 10px auto
}

.code-puncher.disabled {
    opacity: .5
}

.code-puncher .code-minibox-separator {
    float: left;
    text-align: center;
    width: 23px;
    font-size: 20px;
    line-height: 46px
}

.code-puncher .code-minibox-group {
    -ms-box-shadow: inset 0 9px 1px -8px #d3d3d3;
    -o-box-shadow: inset 0 9px 1px -8px #d3d3d3;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    float: left;
    background-color: #fff;
    border: 1px solid #9d9d9d;
    border-radius: 5px;
    height: 45px;
    display: inline-block;
    box-shadow: inset 0 9px 1px -8px #d3d3d3
}

.code-puncher .code-minibox {
    float: left;
    text-align: center;
    background: 0 0;
    border: 1px solid #0000;
    border-right-color: #e6e6e6;
    width: 35px;
    height: 100%;
    margin-top: -1px;
    font-size: 20px
}

.code-puncher .code-minibox:first-child {
    -ms-border-radius: 5px 0 0 5px;
    -o-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px
}

.code-puncher .code-minibox:last-child {
    -ms-border-radius: 0 5px 5px 0;
    -o-border-radius: 0 5px 5px 0;
    border-right: 1px solid #0000;
    border-radius: 0 5px 5px 0
}

.code-puncher .code-minibox:focus {
    background: #fff;
    border: 1px solid #28a0dc;
    box-shadow: 0 0 5px #28a0e5
}

.code-puncher-one-box {
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    -ms-box-shadow: inset 0 1px 2px #0000002e;
    -o-box-shadow: inset 0 1px 2px #0000002e;
    -webkit-font-smoothing: antialiased;
    border: 1px solid #bbb;
    border-top-color: #999;
    border-radius: 5px;
    width: 100%;
    padding: 10px 12px;
    font-size: 18px;
    box-shadow: inset 0 1px 2px #0000002e
}

.code-puncher-one-box:focus {
    -ms-box-shadow: inset 0 1px 2px #ddd, 0px 0 5px #28a0e5;
    -o-box-shadow: inset 0 1px 2px #ddd, 0px 0 5px #28a0e5;
    border: 1px solid #28a0e5;
    outline: none;
    box-shadow: inset 0 1px 2px #ddd, 0 0 5px #28a0e5
}

.centered-spinner {
    margin-left: -12px;
    left: 50%
}

.twofactor-backup-code {
    text-align: center;
    background-color: #f2f6f9;
    border: 1px solid #c9cfd4;
    border-radius: 5px;
    padding: 20px;
    font-family: monaco, monospace;
    font-weight: 700
}

.security-interrupt .sub-header {
    text-align: center;
    color: #777;
    font-size: 13px;
    line-height: 1.3
}

.security-interrupt .centered-spinner {
    padding-top: 10px;
    padding-bottom: 20px
}

.security-interrupt .security-interrupt-box {
    background-color: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 5px;
    margin-bottom: 25px
}

.security-interrupt .security-interrupt-row {
    border-bottom: 1px solid #e6e6e6;
    padding: 11px 21px 11px 15px
}

.security-interrupt .security-interrupt-row:last-child {
    border-bottom: none
}

.security-interrupt .security-interrupt-row h3 {
    color: #777;
    height: 16px;
    margin-bottom: 4px;
    font-size: 13px;
    font-weight: 500
}

.security-interrupt .security-interrupt-row p {
    color: #333;
    font-size: 13px;
    font-weight: 500;
    line-height: 16px
}

.security-interrupt .security-interrupt-row p.not-enabled {
    color: #999;
    font-weight: 400
}

.security-interrupt .security-interrupt-row p.not-enabled-warning {
    color: #e04c4c;
    font-weight: 400
}

.register #stripe-explanation {
    float: left;
    width: 350px;
    padding-left: 10px
}

.register h2 {
    margin: 16px;
    font-size: 22px
}

.register p {
    margin: 16px;
    font-size: 13px
}

.register h2 span {
    font-size: 22px;
    font-weight: 700
}

.register ul {
    margin-left: 16px;
    padding-left: 16px;
    font-size: 13px
}

.register .bullets li {
    padding: .5em;
    list-style-type: disc
}

.register div.box {
    width: 800px !important
}

.register div.box:after {
    content: ".";
    clear: both;
    visibility: hidden;
    height: 0;
    display: block
}

.register form {
    float: right;
    width: 360px
}

.register form .disabled {
    opacity: .7
}

div#test-notification {
    -ms-box-shadow: 0 1px 0 #f8f9fa;
    -o-box-shadow: 0 1px 0 #f8f9fa;
    text-align: center;
    color: #555;
    text-shadow: 0 1px #ffffff4d;
    background: #d4dae0 url(/manage-statics-srv/assets/img/platform/authorize/bar.986ad747.png) 50% 0 repeat-x;
    border-bottom: 1px solid #c7cfd7;
    margin: 0 -10px -10px;
    padding: 14px 10px 10px;
    font-size: 13px;
    box-shadow: 0 1px #f8f9fa
}

div#test-notification strong {
    color: #333;
    font-weight: 700
}

div#test-notification a {
    color: #333;
    background-position-y: 3px;
    margin-left: 5px;
    font-weight: 700;
    text-decoration: underline
}

div#test-notification a:hover {
    color: #000
}

body.oauth-page {
    margin: 0 auto
}

body.oauth-page .bs-ContentSection {
    margin: 0
}

body.oauth-page div#wrap {
    min-height: 100%;
    margin: auto;
    padding: 0 10px;
    position: relative
}

body.oauth-page div#header {
    max-width: 760px;
    margin: 0 auto;
    padding-top: 50px
}

body.oauth-page div#header h1 {
    float: left;
    width: 72px;
    margin: 0;
    display: inline-block;
    position: relative;
    top: -7px
}

body.oauth-page div#header h1 a {
    background-image: url(/manage-statics-srv/assets/img/logo.4506ef73.png);
    background-size: 100% 100%;
    width: 71px;
    height: 30px
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {
    body.oauth-page div#header h1 a {
        background-image: url(/manage-statics-srv/assets/img/logo@2x.7b7d6fd6.png)
    }
}

body.oauth-page div#header p.logged-in {
    float: right;
    color: #72777f;
    text-shadow: 0 1px #fff6;
    background: url(/manage-statics-srv/assets/img/platform/authorize/user.e173eaea.png) 10px no-repeat, #96a0ae26;
    border-radius: 10px;
    margin-bottom: 10px;
    font-size: .75em;
    box-shadow: inset 0 0 1px #96a0ae33, inset 0 1px #96a0ae26, 0 1px #ffffff4d
}

@media screen and (max-width:500px) {
    body.oauth-page div#header p.logged-in {
        width: 100%;
        display: block
    }
}

body.oauth-page div#header p.logged-in span.inner {
    text-align: center;
    padding: 3px 11px 3px 24px;
    display: block
}

body.oauth-page div#header p.logged-in a {
    color: #0066de;
    text-decoration: none
}

body.oauth-page div#header p.logged-in strong {
    font-weight: 700
}

body.oauth-page div.account-application {
    z-index: 10;
    width: 940px;
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
    position: relative
}

@media screen and (max-width:780px) {
    body.oauth-page div.account-application {
        min-width: 300px
    }

    body.oauth-page div.account-application.account-app-beautified {
        max-width: 100%
    }
}

body.oauth-page .react-account-application-view section {
    text-align: inherit
}

body.oauth-page header,
body.oauth-page section {
    text-align: center;
    border-radius: 5px;
    max-width: 760px;
    margin-left: auto;
    margin-right: auto
}

body.oauth-page section {
    clear: both
}

body.oauth-page header {
    z-index: 10;
    clear: right;
    -ms-box-shadow: 0 7px 14px 0 #3b415e1a, 0 3px 6px 0 #00000012;
    -o-box-shadow: 0 7px 14px 0 #3b415e1a, 0 3px 6px 0 #00000012;
    background: #fff;
    margin-bottom: 10px;
    position: relative;
    box-shadow: 0 7px 14px #3b415e1a, 0 3px 6px #00000012
}

body.oauth-page header div.shared-data {
    -ms-border-radius: 0 0 6px 6px;
    -o-border-radius: 0 0 6px 6px;
    background-color: #f8f9fa;
    background-image: url(/manage-statics-srv/assets/img/platform/authorize/access-icon.5c2c568a.png);
    background-position: 50% 20px;
    background-repeat: no-repeat;
    background-size: 33px 33px;
    border-top: 1px solid #e5e8ed;
    border-radius: 0 0 6px 6px;
    padding: 20px;
    position: relative
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {
    body.oauth-page header div.shared-data {
        background-image: url(/manage-statics-srv/assets/img/platform/authorize/access-icon@2x.96d764d8.png)
    }
}

body.oauth-page header div.shared-data p {
    -ms-border-radius: 0;
    -o-border-radius: 0;
    color: #272d32;
    text-shadow: none;
    background: 0 0;
    border-radius: 0;
    padding: 47px 30px 10px;
    font-size: 13px;
    line-height: 19px
}

body.oauth-page header div.shared-data p strong {
    font-size: inherit;
    margin: 0;
    padding: 0;
    display: inline
}

body.oauth-page header.tax-id-info {
    text-shadow: 0 1px #ffffffe6;
    background-color: green;
    padding: 20px 0
}

body.oauth-page header.tax-id-info h3 {
    color: #000;
    text-shadow: 0 1px #ffffffe6;
    font-size: 14px;
    font-weight: 700
}

body.oauth-page header.tax-id-info div {
    color: #737f86;
    margin: 10px 50px;
    font-size: 13px
}

body.oauth-page header h1 {
    height: 130px;
    padding: 15px 0;
    line-height: 100px
}

body.oauth-page header h1 img {
    vertical-align: middle;
    max-width: 500px;
    max-height: 100px
}

@media screen and (max-width:620px) {
    body.oauth-page header h1 img {
        max-width: 90%;
        height: auto
    }
}

body.oauth-page header p {
    color: #737f86;
    text-shadow: 0 1px #ffffffe6;
    background: #f7fafc;
    border-radius: 0 0 5px 5px;
    padding: 0 30px 25px;
    font-size: 13px;
    line-height: 17px
}

@media screen and (min-width:500px) {
    body.oauth-page header p {
        padding-left: 60px;
        padding-right: 60px
    }
}

body.oauth-page header strong {
    color: #272d32;
    margin-bottom: 3px;
    padding-top: 28px;
    font-size: 14px;
    font-weight: 700;
    display: block
}

body.oauth-page header strong a {
    color: #272d32
}

body.oauth-page header strong a:hover {
    color: #08d
}

body.oauth-page section {
    background: -o-linear-gradient(#fff, #f7fbff 10%, #f2f8fd);
    background: -ms-linear-gradient(#fff, #f7fbff 10%, #f2f8fd);
    background: #f2f8fd linear-gradient(#fff, #f7fbff 10%, #f2f8fd);
    margin-top: 20px;
    padding: 18px 0 20px;
    box-shadow: inset 0 -1px 7px #bfd9f3, 0 0 2px #50545c40, 0 1px 1px #50545c59
}

body.oauth-page section.error-section {
    max-width: 450px;
    height: auto
}

body.oauth-page section button {
    margin: 0 3px
}

body.oauth-page section button span {
    position: relative;
    padding-left: 29px !important
}

body.oauth-page section button span:before {
    content: "";
    background: url(/manage-statics-srv/assets/img/platform/authorize/button-icons.f00f7032.png);
    position: absolute;
    top: 8px;
    left: 10px
}

body.oauth-page section button.noicon span {
    padding-left: 16px !important
}

body.oauth-page section button.noicon span:before {
    display: none
}

body.oauth-page section button:-moz-focus-inner {
    border: none;
    padding: 0
}

body.oauth-page section button.grey span:before {
    width: 12px;
    height: 13px
}

body.oauth-page section button.blue span:before {
    background-position: 100% 0;
    width: 15px;
    height: 16px;
    margin-top: -1px
}

body.oauth-page section.choose-account {
    margin-bottom: 10px;
    height: auto !important
}

body.oauth-page section.choose-account p {
    color: #545d63;
    font-size: 13px;
    font-weight: 700
}

body.oauth-page p.submit-note {
    color: #999;
    text-align: center;
    padding-top: 12px;
    font-size: 11px
}

body.oauth-page p.submit-note strong {
    font-weight: 700
}

body.oauth-page div#footer {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    text-align: center;
    background: #0000000a;
    margin-top: 20px;
    padding: 0;
    font-size: 13px
}

body.oauth-page div#footer a {
    color: #4e5359;
    padding: 15px 0;
    font-weight: 700;
    -webkit-transition: color .1s ease-in-out;
    display: block
}

body.oauth-page div#footer a:hover {
    color: #222;
    text-decoration: none
}

body.oauth-page #footer_spacer {
    height: 60px
}

body.oauth-page div#bottom {
    opacity: .5;
    text-align: center;
    z-index: 1;
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0
}

body.oauth-page div#bottom li {
    background: url(/manage-statics-srv/assets/img/login/bullet.9c7d7ec8.png) 100% 9px no-repeat;
    padding: 0 20px 0 16px;
    display: inline
}

body.oauth-page div#bottom li.first {
    padding-left: 20px
}

body.oauth-page div#bottom li.last {
    background: 0 0;
    padding-right: 16px
}

body.oauth-page div#bottom a {
    color: #696f77;
    text-shadow: 0 1px #ffffff80;
    font-size: 12px;
    font-weight: 700;
    -webkit-transition: color .1s ease-in-out
}

body.oauth-page div#bottom a:hover {
    color: #3a3f45;
    text-decoration: none
}

body#oauth-authorize {
    max-width: 100%;
    height: 100%;
    min-height: 100%;
    overflow-x: hidden
}

body#oauth-authorize section {
    position: relative
}

body#oauth-authorize section:not(.error-section) {
    height: 70px;
    overflow: hidden
}

body#oauth-authorize .initial_form,
body#oauth-authorize .secondary_form {
    position: absolute;
    top: 19px;
    bottom: 0;
    left: 0;
    right: 0
}

body#oauth-authorize .animated.initial_form,
body#oauth-authorize .animated.secondary_form {
    -webkit-transition-property: -webkit-transform, opacity;
    -webkit-transition-duration: .4s;
    -webkit-transition-timing-function: cubic-bezier(.455, .03, .515, .955);
    -moz-transition-property: -moz-transform, opacity;
    -moz-transition-duration: .4s;
    -moz-transition-timing-function: cubic-bezier(.455, .03, .515, .955);
    transition-property: transform, opacity;
    transition-duration: .4s;
    transition-timing-function: cubic-bezier(.455, .03, .515, .955)
}

body#oauth-authorize .secondary_form {
    opacity: 0;
    visibility: hidden;
    transform: translate(130px)
}

body#oauth-authorize .secondary_form input {
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-box-shadow: inset 0 1px 2px #0000001f;
    -o-box-shadow: inset 0 1px 2px #0000001f;
    border: 1px solid #aaa;
    border-top-color: #999;
    border-radius: 4px;
    width: 160px;
    padding: 7px 8px 8px;
    font-size: 13px;
    box-shadow: inset 0 1px 2px #0000001f
}

body#oauth-authorize .secondary_form input:focus {
    border-color: #5695db;
    box-shadow: inset 0 1px 2px #0000001f, 0 0 5px #5695db
}

body#oauth-authorize .error {
    color: #cb1a1a;
    padding-left: 12px;
    padding-right: 12px;
    font-size: 13px;
    font-weight: 700
}

@media screen and (max-width:620px) {
    body#oauth-authorize .error {
        margin-bottom: 5px;
        display: block
    }
}

body#oauth-authorize form.confirm .initial_form {
    opacity: 0;
    pointer-events: none;
    transform: translate(-130px)
}

body#oauth-authorize form.confirm .secondary_form {
    opacity: 1;
    pointer-events: inherit;
    transform: translate(0)
}

@media screen and (max-width:620px) {
    body#oauth-authorize section:not(.error-section) {
        height: 108px
    }

    body#oauth-authorize section.error {
        height: 92px
    }

    body#oauth-authorize section.with_email.confirm {
        height: 110px
    }

    body#oauth-authorize section.with_email.confirm.error {
        height: 130px
    }

    body#oauth-authorize .initial_form button[name=deny],
    body#oauth-authorize .initial_form button[name=allow] {
        width: 230px;
        margin-left: -112px;
        position: absolute;
        left: 50%
    }

    body#oauth-authorize .initial_form button[name=allow] {
        margin-top: 38px
    }

    body#oauth-authorize .secondary_form input,
    body#oauth-authorize .secondary_form button {
        width: 208px;
        margin-left: -112px;
        position: absolute;
        left: 50%
    }

    body#oauth-authorize .secondary_form button {
        width: 224px;
        margin-top: 38px
    }

    body#oauth-authorize section.with_email .secondary_form input[name=password] {
        margin-top: 38px
    }

    body#oauth-authorize section.with_email .secondary_form button {
        margin-top: 76px
    }
}

body#oauth-login {
    height: 100%;
    min-height: 100%
}

@media screen and (max-width:500px) {
    body#oauth-login form .secondary_form {
        margin-top: -67px
    }

    body#oauth-login form .secondary_form input {
        margin: auto;
        display: block
    }
}

body#oauth-login form p {
    margin-bottom: 14px
}

body#oauth-login form p.text input {
    -webkit-font-smoothing: antialiased;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-box-shadow: inset 0 1px 2px #0000001f;
    -o-box-shadow: inset 0 1px 2px #0000001f;
    border: 1px solid #bbb;
    border-top-color: #999;
    border-radius: 4px;
    width: 306px;
    padding: 10px 12px;
    font-size: 18px;
    box-shadow: inset 0 1px 2px #0000001f
}

body#oauth-login form p.text input:focus {
    border-color: #5695db;
    box-shadow: inset 0 1px 2px #0000001f, 0 0 5px #5695db
}

body#oauth-login form p.submit button.button {
    -ms-box-shadow: 0 1px 1px #00000029;
    -o-box-shadow: 0 1px 1px #00000029;
    width: 332px;
    height: 44px;
    margin: auto auto 6px;
    box-shadow: 0 1px 1px #00000029
}

body#oauth-login form p.submit button.button span {
    text-shadow: 0 1px 1px #00000087;
    height: 29px;
    padding: 13px 0 0;
    font-size: 14px;
    line-height: 14px
}

body#oauth-login form p.submit button[name=deny] span {
    text-shadow: 0 1px #fff
}

body#oauth-login form p.remember {
    color: #555;
    text-shadow: 0 1px #fff;
    text-align: center;
    padding: 5px 0;
    font-size: 12px;
    line-height: 12px
}

body#oauth-login form p.remember input {
    vertical-align: middle;
    margin-right: 4px
}

@media screen and (max-width:620px) {
    body.oauth-page h2 {
        margin-bottom: 10px !important
    }

    body.oauth-page h2 span.title {
        display: inline-block
    }

    body.oauth-page div#header {
        padding-top: 20px
    }

    body.oauth-page div.section {
        margin: 0 15px !important
    }

    body.oauth-page div#bottom {
        display: none !important
    }

    body.oauth-page #footer_spacer {
        height: 20px !important
    }

    body.oauth-page button.button {
        display: block;
        margin-bottom: 5px !important
    }

    body.oauth-page button.button span {
        display: block
    }
}

@media screen and (max-width:414px) {
    body.oauth-page:not(#oauth-account-app) label {
        float: none !important;
        margin-bottom: 5px !important;
        line-height: 21px !important;
        display: block !important;
        position: relative !important
    }

    body.oauth-page:not(#oauth-account-app) textarea {
        width: 240px !important
    }
}

html.placeholder body#oauth-authorize label {
    display: none !important
}

.recaptcha-container {
    margin-bottom: 20px
}

.recaptcha-container #recaptcha_error {
    color: red;
    margin-top: 10px;
    font-size: 12px;
    display: none
}

.recaptcha-container--outside-form {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    margin-bottom: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    display: flex;
    height: auto !important
}

.recaptcha-container--outside-form .g-recaptcha {
    margin-left: -304px
}

div.ui-datepicker {
    width: 190px;
    display: none
}

div.ui-datepicker div.ui-datepicker-header {
    z-index: 10;
    height: 36px;
    position: relative
}

div.ui-datepicker div.ui-datepicker-header div.ui-datepicker-title {
    text-align: center;
    padding-top: 12px;
    font-family: Arial;
    font-size: 12px;
    font-weight: 700
}

div.ui-datepicker div.ui-datepicker-header a {
    cursor: pointer;
    text-indent: -999em;
    width: 7px;
    height: 9px;
    position: absolute;
    top: 14px
}

div.ui-datepicker div.ui-datepicker-header a.ui-datepicker-prev {
    background-image: url(/manage-statics-srv/assets/img/calendar-view/arrow-left.77448424.png);
    left: 13px
}

div.ui-datepicker div.ui-datepicker-header a.ui-datepicker-next {
    background-image: url(/manage-statics-srv/assets/img/calendar-view/arrow-right.aa2ba265.png);
    right: 13px
}

div.ui-datepicker div.ui-datepicker-header a.ui-state-disabled {
    opacity: 0;
    pointer-events: none
}

div.ui-datepicker div.ui-datepicker-header a:active {
    margin-top: 1px
}

div.ui-datepicker table.ui-datepicker-calendar {
    width: 100%
}

div.ui-datepicker table.ui-datepicker-calendar th,
div.ui-datepicker table.ui-datepicker-calendar td {
    text-align: center;
    font-size: 11px;
    font-weight: 700
}

div.ui-datepicker table.ui-datepicker-calendar th:first-child,
div.ui-datepicker table.ui-datepicker-calendar td:first-child {
    padding-left: 6px
}

div.ui-datepicker table.ui-datepicker-calendar th:last-child,
div.ui-datepicker table.ui-datepicker-calendar td:last-child {
    padding-right: 6px
}

div.ui-datepicker table.ui-datepicker-calendar th.ui-datepicker-unselectable,
div.ui-datepicker table.ui-datepicker-calendar td.ui-datepicker-unselectable {
    padding: 4px
}

div.ui-datepicker table.ui-datepicker-calendar th.ui-datepicker-unselectable:first-child,
div.ui-datepicker table.ui-datepicker-calendar td.ui-datepicker-unselectable:first-child {
    padding-left: 10px
}

div.ui-datepicker table.ui-datepicker-calendar th.ui-datepicker-unselectable:last-child,
div.ui-datepicker table.ui-datepicker-calendar td.ui-datepicker-unselectable:last-child {
    padding-right: 10px
}

div.ui-datepicker table.ui-datepicker-calendar tbody tr:last-child td {
    padding-bottom: 6px
}

div.ui-datepicker table.ui-datepicker-calendar tbody tr:last-child td.ui-datepicker-unselectable {
    padding-bottom: 10px
}

div.ui-datepicker table.ui-datepicker-calendar th {
    color: #666;
    padding: 8px 4px 4px
}

div.ui-datepicker table.ui-datepicker-calendar td a {
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    padding: 4px;
    display: block
}

div.ui-datepicker table.ui-datepicker-calendar td a:hover {
    text-decoration: none
}

div.ui-datepicker.standard {
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    -ms-box-shadow: 0 0 0 1px #0003, 0 4px 13px #00000075;
    -o-box-shadow: 0 0 0 1px #0003, 0 4px 13px #00000075;
    background-color: #fffffff2;
    border-radius: 6px;
    margin-top: 0;
    box-shadow: 0 0 0 1px #0003, 0 4px 13px #00000075
}

div.ui-datepicker.standard div.ui-datepicker-header {
    -ms-border-top-left-radius: 6px;
    -o-border-top-left-radius: 6px;
    -ms-border-top-right-radius: 6px;
    -o-border-top-right-radius: 6px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    margin-bottom: 1px
}

div.ui-datepicker.standard div.ui-datepicker-header div.ui-datepicker-title {
    color: #363636;
    font-family: Helvetica Neue, Arial, Helvetica, sans-serif
}

div.ui-datepicker.standard div.ui-datepicker-header:after {
    content: " ";
    z-index: 3;
    background: url(/manage-statics-srv/assets/img/calendar-view/standard/border.a827c923.png) 50% 0 no-repeat;
    width: 100%;
    height: 1px;
    position: absolute;
    top: 35px
}

div.ui-datepicker.standard table.ui-datepicker-calendar td {
    color: #aaa
}

div.ui-datepicker.standard table.ui-datepicker-calendar td a {
    color: #333
}

div.ui-datepicker.standard table.ui-datepicker-calendar td a:hover {
    color: #000;
    background: #00000013
}

div.ui-datepicker.standard table.ui-datepicker-calendar td a.ui-state-active {
    text-shadow: 0 1px 1px #0000004d;
    background: -moz-linear-gradient(#00000026, #0000);
    background: -ms-linear-gradient(#00000026, #0000);
    -ms-box-shadow: inset 0 1px 0 #0003;
    -o-box-shadow: inset 0 1px 0 #0003;
    background: #5893e1 linear-gradient(#00000026, #0000);
    box-shadow: inset 0 1px #0003;
    color: #fff !important
}

div.ui-datepicker.bezeled {
    background: -moz-linear-gradient(#00000059, #00000073);
    background: -ms-linear-gradient(#00000059, #00000073);
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    -ms-box-shadow: 0 4px 13px #00000075;
    -o-box-shadow: 0 4px 13px #00000075;
    background: linear-gradient(#00000059, #00000073);
    border-radius: 5px;
    margin-top: 3px;
    margin-left: -52px;
    padding: 1px;
    box-shadow: 0 4px 13px #00000075
}

div.ui-datepicker.bezeled div.ui-datepicker-header {
    -ms-box-shadow: inset 0 1px 0 #ffffff70;
    -o-box-shadow: inset 0 1px 0 #ffffff70;
    -ms-border-top-left-radius: 4px;
    -o-border-top-left-radius: 4px;
    -ms-border-top-right-radius: 4px;
    -o-border-top-right-radius: 4px;
    background: #d1983b url(/manage-statics-srv/assets/img/calendar-view/header-background.7536bcaa.png);
    border-bottom: 1px solid #7c5516;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    height: 36px;
    box-shadow: inset 0 1px #ffffff70
}

div.ui-datepicker.bezeled div.ui-datepicker-header:before {
    content: " ";
    z-index: 10;
    background: url(/manage-statics-srv/assets/img/calendar-view/arrow.12285899.png);
    width: 15px;
    height: 9px;
    display: block;
    position: absolute;
    top: -8px;
    left: 87.5px
}

div.ui-datepicker.bezeled div.ui-datepicker-header:after {
    content: " ";
    z-index: 3;
    background: -moz-linear-gradient(#dedede, #efefef);
    background: -ms-linear-gradient(#dedede, #efefef);
    background: linear-gradient(#dedede, #efefef);
    width: 100%;
    height: 2px;
    position: absolute;
    top: 37px
}

div.ui-datepicker.bezeled div.ui-datepicker-header div.ui-datepicker-title {
    color: #222;
    text-shadow: 0 1px 1px #ffffff8f
}

div.ui-datepicker.bezeled table.ui-datepicker-calendar {
    -ms-border-bottom-left-radius: 4px;
    -o-border-bottom-left-radius: 4px;
    -ms-border-bottom-right-radius: 4px;
    -o-border-bottom-right-radius: 4px;
    background: #fff;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    width: 100%
}

div.ui-datepicker.bezeled td {
    color: #ddd
}

div.ui-datepicker.bezeled td a {
    color: #999
}

div.ui-datepicker.bezeled td a:hover {
    color: #444;
    background: #eee
}

div.ui-datepicker.bezeled td a:active {
    background: #ddd
}

.tipsy {
    z-index: 100000;
    padding: 5px;
    font-size: 11px;
    position: absolute
}

.tipsy-inner {
    color: #fff;
    text-align: center;
    background-color: #000;
    border-radius: 3px;
    max-width: 225px;
    padding: 5px 8px 4px
}

.tipsy-arrow {
    border: 5px dashed #000;
    width: 0;
    height: 0;
    line-height: 0;
    position: absolute
}

.tipsy-arrow-n {
    border-bottom-color: #000
}

.tipsy-arrow-s {
    border-top-color: #000
}

.tipsy-arrow-e {
    border-left-color: #000
}

.tipsy-arrow-w {
    border-right-color: #000
}

.tipsy-n .tipsy-arrow {
    border-top: none;
    border-bottom-style: solid;
    border-left-color: #0000;
    border-right-color: #0000;
    margin-left: -5px;
    top: 0;
    left: 50%
}

.tipsy-nw .tipsy-arrow {
    border-top: none;
    border-bottom-style: solid;
    border-left-color: #0000;
    border-right-color: #0000;
    top: 0;
    left: 10px
}

.tipsy-ne .tipsy-arrow {
    border-top: none;
    border-bottom-style: solid;
    border-left-color: #0000;
    border-right-color: #0000;
    top: 0;
    right: 10px
}

.tipsy-s .tipsy-arrow {
    border-top-style: solid;
    border-bottom: none;
    border-left-color: #0000;
    border-right-color: #0000;
    margin-left: -5px;
    bottom: 0;
    left: 50%
}

.tipsy-sw .tipsy-arrow {
    border-top-style: solid;
    border-bottom: none;
    border-left-color: #0000;
    border-right-color: #0000;
    bottom: 0;
    left: 10px
}

.tipsy-se .tipsy-arrow {
    border-top-style: solid;
    border-bottom: none;
    border-left-color: #0000;
    border-right-color: #0000;
    bottom: 0;
    right: 10px
}

.tipsy-e .tipsy-arrow {
    border-top-color: #0000;
    border-bottom-color: #0000;
    border-left-style: solid;
    border-right: none;
    margin-top: -5px;
    top: 50%;
    right: 0
}

.tipsy-w .tipsy-arrow {
    border-top-color: #0000;
    border-bottom-color: #0000;
    border-left: none;
    border-right-style: solid;
    margin-top: -5px;
    top: 50%;
    left: 0
}

.select2-container {
    vertical-align: middle;
    zoom: 1;
    margin: 0;
    display: inline-block;
    position: relative
}

.select2-container,
.select2-drop,
.select2-search,
.select2-search input {
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box
}

.select2-container .select2-choice {
    background: -moz-linear-gradient(#f7f8fa, #eff1f4);
    background: -ms-linear-gradient(#f7f8fa, #eff1f4);
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-box-shadow: 0 1px 0 #00000013, inset 0 1px 0 #fff;
    -o-box-shadow: 0 1px 0 #00000013, inset 0 1px 0 #fff;
    color: #555;
    text-align: left;
    text-shadow: 0 1px #fff;
    background: #f6f9fc linear-gradient(#f7f8fa, #eff1f4);
    border: 1px solid #adb2bb;
    border-top-color: #bfc3ca;
    border-radius: 4px;
    min-width: 150px;
    height: 31px;
    padding-left: 10px;
    padding-right: 26px;
    font-size: 13px;
    font-weight: 700;
    line-height: 29px;
    text-decoration: none;
    display: block;
    position: relative;
    box-shadow: 0 1px #00000013, inset 0 1px #fff
}

.select2-container .select2-choice .select2-arrow {
    background-image: url(/manage-statics-srv/assets/img/widgets/select2/arrow-down.6dabfd0e.png);
    background-size: 7px 5px;
    width: 7px;
    height: 5px;
    margin-top: -2px;
    display: block;
    position: absolute;
    top: 50%;
    right: 12px
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {
    .select2-container .select2-choice .select2-arrow {
        background-image: url(/manage-statics-srv/assets/img/widgets/select2/arrow-down@2x.0d3a6a82.png)
    }
}

.select2-container .select2-choice span {
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    overflow: hidden
}

.select2-container .select2-choice abbr {
    cursor: pointer;
    background: url(/manage-statics-srv/assets/img/select2.bd889e27.png) 100% 0 no-repeat;
    border: 0;
    outline: 0;
    width: 12px;
    height: 12px;
    font-size: 1px;
    text-decoration: none;
    display: none;
    position: absolute;
    top: 8px;
    right: 24px
}

.select2-container .select2-choice abbr:hover {
    cursor: pointer;
    background-position: right -11px
}

.select2-container.select2-container-active .select2-choice {
    -ms-box-shadow: 0 0 5px #28a0e5, inset 0 1px 0 #fff;
    -o-box-shadow: 0 0 5px #28a0e5, inset 0 1px 0 #fff;
    border-color: #28a0e5;
    box-shadow: 0 0 5px #28a0e5, inset 0 1px #fff
}

.select2-container.select2-dropdown-open .select2-choice {
    -ms-border-radius: 0;
    -o-border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    z-index: 9999;
    background: 0 0;
    border-color: #0000;
    border-radius: 0
}

.select2-container.select2-drop-above .select2-choice .select2-arrow {
    background-image: url(/manage-statics-srv/assets/img/widgets/select2/arrow-up.d1e4c146.png);
    background-size: 7px 5px
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {
    .select2-container.select2-drop-above .select2-choice .select2-arrow {
        background-image: url(/manage-statics-srv/assets/img/widgets/select2/arrow-up@2x.264b6474.png)
    }
}

.select2-container.select2-container-disabled .select2-choice {
    opacity: .5
}

label+.dropdown-search-widget-view .select2-container .select2-choice {
    min-width: 128px;
    max-width: 142px
}

.select2-container.select2-allowclear .select2-choice abbr {
    display: inline-block
}

.select2-drop-mask {
    opacity: 0;
    z-index: 9998;
    width: auto;
    min-width: 100%;
    height: auto;
    min-height: 100%;
    filter: alpha(opacity=0);
    background-color: #fff;
    border: 0;
    margin: 0;
    padding: 0;
    position: fixed;
    top: 0;
    left: 0
}

.select2-drop {
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-box-shadow: 0 0 0 1px #0000000f, 0 8px 13px #0000005c;
    -o-box-shadow: 0 0 0 1px #0000000f, 0 8px 13px #0000005c;
    z-index: 9998;
    border-radius: 4px;
    width: 100%;
    margin-top: -30px;
    padding-top: 30px;
    position: absolute;
    top: 100%;
    box-shadow: 0 0 0 1px #0000000f, 0 8px 13px #0000005c
}

.select2-drop.select2-drop-auto-width {
    width: auto
}

.select2-drop.select2-drop-above {
    margin-top: 30px;
    padding-top: 0;
    padding-bottom: 30px
}

.select2-drop.select2-drop-above .select2-search,
.select2-drop.select2-drop-above .select2-results {
    border-top: 0;
    border-bottom: 1px solid #f0f2f2
}

.select2-drop.select2-drop-above .select2-search {
    -ms-border-radius: 5px 5px 0 0;
    -o-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0
}

.select2-drop .select2-search {
    white-space: nowrap;
    z-index: 10000;
    background: #fff;
    border-top: 1px solid #f0f2f2;
    width: 100%;
    margin: 0;
    padding: 5px 7px;
    display: inline-block;
    position: relative
}

.select2-drop .select2-search input {
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    -ms-box-shadow: inset 0 1px 1px #0000001f;
    -o-box-shadow: inset 0 1px 1px #0000001f;
    -webkit-font-smoothing: antialiased;
    color: #555;
    background-color: #fff;
    background-image: url(/manage-statics-srv/assets/img/widgets/select2/search-icon.a1f59420.png);
    background-position: 9px;
    background-repeat: no-repeat;
    background-size: 13px 13px;
    border: 1px solid #ccd0d6;
    border-radius: 20px;
    outline: 0;
    width: 100%;
    margin: 0;
    padding: 4px 8px 4px 29px;
    font-size: 13px;
    box-shadow: inset 0 1px 1px #0000001f;
    height: auto !important
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {
    .select2-drop .select2-search input {
        background-image: url(/manage-statics-srv/assets/img/widgets/select2/search-icon@2x.fbbe2942.png)
    }
}

.select2-drop .select2-search input::-webkit-input-placeholder {
    color: #a1adb3
}

.select2-drop .select2-search input:-moz-placeholder {
    color: #a1adb3
}

.select2-drop .select2-search input::-moz-placeholder {
    color: #a1adb3
}

.select2-drop .select2-search input:-ms-input-placeholder {
    color: #a1adb3
}

.select2-drop .select2-search input:active,
.select2-drop .select2-search input:focus {
    -ms-box-shadow: inset 0 1px 1px #0000001f, 0 0 5px #28a0e5;
    -o-box-shadow: inset 0 1px 1px #0000001f, 0 0 5px #28a0e5;
    color: #6f7c82;
    background-image: url(/manage-statics-srv/assets/img/widgets/select2/search-icon-active.3c79506a.png);
    background-size: 13px 13px;
    border-color: #28a0e5;
    box-shadow: inset 0 1px 1px #0000001f, 0 0 5px #28a0e5
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {

    .select2-drop .select2-search input:active,
    .select2-drop .select2-search input:focus {
        background-image: url(/manage-statics-srv/assets/img/widgets/select2/search-icon-active@2x.abd9cd23.png)
    }
}

.select2-drop .select2-results {
    -ms-border-radius: 0 0 5px 5px;
    -o-border-radius: 0 0 5px 5px;
    background: #fff;
    border-top: 1px solid #f0f2f2;
    border-radius: 0 0 5px 5px;
    max-height: 200px;
    padding: 5px 0;
    position: relative;
    overflow-x: hidden;
    overflow-y: auto
}

.select2-drop .select2-results li {
    color: #6f7c82;
    font-family: Lucida Grande, Lucida Sans Unicode, Geneva, sans-serif;
    font-size: 12px;
    list-style: none;
    display: block
}

.select2-drop .select2-results li .select2-result-label {
    cursor: pointer;
    border-top: 1px solid #0000;
    border-bottom: 1px solid #0000;
    padding: 6px 9px;
    line-height: 15px;
    position: relative
}

.select2-drop .select2-results li.select2-no-results,
.select2-drop .select2-results li.select2-searching,
.select2-drop .select2-results li.select2-selection-limit {
    text-align: center;
    padding: 18px 9px
}

.select2-drop .select2-results li.select2-highlighted .select2-result-label {
    background: -moz-linear-gradient(#3ca8e5, #1487d1);
    background: -ms-linear-gradient(#3ca8e5, #1487d1);
    color: #fff;
    text-shadow: 0 -1px #0000000d;
    background: #008cdd linear-gradient(#3ca8e5, #1487d1);
    border-top-color: #3da0d9;
    border-bottom-color: #1487d1
}

.select2-drop .select2-results li.select2-result-with-children>.select2-result-label {
    color: #c6c9cb;
    text-shadow: none;
    background: 0 0;
    border: 0;
    padding: 4px 9px;
    font-size: 10px;
    line-height: 13px
}

.select2-drop .select2-results li.select2-result-with-children ul.select2-result-sub {
    border-bottom: 1px solid #f0f2f2
}

.select2-drop .select2-results li.select2-result-with-children:last-child ul.select2-result-sub {
    border-bottom: 0
}

.select2-drop ul.select2-result-sub {
    margin: 0
}

.select2-drop .select2-result-currency span,
.select2-drop .select2-result-card span,
.select2-drop .select2-result-plan span,
.select2-drop .select2-result-subscription span,
.select2-drop .select2-result-coupon span,
.select2-drop .select2-result-livemode span,
.select2-drop .select2-result-bank span,
.select2-drop .select2-result-alipay span {
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 15px;
    display: block;
    overflow: hidden
}

.select2-drop .select2-result-currency.select2-highlighted span,
.select2-drop .select2-result-card.select2-highlighted span,
.select2-drop .select2-result-plan.select2-highlighted span,
.select2-drop .select2-result-subscription.select2-highlighted span,
.select2-drop .select2-result-coupon.select2-highlighted span,
.select2-drop .select2-result-livemode.select2-highlighted span,
.select2-drop .select2-result-bank.select2-highlighted span,
.select2-drop .select2-result-alipay.select2-highlighted span {
    color: #fff
}

.select2-drop .select2-result-currency .currency-iso {
    float: left;
    width: 30px
}

.select2-drop .select2-result-currency .currency-name {
    color: #a1adb3;
    padding-left: 6px
}

.select2-drop .select2-result-card .card-name {
    font-weight: 700
}

.select2-drop .select2-result-card .card-last4 {
    float: left;
    color: #a1adb3;
    width: 65px
}

.select2-drop .select2-result-card .card-last4:before {
    content: "••••"
}

.select2-drop .select2-result-card .card-expiration {
    color: #a1adb3;
    text-align: right;
    font-size: 10px;
    font-style: italic
}

.select2-drop .select2-result-card.wide {
    text-align: right
}

.select2-drop .select2-result-card.wide .card-name {
    float: left;
    text-align: left;
    width: 130px
}

.select2-drop .select2-result-card.wide .card-last4 {
    float: none;
    padding-right: 6px;
    display: inline
}

.select2-drop .select2-result-card.wide .card-expiration {
    display: inline
}

.select2-drop .select2-result-card.wide .card-expiration:before {
    content: "("
}

.select2-drop .select2-result-card.wide .card-expiration:after {
    content: ")"
}

.select2-drop .select2-result-alipay .description {
    font-weight: 700
}

.select2-drop .select2-result-alipay .username {
    color: #a1adb3;
    text-align: right
}

.select2-drop .select2-result-plan .plan-name {
    font-weight: 700
}

.select2-drop .select2-result-plan .plan-price {
    color: #a1adb3
}

.select2-drop .select2-result-plan .plan-trial {
    color: #a1adb3;
    font-size: 10px;
    font-style: italic
}

.select2-drop .select2-result-subscription .plan-name {
    font-weight: 700;
    display: inline
}

.select2-drop .select2-result-subscription .plan-price {
    float: right;
    display: inline
}

.select2-drop .select2-result-subscription .subscription-option-details {
    opacity: .5
}

.select2-drop .select2-result-subscription .subscription-id {
    color: #a1adb3;
    font-size: 10px;
    font-style: italic
}

.select2-drop .select2-result-coupon .coupon-id {
    font-weight: 700
}

.select2-drop .select2-result-coupon .coupon-description {
    color: #a1adb3
}

.select2-drop .select2-result-bank .bank-name {
    font-weight: 700
}

.select2-drop .select2-result-bank .bank-accountNumber {
    float: left;
    color: #a1adb3;
    width: 65px
}

.select2-drop .select2-result-bank .bank-currency {
    text-align: right;
    color: #a1adb3;
    text-transform: uppercase
}

.select2-offscreen,
.select2-offscreen:focus {
    clip: rect(0 0 0 0) !important;
    border: 0 !important;
    outline: 0 !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    overflow: hidden !important
}

.select2-display-none {
    display: none
}

.select2-hidden-accessible {
    clip: rect(0 0 0 0);
    border: 0;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    overflow: hidden
}

.select2-measure-scrollbar {
    width: 100px;
    height: 100px;
    position: absolute;
    top: -10000px;
    left: -10000px;
    overflow: scroll
}

.subscription-form-view .dropdown-search-widget-view.plan .select2-container .select2-choice {
    max-width: 250px
}

.subscription-form-view .dropdown-search-widget-view.coupon .select2-container .select2-choice {
    max-width: 130px
}

.change-coupon-view .dropdown-search-widget-view .select2-container .select2-choice {
    max-width: 280px
}

.orders-settings-livemode-view .select2-container .select2-choice {
    min-width: 128px
}

.orders-settings-livemode-view .select2-container .select2-choice span.select2-livemode-false {
    color: #e0994c;
    padding-left: 19px
}

.orders-settings-livemode-view .select2-container .select2-choice span.select2-livemode-false:before {
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    content: "";
    background-color: #e0994c;
    border-radius: 6px;
    width: 6px;
    height: 6px;
    display: block;
    position: absolute;
    top: 12px;
    left: 13px
}

.orders-settings-livemode-view .select2-container .select2-choice span.select2-livemode-true {
    color: #50a92f;
    padding-left: 19px
}

.orders-settings-livemode-view .select2-container .select2-choice span.select2-livemode-true:before {
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    content: "";
    background-color: #50a92f;
    border-radius: 6px;
    width: 6px;
    height: 6px;
    display: block;
    position: absolute;
    top: 12px;
    left: 13px
}

.select2-container-multi .select2-choices {
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-box-shadow: inset 0 1px 2px #0000002e;
    -o-box-shadow: inset 0 1px 2px #0000002e;
    cursor: text;
    color: #000;
    -webkit-font-smoothing: antialiased;
    background-color: #fff;
    border: 1px solid #bbb;
    border-top-color: #999;
    border-radius: 4px;
    height: 1%;
    margin: 0;
    padding: 0;
    font-size: 14px;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 1px 2px #0000002e;
    height: auto !important
}

.select2-locked {
    padding: 3px 5px !important
}

.select2-container-multi .select2-choices {
    min-height: 26px
}

.select2-container-multi.select2-container-active .select2-choices {
    -ms-box-shadow: inset 0 1px 2px #ddd, 0px 0 5px #28a0e5;
    -o-box-shadow: inset 0 1px 2px #ddd, 0px 0 5px #28a0e5;
    border: 1px solid #28a0e5;
    outline: none;
    box-shadow: inset 0 1px 2px #ddd, 0 0 5px #28a0e5
}

.select2-container-multi .select2-choices li {
    float: left;
    list-style: none
}

html[dir=rtl] .select2-container-multi .select2-choices li {
    float: right
}

.select2-container-multi .select2-choices .select2-search-field {
    white-space: nowrap;
    margin: 0;
    padding: 0
}

.select2-container-multi .select2-choices .select2-search-field input {
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 0;
    outline: 0;
    margin: 1px 0;
    padding: 5px;
    font-family: sans-serif;
    font-size: 100%;
    background: 0 0 !important
}

.select2-default {
    color: #999 !important
}

.select2-container-multi .select2-choices .select2-search-choice {
    color: #333;
    cursor: default;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#eeeeee", endColorstr="#f4f4f4", GradientType=0);
    background-color: #e4e4e4;
    background-image: linear-gradient(#eee 0%, #e8e8e8 48%, #f0f0f0 50%, #f4f4f4 80%);
    background-clip: padding-box;
    border: 1px solid #aaa;
    border-radius: 3px;
    margin: 3px 0 3px 5px;
    padding: 3px 5px 3px 18px;
    line-height: 13px;
    position: relative;
    box-shadow: inset 0 0 2px #fff, 0 1px #0000000d
}

html[dir=rtl] .select2-container-multi .select2-choices .select2-search-choice {
    margin-left: 0;
    margin-right: 5px
}

.select2-container-multi .select2-choices .select2-search-choice .select2-chosen {
    cursor: default
}

.select2-container-multi .select2-choices .select2-search-choice-focus {
    background: #d4d4d4
}

.select2-search-choice-close {
    background: url(/manage-statics-srv/assets/img/select2.bd889e27.png) 100% 0 no-repeat;
    outline: none;
    width: 12px;
    height: 13px;
    font-size: 1px;
    display: block;
    position: absolute;
    top: 4px;
    right: 3px
}

html[dir=rtl] .select2-search-choice-close {
    left: 3px;
    right: auto
}

.select2-container-multi .select2-search-choice-close {
    left: 3px
}

.select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close:hover,
.select2-container-multi .select2-choices .select2-search-choice-focus .select2-search-choice-close {
    background-position: right -11px
}

.cm-s-stripe.CodeMirror {
    color: #3c4257;
    background-color: #fff;
    line-height: 1.4375
}

.cm-s-stripe.CodeMirror pre,
.cm-s-stripe .CodeMirror-line {
    color: #3c4257;
    padding: 0;
    font-family: Menlo, Monaco, monospace;
    font-size: 13px;
    font-weight: 400;
    line-height: 23px
}

.cm-s-stripe .CodeMirror-gutters {
    background-color: #fff;
    border: none
}

.cm-s-stripe .CodeMirror-lines {
    padding: 0
}

.cm-s-stripe .CodeMirror-linenumbers {
    background-color: #0000;
    width: 56px
}

.cm-s-stripe .CodeMirror-linenumber {
    color: #a3acb9;
    padding: 0 20px 0 10px;
    font-family: Menlo, Monaco, monospace;
    font-size: 13px;
    line-height: 22px
}

.cm-s-stripe .CodeMirror-hscrollbar {
    overflow-x: auto
}

.cm-s-stripe .CodeMirror-guttermarker {
    color: #075996
}

.cm-s-stripe .CodeMirror-guttermarker-subtle {
    color: #c1c9d2
}

.cm-s-stripe .cm-string,
.cm-s-stripe .cm-string-2 {
    color: #09825d
}

.cm-s-stripe .cm-punctuation,
.cm-s-stripe .cm-comment,
.cm-s-stripe .cm-quote {
    color: #8792a2
}

.cm-s-stripe .cm-keyword {
    color: #5469d4
}

.cm-s-stripe .cm-number,
.cm-s-stripe .cm-builtin {
    color: #bb5504
}

.cm-s-stripe .db-QueryEditor-errorLine,
.cm-s-stripe .CodeMirror-lint-mark-error {
    background-color: #eef2f566
}

.cm-s-stripe .db-QueryEditor-errorLine .CodeMirror-linenumber.CodeMirror-gutter-elt,
.cm-s-stripe .db-QueryEditor-errorLine.CodeMirror-linebackground {
    background-color: #0000
}

.cm-s-stripe .db-QueryEditor-errorLine .cm-keyword,
.cm-s-stripe .db-QueryEditor-errorLine .cm-atom,
.cm-s-stripe .db-QueryEditor-errorLine .cm-number,
.cm-s-stripe .db-QueryEditor-errorLine .cm-def,
.cm-s-stripe .db-QueryEditor-errorLine .cm-variable,
.cm-s-stripe .db-QueryEditor-errorLine .cm-punctuation,
.cm-s-stripe .db-QueryEditor-errorLine .cm-property,
.cm-s-stripe .db-QueryEditor-errorLine .cm-operator,
.cm-s-stripe .db-QueryEditor-errorLine .cm-variable-2,
.cm-s-stripe .db-QueryEditor-errorLine .cm-variable-3,
.cm-s-stripe .db-QueryEditor-errorLine .cm-comment,
.cm-s-stripe .db-QueryEditor-errorLine .cm-string,
.cm-s-stripe .db-QueryEditor-errorLine .cm-string-2,
.cm-s-stripe .db-QueryEditor-errorLine .cm-meta,
.cm-s-stripe .db-QueryEditor-errorLine .cm-qualifier,
.cm-s-stripe .db-QueryEditor-errorLine .cm-builtin,
.cm-s-stripe .db-QueryEditor-errorLine .cm-bracket,
.cm-s-stripe .db-QueryEditor-errorLine .cm-tag,
.cm-s-stripe .db-QueryEditor-errorLine .cm-attribute,
.cm-s-stripe .db-QueryEditor-errorLine .cm-hr {
    color: #cd3d64
}

.editorTerm-string {
    color: #bb5504
}

.editorTerm-bool {
    color: #f5871f;
    font-weight: 700
}

.editorTerm-function {
    color: #b76ac4;
    font-weight: 700
}

.editorTerm-number {
    color: #067ab8
}

.editorTerm-listVariable {
    color: #61469b;
    background-color: #e6e6fc;
    border-radius: 100px;
    padding: 2px 5px
}

.editorTerm-feature {
    color: #61469b;
    background-color: #dfe0f2;
    border-radius: 100px;
    padding: 2px 5px
}

.editorTerm-metadata {
    color: #159570;
    background-color: #d6facf;
    border-radius: 100px;
    padding: 2px 5px
}

.ExamplePredicate-row {
    cursor: pointer;
    background-color: #fff;
    border-radius: 5px;
    margin-bottom: 5px;
    padding: 5px 15px
}

.ExamplePredicate-row:hover {
    cursor: pointer
}

.ExamplePredicate-row:first-child {
    margin-top: 10px
}

.PredicateInput-container {
    flex-grow: 1;
    line-height: 30px;
    display: inline-block
}

.suggestionsPopover.bs-Popover {
    max-width: 340px;
    margin-top: 2px;
    overflow: hidden
}

.RuleModal-inputWrapper {
    -ms-box-shadow: inset 0 1px 1px #7c7c7f1a, 0 1px 0 #ffffffb3, 0 0 4px #5695db00;
    -o-box-shadow: inset 0 1px 1px #7c7c7f1a, 0 1px 0 #ffffffb3, 0 0 4px #5695db00;
    background: #fff;
    border: 1px solid #cececf;
    border-color: #b5b5b6 #cececf #dededf;
    border-radius: 4px;
    width: 100%;
    padding: 6px 15px;
    display: block;
    box-shadow: inset 0 1px 1px #7c7c7f1a, 0 1px #ffffffb3, 0 0 4px #5695db00
}

.PredicateInputWrapper {
    flex-wrap: wrap;
    align-items: center;
    display: flex
}

.PredicateInputWrapper-message {
    flex-shrink: 0;
    align-self: flex-start;
    margin-right: 10px;
    padding-top: 8px
}

.db-Modal--rule .bs-Fieldset-message.bs-is-invalid code {
    color: inherit
}

.db-RuleStatisticsBlock {
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    min-height: 150px;
    display: flex
}

.db-RuleStatisticsBlock .bs-Table {
    max-width: auto;
    width: auto
}

.db-RuleStatisticsBlock .bs-Table .bs-Table-row {
    background: 0 0
}

.db-RuleStatisticsBlock .bs-Table .bs-Table-row .bs-Table-cell {
    padding-top: 0;
    padding-bottom: 0;
    line-height: 25px
}

.db-RuleStatisticsBlock .bs-Table .bs-Table-row .bs-Table-cell:first-child {
    padding-left: 0
}

.db-RuleStatisticsBlock--error {
    min-height: auto
}

.db-RuleStatisticsWrapper {
    width: 100%
}

.db-RuleStatisticsWrapper h3+div {
    margin-top: 10px
}

.db-RuleStatistics-paymentLink {
    flex-grow: 2;
    padding-top: 20px
}

.db-RuleStatistics-column {
    padding-right: 20px
}

.db-RuleStatistics-riskLevelNormal:before {
    content: "";
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+CiAgPGcgaWQ9Ikljb25zIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgPGcgaWQ9InNoaWVsZC0tYmx1ZS0tc21hbGwiIGZpbGw9IiMwMDk5RTUiPgogICAgICA8ZyBpZD0iSWNvbiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMyAyKSI+CiAgICAgICAgPHBhdGggaWQ9IkNvbWJpbmVkLVNoYXBlIiBkPSJNMTMuOTkgOC4xM2E3LjUgNy41IDAgMCAxLTIuNjQgNS4wMUExNi41OCAxNi41OCAwIDAgMSA3IDE2VjBMNy4wMiAwbDYuNyAzLjM2Yy4xMy4wNy4yNC4yMi4yNy4zN3Y0LjR6Ii8+CiAgICAgICAgPHBhdGggaWQ9IkNvbWJpbmVkLVNoYXBlIiBmaWxsLW9wYWNpdHk9Ii41IiBkPSJNNyAuMDFMLjI4IDMuMzZhLjU3LjU3IDAgMCAwLS4yOC40NnY0LjExcy4wMSAyLjk4IDIuNjUgNS4yMUExNy4zNiAxNy4zNiAwIDAgMCA3IDE1Ljk5Vi4wMXoiLz4KICAgICAgPC9nPgogICAgPC9nPgogIDwvZz4KPC9zdmc+Cg==);
    background-size: 20px;
    width: 20px;
    height: 20px
}

.db-RuleStatistics-riskLevelElevated:before {
    content: "";
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+CiAgPGcgaWQ9Ikljb25zIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgPGcgaWQ9InNoaWVsZC0teWVsbG93LS1zbWFsbCIgZmlsbD0iI0UwOTk0QyI+CiAgICAgIDxnIGlkPSJJY29uIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzIDIpIj4KICAgICAgICA8cGF0aCBpZD0iQ29tYmluZWQtU2hhcGUiIGQ9Ik0xMy45OSA4LjEzYTcuNSA3LjUgMCAwIDEtMi42NCA1LjAxQTE2LjU4IDE2LjU4IDAgMCAxIDcgMTZWMEw3LjAyIDBsNi43IDMuMzZjLjEzLjA3LjI0LjIyLjI3LjM3djQuNHoiLz4KICAgICAgICA8cGF0aCBpZD0iQ29tYmluZWQtU2hhcGUiIGZpbGwtb3BhY2l0eT0iLjUiIGQ9Ik03IC4wMUwuMjggMy4zNmEuNTcuNTcgMCAwIDAtLjI4LjQ2djQuMTFzLjAxIDIuOTggMi42NSA1LjIxQTE3LjM2IDE3LjM2IDAgMCAwIDcgMTUuOTlWLjAxeiIvPgogICAgICA8L2c+CiAgICA8L2c+CiAgPC9nPgo8L3N2Zz4K);
    background-size: 20px;
    width: 20px;
    height: 20px
}

.db-RuleStatistics-riskLevelHighest:before {
    content: "";
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+CiAgPGcgaWQ9Ikljb25zIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgPGcgaWQ9InNoaWVsZC0tcmVkLS1zbWFsbCIgZmlsbD0iI0UwNEM0QyI+CiAgICAgIDxnIGlkPSJJY29uIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzIDIpIj4KICAgICAgICA8cGF0aCBpZD0iQ29tYmluZWQtU2hhcGUiIGQ9Ik0xMy45OSA4LjEzYTcuNSA3LjUgMCAwIDEtMi42NCA1LjAxQTE2LjU4IDE2LjU4IDAgMCAxIDcgMTZWMEw3LjAyIDBsNi43IDMuMzZjLjEzLjA3LjI0LjIyLjI3LjM3djQuNHoiLz4KICAgICAgICA8cGF0aCBpZD0iQ29tYmluZWQtU2hhcGUiIGZpbGwtb3BhY2l0eT0iLjUiIGQ9Ik03IC4wMUwuMjggMy4zNmEuNTcuNTcgMCAwIDAtLjI4LjQ2djQuMTFzLjAxIDIuOTggMi42NSA1LjIxQTE3LjM2IDE3LjM2IDAgMCAwIDcgMTUuOTlWLjAxeiIvPgogICAgICA8L2c+CiAgICA8L2c+CiAgPC9nPgo8L3N2Zz4K);
    background-size: 20px;
    width: 20px;
    height: 20px
}

.db-RuleStatistics-riskLevelNormal,
.db-RuleStatistics-riskLevelElevated,
.db-RuleStatistics-riskLevelHighest {
    margin-right: 30px;
    display: inline-flex
}

.db-RuleStatistics-riskLevelNormal p,
.db-RuleStatistics-riskLevelElevated p,
.db-RuleStatistics-riskLevelHighest p {
    margin-left: 5px
}

.db-RuleStatistics-riskLevelNormal {
    color: #008cdd
}

.db-RuleStatistics-riskLevelElevated {
    color: #e0994c
}

.db-RuleStatistics-riskLevelHighest {
    color: #e04c4c
}

.db-RuleStatistics-loader {
    justify-content: center;
    align-items: center;
    min-height: 236px;
    display: flex
}

.db-RuleStatistics-aggregateContainer {
    align-items: center;
    display: flex
}

.db-RuleFeedback {
    margin-top: 25px;
    display: flex
}

.db-RuleFeedback input {
    flex: auto
}

.db-RuleFeedback button {
    flex: none;
    margin-left: 10px
}

.bs-Notice code.PredicateInputWrapper {
    background-color: #0000;
    border-radius: 0;
    padding: 0
}

.bs-Notice code.PredicateInputWrapper .editorTerm-feature,
.bs-Notice code.PredicateInputWrapper .editorTerm-listVariable {
    background-color: #fff
}

.bs-Notice code.PredicateInputWrapper .editorTerm-listVariable,
.bs-Notice code.PredicateInputWrapper .editorTerm-number,
.bs-Notice code.PredicateInputWrapper .editorTerm-feature,
.bs-Notice code.PredicateInputWrapper .editorTerm-function,
.bs-Notice code.PredicateInputWrapper .editorTerm-bool,
.bs-Notice code.PredicateInputWrapper .editorTerm-string {
    color: #4c555a
}

.db-RuleDisabledBanner {
    text-align: left
}

.db-RuleListFooter .bs-Popover {
    white-space: normal
}

.db-RuleListFooter .bs-Button.bs-Popover-activate {
    pointer-events: auto
}

.editorSuggestions {
    width: 340px;
    max-height: 220px;
    position: relative;
    overflow-y: auto
}

.editorSuggestions ul {
    padding: 5px 0
}

.editorSuggestions ul li:nth-child(2n) {
    background-color: #f7f9fa
}

.editorSuggestionItem {
    padding: 5px 10px
}

.editorSuggestionItem--focused {
    cursor: pointer;
    background: linear-gradient(#48a8e8, #3296e3);
    border-top-color: #369ad9;
    border-bottom-color: #0e74c3
}

.editorSuggestionItem p {
    color: #939da3;
    font-size: 12px
}

.editorSuggestionItem--focused code,
.editorSuggestionItem--focused p {
    color: #fff
}

.FlexLoanApplication--refill-comparison-table .DataTableHead-cell,
.FlexLoanApplication--refill-comparison-table .DataTable-cell {
    width: 35%
}

.FlexLoanApplication--refill-comparison-table .DataTableHead-cell:first-child,
.FlexLoanApplication--refill-comparison-table .DataTable-cell:first-child {
    width: 30%;
    margin-left: 0;
    padding-left: 0
}

.FlexLoanApplication--refill-comparison-table .DataTableHead-cell:first-child .DataTableHead-cellInner,
.FlexLoanApplication--refill-comparison-table .DataTableHead-cell:first-child .DataTable-cellInner,
.FlexLoanApplication--refill-comparison-table .DataTable-cell:first-child .DataTableHead-cellInner,
.FlexLoanApplication--refill-comparison-table .DataTable-cell:first-child .DataTable-cellInner {
    margin-left: 0;
    padding-left: 0
}

.FlexLoanApplication--refill-comparison-table .DataTableHead-cell:last-of-type,
.FlexLoanApplication--refill-comparison-table .DataTable-cell:last-of-type {
    background-color: #fff
}

.FlexLoanApplication--refill-comparison-table .DataTable-cell {
    box-shadow: none
}

:root {
    --z-index-side-nav: var(--Chrome-zIndex--appDock);
    --z-index-stripe-shell: calc(var(--Chrome-zIndex--appDock) + 1)
}

.dashboard-content {
    flex-flow: column;
    justify-content: flex-start;
    align-items: stretch;
    height: 100vh;
    display: flex
}

.dashboard-content-inner {
    flex: 1;
    height: 100%;
    overflow-y: auto
}

.shell-wrapper {
    z-index: 12;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0
}

img {
    image-rendering: -webkit-optimize-contrast
}

.AppMarketplace--searchInput {
    border-radius: 58px
}

.AppMarketplace--searchInput-mobile {
    background-color: #f7fafc !important
}

.AppMarketplace--Header {
    display: flex
}

.AppMarketplace--MobileHeader,
.AppMarketplace--MobileHeaderInstallButton,
.AppMarketplace--MobileHeaderInstallBanner {
    display: none
}

.AppMarketplace--AppDetails {
    display: flex
}

.AppMarketplace--AppDetailsMobile {
    display: none
}

.AppMarketplace--AppSearchResults {
    display: flex
}

.AppMarketplace--AppSearchResultsMobile {
    display: none
}

.AppMarketplace--CategoryResults {
    display: flex
}

.AppMarketplace--CategoryResultsMobile {
    display: none
}

.AppMarketplace--CollectionResults {
    display: flex
}

.AppMarketplace--CollectionResultsMobile,
.AppMarketplace--MediumFeaturedApps,
.AppMarketplace--MobileHome {
    display: none
}

.AppMarketplace--SmallAppCard {
    border-radius: 8px;
    height: 100%;
    padding: 20px 16px
}

.AppMarketplace--DesktopContainer {
    width: 100%;
    max-width: 1280px;
    padding-left: 40px;
    padding-right: 40px
}

.AppMarketplace--MobileContainer {
    width: 100%;
    max-width: 900px;
    padding-left: 24px;
    padding-right: 24px
}

.AppMarketplace--BuildYourOwnAppsCTAMobile,
.AppMarketplace--PartnerModuleMobile,
.AppMarketplace--MobileXSFooter {
    display: none
}

.AppMarketplace--MobileFooter {
    display: block
}

.AppMarketplace--MobileSkeletonXSHeader {
    display: none
}

.AppMarketplace--MobileSkeletonHeader {
    display: block
}

.AppMarketplace--DesktopAppNotificationBanner {
    display: flex
}

.AppMarketplace--MobileAppNotificationBanner {
    display: none
}

.AppMarketplace--SmallAppCardComingSoon-text {
    opacity: 0;
    max-width: 0;
    transition: max-width .15s ease-in-out;
    overflow: hidden
}

.AppMarketplace--DesktopAppNoticeBanner {
    display: flex
}

.AppMarketplace--MobileAppNoticeBanner {
    display: none
}

.AppMarketplace--DesktopDeveloperOnlyBanner {
    display: flex
}

.AppMarketplace--MobileDeveloperOnlyBanner {
    display: none
}

.AppMarketplace--MobileHeader__right {
    display: flex
}

.AppMarketplace--Footer {
    margin-top: -300px;
    padding-top: 300px;
    position: relative
}

.AppMarketplace--FooterSlantContainer {
    flex-grow: 1;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    overflow: hidden
}

.AppMarketplace--FooterSlant {
    transform-origin: 100% 0;
    background: #f6f9fc;
    width: 100%;
    height: 100%;
    max-height: none;
    position: relative;
    top: 0;
    left: 0;
    overflow: hidden;
    transform: skewY(-6deg)
}

.AppMarketplace--FlatFooter {
    background: #f6f9fc;
    width: 100%
}

@media (max-width:900px) {
    .AppMarketplace--Header {
        display: none
    }

    .AppMarketplace--MobileHeader,
    .AppMarketplace--MobileHeaderInstallButton {
        display: flex
    }

    .AppMarketplace--MobileHeaderInstallBanner,
    .AppMarketplace--AppDetails {
        display: none
    }

    .AppMarketplace--AppDetailsMobile {
        display: block
    }

    .AppMarketplace--DesktopAppNotificationBanner {
        display: none
    }

    .AppMarketplace--MobileAppNotificationBanner {
        display: block
    }

    .AppMarketplace--DesktopAppNoticeBanner {
        display: none
    }

    .AppMarketplace--MobileAppNoticeBanner {
        display: block
    }

    .AppMarketplace--DesktopDeveloperOnlyBanner {
        display: none
    }

    .AppMarketplace--MobileDeveloperOnlyBanner {
        display: block
    }

    .AppMarketplace--AppSearchResults {
        display: none
    }

    .AppMarketplace--AppSearchResultsMobile {
        display: block
    }

    .AppMarketplace--CategoryResults {
        display: none
    }

    .AppMarketplace--CategoryResultsMobile {
        display: block
    }

    .AppMarketplace--CollectionResults {
        display: none
    }

    .AppMarketplace--CollectionResultsMobile {
        display: block
    }

    .AppMarketplace--DesktopHome {
        display: none
    }

    .AppMarketplace--MobileHome {
        display: block
    }

    .AppMarketplace--MobileXSFeaturedApps {
        display: none
    }

    .AppMarketplace--MobileFeaturedApps {
        display: block
    }

    .AppMarketplace--SmallAppCard {
        border-radius: 8px;
        padding: 16px
    }

    .AppMarketplace--CategoryBannerMobile {
        display: flex
    }

    .AppMarketplace--CategoryBannerMobileXS {
        display: none
    }

    .AppMarketplace--CollectionBannerMobile {
        display: flex
    }

    .AppMarketplace--CollectionBannerMobileXS {
        display: none
    }
}

@media (max-width:1100px) {
    .AppMarketplace--FeaturedApps {
        display: none
    }

    .AppMarketplace--MediumFeaturedApps {
        display: block
    }

    .AppMarketplace--SmallAppCardComingSoon-text {
        opacity: 1;
        max-width: 20em;
        padding-left: 6px;
        overflow: hidden
    }
}

@media (max-width:767px) {
    .AppMarketplace--MobileHeader__right {
        display: none
    }

    .AppMarketplace--MobileHeaderInstallButton {
        display: flex
    }

    .AppMarketplace--MobileHeaderInstallBanner {
        display: block
    }
}

@media (max-width:600px) {
    .AppMarketplace--MobileFeaturedApps {
        display: none
    }

    .AppMarketplace--MobileXSFeaturedApps {
        display: block
    }

    .AppMarketplace--MobileFooter {
        display: none
    }

    .AppMarketplace--MobileXSFooter {
        display: flex
    }

    .AppMarketplace--MobileSkeletonHeader {
        display: none
    }

    .AppMarketplace--MobileSkeletonXSHeader {
        display: flex
    }

    .AppMarketplace--SearchBar,
    .AppMarketplace--CategoryBannerMobile {
        display: none
    }

    .AppMarketplace--CategoryBannerMobileXS {
        display: flex
    }

    .AppMarketplace--CollectionBannerMobile {
        display: none
    }

    .AppMarketplace--CollectionBannerMobileXS {
        display: flex
    }

    .AppMarketplace--BuildYourOwnAppsCTA {
        display: none
    }

    .AppMarketplace--BuildYourOwnAppsCTAMobile {
        display: flex
    }

    .AppMarketplace--PartnerModule {
        display: none
    }

    .AppMarketplace--PartnerModuleMobile {
        display: flex
    }
}

.AppMarketplace--sidebarNavItem {
    padding-left: 0;
    transition: all .2s ease-in-out
}

.AppMarketplace--sidebarNavItem:hover {
    box-shadow: inset 1px 0 var(--sail-gray500);
    padding-left: 8px;
    font-weight: 500;
    transition: all 50ms ease-in-out
}

.AppMarketplace--sidebarNavItem a {
    width: 100%;
    display: block
}

.AppMarketplace--sidebarNavItem--selected {
    padding-left: 8px;
    box-shadow: inset 1px 0 #66f
}

.AppMarketplace--sidebarNavItem--selected a {
    color: #635bff;
    font-weight: 500
}

.AppMarketplace--featuredAppBox {
    background: #fff;
    transition: all .1s ease-in-out;
    box-shadow: 0 13.5px 27px -12.4px #32325d40, 0 8.1px 16.2px -8.1px #0000001a
}

.AppMarketplace--featuredAppBox svg {
    margin-left: 4px
}

.AppMarketplace--featuredAppBox:hover {
    transition: all .1s ease-in-out;
    box-shadow: 0 30px 60px -10px #32325d40, 0 30px 60px -50px #0000001a
}

.AppMarketplace--mobileFeaturedAppBox {
    background: #fff;
    border: 1px solid #e3e8ee;
    border-radius: 8px;
    align-items: center;
    min-height: 98px;
    transition: all .1s ease-in-out;
    display: flex;
    box-shadow: 0 6.3px 11.5px -3.5px #32325d40, 0 3.8px 7.5px -3.7px #0000001a
}

.AppMarketplace--mobileFeaturedAppBox svg {
    margin-left: 4px
}

.AppMarketplace--mobileFeaturedAppBox:hover {
    transition: all .1s ease-in-out;
    box-shadow: 0 13.5px 27px -12.4px #32325d40, 0 8.1px 16.2px -8.1px #0000001a
}

.AppMarketplace--AppListItem:hover .AppMarketplace--SmallAppCard {
    background-color: var(--sail-color-gray-50);
    mix-blend-mode: multiply
}

.AppMarketplace--AppListItem:hover .AppMarketplace--SmallAppCardImgContainer {
    filter: drop-shadow(0 4px 8px #00000029)
}

.AppMarketplace--AppListItem:hover .AppMarketplace--SmallAppCardComingSoon-text {
    opacity: 1;
    max-width: 20em;
    padding-left: 6px;
    transition: max-width .15s ease-in-out, opacity .35s ease-in-out;
    overflow: hidden
}

.AccountSwitcherMenu {
    max-height: 300px;
    overflow-y: scroll
}

.cm-s-stripe-cel.CodeMirror {
    color: #3c4257;
    resize: vertical;
    background-color: #fff;
    line-height: 1.4375
}

.cm-s-stripe-cel.CodeMirror pre,
.cm-s-stripe-cel .CodeMirror-line {
    color: #3c4257;
    padding: 0;
    font-family: Menlo, Monaco, monospace;
    font-size: 13px;
    font-weight: 400;
    line-height: 23px
}

.cm-s-stripe-cel .CodeMirror-gutters {
    background-color: #fff;
    border: none
}

.cm-s-stripe-cel.cm-s-stripe-cel-readonly.CodeMirror,
.cm-s-stripe-cel.cm-s-stripe-cel-readonly .CodeMirror-gutters {
    background-color: #f7fafc
}

.cm-s-stripe-cel .CodeMirror-lines {
    padding: 0
}

.cm-s-stripe-cel .CodeMirror-linenumbers {
    background-color: #0000;
    width: 56px
}

.cm-s-stripe-cel .CodeMirror-linenumber {
    color: #a3acb9;
    padding: 0 20px 0 10px;
    font-family: Menlo, Monaco, monospace;
    font-size: 13px;
    line-height: 22px
}

.cm-s-stripe-cel .CodeMirror-hscrollbar {
    overflow-x: auto
}

.cm-s-stripe-cel .CodeMirror-guttermarker {
    color: #075996
}

.cm-s-stripe-cel .CodeMirror-guttermarker-subtle {
    color: #c1c9d2
}

.cm-s-stripe-cel .cm-string,
.cm-s-stripe-cel .cm-string-2 {
    color: #2b8700
}

.cm-s-stripe-cel .cm-punctuation,
.cm-s-stripe-cel .cm-comment,
.cm-s-stripe-cel .cm-quote {
    color: #8792a2
}

.cm-s-stripe-cel .cm-input-object {
    color: #c52984
}

.cm-s-stripe-cel .cm-keyword {
    color: #045ad0
}

.cm-s-stripe-cel .cm-number,
.cm-s-stripe-cel .cm-builtin {
    color: #b13600
}

.cm-s-stripe-cel .db-QueryEditor-errorLine,
.cm-s-stripe-cel .CodeMirror-lint-mark-error {
    background-color: #eef2f566
}

.cm-s-stripe-cel .db-QueryEditor-errorLine .CodeMirror-linenumber.CodeMirror-gutter-elt,
.cm-s-stripe-cel .db-QueryEditor-errorLine.CodeMirror-linebackground {
    background-color: #0000
}

.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-keyword,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-atom,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-number,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-def,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-variable,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-punctuation,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-property,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-operator,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-variable-2,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-variable-3,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-comment,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-string,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-string-2,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-meta,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-qualifier,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-builtin,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-bracket,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-tag,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-attribute,
.cm-s-stripe-cel .db-QueryEditor-errorLine .cm-hr {
    color: #cd3d64
}

.CodeMirror {
    color: #000;
    direction: ltr;
    height: 300px;
    font-family: monospace
}

.CodeMirror-lines {
    padding: 4px 0
}

.CodeMirror pre.CodeMirror-line,
.CodeMirror pre.CodeMirror-line-like {
    padding: 0 4px
}

.CodeMirror-gutter-filler,
.CodeMirror-scrollbar-filler {
    background-color: #fff
}

.CodeMirror-gutters {
    white-space: nowrap;
    background-color: #f7f7f7;
    border-right: 1px solid #ddd
}

.CodeMirror-linenumber {
    text-align: right;
    color: #999;
    white-space: nowrap;
    min-width: 20px;
    padding: 0 3px 0 5px
}

.CodeMirror-guttermarker {
    color: #000
}

.CodeMirror-guttermarker-subtle {
    color: #999
}

.CodeMirror-cursor {
    border-left: 1px solid #000;
    border-right: none;
    width: 0
}

.CodeMirror div.CodeMirror-secondarycursor {
    border-left: 1px solid silver
}

.cm-fat-cursor .CodeMirror-cursor {
    background: #7e7;
    width: auto;
    border: 0 !important
}

.cm-fat-cursor div.CodeMirror-cursors {
    z-index: 1
}

.cm-fat-cursor-mark {
    background-color: #14ff1480;
    animation: 1.06s step-end infinite blink
}

.cm-animate-fat-cursor {
    background-color: #7e7;
    border: 0;
    width: auto;
    animation: 1.06s step-end infinite blink
}

@keyframes blink {
    0% {}

    50% {
        background-color: #0000
    }

    to {}
}

.cm-tab {
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
    display: inline-block
}

.CodeMirror-rulers {
    position: absolute;
    top: -50px;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden
}

.CodeMirror-ruler {
    border-left: 1px solid #ccc;
    position: absolute;
    top: 0;
    bottom: 0
}

.cm-s-default .cm-header {
    color: #00f
}

.cm-s-default .cm-quote {
    color: #090
}

.cm-negative {
    color: #d44
}

.cm-positive {
    color: #292
}

.cm-header,
.cm-strong {
    font-weight: 700
}

.cm-em {
    font-style: italic
}

.cm-link {
    text-decoration: underline
}

.cm-strikethrough {
    text-decoration: line-through
}

.cm-s-default .cm-keyword {
    color: #708
}

.cm-s-default .cm-atom {
    color: #219
}

.cm-s-default .cm-number {
    color: #164
}

.cm-s-default .cm-def {
    color: #00f
}

.cm-s-default .cm-variable-2 {
    color: #05a
}

.cm-s-default .cm-type,
.cm-s-default .cm-variable-3 {
    color: #085
}

.cm-s-default .cm-comment {
    color: #a50
}

.cm-s-default .cm-string {
    color: #a11
}

.cm-s-default .cm-string-2 {
    color: #f50
}

.cm-s-default .cm-meta,
.cm-s-default .cm-qualifier {
    color: #555
}

.cm-s-default .cm-builtin {
    color: #30a
}

.cm-s-default .cm-bracket {
    color: #997
}

.cm-s-default .cm-tag {
    color: #170
}

.cm-s-default .cm-attribute {
    color: #00c
}

.cm-s-default .cm-hr {
    color: #999
}

.cm-s-default .cm-link {
    color: #00c
}

.cm-s-default .cm-error,
.cm-invalidchar {
    color: red
}

.CodeMirror-composing {
    border-bottom: 2px solid
}

div.CodeMirror span.CodeMirror-matchingbracket {
    color: #0b0
}

div.CodeMirror span.CodeMirror-nonmatchingbracket {
    color: #a22
}

.CodeMirror-matchingtag {
    background: #ff96004d
}

.CodeMirror-activeline-background {
    background: #e8f2ff
}

.CodeMirror {
    background: #fff;
    position: relative;
    overflow: hidden
}

.CodeMirror-scroll {
    outline: none;
    height: 100%;
    margin-bottom: -50px;
    margin-right: -50px;
    padding-bottom: 50px;
    position: relative;
    overflow: scroll !important
}

.CodeMirror-sizer {
    border-right: 50px solid #0000;
    position: relative
}

.CodeMirror-gutter-filler,
.CodeMirror-hscrollbar,
.CodeMirror-scrollbar-filler,
.CodeMirror-vscrollbar {
    z-index: 6;
    outline: none;
    display: none;
    position: absolute
}

.CodeMirror-vscrollbar {
    top: 0;
    right: 0;
    overflow-x: hidden;
    overflow-y: scroll
}

.CodeMirror-hscrollbar {
    bottom: 0;
    left: 0;
    overflow-x: scroll;
    overflow-y: hidden
}

.CodeMirror-scrollbar-filler {
    bottom: 0;
    right: 0
}

.CodeMirror-gutter-filler {
    bottom: 0;
    left: 0
}

.CodeMirror-gutters {
    z-index: 3;
    min-height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.CodeMirror-gutter {
    white-space: normal;
    vertical-align: top;
    height: 100%;
    margin-bottom: -50px;
    display: inline-block
}

.CodeMirror-gutter-wrapper {
    z-index: 4;
    position: absolute;
    background: 0 0 !important;
    border: none !important
}

.CodeMirror-gutter-background {
    z-index: 4;
    position: absolute;
    top: 0;
    bottom: 0
}

.CodeMirror-gutter-elt {
    cursor: default;
    z-index: 4;
    position: absolute
}

.CodeMirror-gutter-wrapper ::selection {
    background-color: #0000
}

.CodeMirror-gutter-wrapper ::selection {
    background-color: #0000
}

.CodeMirror-lines {
    cursor: text;
    min-height: 1px
}

.CodeMirror pre.CodeMirror-line,
.CodeMirror pre.CodeMirror-line-like {
    font-family: inherit;
    font-size: inherit;
    white-space: pre;
    word-wrap: normal;
    line-height: inherit;
    color: inherit;
    z-index: 2;
    -webkit-tap-highlight-color: transparent;
    -webkit-font-variant-ligatures: contextual;
    font-feature-settings: "calt";
    font-variant-ligatures: contextual;
    background: 0 0;
    border-width: 0;
    border-radius: 0;
    margin: 0;
    position: relative;
    overflow: visible
}

.CodeMirror-wrap pre.CodeMirror-line,
.CodeMirror-wrap pre.CodeMirror-line-like {
    word-wrap: break-word;
    white-space: pre-wrap;
    word-break: normal
}

.CodeMirror-linebackground {
    z-index: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.CodeMirror-linewidget {
    z-index: 2;
    padding: .1px;
    position: relative
}

.CodeMirror-rtl pre {
    direction: rtl
}

.CodeMirror-code {
    outline: none
}

.CodeMirror-gutter,
.CodeMirror-gutters,
.CodeMirror-linenumber,
.CodeMirror-scroll,
.CodeMirror-sizer {
    box-sizing: content-box
}

.CodeMirror-measure {
    visibility: hidden;
    width: 100%;
    height: 0;
    position: absolute;
    overflow: hidden
}

.CodeMirror-cursor {
    pointer-events: none;
    position: absolute
}

.CodeMirror-measure pre {
    position: static
}

div.CodeMirror-cursors {
    visibility: hidden;
    z-index: 3;
    position: relative
}

div.CodeMirror-dragcursors,
.CodeMirror-focused div.CodeMirror-cursors {
    visibility: visible
}

.CodeMirror-selected {
    background: #d9d9d9
}

.CodeMirror-focused .CodeMirror-selected {
    background: #d7d4f0
}

.CodeMirror-crosshair {
    cursor: crosshair
}

.CodeMirror-line::selection {
    background: #d7d4f0
}

.CodeMirror-line>span::selection {
    background: #d7d4f0
}

.CodeMirror-line>span>span::selection {
    background: #d7d4f0
}

.CodeMirror-line::-moz-selection {
    background: #d7d4f0
}

.CodeMirror-line>span::-moz-selection {
    background: #d7d4f0
}

.CodeMirror-line>span>span::-moz-selection {
    background: #d7d4f0
}

.cm-searching {
    background-color: #ff06
}

.cm-force-border {
    padding-right: .1px
}

@media print {
    .CodeMirror div.CodeMirror-cursors {
        visibility: hidden
    }
}

.cm-tab-wrap-hack:after {
    content: ""
}

span.CodeMirror-selectedtext {
    background: 0 0
}

.fixedDataTableCellGroupLayout_cellGroup {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    white-space: nowrap;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden
}

.fixedDataTableCellGroupLayout_cellGroup>.public_fixedDataTableCell_main {
    vertical-align: top;
    white-space: normal;
    display: inline-block
}

.fixedDataTableCellGroupLayout_cellGroupWrapper {
    position: absolute;
    top: 0
}

.fixedDataTableCellLayout_main {
    box-sizing: border-box;
    white-space: normal;
    border-width: 0 1px 0 0;
    border-right-style: solid;
    display: block;
    position: absolute;
    overflow: hidden
}

.fixedDataTableCellLayout_lastChild {
    border-width: 0 1px 1px 0
}

.fixedDataTableCellLayout_alignRight {
    text-align: right
}

.fixedDataTableCellLayout_alignCenter {
    text-align: center
}

.fixedDataTableCellLayout_wrap1 {
    display: table
}

.fixedDataTableCellLayout_wrap2 {
    display: table-row
}

.fixedDataTableCellLayout_wrap3 {
    vertical-align: middle;
    display: table-cell
}

.fixedDataTableCellLayout_columnResizerContainer {
    z-index: 1;
    width: 6px;
    position: absolute;
    right: 0
}

.fixedDataTableCellLayout_columnResizerContainer:hover {
    cursor: ew-resize
}

.fixedDataTableCellLayout_columnResizerContainer:hover .fixedDataTableCellLayout_columnResizerKnob {
    visibility: visible
}

.fixedDataTableCellLayout_columnResizerKnob {
    visibility: hidden;
    width: 4px;
    position: absolute;
    right: 0
}

.fixedDataTableColumnResizerLineLayout_mouseArea {
    cursor: ew-resize;
    width: 12px;
    position: absolute;
    right: -5px
}

.fixedDataTableColumnResizerLineLayout_main {
    box-sizing: border-box;
    z-index: 10;
    border-right-style: solid;
    border-right-width: 1px;
    position: absolute
}

body[dir=rtl] .fixedDataTableColumnResizerLineLayout_main,
.fixedDataTableColumnResizerLineLayout_hiddenElem {
    display: none !important
}

.fixedDataTableLayout_main {
    box-sizing: border-box;
    border-style: solid;
    border-width: 1px;
    position: relative;
    overflow: hidden
}

.fixedDataTableLayout_hasBottomBorder,
.fixedDataTableLayout_header {
    border-bottom-style: solid;
    border-bottom-width: 1px
}

.fixedDataTableLayout_footer .public_fixedDataTableCell_main {
    border-top-style: solid;
    border-top-width: 1px
}

.fixedDataTableLayout_bottomShadow,
.fixedDataTableLayout_topShadow {
    z-index: 1;
    height: 4px;
    position: absolute;
    left: 0;
    right: 0
}

.fixedDataTableLayout_bottomShadow {
    margin-top: -4px
}

.fixedDataTableLayout_rowsContainer {
    position: relative;
    overflow: hidden
}

.fixedDataTableLayout_horizontalScrollbar {
    position: absolute;
    bottom: 0
}

.fixedDataTableRowLayout_main {
    box-sizing: border-box;
    position: absolute;
    top: 0;
    overflow: hidden
}

.fixedDataTableRowLayout_body {
    position: absolute;
    top: 0;
    left: 0
}

.fixedDataTableRowLayout_fixedColumnsDivider {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-left-style: solid;
    border-left-width: 1px;
    width: 0;
    position: absolute;
    top: 0;
    left: 0
}

.fixedDataTableRowLayout_columnsShadow {
    width: 4px
}

.fixedDataTableRowLayout_rowWrapper {
    position: absolute;
    top: 0
}

.ScrollbarLayout_main {
    box-sizing: border-box;
    -webkit-user-select: none;
    user-select: none;
    outline: none;
    transition-duration: .25s;
    transition-timing-function: ease;
    position: absolute;
    overflow: hidden
}

.ScrollbarLayout_mainVertical {
    transition-property: background-color width;
    width: 15px;
    top: 0;
    bottom: 0;
    right: 0
}

.ScrollbarLayout_mainVertical.public_Scrollbar_mainActive,
.ScrollbarLayout_mainVertical:hover {
    width: 17px
}

.ScrollbarLayout_mainHorizontal {
    height: 15px;
    transition-property: background-color height;
    bottom: 0;
    left: 0
}

.ScrollbarLayout_mainHorizontal.public_Scrollbar_mainActive,
.ScrollbarLayout_mainHorizontal:hover {
    height: 17px
}

.ScrollbarLayout_face {
    z-index: 1;
    position: absolute;
    left: 0;
    overflow: hidden
}

.ScrollbarLayout_face:after {
    content: "";
    border-radius: 6px;
    transition: background-color .25s;
    display: block;
    position: absolute
}

.ScrollbarLayout_faceHorizontal {
    top: 0;
    bottom: 0;
    left: 0
}

.ScrollbarLayout_faceHorizontal:after {
    width: 100%;
    top: 4px;
    bottom: 4px;
    left: 0
}

.ScrollbarLayout_faceVertical {
    top: 0;
    left: 0;
    right: 0
}

.ScrollbarLayout_faceVertical:after {
    height: 100%;
    top: 0;
    left: 4px;
    right: 4px
}

.public_fixedDataTable_main,
.public_fixedDataTable_hasBottomBorder,
.public_fixedDataTable_header {
    border-color: #d3d3d3
}

.public_fixedDataTable_header .public_fixedDataTableCell_main {
    font-weight: 700
}

.public_fixedDataTable_header,
.public_fixedDataTable_header .public_fixedDataTableCell_main {
    background-color: #f6f7f8;
    background-image: linear-gradient(#fff, #efefef)
}

.public_fixedDataTable_footer .public_fixedDataTableCell_main {
    background-color: #f6f7f8;
    border-color: #d3d3d3
}

.public_fixedDataTable_topShadow {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAECAYAAABP2FU6AAAAF0lEQVR4AWPUkNeSBhHCjJoK2twgFisAFagCCp3pJlAAAAAASUVORK5CYII=) repeat-x
}

.public_fixedDataTable_bottomShadow {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAECAYAAABP2FU6AAAAHElEQVQI12MwNjZmZdAT1+Nm0JDWEGZQk1GTBgAWkwIeAEp52AAAAABJRU5ErkJggg==) repeat-x
}

.public_fixedDataTable_horizontalScrollbar .public_Scrollbar_mainHorizontal {
    background-color: #fff
}

.public_fixedDataTableCell_main {
    background-color: #fff;
    border-color: #d3d3d3
}

.public_fixedDataTableCell_highlighted {
    background-color: #f4f4f4
}

.public_fixedDataTableCell_cellContent {
    padding: 8px
}

.public_fixedDataTableCell_columnResizerKnob {
    background-color: #0284ff
}

.public_fixedDataTableColumnResizerLine_main {
    border-color: #0284ff
}

.public_fixedDataTableRow_main {
    background-color: #fff
}

.public_fixedDataTableRow_highlighted,
.public_fixedDataTableRow_highlighted .public_fixedDataTableCell_main {
    background-color: #f6f7f8
}

.public_fixedDataTableRow_fixedColumnsDivider {
    border-color: #d3d3d3
}

.public_fixedDataTableRow_columnsShadow {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAYAAAD5PA/NAAAAFklEQVQIHWPSkNeSBmJhTQVtbiDNCgASagIIuJX8OgAAAABJRU5ErkJggg==) repeat-y
}

.public_Scrollbar_main.public_Scrollbar_mainActive,
.public_Scrollbar_main:hover {
    background-color: #fffc
}

.public_Scrollbar_mainOpaque,
.public_Scrollbar_mainOpaque.public_Scrollbar_mainActive,
.public_Scrollbar_mainOpaque:hover {
    background-color: #fff
}

.public_Scrollbar_face:after {
    background-color: #c2c2c2
}

.public_Scrollbar_faceActive:after,
.public_Scrollbar_main:hover .public_Scrollbar_face:after,
.public_Scrollbar_mainActive .public_Scrollbar_face:after {
    background-color: #7d7d7d
}

.PresetDateRangePicker_panel {
    padding: 0 22px 11px
}

.PresetDateRangePicker_button {
    text-align: center;
    color: #00a699;
    height: 100%;
    font: inherit;
    box-sizing: border-box;
    cursor: pointer;
    background: 0 0;
    border: 2px solid #00a699;
    margin-right: 8px;
    padding: 4px 12px;
    font-weight: 700;
    line-height: normal;
    position: relative;
    overflow: visible
}

.PresetDateRangePicker_button:active {
    outline: 0
}

.PresetDateRangePicker_button__selected {
    color: #fff;
    background: #00a699
}

.SingleDatePickerInput {
    background-color: #fff;
    display: inline-block
}

.SingleDatePickerInput__withBorder {
    border: 1px solid #dbdbdb;
    border-radius: 2px
}

.SingleDatePickerInput__rtl {
    direction: rtl
}

.SingleDatePickerInput__disabled {
    background-color: #f2f2f2
}

.SingleDatePickerInput__block {
    display: block
}

.SingleDatePickerInput__showClearDate {
    padding-right: 30px
}

.SingleDatePickerInput_clearDate {
    color: inherit;
    font: inherit;
    cursor: pointer;
    background: 0 0;
    border: 0;
    margin: 0 10px 0 5px;
    padding: 10px;
    line-height: normal;
    position: absolute;
    top: 50%;
    right: 0;
    overflow: visible;
    transform: translateY(-50%)
}

.SingleDatePickerInput_clearDate__default:focus,
.SingleDatePickerInput_clearDate__default:hover {
    background: #dbdbdb;
    border-radius: 50%
}

.SingleDatePickerInput_clearDate__small {
    padding: 6px
}

.SingleDatePickerInput_clearDate__hide {
    visibility: hidden
}

.SingleDatePickerInput_clearDate_svg {
    fill: #82888a;
    vertical-align: middle;
    width: 15px;
    height: 12px
}

.SingleDatePickerInput_clearDate_svg__small {
    height: 9px
}

.SingleDatePickerInput_calendarIcon {
    color: inherit;
    font: inherit;
    cursor: pointer;
    vertical-align: middle;
    background: 0 0;
    border: 0;
    margin: 0 5px 0 10px;
    padding: 10px;
    line-height: normal;
    display: inline-block;
    overflow: visible
}

.SingleDatePickerInput_calendarIcon_svg {
    fill: #82888a;
    vertical-align: middle;
    width: 14px;
    height: 15px
}

.SingleDatePicker {
    display: inline-block;
    position: relative
}

.SingleDatePicker__block {
    display: block
}

.SingleDatePicker_picker {
    z-index: 1;
    background-color: #fff;
    position: absolute
}

.SingleDatePicker_picker__rtl {
    direction: rtl
}

.SingleDatePicker_picker__directionLeft {
    left: 0
}

.SingleDatePicker_picker__directionRight {
    right: 0
}

.SingleDatePicker_picker__portal {
    background-color: #0000004d;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0
}

.SingleDatePicker_picker__fullScreenPortal {
    background-color: #fff
}

.SingleDatePicker_closeButton {
    color: inherit;
    font: inherit;
    cursor: pointer;
    z-index: 2;
    background: 0 0;
    border: 0;
    padding: 15px;
    line-height: normal;
    position: absolute;
    top: 0;
    right: 0;
    overflow: visible
}

.SingleDatePicker_closeButton:focus,
.SingleDatePicker_closeButton:hover {
    color: darken(#cacccd, 10%);
    text-decoration: none
}

.SingleDatePicker_closeButton_svg {
    fill: #cacccd;
    width: 15px;
    height: 15px
}

.CalendarDay {
    box-sizing: border-box;
    cursor: pointer;
    text-align: center;
    font-size: 14px
}

.CalendarDay:active {
    outline: 0
}

.CalendarDay__defaultCursor {
    cursor: default
}

.CalendarDay__default {
    color: #484848;
    background: #fff;
    border: 1px solid #e4e7e7
}

.CalendarDay__default:hover {
    color: inherit;
    background: #e4e7e7;
    border: 1px solid #e4e7e7
}

.CalendarDay__hovered_offset {
    color: inherit;
    background: #f4f5f5;
    border: 1px double #e4e7e7
}

.CalendarDay__outside {
    color: #484848;
    background: #fff;
    border: 0
}

.CalendarDay__outside:hover {
    border: 0
}

.CalendarDay__blocked_minimum_nights {
    color: #cacccd;
    background: #fff;
    border: 1px solid #eceeee
}

.CalendarDay__blocked_minimum_nights:active,
.CalendarDay__blocked_minimum_nights:hover {
    color: #cacccd;
    background: #fff
}

.CalendarDay__highlighted_calendar {
    color: #484848;
    background: #ffe8bc
}

.CalendarDay__highlighted_calendar:active,
.CalendarDay__highlighted_calendar:hover {
    color: #484848;
    background: #ffce71
}

.CalendarDay__selected_span {
    color: #fff;
    background: #66e2da;
    border: 1px double #33dacd
}

.CalendarDay__selected_span:active,
.CalendarDay__selected_span:hover {
    color: #fff;
    background: #33dacd;
    border: 1px double #33dacd
}

.CalendarDay__selected,
.CalendarDay__selected:active,
.CalendarDay__selected:hover {
    color: #fff;
    background: #00a699;
    border: 1px double #00a699
}

.CalendarDay__hovered_span,
.CalendarDay__hovered_span:hover {
    color: #007a87;
    background: #b2f1ec;
    border: 1px double #80e8e0
}

.CalendarDay__hovered_span:active {
    color: #007a87;
    background: #80e8e0;
    border: 1px double #80e8e0
}

.CalendarDay__blocked_calendar,
.CalendarDay__blocked_calendar:active,
.CalendarDay__blocked_calendar:hover {
    color: #82888a;
    background: #cacccd;
    border: 1px solid #cacccd
}

.CalendarDay__blocked_out_of_range,
.CalendarDay__blocked_out_of_range:active,
.CalendarDay__blocked_out_of_range:hover {
    color: #cacccd;
    background: #fff;
    border: 1px solid #e4e7e7
}

.CalendarDay__hovered_start_first_possible_end {
    background: #eceeee;
    border: 1px double #eceeee
}

.CalendarDay__hovered_start_blocked_min_nights {
    background: #eceeee;
    border: 1px double #e4e7e7
}

.DateInput {
    vertical-align: middle;
    background: #fff;
    width: 130px;
    margin: 0;
    padding: 0;
    display: inline-block;
    position: relative
}

.DateInput__small {
    width: 97px
}

.DateInput__block {
    width: 100%
}

.DateInput__disabled {
    color: #dbdbdb;
    background: #f2f2f2
}

.DateInput_input {
    color: #484848;
    background-color: #fff;
    border: 0;
    border-bottom: 2px solid #0000;
    border-radius: 0;
    width: 100%;
    padding: 11px 11px 9px;
    font-size: 19px;
    font-weight: 200;
    line-height: 24px
}

.DateInput_input__small {
    letter-spacing: .2px;
    padding: 7px 7px 5px;
    font-size: 15px;
    line-height: 18px
}

.DateInput_input__regular {
    font-weight: auto
}

.DateInput_input__readOnly {
    -webkit-user-select: none;
    user-select: none
}

.DateInput_input__focused {
    background: #fff;
    border: 0;
    border-bottom: 2px solid #008489;
    outline: 0
}

.DateInput_input__disabled {
    background: #f2f2f2;
    font-style: italic
}

.DateInput_screenReaderMessage {
    clip: rect(0, 0, 0, 0);
    border: 0;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    overflow: hidden
}

.DateInput_fang {
    z-index: 2;
    width: 20px;
    height: 10px;
    position: absolute;
    left: 22px
}

.DateInput_fangShape {
    fill: #fff
}

.DateInput_fangStroke {
    stroke: #dbdbdb;
    fill: #0000
}

.DateRangePickerInput {
    background-color: #fff;
    display: inline-block
}

.DateRangePickerInput__disabled {
    background: #f2f2f2
}

.DateRangePickerInput__withBorder {
    border: 1px solid #dbdbdb;
    border-radius: 2px
}

.DateRangePickerInput__rtl {
    direction: rtl
}

.DateRangePickerInput__block {
    display: block
}

.DateRangePickerInput__showClearDates {
    padding-right: 30px
}

.DateRangePickerInput_arrow {
    vertical-align: middle;
    color: #484848;
    display: inline-block
}

.DateRangePickerInput_arrow_svg {
    vertical-align: middle;
    fill: #484848;
    width: 24px;
    height: 24px
}

.DateRangePickerInput_clearDates {
    color: inherit;
    font: inherit;
    cursor: pointer;
    background: 0 0;
    border: 0;
    margin: 0 10px 0 5px;
    padding: 10px;
    line-height: normal;
    position: absolute;
    top: 50%;
    right: 0;
    overflow: visible;
    transform: translateY(-50%)
}

.DateRangePickerInput_clearDates__small {
    padding: 6px
}

.DateRangePickerInput_clearDates_default:focus,
.DateRangePickerInput_clearDates_default:hover {
    background: #dbdbdb;
    border-radius: 50%
}

.DateRangePickerInput_clearDates__hide {
    visibility: hidden
}

.DateRangePickerInput_clearDates_svg {
    fill: #82888a;
    vertical-align: middle;
    width: 15px;
    height: 12px
}

.DateRangePickerInput_clearDates_svg__small {
    height: 9px
}

.DateRangePickerInput_calendarIcon {
    color: inherit;
    font: inherit;
    cursor: pointer;
    vertical-align: middle;
    background: 0 0;
    border: 0;
    margin: 0 5px 0 10px;
    padding: 10px;
    line-height: normal;
    display: inline-block;
    overflow: visible
}

.DateRangePickerInput_calendarIcon_svg {
    fill: #82888a;
    vertical-align: middle;
    width: 14px;
    height: 15px
}

.DateRangePicker {
    display: inline-block;
    position: relative
}

.DateRangePicker__block {
    display: block
}

.DateRangePicker_picker {
    z-index: 1;
    background-color: #fff;
    position: absolute
}

.DateRangePicker_picker__rtl {
    direction: rtl
}

.DateRangePicker_picker__directionLeft {
    left: 0
}

.DateRangePicker_picker__directionRight {
    right: 0
}

.DateRangePicker_picker__portal {
    background-color: #0000004d;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0
}

.DateRangePicker_picker__fullScreenPortal {
    background-color: #fff
}

.DateRangePicker_closeButton {
    color: inherit;
    font: inherit;
    cursor: pointer;
    z-index: 2;
    background: 0 0;
    border: 0;
    padding: 15px;
    line-height: normal;
    position: absolute;
    top: 0;
    right: 0;
    overflow: visible
}

.DateRangePicker_closeButton:focus,
.DateRangePicker_closeButton:hover {
    color: darken(#cacccd, 10%);
    text-decoration: none
}

.DateRangePicker_closeButton_svg {
    fill: #cacccd;
    width: 15px;
    height: 15px
}

.DraftEditor-editorContainer,
.DraftEditor-root,
.public-DraftEditor-content {
    height: inherit;
    text-align: initial
}

.public-DraftEditor-content[contenteditable=true] {
    -webkit-user-modify: read-write-plaintext-only
}

.DraftEditor-root {
    position: relative
}

.DraftEditor-editorContainer {
    z-index: 1;
    background-color: #fff0;
    border-left: .1px solid #0000;
    position: relative
}

.public-DraftEditor-block {
    position: relative
}

.DraftEditor-alignLeft .public-DraftStyleDefault-block {
    text-align: left
}

.DraftEditor-alignLeft .public-DraftEditorPlaceholder-root {
    text-align: left;
    left: 0
}

.DraftEditor-alignCenter .public-DraftStyleDefault-block {
    text-align: center
}

.DraftEditor-alignCenter .public-DraftEditorPlaceholder-root {
    text-align: center;
    width: 100%;
    margin: 0 auto
}

.DraftEditor-alignRight .public-DraftStyleDefault-block {
    text-align: right
}

.DraftEditor-alignRight .public-DraftEditorPlaceholder-root {
    text-align: right;
    right: 0
}

.public-DraftEditorPlaceholder-root {
    color: #9197a3;
    z-index: 1;
    width: 100%;
    position: absolute
}

.public-DraftEditorPlaceholder-hasFocus {
    color: #bdc1c9
}

.DraftEditorPlaceholder-hidden {
    display: none
}

.public-DraftStyleDefault-block {
    white-space: pre-wrap;
    position: relative
}

.public-DraftStyleDefault-ltr {
    text-align: left;
    direction: ltr
}

.public-DraftStyleDefault-rtl {
    text-align: right;
    direction: rtl
}

.public-DraftStyleDefault-listLTR {
    direction: ltr
}

.public-DraftStyleDefault-listRTL {
    direction: rtl
}

.public-DraftStyleDefault-ol,
.public-DraftStyleDefault-ul {
    margin: 16px 0;
    padding: 0
}

.public-DraftStyleDefault-depth0.public-DraftStyleDefault-listLTR {
    margin-left: 1.5em
}

.public-DraftStyleDefault-depth0.public-DraftStyleDefault-listRTL {
    margin-right: 1.5em
}

.public-DraftStyleDefault-depth1.public-DraftStyleDefault-listLTR {
    margin-left: 3em
}

.public-DraftStyleDefault-depth1.public-DraftStyleDefault-listRTL {
    margin-right: 3em
}

.public-DraftStyleDefault-depth2.public-DraftStyleDefault-listLTR {
    margin-left: 4.5em
}

.public-DraftStyleDefault-depth2.public-DraftStyleDefault-listRTL {
    margin-right: 4.5em
}

.public-DraftStyleDefault-depth3.public-DraftStyleDefault-listLTR {
    margin-left: 6em
}

.public-DraftStyleDefault-depth3.public-DraftStyleDefault-listRTL {
    margin-right: 6em
}

.public-DraftStyleDefault-depth4.public-DraftStyleDefault-listLTR {
    margin-left: 7.5em
}

.public-DraftStyleDefault-depth4.public-DraftStyleDefault-listRTL {
    margin-right: 7.5em
}

.public-DraftStyleDefault-unorderedListItem {
    list-style-type: square;
    position: relative
}

.public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth0 {
    list-style-type: disc
}

.public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth1 {
    list-style-type: circle
}

.public-DraftStyleDefault-orderedListItem {
    list-style-type: none;
    position: relative
}

.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-listLTR:before {
    text-align: right;
    width: 30px;
    position: absolute;
    left: -36px
}

.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-listRTL:before {
    text-align: left;
    width: 30px;
    position: absolute;
    right: -36px
}

.public-DraftStyleDefault-orderedListItem:before {
    content: counter(ol0)". ";
    counter-increment: ol0
}

.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth1:before {
    content: counter(ol1, lower-alpha)". ";
    counter-increment: ol1
}

.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth2:before {
    content: counter(ol2, lower-roman)". ";
    counter-increment: ol2
}

.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth3:before {
    content: counter(ol3)". ";
    counter-increment: ol3
}

.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth4:before {
    content: counter(ol4, lower-alpha)". ";
    counter-increment: ol4
}

.public-DraftStyleDefault-depth0.public-DraftStyleDefault-reset {
    counter-reset: ol0
}

.public-DraftStyleDefault-depth1.public-DraftStyleDefault-reset {
    counter-reset: ol1
}

.public-DraftStyleDefault-depth2.public-DraftStyleDefault-reset {
    counter-reset: ol2
}

.public-DraftStyleDefault-depth3.public-DraftStyleDefault-reset {
    counter-reset: ol3
}

.public-DraftStyleDefault-depth4.public-DraftStyleDefault-reset {
    counter-reset: ol4
}

@media (max-width:1200px) {
    .db-ConsumerUIWrapper-right {
        padding-left: 60px
    }
}

@media (max-width:720px) {
    .db-ConsumerUIWrapper-right {
        overflow-y: unset;
        justify-content: flex-start;
        padding: 40px 20px 0
    }
}

.db-ConsumerUIWrapper-right--inner {
    width: 100%;
    padding-bottom: 150px;
    position: relative;
    top: 121px
}

.db-ConsumerUIWrapper-right--inner.db-ConsumerUIWrapper-right--innerConnectJs {
    max-width: 400px;
    top: 34px
}

.db-ConsumerUIWrapper-right--inner .db-ConsumerUIWrapper-right--inner-field-width {
    max-width: 400px
}

@media (max-width:1024px) {
    .db-ConsumerUIWrapper-right--inner {
        top: 113px
    }

    .db-ConsumerUIWrapper-right--inner.db-ConsumerUIWrapper-right--innerConnectJs {
        top: 34px
    }
}

@media (max-width:720px) {
    .db-ConsumerUIWrapper-right--inner {
        max-width: 380px;
        margin: 0 auto;
        padding-bottom: 100px;
        transition: top .2s;
        top: 28px
    }

    .db-ConsumerUIWrapper-right--innerLivemode,
    .db-ConsumerUIWrapper-right--inner.db-ConsumerUIWrapper-right--innerLivemode.db-ConsumerUIWrapper-right--innerConnectJs {
        top: -12px
    }

    .db-ConsumerUIWrapper-right--inner.db-ConsumerUIWrapper-right--innerHasProgress {
        top: 64px
    }

    .db-ConsumerUIWrapper-right--innerLivemode.db-ConsumerUIWrapper-right--innerHasProgress {
        top: 28px
    }
}

.db-ConsumerUIWrapper-right--progressBar {
    width: 100%;
    position: absolute;
    top: -80px;
    left: 0
}

.db-ConsumerUIWrapper-right--testModeBadge {
    position: absolute;
    top: -40px;
    left: 0
}

@media (max-width:720px) {
    .db-ConsumerUIWrapper-right--innerLivemode .db-ConsumerUIWrapper-right--progressBar {
        top: -40px
    }
}

.db-ConsumerUIWrapper-footer {
    width: 576px;
    max-width: 600px;
    padding: 0 40px 40px 60px;
    position: absolute;
    bottom: 0;
    left: 0
}

.db-ConsumerUIWrapper-footer--copy {
    margin: 4px 0
}

@media (max-width:1440px) {
    .db-ConsumerUIWrapper-footer {
        width: 40vw
    }
}

@media (max-width:1024px) {
    .db-ConsumerUIWrapper-footer {
        padding-left: 48px
    }
}

@media (max-width:720px) {
    .db-ConsumerUIWrapper-footer {
        background: #fff;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        padding: 48px 20px 24px;
        position: relative
    }

    .db-ConsumerUIWrapper-footer--inner {
        max-width: 380px;
        margin: 0 auto
    }

    .db-ConsumerUIWrapper-left {
        width: 100%;
        min-width: auto;
        max-width: 100%;
        padding: 20px 20px 28px;
        line-height: 28px
    }

    .db-ConsumerUIWrapper-mobileHeaderWrapper {
        margin-top: 2px;
        position: relative
    }
}

.db-ConsumerUIWrapper-footer .db-Logo {
    vertical-align: middle;
    margin-left: 2px;
    display: inline-flex;
    transform: translate(-1px)
}

.db-InlineProgressBar {
    background-color: #cfd7df;
    overflow: hidden
}

.db-InlineProgressBar--inner {
    transform-origin: 0;
    height: 100%;
    transition: transform .2s;
    position: relative
}

.db-InlineProgressBar--divider:after {
    content: "";
    background-color: #fff;
    width: 2px;
    height: 100%;
    position: absolute;
    right: 0
}

.db-FooterLayout-footerExpand {
    flex: 1 0 auto
}

.db-FooterLayout-footer {
    text-align: center;
    z-index: 2;
    flex-shrink: 0;
    width: 100%;
    margin: 0 auto;
    padding: 60px 16px 16px
}

.db-StripeBackground {
    width: 100%;
    position: fixed
}

.db-StripeBackground-backgroundPatch {
    z-index: -1;
    width: 50%;
    height: 337.981px;
    position: absolute
}

.db-StripeBackground-gridContainer {
    pointer-events: none;
    z-index: -1;
    flex-direction: column;
    justify-content: flex-end;
    width: 100%;
    height: 742px;
    display: flex;
    position: absolute;
    top: -200px;
    overflow-x: hidden;
    transform: skewY(-12deg)
}

.db-StripeBackground-gridBackground {
    width: 100%;
    height: 550px;
    position: absolute;
    top: 0
}

.db-StripeBackground-ghostStripe,
.db-StripeBackground-stripe {
    width: 100%;
    max-width: 460px;
    height: 64px;
    position: absolute
}

.db-StripeBackground-stripe1 {
    bottom: 256px;
    left: calc(50% - 310px)
}

.db-StripeBackground-stripe2 {
    bottom: 192px;
    left: calc(50% - 400px)
}

.db-StripeBackground-stripe3 {
    bottom: 192px;
    left: calc(50% - 60px)
}

.db-StripeBackground-gridContainer .db-StripeBackground-ghostStripe {
    max-width: 160px;
    box-shadow: inset 0 0 4px #00000026
}

.db-StripeBackground-ghostStripe1 {
    bottom: 128px;
    left: calc(50% - 310px)
}

.db-StripeBackground-ghostStripe2 {
    bottom: 0;
    left: calc(50% + 150px)
}

@media screen and (max-width:460px) {
    .db-StripeBackground {
        position: absolute
    }

    .db-StripeBackground-backgroundPatch {
        height: 52.9812px
    }

    .db-StripeBackground-gridContainer {
        z-index: 3;
        height: 614px;
        top: -485px
    }

    .db-StripeBackground-ghostStripe1,
    .db-StripeBackground-stripe1,
    .db-StripeBackground-stripe3 {
        display: none
    }

    .db-StripeBackground-stripe2 {
        bottom: 64px;
        left: 25%
    }

    .db-StripeBackground-ghostStripe2 {
        left: 80%
    }
}

@media screen and (max-height:500px) and (min-width:460px) {
    .db-StripeBackground-backgroundPatch {
        height: 237.981px
    }

    .db-StripeBackground-gridContainer {
        top: -300px
    }
}

.db-HostedLayout {
    flex-direction: column;
    min-height: 100vh;
    display: flex
}

.db-HostedLayout-platformIcon {
    z-index: 3;
    margin: 32px auto -32px
}

.db-HostedLayout-bodyWrapper {
    z-index: 2;
    width: 100%;
    max-width: 460px;
    margin: 0 auto;
    position: relative
}

.db-HostedLayout-header {
    box-sizing: border-box;
    text-align: center;
    flex-direction: column;
    align-items: center;
    padding: 40px 20px 20px;
    display: flex
}

@media screen and (max-width:460px) {
    .db-HostedLayout-bodyWrapper {
        border-bottom: 1px solid #e3e8ee
    }
}

.db-BusinessName-solePropInstructions li {
    margin: 4px auto 4px 2em;
    list-style-type: disc
}

.db-BusinessName-solePropInstructions p {
    line-height: inherit
}

.db-ReCAPTCHANotice-recaptchaElement {
    visibility: hidden
}

.db-EntityDetail {
    border-radius: 3px;
    margin-bottom: 2px;
    margin-left: 10px;
    padding-right: 8px
}

.db-EntityDetail--clickable {
    cursor: pointer
}

.db-ImageInput {
    display: inline-flex;
    position: relative
}

.db-ImageInput-BaseLayer {
    transform: translate(0)
}

.db-ImageInput-TopLayer {
    position: absolute;
    top: -4px;
    right: -4px
}

.db-ImageInput-Image {
    justify-content: center;
    align-items: center;
    display: inline-flex;
    overflow: hidden
}

.db-ImageInput-HoverParent {
    cursor: pointer
}

.db-ImageInput-HoverParent:hover [class*=Icon--hoverable] {
    color: var(--sail-gray700)
}

.db-ImageInput-DeleteButton.db-ImageInput-DeleteButton {
    display: none
}

.db-ImageInput-DeleteButton.db-ImageInput-DeleteButton:focus,
.db-ImageInput-DeleteButton.db-ImageInput-DeleteButton:hover,
.db-ImageInput:focus-within .db-ImageInput-DeleteButton,
.db-ImageInput:hover .db-ImageInput-DeleteButton {
    display: inline-flex
}

.db-HorizontalBarChart-BarChart {
    background-color: #fff;
    border-radius: 4px;
    width: 100%;
    height: 12px;
    position: relative;
    overflow: hidden
}

.db-HorizontalBarChart-BarChart--Empty {
    background-color: var(--sail-gray100)
}

.db-HorizontalBarChart-BarChart-Loading {
    transform-origin: 100%;
    background: repeating-linear-gradient(to right, var(--sail-gray50)0%, var(--sail-gray50)40%, color(var(--sail-gray100)alpha(-50%))50%, var(--sail-gray50)60%, var(--sail-gray50)100%);
    background-size: 200% 100%;
    width: 100%;
    animation: 2s linear infinite forwards HorizontalBarChart-BarChart--Loading-Animation;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    transform: translate(0)
}

.db-HorizontalBarChart-BarChart-Loading.db-is-animating-leave {
    opacity: 1;
    transform: translate(0)
}

.db-HorizontalBarChart-BarChart-Loading.db-is-animating-leave.db-is-animating-leave-active {
    opacity: 0;
    transition: transform .4s ease-out, opacity .4s ease-out;
    transform: translate(100%)
}

.db-HorizontalBarChart-BarChart-Loading.db-is-animating-enter {
    opacity: 0;
    transform: translate(100%)
}

.db-HorizontalBarChart-BarChart-Loading.db-is-animating-enter.db-is-animating-enter-active {
    opacity: 1;
    transition: transform .4s ease-in, opacity .4s ease-in;
    transform: translate(0)
}

.db-HorizontalBarChart-BarChart-Bars {
    flex-direction: row;
    width: 100%;
    display: flex
}

.db-HorizontalBarChart-BarChart-Bars.db-is-animating-enter {
    transform-origin: 0;
    transform: scaleX(.001)
}

.db-HorizontalBarChart-BarChart-Bars.db-is-animating-enter.db-is-animating-enter-active {
    transition: transform .4s cubic-bezier(.445, .05, .55, .95);
    transform: scaleX(1)
}

.db-HorizontalBarChart-BarChart-Bars.db-is-animating-leave {
    transform-origin: 0;
    transform: scaleX(1)
}

.db-HorizontalBarChart-BarChart-Bars.db-is-animating-leave.db-is-animating-leave-active {
    transition: transform .4s cubic-bezier(.445, .05, .55, .95);
    transform: scaleX(.001)
}

.db-HorizontalBarChart-BarChart-Bar {
    opacity: 1;
    position: relative
}

.db-HorizontalBarChart-BarChart-Bar--faded {
    opacity: .15
}

.db-HorizontalBarChart-Legend {
    border: 1px solid var(--sail-gray100);
    border-radius: 4px
}

@keyframes HorizontalBarChart-BarChart--Loading-Animation {
    0% {
        background-position: 200% 0
    }

    to {
        background-position: 0 0
    }
}

.db-ExampleResponses {
    z-index: 1;
    background: #fff;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    width: 50%;
    margin-left: 16px;
    position: absolute;
    left: 100%;
    box-shadow: 0 0 0 1px #8898aa1a, 0 15px 35px #31315d1a, 0 5px 15px #00000014
}

.db-ExampleResponses:before {
    content: "";
    background: var(--blue500);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    height: 2px;
    display: block
}

.db-ExampleResponses.db-is-above {
    bottom: 0
}

.db-ExampleResponses.db-is-below {
    top: 0
}

.db-ExampleResponses-count {
    margin-left: 4px
}

.db-ExampleResponses-nextPrevious {
    margin-left: auto;
    display: inline-block
}

.db-ExampleResponsesV2 {
    z-index: 1;
    background: #fff;
    border-radius: 4px;
    width: 400px;
    margin-left: 16px;
    box-shadow: 0 0 0 1px #8898aa1a, 0 15px 35px #31315d1a, 0 5px 15px #00000014
}

.db-ExampleResponsesV2.db-is-above {
    bottom: 0
}

.db-ExampleResponsesV2.db-is-below {
    top: 0
}

.db-ExampleResponsesV2-count {
    margin-left: 4px
}

.db-ExampleResponsesV2-nextPrevious {
    margin-left: auto;
    display: inline-block
}

.db-QuestionContainer {
    width: 66.6%
}

.db-QuestionContainer.db-is-disabled {
    opacity: .5;
    pointer-events: none
}

.db-QuestionContainer.db-is-maximized {
    width: auto
}

.db-QuestionContainerV2 {
    width: 100%
}

.db-QuestionContainerV2.db-is-disabled {
    opacity: .5;
    pointer-events: none
}

.db-QuestionContainerV2.db-is-maximized {
    width: auto
}

.db-ShortAnswerQuestion-container {
    position: relative
}

.db-ShortAnswerQuestionV2-container {
    align-items: flex-start;
    display: flex;
    position: relative
}

.db-ShortAnswerQuestionV2-textarea {
    flex-grow: 1
}

.db-PlatformTypeV2Question {
    grid-gap: 12px;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 8px;
    display: grid
}

@media (max-width:1200px) {
    .db-PlatformTypeV2Question {
        grid-template-columns: repeat(2, 1fr)
    }
}

.db-PlatformTypeV2Question-platformTypeContainer:hover {
    box-shadow: 0 2px 4px #3e41580d, 0 1px 1.5px #2a305414
}

.db-PlatformTypeV2Question-platformTypeLabel {
    margin-bottom: 2px
}

.db-PlatformTypeV2Question-platformTypeContainer:hover .db-PlatformTypeV2Question-platformTypeLabel {
    color: var(--sail-gray900)
}

.db-PlatformTypeV2Question-platformTypeLabel.db-is-selected.db-is-selected {
    color: var(--sail-blue500)
}

.db-PlatformTypeV2Question-platformType {
    padding: 12px;
    display: flex
}

.db-PlatformTypeV2Question-radio {
    cursor: pointer;
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.db-PlatformTypeV2Question-description {
    flex-direction: column;
    flex: 1;
    margin-left: 12px;
    display: flex
}

.db-ChartLegendListView {
    border: 1px solid var(--sail-gray100);
    border-radius: 4px
}

.db-StableLoadingState--isLoading {
    justify-content: center;
    align-items: center;
    display: flex
}

.db-StripeGrid {
    z-index: -1;
    pointer-events: none;
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0
}

.db-StripeGrid-stripeContainer {
    flex-direction: column;
    align-items: center;
    display: flex;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    transform: skewY(-12deg)
}

.db-FadeInTransition-Value--fast {
    animation: .2s forwards FadeInTransition-Value--fadeIn
}

.db-FadeInTransition-Value--medium {
    animation: .4s forwards FadeInTransition-Value--fadeIn
}

.db-FadeInTransition-Value--slow {
    animation: .6s forwards FadeInTransition-Value--fadeIn
}

@keyframes FadeInTransition-Value--fadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.db-StripeBackgroundHeader--bootstrap {
    top: 22px;
    right: 35px
}

@media (max-width:1260px) {
    .db-StripeBackgroundHeader-leftmostStripe {
        display: none
    }
}

.db-MiniExternalAccount-Flourish {
    fill: var(--sail-gray500)
}

.db-HighlightedCaptionMono--text {
    background: color(var(--sail-gray100)alpha(-60%));
    border: 1px solid var(--sail-gray100);
    border-radius: 4px;
    padding-top: 1px
}

.db-CurrencyIcon-USDC-svgCircle,
.db-CurrencyIcon-USDC-svg circle {
    fill: #2775ca
}

.db-CurrencyIcon-USDC-svg path {
    fill: var(--sail-color-white)
}

.db-CollapsibleView:hover {
    background-color: var(--sail-gray50)
}

.db-Highlightable {
    background-color: #0000;
    border-radius: 2px;
    margin-left: -4px;
    padding-left: 4px;
    padding-right: 4px;
    transition: background-color .4s ease-in-out
}

.db-Highlightable--highlight {
    background-color: #f9ecda;
    transition: background-color .125s ease-in-out
}

.db-Slider {
    height: 14px;
    position: relative
}

.db-Slider-tick {
    width: 8px;
    height: 8px;
    z-index: inherit;
    border-radius: 4px;
    margin-left: -4px;
    position: absolute;
    top: -3px
}

.db-Slider-thumb--parent {
    zIndex: 2;
    position: absolute
}

.db-Slider-input {
    opacity: 0;
    z-index: 3;
    border: 0;
    width: calc(100% + 14px);
    height: 14px;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    left: -7px;
    right: -7px
}

.db-Slider-input:focus {
    outline: none
}

.db-Slider-track {
    z-index: 1;
    height: 2px;
    margin-left: 4px;
    margin-right: 4px;
    position: relative;
    top: 6px
}

.db-Slider-thumb {
    top: -6px;
    left: -7px
}

input[type=range].Slider-input {
    -webkit-appearance: none
}

input[type=range].Slider-input::-ms-thumb {
    border: 0;
    border-radius: 0;
    width: 14px;
    height: 14px
}

input[type=range].Slider-input::-ms-tooltip {
    display: none
}

input[type=range].Slider-input::-moz-range-thumb {
    border: 0;
    border-radius: 0;
    width: 14px;
    height: 14px
}

input[type=range].Slider-input::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: 0;
    border-radius: 0;
    width: 14px;
    height: 14px
}

.db-StickyHeader {
    z-index: var(--Chrome-zIndex--sticky);
    position: absolute
}

.db-StickyHeader--isFixed {
    position: fixed
}

.db-StickyHeader--animating-enter {
    opacity: 0
}

.db-StickyHeader--animating-enter-active {
    opacity: 1;
    transition: opacity .2s ease-in-out
}

.db-StickyHeader--animating-leave {
    opacity: 1
}

.db-StickyHeader--animating-leave-active {
    opacity: 0;
    transition: opacity .2s ease-in-out
}

.db-RulesetHeader-allow {
    color: #24b47e
}

.db-RulesetHeader-block {
    color: #e25950
}

.db-RulesetHeader-request_credentials {
    color: #32325d
}

.db-RulesetHeader-manual_review {
    color: #e39f48
}

.db-RadarRulesListUserName .db-RadarRulesListUserName-stripeIcon {
    border-radius: 50%
}

.db-RadarRulesListsItem-button {
    margin-top: -4px
}

.db-RadarRulesLists-spinner {
    height: 872px
}

.db-ShieldSection-definitionTooltip {
    -webkit-text-decoration: underline dashed var(--gray300);
    -webkit-text-decoration: underline dashed var(--gray300);
    text-decoration: underline dashed var(--gray300);
    cursor: help
}

.db-DisputeEvidenceSubmissionFormContent-chargebackDetails {
    display: none
}

@media (min-width:1102px) {
    .db-DisputeEvidenceSubmissionFormContent-chargebackDetails {
        width: 232px;
        display: block;
        position: fixed;
        top: 123px;
        left: 72px
    }

    .db-DisputeEvidenceSubmissionFormContent-feedbackLayer {
        z-index: 302 !important
    }
}

.db-DisputeEvidenceSubmissionFormContent-previousChargeCell {
    box-shadow: inset 0 -1px 0 0 var(--sail-gray100)
}

.db-DisputeEvidenceSubmissionFormContent-previousChargeRow:last-child .db-DisputeEvidenceSubmissionFormContent-previousChargeCell {
    box-shadow: none
}

.db-SetupIntentPaymentActionsCell .db-SetupIntentPaymentActionsCell-placeholder {
    z-index: 1;
    transition: opacity .25s;
    position: relative
}

.db-SetupIntentPaymentActionsCell .db-SetupIntentPaymentActionsCell-outerbox {
    height: 100%;
    position: relative
}

.db-SetupIntentPaymentActionsCell .db-SetupIntentPaymentActionsCell-innerbox {
    z-index: 2;
    opacity: 0;
    pointer-events: none;
    transition: opacity .25s;
    position: absolute;
    top: 0;
    right: 0
}

.db-SetupIntentPaymentActionsCell .db-SetupIntentPaymentActionsCell-placeholder--menuopen,
.db-SetupIntentPaymentActionsCell:hover .db-SetupIntentPaymentActionsCell-placeholder {
    opacity: 0;
    transition: opacity .25s
}

.db-SetupIntentPaymentActionsCell .db-SetupIntentPaymentActionsCell-innerbox--menuopen,
.db-SetupIntentPaymentActionsCell:hover .db-SetupIntentPaymentActionsCell-innerbox {
    opacity: 1;
    pointer-events: all;
    transition: opacity .25s
}

.db-SignalsDialogContent {
    height: calc(100vh - 235px);
    overflow-y: scroll
}

.db-SignalsDataTable {
    margin-top: 12px;
    font-size: 14px;
    line-height: 20px
}

.db-TransactionPattern-TableRow {
    font-size: 12px;
    line-height: 20px
}

.db-TransactionPattern-TableRow--emphasized {
    color: var(--sail-gray600)
}

.db-RadarFraudRateInsight-BucketLabel {
    font-size: 8px;
    line-height: 10px
}

.db-RfftDisputesPromotion-dismiss {
    z-index: 3;
    position: absolute;
    top: 16px;
    right: 20px
}

.db-PartitionedProgressBar {
    background-color: #e3e8ee;
    margin-right: 2px;
    overflow: hidden
}

.db-PartitionedProgressBar-last {
    background-color: #e3e8ee;
    overflow: hidden
}

.db-PartitionedProgressBar--inner {
    transform-origin: 0;
    height: 100%;
    margin-left: -2px;
    transition: transform .2s;
    position: relative
}

.db-CBMPChart {
    stroke-dasharray: 2000;
    stroke-dashoffset: 2000px;
    animation: 1.2s linear forwards draw
}

@keyframes draw {
    to {
        stroke-dashoffset: 0
    }
}

.db-ThresholdSettingsBaseSlider {
    height: 14px;
    position: relative
}

.db-ThresholdSettingsBaseSlider-tick {
    width: 8px;
    height: 8px;
    z-index: inherit;
    border-radius: 4px;
    margin-left: -4px;
    position: absolute;
    top: -4px
}

.db-ThresholdSettingsBaseSlider-thumb-parent {
    z-index: 2;
    position: absolute
}

.db-ThresholdSettingsBaseSlider-input {
    opacity: 0;
    z-index: 3;
    border: 0;
    width: calc(100% - 46px);
    height: 14px;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    left: 32px;
    right: -7px
}

.db-ThresholdSettingsBaseSlider-input:focus {
    outline: none
}

.db-ThresholdSettingsBaseSlider-track {
    z-index: 1;
    height: 0;
    margin-left: 40px;
    margin-right: 20px;
    position: relative;
    top: 6px
}

.db-ThresholdSettingsBaseSlider-track-extremes {
    z-index: 0;
    height: 3px;
    margin-left: 0;
    margin-right: 0;
    position: relative;
    top: 3px
}

.db-ThresholdSettingsBaseSlider-thumb {
    color: #87909f;
    -webkit-user-select: none;
    user-select: none;
    padding-top: 6px;
    padding-left: 3px;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    top: -15px;
    left: -14px;
    width: 28px !important;
    height: 28px !important
}

input[type=range].ThresholdSettingsBaseSlider-input {
    -webkit-appearance: none
}

input[type=range].ThresholdSettingsBaseSlider-input::-ms-thumb {
    border: 0;
    border-radius: 0;
    width: 14px;
    height: 14px
}

input[type=range].ThresholdSettingsBaseSlider-input::-ms-tooltip {
    display: none
}

input[type=range].ThresholdSettingsBaseSlider-input::-moz-range-thumb {
    border: 0;
    border-radius: 0;
    width: 14px;
    height: 14px
}

input[type=range].ThresholdSettingsBaseSlider-input::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: 0;
    border-radius: 0;
    width: 14px;
    height: 14px
}

.db-EventAndLogsSection-border {
    border-left: 2px solid var(--sail-blue500);
    height: 100%;
    transition: border-left-color .2s ease-in-out
}

.db-EventAndLogsSection-timeline-border-selected {
    border: 1px solid var(--sail-blue500);
    height: 100%;
    transition: border-color .5s ease-in-out;
    box-shadow: 0 2px 5px #32325d1a, 0 1px 1.5px #00000012
}

.db-EventAndLogsSection-next-step-border-blue {
    border-left: 3px solid var(--sail-blue500);
    height: 100%;
    transition: border-left-color .2s
}

.db-EventAndLogsSection-timeline-border-unselected {
    border: 1px solid var(--sail-gray100);
    height: 100%
}

.db-EventsAndLogsSection-timeline-line {
    color: var(--sail-gray300)
}

.db-EventAndLogsSection-next-step-border {
    border-left: 3px solid var(--sail-gray400);
    height: 100%;
    transition: border-left-color .2s
}

.db-EventAndLogsSection-pointer {
    cursor: pointer
}

.db-PaymentTimeline-header {
    z-index: 3;
    position: relative
}

.db-CreatePaymentForm-currencySelect {
    z-index: 3
}

.db-CreatePaymentForm-currencySelect:focus-within {
    z-index: 5
}

.db-CreatePaymentForm-currencySelect>div>div>div>div {
    box-shadow: 0 0 #0000, 0 0 #0000, 0 0 #0000001f, 0 0 0 1px #40445229, 0 0 #0000, 0 0 #0000, 0 2px 5px #40445214 !important
}

.db-CreatePaymentForm-currencySelect>div>div>div>div:focus-within {
    box-shadow: 0 0 #0000, 0 0 0 4px #0196ed5c, 0 1px 1px #0000001f, 0 0 0 1px #40445229, 0 0 #0000, 0 0 #0000, 0 2px 5px #40445214 !important
}

.db-HorizontalBarChartAndLegend-BarChartWrapper {
    background-color: #fff;
    border-radius: 4px;
    width: 100%;
    height: 6px;
    position: relative;
    overflow: hidden
}

.db-HorizontalBarChartAndLegend--empty {
    background-color: var(--sail-gray100)
}

.db-HorizontalBarChartAndLegend-BarChart {
    flex-direction: row;
    width: 100%;
    display: flex
}

.db-HorizontalBarChartAndLegend-BarChart-BarSection {
    opacity: 1;
    height: 6px;
    position: relative
}

.db-HorizontalBarChartAndLegend-BarChart-BarSection--faded {
    opacity: .15
}

.db-StripeElements {
    width: 100%;
    margin-top: 8px;
    margin-bottom: 8px;
    display: flex
}

.db-StripeElements:first-child {
    margin-top: 0
}

.db-StripeElements:last-child {
    margin-bottom: 0
}

.db-StripeElements-field {
    flex: auto;
    width: 100%;
    height: 28px;
    margin-right: 8px;
    padding-top: 3px;
    background-color: #fff !important
}

.db-StripeElements-field:last-child {
    margin-right: 0
}

.db-StripeElements-button {
    flex: none;
    margin-left: 0;
    margin-right: 8px
}

.db-StripeElements-button:last-child {
    margin-right: 0
}

.db-StripeElements-dismiss {
    cursor: pointer;
    background: 0 0;
    border: none;
    align-self: center;
    padding: 0;
    display: flex
}

.db-SettingsForm-footer {
    background-color: #fff;
    justify-content: flex-end;
    align-items: center;
    display: flex
}

.db-SettingsForm-footerMessage {
    margin-right: 14px
}

.db-SettingsForm-errorMessage {
    color: var(--red500)
}

.db-PayoutSettings-radioLabelText {
    cursor: pointer
}

.db-PayoutSettings-scheduleSelect {
    position: relative;
    top: -1px
}

.db-PayoutSettings-directDebitGuarantee {
    height: 200px;
    overflow-y: auto
}

.db-ApiKeyExpiration {
    color: var(--red--4);
    font-size: var(--font-size--x-small)
}

.db-ApiKeyInfo--hidden {
    visibility: hidden
}

.db-ApiKeyInfo-none {
    color: var(--slate--6);
    font-style: italic
}

.db-ApiKeyInfo-section {
    padding: 5px
}

.db-ApiKeyInfo-sectionHeading {
    text-transform: uppercase;
    font-weight: var(--font-weight--medium);
    font-size: var(--font-size--x-small);
    color: var(--slate--5)
}

.db-ApiKeyInfo-permissions {
    font-size: var(--font-size);
    white-space: normal;
    max-width: 250px
}

.db-ApiKeySecret--visible {
    height: 24px;
    margin: -2px 0
}

.db-ApiKeySecret--blurred {
    background-image: url(/manage-statics-srv/assets/img/settings/api_keys/secret@2x.82c33757.png);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 240px 24px;
    width: 240px;
    height: 24px;
    margin: -2px 0
}

.db-ApiKeySecret-reveal .db-ApiKeySecret-hide {
    margin: 0 auto
}

.db-ApiKeySecret-Action {
    align-items: center;
    gap: 8px;
    max-width: 100%;
    display: flex;
    overflow: hidden
}

.db-ApiKeySecret-dots {
    white-space: nowrap;
    overflow: hidden
}

.db-RenameKeyModal-keyNameLabel {
    font-size: var(--font-size--large);
    flex: none;
    padding-right: 15px
}

.db-RenameKeyModal-textInput {
    font-size: var(--font-size--large);
    flex: 1 0 auto
}

.db-RenameKeyModal-errorMessage {
    color: var(--red--4)
}

.db-BusinessSettings-input {
    width: 250px
}

.db-BusinessSettings-input--withTooltip {
    align-items: center;
    display: flex
}

.db-BusinessSettings-countrySelect {
    width: 323px
}

.db-BusinessSettings-descriptorInput {
    width: 250px;
    margin-right: 10px
}

.db-BusinessSettings-address .bs-TextInputGroup>.bs-TextInput:last-child {
    width: 104px
}

.db-BusinessSettings-address .bs-TextInput:first-child:last-child,
.db-BusinessSettings-address .bs-TextInputGroup>.bs-TextInput:first-child {
    width: 250px
}

.db-BusinessSettings-address .bs-Select {
    width: 189px
}

.db-BusinessSettings-phoneInput .bs-TextInput {
    flex-grow: 1
}

.db-BusinessSettings-warning {
    border-top: 1px solid var(--gray100)
}

.bs-Fieldset-row.bs-is-invalid .db-BusinessSettings-address .bs-Button {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-red-500-rgb), .5), 0 1px 1px #00000014
}

.db-PCICompliance-contentLoading {
    justify-content: center;
    align-items: center;
    height: 125px;
    display: flex
}

.db-PCICompliance-headerSuccess {
    color: var(--green500)
}

.db-PCICompliance-headerStatusLine {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: 5px;
    display: flex
}

.db-PCICompliance-headerReadMoreLink {
    margin-left: 3px
}

.db-PCICompliance-integrationInfo+.db-PCICompliance-survey {
    margin-top: 20px
}

.db-PCICompliance-survey {
    padding-top: 20px;
    padding-left: 50px;
    list-style-type: none
}

.db-PCICompliance {
    flex-direction: column;
    display: flex
}

.db-PCICompliance--body {
    flex-grow: 1
}

.db-PCICompliance--actions {
    margin-top: 15px
}

.db-PCICompliance--captionError {
    color: var(--red500)
}

.db-PCICompliance--captionError,
.db-PCICompliance--captionSuccess {
    margin-bottom: 8px
}

.db-PCICompliance-surveyQuestionContainer {
    margin-top: 20px;
    margin-bottom: 15px
}

.db-PCICompliance-surveyQuestionContainer:first-child {
    margin-top: 0
}

.db-PCICompliance-surveyQuestionContainer:last-child {
    margin-bottom: 0
}

.db-PCICompliance-surveyQuestion {
    align-items: flex-start;
    display: flex
}

.db-PCICompliance-surveyQuestionLabel {
    width: 500px;
    line-height: 22px
}

.db-PCICompliance-surveyQuestionRadio {
    align-items: center
}

.db-PCICompliance-surveyQuestionRadio:first-of-type {
    margin-right: 30px
}

.db-IntegrationSettings-warningListItem {
    list-style: initial;
    margin-bottom: 3px;
    margin-left: 16px
}

.db-RoleSettings .bs-Tail {
    margin-bottom: 75px
}

.db-RoleList {
    width: 100%;
    display: table
}

.db-RoleList-title .bs-Badge {
    vertical-align: baseline;
    margin-left: 10px
}

.db-Role {
    color: var(--gray900);
    border-bottom: 1px solid var(--gray100);
    align-items: center;
    line-height: 26px;
    display: table-row
}

.db-Role:last-child {
    border: none;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px
}

.db-Role:nth-child(odd) {
    background-color: var(--background-color--light)
}

.db-Role-cell {
    padding: 10px;
    display: table-cell
}

.db-Role-cell--name {
    width: 210px;
    padding-left: 20px
}

.db-Role-cell--description {
    padding-right: 60px;
    line-height: 1.5em
}

.db-Role-cell--empty {
    color: var(--slate--5);
    font-style: italic
}

.db-Role-cell--count {
    color: var(--gray400);
    text-align: right;
    white-space: nowrap;
    width: 120px
}

.db-Role-cell--actions {
    text-align: right;
    width: 120px
}

.db-Role-cell--info {
    padding-right: 20px
}

.db-RoleRadioList {
    max-height: 401px;
    margin-bottom: -1px;
    overflow-y: auto
}

.db-CustomizeEmailReceiptDesign-container {
    justify-content: center;
    display: flex
}

.db-CustomizeEmailReceiptDesign-optionsCard {
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: #ffffff8c;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 300px;
    margin-right: 30px;
    padding: 15px 30px;
    display: flex;
    box-shadow: 0 1px 2px #0000001a
}

.db-CustomizeEmailReceiptDesign-optionsCardTitle {
    align-items: center;
    width: 100%;
    margin-bottom: 15px;
    display: flex
}

.db-CustomizeEmailReceiptDesign-optionsCardWrapper {
    position: relative
}

.db-CustomizeEmailReceiptDesign-clearButton {
    opacity: 0;
    pointer-events: none;
    background-color: #00000080;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    margin-top: auto;
    margin-bottom: auto;
    display: flex;
    position: absolute;
    top: 0;
    bottom: 0;
    right: -36px
}

.db-CustomizeEmailReceiptDesign-optionsCard:hover .db-CustomizeEmailReceiptDesign-clearButton {
    opacity: .75;
    pointer-events: auto
}

.db-CustomizeEmailReceiptDesign-optionsCard:hover .db-CustomizeEmailReceiptDesign-clearButton:hover {
    opacity: 1
}

.db-CustomizeEmailReceiptDesign-clearButton:hover {
    cursor: pointer
}

.db-CustomizeEmailReceiptDesign-optionsCardIconDescription:after,
.db-CustomizeEmailReceiptDesign-optionsCardTitle:after {
    content: "";
    background-color: var(--slate--3);
    opacity: .25;
    flex: 1;
    width: 100%;
    height: 1px;
    display: block
}

.db-CustomizeEmailReceiptDesign-optionsCardIconDescription:after {
    margin-top: 15px;
    margin-bottom: 15px
}

.db-CustomizeEmailReceiptDesign-optionsCardTitle:after {
    margin-left: 15px
}

.db-CustomizeEmailReceiptDesign-optionsCardIconContainer {
    flex-direction: column;
    align-items: center;
    display: flex
}

.db-CustomizeEmailReceiptDesign-optionsCardIconDescription {
    text-align: center
}

.db-CustomizeEmailReceiptDesign-optionsCardIconTitle {
    margin-bottom: 10px
}

.db-CustomizeEmailReceiptDesign-optionsCardIcon {
    position: relative
}

.db-CustomizeEmailReceiptDesign-optionsCardIconUploadError {
    color: red;
    margin-bottom: 10px;
    font-size: 12px
}

.db-CustomizeEmailReceiptDesign-optionsCardIconImage,
.db-CustomizeEmailReceiptDesign-optionsCardUploadIcon {
    border-radius: 50%;
    width: 62px;
    height: 62px
}

.db-CustomizeEmailReceiptDesign-optionsCardIcon {
    border: 1px solid var(--border-color);
    border-radius: 50%;
    padding: 4px;
    box-shadow: inset 0 1px 2px #0000002e
}

.db-CustomizeEmailReceiptDesign-optionsCardIcon,
.db-CustomizeEmailReceiptDesign-optionsCardIconInput {
    width: 72px;
    height: 72px
}

.db-CustomizeEmailReceiptDesign-optionsCardIcon,
.db-CustomizeEmailReceiptDesign-optionsCardTitle {
    margin-bottom: 10px
}

.db-CustomizeEmailReceiptDesign-optionsCardIcon .db-CustomizeEmailReceiptDesign-optionsCardUploadIcon--uploading,
.db-CustomizeEmailReceiptDesign-optionsCardIcon:hover .db-CustomizeEmailReceiptDesign-optionsCardUploadIcon {
    opacity: 1
}

.db-CustomizeEmailReceiptDesign-optionsCardIconImage {
    content: "";
    background-image: url(/manage-statics-srv/assets/img/settings/applications/settings/placeholder/icon.3e96c744.png);
    background-position: 50%;
    background-size: cover;
    width: 100%;
    height: 100%;
    display: block
}

.db-CustomizeEmailReceiptDesign-optionsCardUploadIcon {
    pointer-events: none;
    opacity: 0;
    background-color: #00000080;
    justify-content: center;
    align-items: center;
    margin: auto;
    display: flex;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.db-CustomizeEmailReceiptDesign-clearButton,
.db-CustomizeEmailReceiptDesign-optionsCardUploadIcon {
    transition: opacity .15s linear
}

.db-CustomizeEmailReceiptDesign-optionsCardIconInstructions {
    color: var(--slate--5);
    font-size: 12px
}

.db-EmailReceiptPreview {
    border-radius: var(--border-radius);
    color: #fff;
    background-color: #fff;
    width: 600px;
    height: 420px;
    position: relative;
    overflow: hidden
}

.db-EmailReceiptPreview-border {
    border-radius: var(--border-radius);
    pointer-events: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    box-shadow: inset 0 0 0 1px #0000001a
}

.db-EmailReceiptPreview-banner {
    vertical-align: bottom;
    width: 600px;
    display: table-cell
}

.db-EmailReceiptPreview-bannerLeft {
    vertical-align: bottom;
    background-size: 100% 100%;
    width: 252px;
    height: 156px;
    display: table-cell;
    background-image: url(https://stripe-images.stripecdn.com/notifications/hosted/20180110/Header/Left.png) !important;
    background-position: 100% 100% !important
}

.db-EmailReceiptPreview-bannerRight {
    vertical-align: bottom;
    background-size: 100% 100%;
    width: 252px;
    height: 156px;
    display: table-cell;
    background-image: url(https://stripe-images.stripecdn.com/notifications/hosted/20180110/Header/Right.png) !important;
    background-position: 0 100% !important
}

.db-EmailReceiptPreview-bannerIcon {
    vertical-align: bottom;
    background-size: 100% 100%;
    width: 96px;
    height: 156px;
    display: table-cell;
    background-image: url(https://stripe-images.stripecdn.com/notifications/hosted/20180110/Header/Icon--empty.png) !important;
    background-position: bottom !important
}

.db-EmailReceiptPreview-merchantIcon {
    border: 3px solid #fff;
    border-radius: 50%;
    width: 70px;
    height: 70px;
    margin: 0 auto 24px;
    display: block
}

.db-EmailReceiptPreview-merchantIconImg {
    border-radius: 50%;
    width: 64px;
    height: 64px
}

.db-EmailReceiptPreview-intro {
    color: #32325d;
    text-align: center;
    margin-top: -8px;
    padding: 0 0 8px;
    font-size: 22px;
    line-height: 22px
}

.db-EmailReceiptPreview-subintro {
    color: #8898aa;
    text-align: center;
    font-size: 15px;
    line-height: 18px
}

.db-EmailReceiptPreview-dataBlockItem {
    width: 190px;
    padding: 20px 30px;
    display: table-cell
}

.db-EmailReceiptPreview-summaryTitle {
    padding: 8px 16px
}

.db-EmailReceiptPreview-dataBlockTitle,
.db-EmailReceiptPreview-summaryTitle {
    color: #8898aa;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px
}

.db-EmailReceiptPreview-dataBlockText {
    color: #525f7f;
    font-size: 15px;
    line-height: 24px
}

.db-EmailReceiptPreview-breakdown {
    background-color: #f6f9fc;
    border-radius: 4px;
    margin: 0 10px
}

.db-EmailReceiptPreview-row {
    color: #525f7f;
    height: 40px;
    padding: 0 17px;
    font-size: 15px;
    line-height: 40px
}

.db-EmailReceiptPreview-rowLeft {
    float: left
}

.db-EmailReceiptPreview-rowRight {
    float: right
}

.db-SendTestReceiptModal-emailInput {
    min-width: 134px;
    max-width: 253px
}

.db-TaxInfoForm-solePropInstructions li {
    margin-left: 2em;
    list-style-type: disc
}

.db-WarehouseButton {
    border: 1px solid #ebeef1;
    border-radius: 4px;
    height: 112px;
    position: relative
}

.db-WarehouseButton.db-selected:before {
    content: " ";
    z-index: 1;
    border-radius: 4px;
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    box-shadow: 0 0 0 4px #3a97d45c
}

.db-OnboardingGuideItem-ListElement {
    text-align: center;
    background-color: #27486a;
    border-radius: 12px;
    width: 24px;
    height: 24px;
    line-height: 24px
}

.db-SDPStatus-DataLoadingNotice {
    border: 1px solid #e0e6eb;
    border-radius: 4px
}

.db-DeleteUser strong {
    font-weight: 700
}

.db-InviteSetting-header {
    margin-bottom: 10px
}

.db-InviteSetting-headerDescription {
    padding: 6px 0 11px
}

.db-UserList .bs-is-highlighted {
    color: inherit;
    font-size: 15px
}

.db-UserListRow--withName {
    height: 64px
}

.db-UserListRow--invite .bs-ObjectList-cell {
    color: var(--gray400)
}

.db-UserSearch {
    border: 1px solid var(--border-color--field);
    border-radius: 5px;
    width: 320px;
    padding: 5px 10px
}

.db-SearchableMultiSelect-card {
    width: 100%
}

.db-SearchableMultiSelect-tableHeader {
    box-shadow: inset 0 1px var(--sail-color-gray-100), inset 0 -1px var(--sail-color-gray-100)
}

.db-SearchableMultiSelect-card {
    width: 400px;
    margin-bottom: 12px
}

.db-SearchableMultiSelect-search {
    border: none;
    outline: none;
    width: 100%;
    padding-left: 8px
}

.db-SearchableMultiSelect-search:focus {
    border: none;
    outline: none
}

.db-SearchableMultiSelect-itemText:hover {
    cursor: pointer
}

.db-SearchableMultiSelect-table {
    box-shadow: inset 0 1px var(--sail-color-gray-100);
    padding-top: 1px
}

.db-SearchableMultiSelect-ItemGroup-cell {
    background: var(--sail-color-gray-100) !important
}

.db-DetailsContent {
    height: 75vh
}

.db-Hidden {
    visibility: hidden
}

.db-VersionUsageChart {
    width: 100%;
    height: 100%
}

.db-VersionUsageChart-column {
    cursor: pointer;
    flex-grow: 1;
    height: 100%
}

.db-VersionUsageChart-fill {
    border-width: 1px 0 0;
    border-color: var(--blue--4);
    border-style: solid;
    margin-right: 1px
}

.db-DeveloperChart-stack {
    height: 100%;
    box-shadow: 0px -1px var(--slate--8)inset
}

.db-DeveloperChart--empty {
    justify-content: center;
    align-items: center;
    height: 100%;
    display: flex
}

.db-DeveloperChartAxes-left {
    width: 32px
}

.db-DeveloperChartAxes-right {
    flex-grow: 1
}

.db-DeveloperChartHover-time {
    white-space: nowrap;
    flex-grow: 1
}

.db-DeveloperChartHoverRow-color {
    border-radius: 8px;
    width: 8px;
    min-width: 8px;
    height: 8px
}

.db-DeveloperChartHoverRow-text {
    white-space: nowrap;
    flex-grow: 1
}

.db-DeveloperChartHoverRow-color--blue4 {
    background-color: var(--blue500)
}

.db-DeveloperChartHoverRow-color--purple6 {
    background-color: var(--purple300)
}

.db-DeveloperChartHoverRow-color--green {
    background-color: var(--green400)
}

.db-DeveloperChartHoverRow-color--cyan6 {
    background-color: var(--cyan300)
}

.db-DeveloperChartHoverRow-color--slate6 {
    background-color: var(--gray300)
}

.db-DeveloperChartHoverRow-color--red {
    background-color: var(--red400)
}

.db-DeveloperChartHoverRow-color--empty {
    border: 1px solid var(--gray300)
}

.db-ActionableErrors-group:hover {
    cursor: pointer;
    background-color: #f7fafc
}

.db-ActionableErrors-group:not(:first-of-type) {
    border-top: 1px solid #e3e8ed
}

.db-ActionableErrors-linecell {
    padding: 12px 8px
}

.db-ActionableErrors-linecell:first-of-type {
    padding-left: 18px
}

.db-ActionableErrors-linecell:last-of-type {
    padding-right: 21px
}

.db-LogLines {
    cursor: pointer
}

.db-LogLine--isPreviewing,
.db-LogLine:hover {
    background-color: #f7fafc
}

.db-PreviewLink {
    opacity: 0
}

.db-PreviewLink--isPreviewing,
.db-LogLine:hover .db-PreviewLink {
    opacity: 1
}

.db-LogLine-previewPane {
    min-height: 100%
}

.db-RequestLogs-json-display .db-JsonDisplay-line {
    padding-left: 30px
}

.db-RequestLogs-json-display .db-JsonDisplay-line:before {
    text-align: left;
    width: 30px;
    padding-right: 0
}

.db-RequestLogs-json-display .db-JsonDisplay-property {
    color: var(--black)
}

.db-LogsSplitView-list-group-header {
    z-index: 1;
    background-color: var(--sail-color-white);
    box-shadow: inset 0 -1px 0 0 var(--sail-gray100);
    position: sticky;
    top: 0
}

.db-LangSwitcher {
    margin-bottom: -4px;
    box-shadow: none !important;
    background-color: #0000 !important
}

.db-RightSide-container {
    height: 100%
}

.db-RightSide-tab {
    margin-right: 8px
}

.db-DataPreviewJsonDisplay,
.db-DataPreviewJsonDisplay .db-JsonDisplay-line:before {
    background-color: #0000
}

.db-ReceivedEventsTab-hintContainer {
    position: relative;
    transform: translateY(50%)
}

.db-ReceivedEventsTab-hintContainer:after {
    content: "";
    border: 8px solid #0000;
    border-top: none;
    border-bottom: 6px solid #5469d4;
    width: 0;
    height: 0;
    display: block;
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translate(-50%)
}

.db-ReceivedEventsTab-hintContainer:after:hover {
    pointer-events: none
}

.db-ReceivedEventsTab-hintContent {
    color: #fff;
    text-align: center;
    background: #5469d4;
    border-radius: 4px;
    width: 185px;
    padding: 8px 12px
}

.db-EventSelector-container {
    height: 100%;
    position: relative
}

.db-EventSelector-backButton {
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-120%)
}

.db-EventSelectorList-fadeWrapper {
    position: relative;
    overflow: hidden
}

.db-EventSelectorList-fadeWrapper--bottom:after,
.db-EventSelectorList-fadeWrapper--top:before {
    content: "";
    z-index: 1;
    pointer-events: none;
    width: 100%;
    height: 4em;
    position: absolute;
    left: 0
}

.db-EventSelectorList-fadeWrapper--top:before {
    background-image: linear-gradient(#fff 10%, #fff0);
    top: 0
}

.db-EventSelectorList-fadeWrapper--bottom:after {
    background-image: linear-gradient(#fff0, #fff 90%);
    bottom: 0
}

.db-CodeDisplay-positionalWrapper {
    height: 100%;
    position: relative;
    overflow: hidden
}

.db-CodeDisplay-scrollContainer {
    height: 100%;
    overflow: scroll
}

.db-CodeDisplay-container {
    min-width: 100%;
    display: inline-block
}

.db-CodeDisplay-line {
    white-space: pre;
    line-height: 20px
}

.db-CodeDisplay-line--highlighted {
    background-color: var(--sail-gray100)
}

.db-CodeDisplay-line.db-JsonDisplay-line:before {
    background-color: #0000
}

.db-CodeDisplay-code {
    display: "inline-block"
}

.db-CodeDisplay-line.db-JsonDisplay-line:last-of-type {
    padding-bottom: 48px
}

.db-CodeDisplay-positionalWrapper .db-CodeDisplay-CopyButton {
    transition: all .2s ease-in-out;
    position: absolute;
    top: calc(100% - 128px);
    left: 50%;
    transform: translate(-50%, 90px)
}

.db-CodeDisplay-scrollContainer:hover .db-CodeDisplay-CopyButton {
    transform: translate(-50%, -12px)
}

.db-CodeDisplay-scrollContainer .db-CodeDisplay-CopyButton.db-CodeDisplay-CopyButton--copied,
.db-CodeDisplay-scrollContainer:hover .db-CodeDisplay-CopyButton:hover {
    background: var(--sail-color-blue-300)
}

.prismjs-token {
    margin: 0;
    padding: 0
}

.prismjs-token:not(.prismjs-script),
.prismjs-token.prismjs-property {
    font-weight: 400
}

.prismjs-token.prismjs-atrule,
.prismjs-token.prismjs-keyword,
[data-language=php] .prismjs-token.prismjs-operator {
    color: var(--sail-color-blue-500)
}

.prismjs-token.prismjs-attr-name,
.prismjs-token.prismjs-selector,
.prismjs-token.prismjs-tag,
.prismjs-token.prismjs-tag * {
    color: var(--sail-color-cyan-500)
}

.prismjs-token.prismjs-atrule,
.prismjs-token.prismjs-keyword,
.prismjs-token.prismjs-tag,
[data-language=php] .prismjs-token.prismjs-operator {
    font-weight: 400
}

.prismjs-token.prismjs-attr-name {
    font-style: italic
}

.prismjs-token.prismjs-comment {
    color: var(--sail-color-gray-500);
    font-style: italic;
    font-weight: 400
}

.prismjs-token.prismjs-function,
.prismjs-token.prismjs-url {
    color: var(--sail-color-yellow-500);
    font-weight: 400
}

.prismjs-token.prismjs-boolean,
.prismjs-token.prismjs-builtin,
.prismjs-token.prismjs-class-name,
.prismjs-token.prismjs-constant,
.prismjs-token.prismjs-namespace [data-language=ruby] .prismjs-token.prismjs-constant+.prismjs-token.prismjs-punctuation,
[data-language=ruby] .prismjs-token.prismjs-constant+.prismjs-token.prismjs-punctuation+.prismjs-token.prismjs-symbol {
    color: var(--sail-color-cyan-500);
    font-weight: 400
}

.prismjs-token.prismjs-number {
    color: var(--sail-color-red-400)
}

.prismjs-token.prismjs-header,
.prismjs-token.prismjs-curl,
.prismjs-token.prismjs-option,
.prismjs-token.prismjs-variable,
.prismjs-token.prismjs-curl,
.prismjs-token.prismjs-option {
    font-weight: 400
}

.prismjs-token.prismjs-parameter,
.prismjs-token.prismjs-symbol {
    color: var(--sail-color-red-400);
    font-weight: 400
}

.prismjs-token.prismjs-attr-value,
.prismjs-token.prismjs-macro,
.prismjs-token.prismjs-single-quoted-string,
.prismjs-token.prismjs-string,
.prismjs-token.prismjs-stripe,
.prismjs-token.prismjs-value {
    color: var(--sail-color-green-500);
    font-weight: 400
}

.prismjs-token.prismjs-macro .prismjs-keyword {
    color: var(--sail-color-green-500)
}

.db-GenericCodeDisplay {
    flex-flow: column;
    align-items: flex-start;
    display: flex;
    overflow-x: auto
}

.db-GenericCodeDisplay-code {
    font-size: 11px
}

.db-InlineFilterForm-top {
    position: relative
}

.db-InlineFilterForm-toggle {
    position: absolute;
    top: 45%;
    right: 4px;
    transform: translateY(-50%)
}

.db-InlineFilterForm-badge {
    margin-left: 4px
}

.db-InlineFilterForm-bottom {
    box-shadow: inset 0 -1px var(--sail-gray-100);
    padding: 16px 0
}

.db-InlineTextFilter-input {
    border: none !important;
    border-bottom: 1px solid var(--sail-gray100) !important;
    border-radius: 0 !important;
    width: 200px !important;
    padding: 12px !important
}

.db-InlineMultiSelectFilter-group,
.db-InlineSelectFilter-group {
    padding: 12px 12px 0
}

.db-InlineSelectFilter-option {
    padding: 4px 20px;
    position: relative
}

.db-InlineSelectFilter-check {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%)
}

.db-InlineSelectFilter-check>svg {
    fill: var(--sail-blue400) !important
}

html.sail-color-2021 .db-InlineSelectFilter-check>svg {
    fill: var(--sail-cyan400) !important
}

.db-InlineDateRangeFilter-calendarIcon svg {
    color: var(--sail-gray500)
}

.db-InlineDateRangeFilter-calendarIcon--isSet svg {
    color: var(--sail-blue400)
}

html.sail-color-2021 .db-InlineDateRangeFilter-calendarIcon--isSet svg {
    color: var(--sail-cyan400)
}

.db-InlineDateRangeFilter-group {
    background: var(--sail-gray50);
    border-radius: 3px;
    justify-content: center;
    align-items: center;
    display: inline-flex
}

.db-InlineDateRangeFilter-separator {
    background: var(--sail-gray100);
    width: 1px;
    height: 12px
}

.db-InlineDateRangeFilter-group:hover .db-InlineDateRangeFilter-separator {
    background: 0 0
}

.db-MenuWrapper-contextualLayer .db-DatePickerWithPresets {
    padding-bottom: 30px;
    position: relative
}

.db-MenuWrapper-contextualLayer .db-InlineDateRangeFilter-footer {
    background: var(--sail-gray50);
    width: 100%;
    padding: 12px 20px 16px;
    position: absolute;
    bottom: 0
}

.db-InlineFilterButton {
    background: var(--sail-gray50);
    color: var(--sail-gray500);
    border: none;
    border-radius: 3px;
    flex-flow: row;
    justify-content: center;
    align-items: center;
    padding: 6px 8px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    transition: background-color .24s, box-shadow .24s;
    display: inline-flex
}

.db-InlineFilterButton:not(.db-InlineFilterButton--toggled):focus,
.db-InlineFilterButton:not(.db-InlineFilterButton--toggled):hover {
    background: var(--sail-gray100)
}

.db-InlineFilterButton:not(.db-InlineFilterButton--toggled):focus {
    background: var(--sail-gray50);
    position: relative;
    box-shadow: 0 0 0 4px #3a97d447, 0 0 1px 1px #0759965c
}

.db-InlineFilterButton--toggled {
    background: var(--sail-blue100);
    color: var(--sail-blue500)
}

html.sail-color-2021 .db-InlineFilterButton--toggled {
    background: var(--sail-cyan100);
    color: var(--sail-cyan500)
}

.db-InlineFilterButton--toggled:focus {
    position: relative;
    box-shadow: 0 0 0 4px #3a97d447, 0 0 1px 1px #0759965c
}

.db-InlineFilterButton--toggled:hover {
    background: var(--sail-blue200)
}

html.sail-color-2021 .db-InlineFilterButton--toggled:hover {
    background: var(--sail-cyan200)
}

.db-InlineFilterButton-check svg {
    color: var(--sail-blue300);
    margin-right: 4px
}

html.sail-color-2021 .db-InlineFilterButton-check svg {
    color: var(--sail-cyan300)
}

.db-PrimaryTextFilter {
    display: inline-block;
    position: relative
}

.db-PrimaryTextFilter-enterIcon {
    cursor: pointer;
    z-index: 1;
    opacity: .8;
    align-items: center;
    width: 16px;
    transition: opacity .24s;
    display: inline-flex;
    position: absolute;
    top: 50%;
    right: 4px;
    transform: translateY(-50%)
}

.db-PrimaryTextFilter-enterIcon:hover {
    opacity: 1
}

.db-CheckboxGroup {
    padding-top: 4px
}

.db-TwoFactorAuthenticationSettings .bs-ObjectList-cell-row {
    line-height: 18px
}

.db-TwoFactorAuthenticationSettings .bs-ObjectList-cell-row.bs-is-muted {
    color: var(--slate--4);
    font-size: 12px;
    font-weight: 400
}

.db-TwoFactorAuthenticationSettings .bs-ObjectList-cell:last-child {
    vertical-align: middle
}

.db-TwoFactorAuthenticationSettings .bs-ObjectList-cell .bs-Button--link,
.db-TwoFactorAuthenticationSettings .bs-ObjectList-cell .bs-Button--link:active,
.db-TwoFactorAuthenticationSettings .bs-ObjectList-cell .bs-Button--link:hover {
    color: inherit
}

.db-TwoFactorAuthenticationSettings .bs-ObjectList-cell .bs-Button--delete:before {
    background-image: var(--svg-buttons-delete)
}

.db-TwoFactorAuthenticationSettings .bs-ObjectList-cell .bs-Button--delete:active:before,
.db-TwoFactorAuthenticationSettings .bs-ObjectList-cell .bs-Button--delete:hover:before {
    background-image: var(--svg-buttons-delete--hover)
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(.2em)
    }

    to {
        opacity: 1;
        transform: translate(0, 0)
    }
}

.db-MFASettingsTable__defaultBadge {
    pointer-events: none;
    opacity: 0
}

.db-MFASettingsTable__defaultBadge--visible {
    pointer-events: all;
    opacity: 0;
    animation: .25s ease-out forwards fadeInUp
}

@media (prefers-reduced-motion) {
    .db-MFASettingsTable__defaultBadge--visible {
        animation: linear forwards fadeInUp
    }
}

.db-MultiChoiceEmailChangeDialog--disconnectSubtitleContainer>span {
    font-weight: 600
}

.db-EmailVerificationRequiredPage-actionButtonsContainer>[class~=Box-root],
.db-EmailVerificationRequiredPage-actionButtonsContainer>[class~=Box-root]>[class~=Box-root],
.db-EmailVerificationRequiredPage-continueButtonContainer [class~=Box-root] {
    flex: 1
}

.db-GoogleSettings-popupFrameContainer iframe {
    display: none
}

.db-GoogleUserInfo-container {
    align-items: center;
    gap: 4px;
    display: flex
}

.db-GoogleUserInfo-container iframe {
    border: none;
    width: 40px;
    height: 40px;
    margin: 8px;
    position: relative
}

.db-GoogleUserInfo-textContainer {
    flex-direction: column;
    gap: .375rem;
    line-height: 100%;
    display: flex
}

.db-GoogleUserInfo-name {
    font-weight: 600;
    line-height: 100%
}

.db-GoogleUserInfo-email {
    line-height: 100%
}

.db-SigmaIndex {
    width: 100%;
    height: 100%;
    position: relative
}

.db-SigmaIndex * {
    word-wrap: normal
}

.db-SigmaIndex-container {
    box-sizing: border-box;
    opacity: 1;
    flex: 100%;
    height: auto;
    transition: opacity .25s ease-in-out;
    display: flex
}

@media (max-width:768px) {
    .db-SigmaIndex-container {
        height: 100vh
    }
}

.db-SigmaIndex-container--loading {
    opacity: 0
}

.db-SigmaIndex-content {
    margin-top: calc(var(--sail-layer-margin-top, 0px));
    height: calc(100vh - var(--sail-layer-margin-top));
    flex-direction: column;
    flex: auto;
    gap: 24px;
    min-width: 0;
    padding: 24px;
    display: flex
}

.db-SigmaIndex-content--withResults {
    height: auto
}

.db-SigmaIndex-editorAndResultsContainer {
    flex-direction: column;
    flex: auto;
    gap: 24px;
    display: flex
}

.db-SigmaIndex-editorAndResultsContainer div[role=tabpanel] {
    flex-direction: column;
    flex: auto;
    display: flex
}

.db-SigmaIndex-editorAndResultsContainer div[role=tablist] {
    padding-left: 20px
}

.db-SigmaIndex-queryHeader {
    z-index: 6;
    background-color: var(--sail-color-background);
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    display: flex;
    position: relative
}

.db-SigmaSidebar {
    top: calc(var(--sail-layer-margin-top, 0px));
    height: calc(100vh - var(--sail-layer-margin-top));
    background-color: var(--gray50);
    z-index: 10;
    flex-direction: column;
    display: flex;
    position: fixed;
    overflow: hidden
}

@media (max-width:768px) {
    .db-SigmaSidebar {
        position: absolute
    }
}

.db-SigmaSidebar--isResizing {
    -webkit-user-select: none;
    user-select: none
}

.db-SigmaSidebar--isMinimized {
    cursor: pointer
}

.db-SigmaSidebar-header {
    flex-direction: column;
    flex: none;
    display: flex;
    box-shadow: 0 2px 3px #6a7c940d, 0 1px #6a7c941a
}

.db-SigmaSidebar-topRowButtons {
    flex-grow: 1;
    justify-content: space-between;
    align-items: center;
    padding: 20px 20px 0;
    display: flex
}

.db-SigmaSidebar-topRowButtons--slim {
    padding: 20px 12px 0
}

.db-SigmaSidebar-filter {
    margin-top: 10px
}

.db-SigmaSidebar-content {
    flex: auto;
    height: 100%;
    position: relative;
    overflow-x: hidden;
    overflow-y: auto
}

.db-SigmaSidebar-resizeHandle {
    cursor: col-resize;
    width: 8px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0
}

.db-SigmaSidebar-sidebarShortcut {
    color: var(--gray400);
    margin-left: 4px
}

.db-Elapsed {
    width: 36px;
    min-width: 28px;
    height: 20px;
    color: var(--gray400);
    flex-shrink: 0;
    margin-top: -1px;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px
}

.db-Elapsed-created {
    white-space: nowrap;
    padding: 8px;
    font-size: 13px
}

.db-HistoryEntry-error {
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    overflow: hidden
}

.db-HistoryEntry-errorText {
    padding-left: 20px;
    font-weight: 500
}

.db-HistoryEntry-errorIcon {
    margin-left: -4px;
    position: absolute
}

.db-HistoryEntry:hover .db-TruncatedSQL {
    filter: none
}

.db-HistoryListEmptyState {
    flex-direction: column;
    align-items: center;
    padding: 20px;
    display: flex
}

.db-HistoryListEmptyState-title {
    margin-top: 10px;
    font-weight: 500
}

.db-HistoryListEmptyState-learnMore {
    margin-top: 10px
}

.db-QueryEntry {
    cursor: pointer;
    border-left: 3px solid #0000;
    padding-top: 16px;
    padding-bottom: 16px;
    position: relative
}

.db-QueryEntry:hover {
    background-color: var(--gray100)
}

.db-QueryEntry.bs-is-active {
    border-left: 3px solid var(--blue500);
    background-color: #e1e8fa80
}

.db-QueryEntry-row {
    flex-direction: row;
    padding-left: 17px;
    display: flex;
    position: relative
}

.db-QueryEntry-content {
    flex-grow: 1;
    padding-right: 20px;
    overflow: hidden
}

.db-QueryEntry-spacer {
    flex-grow: 0;
    flex-shrink: 0;
    width: 36px
}

.db-QueryEntry-title {
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    overflow: hidden
}

.db-QueryEntry.bs-is-active .db-QueryEntry-title {
    font-weight: 600
}

.db-QueryEntry-email {
    margin-top: 4px;
    font-size: 12px;
    line-height: 20px
}

.db-QueryEntry.db-is-animating-enter {
    opacity: .01
}

.db-QueryEntry.db-is-animating-enter.db-is-animating-enter-active {
    opacity: 1;
    transition: opacity .5s ease-in
}

.db-QueryEntry.db-is-animating-leave {
    max-height: 500px
}

.db-QueryEntry.db-is-animating-leave.db-is-animating-leave-active {
    opacity: .01;
    max-height: 0;
    padding-bottom: 0;
    transition: max-height .5s linear, opacity .5s linear, padding-bottom .5s linear;
    overflow: hidden
}

.db-QueryEntryHeader-overflowMenu {
    justify-content: flex-end;
    display: flex;
    position: absolute;
    top: -4px;
    right: 8px
}

.db-QueryTemplates-query {
    cursor: pointer;
    border-left: 3px solid #0000;
    justify-content: space-between;
    padding: 11px 20px 11px 17px;
    display: flex
}

.db-QueryTemplates-query.bs-is-active {
    border-left: 3px solid var(--blue500);
    background-color: #e1e8fa80
}

.db-QueryTemplates-query:hover {
    background-color: #ffffff80
}

.db-QueryTemplates-queryTitle {
    color: var(--gray700);
    margin-bottom: 3px;
    font-size: 14px;
    font-weight: 500;
    display: block
}

.db-QueryTemplates-query:hover .db-QueryTemplates-queryTitle {
    color: var(--gray900)
}

.db-QueryTemplates-query.bs-is-active .db-QueryTemplates-queryTitle {
    font-weight: 600
}

.db-QueryTemplates-queryDescription {
    color: var(--gray500);
    font-size: 12px
}

.db-QueryTemplates-query:hover .db-QueryTemplates-queryDescription {
    color: var(--gray700)
}

.db-QueryTemplates-queryTitle--disabled {
    color: var(--gray300)
}

.db-QueryTemplates-advert {
    background-color: var(--blue500);
    color: #fff;
    cursor: pointer;
    border-radius: 4px;
    padding: 10px 20px
}

.db-QueryTemplates-advertHeading {
    padding-bottom: 4px;
    font-size: 18px
}

.db-QueryTemplates-advertBody {
    font-size: 15px
}

.db-SavedEntry:hover .db-TruncatedSQL {
    filter: none
}

.db-SavedQueryListEmptyState {
    flex-direction: column;
    align-items: center;
    padding: 20px;
    display: flex
}

.db-SavedQueryListEmptyState-title {
    margin-top: 10px;
    font-weight: 500
}

.db-SavedQueryListEmptyState-learnMore {
    margin-top: 10px
}

.db-ScheduledQueriesListEmptyState {
    flex-direction: column;
    align-items: center;
    padding: 20px;
    display: flex
}

.db-ScheduledQueriesListEmptyState-title {
    margin-top: 10px;
    font-weight: 500
}

.db-ScheduledQueriesListEmptyState-learnMore {
    margin-top: 10px
}

.db-ScheduledQueryEntry-description {
    overflow: hidden
}

.db-ScheduledQueryEntry-subscribedBadge {
    margin-left: 4px
}

.db-ScheduledQueryEntry-subscribedBadgeText {
    padding-left: 4px
}

.db-SchemaBrowser-container {
    position: relative
}

.db-SchemaBrowser-sectionExpand {
    text-transform: uppercase
}

.db-SchemaBrowser-tableName {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.db-SchemaBrowser-tableName:hover {
    color: var(--gray900)
}

.db-SchemaBrowser-columnAnimationContainer {
    flex-direction: column;
    transition: height .2s ease-in;
    display: flex;
    overflow: hidden
}

.db-SchemaBrowser-columnAnimationContainer--noAnimation {
    transition: none
}

.db-SchemaBrowser--animate-leave {
    opacity: 1
}

.db-SchemaBrowser--animate-leave-active {
    opacity: 0;
    transition: opacity .2s ease-in
}

.db-SchemaBrowser--animate-enter {
    opacity: 0
}

.db-SchemaBrowser--animate-enter-active {
    opacity: 1;
    transition: opacity .2s ease-in
}

.db-SchemaBrowser-sectionTitleWrapper--expandable,
.db-SchemaBrowser-tableTitleWrapper--expandable {
    cursor: pointer
}

.db-ShowMore-container {
    text-align: center;
    color: #666ee8;
    padding-top: 20px;
    padding-bottom: 20px
}

.db-ShowMore-container,
.db-ShowMore-container:hover {
    cursor: pointer
}

.db-ShowMore-container:focus,
.db-ShowMore-container:hover {
    color: #32315e
}

.db-ShowMore-getNextPageFailed--nolink,
.db-ShowMore-getNextPageFailed--nolink:hover {
    color: #6a7c94
}

.db-SidebarSearch {
    width: 100%;
    display: block;
    position: relative
}

.db-SidebarSearch-input {
    z-index: 1;
    position: relative
}

.db-SidebarSearch-clear {
    z-index: 2;
    cursor: pointer;
    background: 0 0;
    border: 0;
    position: absolute;
    top: 6px;
    right: 6px
}

.db-SigmaBackButton {
    text-align: left
}

.db-SubscribeBlock {
    z-index: 2;
    color: var(--gray50);
    flex-grow: 1;
    justify-content: center;
    align-items: center;
    height: 32px;
    display: flex
}

.db-SubscribeBlock-clickable {
    cursor: pointer
}

.db-SubscribeBlock-box {
    text-align: center;
    width: 100%;
    padding: 20px
}

.db-SubscribeBlock-daysLeft {
    margin-right: 4px
}

.db-SubscribeBlock-arrow {
    opacity: 0;
    margin-left: 0;
    margin-right: 4px;
    transition: margin-right .5s, margin-left .5s, opacity .5s
}

.db-SubscribeBlock:hover .db-SubscribeBlock-arrow {
    opacity: 1;
    margin-left: 4px;
    margin-right: 0
}

.db-TruncatedSQL {
    white-space: pre;
    filter: grayscale();
    padding-top: 4px;
    display: block
}

.db-TruncatedSQL-line {
    flex-direction: row;
    display: flex
}

.db-TruncatedSQL-lineNumber {
    color: var(--gray400);
    width: 20px;
    min-width: 20px
}

.db-TruncatedSQL-sql {
    text-overflow: ellipsis;
    overflow: hidden
}

.db-TruncatedSQL.bs-is-active,
.db-TruncatedSQL:hover {
    filter: none
}

.db-QueryActions {
    justify-content: space-between;
    display: flex;
    position: relative
}

.bs-BIM .db-QueryActions-feedbackLink {
    color: #666ee8
}

.db-QueryActions-loading {
    align-items: center;
    padding-left: 7px;
    display: flex
}

.db-QueryActions-loadingMessage {
    padding-left: 5px
}

.db-QueryActions-button,
.db-QueryActions-runningTimer,
.db-QueryActions-saveSucceededMessage {
    z-index: 2
}

.db-QueryActions-runningTimer,
.db-QueryActions-saveSucceededMessage {
    height: 0;
    color: var(--gray700);
    text-align: center;
    font-size: 10px;
    position: relative;
    top: 4px
}

.db-QueryEditor {
    background: #fff;
    border-radius: 4px 0 0;
    flex-direction: row;
    flex: auto;
    min-height: 100px;
    display: flex;
    position: relative
}

.db-QueryEditor--chartsEnabled {
    min-height: auto
}

.db-QueryEditor--readOnly:not(.db-QueryEditor--streaming) .CodeMirror-cursor {
    display: none
}

.db-QueryEditor--streaming .CodeMirror-cursors {
    visibility: visible !important
}

.db-QueryEditor--streaming .CodeMirror-cursor {
    animation: .75s steps(5, start) infinite blink-animation
}

@keyframes blink-animation {
    to {
        visibility: hidden
    }
}

.db-QueryEditor .CodeMirror-cursor {
    transform: scale(1.01)
}

.db-QueryEditor .ReactCodeMirror {
    width: 100%;
    height: 100%;
    position: absolute
}

.db-QueryEditor .CodeMirror {
    background-color: #f5f6f8;
    width: 100%;
    height: 100%
}

.db-QueryEditor .ReactCodeMirror .CodeMirror-gutters {
    background-color: #f5f6f8
}

.db-QueryEditor .CodeMirror-scroll {
    padding-top: 10px;
    padding-bottom: 0;
    overflow: auto !important
}

.db-QueryEditor--streaming .CodeMirror-scroll {
    pointer-events: none
}

.CodeMirror-scroll::-webkit-scrollbar {
    display: none
}

.CodeMirror-hints {
    z-index: 1500;
    background-color: #fff;
    border-radius: 5px;
    min-width: 320px;
    max-height: 260px;
    margin: 0;
    padding: 5px 0;
    list-style: none;
    position: absolute;
    overflow-x: hidden;
    overflow-y: auto;
    box-shadow: 0 0 0 1px #6f7c8233, 0 1px #0000001a, 0 2px 4px #0000000f
}

.CodeMirror-hint {
    white-space: pre;
    cursor: pointer;
    color: #6f7c82;
    vertical-align: bottom;
    margin: 0;
    font-family: Menlo, Monaco, monospace;
    font-size: 13px;
    font-weight: 500
}

.CodeMirror-hint:nth-child(2n) {
    background-color: #f7f9fa
}

.CodeMirror-hint-active,
.CodeMirror-hint:nth-child(2n).CodeMirror-hint-active {
    background-color: var(--gray100);
    color: var(--gray900);
    border-top-color: #369ad9;
    border-bottom-color: #0e74c3
}

.db-QueryEditor-hintContainer {
    flex-direction: column;
    padding: 5px 10px;
    display: flex
}

.db-QueryEditor-hintCommentRow {
    flex-wrap: nowrap;
    justify-content: space-between;
    display: flex
}

.db-QueryEditor-hintComment {
    word-wrap: break-word;
    white-space: normal;
    max-width: 300px;
    font-size: 11px
}

.db-QueryEditor-hintComment code {
    font-size: 11px
}

.db-QueryEditor-hintType {
    font-size: 11px;
    font-family: var(--font-family);
    color: var(--gray400);
    padding-left: 10px
}

.CodeMirror-hint .db-QueryEditor-hintComment {
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, sans-serif;
    display: none
}

.CodeMirror-hint-active .db-QueryEditor-hintComment {
    display: block
}

.CodeMirror-hint-active .db-QueryEditor-hintType {
    color: var(--gray400)
}

pre.CodeMirror-line span.invalidAccountId {
    color: var(--red400);
    background-color: var(--red100)
}

.db-QueryEditor pre.CodeMirror-placeholder {
    color: var(--gray300)
}

.db-ResultsHeader {
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    width: 100%;
    height: 100%;
    color: var(--gray700);
    font-size: 13px;
    font-weight: 500
}

.db-ResultsHeader:hover {
    color: var(--gray900)
}

.db-ResultsHeader-cell {
    flex-wrap: nowrap;
    justify-content: space-between;
    display: flex
}

.db-ResultsHeader-columnName {
    display: flex
}

.db-ResultsHeader-badgePopover {
    margin: 10px;
    font-size: 13px
}

.db-ResultsHeader-icon--sortedAsc,
.db-ResultsHeader-icon--sortedDesc {
    background: var(--svg-dashboard-icon-down-arrow);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 10px;
    height: 10px;
    margin-top: 2px;
    margin-right: 6px
}

.db-ResultsHeader-icon--sortedAsc {
    transform: rotate(180deg)
}

.db-ResultsTable {
    position: absolute;
    overflow: hidden
}

.db-ResultsTable--empty {
    background: repeating-linear-gradient(to bottom, white, white 35px, var(--gray100)35px, var(--gray100)36px, white 36px)
}

.db-ResultsTable .public_fixedDataTable_bottomShadow,
.db-ResultsTable .public_fixedDataTable_topShadow {
    display: none
}

.db-ResultsTable .fixedDataTableCellLayout_main,
.db-ResultsTable .fixedDataTableLayout_hasBottomBorder,
.db-ResultsTable .fixedDataTableLayout_main {
    background-image: none;
    border: none
}

.db-ResultsTable .public_fixedDataTable_hasBottomBorder,
.db-ResultsTable .public_fixedDataTable_header {
    border-color: var(--gray200);
    box-shadow: 0 1px 3px #32325d1a, 0 0 1px #00000012
}

.db-ResultsTable .public_fixedDataTable_header,
.db-ResultsTable .public_fixedDataTable_header .public_fixedDataTableCell_main {
    background-color: #fff;
    background-image: none
}

.db-ResultsTable .public_fixedDataTable_footer .public_fixedDataTableCell_main {
    background-color: #f6f7f8;
    border-color: #e0e6ee
}

.db-ResultsTable .public_fixedDataTableCell_main {
    border-color: #e0e6ee
}

.db-ResultsTable .public_fixedDataTableCell_highlighted {
    background-color: #f4f4f4
}

.db-ResultsTable .public_fixedDataTable_header .public_fixedDataTableCell_cellContent,
.db-ResultsTable .public_fixedDataTableCell_cellContent {
    padding: 0 10px
}

.db-ResultsTable .public_fixedDataTable_header .public_fixedDataTableCell_main:first-child .public_fixedDataTableCell_cellContent,
.db-ResultsTable .public_fixedDataTableCell_main:first-child .public_fixedDataTableCell_cellContent {
    padding-left: 20px
}

.db-ResultsTable .public_fixedDataTableRow_main {
    background-color: #fff
}

.db-ResultsTable .public_fixedDataTableRow_highlighted,
.db-ResultsTable .public_fixedDataTableRow_highlighted .public_fixedDataTableCell_main {
    background-color: #0000
}

.db-ResultsTable .public_fixedDataTableRow_fixedColumnsDivider {
    border-color: #0000
}

.db-ResultsTable .public_fixedDataTableRow_columnsShadow {
    background: 0 0
}

.db-ResultsTable .public_fixedDataTableRow_main.db-ResultsTable-table-row {
    border-bottom: 1px solid var(--gray100);
    font-size: 13px
}

.db-ResultsTable .fixedDataTableCellLayout_columnResizerContainer {
    background-color: #fff;
    width: 5px
}

.db-ResultsTable .fixedDataTableCellLayout_columnResizerKnob {
    visibility: visible;
    background-color: #0000;
    margin: 0 auto;
    position: static
}

.db-ResultsTable .fixedDataTableCellLayout_columnResizerKnob:after {
    content: "";
    background-color: var(--gray100);
    width: 1px;
    height: 24px;
    margin: 6px auto;
    display: block;
    position: relative
}

.db-ResultsTable .public_fixedDataTableColumnResizerLine_main {
    border: none
}

.db-ResultsTable .fixedDataTableColumnResizerLineLayout_mouseArea {
    width: 23px
}

.db-ResultsTable .fixedDataTableColumnResizerLineLayout_mouseArea:after {
    content: "";
    background-color: var(--gray200);
    width: 1px;
    height: 100%;
    margin: 0 15px;
    position: absolute
}

.db-ResultsTable .fixedDataTableCellLayout_columnResizerContainer:hover .fixedDataTableCellLayout_columnResizerKnob:after {
    background-color: var(--gray200)
}

.db-SigmaFeedbackModal-prompt {
    margin-bottom: 20px
}

.db-StateChangedModal-header {
    color: var(--gray900);
    margin-bottom: 10px;
    font-size: 24px
}

.db-StateChangedModal-content {
    background: #fff;
    padding: 20px 30px 10px
}

.db-StateChangedModal-subheading {
    color: var(--gray900);
    margin-bottom: 20px;
    font-size: 14px
}

.db-ScheduledQueryRunCompletedPreviewModal {
    flex-direction: column;
    width: 600px;
    height: 700px;
    display: flex
}

.db-ScheduledQueryRunCompletedPreviewModal .bs-Modal-content {
    flex: 1;
    padding: 0
}

.db-ScheduledQueryRunCompletedPreviewModal-iframe {
    border-width: 0;
    width: 100%;
    height: 100%;
    position: relative
}

.db-ScheduledQueryTimeline-row {
    padding: 12px 20px 12px 0
}

.db-ScheduleLabel {
    flex-basis: 10%;
    padding-right: 10px
}

.db-OnboardingPopovers {
    cursor: pointer;
    max-width: 300px;
    padding: 20px
}

.db-OnboardingPopovers-header {
    color: var(--green500);
    font-weight: 700
}

.db-ResizeHandle {
    cursor: row-resize;
    background: var(--gray50);
    border-bottom: 1px solid var(--gray100);
    border-top: 1px solid var(--gray100);
    z-index: 4;
    flex: 0 0 5px
}

.db-SigmaBigError {
    flex-direction: column;
    flex: auto;
    display: flex
}

.db-SigmaBigError-content {
    flex-direction: column;
    flex: auto;
    justify-content: center;
    align-items: center;
    display: flex
}

.db-SigmaBigError-line {
    border-bottom: 1px solid var(--gray100);
    height: 79px
}

.db-SigmaBigError-message {
    color: var(--gray700);
    margin-top: 8px;
    font-weight: 500
}

.db-SigmaMarkdownText code {
    background-color: var(--gray50);
    border: 1px solid var(--gray100);
    color: var(--gray400);
    border-radius: 3px
}

.db-SigmaMarkdownText code:after,
.db-SigmaMarkdownText code:before {
    letter-spacing: -.25rem;
    content: " "
}

.db-HistoryMessage .db-CodeDisplay-container,
.db-HistoryMessage .db-CodeDisplay-line.db-JsonDisplay-line:last-of-type {
    padding-bottom: 0 !important
}

.db-HistoryMessage .db-JsonDisplay-line {
    padding-left: 55px
}

.db-HistoryMessage .db-JsonDisplay-line:before {
    width: 35px
}

.db-HistoryMessage .db-CodeDisplay-scrollContainer {
    padding-top: 8px;
    padding-bottom: 8px
}

.db-AnimatedValue-container:after {
    content: "";
    display: inline-block
}

.db-AnimatedValue {
    -webkit-font-smoothing: antialiased;
    white-space: pre;
    position: absolute
}

.backgroundcliptext .db-AnimatedValue:not(.db-is-entering) {
    color: #0000;
    background-size: 100px 100%;
    -webkit-background-clip: text;
    background-clip: text
}

.backgroundcliptext .db-AnimatedValue--loading:not(.db-is-entering) {
    transition: background-color .2s ease-in-out, opacity .3s ease-in-out;
    animation: .5s linear infinite AnimatedValue--animation
}

.db-AnimatedValue--hiding {
    opacity: 0;
    transition: background-color .2s ease-in-out, opacity .3s ease-in-out
}

.db-AnimatedValue-letter.db-is-entering {
    opacity: 0;
    display: inline-block;
    transform: translateY(-10px)
}

.db-AnimatedValue-letter.db-is-entering.db-is-entering-active {
    opacity: 1;
    transition: transform .35s cubic-bezier(.3, 1.5, .4, 1), opacity .1s ease-in-out;
    transform: none
}

@keyframes AnimatedValue--animation {
    0% {
        background-position: 0 0
    }

    to {
        background-position: -100px 0
    }
}

:root {
    --AnimatedValue--gray700-opacity50: #42477080;
    --AnimatedValue--gray700-opacity0: #42477000;
    --AnimatedValue--gray600-opacity50: #525f7f80;
    --AnimatedValue--gray600-opacity0: #525f7f00;
    --AnimatedValue--cyan100-opacity50: #b8fdfe80;
    --AnimatedValue--cyan100-opacity0: #b8fdfe00;
    --AnimatedValue--blue500-opacity50: #6772e580;
    --AnimatedValue--blue500-opacity0: #6772e500
}

.db-AnimatedValue--color-white {
    color: #fff
}

.backgroundcliptext .db-AnimatedValue--color-white:not(.db-is-entering) {
    background-color: #fff;
    background-image: linear-gradient(90deg, #fff 0%, #ffffff80 50%, #fff 100%)
}

.db-AnimatedValue--color-white.db-AnimatedValue--loading:not(.db-is-entering) {
    background-color: #fff0
}

.db-AnimatedValue--color-slate2 {
    color: var(--gray700)
}

.backgroundcliptext .db-AnimatedValue--color-slate2:not(.db-is-entering) {
    background-color: var(--gray700);
    background-image: linear-gradient(90deg, var(--gray700)0%, var(--AnimatedValue--gray700-opacity50)50%, var(--gray700)100%)
}

.db-AnimatedValue--color-slate2.db-AnimatedValue--loading:not(.db-is-entering) {
    background-color: var(--AnimatedValue--gray700-opacity0)
}

.db-AnimatedValue--color-slate3 {
    color: var(--gray600)
}

.backgroundcliptext .db-AnimatedValue--color-slate3:not(.db-is-entering) {
    background-color: var(--gray600);
    background-image: linear-gradient(90deg, var(--gray600)0%, var(--AnimatedValue--gray600-opacity50)50%, var(--gray600)100%)
}

.db-AnimatedValue--color-slate3.db-AnimatedValue--loading:not(.db-is-entering) {
    background-color: var(--AnimatedValue--gray600-opacity0)
}

.db-AnimatedValue--color-cyan8 {
    color: var(--cyan100)
}

.backgroundcliptext .db-AnimatedValue--color-cyan8:not(.db-is-entering) {
    background-color: var(--cyan100);
    background-image: linear-gradient(90deg, var(--cyan100)0%, var(--AnimatedValue--cyan100-opacity50)50%, var(--cyan100)100%)
}

.db-AnimatedValue--color-cyan8.db-AnimatedValue--loading:not(.db-is-entering) {
    background-color: var(--AnimatedValue--cyan100-opacity0)
}

.db-AnimatedValue--color-blue4 {
    color: var(--blue500)
}

.backgroundcliptext .db-AnimatedValue--color-blue4:not(.db-is-entering) {
    background-color: var(--blue500);
    background-image: linear-gradient(90deg, var(--blue500)0%, var(--AnimatedValue--blue500-opacity50)50%, var(--blue500)100%)
}

.db-AnimatedValue--color-blue4.db-AnimatedValue--loading:not(.db-is-entering) {
    background-color: var(--AnimatedValue--blue500-opacity0)
}

@media print {
    .db-AnimatedValue {
        color: var(--slate--1) !important
    }

    .db-AnimatedValue,
    .db-AnimatedValue-letter {
        background-color: #0000 !important;
        background-image: none !important
    }
}

.db-ValueDelta {
    display: inline-block;
    position: relative
}

.db-ValueDelta--size-regular {
    font-size: 20px;
    font-weight: 500;
    line-height: 24px
}

.db-ValueDelta--size-small {
    font-size: 12px;
    font-weight: 500;
    line-height: 15px
}

.db-ValueDelta--color-gray {
    color: var(--gray400)
}

.db-ValueDelta--color-green {
    color: var(--green400)
}

.db-ValueDelta--color-orange {
    color: var(--orange400)
}

.db-SegmentedControl {
    cursor: default;
    display: inline-block
}

.db-SegmentedControlOption {
    color: var(--gray500);
    cursor: pointer;
    margin-right: 8px;
    font-size: 14px;
    display: inline
}

.db-SegmentedControlOption:focus,
.db-SegmentedControlOption:hover {
    color: var(--gray700)
}

.db-SegmentedControlOption:last-child {
    margin-right: 0
}

.db-SegmentedControlOption--disabled,
.db-SegmentedControlOption--disabled.db-SegmentedControlOption:focus {
    cursor: default;
    pointer-events: none;
    color: var(--gray200)
}

.db-SegmentedControlOption--selected.db-SegmentedControlOption--disabled,
.db-SegmentedControlOption--selected:focus.db-SegmentedControlOption--disabled {
    color: var(--gray300)
}

.db-SegmentedControlOption--selected,
.db-SegmentedControlOption--selected:focus {
    color: var(--blue500);
    font-weight: 700
}

.db-SegmentedControlOption--selected:hover {
    color: var(--blue600)
}

.db-RefundModal-checkboxRow {
    padding-top: 0
}

.db-RefundModal-checkboxField {
    margin-top: 0
}

.db-RefundModal-noteField {
    resize: none
}

.db-SendReceiptModal-emailInput {
    width: 100%;
    margin-bottom: 10px
}

.db-BankAccountModal .bs-Fieldset-label {
    flex: 0 0 35%
}

.db-CheckoutCodeSnippetModal-codeBlock {
    position: relative
}

.db-CheckoutCodeSnippetModal-codeSnippet {
    height: 240px
}

.db-CheckoutCodeSnippetModal-copyButton {
    position: absolute;
    top: 12px;
    right: 20px
}

.db-CreatePayoutModalContent {
    background-color: #0000
}

.db-CreatePayoutModalContent .bs-Fieldset-field {
    width: 100%
}

.db-CreatePayoutModalContent .bs-Fieldset-fields {
    flex: 3
}

.db-NoteMentionInput {
    min-height: 90px
}

.db-MentionEditor-mentionSuggestionsEntry {
    padding: 7px 10px 3px
}

.db-MentionEditor-mentionSuggestionsEntry:active {
    background-color: #cce7ff
}

.db-MentionEditor-mentionSuggestionsEntryFocused {
    color: var(--gray50);
    background-color: var(--blue500);
    padding: 7px 10px 3px
}

.db-MentionEditor-mentionSuggestionsEntryContainer {
    width: 100%;
    display: table
}

.db-MentionEditor-mentionSuggestionsEntryTitle {
    color: inherit;
    line-height: 1.3
}

.db-MentionEditor-mentionSuggestionsEntryText {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 368px;
    margin-bottom: .2em;
    margin-left: 8px;
    font-size: .9em;
    display: inline-block;
    overflow: hidden
}

.db-MentionEditor-mentionSuggestions {
    border: 1px solid var(--gray100);
    box-sizing: border-box;
    cursor: pointer;
    z-index: 5;
    background: #fff;
    border-radius: 5px;
    flex-direction: column;
    min-width: 300px;
    max-width: 400px;
    margin-top: 1.75em;
    margin-left: 1em;
    padding-top: 8px;
    padding-bottom: 8px;
    display: flex;
    position: absolute;
    transform: scale(0);
    box-shadow: 0 4px 30px #dcdcdc
}

.db-MentionEditor-mentionSuggestions[data-help-text]:before {
    background-color: var(--gray50);
    border-bottom: 1px solid var(--gray100);
    color: var(--gray400);
    content: attr(data-help-text);
    cursor: auto;
    margin-top: -8px;
    padding: 5px 8px;
    font-size: 12px
}

.db-MentionEditor-focus {
    box-shadow: 0 0 0 1px #32325d00, 0 0 0 1px #3297d333, 0 0 0 2px #3297d340, 0 1px 1px #00000014
}

.db-ScrollingCode-page1 {
    animation: 10s ease-in-out .3s infinite first_page
}

.db-ScrollingCode-page2 {
    animation: 10s ease-in-out .3s infinite second_page
}

@keyframes first_page {
    0% {
        transform: translateY(0)
    }

    10% {
        transform: translateY(-10%)
    }

    20% {
        transform: translateY(-20%)
    }

    30% {
        transform: translateY(-30%)
    }

    40% {
        transform: translateY(-40%)
    }

    50% {
        transform: translateY(-50%)
    }

    60% {
        transform: translateY(-60%)
    }

    70% {
        transform: translateY(-70%)
    }

    80% {
        transform: translateY(-80%)
    }

    90% {
        transform: translateY(-90%)
    }

    to {
        transform: translateY(-100%)
    }
}

@keyframes second_page {
    0% {
        transform: translateY(100%)
    }

    10% {
        transform: translateY(90%)
    }

    20% {
        transform: translateY(80%)
    }

    30% {
        transform: translateY(70%)
    }

    40% {
        transform: translateY(60%)
    }

    50% {
        transform: translateY(50%)
    }

    60% {
        transform: translateY(40%)
    }

    70% {
        transform: translateY(30%)
    }

    80% {
        transform: translateY(20%)
    }

    90% {
        transform: translateY(10%)
    }

    to {
        transform: translateY(0%)
    }
}

.db-ChartGrid {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 1px
}

.db-ChartGrid-line {
    background: var(--gray200);
    opacity: .3;
    width: 1px;
    height: 100%;
    position: absolute
}

@media print {
    .db-ChartGrid-line {
        background: var(--gray700)
    }
}

.db-ChartHover {
    white-space: nowrap;
    color: var(--blue500);
    text-align: center;
    height: 27px;
    padding: 4px 8px 5px;
    font-weight: 500;
    line-height: 20px;
    display: inline-block;
    position: relative
}

.db-ChartHover-value {
    margin-right: 18px;
    padding-right: 6px;
    font-size: 13px;
    font-weight: 600;
    display: inline-block;
    position: relative
}

.db-ChartHover-value:after {
    content: "";
    background: var(--cyan300);
    width: 12px;
    height: 1px;
    position: absolute;
    top: 9px;
    left: 100%
}

.db-ChartHover-date {
    font-size: 13px;
    display: inline-block
}

.db-ChartHoverDot-dot {
    fill: var(--blue500);
    stroke: #fff
}

.db-ChartHoverDot--size-regular .db-ChartHoverDot-dot {
    stroke-width: 2.5px;
    r: 4
}

.db-ChartHoverDot--size-small .db-ChartHoverDot-dot {
    fill: var(--blue500);
    stroke-width: 1.5px;
    r: 1.5
}

.db-ChartHoverDot--color-slate6 .db-ChartHoverDot-dot {
    stroke: var(--gray300);
    fill: var(--gray300)
}

.db-ChartHoverDot--color-blue4 .db-ChartHoverDot-dot {
    fill: var(--blue500);
    stroke: var(--blue500)
}

.db-ChartHoverDot-line {
    stroke: var(--gray400);
    stroke-dasharray: 1 1;
    stroke-width: .5px
}

.db-GroupChartHover {
    filter: drop-shadow(0 1px 1px #00000012)drop-shadow(0 0 1px #32325d2b)drop-shadow(0 4px 10px #32325d1a)drop-shadow(0 2px 4px #00000014);
    background: #fff;
    border-radius: 4px;
    min-width: 210px;
    margin-left: -10px;
    position: relative
}

.db-GroupChartHover:after {
    content: "";
    background-image: var(--svg-charts-group-chart-hover-arrow);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 8px;
    height: 4px;
    display: block;
    position: absolute;
    bottom: -4px;
    right: 8px
}

.db-GroupChartHover-content {
    border-radius: 4px;
    width: 100%;
    display: table;
    overflow: hidden
}

.db-GroupChartHover-row {
    display: table-row
}

.db-GroupChartHover-cell {
    padding: 0 5px;
    display: table-cell
}

.db-GroupChartHover-rowValue {
    background: var(--gray50);
    color: var(--gray700);
    border-radius: 4px 4px 0 0;
    font-size: 12px;
    font-weight: 500;
    line-height: 20px
}

.db-GroupChartHover-rowCompareToValue {
    color: var(--gray700);
    font-size: 10px;
    line-height: 20px
}

.db-GroupChartHover-value {
    color: var(--blue500);
    text-align: right
}

.db-GroupChartHover-compareToValue {
    color: var(--cyan500)
}

.db-GroupChartHover-disputeWarningVal {
    color: var(--red)
}

.db-GroupChartHover-secondaryBaseValue,
.db-GroupChartHover-secondaryCompareValue {
    color: var(--gray400);
    padding-left: 8px;
    font-weight: 400;
    display: inline
}

.db-GroupChartHover-delta {
    padding-left: 8px;
    display: inline
}

.db-Legend {
    justify-content: space-between;
    min-height: 13px;
    display: flex;
    position: relative
}

.db-Legend--horizontal {
    flex-direction: row
}

.db-Legend--vertical {
    flex-direction: column;
    align-items: flex-end;
    height: 100%
}

.db-Legend--highlighted {
    justify-content: flex-start
}

.db-Legend-pre {
    flex-shrink: 1
}

.db-LegendValue {
    color: var(--gray500);
    white-space: nowrap;
    flex-grow: 0;
    font-size: 11px;
    line-height: 13px;
    display: inline
}

.db-LegendValue--emphasized {
    color: var(--gray700);
    font-weight: 500
}

.db-LegendValue--highlighted {
    color: var(--blue500);
    font-weight: 500
}

.db-LegendValue--white {
    color: var(--blue100)
}

.db-LegendValue--cyan {
    color: var(--cyan300)
}

.db-LegendValue--white.db-LegendValue--emphasized {
    color: #fff;
    font-weight: 500
}

.db-LegendValue--cyan.db-LegendValue--emphasized {
    color: var(--cyan300);
    font-weight: 500
}

@media print {

    .db-LegendValue--emphasized.db-LegendValue--white,
    .db-LegendValue--white {
        color: var(--gray700)
    }
}

.db-Sparkline-wrapper {
    width: 100%;
    height: 100%
}

.db-Sparkline {
    height: 100%;
    position: relative
}

.db-Sparkline-container {
    fill: #fff;
    z-index: var(--custom-widget-z-index-a);
    box-sizing: initial;
    pointer-events: none;
    margin: auto;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden
}

.db-Sparkline-container--line {
    top: -10px
}

.db-Sparkline-container--dots {
    top: -10px;
    left: -10px
}

.db-Sparkline-main-line {
    fill: none
}

.db-Sparkline-main-partial-line {
    stroke-dasharray: 3;
    stroke-dashoffset: 3px
}

.db-Sparkline-main-line--gray {
    stroke: var(--gray500)
}

.db-Sparkline-dot {
    stroke-width: 2.5px;
    r: 4px;
    transform-origin: 50%;
    transition: opacity .2s ease-in-out, transform .35s cubic-bezier(.3, 1.5, .4, 1)
}

.db-Sparkline-dot--hidden {
    opacity: 0;
    transform: scale(.2)
}

.db-Sparkline--thickness-thick .db-Sparkline-main-line {
    stroke-width: 2px;
    transform: translateY(-1px)
}

.db-Sparkline--thickness-regular .db-Sparkline-main-line {
    stroke-width: 1.5px;
    transform: translateY(-.75px)
}

.db-Sparkline--thickness-thin .db-Sparkline-main-line {
    stroke-width: 1px;
    transform: translateY(-.5px)
}

.db-Sparkline--color-blue .db-Sparkline-main-line {
    stroke: var(--cyan300)
}

.db-Sparkline--color-blue .db-Sparkline-fill {
    fill: var(--cyan300);
    opacity: .25
}

.db-Sparkline--color-blue .db-Sparkline-dot {
    fill: var(--blue500);
    stroke: #fff
}

.db-Sparkline--color-gray .db-Sparkline-main-line {
    stroke: var(--gray700)
}

.db-Sparkline--color-gray .db-Sparkline-fill {
    fill: var(--gray700);
    opacity: .15
}

.db-Sparkline--color-gray .db-Sparkline-dot {
    fill: var(--gray700);
    stroke: #fff
}

.db-Sparkline--color-lightGray .db-Sparkline-main-line {
    stroke: var(--gray200)
}

.db-Sparkline--color-lightGray .db-Sparkline-fill {
    fill: var(--gray300);
    opacity: .15
}

.db-Sparkline--color-lightGray .db-Sparkline-dot {
    fill: var(--gray300);
    stroke: #fff
}

.db-Sparkline--color-mediumGray .db-Sparkline-main-line {
    stroke: var(--gray500)
}

.db-Sparkline--color-mediumGray .db-Sparkline-fill {
    fill: var(--gray500);
    opacity: .2
}

.db-Sparkline--color-mediumGray .db-Sparkline-dot {
    fill: var(--gray500);
    stroke: #fff
}

.db-Sparkline--color-white .db-Sparkline-main-line {
    stroke: #fff
}

.db-Sparkline--color-white .db-Sparkline-fill {
    fill: #7496fd;
    opacity: .8
}

.db-Sparkline--color-white .db-Sparkline-dot {
    fill: #7496fd;
    stroke: #fff
}

.db-Sparkline--color-cyan .db-Sparkline-main-line {
    stroke: var(--cyan200)
}

.db-Sparkline--color-cyan .db-Sparkline-fill {
    fill: var(--cyan200);
    opacity: .2
}

.db-Sparkline--color-cyan .db-Sparkline-dot {
    fill: var(--cyan200);
    stroke: #fff
}

.db-Sparkline--color-blue4 .db-Sparkline-main-line {
    stroke: var(--blue500)
}

.db-Sparkline--color-blue4 .db-Sparkline-fill {
    fill: var(--blue500);
    opacity: .1
}

.db-Sparkline--color-blue4 .db-Sparkline-dot {
    fill: var(--blue500);
    stroke: #fff
}

.db-Sparkline--color-cyan6 .db-Sparkline-main-line {
    stroke: var(--cyan300)
}

.db-Sparkline--color-cyan6 .db-Sparkline-fill {
    fill: var(--cyan300);
    opacity: .2
}

.db-Sparkline--color-cyan6 .db-Sparkline-dot {
    fill: var(--cyan300);
    stroke: #fff
}

.db-Sparkline--color-red .db-Sparkline-main-line {
    stroke: var(--red400)
}

.db-Sparkline--color-red .db-Sparkline-fill {
    fill: var(--red400);
    opacity: .2
}

.db-Sparkline--color-red .db-Sparkline-dot {
    fill: var(--red400);
    stroke: #fff
}

.db-Sparkline--color-purple6 .db-Sparkline-main-line {
    stroke: var(--purple300)
}

.db-Sparkline--color-purple6 .db-Sparkline-fill {
    fill: var(--purple300);
    opacity: .2
}

.db-Sparkline--color-purple6 .db-Sparkline-dot {
    fill: var(--purple300);
    stroke: #fff
}

.db-Sparkline--color-green .db-Sparkline-main-line {
    stroke: var(--green400)
}

.db-Sparkline--color-green .db-Sparkline-fill {
    fill: var(--green400);
    opacity: .2
}

.db-Sparkline--color-green .db-Sparkline-dot {
    fill: var(--green400);
    stroke: #fff
}

.db-Sparkline--color-slate6 .db-Sparkline-main-line {
    stroke: var(--gray300)
}

.db-Sparkline--color-slate6 .db-Sparkline-fill {
    fill: var(--gray300);
    opacity: .2
}

.db-Sparkline--color-slate6 .db-Sparkline-dot {
    fill: var(--gray300);
    stroke: #fff
}

@media print {
    .db-Sparkline-container {
        -webkit-print-color-adjust: exact
    }

    .db-Sparkline--thickness-thin .db-Sparkline-main-line {
        stroke-width: 2px;
        transform: translateY(-1px)
    }

    .db-Sparkline--color-white .db-Sparkline-main-line {
        stroke: var(--slate)
    }

    .db-Sparkline--color-white .db-Sparkline-fill {
        fill: var(--blue300);
        opacity: .1
    }

    .db-Sparkline--color-white .db-Sparkline-dot {
        fill: var(--blue300);
        stroke: #fff
    }

    .db-Sparkline--color-cyan .db-Sparkline-main-line {
        stroke: var(--blue500)
    }

    .db-Sparkline--color-cyan .db-Sparkline-fill {
        fill: var(--blue500);
        opacity: .1
    }

    .db-Sparkline--color-cyan .db-Sparkline-dot {
        fill: var(--blue500);
        stroke: #fff
    }

    .db-Sparkline-dot {
        stroke-width: 5px;
        r: 8px;
        transform-origin: 50%;
        transition: opacity .2s ease-in-out, transform .35s cubic-bezier(.3, 1.5, .4, 1)
    }
}

.db-SparklineStack {
    width: 100%;
    height: 100%;
    position: relative
}

.db-SparklineStack-child {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.db-HoverGrid {
    fill: none;
    stroke: none;
    pointer-events: all
}

.db-HoverGrid--visible {
    stroke: red
}

.db-HoverVoronoi {
    fill: none;
    stroke: none;
    pointer-events: all
}

.db-HoverVoronoi--visible {
    stroke: red
}

.db-Line {
    fill: none
}

.db-HorizontalAxisMarks--left,
.db-HorizontalAxisMarks--middle,
.db-HorizontalAxisMarks--right {
    fill: var(--gray300);
    text-overflow: ellipsis;
    white-space: nowrap;
    dominant-baseline: hanging;
    pointer-events: none;
    font-size: 12px;
    overflow: hidden
}

.db-HorizontalAxisMarks--left {
    text-anchor: start
}

.db-HorizontalAxisMarks--middle {
    text-anchor: middle
}

.db-HorizontalAxisMarks--right {
    text-anchor: end
}

.db-VerticalAxisMarks--left,
.db-VerticalAxisMarks--middle,
.db-VerticalAxisMarks--right {
    fill: var(--gray300);
    text-overflow: ellipsis;
    white-space: nowrap;
    dominant-baseline: hanging;
    pointer-events: none;
    font-size: 12px;
    overflow: hidden
}

.db-VerticalAxisMarks--left {
    text-anchor: start
}

.db-VerticalAxisMarks--middle {
    text-anchor: middle
}

.db-VerticalAxisMarks--right {
    text-anchor: end
}

.db-ResizableChart {
    flex: auto;
    min-width: 100%;
    min-height: 100%;
    position: relative
}

.db-MultiBarChart {
    position: absolute
}

.db-MultiBarChart-chart {
    text-overflow: ellipsis;
    flex: 1 1 0;
    overflow: hidden
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal,
html.db-NewChrome .DayPicker-container .transition-container {
    width: 300px !important
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal {
    box-shadow: none;
    background: 0 0;
    border-radius: 0
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal .DayPickerNavigation_button {
    position: absolute
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal .DayPickerNavigation_button:first-of-type {
    border: 0;
    padding: 0;
    top: 8px;
    left: 6px
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal .DayPickerNavigation_button:nth-of-type(2) {
    border: 0;
    padding: 0;
    top: 8px;
    right: 24px
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal .navArrow {
    background-color: #0000;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 13px 13px;
    width: 34px;
    height: 34px
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal .navArrow.navPrev {
    background-image: var(--svg-dashboard-icon-right-arrow);
    left: 0;
    transform: rotate(180deg)
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal .navArrow.navNext {
    background-image: var(--svg-dashboard-icon-right-arrow);
    right: 0
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal .DayPicker_weekHeader {
    color: var(--gray400)
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal .DayPicker_weekHeader li {
    width: 14.2857%;
    height: 20px
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal .DayPicker_weekHeader li small {
    font-size: 11px
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal .DayPicker_weekHeader:first-of-type {
    padding: 0 4px;
    top: 48px
}

html.db-NewChrome .DayPicker-container .DayPicker__horizontal .DayPicker_weekHeaders__horizontal {
    margin-left: 0
}

html.db-NewChrome .DayPicker-container .CalendarMonthGrid__horizontal {
    margin-top: 10px;
    left: 0
}

html.db-NewChrome .DayPicker-container .CalendarMonth {
    padding: 0 13px
}

html.db-NewChrome .DayPicker-container .CalendarMonth_caption {
    color: var(--gray700);
    margin-top: 6px;
    margin-bottom: 40px;
    padding: 0;
    font-size: 15px
}

html.db-NewChrome .DayPicker-container .CalendarMonth_table {
    border-collapse: separate
}

html.db-NewChrome .DayPicker-container .CalendarMonth_table td {
    color: var(--gray700);
    border: 0;
    border: 1px solid var(--gray100);
    background: var(--gray50);
    box-sizing: border-box;
    margin-bottom: -1px;
    margin-right: -1px;
    padding-top: 10px;
    font-size: 14px;
    font-weight: 500;
    display: inline-block;
    position: relative;
    width: 40px !important;
    height: 40px !important
}

html.db-NewChrome .DayPicker-container .CalendarMonth_table td:not(.CalendarDay) {
    background: 0 0;
    border: none
}

html.db-NewChrome .DayPicker-container .CalendarDay:active {
    background: var(--gray50)
}

html.db-NewChrome .DayPicker-container .CalendarDay.CalendarDay__default:active {
    background: var(--gray100)
}

html.db-NewChrome .DayPicker-container .CalendarDay.CalendarDay__blocked_calendar,
html.db-NewChrome .DayPicker-container .CalendarDay.CalendarDay__blocked_calendar:active,
html.db-NewChrome .DayPicker-container .CalendarDay.CalendarDay__blocked_out_of_range {
    background: var(--gray50);
    color: var(--gray300);
    cursor: default
}

html.db-NewChrome .DayPicker-container .CalendarDay.CalendarDay__selected_span {
    background: var(--blue400);
    color: #fff;
    border-color: rgba(var(--sail-color-blue-400-rgb), .16);
    z-index: 1
}

html.db-NewChrome .DayPicker-container .CalendarDay.CalendarDay__selected,
html.db-NewChrome .DayPicker-container .CalendarDay.CalendarDay__selected_end,
html.db-NewChrome .DayPicker-container .CalendarDay.CalendarDay__selected_start {
    background: var(--blue500);
    border-color: var(--blue500);
    color: #fff;
    z-index: 2
}

html.db-NewChrome .DayPicker-container .CalendarDay.CalendarDay__selected:active,
html.db-NewChrome .DayPicker-container .CalendarDay.CalendarDay__selected_span:active {
    background: var(--blue600);
    border-color: var(--blue600)
}

html.db-NewChrome .DayPicker-container:not([data-input-method=mouse]):not([data-input-method=touch]) div[role=button] .navArrow:focus {
    box-shadow: 0 0 0 4px rgba(var(--sail-color-cyan-400-rgb), .28), 0 0 1px 1px rgba(var(--sail-color-cyan-600-rgb), .16);
    border-radius: 4px
}

html.db-NewChrome .DayPicker-container:not([data-input-method=mouse]):not([data-input-method=touch]) .CalendarDay:focus {
    box-shadow: 0 0 0 4px rgba(var(--sail-color-blue-200-rgb), .56), 0 0 1px 1px rgba(var(--sail-color-blue-600-rgb), .28);
    z-index: 3;
    border-radius: 4px
}

html.db-NewChrome .DayPicker-container:not([data-input-method=mouse]):not([data-input-method=touch]) .CalendarDay.CalendarDay__selected:focus,
html.db-NewChrome .DayPicker-container:not([data-input-method=mouse]):not([data-input-method=touch]) .CalendarDay.CalendarDay__selected_end:focus,
html.db-NewChrome .DayPicker-container:not([data-input-method=mouse]):not([data-input-method=touch]) .CalendarDay.CalendarDay__selected_span:focus,
html.db-NewChrome .DayPicker-container:not([data-input-method=mouse]):not([data-input-method=touch]) .CalendarDay.CalendarDay__selected_start:focus {
    box-shadow: 0 0 0 4px rgba(var(--sail-color-blue-200-rgb), .56), 0 0 1px 1px #ffffffa3
}

.bs-FilterControl-input-container {
    background: var(--svg-generic-arrow--blue--curved-right)no-repeat;
    background-position: 4px 6px;
    background-size: 12px;
    margin-top: 10px;
    padding-left: 28px
}

.bs-FilterControl-input-container:first-child {
    margin-top: 0
}

.db-StatementsColumnsSelector-chunk {
    flex-grow: 1;
    flex-basis: 0;
    margin-right: 12px
}

.db-ColumnCategorySection-card {
    position: relative
}

.db-ColumnCategorySection-card--fadeOut:after {
    content: "";
    pointer-events: none;
    background: linear-gradient(#fff0, #fff);
    width: 100%;
    height: 48px;
    position: absolute;
    bottom: 0;
    left: 0
}

.db-ColumnCategorySection-card--noFadeOut:after {
    opacity: 0;
    transition: opacity 1s linear
}

.db-ColumnCategorySection-scrollableDiv {
    max-height: 200px;
    overflow-y: scroll
}

@media only screen and (min-height:950px) {
    .db-ColumnCategorySection-scrollableDiv {
        max-height: 250px
    }
}

@media only screen and (min-height:1100px) {
    .db-ColumnCategorySection-scrollableDiv {
        max-height: 300px
    }
}

.db-AdditionalRecipientsTooltip {
    cursor: help;
    display: inline-flex
}

.db-AcceptanceChartContainer {
    width: 100%;
    height: 216px;
    margin: 0 auto
}

.db-DeclineReasonsBarChart {
    background-color: #fff;
    border-radius: 4px;
    width: 100%;
    height: 12px;
    position: relative;
    overflow: hidden
}

.db-DeclineReasonsBarChart--empty {
    background-color: var(--sail-gray100)
}

.db-DeclineReasonsBarChart-BarChart {
    flex-direction: row;
    width: 100%;
    display: flex
}

.db-DeclineReasonsBarChart-BarChart-BarSection {
    opacity: 1;
    height: 12px;
    position: relative
}

.db-DeclineReasonsBarChart-BarChart-BarSection--faded {
    opacity: .15
}

.db-AcceptanceRateCutLineChart {
    height: 170px;
    margin: 0 auto;
    padding-top: 10px
}

.db-AcceptanceTopLineChart {
    height: 170px;
    margin: 0 auto
}

.db-TopLineTooltip {
    border-radius: 4px;
    min-width: 280px
}

.db-TopLineTooltip-tableHeader {
    background-color: var(--gray50)
}

.db-TopLineTooltip-tableCell {
    padding: 4px 8px
}

.db-TopLineTooltipV2 {
    border-radius: 4px;
    min-width: 300px
}

.db-TopLineTooltipV2-tableHeader {
    background-color: var(--gray50)
}

.db-TopLineTooltipV2-tableCell {
    padding: 2px 8px
}

.db-TopLineTooltipV2-tableFooter {
    padding-bottom: 8px
}

.db-TopLineTooltipV2-icon {
    border-radius: 8px;
    width: 8px;
    height: 8px
}

.db-RateCutTooltip {
    border-radius: 4px
}

.db-RateCutTooltip-tableHeader {
    background-color: var(--gray50)
}

.db-RateCutTooltip-tableCell {
    min-width: 3.5em;
    padding: 2px 8px
}

.db-RateCutTooltip-progressBarCell {
    padding-right: 0
}

.db-RateCutTooltip-volumePercentCell {
    padding-left: 0
}

.db-RateCutTooltip-progressBarBox {
    float: right;
    width: 58px;
    margin-left: 15px
}

.db-RateCutTooltip-volumeCaption {
    margin-left: 15px
}

.db-SummaryByReportingCategoryReportCard-section .db-SummaryByReportingCategoryReportCard-downloadButton {
    opacity: 0
}

.db-SummaryByReportingCategoryReportCard-section .db-SummaryByReportingCategoryReportCard-downloadButton:focus-within,
.db-SummaryByReportingCategoryReportCard-section:hover .db-SummaryByReportingCategoryReportCard-downloadButton {
    opacity: initial
}

.db-FeeTooltip {
    -webkit-text-decoration: underline dashed var(--gray300);
    -webkit-text-decoration: underline dashed var(--gray300);
    text-decoration: underline dashed var(--gray300);
    cursor: help
}

.db-ReportingCategoryTooltip {
    cursor: pointer
}

.db-PrintableHeader {
    display: none
}

@media only print {
    .db-PrintableHeader {
        display: block
    }
}

.db-StatementError,
.db-StatementError-container {
    padding: 0 20px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.db-StatementError {
    background-color: #ffffffb3
}

.db-StatementError-container {
    margin: auto
}

.db-StatementLoadingIndicator,
.db-StatementLoadingIndicator-loadingState {
    z-index: 1;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.db-StatementLoadingIndicator {
    background-color: #ffffffd9
}

.db-StatementLoadingIndicator-loadingState {
    margin: auto
}

.db-ReportDateTooltip {
    cursor: help;
    display: inline-flex
}

.db-TimestampWithTimezone {
    display: inline-flex
}

.db-TimestampWithTimezone-date {
    margin-left: 4px
}

.db-TimestampWithTimezone-date--hasTooltip {
    border-bottom: 1px dashed var(--gray300);
    cursor: help
}

.db-NetworkCostsSection-content {
    width: 100%
}

.db-NetworkCostsSection-anchor {
    visibility: hidden;
    display: block;
    position: relative;
    top: -100px
}

.db-NetworkCostsTopLineMetrics-sectionContent {
    height: 48px;
    overflow: hidden
}

.db-ConversionRateLineChart {
    height: 170px;
    margin: 0 auto;
    padding-top: 10px
}

.db-ConversionRateTooltip {
    border-radius: 4px
}

.db-ConversionRateTooltip-tableHeader {
    background-color: var(--gray50)
}

.db-ConversionRateTooltip-tableCell {
    min-width: 3.5em;
    padding: 2px 8px
}

.db-ConversionRateTooltip-progressBarCell {
    padding-right: 0
}

.db-ConversionRateTooltip-volumePercentCell {
    padding-left: 0
}

.db-ConversionRateTooltip-progressBarBox {
    float: right;
    width: 58px;
    margin-left: 15px
}

.db-ConversionRateTooltip-volumeCaption {
    margin-left: 15px
}

.db-ExemptedPaymentsBarChart {
    background-color: #fff;
    border-radius: 4px;
    width: 100%;
    height: 12px;
    position: relative;
    overflow: hidden
}

.db-ExemptedPaymentsBarChart--empty {
    background-color: var(--sail-gray100)
}

.db-ExemptedPaymentsBarChart-BarChart {
    flex-direction: row;
    width: 100%;
    display: flex
}

.db-ExemptedPaymentsBarChart-BarChart-BarSection {
    opacity: 1;
    height: 12px;
    position: relative
}

.db-ExemptedPaymentsBarChart-BarChart-BarSection--faded {
    opacity: .15
}

:root {
    --OverflowScroll-before: 0;
    --OverflowScroll-after: 0
}

.db-OverflowScroll {
    position: relative
}

.db-OverflowScroll-outerWrapper--horizontal {
    overflow-x: auto
}

.db-OverflowScroll-innerWrapper {
    min-width: 100%;
    display: inline-block
}

.db-OverflowScroll:after,
.db-OverflowScroll:before {
    content: "";
    pointer-events: none;
    width: 56px;
    height: 100%;
    position: absolute;
    top: 0
}

.db-OverflowScroll:before {
    transform-origin: 0;
    transform: scaleX(var(--OverflowScroll-before));
    background: linear-gradient(90deg, #fff 0%, #fff0 100%);
    left: 0
}

.db-OverflowScroll:after {
    transform-origin: 100%;
    transform: scaleX(var(--OverflowScroll-after));
    background: linear-gradient(270deg, #fff 0%, #fff0 100%);
    right: 0
}

.db-ChartDetailPage {
    overflow-x: visible
}

.db-ChartDetailPage-main {
    width: 0;
    margin-left: -4px;
    overflow-x: visible
}

.db-ChartDetailPage-chartSkeleton {
    flex: 100%
}

.db-ChartDetailPage-dataTable,
.db-ChartDetailPage-dataTable-wrapper {
    width: 100%
}

.db-ImageDisplay {
    width: 100%;
    height: 100%;
    position: relative
}

.db-ImageDisplay-image {
    background-size: 100% 100%;
    border-radius: 6px;
    width: 100%;
    height: 100%;
    position: relative
}

.db-ImageDisplay-dots {
    z-index: 3;
    position: absolute;
    bottom: 20px
}

.db-ImagePreview {
    border-radius: 4px;
    position: relative;
    overflow: hidden
}

.db-ImagePreview-caption {
    border-radius: 4px;
    box-shadow: 0 4px 10px #e3e8ee
}

.db-ImagePreview-border {
    border-radius: 4px;
    width: 100%;
    height: 100%;
    position: absolute
}

.db-ImagePreview-image {
    object-fit: contain;
    position: absolute
}

.db-ImageEditor {
    border-radius: 4px;
    position: relative
}

.db-ImageEditor-empty {
    z-index: 5;
    width: 100%;
    height: 100%;
    position: relative
}

.db-ImageEditor-checkerboard {
    width: 100%;
    height: 100%;
    cursor: -webkit-grab;
    position: relative
}

.db-ImageEditor-slider {
    z-index: 6;
    margin-top: -36px;
    margin-left: 32px;
    margin-right: 32px;
    position: relative
}

.db-ImageEditor-checkerboard:active {
    cursor: -webkit-grabbing
}

.db-ImageEditor-shadow {
    z-index: 4;
    border: 3px solid #fff;
    border-radius: 8px;
    position: absolute;
    box-shadow: 0 0 0 500px #acb6c480, inset 0 0 10px #acb6c4
}

.db-ImageEditor-shadow-config {
    z-index: 4;
    border: 3px solid #fff;
    border-radius: 8px;
    position: absolute;
    box-shadow: 0 0 0 500px #c0c8d2b3, inset 0 0 10px #acb6c4
}

.db-ImageEditor-dimensions {
    z-index: 4;
    border: 1px solid #fff;
    border-radius: 4px;
    position: absolute;
    bottom: -16px;
    box-shadow: 0 0 0 1px #acb6c480
}

.db-ImageEditor-overlay {
    z-index: 3;
    position: relative
}

.db-ImageEditor-image {
    z-index: 2;
    -webkit-user-select: none;
    user-select: none;
    position: absolute
}

.db-BrowseOrderStageManager {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute
}

.db-BrowseOrderStageManager-background {
    justify-content: center;
    width: 100%;
    min-height: 100vh;
    display: flex
}

.db-BrowseOrderStageManager.db-is-admin,
.db-TerminalShopCheckout.db-is-admin {
    margin-top: 48px
}

.db-CartButton {
    width: 50px;
    height: 50px;
    position: absolute;
    transform: translate(25px, -35px)
}

.db-CartButton-circle {
    opacity: 0;
    background-color: #00f;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: .4s scaleIn
}

@keyframes scaleIn {
    0% {
        opacity: .5;
        transform: scale(.5)
    }

    to {
        opacity: 0;
        transform: scale(1)
    }
}

.db-AccountApplicationV2-backLink {
    width: 34px;
    margin-top: 2px
}

.db-AccountApplicationV2-topNav {
    max-width: 100vw
}

.db-AccountApplicationV2-tableOfContents {
    display: none
}

.db-AccountApplicationV2-form {
    max-width: 100vw;
    margin-top: 50px;
    padding-left: 15px;
    padding-right: 15px
}

.db-AccountApplicationV2-localeSelector {
    display: none
}

.db-AccountApplicationV2-emailVerificationDialog {
    padding-top: 25vh
}

@media (max-width:431px) {
    .db-AccountApplicationV2 .db-PageTopNav {
        padding-top: 12px;
        padding-bottom: 12px
    }
}

@media (min-width:432px) {
    .db-AccountApplicationV2-form {
        width: 416px;
        margin-top: 89px;
        padding-left: 0;
        padding-right: 0
    }
}

@media (min-width:992px) {
    .db-AccountApplicationV2-tableOfContents {
        width: 215px;
        display: block;
        position: fixed;
        top: 120px;
        left: 52px
    }

    .db-AccountApplicationV2-localeSelector {
        display: unset;
        position: fixed;
        top: 70px;
        left: 50px
    }
}

.db-AccountApp .db-TwoFactorAuth-enabled {
    margin: 12px
}

.db-AccountApp .db-AccountApp-tail .db-AccountApp-tailStart {
    flex: auto;
    margin-right: 16px
}

.db-AccountApp .db-AccountApp-tail .db-AccountApp-tailStart:last-child {
    margin-right: 0
}

.db-AccountApp-tailStart {
    padding-bottom: 16px
}

.db-AccountApp-tailStart:last-child {
    padding-bottom: 0
}

.db-AccountApp .db-AccountApp-tail .db-AccountApp-tailEnd .db-AccountApp-tailButton {
    margin-left: 12px
}

.db-AccountApp .db-AccountApp-tail .db-AccountApp-tailEnd .db-AccountApp-tailButton:first-child {
    margin-left: 0
}

@media screen and (max-width:500px) {
    .db-AccountApp--mobileSupport .db-AccountApp-tail {
        flex-direction: column
    }

    .db-AccountApp--mobileSupport .db-AccountApp-tail .db-AccountApp-tailEnd,
    .db-AccountApp--mobileSupport .db-AccountApp-tail .db-AccountApp-tailStart {
        width: 100%
    }

    .db-AccountApp--mobileSupport .db-AccountApp-tail .db-AccountApp-tailStart {
        margin-bottom: 16px;
        margin-right: 0
    }

    .db-AccountApp--mobileSupport .db-AccountApp-tail .db-AccountApp-tailEnd {
        flex-direction: column-reverse;
        align-items: center
    }

    .db-AccountApp--mobileSupport .db-AccountApp-tail .db-AccountApp-tailEnd .db-AccountApp-tailButton {
        text-align: center;
        width: 100%;
        margin-top: 12px;
        margin-left: 0
    }

    .db-AccountApp--mobileSupport .db-AccountApp-tail .db-AccountApp-tailStart {
        margin-top: 0
    }
}

.db-AccountAppPhoneVerification {
    align-items: center;
    display: flex
}

.db-AccountAppPhoneVerification .db-AccountAppPhoneVerification-verified,
.db-AccountAppPhoneVerification .bs-Button {
    margin-left: 10px
}

.db-AccountAppPhoneVerification-verified {
    flex: none
}

.db-AccountAppPhoneVerificationConfirmation-error {
    color: var(--red);
    text-align: center;
    font-weight: var(--font-weight--regular);
    font-size: var(--font-size--small);
    min-height: 20px
}

.bs-Fieldset-row.bs-is-invalid .db-AccountApp-legalEntityAddress .bs-Button {
    box-shadow: 0 0 0 1px rgba(var(--sail-color-red-500-rgb), .5), 0 1px 1px #00000014
}

@media screen and (max-width:550px) {

    .db-AccountApp-ProductDetails .db-AccountApp-IndustryPicker-Select,
    .db-AccountApp-ProductDetails .db-AccountApp-ProductDescription {
        max-width: 320px
    }
}

html.is-SmoothScrollBehavior--active {
    scroll-behavior: smooth
}

@media (prefers-reduced-motion:reduce) {
    * {
        scroll-behavior: auto !important
    }
}

.db-ProgressIndicatorBadge {
    border-radius: 4px;
    padding: 1px 6px
}

div.ExplorePage div.FullscreenHeader .Box-root {
    margin-left: 20px
}

div.ExplorePage div.FullscreenHeader nav,
div.ExplorePage div.FullscreenHeader .FullscreenHeader-separator {
    display: none
}

div.FullscreenView:has(div.ExploreHeaderWrapper) {
    overflow-y: visible;
    justify-content: initial !important
}

div.ExploreHeaderWrapper div.FullscreenHeader-header {
    margin: auto
}

html:has(div.ExploreHeaderWrapper) {
    overflow: hidden
}

.db-HeaderWithRightText,
.db-HeaderWithRightText>header>div>div,
.db-HeaderWithRightText>header>div>div>span {
    width: 100%
}

@media (max-width:500px) {
    .db-NeedHelpDesktop {
        display: none
    }
}

@media (min-width:500px) {
    .db-NeedHelpMobile {
        display: none
    }
}

.db-CustomerDetailPage .ContentHeader-title .Text-fontSize--20,
.db-CustomerDetailPage .ListView .Text-fontSize--20 {
    font-size: 16px;
    line-height: 24px
}

.db-CustomerDetailPage .PropertyListItem--stacked>.Padding-bottom--4,
.db-CustomerDetailPage .PropertyListItem-status {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0
}

.db-db-Delete-Customer-Modal-Layer .db-db-ErrorState-message {
    font-size: 12px
}

.db-EmailPreviewModal-iframe {
    border-width: 0;
    width: 100%;
    min-height: 481px;
    padding: 0;
    position: relative
}

.db-CapitalizeFirst {
    display: inline-block
}

.db-CapitalizeFirst:first-letter {
    text-transform: uppercase
}

.db-InvoicingToggle-clickableRow {
    cursor: pointer
}

.db-PaymentDueInput>.bs-TextInputGroup {
    box-shadow: none;
    border-right: 1px solid #cfd7df;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.db-PaymentDueInput .bs-TextInputGroup-copy,
.db-PaymentDueInput>.bs-TextInputGroup>.bs-TextInput {
    border-radius: 5px 0 0 5px
}

.db-PaymentDueInput .bs-TextInputGroup-copy {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    margin-left: 0
}

.db-PortalPreviewSizeControls-segmentedControl {
    align-items: center;
    display: flex
}

.db-PortalPreviewSizeControls-segmentedControl .db-SegmentedControlOption--selected svg {
    color: var(--sail-color-blue-400)
}

.db-TaxRate input {
    flex: 1
}

.db-TaxRate .bs-TextInputGroup-copy {
    background-color: var(--slate--9);
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px
}

.db-TaxRate .bs-TextInput+.bs-TextInputGroup-copy {
    margin-left: 0
}

.db-BillingChartPopover {
    min-width: 200px
}

.db-BillingChartPopover-tableHeader {
    background-color: var(--gray50)
}

.db-BillingChartPopover-tableCell {
    padding: 4px 8px
}

.db-BillingChartPopover-tableFooter {
    border-top: 1px solid var(--gray100)
}

.db-BillingLineChart,
.db-BillingStackedBarChart {
    position: absolute
}

.db-BillingCustomerList {
    overflow: hidden
}

.db-BillingOverviewMetricHeading-primaryValue--invisible {
    visibility: hidden
}

.db-PaperChecksSection-checkImage {
    cursor: pointer;
    filter: drop-shadow(0 1px 2px #0003);
    width: 100%;
    height: auto
}

.db-ImageCarouselModal-imageContainer {
    background-color: var(--sail-gray100) !important
}

.db-ImageCarouselModal-footerImage {
    object-fit: cover;
    cursor: pointer;
    border: 2pt solid #0000;
    border-radius: 4pt
}

.db-ImageCarouselModal-footerImage--selected {
    border: 2pt solid var(--sail-blue500)
}

.db-TestClockDetailPage-content {
    position: relative
}

.db-TestClockDetailPage-editScreen {
    z-index: 1;
    background-color: #ffffff80;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: -5px
}

.db-InvoiceEditorPriceSelectorSelectButton [class*=PressableCore-base] {
    width: 100%
}

.db-InvoiceEditorPriceSelectorSelectButton [class*=PressableCore-base] [class*=Button-label] {
    width: calc(100% - 20px);
    display: inline-block
}

.db-InvoicesGettingStartedCards--PrimaryView,
.db-InvoicesGettingStartedCards--SecondaryView {
    transition: all .2s ease-in-out
}

.db-InvoicesGettingStartedCards:hover .db-InvoicesGettingStartedCards--PrimaryView {
    transform: translateY(-6px)
}

.db-InvoicesGettingStartedCards:hover .db-InvoicesGettingStartedCards--SecondaryView {
    transform: translateY(-14px)
}

.db-PortalConfigurationForm-footer--sticky {
    z-index: 11;
    position: sticky;
    bottom: 0;
    background-color: #ffffffe6 !important
}

.db-PortalConfigurationForm-wrapper {
    height: calc(100vh - 122px)
}

.db-PortalConfigurationForm-wrapper>form {
    height: 100%
}

html.is-PortalConfigurationPreview--active body {
    overflow: hidden
}

.db-ConfirmationButton-spinner {
    color: var(--sail-color-gray-400);
    transform-origin: 50%;
    width: 24px;
    height: 24px;
    transition-property: opacity, transform;
    transition-timing-function: ease;
    animation: .25s ConfirmationButtonSpinnerAnimationShow, .6s linear infinite ConfirmationButtonSpinnerAnimationRotation;
    display: flex;
    position: relative
}

@keyframes ConfirmationButtonSpinnerAnimationShow {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes ConfirmationButtonSpinnerAnimationRotation {
    to {
        transform: rotate(360deg)
    }
}

.db-ConfirmationButton-initialLabel {
    transition: opacity .11s ease-in-out, visibility 0s linear .11s
}

.db-ConfirmationButton-initialLabel--active {
    transition: opacity .11s ease-in-out, visibility linear
}

.db-ConfirmationButton-pendingLabel {
    transition: opacity .44s ease-in-out, visibility 0s linear .44s
}

.db-ConfirmationButton-pendingLabel--active {
    transition: opacity 1.1s ease-in-out, visibility linear
}

.db-QuantityField--stepButton {
    width: 100%;
    height: 100%
}

.db-QuantityField--stepButton button {
    align-items: center;
    display: flex
}

.db-PortalPaymentElementWrapper iframe {
    position: static
}

.db-PromotionCode-ApplyButton {
    opacity: 0;
    pointer-events: none;
    z-index: 100;
    background: 0 0;
    border: none;
    transition: opacity .2s, transform .2s;
    transform: scale(.8)
}

.db-PromotionCode-ApplyButton--visible {
    opacity: 1;
    pointer-events: auto;
    cursor: pointer;
    transform: scale(1)
}

.db-RevenuePopover {
    min-width: 200px
}

.db-RevenuePopover-tableHeader {
    background-color: var(--gray50)
}

.db-RevenuePopover-tableCell {
    padding: 4px 8px
}

.db-FileUploaderDropArea {
    border: 1px dashed var(--sail-color-gray-200);
    background: #fff;
    border-radius: 10px;
    padding: 24px
}

.db-ImportCsvDrawerFileUploaderDropArea {
    border: 1px dashed var(--sail-color-gray-200);
    background: #f6f8fa;
    border-radius: 10px;
    padding: 24px
}

.db-Waterfall-cell {
    border-left: 1px solid var(--neutral-50, #ebeef1);
    border-right: 1px solid var(--neutral-50, #ebeef1);
    box-shadow: inset 0 -1px 0 0 var(--neutral-50, #ebeef1)
}

.db-Waterfall>:not(:last-child) .db-Waterfall-cell,
.db-Waterfall>:last-child .db-Waterfall-cell {
    padding-right: 0
}

.db-Waterfall>:not(:first-child) .db-Waterfall-cell,
.db-Waterfall>:first-child .db-Waterfall-cell {
    padding-left: 0
}

.db-Waterfall>:nth-child(2) .db-DataTableWrapper-row .db-Waterfall-cell:first-child,
.db-Waterfall>:first-child .db-DataTableWrapper-row .db-Waterfall-cell:first-of-type {
    border-left: 0
}

.db-Waterfall>:last-child .db-DataTableWrapper-row .db-Waterfall-cell:last-of-type {
    border-right: 0
}

.db-Waterfall--scrollable>:first-child .db-DataTableWrapper-row .db-Waterfall-cell:nth-child(2) {
    border-right: 1px solid var(--neutral-400, #818da0)
}

.db-subTransaction {
    background-color: var(--sail-color-gray-50)
}

.db-CsvImport-validation-message ul {
    margin: 4px 0;
    padding-left: 32px
}

.db-CsvImport-validation-message ul li {
    line-height: 1.5;
    list-style: disc
}

html[data-bootstrap=register_app] {
    background-color: #fff
}

.db-RegisterApp-root {
    background-color: #fff;
    margin: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.db-RegisterApp-containerSizeListener {
    width: 100%;
    height: 100%
}

.db-RegisterApp-root.db-RegisterApp--v4 a {
    color: var(--keel-blurple)
}

.db-RegisterApp-root.db-RegisterApp--v4 a:active,
.db-RegisterApp-root.db-RegisterApp--v4 a:hover {
    color: var(--sail-gray900)
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--atlas a,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--atlas a:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--atlas a:hover,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--billing a,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--billing a:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--billing a:hover,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--climate a,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--climate a:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--climate a:hover,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--connect a:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--connect a:hover,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--invoices a:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--invoices a:hover,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--tax a:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--tax a:hover {
    color: var(--sail-gray800)
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--opal a {
    color: var(--keel-darkGreen)
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--atlas a,
.db-StreamlinedLayout--atlas a {
    color: #ff7600
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--connect a,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--issuing a,
.db-StreamlinedLayout--connect a,
.db-StreamlinedLayout--issuing a {
    color: var(--keel-cerulean)
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--checkout a,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--payment_links a,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--payments a,
.db-StrealinedLayout--checkout a,
.db-StrealinedLayout--payment_links a,
.db-StrealinedLayout--payments a {
    color: var(--keel-violet)
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--billing a,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--climate a,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--invoices a,
.db-StreamlinedLayout--billing a,
.db-StreamlinedLayout--climate a,
.db-StreamlinedLayout--invoices a {
    color: var(--keel-forest)
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--tax a,
.db-StreamlinedLayout--tax a {
    color: var(--keel-amethyst)
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--atlas .db-RegisterAndLoginLayout .db-RegisterSubmitButton svg,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--billing .db-RegisterAndLoginLayout .db-RegisterSubmitButton svg,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--climate .db-RegisterAndLoginLayout .db-RegisterSubmitButton svg,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--invoices .db-RegisterAndLoginLayout .db-RegisterSubmitButton svg,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--atlas .db-RegisterAndLoginLayout .db-RegisterSubmitButton button,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--billing .db-RegisterAndLoginLayout .db-RegisterSubmitButton button,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--climate .db-RegisterAndLoginLayout .db-RegisterSubmitButton button,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--invoices .db-RegisterAndLoginLayout .db-RegisterSubmitButton button {
    color: #fff !important
}

.db-RegisterApp-root.db-RegisterApp--v4 .db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:before {
    background-color: var(--keel-blurple)
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--checkout .db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:before,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--payment_links .db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:before,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--payments .db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:before {
    background-color: var(--keel-violet)
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--connect .db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:before,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--issuing .db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:before {
    background-color: var(--keel-cerulean)
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--atlas .db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:before {
    background-color: #ff7600
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--tax .db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:before {
    background-color: var(--keel-amethyst)
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--billing a.db-RegisterConsentCheckbox,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--climate a.db-RegisterConsentCheckbox,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--invoices a.db-RegisterConsentCheckbox {
    color: var(--keel-forest) !important
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--checkout a.db-RegisterConsentCheckbox,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--payment_links a.db-RegisterConsentCheckbox,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--payments a.db-RegisterConsentCheckbox {
    color: var(--keel-violet) !important
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--atlas a.db-RegisterConsentCheckbox {
    color: #ff7600 !important
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--connect a.db-RegisterConsentCheckbox,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--issuing a.db-RegisterConsentCheckbox {
    color: var(--keel-cerulean) !important
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--billing a.db-RegisterConsentCheckbox:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--billing a.db-RegisterConsentCheckbox:hover,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--checkout a.db-RegisterConsentCheckbox:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--checkout a.db-RegisterConsentCheckbox:hover,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--climate a.db-RegisterConsentCheckbox:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--climate a.db-RegisterConsentCheckbox:hover,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--connect a.db-RegisterConsentCheckbox:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--connect a.db-RegisterConsentCheckbox:hover,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--invoices a.db-RegisterConsentCheckbox:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--invoices a.db-RegisterConsentCheckbox:hover,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--issuing a.db-RegisterConsentCheckbox:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--issuing a.db-RegisterConsentCheckbox:hover,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--payment_links a.db-RegisterConsentCheckbox:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--payment_links a.db-RegisterConsentCheckbox:hover,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--payments a.db-RegisterConsentCheckbox:active,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--payments a.db-RegisterConsentCheckbox:hover {
    color: var(--sail-gray800) !important
}

.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--billing .db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:before,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--climate .db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:before,
.db-RegisterApp-root.db-RegisterApp--v4.db-RegisterApp--invoices .db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:before {
    background-color: var(--keel-forest)
}

.db-RegisterCaptcha {
    position: relative
}

.db-RegisterCaptcha--v1 {
    margin-bottom: 14px
}

div.db-RegisterCaptcha--v2 .grecaptcha-badge {
    margin-right: -4px
}

div.db-RegisterCaptcha--v2.hidden .grecaptcha-badge {
    visibility: hidden
}

.db-RegisterCountryInput a {
    color: var(--keel-paleBlurple)
}

.db-RegisterCountryInput-item {
    font-weight: 400
}

.db-RegisterCountryInput-container .db-RegisterCountryInput-item {
    font-weight: 500
}

.db-RegisterPage-invisibleCaptchaContainer {
    position: fixed;
    top: calc(50% - 30px)
}

.db-RegisterPage-passwordInputContainer {
    min-height: auto
}

.db-RegisterPage-passwordInputContainer label>span {
    font-weight: 600
}

.db-RegisterPage-passwordConfirmationInputContainer {
    min-height: 98px
}

.db-RegisterPage-passwordInputContainerBarVariant {
    min-height: 88px
}

.db-RegisterAndLoginLayout--register.db-RegisterAndLoginLayout--isMobile .db-RegisterPage-passwordInputContainer {
    min-height: 0;
    padding-bottom: 4px
}

.db-RegisterPage-inputContainer {
    min-height: 100px
}

.db-RegisterAndLoginLayout--register.db-RegisterAndLoginLayout--isMobile .db-RegisterPage-inputContainer {
    min-height: 0;
    padding-bottom: 16px
}

.db-RegisterConsentSpacer {
    padding-bottom: 10px
}

.db-RegisterPage--googleButtonContainer span {
    font-weight: 400
}

@media screen and (min-width:881px) {
    .db-RegisterConsentSpacer {
        padding-bottom: 26px
    }
}

.db-RegisterPasswordInput-strengthIndicator {
    z-index: 999;
    display: flex;
    position: absolute;
    top: -18px;
    right: 0
}

.db-RegisterPasswordInput-strengthIndicatorDot {
    background: var(--gray100);
    border-radius: 6px;
    width: 6px;
    height: 6px;
    margin-left: 4px;
    transition: transform .3s cubic-bezier(.5, 0, .7, 1.5), background-color .1s cubic-bezier(.01, .4, .97, .55);
    display: block
}

.db-RegisterPasswordInput-strengthIndicatorDot--transparent {
    background-color: #0000
}

.db-RegisterPasswordInput-strengthIndicatorDot--red {
    background-color: var(--red500)
}

.db-RegisterPasswordInput-strengthIndicatorDot--orange {
    background-color: var(--orange400)
}

.db-RegisterPasswordInput-strengthIndicatorDot--green {
    background-color: var(--green300)
}

.db-RegisterPasswordInput--fieldWrapper {
    position: relative
}

.db-RegisterPasswordInput--fieldWrapper input[type=password]::-ms-reveal {
    display: none
}

.db-RegisterPasswordInput-strengthIndicatorDot--index1 {
    transition-delay: .1s
}

.db-RegisterPasswordInput-strengthIndicatorDot--index2 {
    transition-delay: .2s
}

.db-RegisterPasswordInput-strengthIndicatorDot--index3 {
    transition-delay: .3s
}

.db-RegisterPasswordInput-strengthIndicatorDot-appear {
    transform: translateY(10px)scale(0)
}

.db-RegisterPasswordInput-strengthIndicatorDot-appear-active,
.db-RegisterPasswordInput-strengthIndicatorDot-appear-done {
    transform: translateY(0)scale(1)
}

.db-RegisterPasswordInput-visibilityToggle {
    cursor: pointer
}

.db-RegisterPasswordInputWithBarIndicator-container {
    transition: height .3s cubic-bezier(.7, 0, .3, 1)
}

.db-RegisterPasswordInputWithBarIndicator-contentContainer {
    padding: 0 20px 16px
}

.db-RegisterPage-passwordInputContainer .db-RegisterPasswordInputWithBarIndicator-contentContainer,
.db-RegisterAndLoginLayout--register.db-RegisterAndLoginLayout--isMobile .db-RegisterPasswordInputWithBarIndicator-contentContainer {
    padding: 5px 20px 2px
}

.db-RegisterPasswordInputWithBarIndicator-contentContainer.db-RegisterPasswordInputWithBarIndicator-tooWeak .db-RegisterTextInputWithVisibilityToggle--hidden,
.db-RegisterPasswordInputWithBarIndicator-contentContainer.db-RegisterPasswordInputWithBarIndicator-tooWeak .db-RegisterTextInputWithVisibilityToggle--shown {
    box-shadow: 0 0 #0000, 0 0 #0000, 0 0 #0000, 0 0 0 1px #e61947, 0 0 #0000, 0 0 #0000, 0 0 #0000 !important
}

.db-RegisterPasswordInputWithBarIndicator-contentContainer.db-RegisterPasswordInputWithBarIndicator-tooWeak .db-RegisterTextInputWithVisibilityToggle--hidden:focus-within,
.db-RegisterPasswordInputWithBarIndicator-contentContainer.db-RegisterPasswordInputWithBarIndicator-tooWeak .db-RegisterTextInputWithVisibilityToggle--shown:focus-within {
    box-shadow: 0 0 #0000, 0 0 0 4px #3a97d45c, 0 0 #0000, 0 0 0 1px #e61947, 0 0 #0000, 0 0 #0000, 0 0 #0000 !important
}

.db-RegisterPasswordInputWithBarIndicator-contentContainer.db-RegisterPasswordInputWithBarIndicator-acceptable .db-RegisterTextInputWithVisibilityToggle--hidden,
.db-RegisterPasswordInputWithBarIndicator-contentContainer.db-RegisterPasswordInputWithBarIndicator-acceptable .db-RegisterTextInputWithVisibilityToggle--shown,
.db-RegisterPasswordInputWithBarIndicator-contentContainer.db-RegisterPasswordInputWithBarIndicator-success .db-RegisterTextInputWithVisibilityToggle--hidden,
.db-RegisterPasswordInputWithBarIndicator-contentContainer.db-RegisterPasswordInputWithBarIndicator-success .db-RegisterTextInputWithVisibilityToggle--shown {
    box-shadow: 0 0 #0000, 0 0 #0000, 0 0 #0000, 0 0 0 1px #2b8700, 0 0 #0000, 0 0 #0000, 0 0 #0000 !important
}

.db-RegisterPasswordInputWithBarIndicator-contentContainer.db-RegisterPasswordInputWithBarIndicator-acceptable .db-RegisterTextInputWithVisibilityToggle--hidden:focus-within,
.db-RegisterPasswordInputWithBarIndicator-contentContainer.db-RegisterPasswordInputWithBarIndicator-acceptable .db-RegisterTextInputWithVisibilityToggle--shown:focus-within,
.db-RegisterPasswordInputWithBarIndicator-contentContainer.db-RegisterPasswordInputWithBarIndicator-success .db-RegisterTextInputWithVisibilityToggle--hidden:focus-within,
.db-RegisterPasswordInputWithBarIndicator-contentContainer.db-RegisterPasswordInputWithBarIndicator-success .db-RegisterTextInputWithVisibilityToggle--shown:focus-within {
    box-shadow: 0 0 #0000, 0 0 0 4px #3a97d45c, 0 0 #0000, 0 0 0 1px #2b8700, 0 0 #0000, 0 0 #0000, 0 0 #0000 !important
}

.db-RegisterPasswordInputWithBarIndicator-text {
    opacity: 0;
    transition: opacity .3s cubic-bezier(.7, 0, .3, 1);
    display: flex
}

.db-RegisterPasswordInputWithBarIndicator-indicatorContainer {
    flex-direction: column;
    gap: 12px;
    padding-top: 16px;
    display: flex
}

.db-RegisterPage-passwordInputContainer .db-RegisterPasswordInputWithBarIndicator-indicatorContainer {
    padding-top: 14px
}

.db-RegisterPage-passwordInputContainer .db-RegisterPasswordInputWithBarIndicator-phrase {
    transition-delay: .1s
}

.db-RegisterPasswordInputWithBarIndicator-label {
    font-weight: 500
}

.db-RegisterAndLoginLayout--register.db-RegisterAndLoginLayout--isMobile .db-RegisterPasswordInputWithBarIndicator-label {
    font-weight: 600
}

.db-RegisterPasswordInputStrengthDescription {
    min-height: 18px;
    padding-top: 8px;
    line-height: 12px;
    transition: opacity .1s cubic-bezier(.01, .4, .97, .55)
}

.db-RegisterAndLoginLayout--register.db-RegisterAndLoginLayout--isMobile .db-RegisterPasswordInputStrengthDescription {
    flex-basis: 0;
    min-height: 0
}

.db-RegisterPasswordInputStrengthDescription-enter {
    opacity: 0
}

.db-RegisterPasswordInputStrengthDescription-enter-active,
.db-RegisterPasswordInputStrengthDescription-enter-done,
.db-RegisterPasswordInputStrengthDescription-exit {
    opacity: 1
}

.db-RegisterPasswordInputStrengthDescription-exit-active,
.db-RegisterPasswordInputStrengthDescription-exit-done {
    opacity: 0
}

.db-RegisterTitle--v4 {
    letter-spacing: -.2px;
    font-family: sohne-var, sohne-woff, Helvetica Neue, Arial, sans-serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 32px
}

.db-RegisterTitle--v4:lang(ja) {
    font-weight: 600
}

.db-RegisterTitle {
    margin-bottom: var(--sail-spacing-12);
    font-size: 26px;
    font-weight: 500;
    line-height: 36px
}

.db-RegisterSubheading {
    margin-top: 8px
}

.db-RegisterTitle+.db-RegisterSubheading {
    margin-top: 0;
    margin-bottom: 18px
}

.db-RegisterAndLoginLayout:has(.db-RegisterSubheading) .db-RegisterTitle {
    margin-bottom: 8px
}

.db-RegisterValueProps--v4 {
    margin-left: 16px;
    margin-right: 12.5%
}

.db-RegisterValueProps--v4.db-RegisterValueProps--regional {
    margin-right: 5%
}

.db-RegisterValueProps-textContainer {
    max-width: 255px
}

.db-RegisterValueProps-textContainer--v4 {
    max-width: none
}

.db-RegisterValueProps-textContainer .db-RegisterValueProps-heading {
    --treatmentHeadingFontSize: var(--sail-font-size-16);
    --treatmentHeadingLineHeight: 1.5;
    font-weight: 400;
    font-size: var(--treatmentHeadingFontSize);
    line-height: var(--treatmentHeadingLineHeight);
    position: relative
}

.db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:lang(ja) {
    font-weight: 600
}

.db-RegisterValueProps-textContainer .db-RegisterValueProps-heading:before {
    content: "";
    top: calc(.5px + var(--treatmentHeadingLineHeight)*var(--treatmentHeadingFontSize)/2 - var(--treatmentHeadingFontSize)/2);
    width: 1px;
    height: var(--treatmentHeadingFontSize);
    background-color: var(--keel-blurple);
    display: block;
    position: absolute;
    left: -16px
}

.db-RegisterValueProps-textContainer .db-RegisterValueProps-body {
    font-size: var(--sail-font-size-16);
    line-height: var(--sail-font-lineHeight-24);
    max-width: 448px;
    font-weight: 300
}

.db-RegisterValueProps-topPadding {
    padding-top: 58px
}

.db-RegisterValueProps-topPadding.db-RegisterValueProps-topPadding--start-now {
    padding-top: 50px
}

.db-RegisterValueProps-logo svg {
    fill: var(--sail-color-gray-800)
}

:root {
    scrollbar-gutter: stable
}

.db-RegisterAndLoginLayout {
    background-color: #fff;
    height: 100%;
    min-height: 100%
}

.db-RegisterAndLoginLayout-logo {
    padding-bottom: 40px;
    padding-left: 20px
}

.db-RegisterAndLoginLayout--register.db-RegisterAndLoginLayout--isMobile .db-RegisterAndLoginLayout-logo {
    padding-bottom: 16px
}

.db-RegisterAndLoginLayout--isMobile .db-RegisterAndLoginLayout-logo {
    padding-bottom: 24px
}

.db-RegisterAndLoginLayout-contentWrapper {
    z-index: 0;
    flex-direction: row;
    height: 100%;
    margin: 0 16px;
    display: flex;
    position: relative
}

.db-RegisterAndLoginLayout--isMobile .db-RegisterAndLoginLayout-contentWrapper {
    justify-content: center;
    height: auto;
    padding-top: 28px
}

.db-RegisterAndLoginLayout--register.db-RegisterAndLoginLayout--isMobile .db-RegisterAndLoginLayout-contentWrapper {
    justify-content: center;
    padding-top: 24px
}

.db-RegisterAndLoginLayout--isDesktop .db-RegisterAndLoginLayout-contentWrapper,
.db-RegisterAndLoginLayout--isUltraWide .db-RegisterAndLoginLayout-contentWrapper {
    justify-content: space-between;
    padding-top: 56px
}

.db-RegisterAndLoginLayout--login.db-RegisterAndLoginLayout--isDesktop .db-RegisterAndLoginLayout-contentWrapper,
.db-RegisterAndLoginLayout--login.db-RegisterAndLoginLayout--isUltraWide .db-RegisterAndLoginLayout-contentWrapper {
    justify-content: center
}

.db-RegisterAndLoginLayout--isUltraWide .db-RegisterAndLoginLayout-contentWrapper {
    width: 1080px;
    margin: 0 auto
}

.db-RegisterAndLoginLayout-valuePropWrapper {
    flex-direction: column;
    display: flex
}

.db-RegisterAndLoginLayout-formContainer {
    flex-direction: column;
    width: 540px;
    display: flex
}

.db-RegisterAndLoginLayout--isMobile .db-RegisterAndLoginLayout-formContainer {
    width: 382px
}

.db-RegisterAndLoginLayout--isDesktop .db-RegisterAndLoginLayout-formContainer {
    width: 50%;
    min-width: 50%
}

.db-RegisterAndLoginLayout--isUltraWide .db-RegisterAndLoginLayout-formContainer {
    width: 540px;
    min-width: 540px
}

.db-RegisterAndLoginLayout--isMobile .db-RegisterAndLoginLayout-formPadding,
.db-RegisterAndLoginLayout-formPadding {
    padding: 32px 0
}

.db-RegisterAndLoginLayout--register.db-RegisterAndLoginLayout--isMobile .db-RegisterAndLoginLayout-formPadding {
    padding: 16px 0
}

.db-RegisterAndLoginLayout--isMobile .db-RegisterAndLoginLayout-formPaddingReduced,
.db-RegisterAndLoginLayout-formPaddingReduced {
    padding: 8px 0
}

.db-RegisterAndLoginLayout--isDesktop .db-RegisterAndLoginLayout-formPadding,
.db-RegisterAndLoginLayout--isUltraWide .db-RegisterAndLoginLayout-formPadding {
    padding: 56px 48px
}

.db-RegisterAndLoginLayout--isDesktop .db-RegisterAndLoginLayout-formPaddingReduced,
.db-RegisterAndLoginLayout--isUltraWide .db-RegisterAndLoginLayout-formPaddingReduced {
    padding: 42px 12px 14px
}

.db-RegisterAndLoginLayout.db-RegisterAndLoginLayout--isDesktop .db-RegisterAndLoginLayout-formPadding,
.db-RegisterAndLoginLayout.db-RegisterAndLoginLayout--isUltraWide .db-RegisterAndLoginLayout-formPadding {
    padding: 48px
}

.db-RegisterAndLoginLayout.db-RegisterAndLoginLayout--isDesktop .db-RegisterAndLoginLayout-formPaddingStreamlined,
.db-RegisterAndLoginLayout.db-RegisterAndLoginLayout--isUltraWide .db-RegisterAndLoginLayout-formPaddingStreamlined {
    padding: 48px 28px
}

.db-RegisterAndLoginLayout .db-RegisterAndLoginLayout-formContainerStreamlined {
    justify-content: center;
    padding-bottom: 108px
}

.db-RegisterAndLoginLayout-card {
    border-radius: 12px;
    flex-shrink: 0
}

.db-RegisterAndLoginLayout-formContainer-spacer {
    flex-grow: 1;
    flex-shrink: 1
}

.db-RegisterAndLoginLayout-footer {
    padding-top: 24px;
    padding-bottom: 24px;
    padding-left: 20px;
    position: relative
}

div.db-RegisterAndLoginLayout-formContainer .FormRow.Padding-vertical--16 {
    padding-top: 4px;
    padding-bottom: 0
}

div.db-RegisterAndLoginLayout-formContainer .db-Login-recoverFields--short .FormRow.Padding-vertical--16 {
    padding-top: 4px;
    padding-bottom: var(--sail-spacing-16)
}

div.db-Login-recoverFields-fieldGroupLeader {
    margin: var(--sail-spacing-8)0 0
}

div.db-Login-recoverFields-notification {
    padding: var(--sail-spacing-16)0 var(--sail-spacing-8)
}

div.db-Login-recoverFields--short [data-accordion-container] {
    margin: 0 8px
}

div.db-RegisterAndLoginLayout-formContainer .FormRow.db-RegisterSubmitButton.Padding-vertical--16 {
    padding-top: 0;
    padding-bottom: 16px
}

div.db-RegisterAndLoginLayout-formContainer .db-RegisterConsentCheckbox span.Text-color--gray.Text-lineHeight--20 {
    line-height: 16px
}

div.db-RegisterAndLoginLayout-formContainer .db-RegisterFormField-formError div.Padding-right--8 {
    padding-right: 4px
}

.db-RegisterAndLoginLayout-card-enter-active {
    animation: .6s both RegisterAndLoginLayout-shake
}

.db-RegisterAndLoginLayout--streamlinedLayout.db-RegisterAndLoginLayout--small .db-RegisterAndLoginLayout-formContainer {
    width: 600px
}

.db-RegisterAndLoginLayout--streamlinedLayout.db-RegisterAndLoginLayout--small:not(.db-RegisterAndLoginLayout--isMobile) .db-RegisterAndLoginLayout-formContainer {
    min-width: 600px
}

.db-RegisterAndLoginLayout--streamlinedLayout.db-RegisterAndLoginLayout--large .db-RegisterAndLoginLayout-formContainer {
    width: 760px
}

.db-RegisterAndLoginLayout--streamlinedLayout.db-RegisterAndLoginLayout--large:not(.db-RegisterAndLoginLayout--isMobile) .db-RegisterAndLoginLayout-formContainer {
    min-width: 760px
}

.db-RegisterAndLoginLayout--streamlinedLayout.db-RegisterAndLoginLayout--xlarge .db-RegisterAndLoginLayout-formContainer {
    width: 824px
}

.db-RegisterAndLoginLayout--streamlinedLayout.db-RegisterAndLoginLayout--xlarge:not(.db-RegisterAndLoginLayout--isMobile) .db-RegisterAndLoginLayout-formContainer {
    min-width: 824px
}

.db-SkipToContentButton-button {
    background-color: var(--gray700) !important
}

.db-World-is-admin .db-SkipToContentButton {
    top: calc(var(--Chrome-headerLoginAs-height) + 16px)
}

html.is-ModalLayer--active body {
    margin-right: var(--scrollbar-width, 0px);
    overflow: hidden
}

html {
    transition: filter .5s ease-out
}

html.darkMode {
    filter: invert()hue-rotate(180deg)brightness(1.1)contrast(.85)
}

html.noTransition {
    transition: none !important
}

.db-World-is-internalLinkAccount {
    --sail-color-white: #e3fff2;
    background: #e3fff2
}

html .FullscreenView--isLayer {
    top: var(--sail-layer-margin-top, 0px);
    height: calc(100% - var(--sail-layer-margin-top, 0px) - var(--sail-layer-margin-bottom, 0px))
}

@media only print {

    html.db-NewChrome,
    html.db-NewChrome body {
        height: auto;
        overflow: visible !important
    }

    * {
        transition: none !important
    }

    html.db-NewChrome .Card-shadow--medium {
        box-shadow: none !important;
        border-bottom: 1px solid #00000026 !important;
        border-radius: 0 !important
    }

    .bs-Button,
    .db-is-printEmpty,
    html.db-NewChrome .Button {
        display: none !important
    }

    html.db-NewChrome .DataTable-row {
        border-bottom: 1px solid #0000001a !important
    }

    .db-World-wrapper {
        display: block
    }
}

html.db-NewChrome .bs-ObjectList-row--header,
html.db-NewChrome .DataTableHead-cell {
    background: 0 0
}

html.db-NewChrome .bs-ObjectList-row--header .bs-ObjectList-cell,
html.db-NewChrome .DataTableHead-cell .Text-fontSize--13,
html.db-NewChrome .db-DataGridHeadCell .ListViewItem-text,
html.db-NewChrome .ListViewItem-header .ListViewItem-text {
    font-size: 11px
}

html.db-NewChrome .db-CardlessUIPageWrapper .DataTable-cell:first-child,
html.db-NewChrome .db-CardlessUIPageWrapper .DataTableHead-cell:first-child {
    padding-left: 0
}

html.db-NewChrome .db-CardlessUIPageWrapper .bs-ObjectList-row .bs-ObjectList-cell:first-child,
html.db-NewChrome .db-CardlessUIPageWrapper .DataTableHead-cell:first-child .DataTableHead-cellInner,
html.db-NewChrome .db-CardlessUIPageWrapper .DataTableHead-cell:first-child>.Box-root.Padding-all--8,
html.db-NewChrome .db-CardlessUIPageWrapper .ListViewItem-cell:first-child .ListViewItem-cellContent {
    padding-left: 4px
}

html.db-NewChrome .db-CardlessUIPageWrapper .FormBlock-header.Padding-horizontal--20,
html.db-NewChrome .db-CardlessUIPageWrapper .FormRow.Padding-horizontal--20 {
    padding-left: 4px;
    padding-right: 4px
}

html.db-NewChrome .db-CardlessUIPageWrapper .DataTable-cell:first-child .DataTable-cellInner,
html.db-NewChrome .db-CardlessUIPageWrapper .DataTable-cell:first-child>.Box-root.Margin-all--8 {
    margin-left: 4px
}

html.db-NewChrome .db-CardlessUIPageWrapper .ListViewItem--expandable .ListViewItem-cell:first-child:before {
    left: 4px
}

html.db-NewChrome .db-CardlessUIPageWrapper .DataTable-cell:last-child,
html.db-NewChrome .db-CardlessUIPageWrapper .DataTableHead-cell:last-child {
    padding-right: 0
}

html.db-NewChrome .db-CardlessUIPageWrapper .bs-ObjectList-row .bs-ObjectList-cell:last-child,
html.db-NewChrome .db-CardlessUIPageWrapper .DataTableHead-cell:last-child .DataTableHead-cellInner,
html.db-NewChrome .db-CardlessUIPageWrapper .DataTableHead-cell:last-child>.Box-root.Padding-all--8,
html.db-NewChrome .db-CardlessUIPageWrapper .ListViewItem-cell:last-child .ListViewItem-cellContent {
    padding-right: 4px
}

html.db-NewChrome .db-CardlessUIPageWrapper .DataTable-cell:last-child .DataTable-cellInner,
html.db-NewChrome .db-CardlessUIPageWrapper .DataTable-cell:last-child>.Box-root.Margin-all--8 {
    margin-right: 4px
}

html.db-NewChrome .Card-root>.Notice:last-child {
    box-shadow: none
}

html.db-NewChrome .bs-ContentSection,
html.db-NewChrome .orders-settings-container {
    box-shadow: var(--sail-shadow-keyline)
}

body.more-menu-mobile-workaround {
    overflow-x: auto !important;
    overflow-y: scroll !important
}

.db-ChromeHeader {
    top: var(--sail-layer-margin-top, 0px);
    z-index: var(--Chrome-zIndex--header);
    background: #fff;
    position: fixed;
    left: 0;
    right: 0
}

html.appDock-visible .db-ChromeHeader {
    box-shadow: inset 0 -1px var(--sail-gray100)
}

.db-World-is-admin .db-ChromeHeader {
    top: var(--Chrome-headerLoginAs-height)
}

.db-ChromeHeader-toolbar {
    background: var(--sail-gray50);
    box-shadow: inset 0 -1px var(--sail-gray100);
    overflow: auto
}

.db-ChromeHeader-toolbar-is-internalLinkAccount {
    background: #33ddb3
}

.db-ChromeHeader-sandboxesBannerContent {
    height: var(--Chrome-headerSandboxesBanner-height)
}

.db-ChromeHeader-toolbarContent {
    height: var(--Chrome-headerToolbar-height);
    max-width: var(--Chrome-maxWidth);
    padding-left: var(--Chrome-paddingLeft);
    padding-right: var(--Chrome-paddingRight);
    align-items: center;
    margin: 0 auto;
    display: flex
}

.db-ChromeHeader-toolbar .db-ChromeHeader-accountSwitcher {
    max-width: 250px
}

.db-ChromeHeader-toolbar .db-ChromeHeader-accountStatusButton-inReview,
.db-ChromeHeader-toolbar .db-ChromeHeader-activateButton {
    background-color: var(--sail-orange100);
    color: var(--sail-orange600)
}

.db-ChromeHeader-toolbar .db-ChromeHeader-accountStatusButton-inReview:hover,
.db-ChromeHeader-toolbar .db-ChromeHeader-activateButton:hover {
    background-color: var(--sail-orange500);
    color: var(--sail-color-white)
}

.db-ChromeHeader-toolbar .db-ChromeHeader-accountStatusButton-actionRequired {
    background-color: var(--sail-red100);
    color: var(--sail-red600)
}

.db-ChromeHeader-toolbar .db-ChromeHeader-accountStatusButton-actionRequired:hover {
    background-color: var(--sail-red500);
    color: var(--sail-color-white)
}

.db-ChromeHeader-toolbar .db-ChromeHeader-accountStatusButton-optionalActionRequested {
    background-color: var(--sail-gray100);
    color: var(--sail-gray600)
}

.db-ChromeHeader-toolbar .db-ChromeHeader-accountStatusButton-optionalActionRequested:hover {
    background-color: var(--sail-gray500);
    color: var(--sail-color-white)
}

.db-ChromeHeader-toolbar .db-ChromeHeader-streamlinedDirectOnboarding {
    background-color: var(--sail-purple100);
    color: var(--sail-purple600)
}

.db-ChromeHeader-toolbar .db-ChromeHeader-streamlinedDirectOnboarding:hover {
    background-color: var(--sail-purple600);
    color: var(--sail-color-white)
}

.db-ChromeHeader-toolbar .db-Spotlight-inputContainer {
    margin: 0 16px
}

.db-ChromeHeader-toolbar .db-SuggestionInput-outer {
    height: 24px;
    box-shadow: 0 0 0 1px var(--sail-gray100);
    background: #fff;
    border-radius: 14px;
    font-size: 12px
}

.db-ChromeHeader-toolbar .db-SuggestionInput-backing {
    position: absolute;
    top: 2px;
    bottom: 2px;
    left: 12px;
    right: 12px
}

.db-ChromeHeader-toolbar .db-SuggestionInput-input {
    padding: 4px 32px;
    line-height: 17px
}

.db-ChromeHeader-toolbar .db-NotificationsX-badge {
    box-shadow: 0 0 0 2px var(--sail-gray50)
}

.db-ChromeHeader-toolbar .db-NotificationsX-badge-v0 {
    box-shadow: 0 0 0 1px var(--sail-gray50)
}

.db-ChromeHeader-tabs {
    max-width: var(--Chrome-maxWidth);
    padding-left: var(--Chrome-paddingLeft);
    padding-right: var(--Chrome-paddingRight);
    margin: 0 auto;
    overflow: auto
}

.db-ChromeHeader-tabsContent {
    height: var(--Chrome-headerTabs-height);
    box-shadow: inset 0 -1px var(--sail-gray100);
    align-items: center;
    display: flex
}

.db-ChromeHeader-tabs .db-ChromeHeader-tab {
    color: var(--sail-gray900);
    transition: background .1s
}

.db-ChromeHeader-tabs .db-ChromeHeader-tab:hover {
    background: var(--sail-gray100)
}

.db-ChromeHeader-tabs .db-ChromeHeader-tab--selected,
.db-ChromeHeader-tabs .db-ChromeHeader-tab--selected:hover {
    background: var(--sail-blue500);
    color: var(--sail-color-white);
    transition: none
}

.db-ChromeHeader-tabs .db-ChromeHeader-tab--disabled,
.db-ChromeHeader-tabs .db-ChromeHeader-tab--disabled:hover {
    color: var(--sail-gray300);
    background: 0 0
}

div.db-ChromeHeader-tabs .db-ChromeHeader-tab:hover .ButtonLink-label.Text-color--blue {
    color: var(--sail-blue500)
}

.db-ChromeHeader .db-TestDataBanner-container {
    max-width: var(--Chrome-maxWidth);
    margin: 0 auto;
    top: -1px
}

.db-ChromeHeader .db-TestDataBanner-container .db-TestDataBanner {
    margin-left: var(--Chrome-paddingLeft);
    margin-right: var(--Chrome-paddingRight)
}

html.appDock-visible .db-TestDataBanner-container {
    max-width: unset
}

html.appDock-visible .db-TestDataBanner-container .db-TestDataBanner {
    margin: 0
}

.db-ChromeHeaderMoreMenuContents {
    overflow-y: auto
}

.db-ChromeHeaderMoreMenuContents .db-ChromeHeaderMoreMenuContents-item {
    border-radius: 8px;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin: 4px 0;
    padding: 8px;
    display: flex
}

.db-ChromeHeaderMoreMenuContents .db-ChromeHeaderMoreMenuContents-item:focus,
.db-ChromeHeaderMoreMenuContents .db-ChromeHeaderMoreMenuContents-item:hover {
    background: var(--sail-gray50)
}

.db-ChromeHeaderMoreMenuContents-item:focus:not([data-input-method=mouse]):not([data-input-method=touch]) {
    z-index: 1;
    box-shadow: 0 0 0 4px #3a97d447, 0 0 1px 1px #0759965c
}

.db-ChromeHeaderMoreMenuContents-item:focus .db-ChromeHeaderMoreMenuContents-description,
.db-ChromeHeaderMoreMenuContents-item:hover .db-ChromeHeaderMoreMenuContents-description {
    color: var(--sail-gray800)
}

.db-ChromeHeaderMoreMenuContents-description,
.db-ChromeHeaderMoreMenuContents-item--disabled:focus .db-ChromeHeaderMoreMenuContents-description,
.db-ChromeHeaderMoreMenuContents-item--disabled:hover .db-ChromeHeaderMoreMenuContents-description {
    color: var(--sail-gray500)
}

.db-ChromeHeaderMoreMenuContents-contentContainer {
    max-width: calc(100% - 28px)
}

.db-ChromeHeaderMoreMenuContents-icon {
    visibility: hidden;
    justify-content: center;
    align-items: center;
    width: 28px;
    height: 28px;
    display: flex
}

.db-ChromeHeaderMoreMenuContents-item--iconAlwaysVisible .db-ChromeHeaderMoreMenuContents-icon,
.db-ChromeHeaderMoreMenuContents-item--inactive .db-ChromeHeaderMoreMenuContents-icon,
.db-ChromeHeaderMoreMenuContents-item:focus .db-ChromeHeaderMoreMenuContents-icon,
.db-ChromeHeaderMoreMenuContents-item:hover .db-ChromeHeaderMoreMenuContents-icon {
    visibility: visible
}

.db-ChromeHeaderMoreMenuContents-item--inactive .db-ChromeHeaderMoreMenuContents-icon {
    box-shadow: inset 0 0 0 1px var(--sail-gray100);
    border-radius: 100%
}

.db-ChromeHeaderMoreMenuContents-item--inactive:focus .db-ChromeHeaderMoreMenuContents-icon,
.db-ChromeHeaderMoreMenuContents-item--inactive:hover .db-ChromeHeaderMoreMenuContents-icon {
    box-shadow: none;
    background: var(--sail-blue500);
    color: #fff
}

.db-ChromeHeaderMoreMenuContents .db-ChromeHeaderMoreMenuContents-item--disabled:focus,
.db-ChromeHeaderMoreMenuContents .db-ChromeHeaderMoreMenuContents-item--disabled:hover {
    cursor: default;
    background: 0 0
}

.db-ChromeHeaderMoreMenuContents-item--disabled.db-ChromeHeaderMoreMenuContents-item--inactive .db-ChromeHeaderMoreMenuContents-icon,
.db-ChromeHeaderMoreMenuContents-item--disabled.db-ChromeHeaderMoreMenuContents-item--inactive:focus .db-ChromeHeaderMoreMenuContents-icon,
.db-ChromeHeaderMoreMenuContents-item--disabled.db-ChromeHeaderMoreMenuContents-item--inactive:hover .db-ChromeHeaderMoreMenuContents-icon {
    box-shadow: inset 0 0 0 1px var(--sail-gray100);
    color: var(--sail-gray100);
    background: #fff
}

.db-ChromeHeaderMoreMenuContents-item--disabled:not(.db-ChromeHeaderMoreMenuContents-item--inactive) .db-ChromeHeaderMoreMenuContents-contents,
.db-ChromeHeaderMoreMenuContents-item--disabled:not(.db-ChromeHeaderMoreMenuContents-item--inactive) .db-ChromeHeaderMoreMenuContents-description {
    color: var(--sail-gray300)
}

.db-ChromeHeaderMoreMenuContents-item--disabled:not(.db-ChromeHeaderMoreMenuContents-item--inactive) .db-ChromeHeaderMoreMenuContents-producticon {
    opacity: .3
}

.db-ChromeHeaderMoreMenuContents-item--disabled:not(.db-ChromeHeaderMoreMenuContents-item--inactive) .db-ChromeHeaderMoreMenuContents-icon {
    display: none
}

@media only screen and (max-width:1023px) {
    .db-ChromeHeader {
        position: absolute
    }
}

@media only print {
    .db-ChromeHeader {
        display: none
    }
}

:root {
    --ChromeMainContent--padding-top: 20px;
    --ChromeMainContent-nav--width: 180px;
    --ChromeMainContent-content--minWidth: calc(1000px - var(--ChromeMainContent-nav--width) - var(--Chrome-paddingLeft) - var(--Chrome-paddingRight))
}

.db-ChromeMainContent {
    max-width: var(--Chrome-maxWidth);
    padding-left: var(--Chrome-paddingLeft);
    padding-right: var(--Chrome-paddingRightWithDrawer);
    padding-right: max(var(--Chrome-paddingRight), min(var(--Chrome-paddingRightWithDrawer) + var(--Chrome-maxWidth)/2 - 50vw, var(--Chrome-paddingRightWithDrawer)));
    flex-direction: row-reverse;
    margin: 0 auto;
    transition: padding-right .25s;
    display: flex
}

.db-ChromeMainContent-nav {
    flex: 0 0 var(--ChromeMainContent-nav--width);
    width: var(--ChromeMainContent-nav--width)
}

.db-ChromeMainContent-nav-fixedContainer {
    top: var(--Chrome-header-height);
    padding-top: var(--ChromeMainContent--padding-top);
    width: calc(var(--ChromeMainContent-nav--width) - 20px);
    flex-direction: column;
    display: flex;
    position: fixed;
    bottom: 0;
    overflow-y: auto
}

@media only screen and (max-width:1023px) {
    .db-ChromeMainContent-nav-fixedContainer {
        position: absolute
    }
}

.db-ChromeMainContent-content {
    flex: 1 0 var(--ChromeMainContent-content--minWidth);
    width: var(--ChromeMainContent-content--minWidth);
    padding-top: calc(var(--Chrome-header-height) + var(--ChromeMainContent--padding-top));
    z-index: 1;
    outline: none;
    flex-direction: column;
    min-height: 100vh;
    display: flex
}

@media only print {
    .db-ChromeMainContent {
        padding: 0
    }

    .db-ChromeMainContent-nav {
        display: none
    }

    .db-ChromeMainContent-content {
        padding: 0
    }
}

.db-DocumentTear {
    margin-top: -2px
}

.db-DocumentTear-cover {
    z-index: 2;
    width: 100%;
    height: 4px;
    position: relative
}

.db-DocumentTear-peaks {
    z-index: 1;
    width: 100%;
    position: relative
}

.db-DocumentTear-svg {
    filter: drop-shadow(0 2px 3px #00000012)drop-shadow(0 1px #0000000a)
}

:root {
    --flag-width: 24px;
    --flag-height: calc(var(--flag-width)*.66667);
    --jp-circle-size: calc(var(--flag-height)*.6)
}

.db-Locale--ja-JP .db-FeedbackInput {
    background-image: none;
    width: 330px;
    padding-left: 40px
}

.db-Locale--ja-JP .db-FeedbackForm-cancel {
    margin-right: 6px
}

.db-Locale--ja-JP .db-FeedbackInput-flag--jp {
    width: calc(var(--flag-width) + 2px);
    height: calc(var(--flag-height) + 2px);
    border: .01px solid #8898aa55;
    display: block;
    position: absolute;
    top: 6px;
    left: 15px
}

.db-Locale--ja-JP .db-FeedbackInput-flagInner--jp {
    width: var(--jp-circle-size);
    height: var(--jp-circle-size);
    margin: calc((var(--flag-height) - var(--jp-circle-size))/2)calc((var(--flag-width) - var(--jp-circle-size))/2);
    background-color: #bc002d;
    border-radius: 75%;
    display: block
}

.db-Locale--ja-JP .db-DateRangeInput-input .db-DateInput,
.db-Locale--zh-Hans .db-DateRangeInput-input .db-DateInput {
    width: 12ch;
    min-width: 112px
}

.db-Locale--en-US-x-STAR .db-FeedbackInput {
    width: 232px
}

.db-Locale--en-US-x-WIDE span {
    letter-spacing: 3px !important
}

html.db-Locale--notEnUS div.create-payment-form-view div.form-row {
    clear: both
}

html.db-Locale--notEnUS div.modal-for-create-payment-view.modal {
    width: 600px
}

html.db-Locale--notEnUS div.create-payment-form-view label.default-label {
    text-align: right;
    width: 220px;
    padding-right: 20px
}

html.db-Locale--notEnUS div.currency-amount-field-view.amount label {
    padding-right: 38px
}

html.db-Locale--notEnUS div.create-payment-form-view #card_dummy,
html.db-Locale--notEnUS div.create-payment-form-view .capture label.default-label {
    text-align: left;
    margin-left: 220px
}

html.db-Locale--notEnUS div.modal-dialog-view div.modal-for-add-bank-account-modal-view.modal,
html.db-Locale--notEnUS div.modal-dialog-view div.modal-for-charge-customer-view.modal {
    width: 600px
}

html.db-Locale--notEnUS div.modal-dialog-view div.modal-for-add-bank-account-modal-view.modal form.form div.form-row,
html.db-Locale--notEnUS div.modal-dialog-view div.modal-for-charge-customer-view.modal form.form div.form-row {
    clear: both
}

html.db-Locale--notEnUS div.modal-dialog-view div.modal-for-add-bank-account-modal-view.modal form.form label.default-label,
html.db-Locale--notEnUS div.modal-dialog-view div.modal-for-charge-customer-view.modal form.form label.default-label {
    text-align: right;
    width: 260px;
    padding-right: 20px
}

html.db-Locale--notEnUS div.modal-dialog-view div.modal-for-charge-customer-view.modal div.checkbox-field-view label.default-label {
    padding-left: 0
}

html.db-Locale--notEnUS div.platform-settings-view div.section.details div.try-button-container {
    width: 145px;
    right: 0
}

html.db-Locale--notEnUS div.dispute-evidence-view .header .dispute-formMenu {
    width: 350px
}

.db-Locale--notEnUS .db-Settings .db-Settings-fieldBox {
    width: 520px
}

[data-click-to-component] {
    cursor: context-menu !important;
    outline: var(--click-to-component-outline, -webkit-focus-ring-color auto 2px) !important
}

.db-ManageGraphiQL {
    position: fixed
}

.db-World-is-admin .db-ManageGraphiQL {
    height: calc(100% - var(--Chrome-headerLoginAs-height));
    margin-top: var(--Chrome-headerLoginAs-height)
}

.graphiql-explorer-node {
    margin: 5px 0
}

.graphiql-explorer-node input[type=checkbox] {
    margin-right: 6px
}

.graphiql-container .history-title {
    align-self: start
}

.db-DeveloperFrame-container {
    position: relative
}

.db-DeveloperFrame-container--red {
    border: 12px solid var(--red400)
}

.db-DeveloperFrame-container--green {
    border: 12px solid var(--green400)
}

.db-DeveloperFrame-container--purple {
    border: 12px solid var(--purple400)
}

.db-DeveloperFrame-name {
    pointer-events: none;
    position: absolute;
    right: 0
}

.db-DeveloperFrame-name--red {
    background-color: var(--red400);
    top: -12px
}

.db-DeveloperFrame-name--green {
    background-color: var(--green400);
    top: -12px
}

.db-DeveloperFrame-name--purple {
    background-color: var(--purple400);
    top: -12px
}

html[data-bootstrap=login_app] {
    background-color: #fff
}

.db-Login-root {
    background: #fff
}

.db-Login-root--v3 {
    background: #fff;
    width: 100%;
    min-height: 100vh;
    display: flex;
    overflow: hidden
}

.db-Login-root--v4 {
    background: #fff;
    height: 100vh
}

.db-Login-root--v4 a {
    color: var(--keel-blurple)
}

.db-Login-root--v4 a div>span.db-ExpressLoginLink {
    color: var(--sail-gray900)
}

div>div>span.Text-color--gray {
    color: var(--sail-gray500)
}

.db-Login-fields {
    width: 100%
}

.db-Login-recoverFields {
    margin-left: -20px;
    margin-right: -20px
}

.db-Login-fieldLabel--clickable {
    cursor: pointer
}

.db-Login-forgotConfirmIcon {
    border-radius: 50%
}

.db-Login-shake {
    animation: .6s both Login-shake
}

@keyframes Login-shake {

    0%,
    to {
        transform: translate(0)
    }

    20% {
        transform: translate(-15px)
    }

    40% {
        transform: translate(15px)
    }

    60% {
        transform: translate(-10px)
    }

    80% {
        transform: translate(10px)
    }
}

.db-RegisterAndLoginLayout-formPadding [role=dialog] {
    box-shadow: unset
}

.db-LoginTitle--v4 {
    letter-spacing: -.2px;
    color: var(--sail-gray700);
    font-family: sohne-var, sohne-woff, Helvetica Neue, Arial, sans-serif;
    font-size: 26px;
    font-weight: 500;
    line-height: 36px
}

@media screen and (max-width:880px) {
    .db-RegisterAndLoginLayout--isSignInWithGoogleEnabled .db-LoginTitle--v4 {
        font-size: 20px;
        line-height: normal
    }
}

.db-LoginRegisterLink {
    background-color: #f6f9fc;
    border-radius: 4px;
    height: 60px;
    margin: -12px -16px -28px -15px
}

@media only screen and (min-width:881px) {
    .db-LoginRegisterLink {
        margin: -4px -64px -52px -63px
    }

    .db-RegisterAndLoginLayout .db-LoginRegisterLink {
        margin: -16px -64px -52px -63px
    }

    .db-RegisterAndLoginLayout .db-ResetPasswordRequest-loginRegisterLink {
        margin: -16px -64px -44px -63px
    }
}

.db-LoginRegisterLink a {
    font-weight: 500
}

.db-RegisterAndLoginLayout .db-LoginRegisterLink {
    font-weight: 300
}

.db-RegisterAndLoginLayout .db-LoginRegisterLink a,
.db-EmailPasswordCheckbox label {
    font-weight: 400
}

.db-EmailPasswordInput--buttonLink span {
    color: var(--keel-blurple)
}

.db-EmailPasswordInput--buttonLink span:hover {
    color: var(--sail-color-gray-900)
}

.db-EmailPasswordInput--modeGroup span {
    font-weight: 400
}

.db-EmailPasswordInput--divider {
    padding: 4px 0;
    position: relative
}

.db-EmailPasswordInput--dividerText {
    color: #727f96;
    text-transform: uppercase;
    letter-spacing: -.15px;
    background: var(--sail-color-white);
    padding: 0 10px 3px;
    font-size: 12px;
    font-weight: 300;
    line-height: 1;
    display: inline-flex;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.db-SecurityTips--banner a {
    font-weight: 500
}

.db-RegisterAndLoginLayout .db-SecurityTips--banner span {
    font-weight: 300
}

.db-RegisterAndLoginLayout .db-SecurityTips--banner a {
    font-weight: 400
}

.db-PasswordCreate--simplifiedPasswordInputContainer .db-RegisterPasswordInputWithBarIndicator-contentContainer {
    animation: fill-mode-forwards;
    padding: 0 !important
}

.db-Interrupt {
    background-image: url(/manage-statics-srv/assets/img/logo_big@2x.7f163b99.png);
    background-position: top;
    background-repeat: no-repeat;
    background-size: auto 45px;
    margin-top: 90px;
    padding-top: 90px
}

.db-Interrupt-skip {
    text-align: center
}

.db-PhoneVerification-error {
    color: var(--red);
    text-align: center;
    font-weight: var(--font-weight--regular);
    font-size: var(--font-size--small);
    min-height: 20px
}

.db-PhoneVerification ul {
    margin: 0;
    padding-left: 16px
}

.db-PhoneVerification li {
    list-style: disc
}

.db-PageTopNav {
    padding: 18px 20px 20px
}

.db-PageTopNav--fixed {
    left: 0;
    top: var(--sail-layer-margin-top, 0px);
    z-index: 299;
    width: 100%;
    position: fixed
}

.db-TaskListContainer .db-TaskListTask {
    border-radius: 8px;
    margin-left: -20px;
    margin-right: -20px
}

.db-TaskListTask--canExpand:hover .db-TaskListTask-divider,
.db-TaskListTask:last-of-type .db-TaskListTask-divider {
    box-shadow: none !important
}

@media only screen and (max-width:960px) {
    .db-TasklistContentContainer-end {
        display: none
    }
}

.db-CopyPasteableApiKey {
    cursor: pointer;
    max-width: 430px
}

div.CopyPasteableApiKeyContainer {
    width: auto;
    display: inline;
    overflow: hidden
}

div.CopyPasteableApiKeyContainer>div.Box-root {
    width: auto;
    display: inline
}

.db-RfftPaymentDetailsPromotion--blurred {
    filter: blur(4px);
    -webkit-user-select: none;
    user-select: none
}

.db-Promotion-head {
    position: relative;
    overflow: hidden
}

.db-Promotion-backgroundStripes {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0
}

.db-Promotion-dismiss {
    z-index: 3;
    position: absolute;
    top: 20px;
    right: 20px
}

.db-Promotion-layout {
    z-index: 2;
    position: relative
}

.db-Promotion-side {
    position: relative
}

.db-Promotion-sideSeparator {
    width: 2px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: -16px
}

.db-EmeraldCard {
    width: 350px;
    height: 220px;
    position: relative;
    overflow: hidden;
    border-radius: 10px !important
}

.db-EmeraldCard-rotator {
    position: absolute;
    top: 18px;
    right: 20px
}

.db-EmeraldCard-rotator span {
    -webkit-user-select: none;
    user-select: none
}

.db-EmeraldCard-front-background {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.db-EmeraldCard-front-logo {
    fill: #fff
}

.db-EmeraldCard-front-preview {
    position: absolute;
    top: 0;
    right: 0
}

.db-EmeraldCard-front-preview img {
    width: 100%;
    height: 100%
}

.db-EmeraldCard-front-design {
    position: absolute;
    top: 0;
    right: 0
}

.db-EmeraldCard-front-promo-design {
    position: absolute;
    bottom: 34px;
    right: 34px
}

.db-EmeraldCard-front-design img {
    width: 100%;
    height: 100%
}

.db-EmeraldCard-front-previewSpinner {
    position: absolute;
    bottom: 34px;
    right: 34px
}

.db-EmeraldCard-front-name {
    position: absolute;
    top: 140px;
    bottom: 62px;
    right: 34px
}

.db-EmeraldCard-front-logoPlaceholder {
    border-style: dashed;
    border-width: 1px;
    border-color: var(--sail-gray50);
    background-color: rgba(var(--sail-color-gray-50-rgb), .15);
    border-radius: 4px;
    width: 135px;
    height: 23px;
    position: absolute;
    bottom: 34px;
    right: 34px
}

.db-EmeraldCard-back-background {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.db-EmeraldCard-back-stripe {
    background-color: #4f566b;
    width: 348px;
    height: 30px;
    position: absolute;
    top: 15px;
    left: 1px
}

.db-EmeraldCard-back-expiry {
    position: absolute;
    bottom: 20px;
    left: 20px
}

.db-EmeraldCard-back-number {
    width: 100%;
    position: absolute;
    top: 130px;
    left: 20px
}

.db-EmeraldCard-back-cvc {
    position: absolute;
    bottom: 20px;
    left: 100px
}

.db-EmeraldCard-back-logo {
    width: 100px;
    height: 64px;
    position: absolute;
    bottom: 20px;
    right: 10px
}

.db-EmeraldCard-back-spinner {
    position: absolute;
    bottom: 20px;
    left: 20px
}

.db-AppleWalletIcon {
    background-image: url(img/emerald/apple_wallet.40b4e775.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 40px;
    height: 40px
}

.db-AddToAppleWallet {
    background-image: url(img/emerald/add_to_apple_wallet_en_us.13045755.svg);
    background-size: cover;
    width: 157px;
    height: 49px
}

.db-GooglePayIcon {
    background-image: url(img/emerald/google_pay.2825357f.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 40px;
    height: 40px
}

.db-AddToGooglePay {
    background-image: url(/manage-statics-srv/assets/img/emerald/add_to_google_pay_en_us.a00477e7.png);
    background-size: cover;
    width: 189px;
    height: 49px
}

.db-SplitViewList {
    width: 100%;
    position: relative
}

.db-SplitViewList-row {
    box-shadow: inset 0 -1px 0 0 var(--sail-gray100)
}

.db-SplitViewList-row:not(.db-is-notSelectable) {
    cursor: pointer
}

.db-SplitViewList-row:not(.db-is-notSelectable):hover {
    background-color: var(--sail-gray50)
}

.db-SplitViewList-row.db-is-selected {
    background-color: var(--sail-gray50);
    box-shadow: inset 0 -1px 0 0 var(--sail-gray100), inset 4px 0 0 0 var(--blue400);
    font-weight: 500
}

.db-SplitViewList-cell {
    height: 40px;
    padding-left: 8px;
    padding-right: 8px
}

.db-SplitViewList-cell-mobile {
    height: 40px
}

.db-SplitViewList-cell:first-child {
    padding-left: 20px
}

.db-SplitViewList-cell:last-child {
    padding-right: 20px
}

.db-SplitViewList-header .db-SplitViewList-cell {
    z-index: 1;
    background-color: var(--sail-color-white);
    box-shadow: inset 0 -1px 0 0 var(--sail-gray100);
    position: sticky;
    top: 0
}

.db-InlineList {
    position: relative
}

.db-InlineList-table {
    width: 100%
}

.db-InlineList-cell,
.db-InlineList-cellInner,
.db-InlineList-th,
.db-InlineList-thInner {
    height: 40px
}

.db-InlineList-cellInner,
.db-InlineList-thInner {
    align-items: center;
    display: flex
}

.db-InlineList-cellInner {
    border-top: 1px solid var(--sail-gray100)
}

.db-InlineList-thInner {
    position: relative;
    top: 1px
}

.db-InlineList-row:first-child .db-InlineList-cellInner {
    border-top: none;
    padding-top: 1px
}

.db-InlineList-cell:last-child,
.db-InlineList-th:last-child {
    text-align: right
}

.db-InlineList-cell:last-child .db-InlineList-cellInner,
.db-InlineList-th:last-child .db-InlineList-thInner {
    justify-content: flex-end
}

.db-InlineList-row.db-is-selectable:hover .db-InlineList-cellInner,
.db-InlineList-thInner {
    background: var(--sail-gray50);
    border-top: 1px solid var(--sail-gray100);
    border-bottom: 1px solid var(--sail-gray100);
    padding-top: 1px
}

.db-InlineList-row.db-is-selectable:hover .db-InlineList-cell:first-child .db-InlineList-cellInner,
.db-InlineList-th:first-child .db-InlineList-thInner {
    border-left: 1px solid var(--sail-gray100);
    border-radius: 6px 0 0 6px;
    margin-left: -8px;
    padding-left: 7px
}

.db-InlineList-row.db-is-selectable:hover .db-InlineList-cell:last-child .db-InlineList-cellInner,
.db-InlineList-th:last-child .db-InlineList-thInner {
    border-right: 1px solid var(--sail-gray100);
    border-radius: 0 6px 6px 0;
    margin-right: -8px;
    padding-right: 7px
}

.db-InlineList-row.db-is-selectable:hover .db-InlineList-cellInner {
    cursor: pointer
}

.db-InlineList-row.db-is-selectable:hover+.db-InlineList-row .db-InlineList-cellInner {
    border-top: none;
    padding-top: 1px
}

.db-AnimatedCard {
    width: 350px;
    height: 220px;
    position: relative;
    overflow: hidden;
    border-radius: 10px !important
}

.db-AnimatedCard-flip {
    position: relative;
    border-radius: 10px !important
}

.db-AnimatedCard-rotator {
    position: absolute;
    top: 18px;
    right: 20px
}

.db-AnimatedCard-rotator-flip {
    position: absolute;
    bottom: 22px;
    right: 20px
}

.db-AnimatedCard-rotator span {
    -webkit-user-select: none;
    user-select: none
}

.db-AnimatedCard-front-background {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.db-AnimatedCard-front-logo {
    fill: #fff
}

.db-AnimatedCard-front-preview {
    position: absolute;
    top: 0;
    right: 0
}

.db-AnimatedCard-front-preview img {
    width: 100%;
    height: 100%
}

.db-AnimatedCard-front-design {
    position: absolute;
    top: 0;
    right: 0
}

.db-AnimatedCard-front-promo-design {
    position: absolute;
    bottom: 34px;
    right: 34px
}

.db-AnimatedCard-front-design img {
    width: 100%;
    height: 100%
}

.db-AnimatedCard-front-previewSpinner {
    position: absolute;
    bottom: 34px;
    right: 34px
}

.db-AnimatedCard-front-previewSpinnerFlip {
    position: absolute;
    top: 20px;
    left: 20px
}

.db-AnimatedCard-front-previewSpinnerFlip-whiteV2 {
    top: 32px !important;
    left: 34px !important
}

.db-AnimatedCard-front-name {
    position: absolute;
    top: 140px;
    bottom: 62px;
    right: 34px
}

.db-AnimatedCard-front-name-flip {
    position: absolute;
    bottom: 32px;
    left: 34px
}

.db-AnimatedCard-front-logoPlaceholder {
    border-style: dashed;
    border-width: 1px;
    border-color: var(--sail-gray50);
    background-color: rgba(var(--sail-color-gray-50-rgb), .15);
    border-radius: 4px;
    width: 135px;
    height: 23px;
    position: absolute;
    bottom: 34px;
    right: 34px
}

.db-AnimatedCard-front-logoPlaceholder-flip {
    width: 134px;
    height: 20px;
    position: absolute;
    top: 16px;
    left: 16px
}

.db-AnimatedCard-front-logoPlaceholder-flip-whiteV2 {
    width: 300px !important;
    top: 32px !important;
    left: 34px !important
}

.db-AnimatedCard-back-background {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.db-AnimatedCard-back-stripe {
    background-color: #4f566b;
    width: 348px;
    height: 30px;
    position: absolute;
    top: 15px;
    left: 1px
}

.db-AnimatedCard-back-expiry {
    position: absolute;
    bottom: 20px;
    left: 20px
}

.db-AnimatedCard-back-expiry-flip {
    position: absolute;
    bottom: 70px;
    right: 86px
}

.db-AnimatedCard-back-number {
    width: 100%;
    position: absolute;
    top: 130px;
    left: 20px
}

.db-AnimatedCard-back-number-flip {
    width: 100%;
    position: absolute;
    top: 100px;
    left: 105px
}

.db-AnimatedCard-back-cvc {
    position: absolute;
    bottom: 20px;
    left: 100px
}

.db-AnimatedCard-back-cvc-flip {
    position: absolute;
    bottom: 70px;
    right: 22px
}

.db-AnimatedCard-back-logo {
    width: 100px;
    height: 64px;
    position: absolute;
    bottom: 20px;
    right: 10px
}

.db-AnimatedCard-back-spinner {
    position: absolute;
    bottom: 20px;
    left: 20px
}

.db-AnimatedCard-back-spinner-flip {
    position: absolute;
    top: 100px;
    right: 120px
}

.db-DesignAndSetUpYourCardPageContainer-content .db-StripeGrid-wrapper {
    display: none
}

@media screen and (min-width:1116px) {
    .db-DesignAndSetUpYourCardPageContainer-content .db-StripeGrid-wrapper {
        display: block
    }
}

.db-Flipper-card {
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform 1s;
    position: relative
}

.db-Flipper-card.db-is-flipped {
    transform: rotateY(180deg)
}

.db-Flipper-card.db-is-tilted {
    transition: transform .5s;
    transform: rotateY(-12deg)
}

.db-Flipper-card-face {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 0;
    width: 100%;
    height: 100%;
    position: absolute
}

.db-Flipper-card-face-back {
    transform: rotateY(180deg)
}

.db-StripeGrid-wrapper {
    pointer-events: none;
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    overflow: hidden
}

.db-StripeGrid-stripeContainer {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    transform: skewY(-12deg)
}

.db-StripeGrid-grid {
    grid-template-rows: repeat(auto-fill, 48px);
    grid-template-columns: repeat(12, 1fr);
    display: grid;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.db-SpendingChartPopover {
    min-width: 200px
}

.db-SpendingChartPopover-tableHeader {
    background-color: var(--gray50)
}

.db-SpendingChartPopover-tableCell {
    padding: 4px 8px
}

.db-SpendingChartBackground .db-HorizontalAxisMarks,
.db-SpendingChartBackground .db-VerticalAxisMarks {
    fill: #4e566d;
    text-overflow: ellipsis;
    white-space: nowrap;
    dominant-baseline: hanging;
    color: #4e566d;
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Ubuntu, sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: normal;
    overflow: hidden
}

.db-StackedBarChartWrapper-stateWrapper {
    justify-content: center;
    align-items: center;
    display: flex
}

.db-StackedBarChartWrapper-chartHeader {
    align-items: flex-end;
    width: 100%
}

.db-StackedBarChartWrapper-emptyStateWrapper {
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    height: 45px;
    margin-top: 3rem;
    display: flex
}

.db-SpendingStackedBarChart {
    position: absolute
}

.db-SpendingStackedBarChart-dataTable {
    width: 100%;
    position: absolute
}

.db-SpendingChartDataTable-categoryCell span {
    cursor: default;
    flex-direction: row;
    align-items: center;
    display: flex
}

.db-SpendingChartDataTable-categoryText {
    margin-left: .5rem
}

.db-FormContent {
    padding: 0 !important
}

.db-AccountIcon {
    border-radius: 2px
}

.db-BalanceRow {
    position: relative
}

.db-BalanceRow:before {
    content: "";
    background-color: var(--sail-color-gray-100);
    height: 1px;
    transition: opacity .1s ease-in;
    position: absolute;
    top: 0;
    left: 68px;
    right: 20px
}

.db-BalanceRow:first-child:before,
.db-BalanceRow--interactive:hover:before,
.db-BalanceRow--interactive:hover+.db-BalanceRow:before {
    opacity: 0
}

.db-BalanceRow-interactiveChild {
    transition: all .1s ease-in
}

.db-BalanceRow-interactiveChild:hover {
    background-color: var(--sail-color-background-offset)
}

.db-RecentTransactionsTable-TableRow {
    border-bottom: 1px solid var(--sail-color-gray-100);
    cursor: pointer;
    padding-top: 2px;
    padding-bottom: 2px
}

.db-RecentTransactionsTable-TableRow:hover {
    background-color: var(--sail-color-background-offset)
}

.db-TransactionCategoryIcon--badge-outer {
    border-radius: 100px;
    justify-content: center;
    align-items: center;
    width: 16px;
    height: 16px;
    margin-bottom: -.4em;
    margin-left: -.3em;
    display: flex
}

.db-TransactionCategoryIcon--outer {
    flex-direction: row;
    align-items: flex-end;
    display: flex
}

@media (max-width:1000px) {
    .db-TransactionCategoryIcon--outer {
        display: none
    }
}

.db-TransferSpeedSection-speedDetails {
    margin-left: -12px
}

.db-TransferSpeedSection-speedDetails li {
    color: var(--sail-gray500)
}

.db-AccountSelector-toggleBoxItem>div>div>label>div>div {
    align-items: center;
    min-width: 0
}

.db-AccountSelector-toggleBoxItem>div>div>label>div>div>div:last-of-type {
    min-width: 0
}

.db-AccountSelector-toggleBoxItem>div>div>label>div>div>div:first-of-type {
    position: relative;
    top: -2px
}

.db-AccountSelector-toggleBoxItem.db-AccountSelector-toggleBoxItem {
    margin-bottom: 12px;
    padding-bottom: 0
}

.db-AccountSelector .db-ConsumerUIFormRow {
    padding-top: 0;
    padding-bottom: 0
}

.db-AccountSelector .db-ConsumerUIFormRow>div {
    width: 100%
}

.db-BankConnectionFormWrapperExpansion-bankAccountForm {
    padding: 20px 21px 4px
}

.db-BankConnectionFormWrapperExpansion-bankAccountForm .db-ConsumerUIFormBlock {
    margin-left: 3px;
    margin-right: 3px
}

.db-BankConnectionFormWrapperExpansion-bankAccountForm .db-ConsumerUIFormLayout>div:not(.db-ConsumerUIFormBlock) {
    word-break: break-word;
    margin: 16px 1px 0
}

.db-BankConnectionFormWrapperExpansion-nextIcon.db-BankConnectionFormWrapperExpansion-nextIcon {
    display: inline
}

.db-DisconnectBank-container {
    max-height: 448px;
    overflow-y: scroll
}

.db-BankIcon.db-BankIcon {
    border-radius: 4px
}

.db-ProductSetting-icon--disabled {
    opacity: .3
}

.db-SearchMenuFooter {
    cursor: initial
}

.db-SearchMenuFooter-listItem {
    flex-direction: row;
    align-items: center;
    padding: 10px 16px;
    display: flex
}

.db-SearchMenuFooter-listItem:first-of-type {
    padding-top: 4px
}

.db-SearchMenuFooter-listItem>div {
    flex-shrink: 0
}

.db-SearchableInput-icon {
    cursor: pointer;
    position: relative;
    top: 3px
}

.db-EmbeddedBankPicker-featuredBanksContainer.db-u-isInvisible {
    visibility: hidden
}

.db-SearchResultItem {
    padding: 10px 16px
}

.db-SearchableInput-menu>div>div {
    flex-direction: column;
    display: flex
}

.db-SearchableInput-menu ul {
    flex-grow: 1
}

.db-BankLogo {
    width: 100%;
    height: 100%
}

.db-BankTile>div {
    padding: 12px
}

@media (max-width:420px) {
    .db-BankTile>div {
        padding: 8px
    }
}

.db-AuthFlowCustomizationView strong {
    color: var(--sail-gray700)
}

.db-AuthFlowCustomizationView-previewContainer {
    margin-bottom: 1px;
    overflow: auto
}

.db-AuthFlowCustomizationView-helpTooltip {
    display: inline-block
}

.db-AutomaticPaymentMethodPermissionsSettingsSection-permissionsSettingsGrid strong {
    color: var(--sail-gray700)
}

.db-AutomaticPaymentMethodPermissionsSettingsSection-permissionsSettingsGrid {
    padding-top: 32px
}

.db-FinancingOfferAmountSlider {
    height: 20px;
    position: relative
}

.db-FinancingOfferAmountSlider-thumb--parent,
.db-FinancingOfferAmountSlider-thumb {
    z-index: 2;
    position: absolute
}

.db-FinancingOfferAmountSlider-input {
    opacity: 0;
    z-index: 3;
    border: 0;
    width: calc(100% + 20px);
    height: 20px;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 1px;
    left: -10px;
    right: -10px
}

.db-FinancingOfferAmountSlider-input:focus {
    outline: none
}

.db-FinancingOfferAmountSlider-track-active {
    z-index: 1;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    height: 8px;
    position: relative;
    top: 7px
}

.db-FinancingOfferAmountSlider-track-inactive {
    z-index: 0;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    height: 8px;
    position: relative;
    top: 7px
}

.db-FinancingOfferAmountSlider-thumb {
    top: -7px;
    left: -11px
}

.db-FinancingOfferAmountSlider-input {
    -webkit-appearance: none
}

.db-FinancingOfferAmountSlider-input::-ms-thumb {
    cursor: pointer;
    border: 0;
    border-radius: 0;
    width: 20px;
    height: 20px
}

.db-FinancingOfferAmountSlider-input::-ms-tooltip {
    display: none
}

.db-FinancingOfferAmountSlider-input::-moz-range-thumb {
    cursor: pointer;
    border: 0;
    border-radius: 0;
    width: 20px;
    height: 20px
}

.db-FinancingOfferAmountSlider-input::-webkit-slider-thumb {
    -webkit-appearance: none;
    cursor: pointer;
    border: 0;
    border-radius: 0;
    width: 20px;
    height: 20px
}

.db-LinkersGroup--expandButton {
    box-shadow: none !important;
    background-color: #0000 !important
}

.db-CapitalForPlatformsPlaygroundFullScreenView {
    width: 100%;
    position: fixed;
    top: 0;
    bottom: 0;
    overflow-x: hidden;
    overflow-y: auto
}

.CapitalForPlatformsPlaygroundContentPage .db-FakeChromeWrapper::-webkit-scrollbar {
    display: none
}

.CapitalForPlatformsPlaygroundContentPage .db-ConsumerUIWrapper-left {
    flex: 0 0 400px
}

.CapitalForPlatformsPlaygroundEmailOfferNotifsPage .db-FakeChromeWrapper-content::-webkit-scrollbar {
    display: none
}

.CapitalForPlatformsPlaygroundEmailOfferNotifsPage .db-FakeChromeWrapper-content {
    scrollbar-width: 0px;
    overflow-y: auto
}

.CapitalForPlatformsPlaygroundContentPage .db-ConsumerUIWrapper-left--sidebarCopy {
    font-size: 24px
}

.CapitalForPlatformsPlaygroundContentPage .db-ConsumerUIWrapper-right {
    width: 420px;
    padding: 0 80px
}

.CapitalForPlatformsPlaygroundContentPage .db-ConsumerUIWrapper-right::-webkit-scrollbar {
    display: none
}

.CapitalForPlatformsPlaygroundContentPage .db-ConsumerUIWrapper-right--inner {
    margin-top: 25px;
    padding-bottom: 30px;
    position: static
}

.CapitalForPlatformsPlaygroundLoanSummary .db-ConsumerUIContentFooter {
    padding-bottom: 12px
}

.CapitalForPlatformsPlaygroundContentPage .db-FakeChromeWrapper-url {
    font-size: 12px
}

.CapitalForPlatformsPlaygroundContentPage .db-FakeChromeWrapper-titleBar {
    height: 32px
}

.CapitalForPlatformsPlaygroundContentPage .db-FakeChromeWrapper-urlBar {
    height: 20px
}

.CapitalForPlatformsPlaygroundContentPage .db-FakeChromeWrapper-urlBarContent {
    margin-top: 4px
}

.db-ViewImageDialog {
    width: auto !important;
    max-width: -webkit-fit-content !important;
    max-width: -moz-fit-content !important;
    max-width: fit-content !important
}

.db-ViewImageDialog-Content {
    justify-content: center;
    align-items: center;
    min-height: 18vh;
    display: flex
}

.db-IdentityVerificationImage {
    object-fit: contain;
    max-width: 90vw;
    max-height: 62vh
}

.db-GelatoIframeContainer {
    padding: 20px;
    position: relative
}

.db-ConsumerUIFormLayout .db-GelatoIframeContainer,
.db-HostedVerificationView-dialog .db-GelatoIframeContainer,
.db-IdentityChallengeiFrameContainer .db-GelatoIframeContainer,
.db-RecoveryIdentityVerification .db-GelatoIframeContainer {
    padding: 0
}

.db-GelatoIframe {
    width: 100%;
    position: relative
}

.db-GelatoIframe--hidden {
    visibility: hidden;
    max-height: 0
}

.db-BrandingPreviewSizeControls-segmentedControl {
    align-items: center;
    display: flex
}

.db-BrandingPreviewSizeControls-segmentedControl svg {
    color: var(--sail-color-gray-400)
}

.db-BrandingPreviewSizeControls-segmentedControl .db-SegmentedControlOption--selected svg {
    color: var(--sail-color-blue-400)
}

.db-BrandingPreviewSizeControls-segmentedControl--disabled {
    background-color: var(--sail-color-gray-100)
}

.db-BrandingPreviewSizeControls-segmentedControl--disabled .db-SegmentedControlOption--selected svg,
.db-BrandingPreviewSizeControls-segmentedControl--disabled svg {
    color: var(--sail-color-gray-200)
}

.db-ElementsPreviewWrapper iframe {
    position: static
}

.db-PricePointBox {
    min-width: 150px
}

.db-PricePointBox-link {
    width: 100%
}

@keyframes ClimateBadge-reveal {
    to {
        background-position: -1800px 0
    }
}

@keyframes ClimateBadge-loop {
    0% {
        background-position: 0 -24px
    }

    25% {
        background-position: -3600px -24px
    }

    to {
        background-position: -3600px -24px
    }
}

.db-ClimateBadge strong {
    font-weight: 700
}

.db-ClimateBadge .db-ClimateBadge-icon {
    background-position: 0 0;
    background-size: 3624px 48px;
    width: 24px;
    height: 24px;
    padding-left: 24px
}

.db-ClimateBadge-icon.db-is-reveal {
    background-position: 0 0;
    animation-name: ClimateBadge-reveal;
    animation-duration: 2.5s;
    animation-timing-function: steps(75, end);
    animation-fill-mode: forwards
}

.db-ClimateBadge-icon.db-is-loop {
    background-position: 0 -24px;
    animation-name: ClimateBadge-loop;
    animation-duration: 10s;
    animation-timing-function: steps(150, end);
    animation-iteration-count: infinite
}

.db-ClimateBadgeDemo {
    width: 100%;
    min-width: 450px;
    max-width: 600px;
    min-height: 495px;
    position: relative
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-checkout {
    border-radius: 48px;
    position: relative
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-checkoutAmount,
.db-ClimateBadgeDemo .db-ClimateBadgeDemo-checkoutBadge,
.db-ClimateBadgeDemo .db-ClimateBadgeDemo-checkoutPayButtonLabel,
.db-ClimateBadgeDemo .db-ClimateBadgeDemo-checkoutProductName,
.db-ClimateBadgeDemo .db-ClimateBadgeDemo-checkoutTitle,
.db-ClimateBadgeDemo .db-ClimateBadgeDemo-invoiceAmount,
.db-ClimateBadgeDemo .db-ClimateBadgeDemo-invoiceBadge,
.db-ClimateBadgeDemo .db-ClimateBadgeDemo-invoicePayButtonLabel,
.db-ClimateBadgeDemo .db-ClimateBadgeDemo-invoiceTitle,
.db-ClimateBadgeDemo .db-ClimateBadgeDemo-receiptBadge,
.db-ClimateBadgeDemo .db-ClimateBadgeDemo-receiptTitle {
    z-index: 1;
    position: absolute
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-checkoutBadge {
    height: 100px;
    top: 700px;
    left: 20px;
    right: 20px
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-checkoutTitle {
    top: 46px;
    left: 75px
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-checkoutProductName {
    width: 100%;
    top: 125px
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-checkoutAmount {
    width: 100%;
    top: 150px
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-checkoutPayButtonLabel {
    width: 100%;
    top: 660px
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-invoiceBadge {
    height: 100px;
    top: 744px;
    left: 96px;
    right: 96px
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-invoiceTitle {
    top: 57px;
    left: 90px
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-invoiceAmount {
    top: 136px;
    left: 90px
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-invoicePayButtonLabel {
    width: 100%;
    top: 699px
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-receiptBadge {
    height: 100px;
    top: 384px;
    left: 56px;
    right: 56px
}

.db-ClimateBadgeDemo .db-ClimateBadgeDemo-receiptTitle {
    width: 100%;
    top: 134px
}

.db-ClimateDemoPhone {
    width: 250px;
    position: relative
}

.db-ClimateDemoPhone-phoneCard {
    box-shadow: var(--sail-shadow-extraLarge);
    border-radius: 6px;
    overflow: hidden
}

.db-ClimateDemoPhone-priceText {
    width: 100%;
    position: absolute;
    bottom: 375px;
    left: 0
}

.db-ClimateDemoPhone-payText {
    width: 100%;
    position: absolute;
    bottom: 86px;
    left: 0
}

.db-ClimateDemoPhone .db-ClimateBadge {
    width: 269px;
    height: 72px;
    margin-bottom: 8px;
    position: absolute;
    bottom: 0;
    left: -10px;
    transform: scale(.75)
}

.db-ClimateDemoPhone-smallContainer {
    align-items: flex-end;
    height: 195px;
    display: flex;
    position: relative;
    overflow: hidden
}

.db-ClimateDemoPhone-smallContainerOverlay {
    background: linear-gradient(#f7fafc 0%, #f7fafc00 100%);
    width: 100%;
    height: 95px;
    position: absolute;
    top: 0
}

.db-ClimateAutogenPreview-previewDemo {
    width: 700px;
    line-height: 0;
    position: relative
}

.db-ClimateAutogenPreview-previewDemoImage {
    width: 100%
}

.db-ClimateAutogenPreview-previewDemoText {
    font-size: 36px;
    font-weight: 700;
    line-height: 40px;
    position: absolute;
    top: 35%;
    left: 8%;
    right: 20%
}

.db-ClimateAutogenPreview-previewDemoLogo {
    max-height: 8%;
    position: absolute;
    top: 17%;
    left: 8%
}

.db-ClimateSocialCard {
    position: relative
}

.db-ClimateSocialCard-previewContainer {
    border-radius: 8px;
    width: 504px;
    height: 285px;
    position: absolute;
    top: 124px;
    left: 89px;
    overflow: hidden
}

.db-ClimateSocialCard-backgroundStripe {
    height: 100%;
    margin-top: 120px;
    transform: skewY(-12deg)
}

.db-ClimateSocialCard-previewDemo {
    position: absolute;
    top: 27px;
    left: 77px
}

.db-ClimateSocialCard-previewDemoScale {
    zoom: .5
}

.db-ClimateAutogenSuccess-preview {
    position: relative
}

.db-ClimateAutogenSuccess-previewCard {
    border-radius: 8px;
    width: 700px;
    max-width: 100vw
}

.db-ClimateAutogenSuccess-socialCard {
    position: absolute;
    top: 310px;
    left: max(0px, min(400px, 100vw - 400px))
}

.db-ClimateAutogenSuccess-socialCardZoom {
    zoom: .6
}

.db-ClimateContributionsSection-content {
    flex-direction: row;
    display: flex
}

.db-ClimateContributionsSection-amount-container {
    margin-right: 48px
}

.db-ClimateContributionsSection-amount-text {
    flex-direction: column;
    gap: 4px;
    display: flex
}

.db-ClimateContributionsSection-amount-total {
    font-size: 28px
}

@media (max-width:875px) {
    .db-ClimateContributionsSection-content {
        flex-direction: column
    }

    .db-ClimateContributionsSection-impact {
        display: none
    }

    .db-ClimateContributionsSection-amount-container {
        margin-right: unset
    }

    .db-ClimateContributionsSection-amount-text {
        align-items: center;
        margin-bottom: 32px
    }

    .db-ClimateContributionsSection-amount-total {
        font-size: 42px;
        line-height: 36px
    }
}

.db-ClimateSettingsPage .db-SettingsContent {
    position: relative
}

.db-ClimateSettingsPage .db-DeferredOverlay {
    opacity: .5;
    background: #fff;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0
}

.db-ClimateSettingsPage .db-DeferredBannerWrapper {
    margin-bottom: 24px
}

.db-ClimateSettingsPage .db-ClimateSettingsPage-disabled {
    -webkit-user-select: none;
    user-select: none
}

@media (max-width:875px) {
    .db-ClimateSettingsPage .db-ContentHeader>div {
        flex-direction: column;
        gap: 12px
    }

    .db-ClimateSettingsPage .db-ContentHeader>div>div:last-child {
        margin: 0
    }
}

.db-MarketingSection-ContentSection-content {
    flex-direction: row;
    gap: 18px;
    padding-top: 24px;
    display: flex
}

.db-MarketingSection-hideOnDesktop {
    display: none
}

@media (max-width:875px) {
    .db-MarketingSection-ContentSection-header {
        flex-direction: column;
        gap: 12px
    }

    .db-MarketingSection-ContentSection-header .db-MarketingSection-ContentSection-rightHeader {
        justify-content: flex-start
    }

    .db-MarketingSection-ContentSection-content {
        flex-direction: column
    }

    .db-MarketingSection-hideOnDesktop {
        display: unset
    }

    .db-MarketingSection-hideOnMobile {
        display: none !important
    }
}

.db-ClimateActivationModal {
    position: relative
}

.db-ClimateActivateModal-content {
    padding-right: 302px
}

.db-ClimateActivationModal .db-ClimateDemoPhone-smallContainer {
    width: 250px;
    height: auto;
    overflow: initial;
    z-index: 1;
    position: absolute;
    top: -32px;
    bottom: 0;
    right: 28px
}

.db-ClimateActivationModal .db-ClimateDemoPhone-phoneCard {
    z-index: 1;
    border-radius: 36px;
    width: 240px;
    height: 483px;
    position: absolute;
    bottom: 0;
    left: 5px
}

.db-ClimateActivationModal .db-ClimateDemoPhone-phoneSvg {
    z-index: 2;
    position: absolute;
    bottom: 0
}

.db-ClimateActivationModal .db-ClimateActivationModal-priceText {
    z-index: 3
}

.db-ClimateActivationModal .db-ClimateDemoPhone-payText {
    z-index: 3;
    bottom: 79px
}

.db-ClimateActivationModal .db-ClimateDemoPhone .db-ClimateBadge {
    z-index: 3
}

.db-CSVImportModal-button svg {
    transform: rotate(180deg)
}

#SplitDate-form .FormBlock>div {
    padding-top: 0 !important
}

.db-OnboardingWizardWrapper {
    flex-grow: 1;
    justify-content: flex-start;
    padding-left: 48px;
    padding-right: 48px
}

.db-OnboardingWizardWrapper-leftNavOuter {
    flex-direction: column;
    flex-basis: 200px;
    justify-content: space-between;
    max-height: calc(100vh - 90px);
    display: flex
}

.db-OnboardingWizardWrapper-leftNavInner {
    position: sticky;
    top: 32px
}

@media (max-width:768px) {
    .db-OnboardingWizardWrapper {
        justify-content: center;
        padding-left: 20px;
        padding-right: 20px
    }

    .db-OnboardingWizardWrapper-leftNavOuter {
        display: none
    }
}

@media (max-width:1070px) and (min-width:1028px) {
    .db-OnboardingWizardWrapper-leftNavOuter {
        flex-basis: 170px
    }
}

@media (max-width:1112px) and (min-width:1070px) {
    .db-OnboardingWizardWrapper-leftNavOuter {
        flex-basis: 180px
    }
}

@media (max-width:1280px) and (min-width:1112px) {
    .db-OnboardingWizardWrapper-leftNavOuter {
        flex-basis: 190px
    }
}

.db-OnboardingWizardRightPanel {
    background-color: var(--sail-color-gray-50);
    overflow: auto
}

.db-OnboardingWizardRightPanel-highlightTriangles {
    margin-top: auto
}

.db-OnboardingWizardRightPanel-dummyLeftBox {
    flex-basis: 200px
}

.db-OnboardingWizardRightPanel-messages {
    max-width: 296px;
    padding-top: 48px
}

@media (max-width:768px) {
    .db-OnboardingWizardRightPanel-content {
        justify-content: center
    }

    .db-OnboardingWizardRightPanel-dummyLeftBox {
        display: none
    }
}

@media (max-width:1028px) and (min-width:768px) {
    .db-OnboardingWizardRightPanel-content {
        padding-left: 48px;
        padding-right: 48px
    }

    .db-OnboardingWizardRightPanel-highlightTriangles {
        align-self: end
    }
}

@media (min-width:1028px) {
    .db-OnboardingWizardRightPanel-content {
        align-self: flex-start;
        padding-left: 24px;
        padding-right: 24px
    }

    .db-OnboardingWizardRightPanel-messages {
        padding-top: 0
    }

    .db-OnboardingWizardRightPanel-dummyLeftBox {
        display: none
    }

    .db-OnboardingWizardRightPanel {
        width: 300px;
        height: 100vh;
        margin-top: 0;
        padding-top: 136px;
        position: absolute;
        top: 0;
        right: 0
    }

    html.loginAsHeader-visible .db-OnboardingWizardRightPanel {
        height: calc(100vh - var(--Chrome-headerLoginAs-height))
    }
}

@media (max-width:1112px) and (min-width:1070px) {
    .db-OnboardingWizardRightPanel-content {
        padding-left: 28px;
        padding-right: 28px
    }

    .db-OnboardingWizardRightPanel {
        width: 330px
    }
}

@media (min-width:1112px) {
    .db-OnboardingWizardRightPanel-content {
        padding-left: 32px;
        padding-right: 32px
    }

    .db-OnboardingWizardRightPanel {
        width: auto;
        min-width: 360px
    }
}

@media (min-width:1280px) {
    .db-OnboardingWizardRightPanel {
        height: 100vh;
        padding-top: 136px;
        position: absolute;
        top: 0;
        left: 920px;
        right: 0
    }

    html.loginAsHeader-visible .db-OnboardingWizardRightPanel {
        height: calc(100vh - var(--Chrome-headerLoginAs-height))
    }
}

.db-ReportTable .db-DataTableHead-cell,
html.db-NewChrome .ReportTable .DataTableHead-cell {
    background-color: var(--sail-color-gray-50)
}

html.db-NewChrome table.ReportTable,
table.ReportTable {
    min-width: 820px
}

.db-ReportTable .db-ReportRowExpandable .db-ReportTable,
html.db-NewChrome .ReportTable .ReportRowExpandable .ReportTable {
    min-width: 780px;
    max-width: 780px
}

.db-ReportTable .db-ReportRowExpandable>.db-DataTable-cell>.db-DataTable-cellInner,
html.db-NewChrome .ReportTable .ReportRowExpandable-cellInner>.DataTable-cell>.DataTable-cellInner {
    min-height: 0;
    margin: 0
}

.db-ReportTable .db-ReportTableRowChild,
html.db-NewChrome .ReportTable .ReportTableRowChild .DataTable-cellInner {
    padding-left: 16px
}

.db-LocationDetailPageV1-overlay {
    z-index: 2;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.db-SalesAndUseTaxPreview {
    z-index: 1;
    width: 820px
}

.db-ReportWrapper-overlay {
    z-index: 2;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.db-CreateShippingRateForm-amountInputContainer {
    position: relative
}

.db-CreateShippingRateForm-freeLabel {
    z-index: 10;
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%)
}

.db-CreateShippingRateForm-customRateCallout {
    padding-top: 0 !important
}

.db-ShippingRatePreview-tear {
    margin-top: -2px
}

.db-ShippingRatePreview-tearCover {
    z-index: 2;
    width: 100%;
    height: 4px;
    position: relative
}

.db-ShippingRatePreview-tearPeaks {
    z-index: 1;
    width: 100%;
    position: relative
}

.db-ShippingRatePreview-tearSvg {
    filter: drop-shadow(0 2px 3px #00000012)drop-shadow(0 1px #0000000a)
}

.db-BillingCodeSnippetCard-codeSnippet {
    overflow-y: auto
}

.db-BillingCodeSnippetCard-codeSnippet .db-CodeSnippet-codePre {
    overflow-x: auto
}

.db-FakeChromeWrapper {
    background-color: #fcfeff;
    border-radius: 8px;
    margin-top: 40px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 24px #32325d1a, 0 -1px 20px #32325d0a, 0 2px 4px #00000014
}

.db-FakeChromeWrapper-titleBar {
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 20px;
    display: flex
}

.db-FakeChromeWrapper-circle {
    background-color: #ecf2f7;
    border-radius: 50%;
    width: 6px;
    height: 6px;
    margin-right: 4px;
    display: inline-block
}

.db-FakeChromeWrapper-controls {
    display: flex;
    position: absolute;
    left: 12px
}

.db-FakeChromeWrapper-urlBar {
    background: #ecf2f766;
    border-radius: 6px;
    width: 60%;
    height: 12px
}

.db-FakeChromeWrapper-urlBarContent {
    align-items: center;
    height: 11px;
    display: flex
}

.db-FakeChromeWrapper-urlBarUrl {
    justify-content: center;
    align-items: center;
    height: 11px;
    display: flex
}

.db-FakeChromeWrapper-customDomainsUpsell {
    background: #ced4d966;
    border-radius: 6px;
    justify-content: center;
    align-items: center;
    height: 11px;
    display: flex
}

.db-FakeChromeWrapper-url {
    color: #0a2540;
    margin-left: 3px;
    font-size: 7px;
    font-weight: 600
}

.db-MultiLineItemsSelectionRow {
    margin-top: 10px
}

.db-MultiLineItemsSelectionRow:first-of-type {
    margin-top: 0
}

.db-MultiLineItemsSelectionRow-removeButton {
    z-index: 10;
    margin-bottom: -23px;
    margin-right: -7px;
    position: relative
}

.db-MultiLineItemsSelectionRow-outerCard {
    border: 1px solid var(--sail-gray100);
    border-radius: 4px;
    margin: 0;
    padding: 16px;
    display: flex
}

.db-MultiLineItemsSelectionRow-outerCardInvalid {
    border: 2px solid var(--sail-red400);
    border-radius: 4px;
    margin: -1px;
    padding: 16px;
    display: flex
}

.db-MultiLineItemsSelectionRow-outerGroup {
    width: 100%
}

.db-MultiLineItemsSelectionRow-customAmountRow {
    width: calc(100% - var(--sail-spacing-48));
    margin-top: 2px;
    overflow: hidden
}

.db-MultiLineItemsSelectionRow-taxBadge span {
    white-space: normal
}

.db-MultiLineItemsSelectionRow-overflowMenu {
    width: 24px;
    height: 24px
}

.db-ScrollView-wrapper {
    height: 300px;
    padding-top: 1px;
    padding-bottom: 10px;
    padding-right: 25px;
    position: relative;
    overflow: scroll
}

.db-BuyButtonCodeSnippet .CodeMirror {
    height: unset !important
}

.db-BuyButtonCodeSnippet .CodeMirror,
.db-BuyButtonCodeSnippet .CodeMirror-gutters {
    background: var(--sail-color-gray-50) !important
}

.db-BuyButtonCodeSnippet .CodeMirror-linenumber {
    padding-left: 0;
    padding-right: 0;
    width: 24px !important
}

.db-BuyButtonCodeSnippet .CodeMirror .cm-tag {
    color: #c84801
}

.db-PricingTableCodeSnippet .CodeMirror {
    height: 100%;
    font-size: 16px
}

.db-PricingTableCodeSnippet .CodeMirror,
.db-PricingTableCodeSnippet .CodeMirror-gutters {
    background: var(--sail-color-gray-50) !important
}

.db-PricingTableCodeSnippet .CodeMirror-linenumber {
    padding-left: 0;
    padding-right: 0;
    width: 24px !important
}

.db-PricingTableCodeSnippet .CodeMirror .cm-tag {
    color: #c84801
}

.db-PricingTableCodeSnippet .deactivated .CodeMirror-line * {
    color: #a3acb9
}

.db-ProductListView-formattedPrice:not(:last-child):after {
    content: ", "
}

.db-GroupedPricesByProductCheckoutOptions-tabContainer {
    overflow-x: auto;
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), #0000);
    mask-image: linear-gradient(90deg, #000 calc(100% - 28px), #0000)
}

.db-GroupedPricesByProductCheckoutOptions-tabContainer>div {
    padding-right: 8px
}

.db-GroupedPricesByProductCheckoutOptions-contentTab {
    flex-shrink: 0
}

.db-TaxBehaviorField-select .db-TaxBehaviorField-option {
    text-overflow: ellipsis;
    overflow: hidden
}

.db-TaxBehaviorField-select .db-TaxBehaviorField-option .db-TaxBehaviorField-text {
    white-space: nowrap
}

.db-ObfuscatedCodeBox--radius--all {
    border-radius: var(--sail-radius)
}

.db-GiftCardsTimeline-bullet {
    width: 16px;
    height: 100%;
    position: relative
}

.db-GiftCardsTimeline-preCircle {
    z-index: 1;
    width: 1px;
    position: absolute;
    top: -75%;
    bottom: 95%;
    left: 8.5px
}

.db-GiftCardsTimeline-postCircle {
    z-index: 2;
    width: 1px;
    position: absolute;
    top: 12px;
    bottom: 35%;
    left: 8.5px
}

.db-GiftCardsTimeline-icon {
    z-index: 4;
    margin-top: -10px;
    margin-left: 3px;
    position: absolute;
    top: 12px
}

.db-CreateButton {
    box-shadow: inset 0 0 0 1px var(--sail-blue500);
    color: var(--sail-blue500)
}

.db-CreateButton:hover {
    background: var(--sail-blue500);
    color: var(--sail-color-white)
}

.db-UABMenu {
    padding-top: 8px;
    padding-bottom: 8px
}

.db-UABMenuItem:hover span {
    color: var(--grey800)
}

.db-UABMenuItem-inner-wrapper {
    flex-grow: 1;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    min-width: 160px;
    display: flex
}

.db-UABMenuItem-shortcut-container {
    margin-left: 16px;
    margin-right: 4px;
    display: flex
}

.db-UABMenuItem-shortcut {
    background: #f2f4f7;
    border-radius: 2px;
    justify-content: center;
    align-items: center;
    width: 16px;
    height: 16px;
    margin-right: 2px;
    display: flex
}

.db-UABMenuItem-key-style {
    color: #697386;
    display: inline
}

.db-UAB-Shortcut-key {
    background-color: #f2f4f740;
    border-radius: 2px;
    justify-content: center;
    align-items: center;
    width: 16px;
    height: 16px;
    margin-right: 2px;
    display: inline-flex
}

.db-UAB-Shortcut-key-left {
    margin-left: 2px
}

.db-PromotionalBanner {
    margin-right: 6.825px
}

.db-PromotionalBanner>span {
    background-color: var(--blue500);
    border-radius: 4px;
    padding: 6px 8px;
    display: inline-block
}

.db-PromotionalBanner:after {
    content: "";
    background-color: var(--blue500);
    border-top-right-radius: 1px;
    width: 5.65px;
    height: 5.65px;
    position: absolute;
    top: 10px;
    right: 4px;
    transform: rotate(45deg)
}

.db-SubscriptionPreferencesPage-text--light {
    color: #fffc !important
}

.db-SubscriptionPreferencesPage-text--dark {
    color: #000000b3 !important
}

.db-SubscriptionPreferencesPage-link--light {
    color: #fffc
}

.db-SubscriptionPreferencesPage-link--light:hover {
    color: #fff
}

.db-SubscriptionPreferencesPage-link--dark {
    color: #000000b3
}

.db-SubscriptionPreferencesPage-link--dark:hover {
    color: #000000e6
}

.db-SubscriptionPreferencesPage-rule--light {
    background-color: #ffffff80
}

.db-SubscriptionPreferencesPage-rule--dark {
    background-color: #0003
}

.db-bentoViewport-loadingContainer {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.db-bentoViewport-appViewContainer {
    height: inherit;
    flex: 1;
    display: flex
}

.db-InsightTemplate {
    background-color: var(--gray50);
    border: 1px solid var(--gray100);
    border-radius: 8px;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    height: 100%;
    display: flex;
    overflow: hidden
}

.db-InsightTemplate-header {
    justify-content: center;
    align-items: center;
    display: flex
}

.db-InsightTemplateTextSection {
    width: 100%;
    padding: 16px
}

.db-InsightTemplate .db-InsightTemplateCTA:hover span {
    color: var(--grey900)
}

.db-InsightTemplateCTA:hover svg {
    fill: var(--grey900)
}

.db-InsightTemplateImageContainer {
    justify-content: center;
    width: 100%;
    height: auto;
    display: flex
}

.db-InsightTemplateImage {
    aspect-ratio: 3/2;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: contain;
    flex-grow: 1;
    max-width: 368px;
    height: 100%;
    max-height: 130px
}

.db-InsightTemplateImageContainer>svg {
    max-width: 368px
}

.db-InsightTemplateImageContainer.db-InsightsNewImage {
    width: calc(100% + 50px);
    margin: 0 -25px
}

.db-InsightsNewImage .db-InsightTemplateImage {
    max-width: 418px
}

.db-InsightTemplateStripe {
    background-color: var(--sail-color-white);
    transform-origin: 100% 0;
    width: 100%;
    height: 100%;
    min-height: 75px;
    transform: skewY(-12deg)
}

.db-InsightsStripeNew {
    width: calc(100% + 50px);
    margin-left: -25px
}

.db-InsightModule-container {
    position: relative
}

.db-InsightModule-closeButton:focus,
.db-InsightModule-closeButton:hover {
    background-color: var(--sail-color-background-canvas)
}

.db-layouts-edit-mode .db-chrome-background:before,
.db-layouts-edit-mode .db-ChromeHeader,
.db-layouts-edit-mode .db-ChromeHeaderBackground:before,
.db-layouts-edit-mode body {
    background-color: #f6f8fa !important
}

.db-layouts-edit-mode .db-primary-nav-background-image {
    background-image: none !important
}

.db-chrome-background:before,
.db-ChromeHeaderBackground:before {
    background-color: #fff
}

.db-layouts-edit-mode body {
    min-width: -webkit-fit-content;
    min-width: -moz-fit-content;
    min-width: fit-content;
    min-height: 100vh
}

.db-dashboardHomeModularZeroContainer svg[class*=Icon--barGraph] {
    width: 20px;
    height: 20px
}

.db-chrome-fill {
    --flex-y: initial;
    --flex-x: initial;
    width: 100%;
    height: 100%
}

.db-CobrandTab {
    bottom: 0;
    left: var(--Chrome-paddingLeft);
    z-index: 1;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    height: 32px;
    margin-left: -16px;
    padding-left: 16px;
    padding-right: 16px;
    display: flex;
    position: fixed
}

.db-Choice {
    height: inherit;
    transition: box-shadow .15s;
    box-shadow: 0 0 0 1px var(--sail-gray100) !important;
    border-radius: 8px !important
}

.db-Choice:hover {
    box-shadow: 0 0 0 2px var(--sail-gray400) !important
}

.db-Choice.db-Choice--selected,
.db-Choice.db-Choice--selected:hover {
    box-shadow: 0 0 0 2px var(--sail-blue400) !important
}

.db-Choice .db-Choice-text {
    color: var(--sail-gray900);
    transition: color .15s
}

.db-Choice.db-Choice--selected .db-Choice-text {
    color: var(--sail-blue500)
}

.db-FancyArrow-path-1 {
    transition: transform .15s cubic-bezier(.215, .61, .355, 1);
    transform: translate(0)
}

a:hover .db-FancyArrow-path-1,
button:hover .db-FancyArrow-path-1 {
    transform: translate(3px)
}

.db-FancyArrow-path-2 {
    opacity: 0;
    transition: opacity .1s cubic-bezier(.215, .61, .355, 1), transform .15s cubic-bezier(.215, .61, .355, 1);
    transform: scaleX(0)
}

a:hover .db-FancyArrow-path-2,
button:hover .db-FancyArrow-path-2 {
    opacity: 1;
    transform: scaleX(1)
}

.db-TailorAppDock {
    z-index: 1;
    box-shadow: inset 1px 0 var(--sail-gray100);
    background: #fff;
    flex-direction: column;
    justify-content: center;
    display: flex
}

@media print {
    .db-TailorAppDock {
        display: none
    }
}

.db-TailorAppDock-item {
    justify-content: center;
    display: flex;
    position: relative
}

.db-TailorAppDock-item--active {
    background: var(--sail-gray100)
}

.db-TailorAppDock-item--disabled {
    opacity: .6
}

.db-TailorAppDock-item:before {
    content: "";
    border: 1px solid var(--sail-blue500);
    pointer-events: none;
    opacity: 0;
    border-radius: 7px;
    transition: opacity .1s ease-in-out;
    position: absolute;
    top: 7px;
    bottom: 7px;
    left: 5px;
    right: 5px
}

.db-TailorAppDock-item--isNew:after {
    content: "";
    pointer-events: none;
    background: var(--dock-color-info200);
    border: 2px solid #fff;
    border-radius: 50%;
    width: 8px;
    height: 8px;
    position: absolute;
    top: 4px;
    right: 4px
}

.db-TailorAppDock-controlIcon,
.db-TailorAppDock-imgIcon,
.db-TailorAppDock-marketplaceIcon,
.db-TailorAppDock-textIcon {
    width: 24px;
    height: 24px;
    box-shadow: 0 0 0 1px var(--dock-hue-gray150);
    border-radius: 4px;
    justify-content: center;
    align-items: center;
    display: flex
}

.db-TailorAppDock-icon--large {
    border-radius: 7px;
    width: 40px;
    height: 40px;
    font-size: 27px
}

.db-TailorAppDock-icon--extra-small {
    border: 1px solid var(--sail-gray100);
    border-radius: 4px;
    width: 18px;
    height: 18px;
    font-size: 13px
}

.db-TailorAppDock-controlIcon {
    background: var(--sail-gray50);
    color: var(--sail-gray600)
}

.db-TailorAppDock-imgIcon {
    background: #fff
}

.db-DrawerAppIndicator .db-TailorAppDock-imgIcon {
    background: initial;
    box-shadow: none
}

.db-TailorAppDock-marketplaceIcon {
    background: var(--sail-gray50);
    color: var(--sail-blue500)
}

div.db-TailorAppDock-marketplaceIcon .Icon svg {
    fill: currentColor !important
}

.db-TailorAppDock-textIcon {
    background: var(--sail-gray600);
    color: #fff
}

.db-TailorAppDock-newBadge {
    color: var(--dock-color-info800);
    background: var(--dock-color-info200);
    border-radius: 4px;
    margin-right: 4px;
    padding: 1px 6px;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    display: inline-block
}

.db-TailorAppDrawer {
    flex-direction: column;
    flex: 1;
    height: 100%;
    display: flex;
    position: relative
}

.db-tailorAppViewContainer {
    position: relative;
    overflow: auto
}

.db-DrawerAppIndicator+.db-tailorAppViewContainer>:first-child,
.db-DrawerAppIndicator+.db-TailorViewport>:first-child {
    padding-top: 16px
}

.db-TailorViewport {
    height: inherit;
    flex: 1;
    display: flex;
    position: relative;
    overflow: auto
}

.db-tailorAppViewContainer.db-TailorViewport-hidden,
.db-TailorViewport.db-TailorViewport-hidden {
    display: none
}

.db-PreviewModeNotice {
    min-height: var(--Chrome-headerToolbar-height);
    background: var(--sail-yellow50);
    color: var(--sail-yellow500);
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    padding: 0 16px;
    font-size: 12px;
    font-weight: 500;
    display: flex
}

.db-apps-account-switcher {
    width: 364px;
    max-width: 100%;
    margin-left: 0
}

.db-apps-account-switcher.db-AccountSwitcher--searchable {
    margin-top: 0
}

@keyframes bounce-in {
    0% {
        opacity: 0;
        transform: scale(0)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

.db-AppPermissionsList .db-with-bottom-border {
    border-bottom: 1px solid rgb(var(--sail-color-gray-150-rgb, 213 219 225))
}

.db-AppPermissionsList li,
.db-AppPermissionsList li span {
    color: var(--sail-gray500)
}

.db-AppPermissionsList span[role=separator] {
    width: 100% !important
}

.db-AppPermissionsList a {
    color: var(--sail-gray500);
    text-decoration-line: underline;
    text-decoration-thickness: initial;
    text-decoration-style: dashed;
    -webkit-text-decoration-color: var(--sail-gray500);
    -webkit-text-decoration-color: var(--sail-gray500);
    text-decoration-color: var(--sail-gray500);
    text-underline-offset: 1.5px;
    font-weight: 400
}

.db-AppPermissionsList a:hover {
    color: var(--sail-gray500);
    text-decoration: underline;
    -webkit-text-decoration-color: var(--sail-color-blue-500);
    -webkit-text-decoration-color: var(--sail-color-blue-500);
    text-decoration-color: var(--sail-color-blue-500);
    text-decoration-style: solid
}

.db-AppPermissionsList.db-minified [role=button] {
    gap: var(--row-gap)8px !important;
    padding: 6px 2px !important
}

.db-AppPermissionsList.db-minified a div>div {
    font-weight: 500 !important
}

.db-AppPermissionsList.db-minified [data-accordion-trigger=true] svg {
    width: 10px;
    height: 10px
}

.db-AppPermissionsList [data-accordion-trigger=true] path {
    fill: var(--sail-color-text-gray)
}

.db-AppListingPublishPage {
    display: block
}

.db-MarketplaceFakeChromeWrapper-scaleWrapper {
    transform-origin: 0 0;
    width: 950px;
    height: 151%;
    overflow-y: scroll;
    scale: .65
}

.db-MarketplaceFakeChromeWrapper {
    background-color: #fcfeff;
    border-radius: 8px;
    width: 618px;
    height: calc(100% - 76px);
    transition: all .25s ease-in-out;
    position: relative;
    overflow: hidden;
    box-shadow: 0 20px 44px #32325d1f, 0 -1px 32px #32325d0f, 0 3px 12px #00000014
}

.db-MarketplaceFakeChromeWrapper-titleBar {
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 20px;
    display: flex
}

.db-MarketplaceFakeChromeWrapper-circle {
    background-color: #ecf2f7;
    border-radius: 50%;
    width: 6px;
    height: 6px;
    margin-right: 4px;
    display: inline-block
}

.db-MarketplaceFakeChromeWrapper-controls {
    display: flex;
    position: absolute;
    left: 12px
}

.db-MarketplaceFakeChromeWrapper-urlBar {
    background: #ecf2f766;
    border-radius: 6px;
    width: 60%;
    height: 12px
}

.db-MarketplaceFakeChromeWrapper-urlBarContent {
    justify-content: center;
    align-items: center;
    height: 11px;
    display: flex
}

.db-MarketplaceFakeChromeWrapper-content {
    width: 618px;
    height: 100%
}

.db-MarketplaceFakeChromeWrapper-url {
    color: #0a2540;
    margin-left: 3px;
    font-size: 7px;
    font-weight: 600
}

.db-PaymentGuidanceOverview--Column {
    height: 100%;
    margin-right: 40px
}

.db-PaymentGuidanceOverview--Guide--BrandElementsInvoices,
.db-PaymentGuidanceOverview--Guide--BrandElementsManualPayments,
.db-PaymentGuidanceOverview--Guide--BrandElementsPaymentLinks,
.db-PaymentGuidanceOverview--Guide--ElementsInegrationLevels,
.db-PaymentGuidanceOverview--Guide--MobileCheckoutPreview,
.db-PaymentGuidanceOverview--Guide--PrimaryView,
.db-PaymentGuidanceOverview--Guide--TerminalActions {
    transition: all .2s ease-in-out
}

.db-PaymentGuidanceOverview--Guide:hover .db-PaymentGuidanceOverview--Guide--PrimaryView {
    transform: translateY(-6px)
}

.db-PaymentGuidanceOverview--Guide:hover .db-PaymentGuidanceOverview--Guide--MobileCheckoutPreview {
    transform: translateY(-10px)
}

.db-PaymentGuidanceOverview--Guide:hover .db-PaymentGuidanceOverview--Guide--BrandElementsInvoices,
.db-PaymentGuidanceOverview--Guide:hover .db-PaymentGuidanceOverview--Guide--BrandElementsManualPayments,
.db-PaymentGuidanceOverview--Guide:hover .db-PaymentGuidanceOverview--Guide--BrandElementsPaymentLinks,
.db-PaymentGuidanceOverview--Guide:hover .db-PaymentGuidanceOverview--Guide--ElementsInegrationLevels,
.db-PaymentGuidanceOverview--Guide:hover .db-PaymentGuidanceOverview--Guide--TerminalActions {
    transform: translateY(-14px)
}

@media only screen and (max-width:1300px) {
    .db-PaymentGuidanceOverview--Column {
        margin-right: 8px
    }
}

.db-RevenueReporting-subchartContainer {
    width: 50%
}

.db-RevenueReporting-subchartPlaceholder {
    height: 200px
}

.db-RevenueReporting-aovChart {
    flex-grow: 1
}

.db-RevenueReporting-shareOfWalletTable {
    height: 200px
}

.db-RevenueReporting-shareOfWalletTable-row {
    border-top: 1px solid var(--sail-color-line-divider)
}

.db-RevenueReporting-shareOfWalletTable-row--selected {
    font-weight: 700
}

.db-RevenueReporting-shareOfWalletTable-row:first-of-type {
    border-top: none
}

.db-RevenueReporting-shareOfWalletTable-titleCell {
    white-space: nowrap
}

.db-RevenueReporting-shareOfWalletTable-barCell {
    width: 100%;
    padding: 8px
}

.db-RevenueReporting-shareOfWalletTable-bar {
    background-color: var(--sail-color-gray-300);
    float: right;
    height: 16px
}

.db-RevenueReporting-shareOfWalletTable-row--selected .db-RevenueReporting-shareOfWalletTable-bar {
    background-color: var(--sail-color-purple-600)
}

.db-RevenueReporting-shareOfWalletTable-valueCell {
    text-align: right
}

.db-RevenueReporting-dataVizContainer {
    position: relative
}

.db-RevenueReporting-noData {
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    display: flex;
    position: absolute;
    top: 0
}

.db-RevenueReporting-sowChartGrid {
    align-items: center;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 10%
}

.db-DATAuthCode {
    animation: .3s ease-in-out shake
}

@keyframes shake {

    0%,
    to {
        transform: translate(0)
    }

    20%,
    60% {
        transform: translate(-10px)
    }

    40%,
    80% {
        transform: translate(10px)
    }
}

.db-CookieBanner {
    z-index: 999;
    min-height: 56px
}

.db-CookieBanner-VerticalSpacer {
    min-height: 56px
}

.db-CookieBanner--fixed {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0
}

.db-CookieBanner--fixed.db-CookieBanner--corner {
    border-radius: 4px;
    bottom: 16px;
    left: auto;
    right: 16px
}

.db-CookieBanner-CookiePolicyLink {
    color: var(--sail-color-blue-400)
}

.db-CookieBanner-CookiePolicyLink.db-CookieBanner-CookiePolicyLink.db-CookieBanner-CookiePolicyLink:active *,
.db-CookieBanner-CookiePolicyLink.db-CookieBanner-CookiePolicyLink.db-CookieBanner-CookiePolicyLink:hover * {
    color: var(--sail-color-blue-500)
}

.db-CookieBanner-CloseLink {
    color: var(--sail-color-gray-400)
}

.db-CookieBanner-CloseLink.db-CookieBanner-CloseLink.db-CookieBanner-CloseLink:active *,
.db-CookieBanner-CloseLink.db-CookieBanner-CloseLink.db-CookieBanner-CloseLink:hover * {
    color: var(--sail-color-gray-500);
    fill: var(--sail-color-gray-500)
}

.db-CookieBanner-enter {
    opacity: 0;
    transform: translateY(100px)
}

.db-CookieBanner-enter-active {
    opacity: 1;
    transition: all .5s;
    transform: translateY(0)
}

.db-CookieBanner-enter-done,
.db-CookieBanner-exit {
    opacity: 1;
    transform: translateY(0)
}

.db-CookieBanner-exit-active {
    opacity: 0;
    transition: all .5s;
    transform: translateY(100px)
}

.db-CookieBanner-exit-done {
    opacity: 0;
    transform: translateY(100px)
}

.db-CreateImportSetDrawer-CreationDrawer form {
    margin: 0 -20px -20px
}

.db-FileUploadWrapper-droparea {
    border: 1px dashed var(--sail-color-gray-200);
    background: #f6f8fa;
    border-radius: 10px;
    padding: 24px
}

.db-UdapNoticeListApiNotices>.db-UdapBanner+.db-UdapBanner {
    margin-top: 12px
}

.db-CsvSettings-field {
    padding: 0 !important
}

.db-CsvSettings-field>div:first-child,
.db-CsvSettings-field>div:nth-child(2) {
    flex-basis: 50% !important
}

.db-CreateMappingDrawer-CreationDrawer>div:last-child>div:last-child>div {
    padding: 0 !important;
    overflow: hidden !important
}

.db-CreateMappingDrawer-CreationDrawer>div:last-child>div:first-child {
    width: 400px !important
}

.db-CreateMappingDrawer-CreationDrawer>div:last-child>div:first-child>div:first-child>div:first-child {
    padding: 16px !important
}

.db-searchableTransformationValueButtonLabel:hover {
    --keyline: #d5dbe1 !important;
    --box-shadow: #40445214 0px 2px 5px 0px, #40445214 0px 3px 9px 0px !important
}

.db-searchableTransformationValueButtonWithFieldLabel {
    --box-shadow: none !important;
    --keyline: none !important
}

.db-CustomTransformation span[data-path] {
    padding-top: 4px;
    padding-bottom: 4px
}

.db-CustomTransformation span+span {
    padding-left: 4px
}

.db-CustomTransformation {
    flex-wrap: wrap;
    align-items: start;
    row-gap: 8px;
    display: flex
}

.db-CustomTransformation [data-token=searchableInput] input {
    padding: 2px 6px !important
}

.db-MappedDataPreview-ToggleItem>div,
.db-MappedDataPreview-Togglewrapper>fieldset>div>div {
    flex: 50%
}

.db-MappedDataPreview-ToggleItem>div>div>div>div {
    padding: 0 !important
}

.db-NameAndSampleFileStepPreview-Accordian span[role=separator] {
    visibility: hidden
}

.db-AppleAppStorePrivateKeyDropzoneField-droparea,
.db-AwsS3RegionField-selectfield {
    z-index: 0 !important
}

div[data-bento-id=list-page-section-connector_list_page]>div .bento_table_header_cell {
    padding-left: 0
}

.db-hcaptcha-iframe-container {
    text-align: center;
    padding: 8px
}

.db-hcaptcha-iframe-container iframe {
    position: static
}

.db-GoogleStagePresentation--DialogContent {
    justify-content: center;
    align-items: center;
    padding: 20px;
    display: flex
}

.db-GoogleStagePresentation--DialogContent iframe {
    display: none
}

.db-SignInWithGoogleButton-container {
    width: 100%
}

.db-SignInWithGoogleButton-container iframe {
    display: none
}

html {
    font-synthesis-weight: none;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    font-family: sans-serif
}

body {
    margin: 0
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block
}

audio,
canvas,
progress,
video {
    vertical-align: baseline;
    display: inline-block
}

audio:not([controls]) {
    height: 0;
    display: none
}

a {
    background-color: #0000
}

a:active,
a:hover {
    outline: 0
}

abbr[title] {
    border-bottom: 1px dotted
}

dfn {
    font-style: italic
}

mark {
    color: #000;
    background: #ff0
}

small {
    font-size: 80%
}

sub,
sup {
    vertical-align: baseline;
    font-size: 75%;
    line-height: 0;
    position: relative
}

sup {
    top: -.5em
}

sub {
    bottom: -.25em
}

img {
    border: 0
}

svg:not(:root) {
    overflow: hidden
}

hr {
    box-sizing: content-box;
    height: 0
}

pre {
    overflow: auto
}

code,
kbd,
pre,
samp {
    font-family: monospace;
    font-size: 1em
}

button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

button,
select {
    text-transform: none
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer
}

button[disabled],
html input[disabled] {
    cursor: default
}

button::-moz-focus-inner {
    border: 0;
    padding: 0
}

input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input {
    line-height: normal
}

input[type=checkbox],
input[type=radio] {
    box-sizing: border-box;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button {
    height: auto
}

input[type=number]::-webkit-outer-spin-button {
    height: auto
}

input[type=search] {
    -webkit-appearance: textfield;
    box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button {
    -webkit-appearance: none
}

input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

fieldset {
    border: 1px solid silver;
    margin: 0 2px;
    padding: .35em .625em .75em
}

legend {
    border: 0;
    padding: 0
}

textarea {
    overflow: auto
}

optgroup {
    font-weight: 700
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

td,
th {
    padding: 0
}

:root {
    --sail-color-black-rgb: 0, 0, 0;
    --sail-color-white-rgb: 255, 255, 255;
    --sail-color-gray-50-rgb: 247, 250, 252;
    --sail-color-gray-100-rgb: 227, 232, 238;
    --sail-color-gray-200-rgb: 193, 201, 210;
    --sail-color-gray-300-rgb: 163, 172, 185;
    --sail-color-gray-400-rgb: 135, 146, 162;
    --sail-color-gray-500-rgb: 105, 115, 134;
    --sail-color-gray-600-rgb: 79, 86, 107;
    --sail-color-gray-700-rgb: 60, 66, 87;
    --sail-color-gray-800-rgb: 42, 47, 69;
    --sail-color-gray-900-rgb: 26, 31, 54;
    --sail-color-blue-50-rgb: 245, 251, 255;
    --sail-color-blue-100-rgb: 214, 236, 255;
    --sail-color-blue-200-rgb: 164, 205, 254;
    --sail-color-blue-300-rgb: 125, 171, 248;
    --sail-color-blue-400-rgb: 108, 142, 239;
    --sail-color-blue-500-rgb: 84, 105, 212;
    --sail-color-blue-600-rgb: 61, 78, 172;
    --sail-color-blue-700-rgb: 47, 61, 137;
    --sail-color-blue-800-rgb: 33, 45, 99;
    --sail-color-blue-900-rgb: 19, 31, 65;
    --sail-color-cyan-50-rgb: 237, 253, 253;
    --sail-color-cyan-100-rgb: 196, 241, 249;
    --sail-color-cyan-200-rgb: 127, 211, 237;
    --sail-color-cyan-300-rgb: 77, 183, 232;
    --sail-color-cyan-400-rgb: 58, 151, 212;
    --sail-color-cyan-500-rgb: 6, 122, 184;
    --sail-color-cyan-600-rgb: 7, 89, 150;
    --sail-color-cyan-700-rgb: 6, 69, 122;
    --sail-color-cyan-800-rgb: 9, 51, 83;
    --sail-color-cyan-900-rgb: 4, 34, 53;
    --sail-color-green-50-rgb: 239, 255, 237;
    --sail-color-green-100-rgb: 203, 244, 201;
    --sail-color-green-200-rgb: 133, 217, 150;
    --sail-color-green-300-rgb: 51, 194, 127;
    --sail-color-green-400-rgb: 30, 166, 114;
    --sail-color-green-500-rgb: 9, 130, 93;
    --sail-color-green-600-rgb: 14, 98, 69;
    --sail-color-green-700-rgb: 13, 75, 59;
    --sail-color-green-800-rgb: 11, 55, 51;
    --sail-color-green-900-rgb: 8, 36, 41;
    --sail-color-yellow-50-rgb: 252, 249, 233;
    --sail-color-yellow-100-rgb: 248, 229, 185;
    --sail-color-yellow-200-rgb: 239, 192, 120;
    --sail-color-yellow-300-rgb: 229, 153, 62;
    --sail-color-yellow-400-rgb: 217, 121, 23;
    --sail-color-yellow-500-rgb: 187, 85, 4;
    --sail-color-yellow-600-rgb: 152, 55, 5;
    --sail-color-yellow-700-rgb: 118, 43, 11;
    --sail-color-yellow-800-rgb: 87, 31, 13;
    --sail-color-yellow-900-rgb: 58, 22, 7;
    --sail-color-orange-50-rgb: 255, 250, 238;
    --sail-color-orange-100-rgb: 254, 227, 192;
    --sail-color-orange-200-rgb: 248, 184, 134;
    --sail-color-orange-300-rgb: 245, 146, 94;
    --sail-color-orange-400-rgb: 229, 111, 74;
    --sail-color-orange-500-rgb: 196, 76, 52;
    --sail-color-orange-600-rgb: 158, 47, 40;
    --sail-color-orange-700-rgb: 126, 30, 35;
    --sail-color-orange-800-rgb: 93, 22, 27;
    --sail-color-orange-900-rgb: 66, 14, 17;
    --sail-color-red-50-rgb: 255, 248, 245;
    --sail-color-red-100-rgb: 253, 226, 221;
    --sail-color-red-200-rgb: 251, 181, 178;
    --sail-color-red-300-rgb: 250, 131, 137;
    --sail-color-red-400-rgb: 237, 95, 116;
    --sail-color-red-500-rgb: 205, 61, 100;
    --sail-color-red-600-rgb: 164, 28, 78;
    --sail-color-red-700-rgb: 128, 20, 63;
    --sail-color-red-800-rgb: 94, 16, 57;
    --sail-color-red-900-rgb: 66, 8, 40;
    --sail-color-purple-50-rgb: 255, 248, 254;
    --sail-color-purple-100-rgb: 252, 224, 246;
    --sail-color-purple-200-rgb: 240, 180, 228;
    --sail-color-purple-300-rgb: 226, 141, 220;
    --sail-color-purple-400-rgb: 201, 110, 208;
    --sail-color-purple-500-rgb: 164, 80, 181;
    --sail-color-purple-600-rgb: 123, 57, 151;
    --sail-color-purple-700-rgb: 91, 43, 128;
    --sail-color-purple-800-rgb: 64, 29, 106;
    --sail-color-purple-900-rgb: 45, 15, 85;
    --sail-color-violet-50-rgb: 248, 249, 254;
    --sail-color-violet-100-rgb: 230, 230, 252;
    --sail-color-violet-200-rgb: 199, 194, 234;
    --sail-color-violet-300-rgb: 176, 161, 225;
    --sail-color-violet-400-rgb: 156, 130, 219;
    --sail-color-violet-500-rgb: 130, 96, 195;
    --sail-color-violet-600-rgb: 97, 70, 155;
    --sail-color-violet-700-rgb: 75, 52, 128;
    --sail-color-violet-800-rgb: 53, 36, 101;
    --sail-color-violet-900-rgb: 31, 24, 78;
    --sail-color-black: rgb(var(--sail-color-black-rgb));
    --sail-color-white: rgb(var(--sail-color-white-rgb));
    --sail-color-gray-50: rgb(var(--sail-color-gray-50-rgb));
    --sail-color-gray-100: rgb(var(--sail-color-gray-100-rgb));
    --sail-color-gray-200: rgb(var(--sail-color-gray-200-rgb));
    --sail-color-gray-300: rgb(var(--sail-color-gray-300-rgb));
    --sail-color-gray-400: rgb(var(--sail-color-gray-400-rgb));
    --sail-color-gray-500: rgb(var(--sail-color-gray-500-rgb));
    --sail-color-gray-600: rgb(var(--sail-color-gray-600-rgb));
    --sail-color-gray-700: rgb(var(--sail-color-gray-700-rgb));
    --sail-color-gray-800: rgb(var(--sail-color-gray-800-rgb));
    --sail-color-gray-900: rgb(var(--sail-color-gray-900-rgb));
    --sail-color-blue-50: rgb(var(--sail-color-blue-50-rgb));
    --sail-color-blue-100: rgb(var(--sail-color-blue-100-rgb));
    --sail-color-blue-200: rgb(var(--sail-color-blue-200-rgb));
    --sail-color-blue-300: rgb(var(--sail-color-blue-300-rgb));
    --sail-color-blue-400: rgb(var(--sail-color-blue-400-rgb));
    --sail-color-blue-500: rgb(var(--sail-color-blue-500-rgb));
    --sail-color-blue-600: rgb(var(--sail-color-blue-600-rgb));
    --sail-color-blue-700: rgb(var(--sail-color-blue-700-rgb));
    --sail-color-blue-800: rgb(var(--sail-color-blue-800-rgb));
    --sail-color-blue-900: rgb(var(--sail-color-blue-900-rgb));
    --sail-color-cyan-50: rgb(var(--sail-color-cyan-50-rgb));
    --sail-color-cyan-100: rgb(var(--sail-color-cyan-100-rgb));
    --sail-color-cyan-200: rgb(var(--sail-color-cyan-200-rgb));
    --sail-color-cyan-300: rgb(var(--sail-color-cyan-300-rgb));
    --sail-color-cyan-400: rgb(var(--sail-color-cyan-400-rgb));
    --sail-color-cyan-500: rgb(var(--sail-color-cyan-500-rgb));
    --sail-color-cyan-600: rgb(var(--sail-color-cyan-600-rgb));
    --sail-color-cyan-700: rgb(var(--sail-color-cyan-700-rgb));
    --sail-color-cyan-800: rgb(var(--sail-color-cyan-800-rgb));
    --sail-color-cyan-900: rgb(var(--sail-color-cyan-900-rgb));
    --sail-color-green-50: rgb(var(--sail-color-green-50-rgb));
    --sail-color-green-100: rgb(var(--sail-color-green-100-rgb));
    --sail-color-green-200: rgb(var(--sail-color-green-200-rgb));
    --sail-color-green-300: rgb(var(--sail-color-green-300-rgb));
    --sail-color-green-400: rgb(var(--sail-color-green-400-rgb));
    --sail-color-green-500: rgb(var(--sail-color-green-500-rgb));
    --sail-color-green-600: rgb(var(--sail-color-green-600-rgb));
    --sail-color-green-700: rgb(var(--sail-color-green-700-rgb));
    --sail-color-green-800: rgb(var(--sail-color-green-800-rgb));
    --sail-color-green-900: rgb(var(--sail-color-green-900-rgb));
    --sail-color-yellow-50: rgb(var(--sail-color-yellow-50-rgb));
    --sail-color-yellow-100: rgb(var(--sail-color-yellow-100-rgb));
    --sail-color-yellow-200: rgb(var(--sail-color-yellow-200-rgb));
    --sail-color-yellow-300: rgb(var(--sail-color-yellow-300-rgb));
    --sail-color-yellow-400: rgb(var(--sail-color-yellow-400-rgb));
    --sail-color-yellow-500: rgb(var(--sail-color-yellow-500-rgb));
    --sail-color-yellow-600: rgb(var(--sail-color-yellow-600-rgb));
    --sail-color-yellow-700: rgb(var(--sail-color-yellow-700-rgb));
    --sail-color-yellow-800: rgb(var(--sail-color-yellow-800-rgb));
    --sail-color-yellow-900: rgb(var(--sail-color-yellow-900-rgb));
    --sail-color-orange-50: rgb(var(--sail-color-orange-50-rgb));
    --sail-color-orange-100: rgb(var(--sail-color-orange-100-rgb));
    --sail-color-orange-200: rgb(var(--sail-color-orange-200-rgb));
    --sail-color-orange-300: rgb(var(--sail-color-orange-300-rgb));
    --sail-color-orange-400: rgb(var(--sail-color-orange-400-rgb));
    --sail-color-orange-500: rgb(var(--sail-color-orange-500-rgb));
    --sail-color-orange-600: rgb(var(--sail-color-orange-600-rgb));
    --sail-color-orange-700: rgb(var(--sail-color-orange-700-rgb));
    --sail-color-orange-800: rgb(var(--sail-color-orange-800-rgb));
    --sail-color-orange-900: rgb(var(--sail-color-orange-900-rgb));
    --sail-color-red-50: rgb(var(--sail-color-red-50-rgb));
    --sail-color-red-100: rgb(var(--sail-color-red-100-rgb));
    --sail-color-red-200: rgb(var(--sail-color-red-200-rgb));
    --sail-color-red-300: rgb(var(--sail-color-red-300-rgb));
    --sail-color-red-400: rgb(var(--sail-color-red-400-rgb));
    --sail-color-red-500: rgb(var(--sail-color-red-500-rgb));
    --sail-color-red-600: rgb(var(--sail-color-red-600-rgb));
    --sail-color-red-700: rgb(var(--sail-color-red-700-rgb));
    --sail-color-red-800: rgb(var(--sail-color-red-800-rgb));
    --sail-color-red-900: rgb(var(--sail-color-red-900-rgb));
    --sail-color-purple-50: rgb(var(--sail-color-purple-50-rgb));
    --sail-color-purple-100: rgb(var(--sail-color-purple-100-rgb));
    --sail-color-purple-200: rgb(var(--sail-color-purple-200-rgb));
    --sail-color-purple-300: rgb(var(--sail-color-purple-300-rgb));
    --sail-color-purple-400: rgb(var(--sail-color-purple-400-rgb));
    --sail-color-purple-500: rgb(var(--sail-color-purple-500-rgb));
    --sail-color-purple-600: rgb(var(--sail-color-purple-600-rgb));
    --sail-color-purple-700: rgb(var(--sail-color-purple-700-rgb));
    --sail-color-purple-800: rgb(var(--sail-color-purple-800-rgb));
    --sail-color-purple-900: rgb(var(--sail-color-purple-900-rgb));
    --sail-color-violet-50: rgb(var(--sail-color-violet-50-rgb));
    --sail-color-violet-100: rgb(var(--sail-color-violet-100-rgb));
    --sail-color-violet-200: rgb(var(--sail-color-violet-200-rgb));
    --sail-color-violet-300: rgb(var(--sail-color-violet-300-rgb));
    --sail-color-violet-400: rgb(var(--sail-color-violet-400-rgb));
    --sail-color-violet-500: rgb(var(--sail-color-violet-500-rgb));
    --sail-color-violet-600: rgb(var(--sail-color-violet-600-rgb));
    --sail-color-violet-700: rgb(var(--sail-color-violet-700-rgb));
    --sail-color-violet-800: rgb(var(--sail-color-violet-800-rgb));
    --sail-color-violet-900: rgb(var(--sail-color-violet-900-rgb));
    --sail-color-background: var(--sail-color-white);
    --sail-color-background-white: var(--sail-color-white);
    --sail-color-background-gray: var(--sail-color-gray-500);
    --sail-color-background-blue: var(--sail-color-blue-500);
    --sail-color-background-cyan: var(--sail-color-cyan-500);
    --sail-color-background-green: var(--sail-color-green-500);
    --sail-color-background-yellow: var(--sail-color-yellow-500);
    --sail-color-background-orange: var(--sail-color-orange-500);
    --sail-color-background-red: var(--sail-color-red-500);
    --sail-color-background-purple: var(--sail-color-purple-500);
    --sail-color-background-violet: var(--sail-color-violet-500);
    --sail-color-background-canvas: var(--sail-color-gray-100);
    --sail-color-background-offset: var(--sail-color-gray-50);
    --sail-color-line-divider: var(--sail-color-gray-100);
    --sail-color-line-divider-medium: var(--sail-color-gray-200);
    --sail-color-line-divider-dark: var(--sail-color-gray-600);
    --sail-color-line-keyline: var(--sail-color-line-divider);
    --sail-color-shadow-key: rgba(var(--sail-color-black-rgb), var(--sail-opacity-shadow-key));
    --sail-color-shadow-ambient: rgba(var(--sail-color-gray-700-rgb), var(--sail-opacity-shadow-ambient));
    --sail-color-shadow-focus: rgba(var(--sail-color-cyan-400-rgb), var(--sail-opacity-shadow-focus));
    --sail-color-shadow-focus-keyline: rgba(var(--sail-color-cyan-600-rgb), var(--sail-opacity-shadow-focus-keyline));
    --sail-color-text: var(--sail-color-gray-700);
    --sail-color-text-black: var(--sail-color-black);
    --sail-color-text-white: var(--sail-color-white);
    --sail-color-text-gray: var(--sail-color-gray-500);
    --sail-color-text-blue: var(--sail-color-blue-500);
    --sail-color-text-cyan: var(--sail-color-cyan-500);
    --sail-color-text-green: var(--sail-color-green-500);
    --sail-color-text-yellow: var(--sail-color-yellow-500);
    --sail-color-text-orange: var(--sail-color-orange-500);
    --sail-color-text-red: var(--sail-color-red-500);
    --sail-color-text-purple: var(--sail-color-purple-500);
    --sail-color-text-violet: var(--sail-color-violet-500);
    --sail-color-text-disabled: var(--sail-color-gray-300);
    --sail-color-text-hover: var(--sail-color-gray-900);
    --sail-color-text-emphasized: var(--sail-color-gray-900);
    --sail-color-text-invalid: var(--sail-color-text-red);
    --sail-color-text-selected: var(--sail-color-text-blue);
    --sail-color-text-link: var(--sail-color-text-blue);
    --sail-color-text-link-hover: var(--sail-color-text-hover)
}

html.sail-color-2021 {
    --sail-color-gray-0-rgb: 255, 255, 255;
    --sail-color-gray-50-rgb: 246, 248, 250;
    --sail-color-gray-100-rgb: 235, 238, 241;
    --sail-color-gray-150-rgb: 213, 219, 225;
    --sail-color-gray-200-rgb: 192, 200, 210;
    --sail-color-gray-300-rgb: 163, 172, 186;
    --sail-color-gray-400-rgb: 135, 144, 159;
    --sail-color-gray-500-rgb: 104, 115, 133;
    --sail-color-gray-600-rgb: 84, 89, 105;
    --sail-color-gray-700-rgb: 65, 69, 82;
    --sail-color-gray-800-rgb: 48, 49, 61;
    --sail-color-gray-900-rgb: 26, 27, 37;
    --sail-color-gray-950-rgb: 16, 17, 26;
    --sail-color-cyan-50-rgb: 221, 255, 254;
    --sail-color-cyan-100-rgb: 207, 245, 246;
    --sail-color-cyan-150-rgb: 162, 229, 239;
    --sail-color-cyan-200-rgb: 117, 213, 232;
    --sail-color-cyan-300-rgb: 6, 185, 239;
    --sail-color-cyan-400-rgb: 0, 150, 235;
    --sail-color-cyan-500-rgb: 5, 112, 222;
    --sail-color-cyan-600-rgb: 0, 85, 188;
    --sail-color-cyan-700-rgb: 4, 67, 140;
    --sail-color-cyan-800-rgb: 0, 50, 98;
    --sail-color-cyan-900-rgb: 1, 28, 58;
    --sail-color-green-50-rgb: 236, 254, 215;
    --sail-color-green-100-rgb: 215, 247, 194;
    --sail-color-green-150-rgb: 166, 235, 132;
    --sail-color-green-200-rgb: 118, 223, 71;
    --sail-color-green-300-rgb: 72, 196, 4;
    --sail-color-green-400-rgb: 63, 164, 13;
    --sail-color-green-500-rgb: 34, 132, 3;
    --sail-color-green-600-rgb: 0, 105, 8;
    --sail-color-green-700-rgb: 11, 80, 25;
    --sail-color-green-800-rgb: 4, 59, 21;
    --sail-color-green-900-rgb: 2, 34, 13;
    --sail-color-yellow-50-rgb: 254, 249, 218;
    --sail-color-yellow-100-rgb: 252, 237, 185;
    --sail-color-yellow-150-rgb: 252, 213, 121;
    --sail-color-yellow-200-rgb: 252, 189, 58;
    --sail-color-yellow-300-rgb: 255, 143, 14;
    --sail-color-yellow-400-rgb: 237, 103, 4;
    --sail-color-yellow-500-rgb: 200, 72, 1;
    --sail-color-yellow-600-rgb: 168, 44, 0;
    --sail-color-yellow-700-rgb: 132, 33, 6;
    --sail-color-yellow-800-rgb: 95, 26, 5;
    --sail-color-yellow-900-rgb: 51, 19, 2;
    --sail-color-orange-50-rgb: var(--sail-color-yellow-50-rgb);
    --sail-color-orange-100-rgb: var(--sail-color-yellow-100-rgb);
    --sail-color-orange-150-rgb: var(--sail-color-yellow-150-rgb);
    --sail-color-orange-200-rgb: var(--sail-color-yellow-200-rgb);
    --sail-color-orange-300-rgb: var(--sail-color-yellow-300-rgb);
    --sail-color-orange-400-rgb: var(--sail-color-yellow-400-rgb);
    --sail-color-orange-500-rgb: var(--sail-color-yellow-500-rgb);
    --sail-color-orange-600-rgb: var(--sail-color-yellow-600-rgb);
    --sail-color-orange-700-rgb: var(--sail-color-yellow-700-rgb);
    --sail-color-orange-800-rgb: var(--sail-color-yellow-800-rgb);
    --sail-color-orange-900-rgb: var(--sail-color-yellow-900-rgb);
    --sail-color-red-50-rgb: 255, 245, 250;
    --sail-color-red-100-rgb: 255, 231, 242;
    --sail-color-red-150-rgb: 255, 204, 223;
    --sail-color-red-200-rgb: 255, 177, 205;
    --sail-color-red-300-rgb: 254, 135, 161;
    --sail-color-red-400-rgb: 252, 82, 106;
    --sail-color-red-500-rgb: 223, 27, 65;
    --sail-color-red-600-rgb: 179, 9, 60;
    --sail-color-red-700-rgb: 137, 13, 55;
    --sail-color-red-800-rgb: 104, 5, 43;
    --sail-color-red-900-rgb: 62, 2, 26;
    --sail-color-blue-50-rgb: 249, 247, 255;
    --sail-color-blue-100-rgb: 242, 235, 255;
    --sail-color-blue-150-rgb: 223, 211, 252;
    --sail-color-blue-200-rgb: 209, 190, 254;
    --sail-color-blue-300-rgb: 180, 156, 252;
    --sail-color-blue-400-rgb: 141, 127, 250;
    --sail-color-blue-500-rgb: 98, 90, 250;
    --sail-color-blue-600-rgb: 81, 61, 217;
    --sail-color-blue-700-rgb: 63, 50, 161;
    --sail-color-blue-800-rgb: 48, 36, 118;
    --sail-color-blue-900-rgb: 20, 19, 78;
    --sail-color-purple-50-rgb: var(--sail-color-blue-50-rgb);
    --sail-color-purple-100-rgb: var(--sail-color-blue-100-rgb);
    --sail-color-purple-200-rgb: var(--sail-color-blue-200-rgb);
    --sail-color-purple-300-rgb: var(--sail-color-blue-300-rgb);
    --sail-color-purple-400-rgb: var(--sail-color-blue-400-rgb);
    --sail-color-purple-500-rgb: var(--sail-color-blue-500-rgb);
    --sail-color-purple-600-rgb: var(--sail-color-blue-600-rgb);
    --sail-color-purple-700-rgb: var(--sail-color-blue-700-rgb);
    --sail-color-purple-800-rgb: var(--sail-color-blue-800-rgb);
    --sail-color-purple-900-rgb: var(--sail-color-blue-900-rgb);
    --sail-color-violet-50-rgb: var(--sail-color-blue-50-rgb);
    --sail-color-violet-100-rgb: var(--sail-color-blue-100-rgb);
    --sail-color-violet-200-rgb: var(--sail-color-blue-200-rgb);
    --sail-color-violet-300-rgb: var(--sail-color-blue-300-rgb);
    --sail-color-violet-400-rgb: var(--sail-color-blue-400-rgb);
    --sail-color-violet-500-rgb: var(--sail-color-blue-500-rgb);
    --sail-color-violet-600-rgb: var(--sail-color-blue-600-rgb);
    --sail-color-violet-700-rgb: var(--sail-color-blue-700-rgb);
    --sail-color-violet-800-rgb: var(--sail-color-blue-800-rgb);
    --sail-color-violet-900-rgb: var(--sail-color-blue-900-rgb);
    --sail-radius: 6px
}

html.sail-color-2021 .Badge {
    --sail-color-blue-50: var(--sail-color-cyan-50);
    --sail-color-blue-100: var(--sail-color-cyan-100);
    --sail-color-blue-200: var(--sail-color-cyan-200);
    --sail-color-blue-300: var(--sail-color-cyan-300);
    --sail-color-blue-400: var(--sail-color-cyan-400);
    --sail-color-blue-500: var(--sail-color-cyan-500);
    --sail-color-blue-600: var(--sail-color-cyan-600);
    --sail-color-blue-700: var(--sail-color-cyan-700);
    --sail-color-blue-800: var(--sail-color-cyan-800);
    --sail-color-blue-900: var(--sail-color-cyan-900)
}

:root {
    --sail-duration-80: 80ms;
    --sail-duration-120: .12s;
    --sail-duration-160: .16s;
    --sail-duration-240: .24s;
    --sail-duration-320: .32s;
    --sail-duration-400: .4s;
    --sail-duration: var(--sail-duration-240);
    --sail-duration-out: var(--sail-duration-160);
    --sail-duration-fast: var(--sail-duration-120);
    --sail-duration-fast-out: var(--sail-duration-80);
    --sail-duration-slow: var(--sail-duration-400);
    --sail-duration-slow-out: var(--sail-duration-320);
    --sail-font-system: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", "Ubuntu";
    --sail-font-monospace: "Menlo", "Consolas";
    --sail-font-ja-JP: "Hiragino Sans", "Yu Gothic UI", "Meiryo UI", "Hiragino Kaku Gothic ProN";
    --sail-font-zh-Hans: "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "Microsoft JhengHei";
    --sail-font-family: var(--sail-font-system), sans-serif;
    --sail-font-family-ja-JP: var(--sail-font-system), var(--sail-font-ja-JP), sans-serif;
    --sail-font-family-zh-Hans: var(--sail-font-system), var(--sail-font-zh-Hans), sans-serif;
    --sail-font-family-monospace: var(--sail-font-monospace), monospace;
    --sail-font-family-monospace-ja-JP: var(--sail-font-monospace), var(--sail-font-ja-JP), monospace;
    --sail-font-family-monospace-zh-Hans: var(--sail-font-monospace), var(--sail-font-zh-Hans), monospace;
    --sail-font-size-11: 11px;
    --sail-font-size-12: 12px;
    --sail-font-size-13: 13px;
    --sail-font-size-14: 14px;
    --sail-font-size-15: 15px;
    --sail-font-size-16: 16px;
    --sail-font-size-20: 20px;
    --sail-font-size-24: 24px;
    --sail-font-size-28: 28px;
    --sail-font-size-32: 32px;
    --sail-font-size-48: 48px;
    --sail-font-size-56: 56px;
    --sail-font-lineHeight-16: 16px;
    --sail-font-lineHeight-20: 20px;
    --sail-font-lineHeight-24: 24px;
    --sail-font-lineHeight-28: 28px;
    --sail-font-lineHeight-32: 32px;
    --sail-font-lineHeight-36: 36px;
    --sail-font-lineHeight-40: 40px;
    --sail-font-lineHeight-56: 56px;
    --sail-font-lineHeight-64: 64px;
    --sail-font-weight-regular: 400;
    --sail-font-weight-medium: 500;
    --sail-font-weight-bold: 700;
    --sail-font-weight-link: var(--sail-font-weight-medium);
    --sail-modal-gutter: 40px;
    --sail-modal-gutter-mobile: 12px;
    --sail-opacity-0: 0;
    --sail-opacity-8: .08;
    --sail-opacity-12: .12;
    --sail-opacity-16: .16;
    --sail-opacity-20: .2;
    --sail-opacity-24: .24;
    --sail-opacity-28: .28;
    --sail-opacity-32: .32;
    --sail-opacity-36: .36;
    --sail-opacity-40: .4;
    --sail-opacity-48: .48;
    --sail-opacity-56: .56;
    --sail-opacity-64: .64;
    --sail-opacity-72: .72;
    --sail-opacity-80: .88;
    --sail-opacity-88: .88;
    --sail-opacity-96: .96;
    --sail-opacity-100: 1;
    --sail-opacity-shadow-key: var(--sail-opacity-12);
    --sail-opacity-shadow-ambient: var(--sail-opacity-8);
    --sail-opacity-shadow-focus: var(--sail-opacity-28);
    --sail-opacity-shadow-focus-keyline: var(--sail-opacity-36);
    --sail-opacity-overlay-modal: var(--sail-opacity-24);
    --sail-radius-1: 1px;
    --sail-radius-2: 2px;
    --sail-radius-3: 3px;
    --sail-radius-4: 4px;
    --sail-radius: var(--sail-radius-4);
    --sail-shadow-keyline: 0 0 0 1px var(--sail-color-line-keyline);
    --sail-shadow-small: 0 2px 5px 0 var(--sail-color-shadow-ambient), 0 1px 1px 0 var(--sail-color-shadow-key);
    --sail-shadow-medium: 0 7px 14px 0 var(--sail-color-shadow-ambient), 0 3px 6px 0 var(--sail-color-shadow-key);
    --sail-shadow-large: 0 15px 35px 0 var(--sail-color-shadow-ambient), 0 5px 15px 0 var(--sail-color-shadow-key);
    --sail-shadow-extraLarge: 0 50px 100px 0 var(--sail-color-shadow-ambient), 0 15px 35px 0 var(--sail-color-shadow-ambient), 0 5px 15px 0 var(--sail-color-shadow-key);
    --sail-shadow-focus: 0 0 0 4px var(--sail-color-shadow-focus);
    --sail-shadow-focus-keyline: 0 0 1px 1px var(--sail-color-shadow-focus-keyline);
    --sail-shadow-link-focus: var(--sail-shadow-focus), var(--sail-shadow-focus-keyline);
    --sail-spacing-0: 0;
    --sail-spacing-2: 2px;
    --sail-spacing-4: 4px;
    --sail-spacing-8: 8px;
    --sail-spacing-12: 12px;
    --sail-spacing-16: 16px;
    --sail-spacing-20: 20px;
    --sail-spacing-24: 24px;
    --sail-spacing-32: 32px;
    --sail-spacing-48: 48px;
    --sail-spacing-64: 64px;
    --sail-spacing-80: 80px;
    --sail-zIndex-contextualLayer: 300;
    --sail-zIndex-contextualLayer-inModal: 400;
    --sail-zIndex-toastLayer: 500
}

@font-face {
    font-weight: 400;
    font-family: Segoe UI;
    src: local(Segoe UI)
}

@font-face {
    font-weight: 500;
    font-family: Segoe UI;
    src: local(Segoe UI Semibold), local(Segoe UI Bold)
}

@font-face {
    font-weight: 600;
    font-family: Segoe UI;
    src: local(Segoe UI Semibold), local(Segoe UI Bold)
}

@font-face {
    font-weight: 700;
    font-family: Segoe UI;
    src: local(Segoe UI Bold)
}

@font-face {
    font-weight: 400;
    font-family: Hiragino Sans;
    src: local(HiraginoSans-W4)
}

@font-face {
    font-weight: 500;
    font-family: Hiragino Sans;
    src: local(HiraginoSans-W5)
}

@font-face {
    font-weight: 600;
    font-family: Hiragino Sans;
    src: local(HiraginoSans-W6)
}

@font-face {
    font-weight: 700;
    font-family: Hiragino Sans;
    src: local(HiraginoSans-W7)
}

@font-face {
    font-weight: 400;
    font-family: Hiragino Kaku Gothic ProN;
    src: local(ヒラギノ角ゴ ProN W3), local(Hiragino Kaku Gothic ProN)
}

@font-face {
    font-weight: 500;
    font-family: Hiragino Kaku Gothic ProN;
    src: local(ヒラギノ角ゴ ProN W6), local(Hiragino Kaku Gothic ProN W6)
}

@font-face {
    font-weight: 600;
    font-family: Hiragino Kaku Gothic ProN;
    src: local(ヒラギノ角ゴ ProN W6), local(Hiragino Kaku Gothic ProN W6)
}

@font-face {
    font-weight: 700;
    font-family: Hiragino Kaku Gothic ProN;
    src: local(ヒラギノ角ゴ ProN W6), local(Hiragino Kaku Gothic ProN W6)
}

@font-face {
    font-weight: 400;
    font-family: Yu Gothic UI;
    src: local(Yu Gothic UI Regular)
}

@font-face {
    font-weight: 500;
    font-family: Yu Gothic UI;
    src: local(Yu Gothic UI Semibold)
}

@font-face {
    font-weight: 600;
    font-family: Yu Gothic UI;
    src: local(Yu Gothic UI Bold)
}

@font-face {
    font-weight: 700;
    font-family: Yu Gothic UI;
    src: local(Yu Gothic UI Bold)
}

@font-face {
    font-weight: 400;
    font-family: Meiryo UI;
    src: local(Meiryo UI)
}

@font-face {
    font-weight: 500;
    font-family: Meiryo UI;
    src: local(Meiryo UI Bold)
}

@font-face {
    font-weight: 600;
    font-family: Meiryo UI;
    src: local(Meiryo UI Bold)
}

@font-face {
    font-weight: 700;
    font-family: Meiryo UI;
    src: local(Meiryo UI Bold)
}

@font-face {
    font-weight: 400;
    font-family: PingFang SC;
    src: local(PingFang SC Regular)
}

@font-face {
    font-weight: 500;
    font-family: PingFang SC;
    src: local(PingFang SC Medium)
}

@font-face {
    font-weight: 600;
    font-family: PingFang SC;
    src: local(PingFang SC Semibold)
}

@font-face {
    font-weight: 700;
    font-family: PingFang SC;
    src: local(PingFang SC Bold)
}

@font-face {
    font-weight: 400;
    font-family: Hiragino Sans GB;
    src: local(Hiragino Sans GB W3)
}

@font-face {
    font-weight: 500;
    font-family: Hiragino Sans GB;
    src: local(Hiragino Sans GB W6)
}

@font-face {
    font-weight: 600;
    font-family: Hiragino Sans GB;
    src: local(Hiragino Sans GB W6)
}

@font-face {
    font-weight: 700;
    font-family: Hiragino Sans GB;
    src: local(Hiragino Sans GB W6)
}

@font-face {
    font-weight: 400;
    font-family: Heiti SC;
    src: local(Heiti SC Light)
}

@font-face {
    font-weight: 500;
    font-family: Heiti SC;
    src: local(Heiti SC Medium)
}

@font-face {
    font-weight: 600;
    font-family: Heiti SC;
    src: local(Heiti SC Medium)
}

@font-face {
    font-weight: 700;
    font-family: Heiti SC;
    src: local(Heiti SC Medium)
}

@font-face {
    font-weight: 400;
    font-family: Microsoft YaHei;
    src: local(Microsoft YaHei)
}

@font-face {
    font-weight: 500;
    font-family: Microsoft YaHei;
    src: local(Microsoft YaHei Semibold), local(Microsoft YaHei Bold)
}

@font-face {
    font-weight: 600;
    font-family: Microsoft YaHei;
    src: local(Microsoft YaHei Semibold), local(Microsoft YaHei Bold)
}

@font-face {
    font-weight: 700;
    font-family: Microsoft YaHei;
    src: local(Microsoft YaHei Bold)
}

@font-face {
    font-weight: 400;
    font-family: Microsoft JhengHei;
    src: local(Microsoft JhengHei)
}

@font-face {
    font-weight: 500;
    font-family: Microsoft JhengHei;
    src: local(Microsoft JhengHei Bold)
}

@font-face {
    font-weight: 600;
    font-family: Microsoft JhengHei;
    src: local(Microsoft JhengHei Bold)
}

@font-face {
    font-weight: 700;
    font-family: Microsoft JhengHei;
    src: local(Microsoft JhengHei Bold)
}

* {
    box-sizing: border-box;
    word-wrap: break-word
}

body,
html {
    color: var(--sail-color-text);
    font-size: 14px;
    font-weight: 400;
    font-family: var(--sail-font-family)
}

code,
kbd,
pre,
samp {
    font-size: 13px;
    font-family: var(--sail-font-family-monospace)
}

code {
    color: inherit
}

code:lang(ja-JP),
kbd:lang(ja-JP),
pre:lang(ja-JP),
samp:lang(ja-JP) {
    font-family: var(--sail-font-family-monospace-ja-JP)
}

code:lang(zh-Hans),
kbd:lang(zh-Hans),
pre:lang(zh-Hans),
samp:lang(zh-Hans) {
    font-family: var(--sail-font-family-monospace-zh-Hans)
}

body,
button,
html,
input {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

body:lang(ja-JP),
html:lang(ja-JP) {
    font-family: var(--sail-font-family-ja-JP)
}

body:lang(zh-Hans),
html:lang(zh-Hans) {
    font-family: var(--sail-font-family-zh-Hans)
}

a {
    color: var(--sail-color-blue-500);
    font-weight: 500;
    text-decoration: none
}

a:hover {
    color: var(--sail-color-gray-900);
    text-decoration: none
}

b,
strong {
    font-weight: 500
}

em,
i {
    font-style: italic
}

.UnstyledLink {
    color: inherit;
    font-weight: inherit;
    font-size: inherit;
    font-family: inherit;
    font-style: inherit;
    text-align: inherit;
    cursor: pointer;
    background-color: #0000;
    border: 0;
    outline: none;
    margin: 0;
    padding: 0;
    text-decoration: none
}

.UnstyledLink:hover {
    color: inherit
}

.TextAligner:before {
    content: "​"
}

.AlignInfo {
    z-index: 1;
    align-self: flex-start
}

.AlignInfo-overlay {
    align-items: baseline;
    height: 100%;
    display: flex;
    position: absolute;
    left: 0;
    right: 0;
    overflow: hidden
}

.AlignInfo-overlay--boundary {
    box-shadow: 0 0 0 1px #6b7c9333
}

.TypeLine {
    z-index: 1;
    height: 1px
}

.TypeLine-inner {
    background: #6b7c9333;
    height: 1px;
    position: absolute
}

.Flex-flex {
    display: flex
}

.Flex-inlineFlex {
    display: inline-flex
}

.Flex-alignContent--flexStart {
    align-content: flex-start
}

.Flex-alignContent--flexEnd {
    align-content: flex-end
}

.Flex-alignContent--center {
    align-content: center
}

.Flex-alignContent--spaceBetween {
    align-content: space-between
}

.Flex-alignContent--spaceAround {
    align-content: space-around
}

.Flex-alignContent--stretch {
    align-content: stretch
}

.Flex-alignItems--flexStart {
    align-items: flex-start
}

.Flex-alignItems--flexEnd {
    align-items: flex-end
}

.Flex-alignItems--center {
    align-items: center
}

.Flex-alignItems--baseline {
    align-items: baseline
}

.Flex-alignItems--stretch {
    align-items: stretch
}

.Flex-direction--row {
    flex-direction: row
}

.Flex-direction--rowReversed {
    flex-direction: row-reverse
}

.Flex-direction--column {
    flex-direction: column
}

.Flex-direction--columnReverse {
    flex-direction: column-reverse
}

.Flex-justifyContent--flexStart {
    justify-content: flex-start
}

.Flex-justifyContent--flexEnd {
    justify-content: flex-end
}

.Flex-justifyContent--center {
    justify-content: center
}

.Flex-justifyContent--spaceBetween {
    justify-content: space-between
}

.Flex-justifyContent--spaceAround {
    justify-content: space-around
}

.Flex-wrap--nowrap {
    flex-wrap: nowrap
}

.Flex-wrap--wrap {
    flex-wrap: wrap
}

.Flex-wrap--wrapReverse {
    flex-wrap: wrap-reverse
}

.Box-root {
    box-sizing: border-box
}

.Box-hideIfEmpty:empty {
    display: none
}

.Box-background--white {
    background-color: var(--sail-color-white)
}

.Box-background--surface {
    background-color: var(--sail-color-background-canvas)
}

.Box-background--offset {
    background-color: var(--sail-color-background-offset)
}

.Box-background--gray {
    background-color: var(--sail-color-background-gray)
}

.Box-background--gray900 {
    background-color: var(--sail-color-gray-900)
}

.Box-background--gray800 {
    background-color: var(--sail-color-gray-800)
}

.Box-background--gray700 {
    background-color: var(--sail-color-gray-700)
}

.Box-background--gray600 {
    background-color: var(--sail-color-gray-600)
}

.Box-background--gray500 {
    background-color: var(--sail-color-gray-500)
}

.Box-background--gray400 {
    background-color: var(--sail-color-gray-400)
}

.Box-background--gray300 {
    background-color: var(--sail-color-gray-300)
}

.Box-background--gray200 {
    background-color: var(--sail-color-gray-200)
}

.Box-background--gray100 {
    background-color: var(--sail-color-gray-100)
}

.Box-background--gray50 {
    background-color: var(--sail-color-gray-50)
}

.Box-background--blue {
    background-color: var(--sail-color-background-blue)
}

.Box-background--blue900 {
    background-color: var(--sail-color-blue-900)
}

.Box-background--blue800 {
    background-color: var(--sail-color-blue-800)
}

.Box-background--blue700 {
    background-color: var(--sail-color-blue-700)
}

.Box-background--blue600 {
    background-color: var(--sail-color-blue-600)
}

.Box-background--blue500 {
    background-color: var(--sail-color-blue-500)
}

.Box-background--blue400 {
    background-color: var(--sail-color-blue-400)
}

.Box-background--blue300 {
    background-color: var(--sail-color-blue-300)
}

.Box-background--blue200 {
    background-color: var(--sail-color-blue-200)
}

.Box-background--blue100 {
    background-color: var(--sail-color-blue-100)
}

.Box-background--blue50 {
    background-color: var(--sail-color-blue-50)
}

.Box-background--cyan {
    background-color: var(--sail-color-background-cyan)
}

.Box-background--cyan900 {
    background-color: var(--sail-color-cyan-900)
}

.Box-background--cyan800 {
    background-color: var(--sail-color-cyan-800)
}

.Box-background--cyan700 {
    background-color: var(--sail-color-cyan-700)
}

.Box-background--cyan600 {
    background-color: var(--sail-color-cyan-600)
}

.Box-background--cyan500 {
    background-color: var(--sail-color-cyan-500)
}

.Box-background--cyan400 {
    background-color: var(--sail-color-cyan-400)
}

.Box-background--cyan300 {
    background-color: var(--sail-color-cyan-300)
}

.Box-background--cyan200 {
    background-color: var(--sail-color-cyan-200)
}

.Box-background--cyan100 {
    background-color: var(--sail-color-cyan-100)
}

.Box-background--cyan50 {
    background-color: var(--sail-color-cyan-50)
}

.Box-background--green {
    background-color: var(--sail-color-background-green)
}

.Box-background--green900 {
    background-color: var(--sail-color-green-900)
}

.Box-background--green800 {
    background-color: var(--sail-color-green-800)
}

.Box-background--green700 {
    background-color: var(--sail-color-green-700)
}

.Box-background--green600 {
    background-color: var(--sail-color-green-600)
}

.Box-background--green500 {
    background-color: var(--sail-color-green-500)
}

.Box-background--green400 {
    background-color: var(--sail-color-green-400)
}

.Box-background--green300 {
    background-color: var(--sail-color-green-300)
}

.Box-background--green200 {
    background-color: var(--sail-color-green-200)
}

.Box-background--green100 {
    background-color: var(--sail-color-green-100)
}

.Box-background--green50 {
    background-color: var(--sail-color-green-50)
}

.Box-background--orange {
    background-color: var(--sail-color-background-orange)
}

.Box-background--orange900 {
    background-color: var(--sail-color-orange-900)
}

.Box-background--orange800 {
    background-color: var(--sail-color-orange-800)
}

.Box-background--orange700 {
    background-color: var(--sail-color-orange-700)
}

.Box-background--orange600 {
    background-color: var(--sail-color-orange-600)
}

.Box-background--orange500 {
    background-color: var(--sail-color-orange-500)
}

.Box-background--orange400 {
    background-color: var(--sail-color-orange-400)
}

.Box-background--orange300 {
    background-color: var(--sail-color-orange-300)
}

.Box-background--orange200 {
    background-color: var(--sail-color-orange-200)
}

.Box-background--orange100 {
    background-color: var(--sail-color-orange-100)
}

.Box-background--orange50 {
    background-color: var(--sail-color-orange-50)
}

.Box-background--purple {
    background-color: var(--sail-color-background-purple)
}

.Box-background--purple900 {
    background-color: var(--sail-color-purple-900)
}

.Box-background--purple800 {
    background-color: var(--sail-color-purple-800)
}

.Box-background--purple700 {
    background-color: var(--sail-color-purple-700)
}

.Box-background--purple600 {
    background-color: var(--sail-color-purple-600)
}

.Box-background--purple500 {
    background-color: var(--sail-color-purple-500)
}

.Box-background--purple400 {
    background-color: var(--sail-color-purple-400)
}

.Box-background--purple300 {
    background-color: var(--sail-color-purple-300)
}

.Box-background--purple200 {
    background-color: var(--sail-color-purple-200)
}

.Box-background--purple100 {
    background-color: var(--sail-color-purple-100)
}

.Box-background--purple50 {
    background-color: var(--sail-color-purple-50)
}

.Box-background--red {
    background-color: var(--sail-color-background-red)
}

.Box-background--red900 {
    background-color: var(--sail-color-red-900)
}

.Box-background--red800 {
    background-color: var(--sail-color-red-800)
}

.Box-background--red700 {
    background-color: var(--sail-color-red-700)
}

.Box-background--red600 {
    background-color: var(--sail-color-red-600)
}

.Box-background--red500 {
    background-color: var(--sail-color-red-500)
}

.Box-background--red400 {
    background-color: var(--sail-color-red-400)
}

.Box-background--red300 {
    background-color: var(--sail-color-red-300)
}

.Box-background--red200 {
    background-color: var(--sail-color-red-200)
}

.Box-background--red100 {
    background-color: var(--sail-color-red-100)
}

.Box-background--red50 {
    background-color: var(--sail-color-red-50)
}

.Box-background--yellow {
    background-color: var(--sail-color-background-yellow)
}

.Box-background--yellow900 {
    background-color: var(--sail-color-yellow-900)
}

.Box-background--yellow800 {
    background-color: var(--sail-color-yellow-800)
}

.Box-background--yellow700 {
    background-color: var(--sail-color-yellow-700)
}

.Box-background--yellow600 {
    background-color: var(--sail-color-yellow-600)
}

.Box-background--yellow500 {
    background-color: var(--sail-color-yellow-500)
}

.Box-background--yellow400 {
    background-color: var(--sail-color-yellow-400)
}

.Box-background--yellow300 {
    background-color: var(--sail-color-yellow-300)
}

.Box-background--yellow200 {
    background-color: var(--sail-color-yellow-200)
}

.Box-background--yellow100 {
    background-color: var(--sail-color-yellow-100)
}

.Box-background--yellow50 {
    background-color: var(--sail-color-yellow-50)
}

.Box-background--violet {
    background-color: var(--sail-color-background-violet)
}

.Box-background--violet900 {
    background-color: var(--sail-color-violet-900)
}

.Box-background--violet800 {
    background-color: var(--sail-color-violet-800)
}

.Box-background--violet700 {
    background-color: var(--sail-color-violet-700)
}

.Box-background--violet600 {
    background-color: var(--sail-color-violet-600)
}

.Box-background--violet500 {
    background-color: var(--sail-color-violet-500)
}

.Box-background--violet400 {
    background-color: var(--sail-color-violet-400)
}

.Box-background--violet300 {
    background-color: var(--sail-color-violet-300)
}

.Box-background--violet200 {
    background-color: var(--sail-color-violet-200)
}

.Box-background--violet100 {
    background-color: var(--sail-color-violet-100)
}

.Box-background--violet50 {
    background-color: var(--sail-color-violet-50)
}

.Box-divider--light-top-1 {
    box-shadow: inset 0 1px var(--sail-color-line-divider)
}

.Box-divider--light-bottom-1 {
    box-shadow: inset 0 -1px var(--sail-color-line-divider)
}

.Box-divider--light-left-1 {
    box-shadow: inset 1px 0 var(--sail-color-line-divider)
}

.Box-divider--light-right-1 {
    box-shadow: inset -1px 0 var(--sail-color-line-divider)
}

.Box-divider--light-vertical-1 {
    box-shadow: inset 0 -1px var(--sail-color-line-divider), inset 0 1px var(--sail-color-line-divider)
}

.Box-divider--light-horizontal-1 {
    box-shadow: inset -1px 0 var(--sail-color-line-divider), inset 1px 0 var(--sail-color-line-divider)
}

.Box-divider--light-all-1 {
    box-shadow: inset 0 0 0 1px var(--sail-color-line-divider)
}

.Box-divider--medium-top-1 {
    box-shadow: inset 0 1px var(--sail-color-line-divider-medium)
}

.Box-divider--medium-bottom-1 {
    box-shadow: inset 0 -1px var(--sail-color-line-divider-medium)
}

.Box-divider--medium-left-1 {
    box-shadow: inset 1px 0 var(--sail-color-line-divider-medium)
}

.Box-divider--medium-right-1 {
    box-shadow: inset -1px 0 var(--sail-color-line-divider-medium)
}

.Box-divider--medium-vertical-1 {
    box-shadow: inset 0 -1px var(--sail-color-line-divider-medium), inset 0 1px var(--sail-color-line-divider-medium)
}

.Box-divider--medium-horizontal-1 {
    box-shadow: inset -1px 0 var(--sail-color-line-divider-medium), inset 1px 0 var(--sail-color-line-divider-medium)
}

.Box-divider--medium-all-1 {
    box-shadow: inset 0 0 0 1px var(--sail-color-line-divider-medium)
}

.Box-divider--dark-top-1 {
    box-shadow: inset 0 1px var(--sail-color-line-divider-dark)
}

.Box-divider--dark-bottom-1 {
    box-shadow: inset 0 -1px var(--sail-color-line-divider-dark)
}

.Box-divider--dark-left-1 {
    box-shadow: inset 1px 0 var(--sail-color-line-divider-dark)
}

.Box-divider--dark-right-1 {
    box-shadow: inset -1px 0 var(--sail-color-line-divider-dark)
}

.Box-divider--dark-vertical-1 {
    box-shadow: inset 0 -1px var(--sail-color-line-divider-dark), inset 0 1px var(--sail-color-line-divider-dark)
}

.Box-divider--dark-horizontal-1 {
    box-shadow: inset -1px 0 var(--sail-color-line-divider-dark), inset 1px 0 var(--sail-color-line-divider-dark)
}

.Box-divider--dark-all-1 {
    box-shadow: inset 0 0 0 1px var(--sail-color-line-divider-dark)
}

.Box-divider--white-top-1 {
    box-shadow: inset 0 1px #fff
}

.Box-divider--white-bottom-1 {
    box-shadow: inset 0 -1px #fff
}

.Box-divider--white-left-1 {
    box-shadow: inset 1px 0 #fff
}

.Box-divider--white-right-1 {
    box-shadow: inset -1px 0 #fff
}

.Box-divider--white-vertical-1 {
    box-shadow: inset 0 -1px #fff, inset 0 1px #fff
}

.Box-divider--white-horizontal-1 {
    box-shadow: inset -1px 0 #fff, inset 1px 0 #fff
}

.Box-divider--white-all-1 {
    box-shadow: inset 0 0 0 1px #fff
}

.Box-divider--light-top-2 {
    box-shadow: inset 0 2px var(--sail-color-line-divider)
}

.Box-divider--light-bottom-2 {
    box-shadow: inset 0 -2px var(--sail-color-line-divider)
}

.Box-divider--light-left-2 {
    box-shadow: inset 2px 0 var(--sail-color-line-divider)
}

.Box-divider--light-right-2 {
    box-shadow: inset -2px 0 var(--sail-color-line-divider)
}

.Box-divider--light-vertical-2 {
    box-shadow: inset 0 -2px var(--sail-color-line-divider), inset 0 2px var(--sail-color-line-divider)
}

.Box-divider--light-horizontal-2 {
    box-shadow: inset -2px 0 var(--sail-color-line-divider), inset 2px 0 var(--sail-color-line-divider)
}

.Box-divider--light-all-2 {
    box-shadow: inset 0 0 0 2px var(--sail-color-line-divider)
}

.Box-divider--medium-top-2 {
    box-shadow: inset 0 2px var(--sail-color-line-divider-medium)
}

.Box-divider--medium-bottom-2 {
    box-shadow: inset 0 -2px var(--sail-color-line-divider-medium)
}

.Box-divider--medium-left-2 {
    box-shadow: inset 2px 0 var(--sail-color-line-divider-medium)
}

.Box-divider--medium-right-2 {
    box-shadow: inset -2px 0 var(--sail-color-line-divider-medium)
}

.Box-divider--medium-vertical-2 {
    box-shadow: inset 0 -2px var(--sail-color-line-divider-medium), inset 0 2px var(--sail-color-line-divider-medium)
}

.Box-divider--medium-horizontal-2 {
    box-shadow: inset -2px 0 var(--sail-color-line-divider-medium), inset 2px 0 var(--sail-color-line-divider-medium)
}

.Box-divider--medium-all-2 {
    box-shadow: inset 0 0 0 2px var(--sail-color-line-divider-medium)
}

.Box-divider--dark-top-2 {
    box-shadow: inset 0 2px var(--sail-color-line-divider-dark)
}

.Box-divider--dark-bottom-2 {
    box-shadow: inset 0 -2px var(--sail-color-line-divider-dark)
}

.Box-divider--dark-left-2 {
    box-shadow: inset 2px 0 var(--sail-color-line-divider-dark)
}

.Box-divider--dark-right-2 {
    box-shadow: inset -2px 0 var(--sail-color-line-divider-dark)
}

.Box-divider--dark-vertical-2 {
    box-shadow: inset 0 -2px var(--sail-color-line-divider-dark), inset 0 2px var(--sail-color-line-divider-dark)
}

.Box-divider--dark-horizontal-2 {
    box-shadow: inset -2px 0 var(--sail-color-line-divider-dark), inset 2px 0 var(--sail-color-line-divider-dark)
}

.Box-divider--dark-all-2 {
    box-shadow: inset 0 0 0 2px var(--sail-color-line-divider-dark)
}

.Box-divider--white-top-2 {
    box-shadow: inset 0 2px #fff
}

.Box-divider--white-bottom-2 {
    box-shadow: inset 0 -2px #fff
}

.Box-divider--white-left-2 {
    box-shadow: inset 2px 0 #fff
}

.Box-divider--white-right-2 {
    box-shadow: inset -2px 0 #fff
}

.Box-divider--white-vertical-2 {
    box-shadow: inset 0 -2px #fff, inset 0 2px #fff
}

.Box-divider--white-horizontal-2 {
    box-shadow: inset -2px 0 #fff, inset 2px 0 #fff
}

.Box-divider--white-all-2 {
    box-shadow: inset 0 0 0 2px #fff
}

.Margin-top--0 {
    margin-top: var(--sail-spacing-0)
}

.Margin-top--2 {
    margin-top: var(--sail-spacing-2)
}

.Margin-top--4 {
    margin-top: var(--sail-spacing-4)
}

.Margin-top--8 {
    margin-top: var(--sail-spacing-8)
}

.Margin-top--12 {
    margin-top: var(--sail-spacing-12)
}

.Margin-top--16 {
    margin-top: var(--sail-spacing-16)
}

.Margin-top--20 {
    margin-top: var(--sail-spacing-20)
}

.Margin-top--24 {
    margin-top: var(--sail-spacing-24)
}

.Margin-top--32 {
    margin-top: var(--sail-spacing-32)
}

.Margin-top--48 {
    margin-top: var(--sail-spacing-48)
}

.Margin-top--64 {
    margin-top: var(--sail-spacing-64)
}

.Margin-top--80 {
    margin-top: var(--sail-spacing-80)
}

.Margin-right--0 {
    margin-right: var(--sail-spacing-0)
}

.Margin-right--2 {
    margin-right: var(--sail-spacing-2)
}

.Margin-right--4 {
    margin-right: var(--sail-spacing-4)
}

.Margin-right--8 {
    margin-right: var(--sail-spacing-8)
}

.Margin-right--12 {
    margin-right: var(--sail-spacing-12)
}

.Margin-right--16 {
    margin-right: var(--sail-spacing-16)
}

.Margin-right--20 {
    margin-right: var(--sail-spacing-20)
}

.Margin-right--24 {
    margin-right: var(--sail-spacing-24)
}

.Margin-right--32 {
    margin-right: var(--sail-spacing-32)
}

.Margin-right--48 {
    margin-right: var(--sail-spacing-48)
}

.Margin-right--64 {
    margin-right: var(--sail-spacing-64)
}

.Margin-right--80 {
    margin-right: var(--sail-spacing-80)
}

.Margin-bottom--0 {
    margin-bottom: var(--sail-spacing-0)
}

.Margin-bottom--2 {
    margin-bottom: var(--sail-spacing-2)
}

.Margin-bottom--4 {
    margin-bottom: var(--sail-spacing-4)
}

.Margin-bottom--8 {
    margin-bottom: var(--sail-spacing-8)
}

.Margin-bottom--12 {
    margin-bottom: var(--sail-spacing-12)
}

.Margin-bottom--16 {
    margin-bottom: var(--sail-spacing-16)
}

.Margin-bottom--20 {
    margin-bottom: var(--sail-spacing-20)
}

.Margin-bottom--24 {
    margin-bottom: var(--sail-spacing-24)
}

.Margin-bottom--32 {
    margin-bottom: var(--sail-spacing-32)
}

.Margin-bottom--48 {
    margin-bottom: var(--sail-spacing-48)
}

.Margin-bottom--64 {
    margin-bottom: var(--sail-spacing-64)
}

.Margin-bottom--80 {
    margin-bottom: var(--sail-spacing-80)
}

.Margin-left--0 {
    margin-left: var(--sail-spacing-0)
}

.Margin-left--2 {
    margin-left: var(--sail-spacing-2)
}

.Margin-left--4 {
    margin-left: var(--sail-spacing-4)
}

.Margin-left--8 {
    margin-left: var(--sail-spacing-8)
}

.Margin-left--12 {
    margin-left: var(--sail-spacing-12)
}

.Margin-left--16 {
    margin-left: var(--sail-spacing-16)
}

.Margin-left--20 {
    margin-left: var(--sail-spacing-20)
}

.Margin-left--24 {
    margin-left: var(--sail-spacing-24)
}

.Margin-left--32 {
    margin-left: var(--sail-spacing-32)
}

.Margin-left--48 {
    margin-left: var(--sail-spacing-48)
}

.Margin-left--64 {
    margin-left: var(--sail-spacing-64)
}

.Margin-left--80 {
    margin-left: var(--sail-spacing-80)
}

.Margin-vertical--0 {
    margin-top: var(--sail-spacing-0);
    margin-bottom: var(--sail-spacing-0)
}

.Margin-vertical--2 {
    margin-top: var(--sail-spacing-2);
    margin-bottom: var(--sail-spacing-2)
}

.Margin-vertical--4 {
    margin-top: var(--sail-spacing-4);
    margin-bottom: var(--sail-spacing-4)
}

.Margin-vertical--8 {
    margin-top: var(--sail-spacing-8);
    margin-bottom: var(--sail-spacing-8)
}

.Margin-vertical--12 {
    margin-top: var(--sail-spacing-12);
    margin-bottom: var(--sail-spacing-12)
}

.Margin-vertical--16 {
    margin-top: var(--sail-spacing-16);
    margin-bottom: var(--sail-spacing-16)
}

.Margin-vertical--20 {
    margin-top: var(--sail-spacing-20);
    margin-bottom: var(--sail-spacing-20)
}

.Margin-vertical--24 {
    margin-top: var(--sail-spacing-24);
    margin-bottom: var(--sail-spacing-24)
}

.Margin-vertical--32 {
    margin-top: var(--sail-spacing-32);
    margin-bottom: var(--sail-spacing-32)
}

.Margin-vertical--48 {
    margin-top: var(--sail-spacing-48);
    margin-bottom: var(--sail-spacing-48)
}

.Margin-vertical--64 {
    margin-top: var(--sail-spacing-64);
    margin-bottom: var(--sail-spacing-64)
}

.Margin-vertical--80 {
    margin-top: var(--sail-spacing-80);
    margin-bottom: var(--sail-spacing-80)
}

.Margin-horizontal--0 {
    margin-right: var(--sail-spacing-0);
    margin-left: var(--sail-spacing-0)
}

.Margin-horizontal--2 {
    margin-right: var(--sail-spacing-2);
    margin-left: var(--sail-spacing-2)
}

.Margin-horizontal--4 {
    margin-right: var(--sail-spacing-4);
    margin-left: var(--sail-spacing-4)
}

.Margin-horizontal--8 {
    margin-right: var(--sail-spacing-8);
    margin-left: var(--sail-spacing-8)
}

.Margin-horizontal--12 {
    margin-right: var(--sail-spacing-12);
    margin-left: var(--sail-spacing-12)
}

.Margin-horizontal--16 {
    margin-right: var(--sail-spacing-16);
    margin-left: var(--sail-spacing-16)
}

.Margin-horizontal--20 {
    margin-right: var(--sail-spacing-20);
    margin-left: var(--sail-spacing-20)
}

.Margin-horizontal--24 {
    margin-right: var(--sail-spacing-24);
    margin-left: var(--sail-spacing-24)
}

.Margin-horizontal--32 {
    margin-right: var(--sail-spacing-32);
    margin-left: var(--sail-spacing-32)
}

.Margin-horizontal--48 {
    margin-right: var(--sail-spacing-48);
    margin-left: var(--sail-spacing-48)
}

.Margin-horizontal--64 {
    margin-right: var(--sail-spacing-64);
    margin-left: var(--sail-spacing-64)
}

.Margin-horizontal--80 {
    margin-right: var(--sail-spacing-80);
    margin-left: var(--sail-spacing-80)
}

.Margin-all--0 {
    margin: var(--sail-spacing-0)
}

.Margin-all--2 {
    margin: var(--sail-spacing-2)
}

.Margin-all--4 {
    margin: var(--sail-spacing-4)
}

.Margin-all--8 {
    margin: var(--sail-spacing-8)
}

.Margin-all--12 {
    margin: var(--sail-spacing-12)
}

.Margin-all--16 {
    margin: var(--sail-spacing-16)
}

.Margin-all--20 {
    margin: var(--sail-spacing-20)
}

.Margin-all--24 {
    margin: var(--sail-spacing-24)
}

.Margin-all--32 {
    margin: var(--sail-spacing-32)
}

.Margin-all--48 {
    margin: var(--sail-spacing-48)
}

.Margin-all--64 {
    margin: var(--sail-spacing-64)
}

.Margin-all--80 {
    margin: var(--sail-spacing-80)
}

.Padding-top--0 {
    padding-top: var(--sail-spacing-0)
}

.Padding-top--2 {
    padding-top: var(--sail-spacing-2)
}

.Padding-top--4 {
    padding-top: var(--sail-spacing-4)
}

.Padding-top--8 {
    padding-top: var(--sail-spacing-8)
}

.Padding-top--12 {
    padding-top: var(--sail-spacing-12)
}

.Padding-top--16 {
    padding-top: var(--sail-spacing-16)
}

.Padding-top--20 {
    padding-top: var(--sail-spacing-20)
}

.Padding-top--24 {
    padding-top: var(--sail-spacing-24)
}

.Padding-top--32 {
    padding-top: var(--sail-spacing-32)
}

.Padding-top--48 {
    padding-top: var(--sail-spacing-48)
}

.Padding-top--64 {
    padding-top: var(--sail-spacing-64)
}

.Padding-top--80 {
    padding-top: var(--sail-spacing-80)
}

.Padding-right--0 {
    padding-right: var(--sail-spacing-0)
}

.Padding-right--2 {
    padding-right: var(--sail-spacing-2)
}

.Padding-right--4 {
    padding-right: var(--sail-spacing-4)
}

.Padding-right--8 {
    padding-right: var(--sail-spacing-8)
}

.Padding-right--12 {
    padding-right: var(--sail-spacing-12)
}

.Padding-right--16 {
    padding-right: var(--sail-spacing-16)
}

.Padding-right--20 {
    padding-right: var(--sail-spacing-20)
}

.Padding-right--24 {
    padding-right: var(--sail-spacing-24)
}

.Padding-right--32 {
    padding-right: var(--sail-spacing-32)
}

.Padding-right--48 {
    padding-right: var(--sail-spacing-48)
}

.Padding-right--64 {
    padding-right: var(--sail-spacing-64)
}

.Padding-right--80 {
    padding-right: var(--sail-spacing-80)
}

.Padding-bottom--0 {
    padding-bottom: var(--sail-spacing-0)
}

.Padding-bottom--2 {
    padding-bottom: var(--sail-spacing-2)
}

.Padding-bottom--4 {
    padding-bottom: var(--sail-spacing-4)
}

.Padding-bottom--8 {
    padding-bottom: var(--sail-spacing-8)
}

.Padding-bottom--12 {
    padding-bottom: var(--sail-spacing-12)
}

.Padding-bottom--16 {
    padding-bottom: var(--sail-spacing-16)
}

.Padding-bottom--20 {
    padding-bottom: var(--sail-spacing-20)
}

.Padding-bottom--24 {
    padding-bottom: var(--sail-spacing-24)
}

.Padding-bottom--32 {
    padding-bottom: var(--sail-spacing-32)
}

.Padding-bottom--48 {
    padding-bottom: var(--sail-spacing-48)
}

.Padding-bottom--64 {
    padding-bottom: var(--sail-spacing-64)
}

.Padding-bottom--80 {
    padding-bottom: var(--sail-spacing-80)
}

.Padding-left--0 {
    padding-left: var(--sail-spacing-0)
}

.Padding-left--2 {
    padding-left: var(--sail-spacing-2)
}

.Padding-left--4 {
    padding-left: var(--sail-spacing-4)
}

.Padding-left--8 {
    padding-left: var(--sail-spacing-8)
}

.Padding-left--12 {
    padding-left: var(--sail-spacing-12)
}

.Padding-left--16 {
    padding-left: var(--sail-spacing-16)
}

.Padding-left--20 {
    padding-left: var(--sail-spacing-20)
}

.Padding-left--24 {
    padding-left: var(--sail-spacing-24)
}

.Padding-left--32 {
    padding-left: var(--sail-spacing-32)
}

.Padding-left--48 {
    padding-left: var(--sail-spacing-48)
}

.Padding-left--64 {
    padding-left: var(--sail-spacing-64)
}

.Padding-left--80 {
    padding-left: var(--sail-spacing-80)
}

.Padding-vertical--0 {
    padding-top: var(--sail-spacing-0);
    padding-bottom: var(--sail-spacing-0)
}

.Padding-vertical--2 {
    padding-top: var(--sail-spacing-2);
    padding-bottom: var(--sail-spacing-2)
}

.Padding-vertical--4 {
    padding-top: var(--sail-spacing-4);
    padding-bottom: var(--sail-spacing-4)
}

.Padding-vertical--8 {
    padding-top: var(--sail-spacing-8);
    padding-bottom: var(--sail-spacing-8)
}

.Padding-vertical--12 {
    padding-top: var(--sail-spacing-12);
    padding-bottom: var(--sail-spacing-12)
}

.Padding-vertical--16 {
    padding-top: var(--sail-spacing-16);
    padding-bottom: var(--sail-spacing-16)
}

.Padding-vertical--20 {
    padding-top: var(--sail-spacing-20);
    padding-bottom: var(--sail-spacing-20)
}

.Padding-vertical--24 {
    padding-top: var(--sail-spacing-24);
    padding-bottom: var(--sail-spacing-24)
}

.Padding-vertical--32 {
    padding-top: var(--sail-spacing-32);
    padding-bottom: var(--sail-spacing-32)
}

.Padding-vertical--48 {
    padding-top: var(--sail-spacing-48);
    padding-bottom: var(--sail-spacing-48)
}

.Padding-vertical--64 {
    padding-top: var(--sail-spacing-64);
    padding-bottom: var(--sail-spacing-64)
}

.Padding-vertical--80 {
    padding-top: var(--sail-spacing-80);
    padding-bottom: var(--sail-spacing-80)
}

.Padding-horizontal--0 {
    padding-right: var(--sail-spacing-0);
    padding-left: var(--sail-spacing-0)
}

.Padding-horizontal--2 {
    padding-right: var(--sail-spacing-2);
    padding-left: var(--sail-spacing-2)
}

.Padding-horizontal--4 {
    padding-right: var(--sail-spacing-4);
    padding-left: var(--sail-spacing-4)
}

.Padding-horizontal--8 {
    padding-right: var(--sail-spacing-8);
    padding-left: var(--sail-spacing-8)
}

.Padding-horizontal--12 {
    padding-right: var(--sail-spacing-12);
    padding-left: var(--sail-spacing-12)
}

.Padding-horizontal--16 {
    padding-right: var(--sail-spacing-16);
    padding-left: var(--sail-spacing-16)
}

.Padding-horizontal--20 {
    padding-right: var(--sail-spacing-20);
    padding-left: var(--sail-spacing-20)
}

.Padding-horizontal--24 {
    padding-right: var(--sail-spacing-24);
    padding-left: var(--sail-spacing-24)
}

.Padding-horizontal--32 {
    padding-right: var(--sail-spacing-32);
    padding-left: var(--sail-spacing-32)
}

.Padding-horizontal--48 {
    padding-right: var(--sail-spacing-48);
    padding-left: var(--sail-spacing-48)
}

.Padding-horizontal--64 {
    padding-right: var(--sail-spacing-64);
    padding-left: var(--sail-spacing-64)
}

.Padding-horizontal--80 {
    padding-right: var(--sail-spacing-80);
    padding-left: var(--sail-spacing-80)
}

.Padding-all--0 {
    padding: var(--sail-spacing-0)
}

.Padding-all--2 {
    padding: var(--sail-spacing-2)
}

.Padding-all--4 {
    padding: var(--sail-spacing-4)
}

.Padding-all--8 {
    padding: var(--sail-spacing-8)
}

.Padding-all--12 {
    padding: var(--sail-spacing-12)
}

.Padding-all--16 {
    padding: var(--sail-spacing-16)
}

.Padding-all--20 {
    padding: var(--sail-spacing-20)
}

.Padding-all--24 {
    padding: var(--sail-spacing-24)
}

.Padding-all--32 {
    padding: var(--sail-spacing-32)
}

.Padding-all--48 {
    padding: var(--sail-spacing-48)
}

.Padding-all--64 {
    padding: var(--sail-spacing-64)
}

.Padding-all--80 {
    padding: var(--sail-spacing-80)
}

.BankCheck-tear {
    z-index: 2;
    width: 100%;
    position: relative
}

.BankCheck-tearSvg {
    filter: drop-shadow(0 -1px #00000013)
}

.BankCheck .BankCheck-card {
    z-index: 1;
    position: relative;
    overflow: visible
}

.BankCheck-card-background {
    border-radius: var(--sail-radius)
}

.BankCheck-bankName {
    border-radius: 2px;
    width: 64px;
    height: 8px
}

.BankCheck--size--small .BankCheck-bankName {
    width: 40px;
    height: 6px
}

.BankCheck-row {
    height: 32px
}

.BankCheck--size--small .BankCheck-row {
    height: 24px
}

.BankCheck-orderOf {
    width: 65%
}

.BankCheck-amount {
    border-radius: 32px;
    width: 35%
}

.BankCheck-memo,
.BankCheck-signature {
    width: 50%
}

.BankCheck-tearSvg-background--white {
    fill: var(--sail-color-background-white)
}

.BankCheck-tearSvg-background--offset {
    fill: var(--sail-color-background-offset)
}

.StatementPreview-descriptor {
    text-transform: uppercase
}

.StatementPreview-tear {
    margin-top: -2px
}

.StatementPreview-tearCover {
    z-index: 2;
    width: 100%;
    height: 4px;
    position: relative
}

.StatementPreview-tearPeaks {
    z-index: 1;
    width: 100%;
    position: relative
}

.StatementPreview-tearSvg {
    filter: drop-shadow(0 2px 3px #00000012)drop-shadow(0 1px #0000000a)
}

.Card-root {
    overflow: hidden
}

.Card--shadow--keyline {
    box-shadow: var(--sail-shadow-keyline)
}

.Card--shadow--small {
    box-shadow: var(--sail-shadow-small)
}

.Card--shadow--medium {
    box-shadow: var(--sail-shadow-medium)
}

.Card--shadow--large {
    box-shadow: var(--sail-shadow-large)
}

.Card--shadow--extraLarge {
    box-shadow: var(--sail-shadow-extraLarge)
}

.Card--radius--all {
    border-radius: var(--sail-radius)
}

.Card--radius--bottom {
    border-bottom-right-radius: var(--sail-radius);
    border-bottom-left-radius: var(--sail-radius)
}

.Card--radius--bottomLeft {
    border-bottom-left-radius: var(--sail-radius)
}

.Card--radius--bottomRight {
    border-bottom-right-radius: var(--sail-radius)
}

.Card--radius--circle {
    border-radius: 50%
}

.Card--radius--left {
    border-top-left-radius: var(--sail-radius);
    border-bottom-left-radius: var(--sail-radius)
}

.Card--radius--right {
    border-top-right-radius: var(--sail-radius);
    border-bottom-right-radius: var(--sail-radius)
}

.Card--radius--top {
    border-top-left-radius: var(--sail-radius);
    border-top-right-radius: var(--sail-radius)
}

.Card--radius--topLeft {
    border-top-left-radius: var(--sail-radius)
}

.Card--radius--topRight {
    border-top-right-radius: var(--sail-radius)
}

.DateInput-root .DateInput-input {
    text-align: center;
    width: 32px
}

@media (max-width:562px) {
    .DateInput-root .DateInput-input {
        width: 40px
    }
}

.DateInput-root .DateInput-input--year {
    width: 44px
}

@media (max-width:562px) {
    .DateInput-root .DateInput-input--year {
        width: 50px
    }
}

.DateInput-root--size--jumbo .DateInput-input {
    width: 40px
}

.DateInput-root--size--jumbo .DateInput-input--year {
    width: 52px
}

.DateInput-root .DateInput-input--year:lang(ja-JP),
.DateInput-root .DateInput-input--year:lang(zh-Hans) {
    width: 60px
}

@media (max-width:562px) {

    .DateInput-root .DateInput-input--year:lang(ja-JP),
    .DateInput-root .DateInput-input--year:lang(zh-Hans) {
        width: 67px
    }
}

.DateInput-root--size--jumbo .DateInput-input:lang(ja-JP),
.DateInput-root--size--jumbo .DateInput-input:lang(zh-Hans) {
    width: 44px
}

.DateInput-root--size--jumbo .DateInput-input--year:lang(ja-JP),
.DateInput-root--size--jumbo .DateInput-input--year:lang(zh-Hans) {
    width: 76px
}

.DeprecatedModal,
.Dialog {
    grid-column: 2;
    margin: 0 auto
}

.DeprecatedModal {
    max-height: calc(100vh - 2*var(--sail-modal-gutter));
    flex-direction: column;
    display: flex
}

.Dialog-column {
    max-height: calc(100vh - 2*var(--sail-modal-gutter))
}

@media (max-width:562px) {
    .Dialog-column {
        max-height: calc(100vh - 2*var(--sail-modal-gutter-mobile))
    }
}

.DeprecatedModal-content,
.DeprecatedModal .ContentBlock,
.Dialog-content,
.Dialog .ContentBlock {
    overflow-x: hidden;
    overflow-y: auto
}

.Dialog-column form {
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex
}

@media (-ms-high-contrast:none),
(-ms-high-contrast:active) {

    .Dialog-column,
    .Dialog-column form {
        max-height: none
    }
}

.Grid-root {
    grid-template-columns: repeat(12, 1fr);
    display: grid
}

.Grid-gap--column-2 {
    margin-right: calc(-1*var(--sail-spacing-2)/2);
    margin-left: calc(-1*var(--sail-spacing-2)/2)
}

.Grid-gap--column-4 {
    margin-right: calc(-1*var(--sail-spacing-4)/2);
    margin-left: calc(-1*var(--sail-spacing-4)/2)
}

.Grid-gap--column-8 {
    margin-right: calc(-1*var(--sail-spacing-8)/2);
    margin-left: calc(-1*var(--sail-spacing-8)/2)
}

.Grid-gap--column-12 {
    margin-right: calc(-1*var(--sail-spacing-12)/2);
    margin-left: calc(-1*var(--sail-spacing-12)/2)
}

.Grid-gap--column-16 {
    margin-right: calc(-1*var(--sail-spacing-16)/2);
    margin-left: calc(-1*var(--sail-spacing-16)/2)
}

.Grid-gap--column-20 {
    margin-right: calc(-1*var(--sail-spacing-20)/2);
    margin-left: calc(-1*var(--sail-spacing-20)/2)
}

.Grid-gap--column-24 {
    margin-right: calc(-1*var(--sail-spacing-24)/2);
    margin-left: calc(-1*var(--sail-spacing-24)/2)
}

.Grid-gap--column-32 {
    margin-right: calc(-1*var(--sail-spacing-32)/2);
    margin-left: calc(-1*var(--sail-spacing-32)/2)
}

.Grid-gap--column-48 {
    margin-right: calc(-1*var(--sail-spacing-48)/2);
    margin-left: calc(-1*var(--sail-spacing-48)/2)
}

.Grid-gap--column-64 {
    margin-right: calc(-1*var(--sail-spacing-64)/2);
    margin-left: calc(-1*var(--sail-spacing-64)/2)
}

.Grid-gap--row-2 {
    margin-top: calc(-1*var(--sail-spacing-2))
}

.Grid-gap--row-4 {
    margin-top: calc(-1*var(--sail-spacing-4))
}

.Grid-gap--row-8 {
    margin-top: calc(-1*var(--sail-spacing-8))
}

.Grid-gap--row-12 {
    margin-top: calc(-1*var(--sail-spacing-12))
}

.Grid-gap--row-16 {
    margin-top: calc(-1*var(--sail-spacing-16))
}

.Grid-gap--row-20 {
    margin-top: calc(-1*var(--sail-spacing-20))
}

.Grid-gap--row-24 {
    margin-top: calc(-1*var(--sail-spacing-24))
}

.Grid-gap--row-32 {
    margin-top: calc(-1*var(--sail-spacing-32))
}

.Grid-gap--row-48 {
    margin-top: calc(-1*var(--sail-spacing-48))
}

.Grid-gap--row-64 {
    margin-top: calc(-1*var(--sail-spacing-64))
}

.Grid-item--columnStart1 {
    grid-column-start: 1
}

.Grid-item--columnStart2 {
    grid-column-start: 2
}

.Grid-item--columnStart3 {
    grid-column-start: 3
}

.Grid-item--columnStart4 {
    grid-column-start: 4
}

.Grid-item--columnStart5 {
    grid-column-start: 5
}

.Grid-item--columnStart6 {
    grid-column-start: 6
}

.Grid-item--columnStart7 {
    grid-column-start: 7
}

.Grid-item--columnStart8 {
    grid-column-start: 8
}

.Grid-item--columnStart9 {
    grid-column-start: 9
}

.Grid-item--columnStart10 {
    grid-column-start: 10
}

.Grid-item--columnStart11 {
    grid-column-start: 11
}

.Grid-item--columnStart12 {
    grid-column-start: 12
}

.Grid-item--columnSpan1 {
    grid-column-end: span 1
}

.Grid-item--columnSpan2 {
    grid-column-end: span 2
}

.Grid-item--columnSpan3 {
    grid-column-end: span 3
}

.Grid-item--columnSpan4 {
    grid-column-end: span 4
}

.Grid-item--columnSpan5 {
    grid-column-end: span 5
}

.Grid-item--columnSpan6 {
    grid-column-end: span 6
}

.Grid-item--columnSpan7 {
    grid-column-end: span 7
}

.Grid-item--columnSpan8 {
    grid-column-end: span 8
}

.Grid-item--columnSpan9 {
    grid-column-end: span 9
}

.Grid-item--columnSpan10 {
    grid-column-end: span 10
}

.Grid-item--columnSpan11 {
    grid-column-end: span 11
}

.Grid-item--columnSpan12 {
    grid-column-end: span 12
}

.Grid-item-gap {
    height: 100%
}

.Grid-item-gap--column-2 {
    padding-right: calc(var(--sail-spacing-2)/2);
    padding-left: calc(var(--sail-spacing-2)/2)
}

.Grid-item-gap--column-4 {
    padding-right: calc(var(--sail-spacing-4)/2);
    padding-left: calc(var(--sail-spacing-4)/2)
}

.Grid-item-gap--column-8 {
    padding-right: calc(var(--sail-spacing-8)/2);
    padding-left: calc(var(--sail-spacing-8)/2)
}

.Grid-item-gap--column-12 {
    padding-right: calc(var(--sail-spacing-12)/2);
    padding-left: calc(var(--sail-spacing-12)/2)
}

.Grid-item-gap--column-16 {
    padding-right: calc(var(--sail-spacing-16)/2);
    padding-left: calc(var(--sail-spacing-16)/2)
}

.Grid-item-gap--column-20 {
    padding-right: calc(var(--sail-spacing-20)/2);
    padding-left: calc(var(--sail-spacing-20)/2)
}

.Grid-item-gap--column-24 {
    padding-right: calc(var(--sail-spacing-24)/2);
    padding-left: calc(var(--sail-spacing-24)/2)
}

.Grid-item-gap--column-32 {
    padding-right: calc(var(--sail-spacing-32)/2);
    padding-left: calc(var(--sail-spacing-32)/2)
}

.Grid-item-gap--column-48 {
    padding-right: calc(var(--sail-spacing-48)/2);
    padding-left: calc(var(--sail-spacing-48)/2)
}

.Grid-item-gap--column-64 {
    padding-right: calc(var(--sail-spacing-64)/2);
    padding-left: calc(var(--sail-spacing-64)/2)
}

.Grid-item-gap--row-2 {
    padding-top: var(--sail-spacing-2)
}

.Grid-item-gap--row-4 {
    padding-top: var(--sail-spacing-4)
}

.Grid-item-gap--row-8 {
    padding-top: var(--sail-spacing-8)
}

.Grid-item-gap--row-12 {
    padding-top: var(--sail-spacing-12)
}

.Grid-item-gap--row-16 {
    padding-top: var(--sail-spacing-16)
}

.Grid-item-gap--row-20 {
    padding-top: var(--sail-spacing-20)
}

.Grid-item-gap--row-24 {
    padding-top: var(--sail-spacing-24)
}

.Grid-item-gap--row-32 {
    padding-top: var(--sail-spacing-32)
}

.Grid-item-gap--row-48 {
    padding-top: var(--sail-spacing-48)
}

.Grid-item-gap--row-64 {
    padding-top: var(--sail-spacing-64)
}

.PressableCore {
    transition: background-color var(--sail-duration), box-shadow var(--sail-duration);
    position: relative
}

.PressableCore--cursor--arrow .PressableContext--cursor--arrow {
    cursor: default
}

.PressableContext--cursor--pointer,
.PressableCore--cursor--pointer {
    cursor: pointer
}

.PressableContext--cursor--text,
.PressableCore--cursor--text {
    cursor: text
}

.PressableContext--radius--all,
.PressableCore--radius--all {
    border-radius: var(--sail-radius)
}

.PressableContext--radius--bottom,
.PressableCore--radius--bottom {
    border-bottom-right-radius: var(--sail-radius);
    border-bottom-left-radius: var(--sail-radius)
}

.PressableContext--radius--bottomLeft,
.PressableCore--radius--bottomLeft {
    border-bottom-left-radius: var(--sail-radius)
}

.PressableContext--radius--bottomRight,
.PressableCore--radius--bottomRight {
    border-bottom-right-radius: var(--sail-radius)
}

.PressableContext--radius--circle,
.PressableCore--radius--circle {
    border-radius: 50%
}

.PressableContext--radius--left,
.PressableCore--radius--left {
    border-top-left-radius: var(--sail-radius);
    border-bottom-left-radius: var(--sail-radius)
}

.PressableContext--radius--right,
.PressableCore--radius--right {
    border-top-right-radius: var(--sail-radius);
    border-bottom-right-radius: var(--sail-radius)
}

.PressableContext--radius--top,
.PressableCore--radius--top {
    border-top-left-radius: var(--sail-radius);
    border-top-right-radius: var(--sail-radius)
}

.PressableContext--radius--topLeft,
.PressableCore--radius--topLeft {
    border-top-left-radius: var(--sail-radius)
}

.PressableContext--radius--topRight,
.PressableCore--radius--topRight {
    border-top-right-radius: var(--sail-radius)
}

.PressableContext--height {
    min-height: inherit
}

.PressableContext--height--jumbo,
.PressableCore--height--jumbo {
    min-height: 44px
}

.PressableContext--height--large,
.PressableCore--height--large {
    min-height: 36px
}

.PressableContext--height--medium,
.PressableCore--height--medium {
    min-height: 28px
}

.PressableContext--height--small,
.PressableCore--height--small {
    min-height: 24px
}

.PressableCore--width {
    max-width: 100%
}

.PressableCore--width--long {
    width: 352px
}

.PressableCore--width--maximized {
    width: 100%
}

.PressableCore--width--short {
    width: 168px
}

.PressableContext--width {
    width: 100%
}

.PressableCore-base {
    z-index: 1;
    display: inherit;
    align-items: inherit;
    width: inherit;
    height: inherit;
    border-radius: inherit;
    position: relative
}

.PressableCore-overlay {
    z-index: 0;
    border-radius: inherit;
    opacity: 0;
    transition: opacity var(--sail-duration);
    pointer-events: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.PressableCore-overlay--isVisible {
    z-index: 10;
    opacity: .5;
    pointer-events: all
}

.PressableCore-overlay--extendBy1 {
    top: -1px;
    bottom: -1px;
    left: -1px;
    right: -1px
}

.PressableCore-overlay--extendBy2 {
    top: -2px;
    bottom: -2px;
    left: -2px;
    right: -2px
}

.PressableContext {
    z-index: 1;
    vertical-align: middle;
    word-break: normal;
    transition: color var(--sail-duration);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-user-select: auto;
    user-select: auto;
    background: 0 0;
    border: 0;
    outline: 0;
    flex: 0 auto;
    margin: 0;
    text-decoration: none;
    position: relative
}

.PressableContext::placeholder {
    color: var(--sail-color-text-disabled)
}

.PressableContext--display--block {
    display: block
}

.PressableContext--display--flex {
    display: flex
}

.PressableContext--display--inline {
    display: inline
}

.PressableContext--display--inlineFlex {
    display: inline-flex
}

.PressableContext--fontLineHeight--16 {
    line-height: 16px
}

.PressableContext--fontLineHeight--20 {
    line-height: 20px
}

.PressableContext--fontLineHeight--24 {
    line-height: 24px
}

.PressableContext--fontLineHeight--28 {
    line-height: 28px
}

.PressableContext--fontSize--13 {
    font-size: 13px
}

.PressableContext--fontSize--14 {
    font-size: 14px
}

.PressableContext--fontSize--16 {
    font-size: 16px
}

.PressableContext--fontWeight--regular {
    font-weight: 400
}

.PressableContext--fontWeight--medium {
    font-weight: 500
}

.PressableControlLabel-label {
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    display: block
}

.PressableControlLabel.Is--disabled .PressableControlLabel-label {
    cursor: default
}

.Text-align--center {
    text-align: center
}

.Text-align--left {
    text-align: left
}

.Text-align--right {
    text-align: right
}

.Text-color--dark {
    color: var(--sail-color-text-emphasized)
}

.Text-color--default {
    color: var(--sail-color-text)
}

.Text-color--disabled {
    color: var(--sail-color-text-disabled)
}

.Text-color--inherit {
    color: inherit
}

.Text-color--invalid {
    color: var(--sail-color-text-invalid)
}

.Text-color--selected {
    color: var(--sail-color-text-selected)
}

.Text-color--white {
    color: var(--sail-color-text-white)
}

.Text-color--gray {
    color: var(--sail-color-text-gray)
}

.Text-color--gray900 {
    color: var(--sail-color-gray-900)
}

.Text-color--gray800 {
    color: var(--sail-color-gray-800)
}

.Text-color--gray700 {
    color: var(--sail-color-gray-700)
}

.Text-color--gray600 {
    color: var(--sail-color-gray-600)
}

.Text-color--gray500 {
    color: var(--sail-color-gray-500)
}

.Text-color--gray400 {
    color: var(--sail-color-gray-400)
}

.Text-color--gray300 {
    color: var(--sail-color-gray-300)
}

.Text-color--gray200 {
    color: var(--sail-color-gray-200)
}

.Text-color--gray100 {
    color: var(--sail-color-gray-100)
}

.Text-color--gray50 {
    color: var(--sail-color-gray-50)
}

.Text-color--blue {
    color: var(--sail-color-text-blue)
}

.Text-color--blue900 {
    color: var(--sail-color-blue-900)
}

.Text-color--blue800 {
    color: var(--sail-color-blue-800)
}

.Text-color--blue700 {
    color: var(--sail-color-blue-700)
}

.Text-color--blue600 {
    color: var(--sail-color-blue-600)
}

.Text-color--blue500 {
    color: var(--sail-color-blue-500)
}

.Text-color--blue400 {
    color: var(--sail-color-blue-400)
}

.Text-color--blue300 {
    color: var(--sail-color-blue-300)
}

.Text-color--blue200 {
    color: var(--sail-color-blue-200)
}

.Text-color--blue100 {
    color: var(--sail-color-blue-100)
}

.Text-color--blue50 {
    color: var(--sail-color-blue-50)
}

.Text-color--cyan {
    color: var(--sail-color-text-cyan)
}

.Text-color--cyan900 {
    color: var(--sail-color-cyan-900)
}

.Text-color--cyan800 {
    color: var(--sail-color-cyan-800)
}

.Text-color--cyan700 {
    color: var(--sail-color-cyan-700)
}

.Text-color--cyan600 {
    color: var(--sail-color-cyan-600)
}

.Text-color--cyan500 {
    color: var(--sail-color-cyan-500)
}

.Text-color--cyan400 {
    color: var(--sail-color-cyan-400)
}

.Text-color--cyan300 {
    color: var(--sail-color-cyan-300)
}

.Text-color--cyan200 {
    color: var(--sail-color-cyan-200)
}

.Text-color--cyan100 {
    color: var(--sail-color-cyan-100)
}

.Text-color--cyan50 {
    color: var(--sail-color-cyan-50)
}

.Text-color--green {
    color: var(--sail-color-text-green)
}

.Text-color--green900 {
    color: var(--sail-color-green-900)
}

.Text-color--green800 {
    color: var(--sail-color-green-800)
}

.Text-color--green700 {
    color: var(--sail-color-green-700)
}

.Text-color--green600 {
    color: var(--sail-color-green-600)
}

.Text-color--green500 {
    color: var(--sail-color-green-500)
}

.Text-color--green400 {
    color: var(--sail-color-green-400)
}

.Text-color--green300 {
    color: var(--sail-color-green-300)
}

.Text-color--green200 {
    color: var(--sail-color-green-200)
}

.Text-color--green100 {
    color: var(--sail-color-green-100)
}

.Text-color--green50 {
    color: var(--sail-color-green-50)
}

.Text-color--red {
    color: var(--sail-color-text-red)
}

.Text-color--red900 {
    color: var(--sail-color-red-900)
}

.Text-color--red800 {
    color: var(--sail-color-red-800)
}

.Text-color--red700 {
    color: var(--sail-color-red-700)
}

.Text-color--red600 {
    color: var(--sail-color-red-600)
}

.Text-color--red500 {
    color: var(--sail-color-red-500)
}

.Text-color--red400 {
    color: var(--sail-color-red-400)
}

.Text-color--red300 {
    color: var(--sail-color-red-300)
}

.Text-color--red200 {
    color: var(--sail-color-red-200)
}

.Text-color--red100 {
    color: var(--sail-color-red-100)
}

.Text-color--red50 {
    color: var(--sail-color-red-50)
}

.Text-color--yellow {
    color: var(--sail-color-text-yellow)
}

.Text-color--yellow900 {
    color: var(--sail-color-yellow-900)
}

.Text-color--yellow800 {
    color: var(--sail-color-yellow-800)
}

.Text-color--yellow700 {
    color: var(--sail-color-yellow-700)
}

.Text-color--yellow600 {
    color: var(--sail-color-yellow-600)
}

.Text-color--yellow500 {
    color: var(--sail-color-yellow-500)
}

.Text-color--yellow400 {
    color: var(--sail-color-yellow-400)
}

.Text-color--yellow300 {
    color: var(--sail-color-yellow-300)
}

.Text-color--yellow200 {
    color: var(--sail-color-yellow-200)
}

.Text-color--yellow100 {
    color: var(--sail-color-yellow-100)
}

.Text-color--yellow50 {
    color: var(--sail-color-yellow-50)
}

.Text-color--orange {
    color: var(--sail-color-text-orange)
}

.Text-color--orange900 {
    color: var(--sail-color-orange-900)
}

.Text-color--orange800 {
    color: var(--sail-color-orange-800)
}

.Text-color--orange700 {
    color: var(--sail-color-orange-700)
}

.Text-color--orange600 {
    color: var(--sail-color-orange-600)
}

.Text-color--orange500 {
    color: var(--sail-color-orange-500)
}

.Text-color--orange400 {
    color: var(--sail-color-orange-400)
}

.Text-color--orange300 {
    color: var(--sail-color-orange-300)
}

.Text-color--orange200 {
    color: var(--sail-color-orange-200)
}

.Text-color--orange100 {
    color: var(--sail-color-orange-100)
}

.Text-color--orange50 {
    color: var(--sail-color-orange-50)
}

.Text-color--purple {
    color: var(--sail-color-text-purple)
}

.Text-color--purple900 {
    color: var(--sail-color-purple-900)
}

.Text-color--purple800 {
    color: var(--sail-color-purple-800)
}

.Text-color--purple700 {
    color: var(--sail-color-purple-700)
}

.Text-color--purple600 {
    color: var(--sail-color-purple-600)
}

.Text-color--purple500 {
    color: var(--sail-color-purple-500)
}

.Text-color--purple400 {
    color: var(--sail-color-purple-400)
}

.Text-color--purple300 {
    color: var(--sail-color-purple-300)
}

.Text-color--purple200 {
    color: var(--sail-color-purple-200)
}

.Text-color--purple100 {
    color: var(--sail-color-purple-100)
}

.Text-color--purple50 {
    color: var(--sail-color-purple-50)
}

.Text-color--violet {
    color: var(--sail-color-text-violet)
}

.Text-color--violet900 {
    color: var(--sail-color-violet-900)
}

.Text-color--violet800 {
    color: var(--sail-color-violet-800)
}

.Text-color--violet700 {
    color: var(--sail-color-violet-700)
}

.Text-color--violet600 {
    color: var(--sail-color-violet-600)
}

.Text-color--violet500 {
    color: var(--sail-color-violet-500)
}

.Text-color--violet400 {
    color: var(--sail-color-violet-400)
}

.Text-color--violet300 {
    color: var(--sail-color-violet-300)
}

.Text-color--violet200 {
    color: var(--sail-color-violet-200)
}

.Text-color--violet100 {
    color: var(--sail-color-violet-100)
}

.Text-color--violet50 {
    color: var(--sail-color-violet-50)
}

.Text-display--block {
    display: block
}

.Text-display--inline {
    display: inline
}

.Text-fontSize--11 {
    font-size: var(--sail-font-size-11)
}

.Text-fontSize--12 {
    font-size: var(--sail-font-size-12)
}

.Text-fontSize--13 {
    font-size: var(--sail-font-size-13)
}

.Text-fontSize--14 {
    font-size: var(--sail-font-size-14)
}

.Text-fontSize--15 {
    font-size: var(--sail-font-size-15)
}

.Text-fontSize--16 {
    font-size: var(--sail-font-size-16)
}

.Text-fontSize--20 {
    font-size: var(--sail-font-size-20)
}

.Text-fontSize--24 {
    font-size: var(--sail-font-size-24)
}

.Text-fontSize--28 {
    font-size: var(--sail-font-size-28)
}

.Text-fontSize--32 {
    font-size: var(--sail-font-size-32)
}

.Text-fontSize--48 {
    font-size: var(--sail-font-size-48)
}

.Text-fontSize--56 {
    font-size: var(--sail-font-size-56)
}

.Text-fontWeight--regular {
    font-weight: var(--sail-font-weight-regular)
}

.Text-fontWeight--medium {
    font-weight: var(--sail-font-weight-medium)
}

.Text-fontWeight--bold {
    font-weight: var(--sail-font-weight-bold)
}

.Text-lineHeight--16 {
    line-height: var(--sail-font-lineHeight-16)
}

.Text-lineHeight--20 {
    line-height: var(--sail-font-lineHeight-20)
}

.Text-lineHeight--24 {
    line-height: var(--sail-font-lineHeight-24)
}

.Text-lineHeight--28 {
    line-height: var(--sail-font-lineHeight-28)
}

.Text-lineHeight--32 {
    line-height: var(--sail-font-lineHeight-32)
}

.Text-lineHeight--36 {
    line-height: var(--sail-font-lineHeight-36)
}

.Text-lineHeight--40 {
    line-height: var(--sail-font-lineHeight-40)
}

.Text-lineHeight--56 {
    line-height: var(--sail-font-lineHeight-56)
}

.Text-lineHeight--64 {
    line-height: var(--sail-font-lineHeight-64)
}

.Text-numericSpacing--proportional {
    font-feature-settings: "pnum";
    font-variant: proportional-nums
}

.Text-numericSpacing--tabular {
    font-feature-settings: "tnum";
    font-variant: tabular-nums
}

.Text-typeface--base {
    font-family: var(--sail-font-family)
}

.Text-typeface--base:lang(ja-JP) {
    font-family: var(--sail-font-family-ja-JP)
}

.Text-typeface--base:lang(zh-Hans) {
    font-family: var(--sail-font-family-zh-Hans)
}

.Text-typeface--upper {
    font-family: var(--sail-font-family);
    text-transform: uppercase
}

.Text-typeface--upper:lang(ja-JP) {
    font-family: var(--sail-font-family-ja-JP)
}

.Text-typeface--upper:lang(zh-Hans) {
    font-family: var(--sail-font-family-zh-Hans)
}

.Text-typeface--mono {
    font-family: var(--sail-font-family-monospace)
}

.Text-typeface--mono:lang(ja-JP) {
    font-family: var(--sail-font-family-monospace-ja-JP)
}

.Text-typeface--mono:lang(zh-Hans) {
    font-family: var(--sail-font-family-monospace-zh-Hans)
}

.Text--visuallyHidden {
    clip: rect(1px, 1px, 1px, 1px);
    width: 1px;
    height: 1px;
    overflow: hidden;
    position: absolute !important
}

.Text-wordBreak--all {
    word-break: break-all
}

.Text-wordBreak--normal {
    word-break: normal
}

.Text-wordBreak--word {
    word-break: break-word
}

.Text-wrap--wrap {
    white-space: normal
}

.Text-wrap--noWrap {
    white-space: nowrap
}

.AddressInput-grouping {
    width: 100%
}

.Button-element {
    height: 100%
}

.Button-align {
    width: 100%
}

.Button-label {
    text-transform: none;
    transition: color var(--sail-duration)
}

.Button--hideLabel .Button-label {
    clip: rect(1px, 1px, 1px, 1px);
    width: 1px;
    height: 1px;
    overflow: hidden;
    position: absolute !important
}

.Button-icon {
    transition: color var(--sail-duration)
}

.Button-shortcut {
    color: inherit;
    opacity: .7;
    font-size: 11px;
    line-height: 12px
}

.ButtonLink.Is--disabled,
.ButtonLink:disabled {
    pointer-events: none
}

.ButtonLink:active .ButtonLink-label.Text-color--white,
.ButtonLink:hover .ButtonLink-label.Text-color--white {
    color: #fff;
    opacity: .7
}

.ButtonLink--Is--disabled--white .ButtonLink-label {
    color: #fff;
    opacity: .5
}

.ButtonLink:active .ButtonLink-label,
.ButtonLink:hover .ButtonLink-label {
    color: var(--sail-color-gray-900)
}

.ButtonLink--Is--disabled--white .Icon svg {
    color: #fff;
    opacity: .5
}

.ButtonLink:active .Icon svg,
.ButtonLink:hover .Icon svg {
    fill: var(--sail-color-gray-700)
}

.ButtonLink:active .Icon.Icon-color--white svg,
.ButtonLink:hover .Icon.Icon-color--white svg {
    opacity: .7;
    fill: #fff
}

.ButtonLink:focus:not([data-input-method=mouse]):not([data-input-method=touch]) {
    z-index: 1;
    box-shadow: var(--sail-shadow-link-focus);
    border-radius: 4px
}

.Text-typeface--base .InlineLink,
.Text-typeface--upper .InlineLink {
    font-weight: 500
}

.Text-typeface--mono .InlineLink {
    font-weight: 700
}

.InlineLink.Is--disabled,
.InlineLink:disabled {
    pointer-events: none
}

.InlineLink:active,
.InlineLink:hover {
    color: var(--sail-color-gray-900)
}

.InlineLink:active .Icon svg,
.InlineLink:hover .Icon svg {
    fill: var(--sail-color-gray-700)
}

.InlineLink:focus:not([data-input-method=mouse]):not([data-input-method=touch]) {
    z-index: 1;
    box-shadow: var(--sail-shadow-link-focus);
    border-radius: 4px
}

.ButtonBar-item {
    z-index: 2;
    margin-right: 1px;
    position: relative
}

.ButtonBar-item--isLast {
    margin-right: 0
}

.ButtonBar-item:hover {
    z-index: 3
}

.ButtonBar-item:focus,
.ButtonBar-item:focus-within {
    z-index: 4
}

.ButtonBar-item.Is--disabled {
    z-index: 1
}

.ButtonBar-item .ButtonBar-button {
    z-index: 2
}

.ButtonBar-item:after,
.ButtonBar-item:before {
    z-index: 1;
    content: "";
    background: #fff;
    width: 1px;
    display: block;
    position: absolute;
    top: 0;
    bottom: 0
}

.ButtonBar-item--isFirst:before,
.ButtonBar-item--isLast:after {
    display: none
}

.ButtonBar-item:before {
    left: -1px
}

.ButtonBar-item:after {
    right: -1px
}

.Checkbox-source {
    z-index: 2;
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0
}

.Checkbox-mark {
    z-index: 1;
    opacity: 0;
    transition: transform var(--sail-duration), opacity var(--sail-duration);
    position: relative;
    transform: scale(.75)
}

.Checkbox-mark--visible {
    opacity: 1;
    transform: scale(1)
}

.CodePuncher-wrapper {
    position: relative
}

.CodePuncher-groupSeparator {
    border-radius: var(--sail-radius);
    width: 8px;
    height: 4px
}

.CodePuncher .CodePuncher-minibox {
    z-index: 1;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 52px;
    display: inline-flex;
    position: relative
}

.CodePuncher-pressable {
    z-index: 2
}

.CodePuncher-pressable--isFocused {
    z-index: 5
}

.CodePuncher-controlInput {
    z-index: 6;
    text-align: center;
    background: 0 0;
    border: none;
    outline: none;
    width: 100%;
    height: 100%;
    font-size: 32px;
    position: absolute;
    top: 0;
    left: 0
}

.CodePuncher-target {
    display: none
}

.FileUploader {
    z-index: 2;
    position: relative
}

.FileUploader-output {
    cursor: inherit;
    background: 0 0;
    border: 0;
    outline: none;
    margin: 0;
    padding: 0;
    display: flex
}

.FileUploader-field {
    z-index: 3;
    cursor: pointer;
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden
}

.FileUploader-field::-webkit-file-upload-button {
    cursor: inherit
}

.FileUploader-field::-webkit-file-upload-button {
    cursor: inherit
}

.FileUploader-field::file-selector-button {
    cursor: inherit
}

.FileUploader--hasFile .FileUploader-field {
    z-index: 1;
    width: 0;
    height: 0
}

.Is--disabled .FileUploader-field {
    cursor: default
}

.FileUploader--showingOutput .FileUploader-field {
    z-index: 1
}

.FileUploader--showingInput .FileUploader-field {
    z-index: 2
}

.FileUploader-controls {
    position: relative
}

.FileUploader--showingOutput .FileUploader-controls {
    z-index: 2
}

.FileUploader--showingInput .FileUploader-controls {
    z-index: 1
}

.FileUploader-click {
    background: 0 0;
    border: 0;
    outline: 0;
    margin: 0;
    padding: 0
}

.FileUploader-buttonIcon,
.FileUploader-buttonLabel,
.FileUploader-fileClearIcon,
.FileUploader-fileIcon,
.FileUploader-fileNameLabel {
    transition: color var(--sail-duration)
}

.FileUploader-fileClear {
    background: 0 0;
    border: 0;
    outline: 0;
    margin: 0;
    padding: 0
}

.FileUploader-fileNameLabel {
    max-width: 168px
}

.FormBlock,
.FormLayout {
    border: 0;
    min-width: 0;
    margin: 0;
    padding: 0
}

.FormBlock-header {
    max-width: 700px
}

.FormBlock-legend {
    padding: 0;
    display: table
}

.FormRow--layout--inline .FormRow-start {
    max-width: 320px
}

.FormRow--layout--inline .FormRow-end {
    max-width: 700px
}

.FormRow--layout--stacked .FormRow-end,
.FormRow--layout--stacked .FormRow-start {
    width: 100%;
    max-width: 700px
}

.FormRow--hasName .FormRow-label {
    cursor: pointer
}

.Input--nowrap {
    white-space: nowrap
}

.Input[type=number],
.Input[type=number]::placeholder {
    font-feature-settings: "tnum";
    font-variant: tabular-nums
}

.Input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0
}

.Input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0
}

.Input[type=search] {
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.Input[type=time] {
    height: 0
}

.Input[type=time]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0
}

.Input[type=time]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0
}

.InputBase--width--auto {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.InputBase-row {
    width: 100%
}

.InputBase-pressable {
    z-index: 2;
    position: relative
}

.InputBase-pressable.Is--disabled {
    z-index: 1
}

.InputBase-pressable.Is--invalid {
    z-index: 3
}

.InputBase-pressable:hover {
    z-index: 4
}

.InputBase-pressable:focus,
.InputBase-pressable:focus-within {
    z-index: 5
}

.InputGroup--width--auto {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.InputGroup-container {
    width: 100%
}

.InputGroup-pressable {
    z-index: 2;
    position: relative
}

.InputGroup-pressable.Is--disabled {
    z-index: 1
}

.InputGroup-pressable.Is--invalid {
    z-index: 3
}

.InputGroup-pressable:focus,
.InputGroup-pressable:focus-within {
    z-index: 5
}

.InputGroup:not(.Is--disabled) .InputGroup-pressable:hover {
    z-index: 4
}

.TextArea--resize--none .TextInput-element {
    resize: none
}

.TextArea--resize--vertical .TextInput-element {
    resize: vertical
}

.TextInput-end,
.TextInput-search,
.TextInput-start {
    cursor: text;
    -webkit-user-select: none;
    user-select: none
}

.TextInput-clear {
    background: 0 0;
    border: 0;
    outline: 0;
    align-items: center;
    margin: 0;
    padding: 0;
    display: flex
}

.TextInput-element {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
    flex: auto;
    width: 100%
}

.TextInput-element--align--center {
    text-align: center
}

.TextInput-element--align--left {
    text-align: left
}

.TextInput-element--align--right {
    text-align: right
}

.Menu-item {
    width: -o-calc(100% - 8px);
    width: calc(100% - 8px);
    min-width: 160px;
    margin-left: 4px;
    margin-right: 4px;
    padding: 4px 8px
}

.Micr-group {
    height: 20px;
    position: relative
}

.Micr-group--highlighted .Micr-groupContents {
    box-shadow: 0 2px 0 0 var(--sail-color-blue-400)
}

.Micr-groupAnnotation {
    position: absolute;
    top: 20px
}

.Micr-groupLine {
    width: 2px;
    height: 8px
}

.Micr-groupLabel {
    border-radius: var(--sail-radius)
}

.Link {
    color: var(--sail-color-text-link);
    font-weight: var(--sail-font-weight-link);
    outline: 0;
    text-decoration: none
}

.Link:active,
.Link:hover {
    color: var(--sail-color-text-link-hover)
}

.Link:focus:not([data-input-method=mouse]):not([data-input-method=touch]) {
    z-index: 1;
    border-radius: var(--sail-radius);
    box-shadow: var(--sail-shadow-link-focus)
}

.Link--wrap--false {
    white-space: nowrap
}

.PhoneInput-countryCode,
.PhoneInput-countrySelect {
    flex: none
}

.ScrollableMenu {
    overflow-y: auto
}

.ScrollableMenu ul {
    margin: 0;
    padding: 0
}

.ScrollableMenu li {
    list-style-type: none
}

.SearchableList-input {
    border: 1px solid var(--sail-color-gray-100);
    border-width: 0 0 1px;
    outline: none;
    width: 100%;
    padding: 8px
}

.SearchableList-input::placeholder {
    color: var(--sail-color-gray-400)
}

.SearchableList-empty {
    color: var(--sail-color-gray-400);
    border-bottom: var(--sail-color-gray-100);
    cursor: default;
    padding: 8px
}

.SearchableList-items {
    cursor: pointer;
    position: relative;
    overflow-y: auto
}

.SearchableList-item--highlighted {
    background-color: var(--sail-color-gray-50)
}

.SearchableSelect-container {
    width: 100%;
    display: inline-block
}

.SearchableSelect-element {
    text-align: left;
    align-items: center
}

.SearchableSelect-arrows {
    z-index: 2;
    transition: color var(--sail-duration);
    pointer-events: none;
    margin-top: -6px;
    position: absolute;
    top: 50%;
    right: 8px
}

.SearchableSelect-container--size--jumbo .SearchableSelect-arrows {
    margin-top: -8px;
    right: 12px
}

.SearchableSelect-container--size--large .SearchableSelect-arrows {
    right: 8px
}

.SearchableSelect-container--size--small .SearchableSelect-arrows {
    margin-top: -6px
}

.SearchableSelect-autocomplete-hidden-input {
    border: 0;
    width: 2px;
    height: 2px;
    margin: -1px;
    padding: 0
}

.Select-align {
    width: 100%
}

.Select-element {
    z-index: 1;
    white-space: nowrap;
    position: static
}

.Select-element::-ms-expand {
    display: none
}

.Select-element:focus {
    outline: none
}

.Select--size--large .Select-element {
    font-size: 14px
}

.Select:lang(ja-JP) .Select-element {
    font-weight: 600
}

.Select-element option[hidden] {
    color: var(--sail-color-gray-300)
}

.Select-arrows {
    z-index: 2;
    transition: color var(--sail-duration);
    pointer-events: none;
    margin-top: -6px;
    position: absolute;
    top: 50%;
    right: 8px
}

.Select--size--jumbo .Select-arrows {
    margin-top: -8px;
    right: 12px
}

.Select--size--large .Select-arrows {
    right: 8px
}

.Select--size--small .Select-arrows {
    margin-top: -6px
}

@supports ((-webkit-hyphens:none)) {
    .Select-element {
        font-family: Helvetica Neue, sans-serif
    }
}

.Switch-source {
    z-index: 2;
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute
}

.Switch-knob {
    z-index: 1;
    transition: transform var(--sail-duration);
    position: relative
}

.Switch--isChecked .Switch-knob {
    transform: translate(16px)
}

.Switch--size--small.Switch--isChecked .Switch-knob {
    transform: translate(10px)
}

.Radio-source {
    z-index: 2;
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute
}

.Radio-dot {
    z-index: 1;
    opacity: 0;
    width: 6px;
    height: 6px;
    transition: opacity var(--sail-duration), transform var(--sail-duration);
    border-radius: 8px;
    position: absolute;
    top: 4px;
    left: 4px;
    transform: scale(1.25)
}

.Radio-dot--visible {
    opacity: 1;
    transform: scale(1)
}

.Toggle {
    border: 0;
    min-width: 0;
    margin: 0;
    padding: .01em 0 0
}

body:not(:-moz-handler-blocked) .Toggle {
    display: table-cell
}

.ToggleItem {
    outline: 0;
    align-items: center;
    display: flex;
    position: relative
}

.ToggleItem-fill {
    min-height: inherit
}

.ToggleItem-source {
    cursor: pointer;
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.ToggleItem-annotation {
    border-radius: var(--sail-radius);
    transition: background-color var(--sail-duration)
}

.ToggleItem-annotationLabel,
.ToggleItem-icon,
.ToggleItem-label {
    transition: color var(--sail-duration)
}

.Avatar {
    position: relative;
    overflow: visible
}

.Avatar--size--16 {
    width: 16px;
    height: 16px
}

.Avatar--size--20 {
    width: 20px;
    height: 20px
}

.Avatar--size--24 {
    width: 24px;
    height: 24px
}

.Avatar--size--28 {
    width: 28px;
    height: 28px
}

.Avatar--size--48 {
    width: 48px;
    height: 48px
}

.Avatar--size--32 {
    width: 32px;
    height: 32px
}

.Avatar--size--64 {
    width: 64px;
    height: 64px
}

.Avatar-frame {
    z-index: 1;
    border-radius: 100%;
    width: 100%;
    height: 100%;
    position: absolute
}

.Avatar-frame--2 {
    box-shadow: 0 0 0 2px #fff
}

.Avatar-frame--4 {
    box-shadow: 0 0 0 4px #fff
}

.Avatar-inner {
    z-index: 2;
    border-radius: 100%;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden
}

.Avatar img {
    z-index: 2;
    object-fit: cover;
    width: 100%;
    height: 100%;
    position: relative
}

.Badge {
    border-radius: 4px;
    padding: 1px 6px
}

.Badge-icon--container {
    transition: padding-left .3s ease-in-out, padding-right .3s ease-in-out
}

.Badge-layer-enter .Badge-text,
.Badge-text--collapsed {
    opacity: 0;
    max-width: 0;
    transition: max-width .25s ease-in-out
}

.Badge-layer-enter-done .Badge-text {
    opacity: 1;
    max-width: 20em;
    transition: max-width .35s ease-in-out, opacity .4s ease-in-out;
    overflow: hidden
}

.Badge--collapsed,
.Badge-layer-enter .Badge {
    border-radius: 18px;
    transition: border-radius .25s ease-in-out
}

.Badge-layer-enter-done .Badge {
    border-radius: var(--sail-radius);
    transition: border-radius .35s ease-in-out
}

.Badge-layer--container {
    display: inline-flex
}