/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
/**
 * @tokens Rupture
 * @presenter Spacing
 */
/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
/**
 * @tokens Rupture
 * @presenter Spacing
 */
/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.df-avatar.circle {
  border-radius: 50%;
}
.df-avatar.initial {
  display: flex;
  /* or inline-flex */
  align-items: center;
  justify-content: center;
}
.df-avatar.swatch01 {
  color: #910F08;
  background-color: #F5D7D3;
}
.df-avatar.swatch02 {
  color: #A82D0B;
  background-color: #F9E3D4;
}
.df-avatar.swatch03 {
  color: #83650B;
  background-color: #F9F3D6;
}
.df-avatar.swatch04 {
  color: #144C16;
  background-color: #D7E9D8;
}
.df-avatar.swatch05 {
  color: #0F2C8A;
  background-color: #D6E2F4;
}
.df-avatar.swatch06 {
  color: #3B1F6A;
  background-color: #E6DBED;
}
.df-avatar.swatch07 {
  color: #9A1966;
  background-color: #F6DAEF;
}
.df-avatar.swatch08 {
  color: #492B1B;
  background-color: #E9E0DA;
}
.df-avatar.swatch09 {
  color: #424242;
  background-color: #D9D9D9;
}
.df-avatar.tiny {
  width: 2.4rem;
  height: 2.4rem;
  font-size: 1.2rem;
}
.df-avatar.small {
  width: 3rem;
  height: 3rem;
  font-size: 1.4rem;
}
.df-avatar.smallMedium {
  width: 4rem;
  height: 4rem;
  font-size: 1.8rem;
}
.df-avatar.mediumLarge {
  width: 6rem;
  height: 6rem;
  font-size: 2rem;
}
.df-avatar.large {
  width: 7.5rem;
  height: 7.5rem;
  font-size: 3.4rem;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-checkbox > .k-checkbox {
  margin: 0.5rem 0;
  border-radius: 0.2rem;
  border-color: #8f8f8f;
}
.cer-checkbox > .k-checkbox:checked {
  background-color: #FFFFFF;
  border-color: #1E52BF;
}
.cer-checkbox > .k-checkbox:before {
  color: #1E52BF;
}
.cer-checkbox > .k-checkbox.k-state-indeterminate {
  border-color: #1E52BF;
  padding: 0.3rem;
}
.cer-checkbox > .k-checkbox.k-state-indeterminate:before {
  width: 1rem;
  height: 1rem;
  border-radius: 0.1rem;
}
.cer-checkbox > .k-checkbox:hover {
  background-color: #E3F2FF;
  border-color: #1E52BF;
}
.cer-checkbox > .k-checkbox[role=checkbox]:focus {
  box-shadow: unset;
}
.cer-checkbox.k-state-disabled {
  cursor: not-allowed;
  pointer-events: auto;
}
.cer-checkbox.k-state-disabled > .k-checkbox {
  background-color: #e9e9e9;
  border-color: #d9d9d9;
}
.cer-checkbox.k-state-disabled > .k-checkbox:before {
  color: #8f8f8f;
}

.df-checkbox--read-only {
  cursor: default;
  pointer-events: none;
}
.df-checkbox--read-only.partial > .k-state-indeterminate {
  background-color: #e9e9e9;
  border-color: #d9d9d9;
}
.df-checkbox--read-only.partial > .k-state-indeterminate:before {
  background-color: #696969;
}

.df-checkbox-label--top {
  display: flex;
  flex-direction: column-reverse;
}
.df-checkbox-label--top .df-checkbox-checkmark + .k-checkbox-label, .df-checkbox-label--top .df-checkbox-dash + .k-checkbox-label, .df-checkbox-label--top .k-checkbox + .k-checkbox-label {
  font-size: 1.2rem;
  margin: 0.5rem 0;
  line-height: 1.4rem;
  color: #696969;
  font-weight: 400;
}

.cer-checkbox[dir=ltr]:not(.df-checkbox-label--top) .df-checkbox-checkmark + .k-checkbox-label, .cer-checkbox[dir=ltr]:not(.df-checkbox-label--top) .df-checkbox-dash + .k-checkbox-label, .cer-checkbox[dir=ltr]:not(.df-checkbox-label--top) .k-checkbox + .k-checkbox-label,
.cer-checkbox[dir=rtl]:not(.df-checkbox-label--top) .df-checkbox-checkmark + .k-checkbox-label,
.cer-checkbox[dir=rtl]:not(.df-checkbox-label--top) .df-checkbox-dash + .k-checkbox-label,
.cer-checkbox[dir=rtl]:not(.df-checkbox-label--top) .k-checkbox + .k-checkbox-label {
  font-size: 1.2rem;
  margin: 0 0.5rem;
  line-height: 1.4rem;
  color: #696969;
  font-weight: 400;
}

.df-checkbox-checkmark {
  font-size: 1.6rem;
}

.df-checkbox-dash {
  color: #696969;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
button.cer-button {
  border-radius: 2px;
  font-size: 1.2rem;
  font-family: "Arial";
  vertical-align: middle;
  line-height: 1.45rem;
  padding: 0.6rem 1rem;
  min-width: 7.6rem;
  outline: none;
  border: 1px solid;
  height: 2.6rem;
  align-items: center;
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  white-space: nowrap;
}
button.cer-button > span[role=img] {
  width: 1em;
  height: 1em;
  line-height: 1;
  margin-right: 0.5rem;
  font-size: 1.4rem;
}
button.cer-button > img {
  margin-right: 0.5rem;
  width: 1.4rem;
  height: 1.4rem;
}
button.cer-button:focus {
  outline: 2px solid #0087fd;
  outline-offset: 1px;
}
button.cer-button-primary {
  border-color: #1E52BF;
  color: #FFFFFF;
  background-color: #1E52BF;
  background-image: none;
}
button.cer-button-primary:disabled, button.cer-button-primary:disabled:hover, button.cer-button-primary:disabled:active {
  border-color: #d9d9d9;
  color: #8f8f8f;
  cursor: not-allowed;
  box-shadow: none;
  background-color: #f8f8f8;
}
button.cer-button-primary:hover {
  border-color: #1a47a5;
  background-color: #1a47a5;
}
button.cer-button-primary:active {
  background-color: #163b8a;
}
button.cer-button-secondary {
  border-color: #1E52BF;
  color: #1E52BF;
  background-color: #FFFFFF;
  background-image: none;
}
button.cer-button-secondary:disabled, button.cer-button-secondary:disabled:hover, button.cer-button-secondary:disabled:active {
  border-color: #d9d9d9;
  color: #8f8f8f;
  cursor: not-allowed;
  box-shadow: none;
  background-color: #f8f8f8;
}
button.cer-button-secondary:hover {
  background-color: #E3F2FF;
}
button.cer-button-secondary:active {
  background-color: #badfff;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
button.cer-button-icon {
  border-radius: 2px;
  font-size: 1.2rem;
  font-family: "Arial";
  vertical-align: middle;
  line-height: 1.45rem;
  padding: 0.6rem 1rem;
  min-width: 7.6rem;
  outline: none;
  border: 1px solid;
  height: 2.6rem;
  align-items: center;
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  white-space: nowrap;
  background: transparent;
  border: none;
  min-width: unset;
  box-shadow: none;
  padding: 0.6rem;
  color: black;
}
button.cer-button-icon > span[role=img] {
  width: 1em;
  height: 1em;
  line-height: 1;
  margin-right: 0.5rem;
  font-size: 1.4rem;
}
button.cer-button-icon > img {
  margin-right: 0.5rem;
  width: 1.4rem;
  height: 1.4rem;
}
button.cer-button-icon:focus {
  outline: 2px solid #0087fd;
  outline-offset: 1px;
}
button.cer-button-icon > span[role=img] {
  display: inline-flex;
  vertical-align: middle;
  margin-right: 0;
}
button.cer-button-icon-primary > span[role=img] {
  color: #1E52BF;
}
button.cer-button-icon-primary:disabled, button.cer-button-icon-primary:disabled:hover, button.cer-button-icon-primary:disabled:active {
  cursor: not-allowed;
  background: transparent;
}
button.cer-button-icon-primary:disabled > span[role=img], button.cer-button-icon-primary:disabled:hover > span[role=img], button.cer-button-icon-primary:disabled:active > span[role=img] {
  color: #8f8f8f;
}
button.cer-button-icon-primary:hover, button.cer-button-icon-primary:active {
  background: rgba(0, 0, 0, 0.078);
}
button.cer-button-icon-secondary > span[role=img] {
  color: #696969;
}
button.cer-button-icon-secondary:disabled, button.cer-button-icon-secondary:disabled:hover, button.cer-button-icon-secondary:disabled:active {
  cursor: not-allowed;
  background: transparent;
}
button.cer-button-icon-secondary:disabled > span[role=img], button.cer-button-icon-secondary:disabled:hover > span[role=img], button.cer-button-icon-secondary:disabled:active > span[role=img] {
  color: #8f8f8f;
}
button.cer-button-icon-secondary:hover, button.cer-button-icon-secondary:active {
  background: rgba(0, 0, 0, 0.078);
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
button.cer-button-icon-text {
  border-radius: 2px;
  font-size: 1.2rem;
  font-family: "Arial";
  vertical-align: middle;
  line-height: 1.45rem;
  padding: 0.6rem 1rem;
  min-width: 7.6rem;
  outline: none;
  border: 1px solid;
  height: 2.6rem;
  align-items: center;
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  white-space: nowrap;
  background: transparent;
  border: none;
  min-width: unset;
  box-shadow: none;
  padding: 0.6rem;
  color: black;
  padding: 0 1rem;
}
button.cer-button-icon-text > span[role=img] {
  width: 1em;
  height: 1em;
  line-height: 1;
  margin-right: 0.5rem;
  font-size: 1.4rem;
}
button.cer-button-icon-text > img {
  margin-right: 0.5rem;
  width: 1.4rem;
  height: 1.4rem;
}
button.cer-button-icon-text:focus {
  outline: 2px solid #0087fd;
  outline-offset: 1px;
}
button.cer-button-icon-text > span[role=img] {
  display: inline-flex;
  vertical-align: middle;
  margin-right: 0.5rem;
}
button.cer-button-icon-text-primary > span[role=img] {
  color: #1E52BF;
}
button.cer-button-icon-text-primary:disabled, button.cer-button-icon-text-primary:disabled:hover, button.cer-button-icon-text-primary:disabled:active {
  cursor: not-allowed;
  background: transparent;
}
button.cer-button-icon-text-primary:disabled > span[role=img], button.cer-button-icon-text-primary:disabled:hover > span[role=img], button.cer-button-icon-text-primary:disabled:active > span[role=img] {
  color: #8f8f8f;
}
button.cer-button-icon-text-primary:hover, button.cer-button-icon-text-primary:active {
  background: rgba(0, 0, 0, 0.078);
}
button.cer-button-icon-text-secondary > span[role=img] {
  color: #696969;
}
button.cer-button-icon-text-secondary:disabled, button.cer-button-icon-text-secondary:disabled:hover, button.cer-button-icon-text-secondary:disabled:active {
  cursor: not-allowed;
  background: transparent;
}
button.cer-button-icon-text-secondary:disabled > span[role=img], button.cer-button-icon-text-secondary:disabled:hover > span[role=img], button.cer-button-icon-text-secondary:disabled:active > span[role=img] {
  color: #8f8f8f;
}
button.cer-button-icon-text-secondary:hover, button.cer-button-icon-text-secondary:active {
  background: rgba(0, 0, 0, 0.078);
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.df-buttonGroup {
  display: inline-flex;
}
.df-buttonGroup.disabled {
  cursor: not-allowed;
  box-shadow: none;
}
.df-buttonGroup .cer-button:not(.group-start):not(.group-end),
.df-buttonGroup .cer-icon-button:not(.group-start):not(.group-end),
.df-buttonGroup .cer-icon-text-button:not(.group-start):not(.group-end) {
  border-radius: 0;
}
.df-buttonGroup .cer-button.group-start,
.df-buttonGroup .cer-icon-button.group-start,
.df-buttonGroup .cer-icon-text-button.group-start {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.df-buttonGroup .cer-button.group-end,
.df-buttonGroup .cer-icon-button.group-end,
.df-buttonGroup .cer-icon-text-button.group-end {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.df-buttonGroup .cer-button:not(.group-end),
.df-buttonGroup .cer-icon-button:not(.group-end),
.df-buttonGroup .cer-icon-text-button:not(.group-end) {
  border-right: none;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-card {
  display: flex;
  width: auto;
  background-color: #FFFFFF;
  flex-flow: column nowrap;
  border-radius: 8px;
  border: 0.1px solid #e9e9e9;
  border-style: solid;
  box-sizing: border-box;
  outline: 0;
  font-size: 1.4rem;
  display: inline-block;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}

.cer-cardFooter {
  padding: 24px;
  border-width: 0;
  overflow: hidden;
  display: flex;
  flex: none;
  gap: 8px;
}

.cer-cardContent {
  padding: 2px 24px 12px 24px;
  outline: 0;
  flex: 1 1 auto;
}

.cer-cardHeader {
  padding: 30px 24px 10px 24px;
  outline: 0;
  border-radius: 12px;
  justify-content: space-between;
  display: flex;
  flex: none;
  overflow: hidden;
  position: relative;
}

.cer-cardHeader-title {
  font-weight: 700;
  font-size: 1.4rem;
  align-items: center;
  display: flex;
  justify-content: flex-start;
  line-height: 20px;
}

.cer-cardHeader-action {
  margin-left: 16px;
  justify-content: flex-end;
  float: right;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-input {
  position: relative;
  min-height: 2.4rem;
  min-width: 6rem;
}
.cer-input > input {
  width: 100%;
  border-radius: 2px;
  color: #000000;
  border: 1px solid;
  border-color: #8f8f8f;
  padding: 0.5rem;
  box-sizing: border-box;
  display: inline-block;
  font-size: inherit;
  font-family: inherit;
  line-height: 1.4rem;
  background-color: #FFFFFF;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.cer-input > input:read-only {
  padding: 0.5rem 0.5rem 0.5rem 0;
  text-overflow: ellipsis;
  background-color: transparent;
  border-color: transparent;
}
.cer-input > input:disabled {
  border-color: #d9d9d9;
  color: #8f8f8f;
  cursor: not-allowed;
  background-color: #e9e9e9;
  padding: 0.5rem;
}
.cer-input > input.invalid {
  border: 1px solid;
  border-color: #E4001E;
  padding: 0.5rem;
  background-color: #FFFFFF;
  padding-right: 2.4rem;
}
.cer-input > input.invalid.datamask {
  padding-right: 4.8rem;
}
.cer-input > input.invalid.datamask.date {
  padding-right: 7.2rem;
}
.cer-input > input.datamask {
  padding-right: 2.9rem;
}
.cer-input > input.datamask.date {
  padding-right: 5.3rem;
}
.cer-input > input:focus {
  outline: none;
}
.cer-input .input-validation-icon-container {
  position: absolute;
  right: 0.5rem;
  height: 100%;
  display: inline-flex;
}
.cer-input .input-validation-icon-container.datamask {
  right: 2.6rem;
}
.cer-input .input-validation-icon-container.datamask.date {
  right: 5.2rem;
}
.cer-input .input-validation-icon-container div {
  display: inline-flex;
  align-items: center;
}
.cer-input .input-validation-icon-container i[role=img].dfI_G11_Exclamation {
  color: #E4001E;
  font-size: 1.4rem;
  display: inline-flex;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-input-tooltip-popup-kendo {
  z-index: 10003;
}
.cer-input-tooltip-popup-kendo div.k-tooltip {
  background-color: #E4001E;
  max-width: 350px;
}
.cer-input-tooltip-popup-kendo div.k-callout.k-callout-w,
.cer-input-tooltip-popup-kendo div.k-callout.k-callout-e {
  color: #E4001E;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-notification-message {
  color: black;
  padding: 0.5rem;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
}
.cer-notification-message .cer-notification-message-content {
  flex-grow: 1;
  margin-left: 1rem;
  margin-right: 1rem;
}
.cer-notification-message .cer-notification-message-dismiss {
  border: 0.3rem solid transparent;
  background: none;
  border-color: transparent;
  cursor: pointer;
  color: #696969;
}
.cer-notification-message .cer-notification-message-dismiss:focus {
  border-color: #FFFFFF;
}
.cer-notification-message-info {
  border: 0.1rem solid #1E52BF;
  background: #E3F2FF;
}
.cer-notification-message-info .dfI_G08_Infomation {
  color: #1E52BF;
}
.cer-notification-message-warning {
  border: 0.1rem solid #FE7F0E;
  background: #FFF3E0;
}
.cer-notification-message-warning .dfI_G05_WarningIcon {
  color: #FE7F0E;
}
.cer-notification-message-pending {
  border: 0.1rem solid #1E52BF;
  background: #E3F2FF;
}
.cer-notification-message-pending .dfI_G02_Pending {
  color: #1E52BF;
}
.cer-notification-message-success {
  border: 0.1rem solid #008800;
  background: #E5F7E1;
}
.cer-notification-message-success .dfI_G08_SuccessAlert {
  color: #008800;
}
.cer-notification-message-failure {
  border: 0.1rem solid #E4001E;
  background: #FFEBEE;
}
.cer-notification-message-failure .dfI_G02_WorkflowFailed {
  color: #E4001E;
}

/* Kendo React vendor */
/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-hidden-datepicker {
  display: none;
}

.cer-datepicker {
  min-width: 6rem;
  position: relative;
  /*#region Focus Ring styles*/
  /* Focus Ring */
  /*#endregion Focus Ring styles*/
  /*#region Calendar Icon*/
  /* Icon */
  /* Calendar icon background styles */
  /* Calendar Icon Overwrite */
  /*#endregion Calendar Icon*/
  /*#region Invalid exclamation mark style*/
  /*Invalid exclamation mark style */
  /*#endregion Invalid exclamation mark style*/
  /*#region input styles*/
  /* input styles */
  /*#endregion input styles*/
}
.cer-datepicker .k-datepicker {
  width: 100%;
}
.cer-datepicker .dp-state-focused:after {
  width: 100%;
  height: 100%;
  content: "";
  outline: 3px solid "#43BEEF";
  outline-offset: -3px;
  position: absolute;
  top: 0;
  left: 0;
}
.cer-datepicker span.dfI_Nav_ESSMyCalendar {
  color: #696969;
  font-size: 1.4rem;
  height: 100%;
  display: inline-flex;
  align-items: center;
}
.cer-datepicker a.k-select {
  background-image: none;
  background-color: #FFFFFF;
  width: 2.4rem;
  height: 100%;
}
.cer-datepicker span.k-picker-wrap.k-state-disabled span.dfI_Nav_ESSMyCalendar {
  color: #8f8f8f;
}
.cer-datepicker #DatePickerContainer-disabled .k-input {
  background-color: #e9e9e9;
  color: #8f8f8f;
}
.cer-datepicker #DatePickerContainer-disabled ::selection {
  background-color: #e9e9e9;
  color: #8f8f8f;
}
.cer-datepicker .datepicker-validation-icon-container {
  position: absolute;
  right: 2.5rem;
  height: 100%;
  display: inline-flex;
}
.cer-datepicker .datepicker-validation-icon-container.datamask {
  right: 5.2rem;
}
.cer-datepicker .datepicker-validation-icon-container div {
  display: inline-flex;
  align-items: center;
}
.cer-datepicker .datepicker-validation-icon-container i[role=img].dfI_G11_Exclamation {
  color: #E4001E;
  font-size: 1.4rem;
  display: inline-flex;
}
.cer-datepicker .k-dateinput > .k-dateinput-wrap > .k-input {
  height: 2.6rem;
  font-size: 1.4rem;
  padding: 0.5rem;
}
.cer-datepicker .k-dateinput > .k-state-invalid > .k-input {
  padding: 0.5rem 1.9rem 0.5rem 0.5rem;
}
.cer-datepicker .datamask > .k-picker-wrap > .k-dateinput > .k-dateinput-wrap > .k-input {
  padding: 0.5rem 2.9rem 0.5rem 0.5rem;
}
.cer-datepicker .datamask > .k-picker-wrap > .k-dateinput > .k-state-invalid > .k-input {
  padding: 0.5rem 4.3rem 0.5rem 0.5rem;
}
.cer-datepicker span.k-picker-wrap.k-state-default {
  border-radius: 2px;
  border: 1px solid;
  border-color: #8f8f8f;
  background-color: #FFFFFF;
}
.cer-datepicker span.k-picker-wrap.k-state-default:hover {
  border-radius: 2px;
  border: 1px solid;
  border-color: #8f8f8f;
  background-color: #FFFFFF;
}
.cer-datepicker .k-state-invalid span.k-picker-wrap.k-state-default {
  border-bottom-color: transparent;
}
.cer-datepicker .k-datepicker .k-picker-wrap.k-state-focused {
  box-shadow: none;
  border-color: #696969;
  border-radius: 2px;
  background-color: #FFFFFF;
}
.cer-datepicker .k-datepicker .k-picker-wrap.k-state-invalid {
  box-shadow: none;
  border-color: #E4001E;
  border-radius: 2px;
  border: 1px solid;
  background-color: #FFFFFF;
}
.cer-datepicker .k-datepicker .k-picker-wrap.k-state-invalid .k-input {
  color: #000000;
  box-shadow: none;
}
.cer-datepicker .k-datepicker .k-picker-wrap.k-state-invalid:hover {
  border-radius: 2px;
  border: 1px solid;
  border-color: #E4001E;
  background-color: #FFFFFF;
}
.cer-datepicker .k-datepicker .k-picker-wrap.k-state-invalid.k-state-focused {
  box-shadow: none;
  border-color: #E4001E;
  border-radius: 2px;
  background-color: #FFFFFF;
}
.cer-datepicker .k-datepicker .k-picker-wrap.k-state-focused {
  outline: 2px solid #0087fd;
  outline-offset: 1px;
}
.cer-datepicker span.k-dateinput-wrap.k-state-invalid {
  border-color: transparent;
}
.cer-datepicker #DatePickerContainer-disabled span.k-picker-wrap.k-state-disabled {
  border-color: #d9d9d9;
  cursor: not-allowed;
  background-color: #e9e9e9;
}
.cer-datepicker #DatePickerContainer-disabled span.k-picker-wrap.k-state-disabled span.k-dateinput-wrap.k-state-disabled {
  border-color: #d9d9d9;
  cursor: not-allowed;
  background-color: #e9e9e9;
}
.cer-datepicker #DatePickerContainer-disabled span.k-picker-wrap.k-state-disabled a.k-select {
  border-color: #d9d9d9;
  cursor: not-allowed;
  background-color: #e9e9e9;
}
.cer-datepicker #DatePickerContainer-readonly span.k-picker-wrap.k-state-disabled {
  border-color: transparent;
  background-color: transparent;
}
.cer-datepicker #DatePickerContainer-readonly span.k-picker-wrap.k-state-disabled .k-input {
  padding: 0.5rem 0.5rem 0.5rem 0;
}
.cer-datepicker td span.k-state-in-range:hover {
  background-color: #ECECEC;
}
.cer-datepicker .k-calendar-container .k-calendar {
  border: 0.1rem solid #DDDDDD;
}
.cer-datepicker .k-widget.k-datepicker.k-state-invalid {
  color: #000000;
  border: 1px solid #E4001E;
  border-radius: 2px;
}
.cer-datepicker span.k-dateinput-wrap .k-state-invalid {
  color: transparent;
  border-color: transparent;
}
.cer-datepicker #DatePickerContainer-disabled:hover {
  cursor: not-allowed;
}
.cer-datepicker #DatePickerContainer-disabled {
  opacity: 1;
}
.cer-datepicker #DatePickerContainer-readonly {
  opacity: 1;
}
.cer-datepicker #DatePickerContainer-readonly span.dfI_Nav_ESSMyCalendar {
  opacity: 0;
}
.cer-datepicker .k-state-disabled {
  opacity: 1;
}
.cer-datepicker .k-datepicker .k-picker-wrap:hover .k-select {
  background-color: #FFFFFF;
  background-image: none;
}

.cer-datepicker-popup-kendo {
  z-index: 10003;
  /*#region Calendar styles*/
  /* Calendar header styles */
  /* Calendar today styles */
  /* Calendar cell styles */
  /* today's date cell style */
  /* calendar sidebar styles */
  /* Disabled dates styles */
  /* Calendar header styles */
  /* Calendar weekdays header styles */
  /*#endregion Calendar styles*/
}
.cer-datepicker-popup-kendo .k-calendar-header .k-title {
  color: #1E52BF;
}
.cer-datepicker-popup-kendo .k-calendar .k-footer .k-nav-today, .cer-datepicker-popup-kendo .k-calendar .k-calendar-header .k-today {
  padding: 0.5rem;
  color: #1E52BF;
}
.cer-datepicker-popup-kendo .k-calendar .k-footer .k-nav-today:hover, .cer-datepicker-popup-kendo .k-calendar .k-calendar-header .k-today:hover {
  color: #1E52BF;
  background-color: #ECECEC;
}
.cer-datepicker-popup-kendo td.k-state-invalid {
  color: #8f8f8f !important;
}
.cer-datepicker-popup-kendo .k-calendar .k-state-selected .k-link {
  color: #000000;
  font-weight: bold;
  background-color: #E2EFFF;
}
.cer-datepicker-popup-kendo .k-calendar .k-state-selected .k-link:hover {
  background-color: #ECECEC;
}
.cer-datepicker-popup-kendo .k-calendar .k-state-focused .k-link {
  border: 0.2rem solid #0087fd;
  box-shadow: none;
}
.cer-datepicker-popup-kendo .k-calendar .k-state-focused .k-link:hover {
  background-color: #ECECEC;
}
.cer-datepicker-popup-kendo .k-calendar .k-state-selected.k-state-focused .k-link {
  border: 0.2rem solid #0087fd;
  background-color: #E2EFFF;
  box-shadow: none;
}
.cer-datepicker-popup-kendo .k-calendar .k-state-selected.k-state-focused .k-link:hover {
  background-color: #ECECEC;
}
.cer-datepicker-popup-kendo .k-state-pending-focus .k-state-focused > span:hover {
  background-color: #ECECEC;
}
.cer-datepicker-popup-kendo .k-calendar .k-content .k-link, .cer-datepicker-popup-kendo .k-calendar .k-calendar-content .k-link {
  border-radius: 10rem;
}
.cer-datepicker-popup-kendo .k-calendar .k-content td.k-today > span {
  text-decoration: underline !important;
  text-decoration-color: #BA5801 !important;
  color: #BA5801;
}
.cer-datepicker-popup-kendo .k-calendar .k-content td.k-today.k-state-valid > span:hover {
  background-color: #ECECEC;
}
.cer-datepicker-popup-kendo .k-calendar .k-calendar-navigation li:hover {
  color: #1E52BF;
  background-color: #ECECEC;
}
.cer-datepicker-popup-kendo table.k-calendar-weekdays {
  border-bottom: 0.1rem solid #DDDDDD !important;
}
.cer-datepicker-popup-kendo .k-calendar .k-content .k-state-out-range {
  color: #8f8f8f !important;
  opacity: 1;
}
.cer-datepicker-popup-kendo .k-state-out-range {
  cursor: not-allowed !important;
}
.cer-datepicker-popup-kendo .k-title .dfI_G08_ExpanderArrow {
  color: #1E52BF;
  padding: 0.5rem;
}
.cer-datepicker-popup-kendo .k-title .dfI_G08_ExpanderArrow:hover, .cer-datepicker-popup-kendo .k-title .dfI_G08_ExpanderArrow:active {
  background-color: #ECECEC;
}
.cer-datepicker-popup-kendo .k-title .dfI_G08_ExpanderArrow:before {
  transform: rotate(90deg);
  font-size: 0.9rem;
  margin-bottom: 0.2rem;
}
.cer-datepicker-popup-kendo .k-calendar .k-calendar-view th {
  opacity: 1;
  text-transform: capitalize;
  color: #696969;
}
.cer-datepicker-popup-kendo .k-button.k-bare:hover, .cer-datepicker-popup-kendo .k-calendar-header .k-button:hover {
  color: transparent;
}
.cer-datepicker-popup-kendo .k-button.k-bare:hover, .cer-datepicker-popup-kendo .k-calendar-header .k-button:active {
  color: transparent;
}
.cer-datepicker-popup-kendo span.k-button.k-bare.k-title {
  font-weight: normal;
}
.cer-datepicker-popup-kendo .k-calendar .k-calendar-view tbody th {
  font-weight: normal;
}

.cer-datepicker-tooltip-popup-kendo {
  z-index: 10003;
  /*#region styles for tooltip*/
  /* styles for tooltip */
  /*#endregion styles for tooltip*/
}
.cer-datepicker-tooltip-popup-kendo div.k-tooltip {
  background-color: #E4001E;
  max-width: 350px;
}
.cer-datepicker-tooltip-popup-kendo div.k-callout.k-callout-w,
.cer-datepicker-tooltip-popup-kendo div.k-callout.k-callout-e {
  color: #E4001E;
}

/* Kendo React vendor */
/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-combobox {
  min-width: 6rem;
  width: 100%;
  border-radius: 2px;
  border: 1px solid;
  border-color: #8f8f8f;
  background-color: #FFFFFF;
  box-shadow: none;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
.cer-combobox.readonly {
  border-color: transparent;
  border-left: 0;
}
.cer-combobox > .k-combobox {
  width: 100%;
  background-color: transparent;
  color: transparent;
  font: inherit;
}
.cer-combobox > .k-combobox:hover {
  background-color: transparent;
  color: transparent;
}
.cer-combobox > .k-combobox > .k-dropdown-wrap {
  border-radius: 0;
  border: none;
  border-color: transparent;
  box-shadow: none;
}
.cer-combobox > .k-combobox > .k-dropdown-wrap .k-select {
  background-color: #FFFFFF;
  background-image: none;
  width: 2.4rem;
}
.cer-combobox > .k-combobox > .k-dropdown-wrap .k-select .k-i-arrow-s {
  height: 100%;
  display: inline-flex;
  align-items: center;
}
.cer-combobox > .k-combobox > .k-dropdown-wrap .k-clear-value {
  line-height: unset;
  top: 12%;
}
.cer-combobox > .k-combobox > .k-dropdown-wrap .k-input {
  padding: 0.5rem;
  background-color: #FFFFFF;
  color: #000000;
}
.cer-combobox > .k-combobox > .k-dropdown-wrap .k-input::placeholder {
  color: #696969;
}
.cer-combobox > .k-combobox > .k-dropdown-wrap .k-input::-webkit-input-placeholder {
  color: #696969;
}
.cer-combobox > .k-combobox > .k-dropdown-wrap .k-input:-ms-input-placeholder {
  color: #696969;
}
.cer-combobox > .k-combobox > .k-dropdown-wrap .k-input::-ms-input-placeholder {
  color: #696969;
}
.cer-combobox > .k-combobox > .k-dropdown-wrap .k-input:-moz-placeholder, .cer-combobox > .k-combobox > .k-dropdown-wrap .k-input::-moz-placeholder {
  color: #696969;
  opacity: 1;
}
.cer-combobox.disabled {
  border-color: #d9d9d9;
  cursor: not-allowed;
  background-color: #e9e9e9;
}
.cer-combobox.disabled .k-state-disabled {
  opacity: 1;
}
.cer-combobox.disabled .k-state-disabled .k-input, .cer-combobox.disabled .k-state-disabled span.k-select {
  background-color: #e9e9e9;
  color: #8f8f8f;
}
.cer-combobox.disabled ::selection {
  background-color: #e9e9e9;
  color: #8f8f8f;
}
.cer-combobox.validationError {
  border: 1px solid;
  border-color: #E4001E;
  background-color: #FFFFFF;
}
.cer-combobox .validationIconContainer {
  position: relative;
  width: 2.12rem;
  height: 100%;
}
.cer-combobox .validationErrorIcon {
  position: absolute;
  right: 0.5rem;
  height: 100%;
  display: inline-flex;
}
.cer-combobox .validationErrorIcon div {
  display: inline-flex;
  align-items: center;
}
.cer-combobox .validationErrorIcon i[role=img].dfI_G11_Exclamation {
  color: #E4001E;
  font-size: 1.4rem;
  display: inline-flex;
}

/**
 * Need a global style for the combo box in order to be able
 * to set specific items (ie: search text highlighting)
 */
.cer-combobox-popup-kendo {
  margin-top: 0.5rem;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  z-index: 10003;
  background-color: #FFFFFF;
}
.cer-combobox-popup-kendo .k-popup {
  max-height: 350px;
  background-color: #FFFFFF;
}
.cer-combobox-popup-kendo .k-popup div {
  max-height: 350px;
}
.cer-combobox-popup-kendo .k-popup .k-list-scroller .k-list {
  max-height: 350px;
}
.cer-combobox-popup-kendo .k-item > span {
  background-color: #ABD6FF;
}
.cer-combobox-popup-kendo .k-list > .k-item {
  white-space: pre-wrap;
  display: block;
  padding: 0.5rem;
  /* 
  Truncation settings, note: IE will only support 1 line truncation with ellipsis.
  Currently no way to make ellipsis appear on second line with pure css. 

  If using webkit browser then we can use -webkit-line-clamp,
  otherwise must only show one line before ellipsis .
  */
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  max-height: 5rem;
}
@supports (-webkit-line-clamp: 2) {
  .cer-combobox-popup-kendo .k-list > .k-item {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: initial;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
}
.cer-combobox-popup-kendo .k-list > .k-item.k-state-selected {
  background-color: #E3F2FF;
  font-weight: 600;
  box-shadow: none;
  color: #000000;
}
.cer-combobox-popup-kendo .k-list > .k-item.k-state-selected:hover {
  background-color: #badfff;
  color: #000000;
}
.cer-combobox-popup-kendo .k-list > .k-item:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
.cer-combobox-popup-kendo .k-i-arrow-s {
  color: #696969;
}

.cer-combobox-tooltip-popup-kendo {
  z-index: 10003;
}
.cer-combobox-tooltip-popup-kendo div.k-tooltip {
  background-color: #E4001E;
  max-width: 350px;
}
.cer-combobox-tooltip-popup-kendo div.k-callout.k-callout-w,
.cer-combobox-tooltip-popup-kendo div.k-callout.k-callout-e {
  color: #E4001E;
}

/* Kendo React vendor */
/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-dropdownfilterlist {
  min-width: 6rem;
  width: 100%;
  border-radius: 2px;
  border: 1px solid;
  border-color: #8f8f8f;
  background-color: #FFFFFF;
  box-shadow: none;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
.cer-dropdownfilterlist.readonly {
  border-color: transparent;
  border-left: 0;
}
.cer-dropdownfilterlist > .k-combobox {
  width: 100%;
  background-color: transparent;
  color: transparent;
  font: inherit;
}
.cer-dropdownfilterlist > .k-combobox:hover {
  background-color: transparent;
  color: transparent;
}
.cer-dropdownfilterlist > .k-combobox > .k-dropdown-wrap {
  border-radius: 0;
  border: none;
  border-color: transparent;
  box-shadow: none;
}
.cer-dropdownfilterlist > .k-combobox > .k-dropdown-wrap .k-select {
  background-color: #FFFFFF;
  background-image: none;
  width: 2.4rem;
}
.cer-dropdownfilterlist > .k-combobox > .k-dropdown-wrap .k-select .k-i-arrow-s {
  height: 100%;
  display: inline-flex;
  align-items: center;
}
.cer-dropdownfilterlist > .k-combobox > .k-dropdown-wrap .k-clear-value {
  line-height: unset;
  top: 12%;
}
.cer-dropdownfilterlist > .k-combobox > .k-dropdown-wrap .k-input {
  padding: 0.5rem;
  background-color: #FFFFFF;
  color: #000000;
}
.cer-dropdownfilterlist > .k-combobox > .k-dropdown-wrap .k-input::placeholder {
  color: #696969;
}
.cer-dropdownfilterlist > .k-combobox > .k-dropdown-wrap .k-input::-webkit-input-placeholder {
  color: #696969;
}
.cer-dropdownfilterlist > .k-combobox > .k-dropdown-wrap .k-input:-ms-input-placeholder {
  color: #696969;
}
.cer-dropdownfilterlist > .k-combobox > .k-dropdown-wrap .k-input::-ms-input-placeholder {
  color: #696969;
}
.cer-dropdownfilterlist > .k-combobox > .k-dropdown-wrap .k-input:-moz-placeholder, .cer-dropdownfilterlist > .k-combobox > .k-dropdown-wrap .k-input::-moz-placeholder {
  color: #696969;
  opacity: 1;
}
.cer-dropdownfilterlist.disabled {
  border-color: #d9d9d9;
  cursor: not-allowed;
  background-color: #e9e9e9;
}
.cer-dropdownfilterlist.disabled .k-state-disabled {
  opacity: 1;
}
.cer-dropdownfilterlist.disabled .k-state-disabled .k-input, .cer-dropdownfilterlist.disabled .k-state-disabled span.k-select {
  background-color: #e9e9e9;
  color: #8f8f8f;
}
.cer-dropdownfilterlist.disabled ::selection {
  background-color: #e9e9e9;
  color: #8f8f8f;
}
.cer-dropdownfilterlist.disabled .k-combobox {
  background-color: #e9e9e9 !important;
}
.cer-dropdownfilterlist.validationError {
  border: 1px solid;
  border-color: #E4001E;
  background-color: #FFFFFF;
}
.cer-dropdownfilterlist .validationIconContainer {
  position: relative;
  width: 2.12rem;
  height: 100%;
}
.cer-dropdownfilterlist .validationErrorIcon {
  position: absolute;
  right: 0.5rem;
  height: 100%;
  display: inline-flex;
}
.cer-dropdownfilterlist .validationErrorIcon div {
  display: inline-flex;
  align-items: center;
}
.cer-dropdownfilterlist .validationErrorIcon i[role=img].dfI_G11_Exclamation {
  color: #E4001E;
  font-size: 1.4rem;
  display: inline-flex;
}

/**
 * Need a global style for the combo box in order to be able
 * to set specific items (ie: search text highlighting)
 */
.cer-dropdownfilterlist-popup-kendo {
  margin-top: 0.5rem;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  z-index: 10003;
  background-color: #FFFFFF;
  font-family: "Arial";
}
.cer-dropdownfilterlist-popup-kendo .k-popup {
  max-height: 350px;
  background-color: #FFFFFF;
}
.cer-dropdownfilterlist-popup-kendo .k-popup div {
  max-height: 350px;
}
.cer-dropdownfilterlist-popup-kendo .k-popup .k-list-scroller .k-list {
  max-height: 350px;
}
.cer-dropdownfilterlist-popup-kendo .k-item > span {
  background-color: #ABD6FF;
}
.cer-dropdownfilterlist-popup-kendo .k-list > .k-item {
  white-space: pre-wrap;
  display: block;
  padding: 0.5rem;
  /* 
  Truncation settings, note: IE will only support 1 line truncation with ellipsis.
  Currently no way to make ellipsis appear on second line with pure css. 

  If using webkit browser then we can use -webkit-line-clamp,
  otherwise must only show one line before ellipsis .
  */
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  max-height: 5rem;
}
@supports (-webkit-line-clamp: 2) {
  .cer-dropdownfilterlist-popup-kendo .k-list > .k-item {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: initial;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
}
.cer-dropdownfilterlist-popup-kendo .k-list > .k-item.k-state-selected {
  background-color: #E3F2FF;
  font-weight: 600;
  box-shadow: none;
  color: #000000;
}
.cer-dropdownfilterlist-popup-kendo .k-list > .k-item.k-state-selected:hover {
  background-color: #badfff;
  color: #000000;
}
.cer-dropdownfilterlist-popup-kendo .k-list > .k-item:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
.cer-dropdownfilterlist-popup-kendo .k-i-arrow-s {
  color: #696969;
}

.cer-dropdownfilterlist-tooltip-popup-kendo {
  z-index: 10003;
}
.cer-dropdownfilterlist-tooltip-popup-kendo div.k-tooltip {
  background-color: #E4001E;
  max-width: 350px;
}
.cer-dropdownfilterlist-tooltip-popup-kendo div.k-callout.k-callout-w,
.cer-dropdownfilterlist-tooltip-popup-kendo div.k-callout.k-callout-e {
  color: #E4001E;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-multiselect {
  min-width: 6rem;
  width: 100%;
  border-radius: 2px;
  border: 1px solid;
  border-color: #8f8f8f;
  background-color: #FFFFFF;
}
.cer-multiselect.readonly {
  border-color: transparent;
  border-left: 0;
  overflow-y: visible;
}
.cer-multiselect.validationErr {
  border: 1px solid;
  border-color: #E4001E;
  background-color: #FFFFFF;
}
.cer-multiselect.disabled {
  border-color: #d9d9d9;
  cursor: not-allowed;
  background-color: #e9e9e9;
}
.cer-multiselect.disabled .k-multiselect-wrap {
  background-color: #e9e9e9;
}
.cer-multiselect.disabled .arrowSelect {
  cursor: not-allowed;
  background-color: #e9e9e9;
  color: #8f8f8f;
}
.cer-multiselect .arrowSelect {
  max-height: 3rem;
  width: 2.4rem;
  border-color: rgba(0, 0, 0, 0.08);
  color: #000;
  background-color: #FFFFFF;
  background-image: none;
  border-radius: 0 3px 3px 0;
  padding: 0 0;
  border-width: 0 0 0 0;
  box-sizing: border-box;
  border-style: solid;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  text-align: center;
  cursor: pointer;
}
.cer-multiselect .arrowSelect .k-i-arrow-s {
  height: 100%;
  display: inline-flex;
  align-items: center;
}
.cer-multiselect .k-multiselect.k-widget {
  overflow-y: auto;
}
.cer-multiselect .k-multiselect > .k-textbox-container + .arrowSelect.arrowSelect-validationErr {
  border-width: thin;
  border-bottom-color: #E4001E;
  border-right-color: #E4001E;
  border-top-color: #E4001E;
}
.cer-multiselect .k-multiselect .k-multiselect-wrap {
  border-width: 0;
  box-shadow: none;
}
.cer-multiselect .k-multiselect > .k-textbox-container + .arrowSelect {
  margin-top: 1.5rem;
}
.cer-multiselect .k-multiselect .k-textbox-container {
  width: 100%;
}
.cer-multiselect .k-multiselect .k-textbox-container > .k-label {
  font-weight: normal;
  font-size: 1.4rem;
  color: #696969;
  font-family: inherit;
}
.cer-multiselect .validationIconContainer {
  width: 2.12rem;
}
.cer-multiselect .validationErrorIcon {
  position: absolute;
  right: 0.5rem;
  height: 100%;
  display: inline-flex;
  max-height: 3rem;
}
.cer-multiselect .validationErrorIcon div {
  display: inline-flex;
  align-items: center;
}
.cer-multiselect .validationErrorIcon i[role=img].dfI_G11_Exclamation {
  color: #E4001E;
  font-size: 1.4rem;
  display: inline-flex;
}

/**
 * Need a global style for the combo box in order to be able
 * to set specific items (ie: search text highlighting)
 */
.cer-multiselect-popup-kendo {
  margin-top: 0.5rem;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  z-index: 10003;
  background-color: #FFFFFF;
}
.cer-multiselect-popup-kendo .k-popup {
  max-height: 350px;
  background-color: #FFFFFF;
}
.cer-multiselect-popup-kendo .k-popup > div > div {
  max-height: 350px;
}
.cer-multiselect-popup-kendo .k-popup > div > div > div {
  max-height: 350px;
}
.cer-multiselect-popup-kendo .k-list > .k-item > span {
  background-color: transparent;
}
.cer-multiselect-popup-kendo ul.k-list li.k-item .k-checkbox,
.cer-multiselect-popup-kendo .multi-select-header span.k-state-default input.k-checkbox {
  margin-right: 0.5rem;
}
.cer-multiselect-popup-kendo .multi-select-header {
  padding: 0.4rem 0.8rem;
  cursor: pointer;
}
.cer-multiselect-popup-kendo .k-list > .k-state-selected {
  background-color: #E3F2FF;
  font-weight: 600;
  box-shadow: none;
  color: #000000;
}
.cer-multiselect-popup-kendo .k-list > .k-state-selected:hover {
  background-color: #badfff;
  color: #000000;
}
.cer-multiselect-popup-kendo:hover {
  background-color: rgba(0, 0, 0, 0.05);
}

.cer-multiselect-tooltip-popup-kendo {
  z-index: 10003;
}
.cer-multiselect-tooltip-popup-kendo div.k-tooltip {
  background-color: #E4001E;
  max-width: 350px;
}
.cer-multiselect-tooltip-popup-kendo div.k-callout.k-callout-w,
.cer-multiselect-tooltip-popup-kendo div.k-callout.k-callout-e {
  color: #E4001E;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-feature-menu-container {
  height: 100%;
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
}

.cer-feature-container {
  flex: 1;
  height: 100%;
  overflow: auto;
}
.cer-feature-container .content-container {
  height: 100%;
}

.cer-feature-menu {
  padding: 0 1rem 0 0;
  display: flex;
  flex-flow: row;
  border-bottom: 1px solid #d9d9d9;
  border-top: 1px solid #d9d9d9;
}
.cer-feature-menu > div {
  overflow: hidden;
}
.cer-feature-menu .k-menu {
  flex-wrap: nowrap;
}
.cer-feature-menu .k-menu-item {
  padding: 0.2rem 1rem;
}
.cer-feature-menu > * {
  background-color: #FFFFFF;
}
.cer-feature-menu > * li.k-item.selected {
  border-bottom: 2px solid #1E52BF;
}

.cer-feature-menu-group {
  flex-grow: 1;
}

.cer-feature-menu-template-section {
  border-left: 1px solid #d9d9d9;
  flex-flow: row;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 20%;
}

.cer-feature-menu-item:focus {
  outline: 2px solid #0087fd;
}
.cer-feature-menu-item:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
.cer-feature-menu-item .k-link {
  font-size: 1.6rem;
  color: #000000;
}
.cer-feature-menu-item .k-icon {
  color: #696969;
}

.k-group .cer-feature-menu-item {
  border: 2px solid transparent;
}
.k-group .cer-feature-menu-item:focus {
  border: 2px solid #0087fd;
  outline: none;
}
.k-group .cer-feature-menu-item.selected {
  background-color: #E3F2FF;
}
.k-group .cer-feature-menu-item.selected:hover {
  background-color: #badfff;
}
.k-group .cer-feature-menu-item > .k-link.k-state-active {
  color: #000000;
  background-color: rgba(0, 0, 0, 0.05);
}

.k-animation-container {
  z-index: 10003;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
/**
    * Copyright (c) Tiny Technologies, Inc. All rights reserved.
    * Licensed under the LGPL or a commercial license.
    * For LGPL see License.txt in the project root for license information.
    * For commercial licenses see https://www.tiny.cloud/
*/
.cer-displayContainer {
  margin: 2rem 1.5rem;
  font-size: 10pt;
  font-family: "Arial", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  line-height: 1.4;
  /* Apply a default padding if legacy cellpadding attribute is missing */
}
.cer-displayContainer caption, .cer-displayContainer th {
  text-align: center;
}
.cer-displayContainer h1, .cer-displayContainer h2, .cer-displayContainer h3 {
  font-weight: bold;
  line-height: 1.4;
}
.cer-displayContainer h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
.cer-displayContainer h2 {
  font-size: 1.5em;
  margin: 0.83em 0;
}
.cer-displayContainer h3 {
  font-size: 1.17em;
}
.cer-displayContainer h3, .cer-displayContainer p {
  margin: 1em 0;
}
.cer-displayContainer table {
  border-collapse: collapse;
}
.cer-displayContainer table:not([cellpadding]) th, .cer-displayContainer table:not([cellpadding]) td {
  padding: 0.4rem;
}
.cer-displayContainer table[border]:not([border="0"]) {
  /* Set default table styles if a table has a positive border attribute and no inline css */
  /* Set default table styles if a table has a positive border attribute and no inline css */
  /* Set default table styles if a table has a positive border attribute and no inline css */
}
.cer-displayContainer table[border]:not([border="0"]):not([style*=border-width]) th, .cer-displayContainer table[border]:not([border="0"]):not([style*=border-width]) td {
  border-width: 1px;
}
.cer-displayContainer table[border]:not([border="0"]):not([style*=border-style]) th, .cer-displayContainer table[border]:not([border="0"]):not([style*=border-style]) td {
  border-style: solid;
}
.cer-displayContainer table[border]:not([border="0"]):not([style*=border-color]) th, .cer-displayContainer table[border]:not([border="0"]):not([style*=border-color]) td {
  border-color: #ccc;
}
.cer-displayContainer figure {
  display: table;
  margin: 1rem auto;
}
.cer-displayContainer figure figcaption {
  color: #999;
  display: block;
  margin-top: 0.25rem;
  text-align: center;
}
.cer-displayContainer hr {
  border-color: #ccc;
  border-style: solid;
  border-width: 1px 0 0 0;
}
.cer-displayContainer code {
  background-color: #e8e8e8;
  border-radius: 3px;
  padding: 0.1rem 0.2rem;
}
.cer-displayContainer:not([dir=rtl]) blockquote {
  border-left: 2px solid #ccc;
  margin-left: 1.5rem;
  padding-left: 1rem;
}
.cer-displayContainer[dir=rtl] blockquote {
  border-right: 2px solid #ccc;
  margin-right: 1.5rem;
  padding-right: 1rem;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-datamask {
  position: relative;
  min-height: 2.4rem;
  min-width: 6rem;
}
.cer-datamask.read-only {
  display: flex;
  border: 0;
}
.cer-datamask .read-only-span {
  width: auto;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding: 0.5rem 0.5rem 0.5rem 0;
  max-width: calc(100% - 2.4rem);
  height: 100%;
  font-size: inherit;
  font-family: inherit;
  line-height: 1.4rem;
  border: 2px solid;
  border-color: transparent;
  color: #000000;
}
.cer-datamask .icon-select {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 2.4rem;
  background-color: transparent;
  border: none;
}
.cer-datamask .icon-select:hover {
  cursor: pointer;
  background-color: transparent;
}
.cer-datamask .icon-select:disabled {
  cursor: not-allowed;
  background-color: transparent;
}
.cer-datamask .icon-select:disabled .icon-eye {
  color: #8f8f8f;
}
.cer-datamask .icon-select.date {
  right: 2.5rem;
}
.cer-datamask .icon-select.read-only {
  position: relative;
  height: auto;
  right: 0;
}
.cer-datamask .icon-select .icon-eye {
  font-size: 1.6rem;
  position: absolute;
  top: 0;
  right: 0.4rem;
  color: #696969;
  height: 100%;
  display: inline-flex;
  align-items: center;
}
.cer-datamask .icon-select .icon-eye.read-only {
  position: relative;
  right: 0.2rem;
}
.cer-datamask .icon-calendar-select {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 2.4rem;
  background-color: transparent;
  border: none;
  outline: 0;
}
.cer-datamask .icon-calendar-select:hover {
  cursor: pointer;
}
.cer-datamask .icon-calendar-select:disabled {
  cursor: not-allowed;
}
.cer-datamask .icon-calendar-select:disabled .icon-calendar {
  color: #8f8f8f;
}
.cer-datamask .icon-calendar-select .icon-calendar {
  font-size: 1.4rem;
  font-family: "Open Sans", sans-serif;
  position: absolute;
  top: 0;
  right: 0.6rem;
  color: #696969;
  height: 100%;
  display: inline-flex;
  align-items: center;
}
.cer-datamask .state-focused {
  outline: 0.2rem solid #0087fd;
  outline-offset: -0.25rem;
  border-radius: 0.25rem;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-loading-mask-container {
  height: 100%;
  width: 100%;
  margin: 0 auto;
  position: relative;
  display: inherit;
  flex-direction: inherit;
  overflow: auto;
}

.cer-loading-mask-color-layer {
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #FFFFFF;
  opacity: 0.6;
}

.cer-loading-mask-box {
  z-index: 2;
  width: 85%;
  max-width: 35rem;
  height: 60px;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1490196078);
  border-radius: 3px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: rgb(255, 255, 255);
}

.cer-loading-mask-text {
  color: #000000;
  margin-left: 25px;
  margin-bottom: 12px;
  font-family: "arial";
  font-size: 1.2rem;
  line-height: 1.2rem;
}

.cer-loading-mask-bar {
  width: 85%;
  height: 11px;
  margin: 0 auto;
  top: 50%;
  transform: translateY(-50%);
  background-image: repeating-linear-gradient(45deg, #3898ff, #3898ff 11px, #90e4ff 10px, #90e4ff 20px);
  background-size: 28px 28px;
  animation: move 0.5s linear infinite;
}
@keyframes move {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 28px 0;
  }
}

/**
* CSS styling for fixing iPad drop-down overlay issue
* Bug 933370: [TinyMCE] iPad only:Scroll down:drop down values are not visible fully
*/
.cer-rte-floating-panel.tox.tox-tinymce-aux {
  /**
  * In mobile view for dialogs, setting opacity to .75 when --opaque class is present
  * Bug 931692: [RTE] Mobile only: Blank background within Platform Showcase when the "Insert/Edit Link" popup is displayed
  */
}
.cer-rte-floating-panel.tox.tox-tinymce-aux > div:not(.tox-dialog-wrap) {
  transform: translatez(0);
}
.cer-rte-floating-panel.tox.tox-tinymce-aux div.tox-dialog-wrap + div {
  transform: unset;
}
.cer-rte-floating-panel.tox.tox-tinymce-aux .tox-dialog-wrap__backdrop--opaque {
  background-color: rgba(255, 255, 255, 0.75);
}

/**
* Issue 966338: [TinyRTE][Safari] Tool and original text is not display when full screen is selected.
* Reproducible in Safari <= 13.1
* Transform style added to make sure RTE full screen view is properly visible
*/
.tox-fullscreen {
  transform: rotateZ(0deg);
}

.tox.tox-tinymce.tox-fullscreen {
  top: 5.7rem !important;
  height: calc(100% - 5.7rem) !important;
}

@keyframes shimmer {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(100%);
  }
}
.cer-shimmer {
  overflow: hidden;
  position: relative;
  background-color: #e8e8e8;
}
.cer-shimmer:before {
  content: "";
  position: absolute;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0) 100%);
  height: 100%;
  width: 100%;
  z-index: 1;
  animation: shimmer 1s infinite;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-imageupload .cer-form-inline .cer-form-group {
  display: inline-block;
  margin-bottom: 0;
  vertical-align: middle;
}
.cer-imageupload .cer-form-inline .cer-input-group {
  display: inline-table;
  vertical-align: middle;
  position: relative;
}
.cer-imageupload .cer-form-inline .cer-input-group .cer-input-group-btn,
.cer-imageupload .cer-form-inline .cer-input-group .cer-form-control {
  width: auto;
}
.cer-imageupload .cer-form-inline .cer-input-group .cer-form-control {
  display: table-cell;
  width: 100%;
}
.cer-imageupload .cer-input-group-btn {
  display: table-cell;
  vertical-align: middle;
}
.cer-imageupload .cer-input-group-btn > .btn-primary {
  margin-left: -1px;
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  touch-action: manipulation;
  cursor: pointer;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
}
.cer-imageupload .cer-input-group-btn > .btn-primary:hover {
  color: #fff;
  background-color: #286090;
  border-color: #204d74;
}
.cer-imageupload .cer-form-inline .btn-default {
  margin-left: 1px;
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  touch-action: manipulation;
  cursor: pointer;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
}
.cer-imageupload .cer-form-inline .btn-default:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.cer-imageupload .cer-form-inline .btn-default {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}
.cer-imageupload .cer-form-inline .btn-default:focus,
.cer-imageupload .cer-form-inline .btn-default.focus {
  color: #333;
  background-color: #e6e6e6;
  border-color: #8c8c8c;
}
.cer-imageupload .cer-form-inline .btn-default:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.cer-imageupload .cer-form-inline .btn-default:active,
.cer-imageupload .cer-form-inline .btn-default.active {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.cer-imageupload .cer-form-inline .btn-default:active:hover,
.cer-imageupload .cer-form-inline .btn-default.active:hover,
.cer-imageupload .cer-form-inline .btn-default:active.focus,
.cer-imageupload .cer-form-inline .btn-default.active.focus {
  color: #333;
  background-color: #d4d4d4;
  border-color: #8c8c8c;
}
.cer-imageupload .cer-form-inline .btn-default:active,
.cer-imageupload .cer-form-inline .btn-default.active {
  background-image: none;
}
.cer-imageupload .cer-form-inline .btn-default.disabled:hover,
.cer-imageupload .cer-form-inline .btn-default[disabled]:hover,
.cer-imageupload fieldset[disabled] .cer-form-inline .btn-default:hover,
.cer-imageupload .cer-form-inline .btn-default.disabled:focus,
.cer-imageupload .cer-form-inline .btn-default[disabled]:focus,
.cer-imageupload fieldset[disabled] .cer-form-inline .btn-default:focus,
.cer-imageupload .cer-form-inline .btn-default.disabled.focus,
.cer-imageupload .cer-form-inline .btn-default[disabled].focus,
.cer-imageupload fieldset[disabled] .cer-form-inline .btn-default.focus {
  background-color: #fff;
  border-color: #ccc;
}
.cer-imageupload .cer-form-inline .btn-default .badge {
  color: #fff;
  background-color: #333;
}
.cer-imageupload .cer-input-group .cer-form-control:first-child,
.cer-imageupload .cer-input-group-btn:first-child > .btn,
.cer-imageupload .cer-input-group-btn:first-child > .btn-group > .btn,
.cer-imageupload .cer-input-group-btn:first-child > .dropdown-toggle,
.cer-imageupload .cer-input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle),
.cer-imageupload .cer-input-group-btn:last-child > .btn-group:not(:last-child) > .btn {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.cer-imageupload .cer-input-group-btn:last-child > .btn,
.cer-imageupload .cer-input-group-btn:last-child > .btn-group > .btn,
.cer-imageupload .cer-input-group-btn:last-child > .dropdown-toggle,
.cer-imageupload .cer-input-group-btn:first-child > .btn:not(:first-child),
.cer-imageupload .cer-input-group-btn:first-child > .btn-group:not(:first-child) > .btn {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.cer-imageupload .cer-form-control {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.cer-imageupload .cer-form-control:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}
.cer-imageupload .cer-form-control::-moz-placeholder {
  color: #999;
  opacity: 1;
}
.cer-imageupload .cer-form-control:-ms-input-placeholder {
  color: #999;
}
.cer-imageupload .cer-form-control::-webkit-input-placeholder {
  color: #999;
}
.cer-imageupload .cer-form-control::-ms-expand {
  background-color: transparent;
  border: 0;
}
.cer-imageupload .cer-form-control[disabled],
.cer-imageupload .cer-form-control[readonly],
.cer-imageupload fieldset[disabled] .cer-form-control {
  background-color: #eee;
  opacity: 1;
}
.cer-imageupload .cer-form-control[disabled],
.cer-imageupload fieldset[disabled] .cer-form-control {
  cursor: not-allowed;
}
.cer-imageupload textarea.cer-form-control {
  height: auto;
}
.cer-imageupload .cer-form-inline .btn-default.disabled,
.cer-imageupload .cer-form-inline .btn-default[disabled],
.cer-imageupload .cer-form-inline fieldset[disabled] .btn-default {
  cursor: not-allowed;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
  box-shadow: none;
  opacity: 0.65;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.dfToolbar {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 0.3rem 0.5rem 0.3rem 0.8rem;
  background: transparent;
  background-repeat: repeat-x;
  zoom: 1;
  flex: 0 0 auto;
  align-items: center;
}
.dfToolbar.top {
  border-top: 1px solid #D9D9D9;
}
.dfToolbar.bottom {
  border-bottom: 1px solid #D9D9D9;
}

.dfToolbarDivider {
  border: 0.5px solid #D9D9D9;
  height: 1.6rem;
  margin: 0.5rem;
}
.dfToolbarDivider:focus {
  outline: none;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-search-input {
  position: relative;
  font-family: Arial, "Open Sans", sans-serif;
  font-size: 1.4rem;
  font-weight: regular;
  color: #1C1C1E;
  line-height: 1.7rem;
  background: #FFFFFF;
  min-width: 45rem;
}
.cer-search-input .cer-search-input-icon-container {
  position: absolute;
  left: 0.8rem;
  top: 0.6rem;
  width: 2.4rem;
  height: 2.4rem;
}
.cer-search-input .cer-search-input-icon-container .search-icon {
  position: absolute;
  font-size: 1.6rem;
  display: inline-flex;
  align-items: center;
  left: 0.4rem;
  top: 0.4rem;
  color: #696969;
}
.cer-search-input .clear-icon-button {
  width: 2.4rem;
  height: 2.4rem;
}
.cer-search-input .clear-icon-button .clear-icon {
  position: absolute;
  font-size: 1.6rem;
  color: #696969;
}
.cer-search-input .clear-icon-button:hover, .cer-search-input .clear-icon-button:focus {
  background: rgba(28, 28, 30, 0.08);
}
.cer-search-input .cer-input {
  width: 100%;
}
.cer-search-input .cer-input > input {
  border: none;
  height: 3.6rem;
  padding: 0 0.8rem 0 4rem;
}
.cer-search-input .cer-overlay {
  padding: 0.8rem 0;
  box-shadow: 0 1px 20px 0 rgba(0, 0, 0, 0.0588235294);
  margin-top: 0.4rem;
}
.cer-search-input .cer-overlay .cer-search-input-more-container {
  margin-top: 0.8rem;
  background-color: #FFFFFF;
  height: 3.2rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.cer-search-input .cer-overlay .cer-search-input-more-text-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 3.2rem;
  width: 11.8rem;
}
.cer-search-input .cer-overlay .cer-search-input-more-text-container > a {
  position: absolute;
  cursor: pointer;
  color: #1A6DE0;
  text-decoration: none;
}
.cer-search-input .cer-overlay .cer-search-input-more-text-container:focus-visible {
  outline: none;
  background-color: rgba(28, 28, 30, 0.04);
}
.cer-search-input .inner-search-input-container {
  display: flex;
  border: 1px solid rgba(28, 28, 30, 0.4);
  border-radius: 0.4rem;
  background-color: white;
  box-sizing: border-box;
}
.cer-search-input .inner-search-input-container.inner-search-input-focus {
  border-color: rgba(28, 28, 30, 0.6);
}
.cer-search-input .cer-search-input-end-container {
  display: flex;
  justify-content: center;
  align-items: center;
}
.cer-search-input .cer-search-input-end-container > div {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-left: 0.5rem;
}
.cer-search-input .cer-search-input-end-container .search-input-select {
  height: 100%;
  width: fit-content;
  max-width: 100px;
  border-left: 1px solid rgba(28, 28, 30, 0.4);
}
.cer-search-input .cer-search-input-end-container .search-input-select .search-select-icon {
  font-size: 1.6rem;
  color: #696969;
  width: initial;
  height: initial;
  font-family: inherit;
}
.cer-search-input .cer-search-input-end-container .search-input-select.k-dropdown .k-dropdown-wrap .k-input {
  height: 100%;
}

.search-select-popup {
  min-width: 100px;
}

#focus-ring-search-select {
  align-items: normal;
}

.search-input-select.k-dropdown .k-dropdown-wrap {
  color: #49494B;
  border: none;
  border-radius: 0.4rem;
  border-top-left-radius: unset;
  border-bottom-left-radius: unset;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-sidebar {
  border: 1px solid #dddddd;
  border-right: 0;
  border-bottom: 0;
  position: relative;
  display: flex;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.cer-sidebar .cer-sidebar-wrapper {
  display: flex;
  flex-direction: column;
  position: relative;
}
.cer-sidebar .cer-sidebar-wrapper .cer-sidebar-search {
  position: relative;
  width: 100%;
  padding: 0.8rem 1rem;
  border-right: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
  background-color: #f8f8f8;
  box-sizing: border-box;
}
.cer-sidebar .cer-sidebar-wrapper .cer-sidebar-search > .cer-search-input {
  min-width: 20rem;
  width: 100%;
}
.cer-sidebar .k-drawer-container {
  border-right: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
  overflow-x: hidden;
  overflow-y: auto;
}
.cer-sidebar .k-drawer, .cer-sidebar .k-drawer.k-drawer-start {
  border-right: 0;
  background-color: #f8f8f8;
}
.cer-sidebar .k-drawer-items .k-drawer-item {
  padding: 0.8rem 1rem;
  border-bottom: 1px solid #dddddd;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.cer-sidebar .k-drawer-items .k-drawer-item.cer-sidebar-item {
  padding-left: 0;
}
.cer-sidebar .k-drawer-items .k-drawer-item > .k-icon {
  margin: auto 0;
  color: #1E52BF;
}
.cer-sidebar .k-drawer-items .k-drawer-item > .k-icon.cer-sidebar-item-expander {
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 0.9rem;
  line-height: 1.5;
  width: 2.8rem;
  padding: 0 0 0 1rem;
}
.cer-sidebar .k-drawer-items .k-drawer-item > .k-icon.cer-sidebar-item-expander > .cer-sidebar-item-expander-collapsed {
  display: inline-block;
  transform: rotate(-90deg);
}
.cer-sidebar .k-drawer-items .k-drawer-item > .k-item-text {
  padding: 0;
  font-size: 1.4rem;
  color: #000000;
  width: 100%;
}
.cer-sidebar .k-drawer-items .k-drawer-item > .k-item-text .description {
  color: #696969;
}
.cer-sidebar .k-drawer-items .k-drawer-item > .k-item-text .cer-search-highlight {
  background-color: #FFCB24;
}
.cer-sidebar .k-drawer-items .k-drawer-item:focus, .cer-sidebar .k-drawer-items .k-drawer-item.k-state-focused {
  background-color: inherit;
  box-shadow: none;
}
.cer-sidebar .k-drawer-items .k-drawer-item.sub-item > .k-item-text {
  color: #1E52BF;
}
.cer-sidebar .k-drawer-items .k-drawer-item.k-state-selected {
  background-color: #e2efff;
}
.cer-sidebar .k-drawer-items .k-drawer-item.k-state-selected > .k-item-text {
  font-weight: bold;
}

.cer-sidebar-item-indent {
  padding-left: 1.8rem;
}

.cer-sidebar-toggle-container {
  position: relative;
  height: 4rem;
}

.cer-sidebar-toggle {
  width: 1rem;
  height: 4rem;
  background-color: #1E52BF;
  border-radius: 0 0.2rem 0.2rem 0;
  z-index: 1;
  position: absolute;
  color: #FFFFFF;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.cer-sidebar-toggle:hover {
  padding-left: 0.3rem;
  width: 1.5rem;
  cursor: pointer;
  background-color: #174199;
}
.cer-sidebar-toggle:active {
  background-color: #0C2F78;
}
.cer-sidebar-toggle.cer-sidebar-toggle-collapsed {
  padding-left: 0.3rem;
  width: 1.5rem;
}
.cer-sidebar-toggle > .k-icon {
  padding: 1.2rem 0 1.2rem 0;
  margin-left: -0.3rem;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.cer-list-component {
  overflow: auto;
}
.cer-list-component > ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.cer-list-component > ul > li {
  margin: 0.4rem 0;
  outline: none;
}
.cer-list-component > ul > li:hover {
  background-color: rgba(28, 28, 30, 0.04);
}
.cer-list-component > ul > li:focus-visible {
  outline: none;
}
.cer-list-component > ul > li.list-focused {
  background-color: rgba(28, 28, 30, 0.04);
  outline: solid 0.2rem #0087fd;
  outline-offset: -0.3rem;
  border-radius: 0.3rem;
}

.cer-overlay {
  position: absolute;
  background-color: white;
}
.cer-overlay.outline {
  outline: 1px solid black;
}
.cer-overlay--top {
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
}
.cer-overlay--right {
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
}
.cer-overlay--bottom {
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}
.cer-overlay--left {
  right: 100%;
  top: 50%;
  transform: translateY(-50%);
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.overlay-container {
  position: fixed;
  top: 5rem;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 935;
  background-color: #FFFFFF;
  display: flex;
  flex-flow: column;
}
.overlay-container > .overlay-inner-container {
  margin: 1rem;
}
.overlay-container > .overlay-inner-container > .overlay-titlebar {
  background: #f8f8f8;
  height: 3rem;
  display: flex;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #8f8f8f;
}
.overlay-container > .overlay-inner-container > .overlay-titlebar > .overlay-title {
  font-family: Arial;
  font-style: normal;
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 1.4rem;
}
.overlay-container > .overlay-inner-container > .overlay-content {
  flex: 1;
  overflow-y: auto;
}

/* tokens-v.0.12.json */
/**
 *  @tokens UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Chart Colors
 *  @presenter Color
 */
/**
 *  @tokens Swatch Colors
 *  @presenter Color
 */
/**
 *  @tokens TeamRelate Colors
 *  @presenter Color
 */
/**
 *  @tokens Interactive UI Colors
 *  @presenter Color
 */
/**
 *  @tokens Font Size
 *  @presenter FontSize
 */
/**
 *  @tokens Line Height
 *  @presenter LineHeight
 */
/**
 *  @tokens Borders
 *  @presenter Border
 */
/**
 *  @tokens Radius
 *  @presenter BorderRadius
 */
/**
 *  @tokens Spacing
 *  @presenter Spacing
 */
.k-popup {
  font-size: 12px;
}

/*# sourceMappingURL=all.css.map */